@extends('layouts.app')

@section('title', 'Attendance Report')

@section('content')
    <div class="flex flex-col gap-6">
        <div class="flex items-end justify-between gap-3">
            <div>
                <h1 class="text-lg font-semibold">Attendance Report</h1>
                <p class="text-xs text-muted-foreground">Daily present/absent grid for a class over a date range</p>
            </div>
        </div>

        <div class="rounded-xl border border-border bg-card">
            <form method="get" action="{{ route('students.attendance-report') }}" class="flex flex-wrap items-end gap-3 p-3">
                <div class="flex flex-col gap-1.5">
                    <label class="text-xs text-muted-foreground">Class</label>
                    <select name="class" class="h-9 rounded-lg border border-input bg-transparent px-3 text-sm outline-none focus-visible:border-ring">
                        @foreach (\App\Models\Student::FORMS as $f)
                            <option value="{{ $f }}" @selected($class === $f)>{{ $f }}</option>
                        @endforeach
                    </select>
                </div>
                <div class="flex flex-col gap-1.5">
                    <label class="text-xs text-muted-foreground">From</label>
                    <input type="date" name="from" value="{{ $from }}" class="h-9 rounded-lg border border-input bg-transparent px-3 text-sm outline-none focus-visible:border-ring">
                </div>
                <div class="flex flex-col gap-1.5">
                    <label class="text-xs text-muted-foreground">To</label>
                    <input type="date" name="to" value="{{ $to }}" class="h-9 rounded-lg border border-input bg-transparent px-3 text-sm outline-none focus-visible:border-ring">
                </div>
                <button class="h-9 rounded-lg bg-primary px-3 text-sm font-medium text-primary-foreground hover:bg-primary/90">Generate</button>
            </form>
        </div>

        <div class="overflow-x-auto rounded-xl border border-border bg-card">
            <table class="w-full text-sm">
                <thead>
                    <tr class="border-b">
                        <th class="px-3 py-2 text-left text-xs uppercase text-muted-foreground">Student</th>
                        @foreach ($dates as $d)
                            <th class="px-1 py-2 text-center text-[11px] text-muted-foreground">{{ \Carbon\Carbon::parse($d)->format('d/m') }}</th>
                        @endforeach
                        <th class="px-3 py-2 text-center text-xs uppercase text-muted-foreground">Days</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($students as $s)
                        @php $t = $totals[$s->id]; @endphp
                        <tr class="border-b last:border-0">
                            <td class="whitespace-nowrap px-3 py-1.5">
                                <span class="font-medium">{{ $s->full_name }}</span>
                                <span class="text-xs text-muted-foreground"> · {{ $s->stream }}</span>
                            </td>
                            @foreach ($dates as $d)
                                @php $v = $map[$s->id][$d] ?? '-'; @endphp
                                <td class="px-1 py-1.5 text-center font-mono text-xs {{ $v === 'P' ? 'text-emerald-600' : ($v === 'A' ? 'text-destructive' : 'text-muted-foreground/50') }}">{{ $v }}</td>
                            @endforeach
                            <td class="px-3 py-1.5 text-center tabular-nums text-xs">
                                {{ $t['present'] }}/{{ $t['days'] }}
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>

        <div>
            <a href="{{ route('students.attendance-sheet', ['class' => $class, 'date' => $to]) }}"
               onclick="window.open(this.href,'print','width=1000,height=800');return false;"
               class="rounded-lg border border-border px-4 py-2 text-sm hover:bg-accent">Mark Today's Register</a>
        </div>
    </div>
@endsection