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

<?= $this->section('content') ?>
<div class="card-header" style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 2rem;">
    <h1 class="page-title" style="margin-bottom: 0;">Data Penugasan Dosen</h1>
    <div>
        <a href="<?= base_url('penugasan-dosen/sync') ?>" class="btn btn-warning" onclick="return confirm('Proses ini akan menarik data Penugasan Dosen dari PDDIKTI. Lanjutkan?');">
            <i class='bx bx-refresh'></i> Sinkronisasi PDDIKTI
        </a>
    </div>
</div>

<?php if (session()->getFlashdata('success')) : ?>
    <div class="alert alert-success alert-dismissible fade show" role="alert" style="background-color: #d1fae5; color: #065f46; padding: 1rem; border-radius: 6px; margin-bottom: 1rem; border: 1px solid #a7f3d0;">
        <?= session()->getFlashdata('success') ?>
    </div>
<?php endif; ?>

<?php if (session()->getFlashdata('error')) : ?>
    <div class="alert alert-danger alert-dismissible fade show" role="alert" style="background-color: #fee2e2; color: #991b1b; padding: 1rem; border-radius: 6px; margin-bottom: 1rem; border: 1px solid #fecaca;">
        <?= session()->getFlashdata('error') ?>
    </div>
<?php endif; ?>

<div class="filter-section" style="background: white; padding: 1.5rem; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); margin-bottom: 1.5rem;">
    <form action="" method="GET" id="filterForm">
        <div style="display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 15px; align-items: end;">
            
            <div class="form-group" style="margin: 0;">
                <label style="font-size: 0.85rem; font-weight: 600; color: #475569; margin-bottom: 5px; display: block;">Cari Dosen</label>
                <div style="position: relative;">
                    <i class='bx bx-search' style="position: absolute; left: 10px; top: 10px; color: #94a3b8;"></i>
                    <input type="text" name="search" value="<?= esc($search) ?>" placeholder="Nama, NIDN, atau NUPTK..." style="width: 100%; padding: 8px 10px 8px 30px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.9rem;">
                </div>
            </div>

            <div class="form-group" style="margin: 0;">
                <label style="font-size: 0.85rem; font-weight: 600; color: #475569; margin-bottom: 5px; display: block;">Tahun Ajaran</label>
                <select name="tahun_ajaran" style="width: 100%; padding: 8px 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.9rem; background: #fff;" onchange="document.getElementById('filterForm').submit();">
                    <option value="">Semua Tahun</option>
                    <?php foreach($listTahun as $t): ?>
                        <option value="<?= $t['nama_tahun_ajaran'] ?>" <?= $tahun_ajaran == $t['nama_tahun_ajaran'] ? 'selected' : '' ?>><?= $t['nama_tahun_ajaran'] ?></option>
                    <?php endforeach; ?>
                </select>
            </div>

            <div class="form-group" style="margin: 0;">
                <label style="font-size: 0.85rem; font-weight: 600; color: #475569; margin-bottom: 5px; display: block;">Program Studi</label>
                <select name="prodi" style="width: 100%; padding: 8px 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.9rem; background: #fff;" onchange="document.getElementById('filterForm').submit();">
                    <option value="">Semua Prodi</option>
                    <?php foreach($listProdi as $p): ?>
                        <option value="<?= $p['id'] ?>" <?= $prodi_id == $p['id'] ? 'selected' : '' ?>><?= $p['jenjang'] ?> <?= $p['nama_prodi'] ?></option>
                    <?php endforeach; ?>
                </select>
            </div>

            <div class="form-group" style="margin: 0;">
                <label style="font-size: 0.85rem; font-weight: 600; color: #475569; margin-bottom: 5px; display: block;">Homebase</label>
                <select name="homebase" style="width: 100%; padding: 8px 10px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.9rem; background: #fff;" onchange="document.getElementById('filterForm').submit();">
                    <option value="">Semua</option>
                    <option value="Ya" <?= $homebase == 'Ya' ? 'selected' : '' ?>>Ya</option>
                    <option value="Tidak" <?= $homebase == 'Tidak' ? 'selected' : '' ?>>Tidak</option>
                </select>
            </div>

            <div class="form-group" style="margin: 0;">
                <label style="font-size: 0.85rem; font-weight: 600; color: #475569; margin-bottom: 5px; display: block;">Tampilkan</label>
                <div style="display: flex; gap: 10px;">
                    <select name="per_page" style="width: 80px; padding: 8px; border: 1px solid #cbd5e1; border-radius: 6px; font-size: 0.9rem; background: #fff;" onchange="document.getElementById('filterForm').submit();">
                        <option value="10" <?= $per_page == 10 ? 'selected' : '' ?>>10</option>
                        <option value="25" <?= $per_page == 25 ? 'selected' : '' ?>>25</option>
                        <option value="50" <?= $per_page == 50 ? 'selected' : '' ?>>50</option>
                        <option value="100" <?= $per_page == 100 ? 'selected' : '' ?>>100</option>
                    </select>
                    <button type="submit" class="btn btn-primary" style="padding: 8px 15px;"><i class='bx bx-search-alt-2'></i> Cari</button>
                    <?php if(!empty($search) || !empty($tahun_ajaran) || !empty($prodi_id) || !empty($homebase)): ?>
                        <a href="<?= base_url('penugasan-dosen') ?>" class="btn btn-light" style="padding: 8px 15px;" title="Reset Filter"><i class='bx bx-x'></i></a>
                    <?php endif; ?>
                </div>
            </div>

        </div>
    </form>
</div>

<div class="card" style="background: white; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,0.1); overflow: hidden;">
    <div class="table-responsive">
        <table class="table" style="width: 100%; border-collapse: collapse; margin: 0;">
            <thead>
                <tr style="background-color: #f8fafc; border-bottom: 2px solid #e2e8f0;">
                    <th style="padding: 1rem; text-align: left; color: #64748b; font-weight: 600; font-size: 0.875rem;">NO</th>
                    <th style="padding: 1rem; text-align: left; color: #64748b; font-weight: 600; font-size: 0.875rem;">NAMA DOSEN</th>
                    <th style="padding: 1rem; text-align: left; color: #64748b; font-weight: 600; font-size: 0.875rem;">NIDN/NUPTK</th>
                    <th style="padding: 1rem; text-align: left; color: #64748b; font-weight: 600; font-size: 0.875rem;">TAHUN AJARAN</th>
                    <th style="padding: 1rem; text-align: left; color: #64748b; font-weight: 600; font-size: 0.875rem;">PROGRAM STUDI</th>
                    <th style="padding: 1rem; text-align: left; color: #64748b; font-weight: 600; font-size: 0.875rem;">SURAT TUGAS</th>
                    <th style="padding: 1rem; text-align: left; color: #64748b; font-weight: 600; font-size: 0.875rem;">HOMEBASE?</th>
                </tr>
            </thead>
            <tbody>
                <?php 
                $page = isset($_GET['page_penugasan']) ? $_GET['page_penugasan'] : 1;
                $no = 1 + ($per_page * ($page - 1));
                foreach ($penugasan as $p) : 
                ?>
                    <tr style="border-bottom: 1px solid #e2e8f0;">
                        <td style="padding: 1rem;"><?= $no++ ?></td>
                        <td style="padding: 1rem;">
                            <div style="font-weight: 500; color: #334155; text-transform: uppercase;"><?= $p['nama_lengkap'] ?></div>
                            <div style="font-size: 0.8em; color: #64748b;"><?= $p['jenis_kelamin'] == 'L' ? 'Laki - Laki' : 'Perempuan' ?></div>
                        </td>
                        <td style="padding: 1rem; font-weight: 500;">
                            <?php if(!empty($p['nidn']) && !empty($p['nuptk'])): ?>
                                <div><?= $p['nidn'] ?></div>
                                <div style="color: #64748b; font-size: 0.85em;"><?= $p['nuptk'] ?></div>
                            <?php elseif(!empty($p['nidn'])): ?>
                                <?= $p['nidn'] ?>
                            <?php elseif(!empty($p['nuptk'])): ?>
                                <?= $p['nuptk'] ?>
                            <?php else: ?>
                                -
                            <?php endif; ?>
                        </td>
                        <td style="padding: 1rem; color: #334155;">
                            <?= $p['nama_tahun_ajaran'] ?>
                        </td>
                        <td style="padding: 1rem; color: #334155;">
                            <?= $p['nama_program_studi'] ?>
                        </td>
                        <td style="padding: 1rem;">
                            <div style="font-weight: 500; color: #334155;"><?= $p['no_surat_tugas'] ?: '-' ?></div>
                            <div style="font-size: 0.85em; color: #64748b;"><?= $p['tanggal_surat_tugas'] ? date('d/m/Y', strtotime($p['tanggal_surat_tugas'])) : '-' ?></div>
                        </td>
                        <td style="padding: 1rem;">
                            <?php if($p['is_homebase'] == 'Ya'): ?>
                                <span style="background-color: #d1fae5; color: #059669; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: bold;">
                                    Iya
                                </span>
                            <?php else: ?>
                                <span style="background-color: #f1f5f9; color: #475569; padding: 4px 8px; border-radius: 4px; font-size: 12px; font-weight: bold;">
                                    Tidak
                                </span>
                            <?php endif; ?>
                        </td>
                    </tr>
                <?php endforeach; ?>
                <?php if(empty($penugasan)) : ?>
                    <tr>
                        <td colspan="7" style="padding: 2rem; text-align: center; color: #64748b;">Belum ada data Penugasan Dosen. Silakan sinkronisasi dari PDDIKTI.</td>
                    </tr>
                <?php endif; ?>
            </tbody>
        </table>
    </div>
    
    <!-- Pagination Container -->
    <div style="padding: 1.5rem; border-top: 1px solid #e2e8f0; background: #f8fafc;">
        <?= $pager->links('penugasan', 'custom_pagination') ?>
    </div>
</div>
<?= $this->endSection() ?>
