@extends('layouts.app')

@section('title', 'Araçlar')
@section('eyebrow', 'ARAÇ HAFIZASI')
@section('heading', 'Araçlar')

@section('top-actions')
    <a class="primary-button" href="{{ route('appointments.index', ['open' => 'new']) }}"><i data-lucide="plus"></i> Randevu ile Araç Ekle</a>
@endsection

@section('content')
<section class="panel list-panel">
    <header class="list-toolbar">
        <div><span class="section-kicker">FİLO & BİREYSEL</span><h2>{{ $vehicles->total() }} kayıtlı araç</h2><p>Plaka ve şasi numarası üzerinden araç geçmişini bulun.</p></div>
        <form class="filter-form" method="GET"><label class="search-input"><i data-lucide="search"></i><input name="q" value="{{ request('q') }}" placeholder="Plaka, VIN, marka veya model"></label><button class="secondary-button" type="submit">Ara</button></form>
    </header>
    <div class="table-wrap">
        <table class="data-table">
            <thead><tr><th>Plaka</th><th>Araç</th><th>Şasi numarası</th><th>Müşteri</th><th>Kilometre</th><th>Geçmiş</th></tr></thead>
            <tbody>
            @forelse($vehicles as $vehicle)
                <tr>
                    <td><span class="plate-badge">{{ $vehicle->plate }}</span></td>
                    <td><strong>{{ trim($vehicle->brand.' '.$vehicle->model) ?: 'Marka/model yok' }}</strong><small>{{ collect([$vehicle->year, $vehicle->fuel_type])->filter()->join(' · ') }}</small></td>
                    <td><strong class="vin-value">{{ $vehicle->vin ?: '—' }}</strong><small>{{ $vehicle->vin ? 'Parça tedarikine hazır' : 'VIN eklenmeli' }}</small></td>
                    <td><strong>{{ $vehicle->customer->name }}</strong><small>{{ $vehicle->customer->phone }}</small></td>
                    <td><strong>{{ $vehicle->mileage ? number_format($vehicle->mileage, 0, ',', '.').' km' : '—' }}</strong></td>
                    <td><span class="count-badge">{{ $vehicle->appointments_count }} randevu</span></td>
                </tr>
            @empty<tr><td colspan="6"><div class="empty-state"><i data-lucide="car-front"></i><strong>Araç bulunamadı</strong></div></td></tr>@endforelse
            </tbody>
        </table>
    </div>
    <x-pagination :paginator="$vehicles" />
</section>
@endsection