@extends('layouts.app')

@section('content')
<div class="w-full px-4 pb-60">
    <div class="grid items-start max-w-2xl grid-cols-1 grid-rows-1 gap-4 mx-auto lg:mx-0 lg:max-w-none lg:grid-cols-5">
        <div class="grid gap-4 lg:col-span-5">

            <!-- Header -->
            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-4">
                <div class="sm:flex sm:items-center sm:justify-between">
                    <div class="sm:flex-auto">
                        <h1 class="text-base font-semibold text-stone-900">Rezervasyonlar - {{ $restaurant->name }}</h1>
                        <p class="mt-2 text-xs text-stone-700">Tüm rezervasyonları görüntüleyin ve yönetin.</p>
                    </div>
                    <div class="mt-4 sm:ml-16 sm:mt-0 sm:flex-none flex gap-2">
                        <a href="{{ route('admin.restaurants.reservations.today', $restaurant) }}"
                            class="block px-3 py-2 text-sm font-semibold text-center text-white rounded-md shadow-sm bg-green-600 hover:bg-green-500">
                            BUGÜNKÜ REZERVASYONLAR
                        </a>
                        <a href="{{ route('admin.dashboard', $selectedRestaurant ? ['restaurant_id' => $selectedRestaurant->id] : []) }}"
                            class="block px-3 py-2 text-sm font-semibold text-center text-stone-700 rounded-md shadow-sm ring-1 ring-inset ring-stone-300 hover:bg-stone-50">
                            DASHBOARD'A DÖN
                        </a>
                    </div>
                </div>
            </div>

            <!-- Filters -->
            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-4">
                <form method="GET" action="{{ route('admin.restaurants.reservations.index', $restaurant) }}"
                    class="grid grid-cols-1 md:grid-cols-4 gap-4">
                    <div>
                        <label class="block text-xs font-medium text-stone-700 mb-1">Ara</label>
                        <input type="text" name="search" value="{{ request('search') }}"
                            placeholder="İsim, kod veya email"
                            class="block w-full rounded-md border-stone-300 shadow-sm focus:border-stone-500 focus:ring-stone-500 sm:text-sm">
                    </div>

                    <div>
                        <label class="block text-xs font-medium text-stone-700 mb-1">Durum</label>
                        <select name="status"
                            class="block w-full rounded-md border-stone-300 shadow-sm focus:border-stone-500 focus:ring-stone-500 sm:text-sm">
                            <option value="">Tüm Durumlar</option>
                            <option value="pending_payment" {{ request('status')=='pending_payment' ? 'selected' : ''
                                }}>Ödeme Bekliyor</option>
                            <option value="paid" {{ request('status')=='paid' ? 'selected' : '' }}>Ödendi</option>
                            <option value="confirmed" {{ request('status')=='confirmed' ? 'selected' : '' }}>Onaylandı
                            </option>
                            <option value="cancelled" {{ request('status')=='cancelled' ? 'selected' : '' }}>İptal
                                Edildi</option>
                            <option value="completed" {{ request('status')=='completed' ? 'selected' : '' }}>Tamamlandı
                            </option>
                        </select>
                    </div>

                    <div>
                        <label class="block text-xs font-medium text-stone-700 mb-1">Başlangıç Tarihi</label>
                        <input type="date" name="date_from" value="{{ request('date_from') }}"
                            class="block w-full rounded-md border-stone-300 shadow-sm focus:border-stone-500 focus:ring-stone-500 sm:text-sm">
                    </div>

                    <div class="flex items-end">
                        <button type="submit"
                            class="w-full px-3 py-2 text-sm font-semibold text-white rounded-md shadow-sm bg-stone-600 hover:bg-stone-500">
                            Filtrele
                        </button>
                    </div>
                </form>
            </div>

            <!-- Reservations Table -->
            @if($reservations->count() > 0)
            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-4">
                <div class="-mx-4 ring-1 ring-stone-200 sm:mx-0 sm:rounded">
                    <table class="relative min-w-full divide-y divide-gray-200">
                        <thead class="bg-violet-50">
                            <tr>
                                <th scope="col"
                                    class="py-2 pl-4 pr-3 text-sm font-semibold text-left text-stone-900 sm:pl-6">
                                    Kod
                                </th>
                                <th scope="col" class="px-3 py-2 text-sm font-semibold text-left text-stone-900">
                                    Misafir
                                </th>
                                <th scope="col"
                                    class="hidden px-3 py-2 text-sm font-semibold text-left text-stone-900 lg:table-cell">
                                    Tarih/Saat
                                </th>
                                <th scope="col"
                                    class="hidden px-3 py-2 text-sm font-semibold text-left text-stone-900 lg:table-cell">
                                    Kişi
                                </th>
                                <th scope="col"
                                    class="hidden px-3 py-2 text-sm font-semibold text-left text-stone-900 lg:table-cell">
                                    Masa
                                </th>
                                <th scope="col" class="px-3 py-2 text-sm font-semibold text-left text-stone-900">
                                    Durum
                                </th>
                                <th scope="col" class="py-2 pl-3 pr-4 sm:pr-6">
                                    <span class="sr-only">İşlemler</span>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($reservations as $reservation)
                            <tr>
                                <td class="relative py-4 pl-4 pr-3 text-sm sm:pl-6">
                                    <div class="font-mono font-medium text-stone-900">{{ $reservation->confirmation_code
                                        }}</div>
                                </td>
                                <td class="px-3 py-3.5">
                                    <div class="text-sm font-medium text-stone-900">{{ $reservation->customer_name }}
                                    </div>
                                    <div class="text-xs text-stone-500">{{ $reservation->customer_email }}</div>
                                </td>
                                <td class="hidden px-3 py-3.5 text-sm lg:table-cell">
                                    <div class="text-stone-900">{{
                                        \Carbon\Carbon::parse($reservation->reservation_date)->format('d.m.Y') }}</div>
                                    <div class="text-stone-500">{{ substr($reservation->reservation_time, 0, 5) }}</div>
                                </td>
                                <td class="hidden px-3 py-3.5 text-sm text-stone-500 lg:table-cell">{{
                                    $reservation->party_size }} kişi</td>
                                <td class="hidden px-3 py-3.5 text-sm text-stone-500 lg:table-cell">{{
                                    $reservation->table->name ?? '-' }}</td>
                                <td class="px-3 py-3.5 text-sm">
                                    @php
                                    $statusColors = [
                                    'pending_payment' => 'bg-yellow-100 text-yellow-800',
                                    'paid' => 'bg-green-100 text-green-800',
                                    'confirmed' => 'bg-blue-100 text-blue-800',
                                    'cancelled' => 'bg-red-100 text-red-800',
                                    'completed' => 'bg-gray-100 text-gray-800',
                                    ];
                                    $statusLabels = [
                                    'pending_payment' => 'Ödeme Bekliyor',
                                    'paid' => 'Ödendi',
                                    'confirmed' => 'Onaylandı',
                                    'cancelled' => 'İptal',
                                    'completed' => 'Tamamlandı',
                                    ];
                                    @endphp
                                    <span
                                        class="inline-flex items-center px-2 py-1 rounded-full text-xs font-medium {{ $statusColors[$reservation->status] }}">
                                        {{ $statusLabels[$reservation->status] }}
                                    </span>
                                </td>
                                <td class="relative py-3.5 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
                                    <a href="{{ route('admin.restaurants.reservations.show', [$restaurant, $reservation]) }}"
                                        class="text-stone-600 hover:text-stone-900 mr-2">Detay</a>

                                    @if($reservation->status === 'pending_payment')
                                    <form
                                        action="{{ route('admin.restaurants.reservations.confirm', [$restaurant, $reservation]) }}"
                                        method="POST" class="inline">
                                        @csrf
                                        <button type="submit"
                                            class="text-green-600 hover:text-green-900 mr-2">Onayla</button>
                                    </form>
                                    @endif

                                    @if(in_array($reservation->status, ['pending_payment', 'paid', 'confirmed']))
                                    <form
                                        action="{{ route('admin.restaurants.reservations.cancel', [$restaurant, $reservation]) }}"
                                        method="POST" class="inline"
                                        onsubmit="return confirm('Bu rezervasyonu iptal etmek istediğinizden emin misiniz?');">
                                        @csrf
                                        <button type="submit"
                                            class="text-red-600 hover:text-red-900 mr-2">İptal</button>
                                    </form>
                                    @endif

                                    @if($reservation->status === 'confirmed')
                                    <form
                                        action="{{ route('admin.restaurants.reservations.complete', [$restaurant, $reservation]) }}"
                                        method="POST" class="inline">
                                        @csrf
                                        <button type="submit" class="text-blue-600 hover:text-blue-900">Tamamla</button>
                                    </form>
                                    @endif
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <div class="mt-4">
                    {{ $reservations->links() }}
                </div>
            </div>
            @else
            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-12 text-center">
                <span class="material-symbols-rounded text-6xl text-stone-300 mb-4">event_busy</span>
                <p class="text-stone-500">Rezervasyon bulunamadı.</p>
            </div>
            @endif

        </div>
    </div>
</div>
@endsection