@extends('layouts.print.potrait')

@section('content')
<style>
    table {
        width: 100%;
    }
    th, td {
        border: 0.2px solid #ddd;
    }
    th {
        background-color: #f4f4f4;
        color: #333;
    }
    td {
        vertical-align: center;
    }
    .slot {
        font-weight: bold;
        background-color: #e0e0e0;
    }
    .empty-cell {
        background-color: #ffffff;
    }
</style>

<section class="print w-100" id="print-report">
    <div class="row">
        <div class="col-12">
            <div class="row">
                <div class="col-12">
                    <p class="card-title">Rekod Kehadiran Pelajar Harian - {{$kelas}}</p>
                    <p style="font-size: 12px;"><b>Sekolah :</b> {{ $teacher->mrsm_name }}</p>
                    <p style="font-size: 12px;"><b>Kelas :</b> {{ $kelas }}</p>
                </div>                                      
            </div>                        
            <div class="row justify-content">
                <div class="col my-0 py-0">
                        <div class="table-responsive">
                            <table class="table sm table-bordered">
                                <thead class="thead-light" style="font-size: 12px;">
                                    <tr style="font-size: 14px;">
                                        <th scope="col" style="width: 10%;">Bil.</th>
                                        <th scope="col" class="text-justify" style="width: 20%;">ID Pelajar</th>
                                        <th scope="col" class="text-justify" style="width: 40%;">Nama Pelajar</th>
                                        <th scope="col" class="text-center" style="width: 15%;">Masa Masuk</th>
                                        <th scope="col" class="text-center" style="width: 15%;">Masa Keluar</th>
                                    </tr>
                                </thead>
                                <tbody style="font-size: 10px;">
                                    @php
                                        $currentDate = null;
                                        $rowNumber = 1; // Initialize row number
                                    @endphp
    
                                    @foreach($attendance as $att)
                                        @if ($att->att_date != $currentDate)
                                            @php
                                                // Reset row number for a new date
                                                $currentDate = $att->att_date;
                                                $currentDay = $att->att_day;
                                                $rowNumber = 1; // Reset row number
                                            @endphp
                                            <tr style="font-size: 12px;">
                                                <td colspan="5" class="font-weight-bold text-justify" style="background-color: #f0f0f0; color: #333; border-top: 2px solid #ccc; border-bottom: 2px solid #ccc;">
                                                    <div class="container pt-1 text-start">
                                                        <b><span style="font-size: 14px;">{{ $currentDate }} |</span> 
                                                        <span style="font-size: 14px;">{{ $currentDay }}</span></b>
                                                    </div>
                                                </td>
                                            </tr>       
                                        @endif
    
                                        <tr style="font-size: 10px;">
                                            <td class="text-center" style="width: 10%;">{{ $rowNumber }}.</td>
                                            <td class="text-justify" style="width: 20%;">{{ $att->id_pelajar }}</td>
                                            <td class="text-start" style="width: 40%;">{{ $att->nama_pelajar }}</td>
                                            <td class="text-center" style="width: 15%;">{{ $att->att_in ?? '-' }}</td>
                                            <td class="text-center" style="width: 15%;">{{ $att->att_out ?? '-' }}</td>
                                        </tr>
                                        @php
                                            $rowNumber++; // Increment row number
                                        @endphp
                                    @endforeach
    
                                    @if ($attendance->isEmpty())
                                        <tr>
                                            <td colspan="5" class="text-center py-3">Tiada rekod ditemui</td>
                                        </tr>
                                    @endif
                                </tbody>
                            </table>
                        </div>
                </div>
            </div>
        </div>
    </div>
</section>
@endsection