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

<?= $this->section('title') ?>
Detail Pengajuan #<?= $pengajuan['id'] ?>
<?= $this->endSection() ?>

<?= $this->section('page_title') ?>
Verifikasi Berkas ASN
<?= $this->endSection() ?>

<?= $this->section('content') ?>
    <form action="<?= base_url('verifikator/updateStatus/' . $pengajuan['id']) ?>" method="POST" enctype="multipart/form-data">
        <div class="row">
            <div class="col-lg-8">
                <div class="glass-card mb-4">
                    <h4 class="mb-4">Informasi Pengaju</h4>
                    <div class="row">
                        <div class="col-sm-6 mb-3">
                            <label class="small text-secondary fw-bold">NAMA LENGKAP</label>
                            <p class="fw-bold h5"><?= $pengajuan['pegawai_name'] ?></p>
                        </div>
                        <div class="col-sm-6 mb-3">
                            <label class="small text-secondary fw-bold">NIP</label>
                            <p class="fw-bold h5"><?= $pengajuan['pegawai_nip'] ?></p>
                        </div>
                        <div class="col-sm-6 mb-3">
                            <label class="small text-secondary fw-bold">JENIS KP</label>
                            <p class="fw-bold"><?= $pengajuan['jenis_kp'] ?></p>
                        </div>
                        <div class="col-sm-6 mb-3">
                            <label class="small text-secondary fw-bold">TANGGAL PENGAJUAN</label>
                            <p class="fw-bold text-primary"><?= date('d M Y, H:i', strtotime($pengajuan['created_at'])) ?></p>
                        </div>
                    </div>

                    <hr class="my-4 opacity-10">
                    <h5 class="mb-4">Dokumen yang Diunggah & Verifikasi Detail</h5>
                    <div class="list-group list-group-flush">
                        <?php foreach ($dokumen as $index => $doc): ?>
                            <div class="list-group-item bg-transparent border-0 px-0 mb-4 pb-4 border-bottom border-light">
                                <div class="d-flex justify-content-between align-items-start mb-3">
                                    <div class="d-flex align-items-center gap-3">
                                        <div class="bg-danger bg-opacity-10 p-3 rounded-3">
                                            <i class="bi bi-file-earmark-pdf-fill fs-3 text-danger"></i>
                                        </div>
                                        <div>
                                            <div class="fw-bold h6 mb-1 text-uppercase"><?= $doc['nama_dokumen'] ?></div>
                                            <span class="small text-muted d-block text-truncate"
                                                style="max-width: 250px;"><?= $doc['file_path'] ?></span>
                                        </div>
                                    </div>
                                    <div class="d-flex gap-2">
                                        <a href="<?= base_url('uploads/dokumen/' . $doc['file_path']) ?>" target="_blank"
                                            class="btn btn-outline-primary btn-sm rounded-pill px-3"><i
                                                class="bi bi-box-arrow-up-right me-1"></i> Lihat</a>
                                    </div>
                                </div>

                                <!-- New: Individual Document Verification -->
                                <div class="row g-2">
                                    <div class="col-md-4">
                                        <label class="small text-secondary fw-bold ms-2 mb-1">STATUS BERKAS</label>
                                        <select name="doc_status[<?= $doc['id'] ?>]"
                                            class="form-select form-select-sm rounded-pill shadow-none">
                                            <option value="PENDING" <?= $doc['status_verifikasi'] == 'PENDING' ? 'selected' : '' ?>>
                                                Menunggu</option>
                                            <option value="OK" <?= $doc['status_verifikasi'] == 'OK' ? 'selected' : '' ?>>Sesuai ✅
                                            </option>
                                            <option value="REVISI" <?= $doc['status_verifikasi'] == 'REVISI' ? 'selected' : '' ?>>Butuh
                                                Revisi ⚠️</option>
                                            <option value="REJECTED" <?= $doc['status_verifikasi'] == 'REJECTED' ? 'selected' : '' ?>>
                                                Tolak ❌</option>
                                        </select>
                                    </div>
                                    <div class="col-md-8">
                                        <label class="small text-secondary fw-bold ms-2 mb-1">CATATAN KHUSUS (JIKA ADA)</label>
                                        <input type="text" name="doc_catatan[<?= $doc['id'] ?>]"
                                            class="form-control form-control-sm rounded-pill shadow-none"
                                            placeholder="Contoh: Lampirkan lembar pengesahan..." value="<?= $doc['catatan'] ?>">
                                    </div>
                                </div>
                            </div>
                        <?php endforeach; ?>
                    <div class="mt-4 pt-4 border-top">
                        <button type="submit" class="btn btn-primary rounded-pill px-5 py-3 fw-bold shadow-sm">
                            <i class="bi bi-check-all me-2"></i> SIMPAN HASIL VERIFIKASI BERKAS
                        </button>
                    </div>
                </div>
            </div>

            <div class="col-lg-4">
                <div class="glass-card shadow-lg" style="border: 2px solid var(--accent-color);">
                    <h4 class="mb-4">Keputusan Verifikasi</h4>
                    <div class="mb-4">
                        <label class="form-label fw-bold small text-secondary">SET STATUS</label>
                        <select class="form-select rounded-pill px-4" name="status" required>
                            <option value="VERIFIED" <?= $pengajuan['status'] == 'VERIFIED' ? 'selected' : '' ?>>Verifikasi OK</option>
                            <option value="REJECTED" <?= $pengajuan['status'] == 'REJECTED' ? 'selected' : '' ?>>Tolak / Tidak Valid</option>
                            <option value="REVISION" <?= $pengajuan['status'] == 'REVISION' ? 'selected' : '' ?>>Minta Revisi</option>
                            <option value="APPROVED" <?= $pengajuan['status'] == 'APPROVED' ? 'selected' : '' ?>>Approve (Tim Penilai)</option>
                            <option value="PROSES_BKN" <?= $pengajuan['status'] == 'PROSES_BKN' ? 'selected' : '' ?>>Proses BKN</option>
                            <option value="PERTEK_BKN" <?= $pengajuan['status'] == 'PERTEK_BKN' ? 'selected' : '' ?>>Pertek BKN</option>
                            <option value="TOLAK_BKN" <?= $pengajuan['status'] == 'TOLAK_BKN' ? 'selected' : '' ?>>Tolak BKN</option>
                            <option value="WAITING_SK" <?= $pengajuan['status'] == 'WAITING_SK' ? 'selected' : '' ?>>Menunggu Penerbitan SK</option>
                            <option value="SK_FINISH" <?= $pengajuan['status'] == 'SK_FINISH' ? 'selected' : '' ?>>SK Telah selesai di cetak</option>
                        </select>
                    </div>

                    <div class="mb-4">
                        <label class="form-label fw-bold small text-secondary">CATATAN / ALASAN (OPSIONAL)</label>
                        <textarea class="form-control" name="catatan" rows="4"
                            placeholder="Misal: 'Sertifikat Pendidikan belum dilegalisir'"><?= $pengajuan['catatan_revisi'] ?></textarea>
                    </div>

                    <div class="mb-4 d-none" id="sk-tte-container">
                        <label class="form-label fw-bold small text-secondary">UPLOAD SK KP TTE (PDF)</label>
                        <input type="file" class="form-control rounded-pill" name="sk_tte" accept=".pdf">
                        <?php if (!empty($pengajuan['sk_tte'])): ?>
                            <div class="mt-2 text-success small">
                                <i class="bi bi-check-circle-fill"></i> SK TTE sudah diunggah: 
                                <a href="<?= base_url('uploads/sk_tte/' . $pengajuan['sk_tte']) ?>" target="_blank" class="text-decoration-none fw-bold">Lihat SK <i class="bi bi-box-arrow-up-right"></i></a>
                            </div>
                        <?php endif; ?>
                    </div>

                    <button type="submit" class="btn btn-primary d-block w-100 rounded-pill py-3 fw-bold shadow">SIMPAN STATUS</button>
                    <a href="<?= base_url('verifikator/dashboard') ?>" class="btn btn-light d-block w-100 mt-3 rounded-pill">Kembali ke Daftar</a>
                </div>
            </div>
        </div>
    </form>
<?= $this->endSection() ?>

<?= $this->section('scripts') ?>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const statusSelect = document.querySelector('select[name="status"]');
        const skTteContainer = document.getElementById('sk-tte-container');

        function toggleSkTte() {
            if (statusSelect.value === 'SK_FINISH') {
                skTteContainer.classList.remove('d-none');
            } else {
                skTteContainer.classList.add('d-none');
                // Optional: clear file input if hidden
                // skTteContainer.querySelector('input[type="file"]').value = '';
            }
        }

        statusSelect.addEventListener('change', toggleSkTte);
        toggleSkTte(); // Initial check
    });
</script>
<?= $this->endSection() ?>