@extends('layouts.montir')

@section('title', 'Inspeksi Saya')

@section('content')
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">

    <!-- ================= HEADER ================= -->
    <div class="flex flex-col md:flex-row md:items-center md:justify-between gap-4 mb-8">
        <div>
            <h1 class="text-3xl font-extrabold text-gray-800">
                Inspeksi Saya
            </h1>
            <p class="text-gray-500 mt-1">
                Daftar inspeksi yang telah dan sedang kamu kerjakan
            </p>
        </div>

        <a href="{{ route('montir.inspection.step1') }}"
           class="inline-flex items-center gap-2 px-5 py-3 rounded-xl
                  bg-amber-600 text-white font-semibold
                  hover:bg-amber-700 transition">
            <i class="fas fa-plus"></i>
            Inspeksi Baru
        </a>
    </div>

    <!-- ================= TABLE CARD ================= -->
    <div class="bg-white rounded-2xl shadow-sm border overflow-hidden">

        <div class="overflow-x-auto">
            <table class="min-w-full text-sm">
                <thead class="bg-gray-50 border-b">
                    <tr class="text-left text-gray-600">
                        <th class="px-6 py-4 font-semibold">Tanggal</th>
                        <th class="px-6 py-4 font-semibold">Customer</th>
                        <th class="px-6 py-4 font-semibold">Progress</th>
                        <th class="px-6 py-4 font-semibold">Status</th>
                        <th class="px-6 py-4 font-semibold text-center w-[220px]">Aksi</th>
                    </tr>
                </thead>

                <tbody class="divide-y">
                @forelse($inspeksi as $item)
                    <tr class="hover:bg-gray-50 transition">
                        <!-- Tanggal -->
                        <td class="px-6 py-4 text-gray-700">
                            {{ $item->inspection_date?->format('d/m/Y') ?? '-' }}
                        </td>

                        <!-- Customer -->
                        <td class="px-6 py-4 font-medium text-gray-800">
                            {{ $item->customer_name }}
                        </td>

                        <!-- Progress -->
                        <td class="px-6 py-4">
                            <span class="font-semibold text-gray-700">
                                {{ $item->current_step }}/20
                            </span>
                        </td>

                        <!-- Status -->
                        <td class="px-6 py-4">
                            @if($item->status === 'draft')
                                <span class="px-3 py-1 rounded-full text-xs font-semibold
                                             bg-gray-200 text-gray-700">
                                    Draft
                                </span>
                            @elseif($item->status === 'pending')
                                <span class="px-3 py-1 rounded-full text-xs font-semibold
                                             bg-amber-100 text-amber-700">
                                    Pending
                                </span>
                            @elseif($item->status === 'selesai')
                                <span class="px-3 py-1 rounded-full text-xs font-semibold
                                             bg-green-100 text-green-700">
                                    Selesai
                                </span>
                            @else
                                <span class="px-3 py-1 rounded-full text-xs font-semibold
                                             bg-red-100 text-red-700">
                                    Dibatalkan
                                </span>
                            @endif
                        </td>

                        <!-- Aksi -->
                        <td class="px-6 py-4">
                            <div class="flex justify-center gap-2">

                                <!-- Detail -->
                                <a href="{{ route('montir.my-inspeksi.show', $item->id) }}"
                                   class="px-3 py-2 text-xs font-semibold rounded-lg
                                          bg-sky-100 text-sky-700
                                          hover:bg-sky-200 transition">
                                    Detail
                                </a>

                                @php
                                    $stepRoutes = [
                                        1 => 'montir.inspection.step1',
                                        2 => 'montir.inspection.general',
                                        3 => 'montir.inspection.eksterior',
                                        4 => 'montir.inspection.ketebalan-cat',
                                        5 => 'montir.inspection.interior',
                                        6 => 'montir.inspection.alat',
                                        7 => 'montir.inspection.mesin',
                                        8 => 'montir.inspection.kaki',
                                        9 => 'montir.inspection.dokumen',
                                        10 => 'montir.inspection.data-kendaraan',
                                        11 => 'montir.inspection.kelengkapan',
                                        12 => 'montir.inspection.hasil-inspeksi',
                                        13 => 'montir.inspection.penilaian-fitur',
                                        14 => 'montir.inspection.penilaian-mesin',
                                        15 => 'montir.inspection.penilaian-interior',
                                        16 => 'montir.inspection.penilaian-eksterior',
                                        17 => 'montir.inspection.penilaian-ban',
                                        18 => 'montir.inspection.penilaian-test-drive',
                                        19 => 'montir.inspection.penilaian-tools-test',
                                        20 => 'montir.inspection.finalisasi',
                                    ];

                                    $routeName = $stepRoutes[$item->current_step] ?? null;
                                @endphp

                                <!-- Lanjutkan -->
                                @if($item->status === 'draft' && $routeName)
                                    <a href="{{ route($routeName, $item->id) }}"
                                       class="px-3 py-2 text-xs font-semibold rounded-lg
                                              bg-amber-600 text-white
                                              hover:bg-amber-700 transition">
                                        Lanjutkan
                                    </a>
                                @endif

                            </div>
                        </td>
                    </tr>
                @empty
                    <tr>
                        <td colspan="5" class="text-center py-16">
                            <p class="text-gray-500 mb-4">
                                Belum ada inspeksi yang dibuat
                            </p>
                            <a href="{{ route('montir.inspection.step1') }}"
                               class="inline-flex items-center gap-2 px-5 py-3
                                      bg-amber-600 text-white rounded-xl font-semibold
                                      hover:bg-amber-700 transition">
                                <i class="fas fa-plus"></i>
                                Buat Inspeksi Pertama
                            </a>
                        </td>
                    </tr>
                @endforelse
                </tbody>
            </table>
        </div>

        <!-- ================= PAGINATION ================= -->
        <div class="px-6 py-4 border-t">
            {{ $inspeksi->links() }}
        </div>

    </div>
</div>
@endsection