@extends('layouts.app')

@section('tajuk', 'Senarai Sesi Taklimat')

@section('kandungan')
    <div class="kad">
        <div style="display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap; gap:0.5rem;">
            <h1 class="mb-0">Sesi Taklimat</h1>
            <div class="baris-tindakan">
                <a href="{{ route('sesi.eksport') }}" class="btn btn-luar">⬇ Export Kehadiran</a>
                <a href="{{ route('sesi.create') }}" class="btn">+ Cipta Sesi</a>
            </div>
        </div>
    </div>

    @if ($sesi->isEmpty())
        <div class="kad teks-tengah">
            <p>Tiada sesi taklimat lagi. Cipta sesi pertama anda.</p>
        </div>
    @else
        <div class="kad" style="overflow-x:auto; padding:0;">
            <table class="jadual">
                <thead>
                    <tr>
                        <th>Tarikh</th>
                        <th>DUN</th>
                        <th>Sesi</th>
                        <th>Lokasi</th>
                        <th>Hadir</th>
                        <th>Status</th>
                        <th>Tindakan</th>
                    </tr>
                </thead>
                <tbody>
                    @foreach ($sesi as $s)
                        <tr>
                            <td>{{ $s->tarikh->format('d/m/Y') }}</td>
                            <td>{{ $s->dun->code ?? '' }} {{ $s->dun->nama ?? '-' }}</td>
                            <td>{{ $s->nama }}</td>
                            <td>{{ $s->lokasi }}</td>
                            <td>{{ $s->kehadiran_count }}</td>
                            <td>
                                @if ($s->is_active)
                                    <span class="lencana lencana-hijau">Aktif</span>
                                @else
                                    <span class="lencana lencana-kelabu">Ditutup</span>
                                @endif
                            </td>
                            <td>
                                <div class="baris-tindakan">
                                    <a href="{{ route('sesi.show', $s) }}" class="btn btn-kecil">Urus</a>
                                    <a href="{{ route('pengurus.senarai', $s) }}" class="btn btn-kecil btn-luar">Senarai</a>
                                </div>
                            </td>
                        </tr>
                    @endforeach
                </tbody>
            </table>
        </div>
    @endif
@endsection