@extends('layouts.app')
@section('title', 'Deals')
@section('heading', 'Deals')

@section('content')
<form method="GET" class="grid gap-3 sm:grid-cols-4" role="search">
    <div class="sm:col-span-2"><label for="q" class="mb-1 block text-xs font-medium text-muted">Search deal number, customer, stock ID or VIN</label><input id="q" name="q" value="{{ $filters['q'] ?? '' }}" class="field" autocomplete="off"></div>
    <div><label for="status" class="mb-1 block text-xs font-medium text-muted">Status</label>
        <select id="status" name="status" class="field"><option value="">All</option>@foreach (\App\Enums\DealStatus::cases() as $s)<option value="{{ $s->value }}" @selected(($filters['status'] ?? '') === $s->value)>{{ $s->label() }}</option>@endforeach</select></div>
    <div class="flex items-end gap-2"><button class="btn-primary">Apply</button>@can('deals.create')<a href="{{ route('deals.create') }}" class="btn-quiet">New deal</a>@endcan</div>
</form>

<div class="mt-4 overflow-x-auto rounded-lg border border-line bg-panel">
    <table class="min-w-full text-left text-sm">
        <caption class="sr-only">Deals</caption>
        <thead class="border-b border-line bg-ground text-xs text-muted"><tr><th scope="col" class="px-3 py-2 font-medium">Deal</th><th scope="col" class="px-3 py-2 font-medium">Customer</th><th scope="col" class="px-3 py-2 font-medium">Vehicle</th><th scope="col" class="px-3 py-2 font-medium">Status</th><th scope="col" class="px-3 py-2 text-right font-medium">Total</th><th scope="col" class="px-3 py-2 font-medium">Salesperson</th></tr></thead>
        <tbody class="divide-y divide-line">
        @forelse ($deals as $d)
            <tr class="hover:bg-ground/60">
                <td class="px-3 py-2 font-medium"><a class="underline decoration-line underline-offset-2" href="{{ route('deals.show', $d) }}">{{ $d->deal_no }}</a><span class="block text-xs text-muted">{{ $d->created_at->format('d M Y') }}</span></td>
                <td class="px-3 py-2">{{ $d->customer->name }}</td>
                <td class="px-3 py-2">{{ $d->vehicle->display_name }}<span class="block text-xs text-muted">{{ $d->vehicle->stock_id }}</span></td>
                <td class="px-3 py-2"><span class="inline-flex rounded-full border px-2.5 py-0.5 text-xs font-semibold {{ $d->status->badge() }}">{{ $d->status->label() }}</span></td>
                <td class="px-3 py-2 text-right">KSh {{ number_format((float) $d->grand_total) }}<span class="block text-xs text-muted">{{ $d->payment_type === 'finance' ? 'Finance' : 'Cash' }}</span></td>
                <td class="px-3 py-2">{{ $d->salesperson?->name }}</td>
            </tr>
        @empty
            <tr><td colspan="6" class="px-3 py-10 text-center text-muted">No deals yet.</td></tr>
        @endforelse
        </tbody>
    </table>
</div>
<div class="mt-3">{{ $deals->links() }}</div>
@endsection