@extends('layout.app')

@section('content')




    @php

        // $pCustomer = TopmenuService::countPendingCustomer();

        // $counter = TopmenuService::getDashboardCounter();

        // $eCustomer = TopmenuService::countExpiredCustomer();

        // $mCustomer = TopmenuService::countMonthlyCustomer();

        // $closeCustomer = TopmenuService::totalClosedCustomer();

        // //

        // $allCustomer = TopmenuService::countAllcustomer();

        // $allActiveCustomer = TopmenuService::activeCustomer();

        // $allDectiveCustomer = TopmenuService::deactivatedCustomer();
    @endphp


    @role('PendingCustomerChecker')
        <div class="col-lg-4 col-6 mb-3">
            <x-Custom.Countercard link="pendingCustomer" cardtitle="Pending Customer"
                cardcount="{{ $clientCount->where('client_approval', 'pending')->first()->total ?? 0 }}">
                <i class="fa fa-users"></i>
            </x-custom.Countercard>
        </div>
    @endrole

    {{-- Modern overview counters --}}
    @include('dashboard.new.counter')
    @include('dashboard.new.resellerCounter')

    @can('show-dashboard')
        {{-- Modern charts + online users --}}
        <div class="row g-3 mt-3">
            @include('dashboard.new.barchart')
        </div>

        {{-- Billing summary widgets / tables --}}
        <div class="row mt-4">
            @include('dashboard.billreport')

            <div class="col-sm-12 mt-3">
                <div class="card shadow-sm border-0">
                    <div class="card-header d-flex justify-content-between align-items-center">
                        <h5 class="mb-0">Reseller Information</h5>
                    </div>
                    <div class="card-body p-0">
                        <div class="table-responsive">
                            <table class="table table-hover table-striped mb-0">
                                <thead class="bg-light">
                                    <tr>
                                        <th scope="col">ID</th>
                                        <th scope="col">Name</th>
                                        <th scope="col">Balance</th>
                                        <th scope="col" class="text-center">POP</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($resellers as $r)
                                        <tr>
                                            <td class="whitespace-nowrap">
                                                {{ $r->id }}
                                            </td>
                                            <td class="whitespace-nowrap">
                                                {{ $r->name }}
                                            </td>
                                            <td class="whitespace-nowrap">
                                                {{ $r->balance[0]['amount'] ?? 0 }}
                                            </td>
                                            <td class="whitespace-nowrap p-0 m-0">
                                                <table class="table table-sm mb-0">
                                                    @foreach ($r->pops as $pop)
                                                        @if ($pop->reseller_id == $r->id)
                                                            <tr>
                                                                <td style="width: 50%">
                                                                    {{ $pop->popname }}
                                                                </td>
                                                                <td style="width: 50%">
                                                                    @if (!empty($pop->balance->first()))
                                                                        {{ $pop->balance->first()->amount }}
                                                                    @else
                                                                        0
                                                                    @endif
                                                                </td>
                                                            </tr>
                                                        @endif
                                                    @endforeach
                                                </table>
                                            </td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    @endcan

    @can('token-dashboard')
        <div class="row">
            @include('dashboard.token')

        </div>
    @endcan

    {{-- @role('Reseller Admin') --}}

    @include('dashboard.reseller')


    @include('dashboard.sub-reseller')




    </div>
    <style>
        /* Modern dashboard polish */
        .detail-area {
            border-radius: 1rem;
        }

        .card {
            border-radius: 1rem;
        }

        .card-header {
            background: linear-gradient(90deg, #0f172a, #1e293b);
            color: #f9fafb;
            border-radius: 1rem 1rem 0 0 !important;
        }

        .card-body {
            border-radius: 0 0 1rem 1rem;
        }

        table thead th {
            font-size: 0.85rem;
            letter-spacing: 0.04em;
            text-transform: uppercase;
        }

        table tbody td {
            vertical-align: middle;
        }
    </style>
@endsection