@extends('layouts.admin')
@section('title', 'Checkout Armada')
@section('page_title', 'Checkout Armada')
@section('breadcrumb')
    <li class="active">Checkout Armada</li>
@endsection

@push('css')
<style>
    .filter-bar {
        display: flex;
        gap: 6px;
        flex-wrap: wrap;
        margin-bottom: 16px;
        align-items: center;
    }
    .filter-btn {
        padding: 5px 14px;
        border-radius: 4px;
        border: 1px solid #ddd;
        background: #fff;
        color: #333;
        font-size: 13px;
        font-weight: 600;
        cursor: pointer;
        text-decoration: none;
        transition: all 0.15s;
    }
    .filter-btn:hover { border-color: #28a745; color: #28a745; }
    .filter-btn.active { background: #28a745; border-color: #28a745; color: #fff; }
    .search-sm input {
        border-radius: 4px;
        padding: 5px 12px;
        border: 1px solid #ddd;
        font-size: 13px;
        width: 200px;
        outline: none;
    }
    .search-sm input:focus { border-color: #28a745; }
</style>
@endpush

@section('content')
<div class="row">
    <div class="col-xl-12 m-b-3">
        <div class="card">
            <div class="card-header">
                <h4 class="text-black pull-left">Checkout Armada - Aktif</h4>
                <a href="{{ route('admin.checkout.history') }}" class="btn btn-default btn-sm pull-right">
                    <i class="fa fa-history"></i> Riwayat
                </a>
            </div>
            <div class="card-body">

                {{-- Filter Bar --}}
                <div class="filter-bar">
                    <a href="{{ route('admin.checkout.index', ['filter' => 'aktif']) }}"
                       class="filter-btn {{ ($filter ?? 'aktif') === 'aktif' ? 'active' : '' }}">
                        Aktif
                    </a>
                    <a href="{{ route('admin.checkout.index', ['filter' => 'parking']) }}"
                       class="filter-btn {{ ($filter ?? '') === 'parking' ? 'active' : '' }}">
                        Parking
                    </a>
                    <a href="{{ route('admin.checkout.index', ['filter' => 'on_haul']) }}"
                       class="filter-btn {{ ($filter ?? '') === 'on_haul' ? 'active' : '' }}">
                        On Hauling
                    </a>
                    <a href="{{ route('admin.checkout.index', ['filter' => 'dumping']) }}"
                       class="filter-btn {{ ($filter ?? '') === 'dumping' ? 'active' : '' }}">
                        Dumping
                    </a>

                    <form method="GET" action="{{ route('admin.checkout.index') }}" class="search-sm" style="margin-left:auto">
                        @if($filter && $filter !== 'aktif')
                            <input type="hidden" name="filter" value="{{ $filter }}">
                        @endif
                        <input type="text" name="search" placeholder="Cari kendaraan / sopir..."
                            value="{{ request('search') }}">
                    </form>
                </div>

                {{-- Table --}}
                <div class="table-responsive">
                    <table class="table table-hover">
                        <thead>
                            <tr>
                                <th>No. Kendaraan</th>
                                <th>Sopir</th>
                                <th>Jenis Kendaraan</th>
                                <th>Tgl &amp; Jam Checkout</th>
                                <th>Tgl &amp; Jam Berangkat</th>
                                {{-- <th>Status</th> --}}
                            </tr>
                        </thead>
                        <tbody>
                            @forelse($checkouts as $co)
                            <tr>
                                <td>
                                    <strong>{{ $co->kendaraan->no_lambung ?? '-' }}</strong>
                                    @if($co->kendaraan?->plat_nomor)
                                        <br><small class="text-muted">{{ $co->kendaraan->plat_nomor }}</small>
                                    @endif
                                </td>
                                <td>{{ $co->supir->nama_supir ?? '-' }}</td>
                                <td>{{ $co->kendaraan->jenisKendaraan->nama_jenis_kendaraan ?? '-' }}</td>
                                <td>
                                    {{ $co->checkout_date?->format('d-m-Y') ?? '-' }}
                                    @if($co->checkout_time)
                                        <br><strong>{{ $co->checkout_time }}</strong>
                                    @endif
                                </td>
                                <td>
                                    @if($co->leave_date)
                                        {{ $co->leave_date->format('d-m-Y') }}
                                        @if($co->leave_time)
                                            <br><strong>{{ $co->leave_time }}</strong>
                                        @endif
                                    @else
                                        <span class="text-muted">-</span>
                                    @endif
                                </td>
                                {{-- <td>
                                    @if($co->status === App\Models\CheckoutKendaraan::STATUS_PARKING)
                                        <span class="badge badge-secondary">Parking</span>
                                    @elseif($co->status === App\Models\CheckoutKendaraan::STATUS_ON_HAULING)
                                        <span class="badge badge-info">On Hauling</span>
                                    @elseif($co->status === App\Models\CheckoutKendaraan::STATUS_DUMPING)
                                        <span class="badge badge-warning">Dumping</span>
                                    @elseif($co->status === App\Models\CheckoutKendaraan::STATUS_FUEL_DONE)
                                        <span class="badge badge-primary">Fuel Done</span>
                                    @else
                                        <span class="badge badge-default">{{ $co->status }}</span>
                                    @endif
                                </td> --}}
                            </tr>
                            @empty
                            <tr>
                                <td colspan="5" class="text-center text-muted">Tidak ada checkout aktif</td>
                            </tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>

                {{ $checkouts->withQueryString()->links('pagination::bootstrap-4') }}
            </div>
        </div>
    </div>
</div>
@endsection