<?php if (isset($component)) { $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54 = $component; } ?>
<?php if (isset($attributes)) { $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54 = $attributes; } ?>
<?php $component = App\View\Components\AppLayout::resolve([] + (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag ? $attributes->all() : [])); ?>
<?php $component->withName('app-layout'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php if (isset($attributes) && $attributes instanceof Illuminate\View\ComponentAttributeBag): ?>
<?php $attributes = $attributes->except(\App\View\Components\AppLayout::ignoredParameterNames()); ?>
<?php endif; ?>
<?php $component->withAttributes([]); ?>
    <div class="mb-12">
        <div class="flex flex-col md:flex-row justify-between items-start md:items-center gap-6 mb-8">
            <div class="relative">
                <div
                    class="absolute -left-3 -top-3 w-20 h-20 bg-gradient-to-br from-violet-500/10 to-indigo-600/10 rounded-full blur-xl">
                </div>
                <h1 class="text-4xl font-black tracking-tight dark:text-white relative z-10 mb-2">
                    <span class="bg-gradient-to-r from-violet-600 to-indigo-600 bg-clip-text text-transparent">
                        Pengajuan Status Akademik
                    </span>
                </h1>
                <p class="text-slate-500 dark:text-slate-400 text-sm pl-1">
                    <i data-lucide="send" class="w-4 h-4 inline mr-2"></i>
                    Pilih mahasiswa dan ajukan perubahan status secara massal
                </p>
            </div>

            <div class="flex items-center gap-4">
                <a href="<?php echo e(route('dashboard')); ?>"
                    class="px-4 py-2.5 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-xl text-sm font-medium text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-gray-700 transition-all flex items-center gap-2 shadow-sm">
                    <i data-lucide="arrow-left" class="w-4 h-4"></i>
                    <span>Kembali</span>
                </a>
            </div>
        </div>

        <!-- Flash Messages -->
        <?php if(session('success')): ?>
            <div
                class="mb-6 p-4 bg-gradient-to-r from-green-500/10 to-emerald-600/10 border border-green-500/20 rounded-2xl flex items-center gap-3">
                <div class="w-10 h-10 rounded-xl bg-green-500/10 text-green-500 flex items-center justify-center">
                    <i data-lucide="check-circle" class="w-5 h-5"></i>
                </div>
                <div class="flex-1">
                    <p class="font-medium text-green-700 dark:text-green-400"><?php echo e(session('success')); ?></p>
                </div>
                <button onclick="this.parentElement.remove()" class="text-green-500 hover:text-green-600">
                    <i data-lucide="x" class="w-4 h-4"></i>
                </button>
            </div>
        <?php endif; ?>

        <?php if(session('error')): ?>
            <div
                class="mb-6 p-4 bg-gradient-to-r from-red-500/10 to-rose-600/10 border border-red-500/20 rounded-2xl flex items-center gap-3">
                <div class="w-10 h-10 rounded-xl bg-red-500/10 text-red-500 flex items-center justify-center">
                    <i data-lucide="alert-triangle" class="w-5 h-5"></i>
                </div>
                <div class="flex-1">
                    <p class="font-medium text-red-700 dark:text-red-400"><?php echo e(session('error')); ?></p>
                </div>
                <button onclick="this.parentElement.remove()" class="text-red-500 hover:text-red-600">
                    <i data-lucide="x" class="w-4 h-4"></i>
                </button>
            </div>
        <?php endif; ?>

        <?php if(session('warning')): ?>
            <div
                class="mb-6 p-4 bg-gradient-to-r from-yellow-500/10 to-amber-600/10 border border-yellow-500/20 rounded-2xl flex items-center gap-3">
                <div class="w-10 h-10 rounded-xl bg-yellow-500/10 text-yellow-500 flex items-center justify-center">
                    <i data-lucide="alert-triangle" class="w-5 h-5"></i>
                </div>
                <div class="flex-1">
                    <p class="font-medium text-yellow-700 dark:text-yellow-400"><?php echo e(session('warning')); ?></p>
                </div>
                <button onclick="this.parentElement.remove()" class="text-yellow-500 hover:text-yellow-600">
                    <i data-lucide="x" class="w-4 h-4"></i>
                </button>
            </div>
        <?php endif; ?>

        <?php if(session('bulk_errors') && count(session('bulk_errors')) > 0): ?>
            <div class="mb-6 p-4 bg-yellow-50 dark:bg-yellow-900/20 border border-yellow-500/20 rounded-xl">
                <h4 class="font-medium text-yellow-700 dark:text-yellow-400 mb-2 flex items-center gap-2">
                    <i data-lucide="alert-triangle" class="w-4 h-4"></i>
                    Beberapa mahasiswa tidak diproses:
                </h4>
                <ul
                    class="list-disc list-inside space-y-1 text-sm text-yellow-600 dark:text-yellow-300 max-h-40 overflow-y-auto">
                    <?php $__currentLoopData = session('bulk_errors'); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $error): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                        <li><?php echo e($error); ?></li>
                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                </ul>
            </div>
        <?php endif; ?>

        <!-- ========== BULK ACTION FORM ========== -->
        <div
            class="mb-8 bg-white dark:bg-[#1a1a2e] rounded-xl border border-slate-200 dark:border-white/5 overflow-hidden">
            <div
                class="p-4 bg-gradient-to-r from-violet-50 to-indigo-50 dark:from-violet-900/20 dark:to-indigo-900/20 border-b">
                <h2 class="font-semibold flex items-center gap-2">
                    <i data-lucide="layers" class="w-5 h-5 text-violet-500"></i>
                    Bulk Action - Ajukan Perubahan Status Massal
                </h2>
            </div>
            <div class="p-6">
                <form action="<?php echo e(route('pengajuan-status.bulk-store')); ?>" method="POST" id="bulkPengajuanForm"
                    enctype="multipart/form-data">
                    <?php echo csrf_field(); ?>
                    <input type="hidden" name="mahasiswa_ids" id="selectedMahasiswaIds" value="">

                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                        <!-- Status yang Diajukan -->
                        <div class="md:col-span-2">
                            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-3">
                                Status yang Diajukan <span class="text-red-500">*</span>
                            </label>
                            <div class="grid grid-cols-2 md:grid-cols-5 gap-3">
                                <?php
                                    $statusList = [
                                        'aktif' => ['label' => 'Aktif', 'color' => 'green'],
                                        'cuti' => ['label' => 'Cuti', 'color' => 'yellow'],
                                        'drop_out' => ['label' => 'Drop Out', 'color' => 'red'],
                                        'lulus' => ['label' => 'Lulus', 'color' => 'blue'],
                                        'tidak_aktif' => ['label' => 'Tidak Aktif', 'color' => 'gray'],
                                    ];
                                ?>
                                <?php $__currentLoopData = $statusList; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $value => $data): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <label
                                        class="relative flex items-center justify-center p-4 border-2 rounded-xl cursor-pointer transition-all hover:border-<?php echo e($data['color']); ?>-300 bulk-status-option"
                                        data-status="<?php echo e($value); ?>">
                                        <input type="radio" name="pengajuan_jenis" value="<?php echo e($value); ?>"
                                            class="absolute opacity-0" required>
                                        <span class="text-sm font-medium"><?php echo e($data['label']); ?></span>
                                    </label>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </div>
                        </div>

                        <!-- Upload File Pengajuan (khusus Cuti) -->
                        <div id="filePengajuanSection" class="md:col-span-2 hidden">
                            <div class="border-t pt-4">
                                <h3 class="font-medium mb-3 flex items-center gap-2">
                                    <i data-lucide="file-text" class="w-4 h-4 text-violet-500"></i>
                                    Upload Dokumen Pendukung (Khusus Cuti)
                                </h3>

                                <!-- Pilih Semester Cuti -->
                                <div class="mb-4">
                                    <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                        Pilih Semester Cuti <span class="text-red-500">*</span>
                                    </label>
                                    <select name="cuti_semester" id="cuti_semester"
                                        class="w-full px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500">
                                        <option value="">-- Pilih Semester --</option>
                                        <?php for($i = 1; $i <= 14; $i++): ?>
                                            <option value="<?php echo e($i); ?>">Semester <?php echo e($i); ?></option>
                                        <?php endfor; ?>
                                    </select>
                                    <p class="text-xs text-slate-500 mt-1">Pilih semester yang akan dicuti</p>
                                </div>

                                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                                    <!-- File Pengajuan -->
                                    <div>
                                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                            File Pengajuan <span class="text-xs text-slate-400">(PDF, JPG, PNG - Max
                                                2MB)</span>
                                        </label>
                                        <div class="relative">
                                            <input type="file" name="pengajuan_file" id="pengajuan_file"
                                                accept=".pdf,.jpg,.jpeg,.png"
                                                class="w-full px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-violet-50 file:text-violet-700 hover:file:bg-violet-100">
                                        </div>
                                        <p class="text-xs text-slate-500 mt-1">Contoh: Surat Pengajuan Cuti, SK, dll</p>
                                    </div>

                                    <!-- Bukti Bayar -->
                                    <div>
                                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                            Bukti Pembayaran <span class="text-xs text-slate-400">(PDF, JPG, PNG - Max
                                                2MB)</span>
                                        </label>
                                        <div class="relative">
                                            <input type="file" name="bukti_bayar_file" id="bukti_bayar_file"
                                                accept=".pdf,.jpg,.jpeg,.png"
                                                class="w-full px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500 file:mr-4 file:py-2 file:px-4 file:rounded-lg file:border-0 file:text-sm file:font-medium file:bg-violet-50 file:text-violet-700 hover:file:bg-violet-100">
                                        </div>
                                        <p class="text-xs text-slate-500 mt-1">Bukti transfer / pembayaran</p>
                                    </div>
                                </div>
                            </div>
                        </div>

                        <!-- Info Jumlah Terpilih -->
                        <div class="md:col-span-2">
                            <div class="p-4 bg-slate-50 dark:bg-white/5 rounded-lg flex items-center justify-between">
                                <div>
                                    <span class="text-sm text-slate-500">Mahasiswa Terpilih:</span>
                                    <span class="text-2xl font-bold text-violet-600 ml-2" id="selectedCount">0</span>
                                </div>
                                <button type="button" onclick="clearAllSelections()"
                                    class="px-3 py-1 text-sm text-red-600 hover:bg-red-50 dark:hover:bg-red-900/20 rounded-lg transition">
                                    <i data-lucide="x" class="w-4 h-4 inline mr-1"></i>
                                    Hapus Semua
                                </button>
                            </div>
                        </div>
                    </div>

                    <!-- Tombol Submit -->
                    <div class="flex justify-end mt-6">
                        <button type="submit" id="submitBulkBtn" disabled
                            class="px-6 py-2.5 bg-gradient-to-r from-violet-600 to-indigo-700 text-white rounded-xl text-sm font-medium hover:shadow-lg hover:shadow-violet-500/25 transition-all flex items-center gap-2 disabled:opacity-50 disabled:cursor-not-allowed">
                            <i data-lucide="send" class="w-4 h-4"></i>
                            Ajukan Pengajuan Massal
                        </button>
                    </div>
                </form>
            </div>
        </div>

        <!-- ========== FILTER SECTION ========== -->
        <div class="mb-6 bg-white dark:bg-[#1a1a2e] rounded-xl border border-slate-200 dark:border-white/5 p-4">
            <form method="GET" action="<?php echo e(route('pengajuan-status.index')); ?>" class="space-y-4">
                <div class="grid grid-cols-1 md:grid-cols-5 gap-4">
                    <?php if(auth()->user()->role->name == 'superadmin' || auth()->user()->role->name == 'admin'): ?>
                        <div>
                            <label
                                class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Kampus</label>
                            <select name="kampus_id" id="kampusFilter"
                                class="w-full px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500">
                                <option value="all">Semua Kampus</option>
                                <?php if(isset($kampusList) && $kampusList->isNotEmpty()): ?>
                                    <?php $__currentLoopData = $kampusList; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $kampus): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <option value="<?php echo e($kampus->id); ?>"
                                            <?php echo e(request('kampus_id') == $kampus->id ? 'selected' : ''); ?>>
                                            <?php echo e($kampus->nama); ?>

                                        </option>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                <?php endif; ?>
                            </select>
                        </div>

                        <div>
                            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Program
                                Studi</label>
                            <select name="prodi_id" id="prodiFilter"
                                class="w-full px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500">
                                <option value="all">Semua Prodi</option>
                                <?php if(isset($prodiList) && $prodiList->isNotEmpty()): ?>
                                    <?php $__currentLoopData = $prodiList; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $prodi): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <option value="<?php echo e($prodi->id); ?>"
                                            <?php echo e(request('prodi_id') == $prodi->id ? 'selected' : ''); ?>>
                                            <?php echo e($prodi->nama); ?> (<?php echo e($prodi->jenjang); ?>)
                                        </option>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                <?php endif; ?>
                            </select>
                        </div>
                    <?php endif; ?>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Status
                            Akademik</label>
                        <select name="status_akademik"
                            class="w-full px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500">
                            <option value="all">Semua Status</option>
                            <option value="aktif" <?php echo e(request('status_akademik') == 'aktif' ? 'selected' : ''); ?>>Aktif
                            </option>
                            <option value="cuti" <?php echo e(request('status_akademik') == 'cuti' ? 'selected' : ''); ?>>Cuti
                            </option>
                            <option value="drop_out" <?php echo e(request('status_akademik') == 'drop_out' ? 'selected' : ''); ?>>
                                Drop Out</option>
                            <option value="lulus" <?php echo e(request('status_akademik') == 'lulus' ? 'selected' : ''); ?>>Lulus
                            </option>
                            <option value="tidak_aktif"
                                <?php echo e(request('status_akademik') == 'tidak_aktif' ? 'selected' : ''); ?>>Tidak Aktif
                            </option>
                        </select>
                    </div>

                    <div>
                        <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Status
                            Pengajuan</label>
                        <select name="pengajuan_status"
                            class="w-full px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500">
                            <option value="all">Semua</option>
                            <option value="tidak_ada"
                                <?php echo e(request('pengajuan_status') == 'tidak_ada' ? 'selected' : ''); ?>>Tidak Ada</option>
                            <option value="pending" <?php echo e(request('pengajuan_status') == 'pending' ? 'selected' : ''); ?>>
                                Pending</option>
                            <option value="disetujui"
                                <?php echo e(request('pengajuan_status') == 'disetujui' ? 'selected' : ''); ?>>Disetujui</option>
                            <option value="ditolak" <?php echo e(request('pengajuan_status') == 'ditolak' ? 'selected' : ''); ?>>
                                Ditolak</option>
                        </select>
                    </div>

                    <div>
                        <label
                            class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">Pencarian</label>
                        <div class="relative">
                            <i data-lucide="search"
                                class="absolute left-3 top-1/2 transform -translate-y-1/2 w-4 h-4 text-slate-400"></i>
                            <input type="text" name="search" value="<?php echo e(request('search')); ?>"
                                placeholder="NIM / Nama"
                                class="w-full pl-10 pr-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm focus:ring-2 focus:ring-violet-500">
                        </div>
                    </div>
                </div>

                <div class="flex justify-end gap-2">
                    <button type="submit"
                        class="px-4 py-2 bg-gradient-to-r from-violet-600 to-indigo-700 text-white rounded-lg text-sm font-medium hover:shadow-lg hover:shadow-violet-500/25 transition-all flex items-center gap-2">
                        <i data-lucide="filter" class="w-4 h-4"></i> Filter
                    </button>
                    <a href="<?php echo e(route('pengajuan-status.index')); ?>"
                        class="px-4 py-2 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-lg text-sm font-medium text-slate-600 dark:text-slate-300 hover:bg-slate-50 dark:hover:bg-gray-700 transition-all flex items-center gap-2">
                        <i data-lucide="x" class="w-4 h-4"></i> Reset
                    </a>
                </div>
            </form>
        </div>

        <!-- ========== TABLE MAHASISWA DENGAN CHECKBOX ========== -->
        <div class="bg-white dark:bg-[#1a1a2e] rounded-xl border border-slate-200 dark:border-white/5 overflow-hidden">
            <div class="overflow-x-auto">
                <table class="w-full">
                    <thead>
                        <tr class="bg-slate-50/50 dark:bg-white/5 border-b">
                            <th class="py-4 px-6 w-12">
                                <input type="checkbox" id="selectAll" class="w-4 h-4 text-violet-600 rounded">
                            </th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">No</th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">NIM</th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">Nama</th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">Kampus/Prodi
                            </th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">Angkatan
                            </th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">Status
                                Akademik</th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">Status
                                Pengajuan</th>
                            <th class="text-left py-4 px-6 text-xs font-semibold text-slate-500 uppercase">Aksi</th>
                        </tr>
                    </thead>
                    <tbody class="divide-y">
                        <?php $__empty_1 = true; $__currentLoopData = $mahasiswa; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $index => $m): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
                            <?php
                                // Status Akademik
                                $statusAkademikClass = match ($m->status_akademik ?? '') {
                                    'aktif' => 'bg-green-500/10 text-green-600',
                                    'cuti' => 'bg-yellow-500/10 text-yellow-600',
                                    'drop_out' => 'bg-red-500/10 text-red-600',
                                    'lulus' => 'bg-blue-500/10 text-blue-600',
                                    'tidak_aktif' => 'bg-gray-500/10 text-gray-600',
                                    default => 'bg-slate-500/10 text-slate-600',
                                };

                                $statusAkademikText = match ($m->status_akademik ?? '') {
                                    'aktif' => 'Aktif',
                                    'cuti' => 'Cuti',
                                    'drop_out' => 'Drop Out',
                                    'lulus' => 'Lulus',
                                    'tidak_aktif' => 'Tidak Aktif',
                                    default => $m->status_akademik ?? '-',
                                };

                                // Status Pengajuan
                                $pengajuanClass = match ($m->pengajuan_status ?? '') {
                                    'pending' => 'bg-purple-500/10 text-purple-600',
                                    'disetujui' => 'bg-green-500/10 text-green-600',
                                    'ditolak' => 'bg-red-500/10 text-red-600',
                                    'tidak_ada' => 'bg-slate-500/10 text-slate-600',
                                    default => 'bg-slate-500/10 text-slate-600',
                                };

                                $pengajuanText = match ($m->pengajuan_status ?? '') {
                                    'pending' => 'Pending',
                                    'disetujui' => 'Disetujui',
                                    'ditolak' => 'Ditolak',
                                    'tidak_ada' => 'Tidak Ada',
                                    default => $m->pengajuan_status ?? '-',
                                };

                                $pengajuanJenisText = match ($m->pengajuan_jenis ?? '') {
                                    'aktif' => 'Aktif',
                                    'cuti' => 'Cuti',
                                    'drop_out' => 'Drop Out',
                                    'lulus' => 'Lulus',
                                    'tidak_aktif' => 'Tidak Aktif',
                                    default => $m->pengajuan_jenis ?? '',
                                };

                                $isDisabled = ($m->pengajuan_status ?? '') === 'pending';
                            ?>
                            <tr
                                class="hover:bg-slate-50/50 dark:hover:bg-white/5 <?php echo e($isDisabled ? 'opacity-50' : ''); ?>">
                                <td class="py-4 px-6">
                                    <?php if(!$isDisabled): ?>
                                        <input type="checkbox"
                                            class="mahasiswa-checkbox w-4 h-4 text-violet-600 rounded"
                                            value="<?php echo e($m->id); ?>" data-nama="<?php echo e($m->nama); ?>"
                                            data-nim="<?php echo e($m->nim); ?>">
                                    <?php endif; ?>
                                </td>
                                <td class="py-4 px-6 font-mono text-sm"><?php echo e($mahasiswa->firstItem() + $index); ?></td>
                                <td class="py-4 px-6 font-mono text-sm"><?php echo e($m->nim ?? '-'); ?></td>
                                <td class="py-4 px-6 font-medium"><?php echo e($m->nama ?? '-'); ?></td>
                                <td class="py-4 px-6">
                                    <div class="text-sm"><?php echo e($m->kampus->nama ?? '-'); ?></div>
                                    <div class="text-xs text-slate-500"><?php echo e($m->prodi->nama ?? '-'); ?></div>
                                </td>
                                <td class="py-4 px-6 text-sm"><?php echo e($m->angkatan ?? '-'); ?></td>
                                <td class="py-4 px-6">
                                    <span class="px-2 py-1 text-xs rounded-lg <?php echo e($statusAkademikClass); ?>">
                                        <?php echo e($statusAkademikText); ?>

                                    </span>
                                </td>
                                <td class="py-4 px-6">
                                    <span class="px-2 py-1 text-xs rounded-lg <?php echo e($pengajuanClass); ?>">
                                        <?php echo e($pengajuanText); ?>

                                    </span>
                                    <?php if(($m->pengajuan_status ?? '') === 'pending' && ($m->pengajuan_jenis ?? '')): ?>
                                        <span class="text-xs text-slate-500 block mt-1">
                                            → <?php echo e($pengajuanJenisText); ?>

                                        </span>
                                    <?php endif; ?>
                                </td>
                                <td class="py-4 px-6">
                                    <button type="button" onclick="showDetail(<?php echo e($m->id); ?>)"
                                        class="p-2 text-blue-600 hover:bg-blue-50 dark:hover:bg-blue-900/20 rounded-lg transition"
                                        title="Detail">
                                        <i data-lucide="eye" class="w-4 h-4"></i>
                                    </button>
                                </td>
                            </tr>
                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
                            <tr>
                                <td colspan="9" class="py-12 text-center text-slate-500">
                                    <i data-lucide="inbox" class="w-12 h-12 mx-auto mb-3 text-slate-400"></i>
                                    <p>Tidak ada data mahasiswa</p>
                                </td>
                            </tr>
                        <?php endif; ?>
                    </tbody>
                </table>
            </div>

            <!-- Pagination -->
            <?php if($mahasiswa->hasPages()): ?>
                <div class="p-4 border-t">
                    <?php echo e($mahasiswa->withQueryString()->links('vendor.pagination.tailwind')); ?>

                </div>
            <?php endif; ?>
        </div>
    </div>

    <!-- Modal Detail Mahasiswa -->
    <div id="detailModal" class="fixed inset-0 z-50 hidden overflow-y-auto">
        <div class="flex items-end justify-center min-h-screen pt-4 px-4 pb-20 text-center sm:block sm:p-0">
            <div class="fixed inset-0 bg-gray-500 bg-opacity-75 transition-opacity" onclick="closeDetailModal()">
            </div>
            <div
                class="inline-block align-bottom bg-white dark:bg-[#1a1a2e] rounded-3xl text-left overflow-hidden shadow-xl transform transition-all sm:my-8 sm:align-middle sm:max-w-2xl sm:w-full">
                <div class="p-6">
                    <div class="flex justify-between items-center mb-4">
                        <h3 class="text-lg font-bold">Detail Mahasiswa</h3>
                        <button onclick="closeDetailModal()" class="text-slate-400 hover:text-slate-500">
                            <i data-lucide="x" class="w-5 h-5"></i>
                        </button>
                    </div>
                    <div id="detailModalContent" class="space-y-4">
                        <div class="text-center py-8" id="detailLoading">
                            <div
                                class="inline-block animate-spin rounded-full h-8 w-8 border-4 border-violet-500 border-t-transparent">
                            </div>
                            <p class="mt-2 text-sm text-slate-500">Memuat...</p>
                        </div>
                        <div id="detailData" class="hidden"></div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <script>
        document.addEventListener('DOMContentLoaded', function() {
            lucide.createIcons();

            // Tampilkan section upload file hanya jika status yang dipilih adalah "cuti"
            const statusRadios = document.querySelectorAll('input[name="pengajuan_jenis"]');
            const fileSection = document.getElementById('filePengajuanSection');
            const cutiSemesterSelect = document.getElementById('cuti_semester');

            statusRadios.forEach(radio => {
                radio.addEventListener('change', function() {
                    if (this.value === 'cuti') {
                        fileSection.classList.remove('hidden');
                        if (cutiSemesterSelect) cutiSemesterSelect.setAttribute('required',
                            'required');
                    } else {
                        fileSection.classList.add('hidden');
                        if (cutiSemesterSelect) cutiSemesterSelect.removeAttribute('required');
                        document.getElementById('pengajuan_file').value = '';
                        document.getElementById('bukti_bayar_file').value = '';
                    }
                });
            });

            // Filter Prodi berdasarkan Kampus
            const kampusFilter = document.getElementById('kampusFilter');
            const prodiFilter = document.getElementById('prodiFilter');

            if (kampusFilter) {
                kampusFilter.addEventListener('change', function() {
                    const kampusId = this.value;
                    if (kampusId === 'all') {
                        if (prodiFilter) {
                            prodiFilter.innerHTML = '<option value="all">Semua Prodi</option>';
                        }
                        return;
                    }
                    fetch(`/pengajuan-status/get-prodi/${kampusId}`)
                        .then(response => response.json())
                        .then(data => {
                            if (prodiFilter) {
                                prodiFilter.innerHTML = '<option value="all">Semua Prodi</option>';
                                data.forEach(prodi => {
                                    prodiFilter.innerHTML +=
                                        `<option value="${prodi.id}">${prodi.nama} (${prodi.jenjang})</option>`;
                                });
                            }
                        })
                        .catch(error => console.error('Error:', error));
                });
            }

            // Select All Checkbox
            const selectAll = document.getElementById('selectAll');
            const checkboxes = document.querySelectorAll('.mahasiswa-checkbox');
            const submitBtn = document.getElementById('submitBulkBtn');
            const selectedCount = document.getElementById('selectedCount');
            const selectedIdsInput = document.getElementById('selectedMahasiswaIds');

            function updateSelectedCount() {
                const selected = Array.from(document.querySelectorAll('.mahasiswa-checkbox:checked'));
                const count = selected.length;
                selectedCount.textContent = count;
                submitBtn.disabled = count === 0;
                const ids = selected.map(cb => cb.value);
                selectedIdsInput.value = JSON.stringify(ids);
            }

            if (selectAll) {
                selectAll.addEventListener('change', function() {
                    checkboxes.forEach(cb => cb.checked = this.checked);
                    updateSelectedCount();
                });
            }

            checkboxes.forEach(cb => {
                cb.addEventListener('change', updateSelectedCount);
            });

            window.clearAllSelections = function() {
                checkboxes.forEach(cb => cb.checked = false);
                if (selectAll) selectAll.checked = false;
                updateSelectedCount();
            };

            // Highlight selected status option
            document.querySelectorAll('.bulk-status-option').forEach(opt => {
                opt.addEventListener('click', function() {
                    document.querySelectorAll('.bulk-status-option').forEach(o => {
                        o.classList.remove('border-violet-500', 'bg-violet-50',
                            'dark:bg-violet-900/20');
                        o.classList.add('border-slate-200', 'dark:border-gray-700');
                    });
                    this.classList.remove('border-slate-200', 'dark:border-gray-700');
                    this.classList.add('border-violet-500', 'bg-violet-50',
                    'dark:bg-violet-900/20');
                });
            });

            // ========== FORM SUBMISSION DENGAN VALIDASI ==========
            const bulkForm = document.getElementById('bulkPengajuanForm');

            bulkForm.addEventListener('submit', function(e) {
                // PREVENT DEFAULT TERLEBIH DAHULU
                e.preventDefault();

                const selected = document.querySelectorAll('.mahasiswa-checkbox:checked');
                if (selected.length === 0) {
                    Swal.fire('Peringatan', 'Pilih minimal 1 mahasiswa', 'warning');
                    return false;
                }

                const status = document.querySelector('input[name="pengajuan_jenis"]:checked');
                if (!status) {
                    Swal.fire('Peringatan', 'Pilih status yang akan diajukan', 'warning');
                    return false;
                }

                // Validasi file untuk status cuti
                if (status.value === 'cuti') {
                    const pengajuanFile = document.getElementById('pengajuan_file').files[0];
                    const buktiFile = document.getElementById('bukti_bayar_file').files[0];
                    const cutiSemester = document.getElementById('cuti_semester').value;

                    if (!cutiSemester) {
                        Swal.fire('Peringatan', 'Pilih semester cuti', 'warning');
                        return false;
                    }

                    if (!pengajuanFile && !buktiFile) {
                        Swal.fire('Peringatan', 'Untuk pengajuan cuti, upload minimal satu file pendukung',
                            'warning');
                        return false;
                    }

                    // Validasi ukuran file (2MB)
                    if (pengajuanFile && pengajuanFile.size > 2 * 1024 * 1024) {
                        Swal.fire('Peringatan', 'File pengajuan maksimal 2MB', 'warning');
                        return false;
                    }

                    if (buktiFile && buktiFile.size > 2 * 1024 * 1024) {
                        Swal.fire('Peringatan', 'File bukti bayar maksimal 2MB', 'warning');
                        return false;
                    }

                    // Validasi tipe file
                    const allowedTypes = ['application/pdf', 'image/jpeg', 'image/jpg', 'image/png'];
                    if (pengajuanFile && !allowedTypes.includes(pengajuanFile.type)) {
                        Swal.fire('Peringatan', 'File pengajuan harus berupa PDF, JPG, atau PNG',
                        'warning');
                        return false;
                    }

                    if (buktiFile && !allowedTypes.includes(buktiFile.type)) {
                        Swal.fire('Peringatan', 'File bukti bayar harus berupa PDF, JPG, atau PNG',
                            'warning');
                        return false;
                    }
                }

                // Update hidden input dengan array of IDs
                const ids = Array.from(selected).map(cb => cb.value);
                document.getElementById('selectedMahasiswaIds').value = JSON.stringify(ids);

                const statusLabel = status.nextElementSibling ? status.nextElementSibling.textContent :
                    'status terpilih';

                Swal.fire({
                    title: 'Konfirmasi Pengajuan Massal',
                    html: `Ajukan perubahan status menjadi <strong>${statusLabel}</strong> untuk <strong>${selected.length}</strong> mahasiswa?`,
                    icon: 'question',
                    showCancelButton: true,
                    confirmButtonColor: '#8b5cf6',
                    confirmButtonText: 'Ya, Ajukan!',
                    cancelButtonText: 'Batal'
                }).then((result) => {
                    if (result.isConfirmed) {
                        // Submit form secara manual
                        bulkForm.submit();
                    }
                });
            });
        });

        // Fungsi detail modal
        function showDetail(id) {
            const modal = document.getElementById('detailModal');
            const loading = document.getElementById('detailLoading');
            const data = document.getElementById('detailData');

            modal.classList.remove('hidden');
            loading.classList.remove('hidden');
            data.classList.add('hidden');

            fetch(`/pengajuan-status/${id}`)
                .then(response => {
                    if (!response.ok) {
                        throw new Error(`HTTP ${response.status}: ${response.statusText}`);
                    }
                    return response.json();
                })
                .then(m => {
                    loading.classList.add('hidden');

                    // Cek jika response memiliki error
                    if (m.error) {
                        data.innerHTML = `<p class="text-center text-red-500">Error: ${m.message}</p>`;
                        data.classList.remove('hidden');
                        return;
                    }

                    let html = `
                <div class="space-y-4">
                    <div class="grid grid-cols-2 gap-4">
                        <div>
                            <p class="text-xs text-slate-500">NIM</p>
                            <p class="font-medium">${escapeHtml(m.nim || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Nama</p>
                            <p class="font-medium">${escapeHtml(m.nama || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Kampus</p>
                            <p class="font-medium">${escapeHtml(m.kampus || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Prodi</p>
                            <p class="font-medium">${escapeHtml(m.prodi || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Angkatan</p>
                            <p class="font-medium">${escapeHtml(m.angkatan || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Status Akademik</p>
                            <p class="font-medium">${escapeHtml(m.status_akademik_text || '-')}</p>
                        </div>
            `;

                    if (m.pengajuan_status && m.pengajuan_status !== 'tidak_ada') {
                        html += `
                        <div>
                            <p class="text-xs text-slate-500">Status Pengajuan</p>
                            <p class="font-medium">${escapeHtml(m.pengajuan_status_text || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Pengajuan Menjadi</p>
                            <p class="font-medium">${escapeHtml(m.pengajuan_jenis_text || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Tanggal Pengajuan</p>
                            <p class="font-medium">${escapeHtml(m.pengajuan_at || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Diajukan Oleh</p>
                            <p class="font-medium">${escapeHtml(m.pengajuan_by || '-')}</p>
                        </div>
                `;

                        if (m.pengajuan_file) {
                            html += `
                        <div class="col-span-2">
                            <p class="text-xs text-slate-500 mb-1">File Pengajuan</p>
                            <a href="/pengajuan-status/${m.id}/download-pengajuan"
                               class="inline-flex items-center gap-2 px-3 py-2 bg-blue-50 text-blue-600 rounded-lg hover:bg-blue-100 transition text-sm">
                                <i data-lucide="file-text" class="w-4 h-4"></i>
                                Download File Pengajuan
                            </a>
                        </div>
                    `;
                        }

                        if (m.bukti_bayar_file) {
                            html += `
                        <div class="col-span-2">
                            <p class="text-xs text-slate-500 mb-1">Bukti Pembayaran</p>
                            <a href="/pengajuan-status/${m.id}/download-bukti"
                               class="inline-flex items-center gap-2 px-3 py-2 bg-green-50 text-green-600 rounded-lg hover:bg-green-100 transition text-sm">
                                <i data-lucide="receipt" class="w-4 h-4"></i>
                                Download Bukti Bayar
                            </a>
                        </div>
                    `;
                        }
                    }

                    if (m.pengajuan_validasi_at) {
                        html += `
                        <div>
                            <p class="text-xs text-slate-500">Tanggal Validasi</p>
                            <p class="font-medium">${escapeHtml(m.pengajuan_validasi_at || '-')}</p>
                        </div>
                        <div>
                            <p class="text-xs text-slate-500">Validator</p>
                            <p class="font-medium">${escapeHtml(m.validator || '-')}</p>
                        </div>
                `;
                    }

                    if (m.cuti_history_text && m.cuti_history_text !== '-') {
                        html += `
                        <div class="col-span-2">
                            <p class="text-xs text-slate-500 mb-1">History Cuti</p>
                            <p class="font-medium text-yellow-600">${escapeHtml(m.cuti_history_text)}</p>
                        </div>
                `;
                    }

                    html += `</div></div>`;
                    data.innerHTML = html;
                    data.classList.remove('hidden');

                    // Refresh icons
                    if (typeof lucide !== 'undefined') {
                        lucide.createIcons();
                    }
                })
                .catch(error => {
                    console.error('Error:', error);
                    loading.classList.add('hidden');
                    data.innerHTML = `<p class="text-center text-red-500">Gagal memuat data: ${error.message}</p>`;
                    data.classList.remove('hidden');
                });
        }

        // Helper function untuk escape HTML
        function escapeHtml(text) {
            if (!text) return text;
            const div = document.createElement('div');
            div.textContent = text;
            return div.innerHTML;
        }

        function closeDetailModal() {
            document.getElementById('detailModal').classList.add('hidden');
        }
    </script>
 <?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $attributes = $__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__attributesOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54)): ?>
<?php $component = $__componentOriginal9ac128a9029c0e4701924bd2d73d7f54; ?>
<?php unset($__componentOriginal9ac128a9029c0e4701924bd2d73d7f54); ?>
<?php endif; ?>
<?php /**PATH C:\Users\User\Documents\K2-PROJECTS\k2-sipema\resources\views/pengajuan-status/index.blade.php ENDPATH**/ ?>