@extends('layouts.school')
@section('title', 'Staff Attendance')
@section('header', 'Staff Management')
@section('content')
    @php $sid = request()->route('schoolId'); @endphp

    <div class="mb-4 flex flex-wrap items-end justify-between gap-3">
        <form method="GET" class="flex items-end gap-2">
            <div>
                <label class="label">Date</label>
                <input type="date" name="date" value="{{ $date }}" max="{{ now()->toDateString() }}" class="input w-44">
            </div>
            <button type="submit" class="btn-secondary btn-sm">Load</button>
        </form>
        <a href="{{ route('school.staff.attendance.history', $sid) }}" class="btn-ghost btn-sm">View History</a>
    </div>

    <div class="grid grid-cols-2 gap-4 mb-6 lg:grid-cols-5">
        <div class="stat-card"><p class="page-subtitle">Present</p><p class="mt-1 text-3xl font-bold text-green-600">{{ $summary['present'] }}</p></div>
        <div class="stat-card"><p class="page-subtitle">Absent</p><p class="mt-1 text-3xl font-bold text-red-500">{{ $summary['absent'] }}</p></div>
        <div class="stat-card"><p class="page-subtitle">Late</p><p class="mt-1 text-3xl font-bold text-amber-500">{{ $summary['late'] }}</p></div>
        <div class="stat-card"><p class="page-subtitle">Excused</p><p class="mt-1 text-3xl font-bold text-blue-500">{{ $summary['excused'] }}</p></div>
        <div class="stat-card"><p class="page-subtitle">Unmarked</p><p class="mt-1 text-3xl font-bold text-gray-400">{{ $summary['unmarked'] }}</p></div>
    </div>

    <form method="POST" action="{{ route('school.staff.attendance.save', $sid) }}">
        @csrf
        <input type="hidden" name="date" value="{{ $date }}">
        <div class="card overflow-x-auto p-0">
            <table class="table-modern">
                <thead>
                    <tr><th>Staff Member</th><th>Designation</th><th>Status</th><th>Note</th></tr>
                </thead>
                <tbody>
                    @forelse ($members as $m)
                        @php $rec = $existing->get($m->id); @endphp
                        <tr class="hover:bg-gray-50">
                            <td>
                                <span class="text-sm font-medium text-gray-900">{{ $m->fullName() }}</span>
                                <span class="block text-xs text-gray-400">{{ $m->staff_no }}</span>
                                <input type="hidden" name="attendance[{{ $m->id }}][id]" value="{{ $m->id }}">
                            </td>
                            <td class="text-sm text-gray-600">{{ $m->designation?->name ?? '—' }}</td>
                            <td>
                                <select name="attendance[{{ $m->id }}][status]" class="select w-32 !py-1.5 text-sm">
                                    @foreach (['present' => 'Present', 'absent' => 'Absent', 'late' => 'Late', 'excused' => 'Excused'] as $v => $label)
                                        <option value="{{ $v }}" {{ ($rec?->status ?? 'present') === $v ? 'selected' : '' }}>{{ $label }}</option>
                                    @endforeach
                                </select>
                            </td>
                            <td><input type="text" name="attendance[{{ $m->id }}][note]" value="{{ $rec?->note }}" maxlength="255" class="input w-full max-w-xs !py-1.5 text-sm" placeholder="Optional note"></td>
                        </tr>
                    @empty
                        <tr><td colspan="4"><div class="empty-state">No active staff members.</div></td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
        <div class="mt-4 flex justify-end">
            <button type="submit" class="btn-primary">Save Attendance — {{ \Illuminate\Support\Carbon::parse($date)->format('D, d M Y') }}</button>
        </div>
    </form>
@endsection