<x-admin-layout title="Driver Performance">
    <div class="d-flex justify-content-between align-items-center mb-3 flex-wrap gap-2">
        <ul class="nav nav-pills">
            <li class="nav-item"><a class="nav-link" href="{{ route('admin.reports.index', request()->query()) }}">Overview</a></li>
            <li class="nav-item"><a class="nav-link active" href="{{ route('admin.reports.drivers', request()->query()) }}">Driver Performance</a></li>
            <li class="nav-item"><a class="nav-link" href="{{ route('admin.reports.customers', request()->query()) }}">Customers</a></li>
        </ul>

        <form method="GET" class="d-flex gap-2">
            <select name="range" class="form-select form-select-sm" onchange="this.form.submit()">
                <option value="today" @selected($range === 'today')>Today</option>
                <option value="this_week" @selected($range === 'this_week')>This Week</option>
                <option value="this_month" @selected($range === 'this_month')>This Month</option>
                <option value="last_month" @selected($range === 'last_month')>Last Month</option>
                <option value="this_year" @selected($range === 'this_year')>This Year</option>
                <option value="custom" @selected($range === 'custom')>Custom range…</option>
            </select>
            <input type="date" name="from" value="{{ $range === 'custom' ? $from->format('Y-m-d') : '' }}" class="form-control form-control-sm" style="max-width:150px;">
            <input type="date" name="to" value="{{ $range === 'custom' ? $to->format('Y-m-d') : '' }}" class="form-control form-control-sm" style="max-width:150px;">
            <button type="submit" class="btn btn-sm btn-outline-dark">Apply</button>
        </form>
    </div>

    <div class="card">
        <div class="card-body">
            <h5 class="fw-bold mb-3">Driver Performance</h5>

            @if ($drivers->isEmpty())
                <div class="text-center text-muted py-5">
                    <i class="bi bi-person-badge fs-1 d-block mb-2"></i>
                    No drivers to report on.
                </div>
            @else
                <div class="table-responsive">
                    <table class="table align-middle datatable">
                        <thead>
                            <tr>
                                <th>Driver</th>
                                <th class="text-end">Completed</th>
                                <th class="text-end">Cancelled</th>
                                <th class="text-end">Cancellation Rate</th>
                                <th class="text-end">Revenue</th>
                                <th class="text-end">Rating</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach ($drivers as $driver)
                                @php
                                    $totalJobs = $driver->completed_jobs + $driver->cancelled_jobs;
                                    $cancellationRate = $totalJobs ? round(($driver->cancelled_jobs / $totalJobs) * 100, 1) : 0;
                                @endphp
                                <tr>
                                    <td>
                                        <a href="{{ route('admin.drivers.edit', $driver) }}" class="fw-semibold text-decoration-none">{{ $driver->full_name }}</a>
                                    </td>
                                    <td class="text-end">{{ $driver->completed_jobs }}</td>
                                    <td class="text-end">{{ $driver->cancelled_jobs }}</td>
                                    <td class="text-end">
                                        <span class="badge {{ $cancellationRate > 15 ? 'is-rose' : 'is-green' }}">{{ $cancellationRate }}%</span>
                                    </td>
                                    <td class="text-end">{{ number_format($driver->revenue ?? 0, 2) }}</td>
                                    <td class="text-end">
                                        @if ($driver->ratings_received_count)
                                            <i class="bi bi-star-fill text-warning"></i> {{ number_format($driver->ratings_received_avg_stars, 1) }}
                                            <span class="text-muted small">({{ $driver->ratings_received_count }})</span>
                                        @else
                                            <span class="text-muted small">—</span>
                                        @endif
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>
            @endif
        </div>
    </div>
</x-admin-layout>
