@extends('layout.admin')

@section('content')
<div class="bg-white p-6 rounded shadow-md">
    <h1 class="text-xl font-semibold mb-6 flex items-center gap-2">
        <i class="fas fa-envelope text-indigo-600"></i> All Gmail Sales
    </h1>

    {{-- 🔍 সার্চ ফরম --}}
    <form method="GET" action="{{ route('admin.gmail.sales.index') }}" class="mb-6">
        <div class="grid grid-cols-1 sm:grid-cols-2 gap-3">
            <input type="text" name="search" value="{{ request('search') }}"
                   placeholder="একাধিক Gmail লিখুন,"
                   class="w-full border border-gray-300 px-4 py-2 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-blue-500 text-sm" />
            <button type="submit" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded-md text-sm flex items-center justify-center gap-1 shadow">
                <i class="fas fa-search"></i> Search
            </button>
        </div>
    </form>

    @if($gmailSales->count())
        {{-- ✅ Bulk Action ফর্ম শুরু --}}
        <form method="POST" action="{{ route('admin.gmail.sales.bulk') }}">
            @csrf
            @method('PUT') {{-- ✅ Laravel PUT রিকোয়েস্ট সাপোর্ট --}}
            
            <div class="mb-4 flex flex-wrap items-center gap-2">
                <select name="action" required class="border rounded px-3 py-1 text-sm">
                    <option value="">-- Select Action --</option>
                    <option value="checked">Mark as Checked</option>
                    <option value="rejected">Mark as Rejected</option>
                    <option value="completed">Mark as Completed</option>
                </select>
                <button type="submit" class="bg-green-600 hover:bg-green-700 text-white px-4 py-1.5 rounded text-sm flex items-center gap-1">
                    <i class="fas fa-tasks"></i> Apply to Selected
                </button>
            </div>

            <div class="overflow-x-auto">
                <table class="min-w-full border border-gray-200 text-sm rounded-md overflow-hidden">
                    <thead class="bg-gray-100">
                        <tr>
                            <th class="px-4 py-3 border-b text-left font-medium text-gray-700">
                                <input type="checkbox" id="selectAll" class="form-checkbox">
                            </th>
                            <th class="px-4 py-3 border-b text-left font-medium text-gray-700">User</th>
                            <th class="px-4 py-3 border-b text-left font-medium text-gray-700">Gmail</th>
                            <th class="px-4 py-3 border-b text-left font-medium text-gray-700">Password</th>
                            <th class="px-4 py-3 border-b text-left font-medium text-gray-700">Recovery Email</th>
                            <th class="px-4 py-3 border-b text-left font-medium text-gray-700">Status</th>
                            <th class="px-4 py-3 border-b text-left font-medium text-gray-700">Submitted</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-gray-100">
                        @foreach($gmailSales as $sale)
                            <tr class="hover:bg-gray-50">
                                <td class="px-4 py-2">
                                    <input type="checkbox" name="ids[]" value="{{ $sale->id }}" class="form-checkbox row-checkbox">
                                </td>
                                <td class="px-4 py-2 text-gray-800">{{ $sale->user->name ?? 'N/A' }}</td>
                                <td class="px-4 py-2 text-gray-800">{{ $sale->gmail }}</td>
                                <td class="px-4 py-2 text-gray-800">{{ $sale->gmail_password }}</td>
                                <td class="px-4 py-2 text-gray-800">{{ $sale->recovery_email ?? 'N/A' }}</td>
                                <td class="px-4 py-2">
                                    <span class="px-2 py-1 rounded-full text-xs font-semibold
                                        @if($sale->status === 'pending') bg-yellow-100 text-yellow-700
                                        @elseif($sale->status === 'checked') bg-blue-100 text-blue-700
                                        @elseif($sale->status === 'rejected') bg-red-100 text-red-700
                                        @elseif($sale->status === 'completed') bg-green-100 text-green-700
                                        @endif
                                    ">
                                        {{ ucfirst($sale->status) }}
                                    </span>
                                </td>
                                <td class="px-4 py-2 text-gray-700">{{ $sale->created_at->diffForHumans() }}</td>
                            </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
        </form>
        {{-- ✅ Bulk Action ফর্ম শেষ --}}
    @else
        <div class="bg-yellow-100 text-yellow-800 px-4 py-3 rounded mt-4 flex items-center gap-2">
            <i class="fas fa-info-circle"></i>
            কোন Gmail Sales পাওয়া যায়নি।
        </div>
    @endif
</div>

{{-- ✅ Select All Checkbox Script --}}
@push('scripts')
<script>
    document.addEventListener('DOMContentLoaded', function () {
        const selectAll = document.getElementById('selectAll');
        const checkboxes = document.querySelectorAll('.row-checkbox');

        selectAll.addEventListener('change', function () {
            checkboxes.forEach(cb => cb.checked = this.checked);
        });
    });
</script>
@endpush

@endsection