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

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

<div class="d-flex justify-content-between align-items-center mb-4">
    <div>
        <h5 class="fw-bold mb-0">Manajemen Pegawai</h5>
        <p class="text-muted small mb-0">Kelola data personil dan registrasi wajah biometrik</p>
    </div>
    <div class="d-flex gap-2">
        <button class="btn btn-success btn-sm rounded-pill px-3 shadow-sm" data-bs-toggle="modal" data-bs-target="#modalImport">
            <i class="fas fa-file-excel me-1"></i> Import Excel
        </button>
        <button class="btn btn-primary btn-sm rounded-pill px-3 shadow-sm" data-bs-toggle="modal" data-bs-target="#modalPegawai">
            <i class="fas fa-user-plus me-1"></i> Tambah Pegawai
        </button>
        <button id="btnGeneratePass" class="btn btn-primary shadow-sm">
            <i class="fas fa-shield-alt me-2"></i> Amankan Semua Password (NIP)
        </button>
    </div>
</div>

<?php if (session()->getFlashdata('success')) : ?>
    <div class="alert alert-success alert-dismissible fade show border-0 shadow-sm mb-4" role="alert">
        <i class="fas fa-check-circle me-2"></i> <?= session()->getFlashdata('success') ?>
        <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
    </div>
<?php endif; ?>

<div class="card border-0 shadow-sm mb-3">
    <div class="card-body p-3">
        <div class="row align-items-center">
            <div class="col-md-4">
                <label class="small fw-bold text-muted mb-1">Filter Unit Kerja (OPD)</label>
                <select id="filter_opd" class="form-select form-select-sm border-light bg-light shadow-none">
                    <?php if (session()->get('level') == 'kabupaten'): ?>
                        <option value="">-- Tampilkan Semua OPD --</option>
                    <?php endif; ?>
                    <?php foreach ($opd_list as $o): ?>
                        <option value="<?= $o['id_opd'] ?>"><?= $o['nama_opd'] ?></option>
                    <?php endforeach; ?>
                </select>
            </div>
        </div>
    </div>
</div>

<div class="card border-0 shadow-sm">
    <div class="card-body p-4">
        <div class="table-responsive">
            <table id="tabelPegawai" class="table table-hover align-middle mb-0" style="width:100%">
                <thead class="bg-light text-muted small">
                    <tr>
                        <th width="5%">NO</th>
                        <th width="20%">NAMA PEGAWAI</th>
                        <th width="20%">JABATAN / PANGKAT</th>
                        <th width="15%" class="text-center">LEVEL JABATAN</th>
                        <th width="10%" class="text-center">STATUS ASN</th>
                        <th width="15%" class="text-center">STATUS WAJAH</th>
                        <th width="15%" class="text-center">AKSI</th>
                    </tr>
                </thead>
                <tbody></tbody>
            </table>
        </div>
    </div>
</div>

<div class="modal fade" id="modalTransfer" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <div class="modal-header bg-dark text-white border-0 pb-3">
                <h6 class="modal-title fw-bold"><i class="fas fa-exchange-alt me-2"></i>Transfer / Mutasi Pegawai</h6>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body p-4">
                <div class="alert alert-warning small border-0 mb-3">
                    <i class="fas fa-exclamation-circle me-1"></i> Perhatian: Pegawai ini akan dipindahkan ke OPD baru dan lokasi absensinya akan direset.
                </div>
                
                <div class="mb-3 text-center">
                    <div class="small text-muted">Pegawai yang akan dimutasi:</div>
                    <div id="transfer_nama_pegawai" class="fw-bold fs-5 text-dark"></div>
                </div>

                <input type="hidden" id="transfer_id_pegawai">

                <div class="mb-3">
                    <label class="form-label small fw-bold">Pilih OPD Tujuan</label>
                    <select id="transfer_id_opd" class="form-select border-dark bg-light shadow-none">
                        <option value="">-- Pilih OPD Baru --</option>
                        <?php foreach ($opd_list as $o): ?>
                            <option value="<?= $o['id_opd'] ?>"><?= $o['nama_opd'] ?></option>
                        <?php endforeach; ?>
                    </select>
                </div>
            </div>
            <div class="modal-footer border-0 pt-0">
                <button type="button" class="btn btn-light rounded-pill" data-bs-dismiss="modal">Batal</button>
                <button type="button" onclick="submitTransfer()" class="btn btn-dark rounded-pill px-4 shadow">Proses Mutasi</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modalImport" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <div class="modal-header border-0 pb-0">
                <h5 class="modal-title fw-bold">Import Pegawai (Server-Side)</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" id="btnCloseImport"></button>
            </div>
            <div class="modal-body px-4">
                <div id="formArea">
                    <p class="small text-muted">Pilih file excel untuk memulai proses import massal.</p>
                    <input type="file" id="fileExcel" class="form-control border-light bg-light" accept=".xlsx, .xls">
                    <button type="button" onclick="startUpload()" class="btn btn-success w-100 rounded-pill mt-3 shadow">Unggah & Proses</button>
                </div>

                <div id="progressArea" style="display:none;">
                    <div class="text-center mb-3">
                        <div class="spinner-border text-success mb-2"></div>
                        <div class="fw-bold small" id="importStatus">Memulai...</div>
                    </div>
                    <div class="progress" style="height: 10px;">
                        <div id="importProgressBar" class="progress-bar progress-bar-striped progress-bar-animated bg-success" style="width: 0%"></div>
                    </div>
                    <p class="text-center small text-muted mt-2" id="importDetail">0 dari 0 data</p>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade <?= (session()->getFlashdata('error')) ? 'show' : '' ?>" id="modalPegawai" tabindex="-1" aria-hidden="true" style="<?= (session()->getFlashdata('error')) ? 'display: block; background: rgba(0,0,0,0.5);' : '' ?>">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <div class="modal-header border-0 pb-0">
                <h5 class="modal-title fw-bold">Tambah Pegawai Baru</h5>
                <button type="button" class="btn-close" <?= (session()->getFlashdata('error')) ? 'onclick="location.reload()"' : 'data-bs-dismiss="modal"' ?> aria-label="Close"></button>
            </div>
            <form action="<?= base_url('pegawai/simpan') ?>" method="POST">
                <?= csrf_field() ?>
                <div class="modal-body px-4">
                    
                    <?php if (session()->getFlashdata('error')) : ?>
                        <div class="alert alert-danger mb-3 py-2 small fw-bold">
                            <i class="fas fa-exclamation-triangle me-2"></i> <?= session()->getFlashdata('error') ?>
                        </div>
                    <?php endif; ?>

                    <div class="row">
                        <div class="col-md-12 mb-3">
                            <label class="form-label small fw-bold">Unit Kerja (OPD)</label>
                            <select name="id_opd" class="form-select border-light bg-light shadow-none" required>
                                <?php foreach ($opd_list as $o): ?>
                                    <option value="<?= $o['id_opd'] ?>" <?= old('id_opd') == $o['id_opd'] ? 'selected' : '' ?>><?= $o['nama_opd'] ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">NIP</label>
                            <input type="text" name="nip" class="form-control border-light bg-light <?= session()->getFlashdata('error') ? 'is-invalid' : '' ?>" placeholder="Masukkan NIP" value="<?= old('nip') ?>" required>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">Nama Lengkap</label>
                            <input type="text" name="nama_lengkap" class="form-control border-light bg-light" placeholder="Nama Tanpa Gelar" value="<?= old('nama_lengkap') ?>" required>
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small fw-bold">Status ASN</label>
                            <select name="status_asn" class="form-select border-light bg-light">
                                <option value="PNS" <?= old('status_asn') == 'PNS' ? 'selected' : '' ?>>PNS</option>
                                <option value="PPPK" <?= old('status_asn') == 'PPPK' ? 'selected' : '' ?>>PPPK</option>
                                <option value="PPPKPW" <?= old('status_asn') == 'PPPKPW' ? 'selected' : '' ?>>PPPKPW</option>
                            </select>
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small fw-bold">Pangkat / Golongan</label>
                            <input type="text" name="pangkat" class="form-control border-light bg-light" placeholder="Contoh: Pembina / IV.a" value="<?= old('pangkat') ?>">
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small fw-bold">Eselon</label>
                            <select name="eselon" class="form-select border-light bg-light">
                                <option value="" <?= old('eselon') == '' ? 'selected' : '' ?>>Non-Eselon</option>
                                <option value="II.a" <?= old('eselon') == 'II.a' ? 'selected' : '' ?>>II.a</option>
                                <option value="II.b" <?= old('eselon') == 'II.b' ? 'selected' : '' ?>>II.b</option>
                                <option value="III.a" <?= old('eselon') == 'III.a' ? 'selected' : '' ?>>III.a</option>
                                <option value="III.b" <?= old('eselon') == 'III.b' ? 'selected' : '' ?>>III.b</option>
                                <option value="IV.a" <?= old('eselon') == 'IV.a' ? 'selected' : '' ?>>IV.a</option>
                                <option value="IV.b" <?= old('eselon') == 'IV.b' ? 'selected' : '' ?>>IV.b</option>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">Jabatan Spesifik</label>
                            <input type="text" name="jabatan" class="form-control border-light bg-light" placeholder="Contoh: Analis IT" value="<?= old('jabatan') ?>" required>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">Level Jabatan</label>
                            <select name="level_jabatan" class="form-select border-light bg-light" required>
                                <option value="Jabatan Pimpinan Tinggi Pratama" <?= old('level_jabatan') == 'Jabatan Pimpinan Tinggi Pratama' ? 'selected' : '' ?>>Jabatan Pimpinan Tinggi Pratama</option>
                                <option value="Pejabat Administrator" <?= old('level_jabatan') == 'Pejabat Administrator' ? 'selected' : '' ?>>Pejabat Administrator</option>
                                <option value="Pejabat Pengawas" <?= old('level_jabatan') == 'Pejabat Pengawas' ? 'selected' : '' ?>>Pejabat Pengawas</option>
                                <option value="Pejabat Fungsional" <?= old('level_jabatan') == 'Pejabat Fungsional' ? 'selected' : '' ?>>Pejabat Fungsional</option>
                                <option value="Staf" <?= (old('level_jabatan') == 'Staf' || !old('level_jabatan')) ? 'selected' : '' ?>>Staf / Pelaksana</option>
                            </select>
                        </div>
                        <div class="col-md-12 mb-3">
                            <label class="form-label small fw-bold">Password Login</label>
                            <input type="password" name="password" class="form-control border-light bg-light" placeholder="Min. 6 Karakter" required>
                        </div>
                    </div>
                </div>
                <div class="modal-footer border-0 px-4">
                    <button type="button" class="btn btn-light rounded-pill px-4" <?= (session()->getFlashdata('error')) ? 'onclick="location.reload()"' : 'data-bs-dismiss="modal"' ?>>Batal</button>
                    <button type="submit" class="btn btn-primary rounded-pill px-4 shadow">Simpan Pegawai</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="modalEditPegawai" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-lg modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <div class="modal-header border-0 pb-0">
                <h5 class="modal-title fw-bold">Edit Data Pegawai</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form action="<?= base_url('pegawai/update') ?>" method="POST">
                <?= csrf_field() ?>
                <input type="hidden" name="id_pegawai" id="edit_id_pegawai">
                <div class="modal-body px-4">
                    <div class="row">
                        <div class="col-md-12 mb-3">
                            <label class="form-label small fw-bold">Unit Kerja (OPD)</label>
                            <select name="id_opd" id="edit_id_opd" class="form-select border-light bg-light" required>
                                <?php foreach ($opd_list as $o): ?>
                                    <option value="<?= $o['id_opd'] ?>"><?= $o['nama_opd'] ?></option>
                                <?php endforeach; ?>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">NIP</label>
                            <input type="text" name="nip" id="edit_nip" class="form-control border-light bg-light" required>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">Nama Lengkap</label>
                            <input type="text" name="nama_lengkap" id="edit_nama_lengkap" class="form-control border-light bg-light" required>
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small fw-bold">Status ASN</label>
                            <select name="status_asn" id="edit_status_asn" class="form-select border-light bg-light">
                                <option value="PNS">PNS</option>
                                <option value="PPPK">PPPK</option>
                                <option value="PPPKPW">PPPKPW</option>
                            </select>
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small fw-bold">Pangkat / Golongan</label>
                            <input type="text" name="pangkat" id="edit_pangkat" class="form-control border-light bg-light">
                        </div>
                        <div class="col-md-4 mb-3">
                            <label class="form-label small fw-bold">Eselon</label>
                            <select name="eselon" id="edit_eselon" class="form-select border-light bg-light">
                                <option value="">Non-Eselon</option>
                                <option value="II.a">II.a</option>
                                <option value="II.b">II.b</option>
                                <option value="III.a">III.a</option>
                                <option value="III.b">III.b</option>
                                <option value="IV.a">IV.a</option>
                                <option value="IV.b">IV.b</option>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">Jabatan Spesifik</label>
                            <input type="text" name="jabatan" id="edit_jabatan" class="form-control border-light bg-light" required>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label small fw-bold">Level Jabatan</label>
                            <select name="level_jabatan" id="edit_level_jabatan" class="form-select border-light bg-light" required>
                                <option value="Jabatan Pimpinan Tinggi Pratama">Jabatan Pimpinan Tinggi Pratama</option>
                                <option value="Pejabat Administrator">Pejabat Administrator</option>
                                <option value="Pejabat Pengawas">Pejabat Pengawas</option>
                                <option value="Pejabat Fungsional">Pejabat Fungsional</option>
                                <option value="Staf">Staf / Pelaksana</option>
                            </select>
                        </div>
                        <div class="col-md-12">
                            <label class="form-label small fw-bold text-danger">Ganti Password (Kosongkan jika tidak diubah)</label>
                            <input type="password" name="password" class="form-control border-light bg-light shadow-none" placeholder="Masukkan password baru">
                        </div>
                    </div>
                </div>
                <div class="modal-footer border-0 px-4">
                    <button type="button" class="btn btn-light rounded-pill px-4" data-bs-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-warning rounded-pill px-4 shadow">Simpan Perubahan</button>
                </div>
            </form>
        </div>
    </div>
</div>

<div class="modal fade" id="modalLokasiPegawai" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <div class="modal-header bg-info text-white border-0">
                <h6 class="modal-title fw-bold"><i class="fas fa-map-marker-alt me-2"></i>Multi-Lokasi Penugasan</h6>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
            </div>
            <div class="modal-body p-4">
                <div class="mb-3 text-center">
                    <div class="small text-muted">Pegawai:</div>
                    <div id="lokasi_nama_pegawai" class="fw-bold"></div>
                </div>
                <input type="hidden" id="lokasi_id_pegawai">
                <div class="mb-3">
                    <label class="form-label small fw-bold">Pilih Satu atau Lebih Lokasi (Gunakan Ctrl untuk pilih banyak)</label>
                    <select id="select_id_lokasi" class="form-select border-info bg-light shadow-none" multiple style="height: 150px;">
                    </select>
                </div>
                <div class="alert alert-info py-2 small border-0">
                    <i class="fas fa-info-circle me-1"></i> Tahan tombol <b>Ctrl</b> (Windows) atau <b>Command</b> (Mac) untuk memilih lebih dari satu lokasi.
                </div>
            </div>
            <div class="modal-footer border-0">
                <button type="button" class="btn btn-light rounded-pill" data-bs-dismiss="modal">Batal</button>
                <button type="button" onclick="saveLokasi()" class="btn btn-info text-white rounded-pill px-4 shadow">Simpan Multi-Lokasi</button>
            </div>
        </div>
    </div>
</div>

<div class="modal fade" id="modalEnroll" data-bs-backdrop="static" tabindex="-1">
    <div class="modal-dialog modal-dialog-centered">
        <div class="modal-content border-0 shadow">
            <div class="modal-header bg-primary text-white border-0">
                <h5 class="modal-title small"><i class="fas fa-id-card-alt me-2"></i>Registrasi Wajah: <span id="enroll_name"></span></h5>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal" onclick="stopCamera()"></button>
            </div>
            <div class="modal-body text-center bg-light p-4">
                <div class="position-relative d-inline-block border border-5 border-white shadow-lg rounded-circle overflow-hidden" style="width: 280px; height: 280px;">
                    <video id="video" width="400" height="300" autoplay muted style="margin-left: -60px;"></video>
                </div>
                <div id="status_enroll" class="mt-3 fw-bold text-secondary small">Menyiapkan AI & Kamera...</div>
                <input type="hidden" id="enroll_id_pegawai">
            </div>
            <div class="modal-footer border-0">
                <button type="button" id="btnCapture" class="btn btn-primary w-100 rounded-pill py-2 shadow" disabled onclick="captureFace()">
                    <i class="fas fa-fingerprint me-2"></i> Pindai & Daftarkan Wajah
                </button>
            </div>
        </div>
    </div>
</div>

<link rel="stylesheet" href="https://cdn.datatables.net/1.13.4/css/dataTables.bootstrap5.min.css">
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/jquery.dataTables.min.js"></script>
<script src="https://cdn.datatables.net/1.13.4/js/dataTables.bootstrap5.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/face-api.js@0.22.2/dist/face-api.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

<script>
    <?php if (session()->getFlashdata('success')) : ?>
        Swal.fire({
            icon: 'success',
            title: 'Berhasil',
            text: '<?= session()->getFlashdata('success') ?>',
            confirmButtonColor: '#155724'
        });
    <?php endif; ?>

    <?php if (session()->getFlashdata('error')) : ?>
        $(document).ready(function() {
            var modalTambah = new bootstrap.Modal(document.getElementById('modalPegawai'));
            modalTambah.show();
        });
    <?php endif; ?>

    var table;
    $(document).ready(function() {
        table = $('#tabelPegawai').DataTable({
            "processing": true,
            "serverSide": true,
            "responsive": true,
            "ajax": {
                "url": "<?= base_url('pegawai/ajax_list') ?>",
                "type": "POST",
                "data": function(d) {
                    d.filter_opd = $('#filter_opd').val();
                    d.<?= csrf_token() ?> = "<?= csrf_hash() ?>";
                }
            },
            "columnDefs": [{
                    "targets": [0, 4, 5, 6], // Index diperbarui karena kolom baru
                    "orderable": false
                },
                {
                    "targets": [3, 4, 5, 6], // Level Jabatan juga di center
                    "className": "text-center"
                }
            ],
            "language": {
                "search": "Cari Nama/NIP:",
                "lengthMenu": "Tampil _MENU_",
                "info": "Data _START_ - _END_ dari _TOTAL_",
                "paginate": {
                    "previous": "<",
                    "next": ">"
                }
            }
        });

        $('#filter_opd').change(function() {
            table.ajax.reload();
        });
    });

    // --- FUNGSI TRANSFER PEGAWAI (BARU) ---
    function openTransfer(id, nama, opd_asal) {
        $('#transfer_id_pegawai').val(id);
        $('#transfer_nama_pegawai').text(nama);
        // Reset select ke default (opsional: hilangkan OPD asal dari daftar agar tidak pilih OPD yang sama)
        $('#transfer_id_opd').val('');
        
        const modal = new bootstrap.Modal(document.getElementById('modalTransfer'));
        modal.show();
    }

    function submitTransfer() {
        const id_pegawai = $('#transfer_id_pegawai').val();
        const id_opd_baru = $('#transfer_id_opd').val();

        if(!id_opd_baru) {
            Swal.fire('Peringatan', 'Silakan pilih OPD tujuan terlebih dahulu.', 'warning');
            return;
        }

        $.ajax({
            url: '<?= base_url('pegawai/transfer_opd') ?>',
            type: 'POST',
            data: {
                id_pegawai: id_pegawai,
                id_opd_tujuan: id_opd_baru,
                '<?= csrf_token() ?>': '<?= csrf_hash() ?>'
            },
            success: function(res) {
                if (res.status === 'success') {
                    Swal.fire('Berhasil', res.message, 'success').then(() => {
                        location.reload(); // Reload agar data berpindah/hilang dari tabel saat ini (jika filter aktif)
                    });
                } else {
                    Swal.fire('Gagal', res.message, 'error');
                }
            },
            error: function() {
                Swal.fire('Error', 'Terjadi kesalahan server.', 'error');
            }
        });
    }

    // --- FUNGSI LOKASI & WAJAH (TIDAK DIUBAH) ---
    function openLokasi(id, id_opd, nama, current_ids) {
        $('#lokasi_id_pegawai').val(id);
        $('#lokasi_nama_pegawai').text(nama);
        $('#select_id_lokasi').html('<option>Memuat...</option>');

        const selectedArray = current_ids ? current_ids.split(',') : [];

        fetch('<?= base_url('pegawai/get_lokasi_by_opd') ?>/' + id_opd)
            .then(res => res.json())
            .then(data => {
                let html = '';
                if (Array.isArray(data)) {
                    data.forEach(l => {
                        let isSelected = selectedArray.includes(l.id_lokasi.toString()) ? 'selected' : '';
                        html += `<option value="${l.id_lokasi}" ${isSelected}>${l.nama_lokasi}</option>`;
                    });
                }
                $('#select_id_lokasi').html(html);
                new bootstrap.Modal(document.getElementById('modalLokasiPegawai')).show();
            });
    }

    function saveLokasi() {
        const id_pegawai = $('#lokasi_id_pegawai').val();
        const id_lokasi = $('#select_id_lokasi').val();

        $.ajax({
            url: '<?= base_url('pegawai/update_lokasi') ?>',
            type: 'POST',
            data: {
                id_pegawai: id_pegawai,
                id_lokasi: id_lokasi,
                '<?= csrf_token() ?>': '<?= csrf_hash() ?>'
            },
            success: function(res) {
                Swal.fire('Berhasil', res.message, 'success').then(() => location.reload());
            }
        });
    }

    // --- FUNGSI EDIT DATA ---
    async function openEdit(id) {
        fetch('<?= base_url('pegawai/edit_data') ?>/' + id)
            .then(res => res.json())
            .then(data => {
                $('#edit_id_pegawai').val(data.id_pegawai);
                $('#edit_id_opd').val(data.id_opd);
                $('#edit_nip').val(data.nip);
                $('#edit_nama_lengkap').val(data.nama_lengkap);
                $('#edit_jabatan').val(data.jabatan);
                $('#edit_level_jabatan').val(data.level_jabatan);
                $('#edit_status_asn').val(data.status_asn);
                $('#edit_pangkat').val(data.pangkat);
                $('#edit_eselon').val(data.eselon);
                new bootstrap.Modal(document.getElementById('modalEditPegawai')).show();
            });
    }

    // --- BIOMETRIC LOGIC ---
    const video = document.getElementById('video');
    const statusText = document.getElementById('status_enroll');
    const btnCapture = document.getElementById('btnCapture');
    let modelsLoaded = false;

    async function loadModels() {
        if (modelsLoaded) return true;
        statusText.innerText = "Memuat Modul AI...";
        try {
            const MODEL_URL = '<?= base_url('models') ?>';
            await faceapi.nets.tinyFaceDetector.loadFromUri(MODEL_URL);
            await faceapi.nets.faceLandmark68Net.loadFromUri(MODEL_URL);
            await faceapi.nets.faceRecognitionNet.loadFromUri(MODEL_URL);
            modelsLoaded = true;
            return true;
        } catch (e) {
            statusText.innerText = "Modul AI Gagal!";
            return false;
        }
    }

    async function startCamera() {
        const ready = await loadModels();
        if (!ready) return;
        navigator.mediaDevices.getUserMedia({ video: { facingMode: "user" } })
            .then(stream => {
                video.srcObject = stream;
                statusText.innerText = "Dekatkan wajah ke tengah lingkaran";
                btnCapture.disabled = false;
            })
            .catch(err => { statusText.innerText = "Kamera diblokir!"; });
    }

    async function captureFace() {
        btnCapture.disabled = true;
        statusText.innerText = "Menganalisis wajah...";
        const detections = await faceapi.detectSingleFace(video, new faceapi.TinyFaceDetectorOptions({ inputSize: 224 })).withFaceLandmarks().withFaceDescriptor();

        if (detections) {
            const faceVector = JSON.stringify(Array.from(detections.descriptor));
            const formData = new FormData();
            formData.append('id_pegawai', $('#enroll_id_pegawai').val());
            formData.append('face_vector', faceVector);
            formData.append('<?= csrf_token() ?>', '<?= csrf_hash() ?>');

            fetch('<?= base_url('pegawai/simpan_face_vector') ?>', {
                method: 'POST',
                body: formData,
                headers: { 'X-Requested-With': 'XMLHttpRequest' }
            })
            .then(res => res.json())
            .then(res => {
                if (res.status === 'success') {
                    location.reload();
                } else {
                    alert("Gagal: " + res.msg);
                    btnCapture.disabled = false;
                }
            });
        } else {
            statusText.innerText = "Wajah tidak jelas.";
            btnCapture.disabled = false;
        }
    }

    function openEnroll(id, name) {
        $('#enroll_id_pegawai').val(id);
        $('#enroll_name').text(name);
        const modal = new bootstrap.Modal(document.getElementById('modalEnroll'));
        modal.show();
        document.getElementById('modalEnroll').addEventListener('shown.bs.modal', startCamera, { once: true });
    }

    function stopCamera() {
        if (video.srcObject) video.srcObject.getTracks().forEach(t => t.stop());
    }

    document.getElementById('btnGeneratePass').onclick = function() {
        Swal.fire({
            title: 'Konfirmasi',
            text: "Hash password semua pegawai menggunakan NIP?",
            icon: 'warning',
            showCancelButton: true,
            confirmButtonText: 'Ya, Jalankan!',
            cancelButtonText: 'Batal'
        }).then((result) => {
            if (result.isConfirmed) { runPasswordBatch(); }
        });
    };

    function runPasswordBatch() {
        Swal.fire({
            title: 'Memproses Password...',
            html: '<div class="progress mt-3"><div id="pass-progress" class="progress-bar progress-bar-striped progress-bar-animated" style="width: 0%"></div></div><p class="mt-2 small text-muted" id="pass-status">Menghubungi server...</p>',
            allowOutsideClick: false,
            showConfirmButton: false,
            didOpen: () => { executeBatch(0, 0); }
        });
    }

    function executeBatch(totalProcessed, totalInitial) {
        fetch('<?= base_url('pegawai/ajax_generate_password') ?>', {
            method: 'POST',
            headers: {
                'X-Requested-With': 'XMLHttpRequest',
                '<?= csrf_header() ?>': '<?= csrf_hash() ?>'
            }
        })
        .then(res => res.json())
        .then(data => {
            if (data.status === 'process') {
                let currentProcessed = totalProcessed + data.processed;
                let totalData = currentProcessed + data.remaining;
                let percent = Math.round((currentProcessed / totalData) * 100);
                document.getElementById('pass-progress').style.width = percent + '%';
                document.getElementById('pass-status').innerText = `Memproses ${currentProcessed} dari ${totalData} pegawai...`;
                executeBatch(currentProcessed, totalData);
            } else {
                Swal.fire('Selesai!', data.message, 'success').then(() => { location.reload(); });
            }
        })
        .catch(err => {
            Swal.fire('Error', 'Terjadi gangguan koneksi.', 'error');
        });
    }

    let tempFileName = "";
    let totalData = 0;
    let processedData = 0;

    function startUpload() {
        const file = document.getElementById('fileExcel').files[0];
        if (!file) return Swal.fire('Error', 'Pilih file dulu Pak!', 'error');

        const formData = new FormData();
        formData.append('file_excel', file);
        formData.append('<?= csrf_token() ?>', '<?= csrf_hash() ?>');

        $('#formArea').hide();
        $('#progressArea').show();
        $('#btnCloseImport').hide();

        fetch('<?= base_url('pegawai/init_import') ?>', { method: 'POST', body: formData })
        .then(res => res.json())
        .then(res => {
            if (res.status === 'success') {
                tempFileName = res.temp_file;
                totalData = res.total_rows;
                doBatchImport(0);
            } else {
                Swal.fire('Gagal', res.msg, 'error').then(() => location.reload());
            }
        });
    }

    function doBatchImport(offset) {
        const formData = new FormData();
        formData.append('temp_file', tempFileName);
        formData.append('offset', offset);
        formData.append('<?= csrf_token() ?>', '<?= csrf_hash() ?>');

        fetch('<?= base_url('pegawai/process_import_batch') ?>', { method: 'POST', body: formData })
        .then(res => res.json())
        .then(res => {
            if (res.status === 'success') {
                let percent = Math.round((offset / totalData) * 100);
                if (percent > 100) percent = 100;
                document.getElementById('importProgressBar').style.width = percent + '%';
                document.getElementById('importDetail').innerText = `${offset} dari ${totalData} data selesai`;

                if (!res.is_finished) {
                    doBatchImport(offset + 50);
                } else {
                    document.getElementById('importProgressBar').style.width = '100%';
                    Swal.fire('Selesai!', 'Semua data berhasil diproses.', 'success').then(() => location.reload());
                }
            }
        });
    }
</script>
<?= $this->endSection() ?>