@extends('layouts.siswa')
@section('title', 'Dashboard Siswa')
@section('page-title', 'Riwayat & Statistik')

@section('siswa-content')
@php
    $kolomJamAbsensi = \Illuminate\Support\Facades\Schema::hasColumn('absensi_siswa', 'waktu_catat');
@endphp
@if($stats)
    <div class="grid grid-cols-1 gap-4 md:grid-cols-4">
        <x-card pad="p-4" class="bg-emerald-50 border-emerald-200">
            <div class="text-xs font-bold uppercase tracking-wide text-emerald-700">Hadir</div>
            <div class="mt-1 text-2xl font-black text-emerald-900">{{ $stats['hadir'] }}</div>
        </x-card>
        <x-card pad="p-4" class="bg-amber-50 border-amber-200">
            <div class="text-xs font-bold uppercase tracking-wide text-amber-700">Sakit</div>
            <div class="mt-1 text-2xl font-black text-amber-900">{{ $stats['sakit'] }}</div>
        </x-card>
        <x-card pad="p-4" class="bg-sky-50 border-sky-200">
            <div class="text-xs font-bold uppercase tracking-wide text-sky-700">Izin</div>
            <div class="mt-1 text-2xl font-black text-sky-900">{{ $stats['izin'] }}</div>
        </x-card>
        <x-card pad="p-4" class="bg-rose-50 border-rose-200">
            <div class="text-xs font-bold uppercase tracking-wide text-rose-700">Alpha</div>
            <div class="mt-1 text-2xl font-black text-rose-900">{{ $stats['alpha'] }}</div>
        </x-card>
    </div>

    <div class="mt-6">
        <x-table title="Riwayat Absensi" subtitle="Menampilkan 30 data terakhir.">
            <table class="min-w-full divide-y divide-slate-200">
                <thead class="bg-slate-50">
                    <tr>
                        <th class="px-5 py-3 text-left text-xs font-bold uppercase tracking-wide text-slate-500">Tanggal</th>
                        <th class="px-5 py-3 text-left text-xs font-bold uppercase tracking-wide text-slate-500">Status</th>
                        @if($kolomJamAbsensi)
                        <th class="px-5 py-3 text-left text-xs font-bold uppercase tracking-wide text-slate-500">Jam tiba</th>
                        @endif
                        <th class="px-5 py-3 text-left text-xs font-bold uppercase tracking-wide text-slate-500">Keterangan</th>
                    </tr>
                </thead>
                <tbody class="divide-y divide-slate-200">
                    @foreach($riwayat as $r)
                        @php
                            $isLibur = $r->status === 'alpha' && \Illuminate\Support\Str::startsWith($r->keterangan ?? '', 'Libur');
                            $badgeStatus = $isLibur ? 'libur' : ($r->status ?? '');
                        @endphp
                        <tr class="hover:bg-slate-50/70">
                            <td class="px-5 py-3 text-sm font-semibold text-slate-900">{{ $r->tanggal->format('d/m/Y') }}</td>
                            <td class="px-5 py-3 text-sm"><x-badge-status :status="$badgeStatus" /></td>
                            @if($kolomJamAbsensi)
                            <td class="px-5 py-3 text-sm text-slate-600">
                                @if($r->waktu_catat)
                                    <span class="font-semibold text-slate-800">{{ $r->waktu_catat->timezone(config('app.timezone'))->format('H:i') }}</span>
                                    @if((int) ($r->menit_telat ?? 0) > 0)
                                        <span class="ml-1 text-xs font-bold text-amber-700">Telat {{ (int) $r->menit_telat }}m</span>
                                    @endif
                                @else
                                    -
                                @endif
                            </td>
                            @endif
                            <td class="px-5 py-3 text-sm text-slate-600">{{ $r->keterangan ?? '-' }}</td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </x-table>
    </div>
@else
    <x-card pad="p-5" class="border-amber-200 bg-amber-50">
        <div class="text-sm font-semibold text-amber-900">Data siswa tidak ditemukan</div>
        <div class="mt-1 text-sm text-amber-800">Pastikan akun Anda terhubung ke data siswa pada tabel `siswa`.</div>
    </x-card>
@endif
@endsection