@extends('layout.app')

@push('styles')
    <style>
        /* The manager list is long, so the column headings stay put. The scrolling has to
           happen inside this box — .table-responsive scrolls at auto height, which leaves
           position:sticky nothing to pin against. The script at the bottom puts the box
           around the table only, so the length menu, the search field and the pagination
           the global DataTables initializer adds stay outside it. */
        .manager-table-scroll {
            max-height: calc(100vh - 260px);
            min-height: 400px;
            overflow: auto;
            position: relative;
            /* DataTables floats its length menu left and its search box right. A scroll
               box is a block formatting context, and one of those never sits under a
               float — without this it is squeezed into the gap between the two. */
            clear: both;
            width: 100%;
        }

        .manager-table-scroll #dataTable {
            margin-bottom: 0;
        }

        #dataTable thead th {
            position: sticky;
            top: 0;
            z-index: 10;
            /* Opaque, or the rows scrolling underneath show through the heading — and the
               same grey/white the heading already wears, since the text is white. */
            background-color: #6c757d !important;
            color: #fff !important;
            /* border-collapse hands a cell's borders to the collapsed grid, and a sticky
               cell loses them once it detaches — so they are drawn as insets. */
            box-shadow: inset 0 1px 0 #7d858c, inset 0 -1px 0 #7d858c;
        }
    </style>
@endpush

@php
    // Resolved once for the whole page. A @can costs ~1 ms (Spatie rebuilds the user's
    // permission set on each check) and checkSettings() a cache lookup — inside a loop
    // over hundreds of managers that alone was seconds of render time.
    $u = auth()->user();

    $canResellerType      = $u->canany(['reseller_type', 'specific_management_services']);
    $canRemarkView        = $u->can('manager-remark-view');
    $canUniqueCode        = $u->can('manager_unique_code');
    $canViewCommission    = $u->can('view-commission');
    $canRecharge          = $u->can('reseller-recharge');
    $canSecurityAmount    = $u->can('security-amount-entry');
    $canPackagePermission = $u->canany(['package-permission', 'specific_management_services']);
    $canEditReseller      = $u->can('reseller_edit') || $u->can('manager-accounts-edit');
    $canViewHistory       = $u->can('view-reseller-history');
    $canSmsGateway        = $u->can('reseller-sms-getway');
    $canDeleteOnline      = $u->can('delete-online-client-from-pop-manager');
    $cannotSpecificMgmt   = ! $u->can('specific_management_services');
    $isSuperAdmin         = $u->id == 1;

    $setOnlineRecharge    = checkSettings('reseller-online-recharge') == 'enable';
    $setPaidOption        = checkSettings('reseller-recharge-paid-option') == 'enable';
    $setManagerStatus     = checkSettings('manager_status') == 'enable';
    $setSecurityAmount    = checkSettings('securityAmountManagement') == 'enable';
    $setClientOnlineRech  = checkSettings('ResellerClientOnlineRecharge') == 'enable';
    $setVatCommission     = globalPermission('commission_from_manager_pop')
                            && checkSettings('vat_deduct_from_payment_for_commission_calculation') === 'enable';
    $setCustomSmsGateway  = globalPermission('customResellerSmsGatewaySetup');
    $apiInUse             = checkAPI();

    // Manager Miscellaneous Expense (resellers.commission_percentage) — shown and
    // searchable only where the feature is switched on and the user holds the permission.
    $setMiscExpense       = checkSettings('manager-commission-percentage') == 'enable';
    $canMiscExpense       = $u->can('manager-miscellaneous-expense-search');
    $showMiscExpense      = $setMiscExpense && $canMiscExpense;

    // Manager approval: a new manager is added inactive and goes live only once someone
    // with manager-approve signs it off. Off by default, so nothing shows up until the
    // manager_approval setting is switched on.
    $setApproval          = checkSettings('manager_approval') == 'enable';
    $canApprove           = $setApproval && $u->can('manager-approve');

    // Approval states and the badge each one wears, both in the filter summary and in
    // the Approval column. Rejected managers are only visible via the filter.
    $approvalLabels       = \App\Models\Reseller::APPROVAL_STATUSES;
    $approvalBadges       = [
        \App\Models\Reseller::APPROVAL_PENDING      => 'badge-warning',
        \App\Models\Reseller::APPROVAL_MODIFICATION => 'badge-info',
        \App\Models\Reseller::APPROVAL_APPROVED     => 'badge-success',
        \App\Models\Reseller::APPROVAL_REJECTED     => 'badge-danger',
    ];

    // Total Due is a per-manager lookup; keying it once beats scanning the whole
    // collection inside every row.
    $dueByReseller = collect($due)->keyBy('reseller_id');
@endphp

@section('content')
    <div class="row">
        <div class="col-sm-12">
            <div class="card">
                {{-- Everything above the table on a single line: the total, the approval
                     counts (only for a user who adds managers and approves them, and only
                     while the manager_approval setting is on), the filters this user may
                     use, and the two action buttons. It wraps rather than overflows on a
                     narrow screen. --}}
                <div class="card-body d-flex flex-wrap align-items-center py-2">
                    <span class="mr-3 mb-1 text-nowrap">Total Manager: <strong>{{ $resellersCount }}</strong></span>

                    @if ($approvalCounts)
                        @foreach ([\App\Models\Reseller::APPROVAL_PENDING, \App\Models\Reseller::APPROVAL_MODIFICATION, \App\Models\Reseller::APPROVAL_REJECTED] as $state)
                            <a class="btn btn-sm {{ str_replace('badge-', 'btn-', $approvalBadges[$state]) }} mr-2 mb-1"
                                href="{{ route('resellers.index', ['approval_status' => $state]) }}">
                                {{ $approvalLabels[$state] }}: {{ $approvalCounts[$state] }}
                            </a>
                        @endforeach
                    @endif

                    {{-- Whichever filters this user is allowed to use: Miscellaneous
                         Expense needs manager-miscellaneous-expense-search, Approval
                         Status needs manager-approve. Plain selects, not .select2 — three
                         or four options each, and Select2 does not hold its width on an
                         inline bar. --}}
                    @if ($showMiscExpense || $canApprove)
                        <form method="GET" action="{{ route('resellers.index') }}" class="form-inline mr-auto">
                            @if ($showMiscExpense)
                                <label class="mr-1 mb-1" for="miscExpenseFilter">Misc. Expense</label>
                                <select id="miscExpenseFilter" name="misc_expense" class="form-control form-control-sm mr-2 mb-1">
                                    <option value="">— All —</option>
                                    <option value="set" {{ $miscExpense === 'set' ? 'selected' : '' }}>Set (has a value)</option>
                                    <option value="not_set" {{ $miscExpense === 'not_set' ? 'selected' : '' }}>Not set</option>
                                </select>
                            @endif
                            @if ($canApprove)
                                <label class="mr-1 mb-1" for="approvalStatusFilter">Approval Status</label>
                                <select id="approvalStatusFilter" name="approval_status" class="form-control form-control-sm mr-2 mb-1">
                                    <option value="">— All (except rejected) —</option>
                                    @foreach (\App\Models\Reseller::APPROVAL_STATUSES as $value => $label)
                                        <option value="{{ $value }}" {{ $approvalStatus === $value ? 'selected' : '' }}>{{ $label }}</option>
                                    @endforeach
                                </select>
                            @endif
                            <button type="submit" class="btn btn-sm btn-primary mb-1">
                                <i class="fa fa-search"></i> Search
                            </button>
                            @if ($miscExpense || $approvalStatus)
                                <a href="{{ route('resellers.index') }}" class="btn btn-sm btn-outline-secondary ml-2 mb-1">Reset</a>
                            @endif
                        </form>
                    @else
                        <span class="mr-auto"></span>
                    @endif

                    @if (checkSettings('reseller-can-recharge-from-commission') == 'enable')
                        @can('can_recharge_from_manager_commission')
                            <button type="button" class="btn btn-sm btn-primary ml-2 mb-1" data-toggle="modal"
                                data-target="#modal-fund-transfer">
                                Commission Transfer To Balance
                            </button>
                        @endcan
                    @endif
                    @can('reseller-recharge')
                        <button type="button" class="poprecharge btn btn-sm btn-primary ml-2 mb-1" data-toggle="modal"
                            data-target="#reseller-recharge">
                            Manager Recharge
                        </button>
                    @endcan
                </div>

                <div class="card-body pt-0">
                    <table id="dataTable" class="display table" style="min-height: 400px;">
                        <thead class="bg-gray-50">
                            <tr>

                                <th scope="col">
                                    ID
                                </th>
                                <th scope="col">
                                    Manager Name
                                </th>
                                <th>

                                </th>
                                @if ($canResellerType)
                                    <th scope="col">
                                        Reseller Type
                                    </th>
                                @endif


                                <th scope="col">
                                    Address
                                </th>
                                <th scope="col">
                                    Contact No
                                </th>



                                <th scope="col">
                                    Balance
                                </th>
                                @if ($showMiscExpense)
                                    <th scope="col">
                                        Manager Miscellaneous Expense
                                    </th>
                                @endif
                                @if ($setVatCommission)
                                    <th scope="col">
                                        VAT %
                                    </th>
                                    <th scope="col">
                                        Commission %
                                    </th>
                                @endif
                                @if ($setPaidOption)
                                    <th scope="col">
                                        Total Due
                                    </th>
                                @endif

                                @if ($canRemarkView)
                                    <th scope="col">
                                        Remark
                                    </th>
                                @endif
                                @if ($setManagerStatus)
                                    <th scope="col">
                                        Status
                                    </th>
                                @endif
                                @if ($setApproval)
                                    <th scope="col">
                                        Approval
                                    </th>
                                @endif
                                @if ($canUniqueCode)
                                    <th scope="col">
                                        Unique Code
                                    </th>
                                @endif

                                <th scope="col">

                                </th>
                            </tr>
                        </thead>
                        <tbody class="bg-white divide-y divide-gray-200">

                            @foreach ($resellers as $r)
                                {{-- @dd($resellers) --}}
                                <tr>
                                    <td class="whitespace-nowrap">
                                        {{ $r->id }}
                                    </td>
                                    <td class="whitespace-nowrap">
                                        {{ $r->name }}
                                    </td>
                                    <td>
                                        @if ($cannotSpecificMgmt && $setOnlineRecharge && $r->enable_online_recharge)
                                            <a href="{{ route('onlineManagerRecharge', $r->id) }}"
                                                class="btn btn-danger">Online Recharge</a>
                                        @endif
                                    </td>
                                    @if ($canResellerType)
                                        <td class="whitespace-nowrap">
                                            {{ $r->reseller_type }}
                                        </td>
                                    @endif

                                    <td class="whitespace-nowrap text-sm text-gray-500">
                                        {{ $r->address }}
                                    </td>

                                    <td class="whitespace-nowrap">
                                        {{ $r->contact }}
                                    </td>

                                    <td class="whitespace-nowrap text-sm text-gray-500">
                                        {{ $r->balance[0]['amount'] ?? 0 }}
                                    </td>
                                    @if ($showMiscExpense)
                                        <td class="whitespace-nowrap text-sm text-gray-500">
                                            @if ($r->commission_percentage > 0)
                                                {{ rtrim(rtrim(number_format($r->commission_percentage, 2), '0'), '.') }}%
                                            @else
                                                <span class="text-muted">—</span>
                                            @endif
                                        </td>
                                    @endif
                                    @if ($setVatCommission)
                                        <td class="whitespace-nowrap text-sm text-gray-500">
                                            {{ $r->vat ?? 0 }}%
                                        </td>
                                        <td class="whitespace-nowrap text-sm text-gray-500">
                                            {{ $r->commission_percentage ?? 0 }}%
                                        </td>
                                    @endif

                                    @if ($setPaidOption)
                                        <td class="whitespace-nowrap text-sm text-gray-500">
                                            @if ($d = $dueByReseller->get($r->id))
                                                {{ $d->tamount - $d->tpaid }}
                                            @endif
                                        </td>
                                    @endif

                                    @if ($canRemarkView)
                                        <td class="whitespace-nowrap text-sm text-gray-500">
                                            {{ $r->remark ?? '' }}
                                        </td>
                                    @endif

                                    @if ($setManagerStatus)
                                        <td class="whitespace-nowrap text-sm text-gray-500">
                                            {{ $r->status == 'active' ? 'Active' : 'Inactive' }}
                                        </td>
                                    @endif
                                    @if ($setApproval)
                                        <td class="whitespace-nowrap text-sm">
                                            @php
                                                $rStatus = $r->approval_status ?: \App\Models\Reseller::APPROVAL_APPROVED;
                                            @endphp
                                            <span class="badge {{ $approvalBadges[$rStatus] ?? 'badge-secondary' }}">
                                                {{ $approvalLabels[$rStatus] ?? $rStatus }}
                                            </span>
                                            @if ($r->approval_remark && $rStatus !== \App\Models\Reseller::APPROVAL_APPROVED)
                                                <i class="fa fa-info-circle text-muted ml-1" data-toggle="tooltip"
                                                    title="{{ $r->approval_remark }}"></i>
                                            @endif
                                        </td>
                                    @endif
                                    @if ($canUniqueCode)
                                        <td class="whitespace-nowrap text-sm text-gray-500">
                                            {{ $r->manager_unique_code ?? '' }}
                                        </td>
                                    @endif

                                    <td class="whitespace-nowrap text-right text-sm font-medium">
                                        <div class="dropdown">
                                            {{-- data-display="static" keeps Popper out of it, so the script
                                                 below can place the menu over the scroll box itself. --}}
                                            <button class="btn btn-primary dropdown-toggle" type="button"
                                                id="dropdownMenuButton" data-toggle="dropdown" data-display="static"
                                                aria-haspopup="true" aria-expanded="false">
                                                Action
                                            </button>
                                            <div class="btn-primary dropdown-menu" aria-labelledby="dropdownMenuButton">
                                                @php
                                                    $ownSmsGateway = $r->reseller_type == 'other' || $setCustomSmsGateway || $r->sms_gateway_type === 'own';
                                                @endphp
                                                @if ($canApprove && $r->approval_status && $r->approval_status !== \App\Models\Reseller::APPROVAL_APPROVED)
                                                    <button type="button" class="dropdown-item text-success font-weight-bold approve-manager-btn"
                                                        data-id="{{ $r->id }}"
                                                        data-name="{{ $r->name }}"
                                                        data-commission="{{ $r->commission_percentage }}">
                                                        <i class="fa fa-check"></i> Approve Manager
                                                    </button>
                                                    {{-- The decision a manager already carries is left off its own
                                                         menu — asking for modification on one that is already waiting
                                                         for modification, or rejecting a rejected one, does nothing. --}}
                                                    @if ($r->approval_status !== \App\Models\Reseller::APPROVAL_MODIFICATION)
                                                        <button type="button" class="dropdown-item text-info font-weight-bold approval-decision-btn"
                                                            data-id="{{ $r->id }}"
                                                            data-name="{{ $r->name }}"
                                                            data-decision="modification"
                                                            data-remark="{{ $r->approval_remark }}">
                                                            <i class="fa fa-pencil"></i> Request Modification
                                                        </button>
                                                    @endif
                                                    @if ($r->approval_status !== \App\Models\Reseller::APPROVAL_REJECTED)
                                                        <button type="button" class="dropdown-item text-danger font-weight-bold approval-decision-btn"
                                                            data-id="{{ $r->id }}"
                                                            data-name="{{ $r->name }}"
                                                            data-decision="reject"
                                                            data-remark="{{ $r->approval_remark }}">
                                                            <i class="fa fa-times"></i> Reject Manager
                                                        </button>
                                                    @endif
                                                @endif
                                                @if ($canViewCommission)
                                                    <a class="dropdown-item"
                                                        href="{{ route('view-reseller-commission', $r->id) }}">View
                                                        Commission History</a>
                                                @endif
                                                @if ($canRecharge)
                                                    <a class="dropdown-item"
                                                        href="{{ route('reseller.recharge', $r->id) }}">Recharge</a>
                                                @endif
                                                @if ($setSecurityAmount && $canSecurityAmount)
                                                    <a class="dropdown-item"
                                                        href="{{ route('reseller.security-amount', $r->id) }}">Security Amount</a>
                                                @endif
                                                @if ($canPackagePermission)
                                                    <a class="dropdown-item"
                                                        href="{{ route('reseller.permission', $r->id) }}">Package
                                                        Permission</a>
                                                @endif
                                                @if ($canEditReseller)
                                                    <a class="dropdown-item"
                                                        href="{{ route('resellers.edit', $r->id) }}">Edit</a>
                                                @endif
                                                @if ($canViewHistory)
                                                    <a class="dropdown-item"
                                                        href="{{ route('editLog-history', ['id' => $r->id, 'type' => 'Manager']) }}">History</a>
                                                @endif
                                                @if ($canSmsGateway && $ownSmsGateway)
                                                    <a class="dropdown-item"
                                                        href="{{ route('reseller-sms-gateway', $r->id) }}">Sms
                                                        Gateway</a>
                                                @endif
                                                @if ($setClientOnlineRech && $isSuperAdmin)
                                                    <a class="dropdown-item"
                                                        href="{{ route('paymentGetwayCredential', $r->id) }}">Payment
                                                        Getway</a>
                                                @endif

                                                @if ($ownSmsGateway)
                                                    <a class="dropdown-item"
                                                        href="{{ route('reseller-sms-balance', $r->id) }}">Sms
                                                        Balance</a>
                                                @endif
                                                @if ($canDeleteOnline && ! $apiInUse)
                                                    <a class="dropdown-item"
                                                        href="{{ route('delete-online-pop-clients', ['id' => $r->id, 'type' => 'Reseller']) }}">Delete
                                                        from online</a>
                                                @endif
                                            </div>
                                        </div>


                                    </td>
                                </tr>
                            @endforeach

                            <!-- More items... -->
                        </tbody>
                    </table>


                </div>


            </div>


            <!-- /.card-body -->
            <div class="card-footer clearfix">
                {{ $resellers->links() }}
            </div>
        </div>
    </div>
    </div>

    <div class="modal fade" id="reseller-recharge">
        <div class="modal-dialog">
            <form action="{{ route('resellerRecharge.store') }}" method="POST" class="recharge-form">
                @csrf
                @method('post')
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="text-center">Reseller Recharge</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="text-center" id="modalAlert"></div>

                        <div class="row">

                            <div class="col-md-4">Recharge To</div>
                            <div class="col-md-8 mb-2">
                                <select class="form-control select2" name="reseller_id" id="">
                                    <option value="">Select Reseller</option>
                                    @foreach ($resellers as $r)
                                        <option value="{{ $r->id }}">{{ $r->name }}</option>
                                    @endforeach
                                </select>
                            </div>



                            <div class="col-md-4">Recharge Amount</div>
                            <div class="col-md-8 mb-2">
                                <input type="number" name="amount" class="form-control">
                            </div>

                            @if (checkSettings('reseller-recharge-paid-option') == 'enable')
                                <div class="col-md-4">Paid Amount</div>
                                <div class="col-md-8 mb-2">
                                    <input type="number" name="paid_amount" class="form-control">
                                </div>
                            @endif

                            <div class="col-md-4">Remark*</div>
                            <div class="col-md-8 mb-2">
                                <input type="text" name="remark" id="remark" class="form-control" required>
                            </div>


                        </div>


                    </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button class="btn btn-primary recharge-submit" type="submit" id="modalSave">Recharge</button>
                    </div>

                </div>
                <!-- /.modal-content -->
            </form>
        </div>
        <!-- /.modal-dialog -->
    </div>


    <div class="modal fade" id="modal-fund-transfer">
        <div class="modal-dialog">
            <form action="{{ route('commission-transfer') }}" method="POST">
                @csrf
                @method('post')
                <div class="modal-content">
                    <div class="modal-header">
                        <h4 class="text-center">Commission Transfer</h4>
                        <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                            <span aria-hidden="true">&times;</span>
                        </button>
                    </div>
                    <div class="modal-body">
                        <div class="text-center" id="modalAlert"></div>
                        <div class="row">
                            @php
                                $totalAmount = 0;
                            @endphp
                            <div class="col-md-4">Commission Send To</div>
                            <div class="col-md-8 mb-2">
                                <select class="form-control select2" name="received_by" id="">
                                    <option value="">Select Reseller</option>
                                    @foreach ($managers as $s)
                                        @php
                                            $totalAmount = 0;
                                            foreach ($accounts as $ac) {
                                                if ($ac->reseller_id == $s->id) {
                                                    $totalAmount += $ac->ramount - $ac->pamount;
                                                }
                                            }
                                        @endphp
                                        @if ($totalAmount > 0)
                                            <option value="{{ $s->id }}">
                                                {{ $s->name }} -- BDT {{ $totalAmount }}
                                            </option>
                                        @endif
                                    @endforeach
                                </select>
                                <input type="hidden" name="transfer_type" value="fund_transfer">
                            </div>

                            <div class="col-md-4">Transfer Type</div>
                            <div class="col-md-8 mb-2">
                                <select name="txn_type" class="form-control select2">
                                    <option value="ManagerRecharge">Account Recharge</option>
                                </select>
                            </div>

                            <div class="col-md-4">Transfer Amount</div>
                            <div class="col-md-8 mb-2">
                                <input type="number" name="amount" value="" class="form-control">
                            </div>

                            <div class="col-md-4">Note</div>
                            <div class="col-md-8 mb-2">
                                <textarea name="note" id="note" class="form-control"></textarea>
                            </div>
                        </div>
                    </div>
                    <div class="modal-footer justify-content-between">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button class="btn btn-primary" type="submit" id="modalSave">Transfer</button>
                    </div>
                </div>
            </form>
        </div>
    </div>

    @if ($canApprove)
        <div class="modal fade" id="approveManagerModal" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title"><i class="fa fa-check mr-2"></i>Approve Manager</h5>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <form method="POST" action="" id="approveManagerForm">
                        @csrf
                        <div class="modal-body">
                            <div class="form-group">
                                <label>Manager</label>
                                <input type="text" id="approveManagerName" class="form-control" readonly>
                            </div>
                            @if ($setMiscExpense)
                                <div class="form-group">
                                    <label>Manager Miscellaneous Expense (%)</label>
                                    <input type="number" step="0.01" min="0" name="commission_percentage"
                                        id="approveCommission" class="form-control" placeholder="Commission in percentage">
                                    <small class="text-muted">Set or correct it now — it is saved with the approval.</small>
                                </div>
                            @endif
                            <p class="mb-0 text-muted">
                                Approving makes this manager <strong>Active</strong>.
                            </p>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                            <button type="submit" class="btn btn-success" id="approveManagerSubmit">
                                <i class="fa fa-check"></i> Approve
                            </button>
                        </div>
                    </form>
                </div>
            </div>
        </div>

        {{-- One modal for both "not approved" decisions — they only differ in the wording
             and in where the form posts. Both demand a reason. --}}
        <div class="modal fade" id="approvalDecisionModal" tabindex="-1" role="dialog" aria-hidden="true">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title" id="approvalDecisionTitle">Request Modification</h5>
                        <button type="button" class="close" data-dismiss="modal">&times;</button>
                    </div>
                    <form method="POST" action="" id="approvalDecisionForm">
                        @csrf
                        <div class="modal-body">
                            <div class="form-group">
                                <label>Manager</label>
                                <input type="text" id="approvalDecisionName" class="form-control" readonly>
                            </div>
                            <div class="form-group">
                                <label>Reason <span class="text-danger">*</span></label>
                                <textarea name="approval_remark" id="approvalDecisionRemark" class="form-control"
                                    rows="4" maxlength="1000" required
                                    placeholder="Write why — the manager stays inactive until it is approved."></textarea>
                            </div>
                            <p class="mb-0 text-muted" id="approvalDecisionNote"></p>
                        </div>
                        <div class="modal-footer">
                            <button type="button" class="btn btn-secondary" data-dismiss="modal">Cancel</button>
                            <button type="submit" class="btn btn-primary" id="approvalDecisionSubmit">Save</button>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    @endif

@endsection

@unlessrole('Reseller')
    @section('ajax')
        <script>
            $(function() {

                $('.recharge-form').on('submit', function() {
                    $('.recharge-submit').attr('disabled', 'true');
                });

                // Disable "Transfer" button after first submit to prevent double submission
                $('#modal-fund-transfer form').on('submit', function() {
                    $('#modal-fund-transfer button[type="submit"]').attr('disabled', 'true');
                });

                @if ($canApprove)
                    var approveUrlTemplate = "{{ route('resellers.approve', ['id' => '__ID__']) }}";

                    $(document).on('click', '.approve-manager-btn', function () {
                        var $b = $(this);
                        $('#approveManagerForm').attr('action', approveUrlTemplate.replace('__ID__', $b.data('id')));
                        $('#approveManagerName').val($b.data('name'));
                        $('#approveCommission').val($b.data('commission') || '');
                        $('#approveManagerModal').modal('show');
                    });

                    $('#approveManagerForm').on('submit', function () {
                        $('#approveManagerSubmit').prop('disabled', true).html('Approving...');
                    });

                    $('#approveManagerModal').on('hidden.bs.modal', function () {
                        $('#approveManagerSubmit').prop('disabled', false).html('<i class="fa fa-check"></i> Approve');
                    });

                    var decisionUrls = {
                        modification: "{{ route('resellers.modification', ['id' => '__ID__']) }}",
                        reject: "{{ route('resellers.reject', ['id' => '__ID__']) }}"
                    };

                    var decisionText = {
                        modification: {
                            title: '<i class="fa fa-pencil mr-2"></i>Request Modification',
                            note: 'The manager stays inactive and keeps showing on the list until it is approved.',
                            button: '<i class="fa fa-pencil"></i> Send For Modification',
                            busy: 'Saving...',
                            css: 'btn btn-info'
                        },
                        reject: {
                            title: '<i class="fa fa-times mr-2"></i>Reject Manager',
                            note: 'A rejected manager drops off this list — search Approval Status = Rejected to find it again.',
                            button: '<i class="fa fa-times"></i> Reject',
                            busy: 'Rejecting...',
                            css: 'btn btn-danger'
                        }
                    };

                    var currentDecision = 'modification';

                    $(document).on('click', '.approval-decision-btn', function () {
                        var $b = $(this);
                        currentDecision = $b.data('decision');
                        var text = decisionText[currentDecision];

                        $('#approvalDecisionForm').attr('action', decisionUrls[currentDecision].replace('__ID__', $b.data('id')));
                        $('#approvalDecisionTitle').html(text.title);
                        $('#approvalDecisionNote').text(text.note);
                        $('#approvalDecisionName').val($b.data('name'));
                        $('#approvalDecisionRemark').val($b.data('remark') || '');
                        $('#approvalDecisionSubmit').prop('disabled', false).attr('class', text.css).html(text.button);
                        $('#approvalDecisionModal').modal('show');
                    });

                    $('#approvalDecisionForm').on('submit', function () {
                        $('#approvalDecisionSubmit').prop('disabled', true).html(decisionText[currentDecision].busy);
                    });

                    $('#approvalDecisionModal').on('hidden.bs.modal', function () {
                        var text = decisionText[currentDecision];
                        $('#approvalDecisionSubmit').prop('disabled', false).html(text.button);
                    });

                    $('[data-toggle="tooltip"]').tooltip();
                @endif

                var modalopen = "{{ session('modalopen') }}";

                if (modalopen == "true") {
                    $('.poprecharge').trigger('click');
                }

            });
        </script>
    @endsection
@endunlessrole

@push('js')
    <script>
        // Kept out of the role-guarded script above on purpose: every role gets the
        // table and its Action menus.
        $(function () {
            // The global initializer turns #dataTable into a DataTable and wraps it in
            // #dataTable_wrapper together with the length menu, search field and
            // pagination. Only the table itself should scroll under its sticky header,
            // so the scroll box goes around the table here — this runs after that
            // initializer, whose handler is registered earlier in the page.
            var $scrollBox = $('#dataTable').wrap('<div class="manager-table-scroll"></div>').parent();

            // That box clips anything drawn past its edges — the Action menus included.
            // Each menu is lifted to <body> and pinned over its own button while open,
            // then put back when it closes.
            $(document).on('shown.bs.dropdown', '.manager-table-scroll .dropdown', function () {
                var $menu = $(this).children('.dropdown-menu');
                var rect = this.getBoundingClientRect();

                $menu.data('dropdownHome', this).appendTo('body').css({
                    position: 'fixed',
                    top: rect.bottom + 'px',
                    left: Math.max(8, rect.right - $menu.outerWidth()) + 'px',
                    right: 'auto',
                    margin: 0
                });
            });

            $(document).on('hidden.bs.dropdown', '.manager-table-scroll .dropdown', function () {
                var home = this;

                $('body').children('.dropdown-menu').each(function () {
                    if ($(this).data('dropdownHome') === home) {
                        $(this).removeAttr('style').removeData('dropdownHome').appendTo(home);
                    }
                });
            });

            // A menu pinned to the viewport would hang in place while the box scrolls.
            $scrollBox.on('scroll', function () {
                $(this).find('.dropdown-toggle[aria-expanded="true"]').dropdown('hide');
            });
        });
    </script>
@endpush