@extends('backend.layouts.app')
@section('content')
<style>
.pp-wrapper{padding:4px 0;}
.pp-page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;flex-wrap:wrap;gap:10px;}
.pp-page-header h1{font-size:20px;font-weight:700;color:#1a202c;margin:0;}
.pp-page-header h1 span{background:linear-gradient(135deg,#f05a7e,#f6845a);-webkit-background-clip:text;-webkit-text-fill-color:transparent;}
.pp-card{background:#fff;border-radius:16px;box-shadow:0 2px 16px rgba(0,0,0,0.07);overflow:hidden;}
.pp-card-header{padding:14px 20px;border-bottom:1px solid #f0f0f0;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px;}
.pp-card-header h5{font-size:15px;font-weight:700;color:#1a202c;margin:0;}
.pp-filters{padding:12px 20px;background:#fafafa;border-bottom:1px solid #f0f0f0;display:flex;flex-wrap:wrap;gap:10px;align-items:center;}
.pp-search{border:1.5px solid #e2e8f0;border-radius:50px;padding:8px 16px;font-size:13px;outline:none;background:#fff;flex:1;min-width:200px;}
.pp-search:focus{border-color:#f05a7e;}
.pp-btn-search{background:linear-gradient(135deg,#f05a7e,#f6845a);color:#fff;border:none;border-radius:50px;padding:8px 18px;font-size:13px;font-weight:700;cursor:pointer;}
.pp-select{border:1.5px solid #e2e8f0;border-radius:50px;padding:7px 14px;font-size:13px;outline:none;background:#fff;}
.pp-btn-clear{color:#a0aec0;font-size:12px;text-decoration:none;border:1.5px solid #e2e8f0;border-radius:50px;padding:7px 14px;}
.pp-btn-new{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:10px;padding:9px 18px;font-size:13px;font-weight:700;text-decoration:none;}
.pp-btn-new:hover{color:#fff;opacity:.9;}
.pp-sort-th{cursor:pointer;user-select:none;}
.pp-sort-th:hover{background:#f0f4ff;}
.pp-sort-icon{font-size:10px;margin-left:3px;color:#a0aec0;}
.pp-table{width:100%;border-collapse:collapse;}
.pp-table thead th{background:#f8fafc;padding:10px 16px;font-size:11px;font-weight:700;color:#718096;text-transform:uppercase;letter-spacing:.5px;border-bottom:1px solid #f0f0f0;white-space:nowrap;}
.pp-table tbody tr{border-bottom:1px solid #f7f7f7;transition:background .15s;}
.pp-table tbody tr:hover{background:#fef8f9;}
.pp-table tbody td{padding:12px 16px;font-size:13px;color:#2d3748;vertical-align:middle;}
.pp-avatar{width:36px;height:36px;border-radius:50%;background:linear-gradient(135deg,#667eea,#764ba2);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:#fff;flex-shrink:0;}
.pp-client-id{font-family:monospace;font-size:12px;background:#f1f5f9;padding:2px 8px;border-radius:6px;font-weight:700;}
.pp-badge{display:inline-block;padding:3px 10px;border-radius:50px;font-size:11px;font-weight:700;}
.pp-badge-starter{background:#ebf8ff;color:#2b6cb0;}
.pp-badge-economy{background:#fef9c3;color:#854d0e;}
.pp-badge-premium{background:#ede9fe;color:#5b21b6;}
.pp-badge-expired{background:#fef0f4;color:#a32d2d;}
.pp-badge-expiring{background:#fff7ed;color:#c2410c;}
.pp-btn-action{display:inline-flex;align-items:center;gap:4px;padding:5px 10px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;border:none;text-decoration:none;transition:all .15s;}
.pp-btn-refund{background:#fef9c3;color:#854d0e;}
.pp-btn-refund:hover{background:#fde68a;color:#854d0e;}
.pp-btn-view{background:#ebf8ff;color:#2b6cb0;}
.pp-btn-view:hover{background:#bee3f8;color:#2b6cb0;}
.pp-btn-edit{background:#eaf3de;color:#3b6d11;}
.pp-btn-delete{background:#fef0f4;color:#a32d2d;}
@media(max-width:991px){
    .pp-table thead{display:none;}
    .pp-table tbody tr{display:block;margin-bottom:12px;border:1px solid #e2e8f0;border-radius:12px;padding:12px;background:#fff;}
    .pp-table tbody td{display:flex;justify-content:space-between;align-items:center;padding:7px 8px;border-bottom:1px solid #f7f7f7;font-size:13px;}
    .pp-table tbody td:last-child{border-bottom:none;}
    .pp-table tbody td::before{content:attr(data-label);font-weight:700;font-size:11px;color:#718096;text-transform:uppercase;}
}
</style>

<div class="pp-wrapper">
<div class="pp-page-header">
    <h1>Pincode <span>Partners</span></h1>
    <div class="d-flex gap-10 align-items-center">
        <a href="{{ route('partner.refunds.index') }}"
           style="background:#fef9c3;color:#854d0e;border:none;border-radius:10px;padding:9px 16px;font-size:13px;font-weight:700;text-decoration:none;">
            💳 All Refunds
        </a>
        @if(empty($business_partner_id))
            @can('add_pincode_partners')
                <a href="{{ route('affiliate.pincode.create') }}" class="pp-btn-new">+ Add New Partner</a>
            @endcan
        @endif
    </div>
</div>

<div class="pp-card">
    <form id="sort_business_patners" action="" method="GET">
        <div class="pp-card-header">
            <h5>All Pincode Partners</h5>
            @can('delete_pincode_partners')
                <div class="dropdown">
                    <button class="btn border dropdown-toggle btn-sm" type="button" data-toggle="dropdown">Bulk Action</button>
                    <div class="dropdown-menu dropdown-menu-right">
                        <a class="dropdown-item" href="#" onclick="bulk_delete()">Delete selection</a>
                    </div>
                </div>
            @endcan
        </div>

        <div class="pp-filters">
            <div style="position:relative;flex:1;min-width:200px;">
                <i class="las la-search" style="position:absolute;left:12px;top:50%;transform:translateY(-50%);color:#a0aec0;font-size:14px;"></i>
                <input type="text" name="search" class="pp-search" style="padding-left:34px;"
                    @isset($sort_search) value="{{ $sort_search }}" @endisset
                    placeholder="Search name, phone, pincode..."
                    onkeypress="if(event.key==='Enter'){event.preventDefault();$('#sort_business_patners').submit();}">
            </div>
            <select name="wallet_filter" class="pp-select" onchange="$('#sort_business_patners').submit()">
                <option value="">💰 All Wallet</option>
                <option value="has_balance" {{ request('wallet_filter')=='has_balance' ? 'selected' : '' }}>Has Balance</option>
                <option value="no_balance"  {{ request('wallet_filter')=='no_balance'  ? 'selected' : '' }}>No Balance</option>
            </select>
            <select name="reward_filter" class="pp-select" onchange="$('#sort_business_patners').submit()">
                <option value="">⭐ All Points</option>
                <option value="has_points" {{ request('reward_filter')=='has_points' ? 'selected' : '' }}>Has Points</option>
                <option value="no_points"  {{ request('reward_filter')=='no_points'  ? 'selected' : '' }}>No Points</option>
            </select>
            <select name="sort_by" class="pp-select" onchange="$('#sort_business_patners').submit()">
                <option value="">Sort By</option>
                <option value="wallet_asc"    {{ request('sort_by')=='wallet_asc'    ? 'selected' : '' }}>💰 Wallet ↑</option>
                <option value="wallet_desc"   {{ request('sort_by')=='wallet_desc'   ? 'selected' : '' }}>💰 Wallet ↓</option>
                <option value="rewards_asc"   {{ request('sort_by')=='rewards_asc'   ? 'selected' : '' }}>⭐ Points ↑</option>
                <option value="rewards_desc"  {{ request('sort_by')=='rewards_desc'  ? 'selected' : '' }}>⭐ Points ↓</option>
                <option value="expiry_asc"    {{ request('sort_by')=='expiry_asc'    ? 'selected' : '' }}>📅 Expiry ↑</option>
                <option value="expiry_desc"   {{ request('sort_by')=='expiry_desc'   ? 'selected' : '' }}>📅 Expiry ↓</option>
            </select>
            <button type="submit" class="pp-btn-search">🔍 Search</button>
            @if(request('search') || request('wallet_filter') || request('reward_filter') || request('sort_by'))
                <a href="{{ route('affiliate.pincodelist') }}" class="pp-btn-clear">✕ Clear</a>
            @endif
        </div>

        <div class="table-responsive">
        <table class="pp-table">
            <thead>
                <tr>
                    <th style="width:40px;">
                        <label class="aiz-checkbox mb-0">
                            <input type="checkbox" class="check-all">
                            <span class="aiz-square-check"></span>
                        </label>
                    </th>
                    <th>Client ID</th>
                    <th>Partner</th>
                    <th>Phone</th>
                    <th>Package</th>
                    <th>Pincode</th>
                    <th>Expiry</th>
                    <th>Wallet</th>
                    <th>Reward Points</th>
                    <th>Payment</th>
                    @if(empty($business_partner_id))
                        <th class="text-right">Actions</th>
                    @endif
                </tr>
            </thead>
            <tbody>
                @foreach($pincodePartners as $key => $partner)
                @if(!$partner->user) @continue @endif
                @php
                    $expiry = $partner->expiry_date ? \Carbon\Carbon::parse($partner->expiry_date) : null;
                    $daysLeft = $expiry ? now()->diffInDays($expiry, false) : null;
                    $pkgName = strtolower($partner->customerPackage->name ?? '');
                    if ($daysLeft !== null && $daysLeft <= 0) $expClass = 'pp-badge-expired';
                    elseif ($daysLeft !== null && $daysLeft <= 30) $expClass = 'pp-badge-expiring';
                    else $expClass = 'pp-badge-starter';
                    if (str_contains($pkgName,'premium')) $pkgClass = 'pp-badge-premium';
                    elseif (str_contains($pkgName,'economy')) $pkgClass = 'pp-badge-economy';
                    else $pkgClass = 'pp-badge-starter';
                @endphp
                <tr>
                    <td data-label="Select">
                        <label class="aiz-checkbox mb-0">
                            <input type="checkbox" class="check-one" name="id[]" value="{{ $partner->id }}">
                            <span class="aiz-square-check"></span>
                        </label>
                    </td>
                    <td data-label="Client ID">
                        @if($partner->client_ID)
                            <span class="pp-client-id">{{ $partner->client_ID }}</span>
                        @else
                            <span style="color:#a0aec0;font-size:12px;">—</span>
                        @endif
                    </td>
                    <td data-label="Partner">
                        <div class="d-flex align-items-center gap-10">
                            <div class="pp-avatar">{{ strtoupper(substr($partner->user->name ?? 'P', 0, 1)) }}</div>
                            <div>
                                <div style="font-weight:600;font-size:13px;">{{ $partner->user->name ?? '—' }}</div>
                                <div style="font-size:11px;color:#a0aec0;">{{ $partner->user->email ?? '' }}</div>
                                <div style="font-size:11px;color:#38a169;font-weight:600;">pincode_partner</div>
                            </div>
                        </div>
                    </td>
                    <td data-label="Phone">{{ $partner->user->phone ?? '—' }}</td>
                    <td data-label="Package">
                        @if($partner->customerPackage)
                            <span class="pp-badge {{ $pkgClass }}">{{ $partner->customerPackage->name }}</span>
                            <div style="font-size:11px;color:#718096;margin-top:3px;">{{ $partner->customerPackage->sharing ?? 0 }}% sharing</div>
                        @else
                            <span style="color:#a0aec0;">—</span>
                        @endif
                    </td>
                    <td data-label="Pincode">
                        <span style="font-family:monospace;font-weight:700;">{{ $partner->pincode ?? '—' }}</span>
                    </td>
                    <td data-label="Expiry">
                        @if($expiry)
                            <span class="pp-badge {{ $expClass }}">{{ $expiry->format('d M Y') }}</span>
                            @if($daysLeft !== null && $daysLeft <= 0)
                                <div style="font-size:10px;color:#a32d2d;margin-top:2px;">Expired</div>
                            @elseif($daysLeft !== null && $daysLeft <= 30)
                                <div style="font-size:10px;color:#c2410c;margin-top:2px;">{{ ceil($daysLeft) }} days left</div>
                            @endif
                        @else
                            <span style="color:#a0aec0;">—</span>
                        @endif
                    </td>
                    @php
                        $wBalance = getWalletBallance($partner->user_id);
                        $rPoints  = $rewardPoints[$partner->user_id]->reward_points ?? 0;
                    @endphp
                    <td data-label="Wallet">
                        @if($wBalance > 0)
                            <span style="background:#eaf3de;color:#3b6d11;padding:3px 10px;border-radius:50px;font-size:12px;font-weight:700;">
                                💰 {{ single_price($wBalance) }}
                            </span>
                        @else <span style="color:#a0aec0;">—</span> @endif
                    </td>
                    <td data-label="Reward Points">
                        @if($rPoints > 0)
                            <span style="background:#fef9c3;color:#854d0e;padding:3px 10px;border-radius:50px;font-size:12px;font-weight:700;">
                                ⭐ {{ $rPoints }}
                            </span>
                        @else <span style="color:#a0aec0;">—</span> @endif
                    </td>
                    <td data-label="Payment">
                        <span style="font-size:12px;color:#718096;">{{ optional($partner->customerPackagePayment)->payment_method ?? '—' }}</span>
                    </td>
                    @if(empty($business_partner_id))
                    <td data-label="Actions" class="text-right">
                        <div class="d-flex align-items-center gap-6 justify-content-end flex-wrap">
                            @php $existingRefund = $existingRefunds[$partner->id] ?? null; @endphp
                                @if($existingRefund)
                                    <a href="{{ route('partner.refunds.show', $existingRefund->id) }}"
                                       class="pp-btn-action"
                                       style="background:#eaf3de;color:#3b6d11;font-size:11px;">
                                        ✅ {{ ucfirst(str_replace('_',' ',$existingRefund->stage)) }}
                                    </a>
                                @else
                                    <a href="{{ route('partner.refunds.create', $partner->id) }}" class="pp-btn-action pp-btn-refund">💳 Refund</a>
                                @endif
                            @can('view_pincode_partner_details')
                                <a href="{{ route('affiliate.partner-details', $partner->user->id) }}" class="pp-btn-action pp-btn-view">👁 View</a>
                            @endcan
                            @can('edit_pincode_partners')
                                <a href="{{ route('affiliate.pincodepartner.edit', $partner->id) }}" class="pp-btn-action pp-btn-edit">✏️ Edit</a>
                            @endcan
                            @can('delete_pincode_partners')
                                <a href="#" class="pp-btn-action pp-btn-delete confirm-delete" data-href="{{ route('affiliate.delete', $partner->id) }}">🗑</a>
                            @endcan
                        </div>
                    </td>
                    @endif
                </tr>
                @endforeach
            </tbody>
        </table>
        </div>
        <div class="px-4 py-3">{{ $pincodePartners->appends(request()->input())->links() }}</div>
    </form>
</div>
</div>

@endsection
@section('modal')
    @include('modals.delete_modal')
@endsection
@section('script')
<script>
    $(document).on("change", ".check-all", function() {
        $('.check-one:checkbox').prop('checked', this.checked);
    });
    function bulk_delete() {
        var data = new FormData($('#sort_business_patners')[0]);
        $.ajax({
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') },
            url: "{{ route('bulk-businessPartner-delete') }}",
            type: 'POST', data: data, cache: false, contentType: false, processData: false,
            success: function(response) { if(response == 1) location.reload(); }
        });
    }
</script>
@endsection