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

<?= $this->section('title') ?>
Laporan Kenaikan Pangkat
<?= $this->endSection() ?>

<?= $this->section('page_title') ?>
Laporan Riwayat Pengajuan KP
<?= $this->endSection() ?>

<?= $this->section('content') ?>
<div class="row">
    <div class="col-lg-12">
        <!-- Filter Card -->
        <div class="glass-card mb-4">
            <form action="" method="GET" class="row g-3 align-items-end">
                <div class="col-md-3">
                    <label class="form-label small fw-bold">PERIODE</label>
                    <select name="periode" class="form-select rounded-pill px-4">
                        <option value="">Semua Periode</option>
                        <?php
                        $bulan = [
                            'Januari',
                            'Februari',
                            'Maret',
                            'April',
                            'Mei',
                            'Juni',
                            'Juli',
                            'Agustus',
                            'September',
                            'Oktober',
                            'November',
                            'Desember'
                        ];
                        foreach ($bulan as $b): ?>
                            <option value="<?= $b ?>" <?= $filter['periode'] == $b ? 'selected' : '' ?>><?= strtoupper($b) ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                </div>
                <div class="col-md-3">
                    <label class="form-label small fw-bold">TAHUN</label>
                    <input type="number" name="tahun" class="form-control rounded-pill px-4"
                        value="<?= $filter['tahun'] ?>" placeholder="2026">
                </div>
                <div class="col-md-3">
                    <label class="form-label small fw-bold">STATUS</label>
                    <select name="status" class="form-select rounded-pill px-4">
                        <option value="">Semua Status</option>
                        <option value="PENDING" <?= $filter['status'] == 'PENDING' ? 'selected' : '' ?>>PENDING</option>
                        <option value="VERIFIED" <?= $filter['status'] == 'VERIFIED' ? 'selected' : '' ?>>VERIFIED (OK)
                        </option>
                        <option value="APPROVED" <?= $filter['status'] == 'APPROVED' ? 'selected' : '' ?>>APPROVED (TIM
                            PENILAI)</option>
                        <option value="SK_FINISH" <?= $filter['status'] == 'SK_FINISH' ? 'selected' : '' ?>>SK SELESAI
                        </option>
                        <option value="REJECTED" <?= $filter['status'] == 'REJECTED' ? 'selected' : '' ?>>DITOLAK</option>
                    </select>
                </div>
                <div class="col-md-3">
                    <div class="d-flex gap-2">
                        <button type="submit" class="btn btn-primary rounded-pill px-4 w-100 shadow-sm">
                            <i class="bi bi-filter me-2"></i> FILTER
                        </button>
                        <button type="button" onclick="window.print()"
                            class="btn btn-light rounded-pill px-4 shadow-sm border">
                            <i class="bi bi-printer"></i>
                        </button>
                    </div>
                </div>
            </form>
        </div>

        <!-- Result Table -->
        <div class="glass-card">
            <div class="table-responsive">
                <table class="table table-hover align-middle">
                    <thead>
                        <tr class="text-secondary small fw-bold opacity-75">
                            <th>#</th>
                            <th>PEGAWAI</th>
                            <th>PERIODE</th>
                            <th>JENIS KP</th>
                            <th>GOL (LAMA/BARU)</th>
                            <th>STATUS</th>
                            <th>TANGGAL</th>
                        </tr>
                    </thead>
                    <tbody>
                        <?php if (empty($riwayat)): ?>
                            <tr>
                                <td colspan="7" class="text-center py-5 text-muted">Data tidak ditemukan untuk filter ini.
                                </td>
                            </tr>
                        <?php else: ?>
                            <?php foreach ($riwayat as $idx => $row): ?>
                                <tr>
                                    <td>
                                        <?= $idx + 1 ?>
                                    </td>
                                    <td>
                                        <div class="fw-bold">
                                            <?= $row['pegawai_nama'] ?>
                                        </div>
                                        <div class="small text-muted">
                                            <?= $row['pegawai_nip'] ?>
                                        </div>
                                    </td>
                                    <td class="text-uppercase fw-bold small text-primary">
                                        <?= $row['periode'] ?>
                                        <?= $row['tahun'] ?>
                                    </td>
                                    <td class="small">
                                        <?= $row['jenis_kp'] ?>
                                    </td>
                                    <td>
                                        <span class="badge bg-secondary opacity-50">
                                            <?= $row['gol_awal'] ?>
                                        </span>
                                        <i class="bi bi-arrow-right mx-1 small opacity-50"></i>
                                        <span class="badge bg-primary">
                                            <?= $row['gol_baru'] ?>
                                        </span>
                                    </td>
                                    <td>
                                        <?php
                                        $statusClass = 'bg-secondary';
                                        if ($row['status'] == 'SK_FINISH')
                                            $statusClass = 'bg-success';
                                        elseif ($row['status'] == 'REJECTED')
                                            $statusClass = 'bg-danger';
                                        elseif ($row['status'] == 'PENDING')
                                            $statusClass = 'bg-warning';
                                        elseif (in_array($row['status'], ['VERIFIED', 'APPROVED']))
                                            $statusClass = 'bg-info';
                                        ?>
                                        <span
                                            class="badge rounded-pill <?= $statusClass ?> bg-opacity-10 text-<?= str_replace('bg-', '', $statusClass) ?> border border-<?= str_replace('bg-', '', $statusClass) ?> px-3">
                                            <?= str_replace('_', ' ', $row['status']) ?>
                                        </span>

                                        <?php if ($row['status'] == 'SK_FINISH' && !empty($row['sk_tte'])): ?>
                                            <div class="mt-2">
                                                <a href="<?= base_url('uploads/sk/' . $row['sk_tte']) ?>" target="_blank"
                                                    class="btn btn-sm btn-outline-success rounded-pill px-3 py-0 small shadow-sm d-print-none"
                                                    style="font-size: 0.75rem;">
                                                    <i class="bi bi-file-earmark-pdf-fill me-1"></i> DOWNLOAD SK
                                                </a>
                                            </div>
                                        <?php endif; ?>
                                    </td>
                                    <td class="small text-muted">
                                        <?= date('d/m/Y', strtotime($row['created_at'])) ?>
                                    </td>
                                </tr>
                            <?php endforeach; ?>
                        <?php endif; ?>
                    </tbody>
                </table>
            </div>
        </div>
    </div>
</div>

<style>
    @media print {

        .navbar,
        .sidebar,
        .btn,
        .glass-card:first-child,
        .breadcrumb {
            display: none !important;
        }

        .main-content {
            margin-left: 0 !important;
            padding: 0 !important;
        }

        .glass-card {
            border: none !important;
            box-shadow: none !important;
            background: none !important;
        }

        body {
            background: white !important;
        }
    }
</style>
<?= $this->endSection() ?>