<?= $this->extend('layout/main') ?>

<?= $this->section('content') ?>

<?php 
$bulan_list = [
    1 => 'Januari', 2 => 'Februari', 3 => 'Maret', 4 => 'April', 
    5 => 'Mei', 6 => 'Juni', 7 => 'Juli', 8 => 'Agustus', 
    9 => 'September', 10 => 'Oktober', 11 => 'November', 12 => 'Desember'
];
?>

<div class="card shadow-sm border-0 mb-4 no-print">
    <div class="card-body">
        <form action="" method="GET" class="row g-2 align-items-end">
            <?php if (session()->get('level') == 'admin'): ?>
                <div class="col-md-4">
                    <label class="small fw-bold text-muted">Pilih Unit Kerja / Instansi</label>
                    <select name="id_opd" class="form-select form-select-sm shadow-none" required>
                        <option value="">-- Pilih Instansi --</option>

                            <?php foreach ($list_opd as $o): ?>
                                <option value="<?= $o['id_opd'] ?>" <?= ($selected_opd == $o['id_opd']) ? 'selected' : '' ?>>
                                    <?= $o['nama_opd'] ?>
                                </option>
                            <?php endforeach; ?>
                        
                    </select>
                </div>
            <?php endif; ?>

            <div class="col-md-2">
                <label class="small fw-bold text-muted">Bulan</label>
                <select name="bulan" class="form-select form-select-sm shadow-none">
                    <?php foreach ($bulan_list as $m => $nama): ?>
                        <option value="<?= $m ?>" <?= ($bulan == $m) ? 'selected' : '' ?>>
                            <?= $nama ?>
                        </option>
                    <?php endforeach; ?>
                </select>
            </div>

            <div class="col-md-2">
                <label class="small fw-bold text-muted">Tahun</label>
                <input type="number" name="tahun" class="form-control form-control-sm shadow-none" value="<?= $tahun ?>">
            </div>

            <div class="col-md-2">
                <button type="submit" class="btn btn-primary btn-sm w-100 shadow-sm">
                    <i class="fas fa-search me-1"></i> Tampilkan
                </button>
            </div>

            <div class="col-md-2">
                <button type="button" onclick="generatePDF()" class="btn btn-danger btn-sm w-100 shadow-sm">
                    <i class="fas fa-file-pdf me-1"></i> Cetak PDF
                </button>
            </div>
        </form>
    </div>
</div>

<div class="mb-3 d-flex justify-content-between align-items-center">
    <span class="badge bg-light text-dark border px-3 py-2 shadow-sm">
        <i class="fas fa-calendar-check text-primary me-2"></i> Hari Kerja Efektif: <strong><?= $hari_kerja ?> Hari</strong>
    </span>
</div>

<?php if (!empty($pegawai)): ?>
    <div class="card border-0 shadow-sm overflow-hidden">
        <div class="table-responsive">
            <table class="table table-bordered table-sm text-center small align-middle mb-0" id="tabelRekap" style="font-size: 0.7rem;">
                <thead class="bg-dark text-white">
                    <tr>
                        <th rowspan="2" width="30" class="align-middle border-0">No</th>
                        <th rowspan="2" class="align-middle text-start ps-3 border-0" style="min-width: 180px;">Nama Pegawai / NIP</th>
                        
                        <th rowspan="2" width="60" class="align-middle bg-success text-white border-0">Hari<br>Kerja</th>
                        
                        <th colspan="2" class="bg-primary py-2 border-0">Terlambat (Tb)</th>
                        <th colspan="2" class="bg-info py-2 border-0">Plg Cepat (PC)</th>
                        <th colspan="4" class="bg-secondary py-2 border-0">Ketidakhadiran</th>
                        <th rowspan="2" width="90" class="align-middle bg-secondary border-0 text-white">Status</th>
                    </tr>
                    <tr>
                        <th width="45" class="bg-light text-dark border-0">X</th>
                        <th width="65" class="bg-light text-dark border-0">Menit</th>
                        <th width="45" class="bg-light text-dark border-0">X</th>
                        <th width="65" class="bg-light text-dark border-0">Menit</th>
                        <th width="40" class="bg-danger text-white border-0">A</th>
                        <th width="40" class="bg-warning text-dark border-0">I/S</th>
                        <th width="40" class="bg-primary text-white border-0">C</th>
                        <th width="40" class="bg-info text-white border-0">TL</th>
                    </tr>
                </thead>
                <tbody>
                    <?php $no = 1; foreach ($pegawai as $p): ?>
                        <?php
                        $menit_telat = intval($p['total_menit_telat']);
                        $menit_pc    = intval($p['total_menit_pc']);
                        $total_menit = $menit_telat + $menit_pc;
                        $alpa        = intval($p['total_alpa']);

                        // Logika Status Disiplin
                        $status = "Sangat Baik"; $badge = "bg-success";
                        if ($alpa >= 3 || $total_menit > 480) {
                            $status = "Pembinaan"; $badge = "bg-danger";
                        } elseif ($alpa > 0 || $total_menit > 120) {
                            $status = "Teguran"; $badge = "bg-warning text-dark";
                        }
                        ?>
                        <tr>
                            <td class="text-muted"><?= $no++ ?></td>
                            <td class="text-start ps-3">
                                <div class="fw-bold text-dark"><?= $p['nama_lengkap'] ?></div>
                                <div class="text-muted" style="font-size: 0.6rem;">NIP. <?= $p['nip'] ?></div>
                                <div class="text-primary fw-bold" style="font-size: 0.55rem;">
                                    <?= $p['jabatan'] ?> 
                                    <?php if(strpos($selected_opd, 'rekap_eselon') !== false): ?>
                                        <span class="text-muted">| <?= $p['nama_opd'] ?></span>
                                    <?php endif; ?>
                                </div>
                            </td>
                            
                            <td class="fw-bold text-success bg-success-subtle border-start border-end" style="font-size: 0.8rem;">
                                <?= $hari_kerja ?>
                            </td>
                           
                            <td class="<?= ($p['frekuensi_telat'] > 0) ? 'fw-bold' : 'text-muted' ?>"><?= $p['frekuensi_telat'] ?></td>
                            <td class="<?= ($menit_telat > 0) ? 'text-danger fw-bold' : 'text-muted' ?>"><?= $menit_telat ?>m</td>

                            <td class="<?= ($p['frekuensi_pc'] > 0) ? 'fw-bold' : 'text-muted' ?>"><?= $p['frekuensi_pc'] ?></td>
                            <td class="<?= ($menit_pc > 0) ? 'text-primary fw-bold' : 'text-muted' ?>"><?= $menit_pc ?>m</td>

                            <td class="<?= ($alpa > 0) ? 'bg-danger-subtle fw-bold text-danger' : 'text-muted' ?>"><?= $alpa ?></td>
                            <td class="text-muted"><?= $p['total_izin_sakit'] ?></td>
                            <td class="text-muted"><?= $p['total_cuti'] ?></td>
                            <td class="text-muted"><?= $p['total_dl'] ?></td>

                            <td>
                                <span class="badge <?= $badge ?> rounded-pill" style="font-size: 0.55rem; width: 75px;">
                                    <?= $status ?>
                                </span>
                            </td>
                        </tr>
                    <?php endforeach; ?>
                </tbody>
            </table>
        </div>
    </div>
<?php else: ?>
    <div class="alert alert-info border-0 shadow-sm text-center py-4">Pilih Instansi dan klik Tampilkan.</div>
<?php endif; ?>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf-autotable/3.5.25/jspdf.plugin.autotable.min.js"></script>

<script>
    function generatePDF() {
        const { jsPDF } = window.jspdf;
        const doc = new jsPDF('l', 'mm', 'a4');
        const namaBulan = "<?= $bulan_list[(int)$bulan] ?>";
        let judul = "LAPORAN DISIPLIN KARYAWAN";

        doc.setFontSize(14);
        doc.text(judul, 148, 15, { align: "center" });
        doc.setFontSize(10);
        doc.text(`Periode: ${namaBulan} <?= $tahun ?> | Hari Kerja Efektif: <?= $hari_kerja ?> Hari`, 148, 22, { align: "center" });

        doc.autoTable({
            html: '#tabelRekap',
            startY: 30,
            theme: 'grid',
            styles: { fontSize: 6.5, halign: 'center', valign: 'middle' },
            headStyles: { fillColor: [33, 37, 41], textColor: [255, 255, 255] },
            columnStyles: { 1: { halign: 'left' } },
            margin: { top: 30 }
        });

        doc.save(`${judul}_${namaBulan}.pdf`);
    }
</script>

<style>
    .bg-danger-subtle { background-color: #f8d7da !important; }
    .bg-success-subtle { background-color: #d1e7dd !important; }
    .table thead th { border: none !important; font-size: 0.65rem; }
    .table tbody td { border-color: #f0f0f0 !important; }
    @media print { .no-print { display: none !important; } }
</style>

<?= $this->endSection() ?>