@extends('layouts.admin')
@section('title', 'Services - ' . getRadioUsers()->name)
@section('content')
    <div class="row g-4 mb-4">
        <div class="p-5 bg-linear-gradient mt-0">
            <div class="container-fluid text-white text-center">
                <div class="row justify-content-center">
                    <div class="col-md-10">
                        <h2 class="fw-bold mb-4" style="font-size: clamp(1.1rem, 2.5vw + 0.7rem, 2.1875rem);">Services</h2>
                    </div>
                </div>
            </div>
        </div>


        <div class="mt-3 px-4 rounded-4">
            <div class="card border-0 rounded-4 shadow-sm info-card h-100">
                <div class="card-header rounded-top-4 bg-white">
                    <h5 class="card-title mb-0"><i class="fas fa-chart-line me-2 text-gradient"></i>Statistiques</h5>
                </div>
                <div class="card-body">
                    <div class="row">
                        <!-- Nombre total de requêtes de service -->
                        <div class="col-md-3 text-center mb-3">
                            <div class="p-3 bg-light rounded">
                                <h3 class="mb-0">
                                    {{ $radio->new_services()->withCount('requetes_service')->get()->sum('requetes_service_count') }}
                                </h3>
                                <small class="text-muted">Demandes de service</small>
                            </div>
                        </div>

                        <div class="col-md-3 text-center mb-3">
                            <div class="p-3 bg-light rounded">
                                <h3 class="mb-0">
                                    {{ $radio->new_services()
                                            ->withCount(['requetes_service as approved_requetes_count' => fn($q) => $q->where('transaction_status', 'approved')])
                                            ->get()
                                            ->sum('approved_requetes_count') }}
                                </h3>
                                <small class="text-muted">Demandes de service approvées</small>
                            </div>
                        </div>
                        <!-- Services payés -->
                        <div class="col-md-3 text-center mb-3">
                            <div class="p-3 bg-light rounded">
                                <h3 class="mb-0">
                                {{ number_format($num = $radio->balance, 0, '', $thousands_separator = ' ') }} FCFA
                                </h3>
                                <small class="text-muted">Balance</small>
                            </div>
                        </div>

                        <!-- Chiffre généré -->
                        <div class="col-md-3 text-center mb-3">
                            <div class="p-3 bg-light rounded">
                                <h3 class="mb-0">
                                    @php
                                        $totalAmount = $radio->new_services()
                                            ->with(['requetes_service' => fn($q) => $q->where('transaction_status', 'approved')])
                                            ->get()
                                            ->sum(fn($service) => $service->requetes_service->sum('radio_amount'));
                                    @endphp
                                    {{ number_format($num = $totalAmount, 0, '', $thousands_separator = ' ') }} FCFA
                                </h3>
                                <small class="text-muted">Total généré</small>
                            </div>
                        </div>

                        <!-- Barre de progression -->
                        <div class="col-12 mt-2">
                            @php
                                $services = $radio->new_services()
                                    ->withCount([
                                        'requetes_service',
                                        'requetes_service as approved_requetes_count' => fn($q) => $q->where('transaction_status', 'approved')
                                    ])
                                    ->get();

                                $totalRequetes = $services->sum('requetes_service_count');
                                $approvedRequetes = $services->sum('approved_requetes_count');
                                $percentage = $totalRequetes > 0 ? ($approvedRequetes / $totalRequetes) * 100 : 0;
                            @endphp

                            <div class="progress" style="height: 10px;">
                                <div class="progress-bar bg-success" role="progressbar" style="width: {{ $percentage }}%"
                                    aria-valuenow="{{ $percentage }}" aria-valuemin="0" aria-valuemax="100"></div>
                            </div>

                            <small class="text-muted">{{ round($percentage) }}% de demandes finalisées</small>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="card-custom px-4">
            <div class="bg-white rounded-4 shadow-sm p-4">
                <div class="header-section">
                    <div
                        class="d-flex flex-column flex-md-row justify-content-between align-items-stretch align-items-md-center mb-4">
                        <a class="btn gradient-btn mb-3 mb-md-0" href="{{ route('new_services.create') }}">
                            Créer un service
                        </a>
                    </div>
                </div>


                @if (count($new_services) > 0)
                    <div class="">
                        <table class="table table-bordered table-striped align-middle w-100" id="datatable-buttons">
                            <thead class="table-white">
                                <tr>
                                    <th>#</th>
                                    <th>Image</th>
                                    <th>Nom</th>
                                    <th>Tarification</th>
                                    <th>Nombre de demande</th>
                                    <th>Action</th>
                                </tr>
                            </thead>
                            <tbody>
                                @foreach ($new_services as $key => $new_service)
                                    <tr>
                                        <td> {{ $key + 1 }} </td>
                                        <td>
                                            <img src="{{ asset('media/' . $new_service->image) }}" style="width: 100px"
                                                alt="{{ $new_service->name }}">
                                        </td>
                                        <td title="{{ $new_service->name }}">
                                            {{ $new_service->name }}
                                        </td>

                                        @php
                                            $pricings = $new_service->pricings;
                                        @endphp
                                        <td>
                                            <ul>
                                                @foreach ($pricings as $pricing)
                                                    <li>
                                                        {{ $pricing->time_slot . ' : ' . $pricing->price . ' FCFA'  }}
                                                    </li>
                                                @endforeach
                                            </ul>
                                        </td>
                                        <td>
                                            <a href="{{ route('requetes_new_services.show', $new_service->id) }}"
                                                class="dropdown-item ">
                                                {{ $new_service->requetes_service->count() }}
                                            </a>
                                        </td>
                                        <td class="action-col" style="z-index: 9999 !important;">
                                            <div class="dropdown">
                                                <button class="btn p-0 border-0 bg-transparent" type="button"
                                                    id="dropdownMenu{{ $key }}" data-bs-toggle="dropdown" aria-expanded="false">
                                                    <i class="bi bi-three-dots-vertical fs-5"></i>
                                                </button>
                                                <ul class="dropdown-menu" aria-labelledby="dropdownMenu{{ $key }}">
                                                    <li>
                                                        <a href="{{ route('requetes_new_services.show', $new_service->id) }}"
                                                            class="dropdown-item ">
                                                            Voir les demandes
                                                        </a>
                                                    </li>
                                                    <li>
                                                        <a href="{{ route('new_services.edit', $new_service->id) }}"
                                                            class="dropdown-item ">
                                                            Modifier
                                                        </a>
                                                    </li>

                                                    <li>
                                                        <a href="javascript:void(0);" type="button" data-bs-toggle="modal"
                                                            data-bs-target="#delete_modal{{ $new_service->id }}"
                                                            class="dropdown-item text-danger ms_share_music">
                                                            Supprimer
                                                        </a>
                                                    </li>
                                                </ul>
                                            </div>
                                        </td>
                                    </tr>

                                    <div class="modal fade" id="delete_modal{{ $new_service->id }}" data-bs-backdrop="static"
                                        data-bs-keyboard="false" tabindex="-1" aria-labelledby="deleteLabel{{ $new_service->id }}"
                                        aria-hidden="true">
                                        <div class="modal-dialog">
                                            <div class="modal-content shadow rounded-4">
                                                <form id="delete-{{ $new_service->id }}" method="POST"
                                                    action="{{ route('new_services.destroy', $new_service->id) }}">
                                                    @csrf
                                                    @method('DELETE')
                                                    <input type="hidden" name="new_services_id" value="{{ $new_service->id }}">

                                                    <div class="modal-header bg-light rounded-top-4 px-4 py-3">
                                                        <h5 class="modal-title mx-auto" id="deleteLabel{{ $new_service->id }}">
                                                            Suppression de service
                                                        </h5>
                                                        <button type="button" class="btn-close" data-bs-dismiss="modal"
                                                            aria-label="Fermer"></button>
                                                    </div>

                                                    <div class="modal-body text-center">
                                                        <p class="mb-0 fw-semibold">
                                                            Voulez-vous vraiment supprimer le service suivant ?
                                                        </p>
                                                        <p class="text-danger mt-2">
                                                            <strong>« {{ $new_service->name }} »</strong>
                                                        </p>
                                                    </div>

                                                    <div
                                                        class="modal-footer bg-light rounded-bottom-4 d-flex justify-content-between px-4 py-3">
                                                        <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">
                                                            Annuler
                                                        </button>
                                                        <button type="button" class="btn btn-danger"
                                                            onclick="submit(this, 'delete-{{ $new_service->id }}')">
                                                            Supprimer
                                                        </button>
                                                    </div>
                                                </form>
                                            </div>
                                        </div>
                                    </div>
                                @endforeach
                            </tbody>
                        </table>

                    </div>
                @else
                    <div class="main-content-card">
                        <div>
                            <img src="{{ asset('assets/images/not-content.svg') }}" alt="aucun" />
                        </div>
                        <div>
                            <p class="h5">Pas de service</p>
                        </div>
                    </div>
                @endif
            </div>
        </div>

        <div class="mt-3 px-4 rounded-4">
        <div class="row">
            <div class="col-12">
                <div class="card border-0 shadow-sm">
                    <div class="card-header bg-white d-flex justify-content-between align-items-center">
                        <div>
                        <h5 class="card-title mb-0"><i class="fas fa-list-alt me-2 text-gradient"></i>Reversements</h5>
                        </div>
                      
                 

                    </div>
                    <div class="card-body">
                        <div class="">
                            <table id="payoutsTable" class="table table-bordered table-striped align-middle  w-100">
                                <thead class="table-light">
                                    <tr>
                                        <th>Montant</th>
                                        <th>Status</th>
                                        <th>Numero Paiement</th>
                                        <th>ID Paiement</th>
                                        <th>Date</th>
                                        <th>Actions</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($radio->payouts as $payout)
                                        @if($payout->status=="sent")
                                            <tr>
                                                <td>{{ $payout->amount }}</td>
                                                <td>
                                                    @if($payout->status == 'sent')
                                                        <span class="badge text-bg-success"><i class="fas fa-check-circle me-1"></i> Envoyé</span>
                                                    @elseif($payout->status == 'pending')
                                                        <span class="badge text-bg-pending"><i class="fas fa-clock me-1"></i> En attente</span>
                                                    @else
                                                        <span class="badge text-bg-error"><i class="fas fa-times-circle me-1"></i> Échoué</span>
                                                    @endif
                                                </td>
                                                <td>{{ $payout->payout_number }}</td>
                                               <td>{{ $payout->external_id }}</td>
                                               <td>{{ \Carbon\Carbon::parse($payout->created_at)->locale('fr')->translatedFormat('l d F Y') }}</td>
                                           
                                                <td>
                                                    <div class="btn-group" role="group">
                                                        <button class="btn btn-sm btn-outline-primary view-details" 
                                                                data-bs-toggle="modal"
                                                                title="Voir les détails"
                                                                data-bs-target="#payout-{{ $payout->id }}"
                                                                id="payout-{{ $payout->id }}"
                                                                type="button"

                                                                >
                                                            <i class="bi bi-eye-fill"></i>
                                                        </button>
                                                    </div>
                                                </td>
                                            </tr>

                                            <div class="modal fade" id="payout-{{ $payout->id }}" tabindex="-1">
                                                    <div class="modal-dialog modal-lg modal-dialog-scrollable">
                                                        <div class="modal-content">
                                                            <div class="modal-header">
                                                                <h5 class="modal-title">Informations du reversement
                                                                </h5>
                                                                <button type="button" class="btn-close"
                                                                    data-bs-dismiss="modal"></button>
                                                            </div>
                                                            <div class="modal-body">
                                                                <div class="row">
                                                                    <div class="row mb-3">
                                                                        <div class="col fw-bold"> Montant </div>
                                                                        <div class="col">{{ number_format($payout->amount, 0, ',', ' ') }} FCFA</div>
                                                                    </div>
                                                                    <div class="row mb-3">
                                                                        <div class="col fw-bold"> Transaction ID : </div>
                                                                        <div class="col">{{ $payout->external_id }}</div>
                                                                    </div>
                                                                    <div class="row mb-3">
                                                                        <div class="col fw-bold"> Statut du reversement : </div>
                                                                        <div class="col">
                                                                            @switch($payout->status)
                                                                                @case('pending')
                                                                                    <span class="badge text-bg-warning">En attente</span>
                                                                                @break

                                                                                @case('sent')
                                                                                    <span class="badge text-bg-success">Reversé</span>
                                                                                @break

                                                                                @default
                                                                                    <span class="badge text-bg-warning">En attente</span>
                                                                            @endswitch
                                                                        </div>
                                                                    </div>
                                                                    <div class="row mb-3">
                                                                        <div class="col fw-bold"> Numéro : </div>
                                                                        <div class="col">{{ $payout->payout_number }}</div>
                                                                    </div>
                                                                    <div class="row mb-3">
                                                                        <div class="col fw-bold"> Date de création : </div>
                                                                        <div class="col">{{ \Carbon\Carbon::parse($payout->created_at)->locale('fr')->translatedFormat('l d F Y') }}</div>
                                                                    </div>
                                                                </div>
                                                            </div>
                                                            <div class="modal-footer">
                                                                <button type="button" class="btn btn-secondary"
                                                                    data-bs-dismiss="modal">Fermer</button>
                                                            </div>
                                                        </div>
                                                    </div>
                                            </div>
                                        @endif
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>

        </div>
    </div>


@endsection

@section('script')

@endsection