@extends('layout.admin')

@section('content')
<h1 class="text-2xl font-semibold mb-4">Pending Gmail Sales</h1>

@if($gmailSales->count())

<form method="POST" action="{{ route('admin.gmail.bulkAction') }}">
    @csrf
    @method('PUT') {{-- ✅ Laravel এর জন্য PUT রিকোয়েস্ট তৈরি করা হলো --}}

    <!-- 🛠️ Top Buttons -->
    <div class="grid grid-cols-1 sm:grid-cols-2 lg:grid-cols-4 gap-3 mb-4">
        <a href="{{ route('admin.gmail.export', ['status' => 'pending']) }}" class="bg-green-600 hover:bg-green-700 text-white px-4 py-2 rounded text-center text-sm">
            Export to Excel
        </a>
        <button type="submit" name="action" value="checked" class="bg-blue-600 hover:bg-blue-700 text-white px-4 py-2 rounded text-sm">
            Mark as Checked
        </button>
        <button type="submit" name="action" value="rejected" class="bg-red-600 hover:bg-red-700 text-white px-4 py-2 rounded text-sm">
            Mark as Rejected
        </button>
        <button type="submit" name="action" value="completed" class="bg-yellow-600 hover:bg-yellow-700 text-white px-4 py-2 rounded text-sm">
            Mark as Completed
        </button>
    </div>

    <!-- 📋 Table -->
    <div class="overflow-x-auto bg-white shadow-md rounded-lg">
        <table class="min-w-full divide-y divide-gray-200 text-sm">
            <thead class="bg-yellow-100">
                <tr>
                    <th class="px-4 py-2">
                        <input type="checkbox" id="checkAll" class="form-checkbox text-yellow-600">
                    </th>
                    <th class="px-4 py-2 text-left text-yellow-700">User</th>
                    <th class="px-4 py-2 text-left text-yellow-700">Gmail</th>
                    <th class="px-4 py-2 text-left text-yellow-700">Password</th>
                    <th class="px-4 py-2 text-left text-yellow-700">Recovery Email</th>
                    <th class="px-4 py-2 text-left text-yellow-700">Status</th>
                    <th class="px-4 py-2 text-left text-yellow-700">Submitted</th>
                </tr>
            </thead>
            <tbody class="divide-y divide-yellow-200">
                @foreach($gmailSales as $sale)
                <tr class="hover:bg-yellow-50">
                    <td class="px-4 py-2">
                        <input type="checkbox" name="ids[]" value="{{ $sale->id }}" class="form-checkbox text-yellow-600">
                    </td>
                    <td class="px-4 py-2 text-yellow-800">{{ $sale->user->name ?? 'N/A' }}</td>
                    <td class="px-4 py-2 text-yellow-800">{{ $sale->gmail }}</td>
                    <td class="px-4 py-2 text-yellow-800">{{ $sale->gmail_password }}</td>
                    <td class="px-4 py-2 text-yellow-800">{{ $sale->recovery_email ?? 'N/A' }}</td>
                    <td class="px-4 py-2 text-yellow-800">
                        <span class="inline-block px-2 py-1 text-xs rounded bg-yellow-100 text-yellow-700">
                            {{ ucfirst($sale->status) }}
                        </span>
                    </td>
                    <td class="px-4 py-2 text-yellow-800">{{ $sale->created_at->diffForHumans() }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>
    </div>
</form>

@else
<div class="bg-yellow-100 text-yellow-800 px-4 py-3 rounded">
    No Pending Gmail Sales found.
</div>
@endif

<script>
    document.getElementById('checkAll').addEventListener('click', function () {
        let checkboxes = document.querySelectorAll('input[name="ids[]"]');
        checkboxes.forEach(cb => cb.checked = this.checked);
    });
</script>
@endsection