<?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">
                        Tambah Program Studi
                    </span>
                </h1>
                <p class="text-slate-500 dark:text-slate-400 text-sm pl-1">
                    <i data-lucide="plus-circle" class="w-4 h-4 inline mr-2"></i>
                    Tambahkan data program studi baru ke dalam sistem
                </p>
            </div>

            <div class="flex items-center gap-4">
                <a href="<?php echo e(route('prodi.index')); ?>"
                    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>

        <!-- Main Form Card -->
        <div class="max-w-2xl mx-auto">
            <div class="group relative">
                <div
                    class="absolute -inset-1 bg-gradient-to-r from-violet-600/10 to-indigo-600/10 rounded-3xl blur opacity-0 group-hover:opacity-30 transition duration-500">
                </div>
                <div
                    class="relative bg-white dark:bg-[#1a1a2e] p-8 rounded-3xl border border-slate-200 dark:border-white/5 shadow-xl">

                    <!-- Form Header -->
                    <div class="flex items-center gap-4 mb-8 pb-6 border-b border-slate-100 dark:border-white/5">
                        <div
                            class="w-12 h-12 rounded-2xl bg-gradient-to-br from-violet-500/10 to-indigo-600/10 text-violet-500 flex items-center justify-center">
                            <i data-lucide="book-open" class="w-6 h-6"></i>
                        </div>
                        <div>
                            <h3 class="text-xl font-bold text-gray-900 dark:text-white">Form Tambah Program Studi</h3>
                            <p class="text-sm text-slate-500 dark:text-slate-400">Isi form berikut untuk menambahkan program studi baru</p>
                        </div>
                    </div>

                    <!-- Error Messages -->
                    <?php if($errors->any()): ?>
                        <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 animate-fade-in">
                            <div class="flex items-start gap-3">
                                <div
                                    class="w-10 h-10 rounded-xl bg-red-500/10 text-red-500 flex items-center justify-center flex-shrink-0">
                                    <i data-lucide="alert-triangle" class="w-5 h-5"></i>
                                </div>
                                <div class="flex-1">
                                    <h4 class="font-bold text-red-700 dark:text-red-400 mb-2">Terjadi kesalahan:</h4>
                                    <ul class="space-y-1">
                                        <?php $__currentLoopData = $errors->all(); $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $error): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                            <li class="text-sm text-red-600 dark:text-red-300">• <?php echo e($error); ?></li>
                                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    </ul>
                                </div>
                            </div>
                        </div>
                    <?php endif; ?>

                    <!-- Form -->
                    <form action="<?php echo e(route('prodi.store')); ?>" method="POST" class="space-y-6">
                        <?php echo csrf_field(); ?>

                        <!-- Kampus Selection -->
                        <div>
                            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                Kampus <span class="text-red-500">*</span>
                            </label>
                            <div class="relative">
                                <i data-lucide="school"
                                    class="absolute left-4 top-1/2 transform -translate-y-1/2 w-4 h-4 text-slate-400"></i>
                                <select name="kampus_id" id="kampus_id" required
                                    class="w-full pl-12 pr-4 py-3 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-xl text-gray-700 dark:text-gray-300 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all appearance-none cursor-pointer">
                                    <option value="">-- Pilih Kampus --</option>
                                    <?php $__currentLoopData = $kampus; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $k): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                        <option value="<?php echo e($k->id); ?>" <?php echo e(old('kampus_id') == $k->id ? 'selected' : ''); ?>>
                                            <?php echo e($k->nama); ?>

                                            <?php if($k->singkatan): ?>
                                                (<?php echo e($k->singkatan); ?>)
                                            <?php endif; ?>
                                        </option>
                                    <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                </select>
                                <i data-lucide="chevron-down"
                                    class="absolute right-4 top-1/2 transform -translate-y-1/2 w-4 h-4 text-slate-400 pointer-events-none"></i>
                            </div>
                            <?php $__errorArgs = ['kampus_id'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <p class="mt-2 text-sm text-red-600 dark:text-red-400"><?php echo e($message); ?></p>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <!-- Nama Program Studi -->
                        <div>
                            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                Nama Program Studi <span class="text-red-500">*</span>
                            </label>
                            <div class="relative">
                                <i data-lucide="book-open"
                                    class="absolute left-4 top-1/2 transform -translate-y-1/2 w-4 h-4 text-slate-400"></i>
                                <input type="text" name="nama" value="<?php echo e(old('nama')); ?>"
                                    class="w-full pl-12 pr-4 py-3 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-xl text-gray-700 dark:text-gray-300 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all"
                                    placeholder="Masukkan nama program studi" required>
                            </div>
                            <?php $__errorArgs = ['nama'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <p class="mt-2 text-sm text-red-600 dark:text-red-400"><?php echo e($message); ?></p>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <!-- Kode Program Studi -->
                        <div>
                            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                Kode Program Studi <span class="text-red-500">*</span>
                            </label>
                            <div class="relative">
                                <i data-lucide="hash"
                                    class="absolute left-4 top-1/2 transform -translate-y-1/2 w-4 h-4 text-slate-400"></i>
                                <input type="text" name="kode" value="<?php echo e(old('kode')); ?>"
                                    class="w-full pl-12 pr-4 py-3 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-xl text-gray-700 dark:text-gray-300 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all uppercase"
                                    placeholder="Contoh: SI, TI, AKT" required>
                            </div>
                            <p class="mt-2 text-sm text-slate-500 dark:text-slate-400">
                                Gunakan kode singkat yang mudah diingat (max 10 karakter)
                            </p>
                            <?php $__errorArgs = ['kode'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <p class="mt-2 text-sm text-red-600 dark:text-red-400"><?php echo e($message); ?></p>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <!-- Jenjang (Dynamic berdasarkan kampus yang dipilih) -->
                        <div>
                            <label class="block text-sm font-medium text-gray-700 dark:text-gray-300 mb-2">
                                Jenjang <span class="text-red-500">*</span>
                            </label>
                            <div class="relative">
                                <i data-lucide="graduation-cap"
                                    class="absolute left-4 top-1/2 transform -translate-y-1/2 w-4 h-4 text-slate-400"></i>
                                <select name="jenjang" id="jenjang" required
                                    class="w-full pl-12 pr-4 py-3 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-xl text-gray-700 dark:text-gray-300 placeholder-gray-400 focus:outline-none focus:ring-2 focus:ring-violet-500 focus:border-transparent transition-all appearance-none cursor-pointer">
                                    <option value="">-- Pilih Kampus Terlebih Dahulu --</option>
                                </select>
                                <i data-lucide="chevron-down"
                                    class="absolute right-4 top-1/2 transform -translate-y-1/2 w-4 h-4 text-slate-400 pointer-events-none"></i>
                            </div>
                            <div id="jenjangLoading" class="hidden mt-2">
                                <div class="flex items-center text-sm text-slate-500">
                                    <i data-lucide="loader-2" class="w-4 h-4 animate-spin mr-2"></i>
                                    Memuat daftar jenjang...
                                </div>
                            </div>
                            <?php $__errorArgs = ['jenjang'];
$__bag = $errors->getBag($__errorArgs[1] ?? 'default');
if ($__bag->has($__errorArgs[0])) :
if (isset($message)) { $__messageOriginal = $message; }
$message = $__bag->first($__errorArgs[0]); ?>
                                <p class="mt-2 text-sm text-red-600 dark:text-red-400"><?php echo e($message); ?></p>
                            <?php unset($message);
if (isset($__messageOriginal)) { $message = $__messageOriginal; }
endif;
unset($__errorArgs, $__bag); ?>
                        </div>

                        <!-- Biaya Formulir (Preview) -->
                        <div class="bg-slate-50 dark:bg-white/5 p-6 rounded-xl">
                            <h4 class="font-semibold text-lg mb-4 text-gray-900 dark:text-white flex items-center gap-2">
                                <i data-lucide="dollar-sign" class="w-5 h-5 text-violet-500"></i>
                                Biaya Formulir
                            </h4>

                            <div class="space-y-3">
                                <div class="flex items-center justify-between p-4 bg-white dark:bg-gray-800 border border-slate-200 dark:border-gray-700 rounded-xl">
                                    <div>
                                        <p class="text-sm text-slate-500 dark:text-slate-400">Biaya berdasarkan kampus dan jenjang</p>
                                        <p class="text-2xl font-bold text-violet-600 dark:text-violet-400 mt-1" id="biayaFormulirPreview">Rp 0</p>
                                    </div>
                                    <div class="w-12 h-12 rounded-xl bg-violet-500/10 text-violet-500 flex items-center justify-center">
                                        <i data-lucide="info" class="w-6 h-6"></i>
                                    </div>
                                </div>
                                <p class="text-xs text-slate-500 dark:text-slate-400">
                                    <i data-lucide="info" class="w-3 h-3 inline mr-1"></i>
                                    Biaya formulir otomatis diambil dari data kampus yang dipilih
                                </p>
                            </div>
                        </div>

                        <!-- Form Footer -->
                        <div class="pt-6 border-t border-slate-100 dark:border-white/5">
                            <div class="flex flex-col sm:flex-row justify-between items-center gap-4">
                                <div class="text-sm text-slate-500 dark:text-slate-400">
                                    <i data-lucide="info" class="w-4 h-4 inline mr-1"></i>
                                    Field dengan tanda <span class="text-red-500">*</span> wajib diisi
                                </div>
                                <div class="flex gap-3">
                                    <a href="<?php echo e(route('prodi.index')); ?>"
                                        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">
                                        <i data-lucide="arrow-left" class="w-4 h-4"></i>
                                        Kembali
                                    </a>
                                    <button type="submit"
                                        class="px-4 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">
                                        <i data-lucide="save" class="w-4 h-4"></i>
                                        Simpan Program Studi
                                    </button>
                                </div>
                            </div>
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </div>

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

            // Auto uppercase untuk kode program studi
            const kodeInput = document.querySelector('input[name="kode"]');
            if (kodeInput) {
                kodeInput.addEventListener('input', function(e) {
                    this.value = this.value.toUpperCase();
                });
            }

            const kampusSelect = document.getElementById('kampus_id');
            const jenjangSelect = document.getElementById('jenjang');
            const jenjangLoading = document.getElementById('jenjangLoading');
            const biayaPreview = document.getElementById('biayaFormulirPreview');

            // Fungsi untuk memuat jenjang berdasarkan kampus yang dipilih
            function loadJenjang(kampusId) {
                if (!kampusId) {
                    jenjangSelect.innerHTML = '<option value="">-- Pilih Kampus Terlebih Dahulu --</option>';
                    jenjangSelect.disabled = true;
                    biayaPreview.textContent = 'Rp 0';
                    return;
                }

                jenjangSelect.disabled = true;
                jenjangSelect.innerHTML = '<option value="">-- Memuat jenjang --</option>';
                jenjangLoading.classList.remove('hidden');
                biayaPreview.textContent = 'Rp 0';

                fetch(`/prodi/get-jenjang/${kampusId}`)
                    .then(response => response.json())
                    .then(data => {
                        jenjangSelect.innerHTML = '<option value="">-- Pilih Jenjang --</option>';

                        if (data.jenjang && data.jenjang.length > 0) {
                            data.jenjang.forEach(jenjang => {
                                const option = document.createElement('option');
                                option.value = jenjang;
                                option.textContent = jenjang;
                                const biaya = data.biaya[jenjang]?.total || data.biaya[jenjang] || 0;
                                option.dataset.biaya = biaya;
                                jenjangSelect.appendChild(option);
                            });
                            jenjangSelect.disabled = false;
                        } else {
                            jenjangSelect.innerHTML = '<option value="">-- Tidak ada jenjang terdaftar --</option>';
                            jenjangSelect.disabled = true;
                        }
                    })
                    .catch(error => {
                        console.error('Error loading jenjang:', error);
                        jenjangSelect.innerHTML = '<option value="">-- Gagal memuat data --</option>';
                        jenjangSelect.disabled = true;
                    })
                    .finally(() => {
                        jenjangLoading.classList.add('hidden');
                    });
            }

            // Update preview biaya saat jenjang berubah
            function updateBiayaPreview() {
                const selectedOption = jenjangSelect.options[jenjangSelect.selectedIndex];
                if (selectedOption && selectedOption.value && selectedOption.dataset.biaya) {
                    const biaya = parseInt(selectedOption.dataset.biaya) || 0;
                    biayaPreview.textContent = 'Rp ' + biaya.toLocaleString('id-ID');
                } else {
                    biayaPreview.textContent = 'Rp 0';
                }
            }

            // Event listener untuk perubahan kampus
            kampusSelect.addEventListener('change', function() {
                loadJenjang(this.value);
            });

            // Event listener untuk perubahan jenjang
            jenjangSelect.addEventListener('change', updateBiayaPreview);

            // Jika sudah ada kampus yang dipilih (misal karena old value/error)
            if (kampusSelect.value) {
                loadJenjang(kampusSelect.value);
            }
        });
    </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 /home/edunesiaserver/public_html/K2/WEB_INTERNAL/SIMA/DEVELOPMENT/resources/views/prodi/create.blade.php ENDPATH**/ ?>