@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">

            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-4">
                <div class="sm:flex sm:items-center">
                    <div class="sm:flex-auto">
                        <h1 class="text-base font-semibold text-stone-900">Engellenen Tarihler - {{ $restaurant->name }}
                        </h1>
                        <p class="mt-2 text-xs text-stone-700">Rezervasyon için kapalı olacak tarihleri yönetin.</p>
                    </div>
                </div>
            </div>

            @if(session('success'))
            <div class="bg-green-50 border border-green-200 rounded-lg p-4">
                <div class="flex items-center">
                    <span class="material-symbols-rounded text-green-600 mr-2">check_circle</span>
                    <span class="text-green-800 text-sm">{{ session('success') }}</span>
                </div>
            </div>
            @endif

            <!-- Add Blocked Date Form -->
            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-4">
                <h2 class="text-base font-semibold text-stone-900 mb-4">Yeni Tarih Engelle</h2>
                <form action="{{ route('admin.restaurants.blocked-dates.store', $restaurant) }}" method="POST">
                    @csrf
                    <div class="grid grid-cols-1 md:grid-cols-4 gap-4">
                        <div class="md:col-span-2">
                            <label for="date" class="block text-sm font-medium text-stone-900">Tarih</label>
                            <input type="date" name="date" id="date" value="{{ old('date') }}" min="{{ date('Y-m-d') }}"
                                required
                                class="mt-1 block w-full rounded-md border-stone-300 shadow-sm focus:border-stone-500 focus:ring-stone-500 sm:text-sm">
                            @error('date')
                            <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                            @enderror
                        </div>
                        <div class="md:col-span-2">
                            <label for="reason" class="block text-sm font-medium text-stone-900">Neden
                                (Opsiyonel)</label>
                            <input type="text" name="reason" id="reason" value="{{ old('reason') }}"
                                placeholder="Örn: Tatil, Bakım"
                                class="mt-1 block w-full rounded-md border-stone-300 shadow-sm focus:border-stone-500 focus:ring-stone-500 sm:text-sm">
                            @error('reason')
                            <p class="mt-1 text-xs text-red-600">{{ $message }}</p>
                            @enderror
                        </div>
                    </div>
                    <div class="mt-4 flex items-center justify-end">
                        <button type="submit"
                            class="px-3 py-2 text-sm font-semibold text-white rounded-md shadow-sm bg-stone-600 hover:bg-stone-500">
                            Tarihi Engelle
                        </button>
                    </div>
                </form>
            </div>

            <!-- Blocked Dates List -->
            <div class="bg-white rounded-lg shadow ring-1 ring-stone-300 p-4">
                @if($blockedDates->count() > 0)
                <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">
                                    Tarih
                                </th>
                                <th scope="col" class="px-3 py-2 text-sm font-semibold text-left text-stone-900">
                                    Gün
                                </th>
                                <th scope="col"
                                    class="hidden px-3 py-2 text-sm font-semibold text-left text-stone-900 lg:table-cell">
                                    Neden
                                </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($blockedDates as $blockedDate)
                            <tr>
                                <td class="relative py-4 pl-4 pr-3 text-sm sm:pl-6">
                                    <div class="font-medium text-stone-900">
                                        {{ \Carbon\Carbon::parse($blockedDate->date)->format('d.m.Y') }}
                                    </div>
                                </td>
                                <td class="px-3 py-3.5 text-sm text-stone-500">
                                    {{ \Carbon\Carbon::parse($blockedDate->date)->isoFormat('dddd') }}
                                </td>
                                <td class="hidden px-3 py-3.5 text-sm text-stone-500 lg:table-cell">
                                    {{ $blockedDate->reason ?? '-' }}
                                </td>
                                <td class="relative py-3.5 pl-3 pr-4 text-right text-sm font-medium sm:pr-6">
                                    <form
                                        action="{{ route('admin.restaurants.blocked-dates.destroy', [$restaurant, $blockedDate]) }}"
                                        method="POST" class="inline"
                                        onsubmit="return confirm('Bu engellemeyi kaldırmak istediğinizden emin misiniz?');">
                                        @csrf
                                        @method('DELETE')
                                        <button type="submit" class="text-red-600 hover:text-red-900">Engeli
                                            Kaldır</button>
                                    </form>
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <div class="mt-4">
                    {{ $blockedDates->links() }}
                </div>
                @else
                <div class="py-8 text-center">
                    <div class="text-sm text-stone-400">Engellenmiş tarih bulunmamaktadır</div>
                </div>
                @endif
            </div>

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