@extends("layouts.admin")

@section("title","Manajemen Transaksi")

@section("content")

<div class="flex justify-between items-center mb-4">
    <h2 class="text-xl font-bold">Daftar Transaksi</h2>
</div>

<form method="GET" class="bg-white rounded-xl shadow p-4 mb-4 flex flex-wrap gap-3">
    <select name="status" class="input-field text-sm py-1.5 w-40">
        <option value="">Semua Status Bayar</option>
        <option value="menunggu" {{ request("status")==="menunggu" ? "selected" : "" }}>Menunggu</option>
        <option value="lunas" {{ request("status")==="lunas" ? "selected" : "" }}>Lunas</option>
        <option value="gagal" {{ request("status")==="gagal" ? "selected" : "" }}>Gagal</option>
    </select>

    <select name="status_pemesanan" class="input-field text-sm py-1.5 w-52">
        <option value="">Semua Status Pemesanan</option>
        <option value="menunggu_konfirmasi" {{ request("status_pemesanan")==="menunggu_konfirmasi" ? "selected" : "" }}>Menunggu Konfirmasi</option>
        <option value="dikonfirmasi" {{ request("status_pemesanan")==="dikonfirmasi" ? "selected" : "" }}>Dikonfirmasi</option>
        <option value="dibatalkan" {{ request("status_pemesanan")==="dibatalkan" ? "selected" : "" }}>Dibatalkan</option>
        <option value="selesai" {{ request("status_pemesanan")==="selesai" ? "selected" : "" }}>Selesai</option>
    </select>

    <input
        type="date"
        name="tanggal"
        class="input-field text-sm py-1.5 w-44"
        value="{{ request('tanggal') }}"
    >

    <button type="submit" class="btn-primary text-sm py-1.5 px-4">
        Filter
    </button>
</form>

<div class="bg-white rounded-xl shadow overflow-x-auto">
    <table class="w-full text-sm min-w-max">
        <thead class="bg-blue-800 text-white">
            <tr>
                <th class="py-3 px-3 text-left">Kode Booking</th>
                <th class="py-3 px-3 text-left">Pelanggan</th>
                <th class="py-3 px-3 text-left">Rute</th>
                <th class="py-3 px-3 text-right">Total</th>
                <th class="py-3 px-3 text-center">Status Bayar</th>
                <th class="py-3 px-3 text-center">Status Pemesanan</th>
                <th class="py-3 px-3 text-center">Aksi</th>
            </tr>
        </thead>

        <tbody>
        @forelse($pemesanan as $p)
            <tr class="border-t hover:bg-gray-50">
                <td class="py-3 px-3 font-mono text-xs text-blue-600">
                    {{ $p->kode_booking }}
                </td>

                <td class="py-3 px-3">
                    {{ $p->pengguna?->nama_lengkap ?? 'Manual' }}
                </td>

                <td class="py-3 px-3 text-xs">
                    {{ $p->jadwal->rute->label ?? '-' }}<br>

                    @if($p->jadwal)
                        <span class="text-gray-400">
                            {{ $p->jadwal->tanggal_berangkat->isoFormat('D MMM') }}
                            {{ $p->jadwal->slot_waktu }}
                        </span>
                    @endif
                </td>

                <td class="py-3 px-3 text-right">
                    Rp {{ number_format($p->total_harga,0,",",".") }}
                </td>

                <td class="py-3 px-3 text-center">
                    <span class="px-2 py-0.5 rounded-full text-xs
                        {{ $p->status_bayar=="lunas"
                            ? "bg-green-100 text-green-700"
                            : ($p->status_bayar=="gagal"
                                ? "bg-red-100 text-red-700"
                                : "bg-yellow-100 text-yellow-700") }}">
                        {{ ucfirst($p->status_bayar) }}
                    </span>
                </td>

                <td class="py-3 px-3 text-center">
                    <span class="px-2 py-0.5 rounded-full text-xs
                        {{ $p->status_pemesanan=="dikonfirmasi"
                            ? "bg-blue-100 text-blue-700"
                            : ($p->status_pemesanan=="dibatalkan"
                                ? "bg-red-100 text-red-700"
                                : ($p->status_pemesanan=="selesai"
                                    ? "bg-slate-100 text-slate-700"
                                    : "bg-yellow-100 text-yellow-700")) }}">
                        {{ $p->label_status_pemesanan }}
                    </span>
                </td>

                <td class="py-3 px-3 text-center">
                    <a href="{{ route('admin.transaksi.show',$p) }}"
                       class="text-blue-600 hover:underline text-xs">
                        Detail
                    </a>
                </td>
            </tr>
        @empty
            <tr>
                <td colspan="7" class="py-8 text-center text-gray-400">
                    Tidak ada transaksi.
                </td>
            </tr>
        @endforelse
        </tbody>
    </table>

    <div class="p-4">
        {{ $pemesanan->links() }}
    </div>
</div>

@endsection