@extends('layouts.admin')

@section('title', 'Datesheets')
@section('header-title', 'Datesheets')

@section('content')
<div class="p-6">
    <div class="flex items-center justify-between mb-6">
        <h1 class="text-2xl font-bold font-display text-ink-900">Exam Datesheets</h1>
        <a href="{{ route('admin.datesheets.create') }}" class="bg-seal-blue-700 text-white px-4 py-2 rounded hover:bg-seal-blue-700/90 text-sm font-medium">Create Datesheet</a>
    </div>

    <div class="bg-white border border-graphite-400/30 rounded p-6 mb-6">
        <h2 class="text-sm font-semibold text-ink-600 mb-3">Select Class & Year to View Schedule</h2>
        <form method="GET" action="{{ route('admin.datesheets.index') }}" class="flex gap-4 items-end">
            <div>
                <label class="block text-sm font-medium text-ink-600 mb-1">Class</label>
                <select name="class" required class="border border-graphite-400/50 rounded px-3 py-2 text-sm">
                    <option value="">Select Class</option>
                    @foreach([9, 10, 11, 12] as $class)
                        <option value="{{ $class }}" {{ $selectedClass == $class ? 'selected' : '' }}>Class {{ $class }}</option>
                    @endforeach
                </select>
            </div>
            <div>
                <label class="block text-sm font-medium text-ink-600 mb-1">Academic Year</label>
                <select name="year" required class="border border-graphite-400/50 rounded px-3 py-2 text-sm">
                    <option value="">Select Year</option>
                    @foreach($years as $year)
                        <option value="{{ $year }}" {{ $selectedYear == $year ? 'selected' : '' }}>{{ $year }}</option>
                    @endforeach
                </select>
            </div>
            <button type="submit" class="bg-seal-blue-700 text-white px-4 py-2 rounded hover:bg-seal-blue-700/90 text-sm">Show Schedule</button>
            @if($selectedClass || $selectedYear)
                <a href="{{ route('admin.datesheets.index') }}" class="text-graphite-400 hover:text-ink-600 text-sm py-2">Clear</a>
            @endif
        </form>
    </div>

    @if($selectedClass && $selectedYear)
    <div class="bg-white border border-graphite-400/30 rounded overflow-hidden mb-6">
        <div class="px-6 py-4 border-b border-graphite-400/30 bg-paper-50">
            <h2 class="text-lg font-semibold text-ink-900">
                Exam Schedule — Class {{ $selectedClass }} — {{ $selectedYear }}
            </h2>
        </div>

        @if($examSchedules->isEmpty())
        <div class="px-6 py-8 text-center">
            <p class="text-sm text-graphite-400">No exam schedules found for Class {{ $selectedClass }} in {{ $selectedYear }}.</p>
            <p class="text-xs text-graphite-400 mt-1">Add subjects to an exam for this class/year, then create a datesheet.</p>
        </div>
        @else
            @foreach($examSchedules as $date => $daySchedules)
            <div class="px-6 py-4 border-b border-paper-100 last:border-b-0">
                <h3 class="text-sm font-bold text-ink-600 mb-3">{{ $date }}</h3>
                <table class="min-w-full divide-y divide-graphite-400/30">
                    <thead class="bg-paper-50">
                        <tr>
                            <th class="px-4 py-2 text-left text-xs font-medium text-graphite-400 uppercase">Exam</th>
                            <th class="px-4 py-2 text-left text-xs font-medium text-graphite-400 uppercase">Subject</th>
                            <th class="px-4 py-2 text-left text-xs font-medium text-graphite-400 uppercase">Code</th>
                            <th class="px-4 py-2 text-left text-xs font-medium text-graphite-400 uppercase">Time</th>
                            <th class="px-4 py-2 text-left text-xs font-medium text-graphite-400 uppercase">Duration</th>
                            <th class="px-4 py-2 text-left text-xs font-medium text-graphite-400 uppercase">Marks</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y divide-paper-100">
                        @foreach($daySchedules as $schedule)
                        <tr>
                            <td class="px-4 py-2 text-sm text-graphite-400">{{ $schedule->subject->exam->name ?? '-' }}</td>
                            <td class="px-4 py-2 text-sm font-medium text-ink-900">{{ $schedule->subject->name ?? '-' }}</td>
                            <td class="px-4 py-2 text-sm text-graphite-400">{{ $schedule->subject->code ?? '-' }}</td>
                            <td class="px-4 py-2 text-sm text-graphite-400">{{ $schedule->start_time }} - {{ $schedule->end_time }}</td>
                            <td class="px-4 py-2 text-sm text-graphite-400">{{ $schedule->subject->duration_minutes ?? '-' }} min</td>
                            <td class="px-4 py-2 text-sm text-graphite-400">{{ $schedule->subject->total_marks ?? '-' }}</td>
                        </tr>
                        @endforeach
                    </tbody>
                </table>
            </div>
            @endforeach

            @if($exams->isNotEmpty())
            <div class="px-6 py-4 bg-paper-50 border-t border-graphite-400/30">
                <p class="text-xs text-graphite-400">
                    {{ $exams->count() }} exam(s) found with {{ $examSchedules->flatten()->count() }} total schedule(s).
                </p>
            </div>
            @endif
        @endif
    </div>
    @endif

    <div class="flex items-center justify-between mb-4 mt-8">
        <h2 class="text-lg font-semibold text-ink-900">Issued Datesheets</h2>
        <form method="GET" class="flex gap-3 items-end">
            @if($selectedClass)
                <input type="hidden" name="class" value="{{ $selectedClass }}">
            @endif
            @if($selectedYear)
                <input type="hidden" name="year" value="{{ $selectedYear }}">
            @endif
            <input type="text" name="search" value="{{ request('search') }}" placeholder="Search datesheets..."
                   class="border border-graphite-400/50 rounded px-3 py-2 text-sm w-48">
            <select name="status" class="border border-graphite-400/50 rounded px-3 py-2 text-sm">
                <option value="">All Status</option>
                <option value="draft" {{ request('status') == 'draft' ? 'selected' : '' }}>Draft</option>
                <option value="issued" {{ request('status') == 'issued' ? 'selected' : '' }}>Issued</option>
            </select>
            <button type="submit" class="bg-ink-600 text-white px-3 py-2 rounded hover:bg-ink-900 text-sm">Filter</button>
        </form>
    </div>

    <div class="bg-white border border-graphite-400/30 rounded overflow-hidden">
        <table class="min-w-full divide-y divide-graphite-400/30">
            <thead class="bg-paper-50">
                <tr>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Title</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Exam</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Class</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Version</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Status</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Issued By</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Issued At</th>
                    <th class="px-6 py-3 text-left text-xs font-medium text-graphite-400 uppercase">Actions</th>
                </tr>
            </thead>
            <tbody class="bg-white divide-y divide-graphite-400/30">
                @forelse($datesheets as $datesheet)
                <tr>
                    <td class="px-6 py-4 text-sm font-medium text-ink-900">
                        <a href="{{ route('admin.datesheets.show', $datesheet) }}" class="text-seal-blue-700 hover:text-blue-800">{{ $datesheet->title }}</a>
                    </td>
                    <td class="px-6 py-4 text-sm text-ink-900">{{ $datesheet->exam->name ?? '-' }}</td>
                    <td class="px-6 py-4 text-sm text-ink-900">{{ $datesheet->exam->class ?? '-' }}</td>
                    <td class="px-6 py-4 text-sm text-ink-900">v{{ $datesheet->version }}</td>
                    <td class="px-6 py-4 text-sm">
                        @if($datesheet->status === 'issued')
                            <span class="px-2 py-1 text-xs font-medium rounded-full bg-ledger-green-700/10 text-ledger-green-700">Issued</span>
                        @else
                            <span class="px-2 py-1 text-xs font-medium rounded-full bg-amber-600/10 text-amber-600">Draft</span>
                        @endif
                    </td>
                    <td class="px-6 py-4 text-sm text-ink-900">{{ $datesheet->issuer->name ?? '-' }}</td>
                    <td class="px-6 py-4 text-sm text-ink-900">{{ $datesheet->issued_at?->format('d M Y H:i') ?? '-' }}</td>
                    <td class="px-6 py-4 text-sm">
                        <div class="flex gap-2">
                            <a href="{{ route('admin.datesheets.show', $datesheet) }}" class="text-seal-blue-700 hover:text-blue-800">View</a>
                            <a href="{{ route('admin.datesheets.printable', $datesheet) }}" class="text-ink-600 hover:text-ink-900" target="_blank">Print</a>
                            @if($datesheet->status === 'draft')
                                <a href="{{ route('admin.datesheets.edit', $datesheet) }}" class="text-indigo-600 hover:text-indigo-800">Edit</a>
                            @endif
                        </div>
                    </td>
                </tr>
                @empty
                <tr>
                    <td colspan="8" class="px-6 py-4 text-sm text-graphite-400 text-center">No datesheets found.</td>
                </tr>
                @endforelse
            </tbody>
        </table>
    </div>

    <div class="mt-4">
        {{ $datesheets->links() }}
    </div>
</div>
@endsection