<?php $__env->startSection('title', 'Tracer Study'); ?>



<?php $__env->startSection('content'); ?>
<br><br>
<?php if (isset($component)) { $__componentOriginal5de6c61179b5c431782cc0aa46c5056175d068df = $component; } ?>
<?php $component = $__env->getContainer()->make(App\View\Components\HeaderSectionPage::class, ['title' => 'Tracer Study '.e($settings['nama kampus'] ?? 'Alumni Tracer Study').'','breadcrumbHome' => 'Home','breadcrumbCurrent' => 'Tracer Study']); ?>
<?php $component->withName('header-section-page'); ?>
<?php if ($component->shouldRender()): ?>
<?php $__env->startComponent($component->resolveView(), $component->data()); ?>
<?php $component->withAttributes([]); ?>
<?php echo $__env->renderComponent(); ?>
<?php endif; ?>
<?php if (isset($__componentOriginal5de6c61179b5c431782cc0aa46c5056175d068df)): ?>
<?php $component = $__componentOriginal5de6c61179b5c431782cc0aa46c5056175d068df; ?>
<?php unset($__componentOriginal5de6c61179b5c431782cc0aa46c5056175d068df); ?>
<?php endif; ?>

<div data-aos="fade-up" class="py-10 bg-gray-50 w-full">
    <div class="container mx-auto px-4 lg:px-20 max-w-screen-lg">
        <div class="bg-white shadow-md rounded-lg overflow-hidden">
            <div class="bg-primary p-6 text-center" style="color: #fff">
                <h2 class="text-2xl font-poppins font-semibold">Formulir Tracer Study</h2>
                <p class="text-sm mt-2 font-dmsans">Isi data Anda untuk membantu kami meningkatkan kualitas pendidikan</p>
            </div>
            
            <div class="p-8">
                <?php if(session('success')): ?>
                    <div class="p-4 bg-green-100 border-l-4 border-green-500 text-green-700 rounded-lg mb-6">
                        <p class="text-sm font-dmsans"><?php echo e(session('success')); ?></p>
                    </div>
                <?php endif; ?>
                
                <?php if($errors->any()): ?>
                    <div class="p-4 bg-red-100 border-l-4 border-red-500 text-red-700 rounded-lg mb-6">
                        <p class="text-sm font-dmsans font-medium"><strong>Terjadi Kesalahan!</strong></p>
                        <ul class="list-disc pl-6 text-sm font-dmsans">
                            <?php $__currentLoopData = $errors->all(); $__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; ?>
                
                <form method="POST" action="<?php echo e(route('tracer-study.store')); ?>" id="tracerForm" enctype="multipart/form-data">
                    <?php echo csrf_field(); ?>
                    
                    <!-- Data Pribadi -->
                    <h3 class="text-lg font-poppins font-semibold text-primary mb-4 border-b pb-2">Data Pribadi</h3>
                    
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Nama Lengkap</label>
                            <input type="text" name="nama" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" value="<?php echo e(old('nama')); ?>" required>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Jenis Kelamin</label>
                            <div class="flex gap-6 mt-2">
                                <label><input type="radio" name="jenis_kelamin" value="L" <?php echo e(old('jenis_kelamin') == 'L' ? 'checked' : ''); ?> required> Laki-laki</label>
                                <label><input type="radio" name="jenis_kelamin" value="P" <?php echo e(old('jenis_kelamin') == 'P' ? 'checked' : ''); ?> required> Perempuan</label>
                            </div>
                        </div>
                        <div class="md:col-span-2">
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Alamat Domisili</label>
                            <textarea name="alamat_domisili" rows="2" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" required><?php echo e(old('alamat_domisili')); ?></textarea>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Jurusan</label>
                            <select name="jurusan" id="jurusan" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" required>
                                <option value="">-- Pilih Jurusan --</option>
                                <?php $__currentLoopData = $biayas; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $kategori => $items): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <optgroup label="<?php echo e($kategori); ?>">
                                        <?php $__currentLoopData = $items; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $jurusan): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                            <option value="<?php echo e($jurusan->jurusan); ?>" <?php echo e(old('jurusan') == $jurusan->jurusan ? 'selected' : ''); ?>>
                                                <?php echo e($jurusan->jurusan); ?>

                                            </option>
                                        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                                    </optgroup>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </select>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Nomor HP/WA</label>
                            <input type="tel" name="no_hp" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" value="<?php echo e(old('no_hp')); ?>" required>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Email Pribadi</label>
                            <input type="email" name="email_pribadi" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" value="<?php echo e(old('email_pribadi')); ?>" required>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Tanggal Kelulusan</label>
                            <input type="date" name="tanggal_kelulusan" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" value="<?php echo e(old('tanggal_kelulusan')); ?>" required>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Memiliki Sertifikat Kompetensi?</label>
                            <select name="memiliki_sertifikat" id="memiliki_sertifikat" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" required>
                                <option value="">-- Pilih --</option>
                                <option value="Ya" <?php echo e(old('memiliki_sertifikat') == 'Ya' ? 'selected' : ''); ?>>Ya</option>
                                <option value="Tidak" <?php echo e(old('memiliki_sertifikat') == 'Tidak' ? 'selected' : ''); ?>>Tidak</option>
                            </select>
                        </div>
                    </div>
                    
                    <!-- Dynamic Fields untuk Sertifikat -->
                    <div id="sertifikat_fields" style="display: none;" class="mt-6">
                        <h3 class="text-md font-poppins font-semibold text-gray-700 mb-4">Data Sertifikat Kompetensi</h3>
                        <div id="sertifikat_container">
                            <div class="sertifikat_item border border-gray-200 rounded-lg p-4 mb-4">
                                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                                    <div>
                                        <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Nama Sertifikat</label>
                                        <input type="text" name="sertifikat_nama[]" class="sertifikat_nama mt-1 p-3 border border-gray-300 rounded-lg w-full" placeholder="Contoh: Sertifikat Kompetensi BNSP">
                                    </div>
                                    <div>
                                        <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">File Sertifikat (PDF/Image Max 2MB)</label>
                                        <input type="file" name="sertifikat_file[]" class="sertifikat_file mt-1 p-3 border border-gray-300 rounded-lg w-full" accept=".pdf,.jpg,.jpeg,.png">
                                    </div>
                                </div>
                            </div>
                        </div>
                        <button type="button" id="tambah_sertifikat" class="mt-2 bg-green-500 text-white px-4 py-2 rounded-lg hover:bg-green-600 transition">
                            + Tambah Sertifikat
                        </button>
                    </div>
                    
                    <!-- Data Pekerjaan -->
                    <h3 class="text-lg font-poppins font-semibold text-primary mb-4 mt-8 border-b pb-2">Data Pekerjaan</h3>
                    
                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Nama Instansi/Perusahaan</label>
                            <input type="text" name="nama_instansi" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" value="<?php echo e(old('nama_instansi')); ?>" required>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Mulai Bekerja (Tanggal)</label>
                            <input type="date" name="mulai_bekerja" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" value="<?php echo e(old('mulai_bekerja')); ?>" required>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Waktu Menunggu Mendapat Pekerjaan</label>
                            <input type="text" name="waktu_menunggu" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" placeholder="Contoh: 3 bulan" value="<?php echo e(old('waktu_menunggu')); ?>" required>
                        </div>
                        <div class="md:col-span-2">
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Alamat Perusahaan</label>
                            <textarea name="alamat_perusahaan" rows="2" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" required><?php echo e(old('alamat_perusahaan')); ?></textarea>
                        </div>
                    </div>
                    
                    <!-- Kesan dan Saran -->
                    <h3 class="text-lg font-poppins font-semibold text-primary mb-4 mt-8 border-b pb-2">Kesan, Saran & Sosial Media</h3>
                    
                    <div class="grid grid-cols-1 gap-6">
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Sosial Media (IG/TikTok/Facebook/LinkedIn)</label>
                            <input type="text" name="sosial_media" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" placeholder="Contoh: @username" value="<?php echo e(old('sosial_media')); ?>">
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Kesan Selama Kuliah</label>
                            <textarea name="kesan" rows="3" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" placeholder="Tuliskan kesan Anda selama kuliah di <?php echo e($settings['nama kampus'] ?? 'kampus kami'); ?>"><?php echo e(old('kesan')); ?></textarea>
                        </div>
                        <div>
                            <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Saran untuk Pengembangan Kampus</label>
                            <textarea name="saran" rows="3" class="mt-1 p-4 border border-gray-300 rounded-lg w-full" placeholder="Tuliskan saran Anda untuk kemajuan kampus"><?php echo e(old('saran')); ?></textarea>
                        </div>
                    </div>
                    
                    <div class="mt-8 text-center">
                        <button type="submit" style="color:#fff;" class="w-full md:w-1/2 bg-primary py-4 rounded-lg hover:bg-accent transition text-base font-semibold">
                            KIRIM TRACER STUDY
                        </button>
                    </div>
                </form>
            </div>
        </div>
    </div>
</div>
<?php $__env->stopSection(); ?>

<?php $__env->startPush('addon-script'); ?>
<script>
    document.addEventListener('DOMContentLoaded', function() {
        const memilikiSertifikat = document.getElementById('memiliki_sertifikat');
        const sertifikatFields = document.getElementById('sertifikat_fields');
        
        // Toggle Sertifikat Fields
        function toggleSertifikatFields() {
            if (memilikiSertifikat && memilikiSertifikat.value === 'Ya') {
                sertifikatFields.style.display = 'block';
                // Required untuk sertifikat pertama
                const firstNama = document.querySelector('.sertifikat_nama');
                const firstFile = document.querySelector('.sertifikat_file');
                if (firstNama) firstNama.setAttribute('required', 'required');
                if (firstFile) firstFile.setAttribute('required', 'required');
            } else {
                sertifikatFields.style.display = 'none';
                // Hapus required semua sertifikat
                document.querySelectorAll('.sertifikat_nama, .sertifikat_file').forEach(el => {
                    el.removeAttribute('required');
                });
            }
        }
        
        // Tambah Sertifikat
        const tambahSertifikat = document.getElementById('tambah_sertifikat');
        const sertifikatContainer = document.getElementById('sertifikat_container');
        
        function addSertifikatItem() {
            const newItem = document.createElement('div');
            newItem.className = 'sertifikat_item border border-gray-200 rounded-lg p-4 mb-4';
            newItem.innerHTML = `
                <div class="flex justify-end mb-2">
                    <button type="button" class="hapus_sertifikat bg-red-500 text-white px-3 py-1 rounded-lg hover:bg-red-600 transition text-sm">Hapus</button>
                </div>
                <div class="grid grid-cols-1 md:grid-cols-2 gap-4">
                    <div>
                        <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">Nama Sertifikat</label>
                        <input type="text" name="sertifikat_nama[]" class="sertifikat_nama mt-1 p-3 border border-gray-300 rounded-lg w-full" placeholder="Contoh: Sertifikat Kompetensi BNSP">
                    </div>
                    <div>
                        <label class="block text-sm font-medium text-gray-700 font-poppins mb-2">File Sertifikat (PDF/Image Max 2MB)</label>
                        <input type="file" name="sertifikat_file[]" class="sertifikat_file mt-1 p-3 border border-gray-300 rounded-lg w-full" accept=".pdf,.jpg,.jpeg,.png">
                    </div>
                </div>
            `;
            
            // Event hapus
            const hapusBtn = newItem.querySelector('.hapus_sertifikat');
            hapusBtn.addEventListener('click', function() {
                newItem.remove();
                updateRequiredAttributes();
            });
            
            sertifikatContainer.appendChild(newItem);
        }
        
        function updateRequiredAttributes() {
            const isYa = memilikiSertifikat && memilikiSertifikat.value === 'Ya';
            if (isYa) {
                const allNama = document.querySelectorAll('.sertifikat_nama');
                const allFile = document.querySelectorAll('.sertifikat_file');
                allNama.forEach(el => el.setAttribute('required', 'required'));
                allFile.forEach(el => el.setAttribute('required', 'required'));
            }
        }
        
        if (tambahSertifikat) {
            tambahSertifikat.addEventListener('click', addSertifikatItem);
        }
        
        // Event listeners
        if (memilikiSertifikat) {
            memilikiSertifikat.addEventListener('change', toggleSertifikatFields);
            toggleSertifikatFields();
        }
        
        // Update required saat ada perubahan di sertifikat fields
        const observer = new MutationObserver(function() {
            updateRequiredAttributes();
        });
        
        if (sertifikatContainer) {
            observer.observe(sertifikatContainer, { childList: true, subtree: true });
        }
    });
</script>
<?php $__env->stopPush(); ?>
<?php echo $__env->make('Frontend.Layouts.app2', \Illuminate\Support\Arr::except(get_defined_vars(), ['__data', '__path']))->render(); ?><?php /**PATH /home/edunesiaserver/public_html/K2/WEB_KAMPUS/WEB_TEMPLATE/Biru-Kuning/resources/views/Frontend/tracer-study.blade.php ENDPATH**/ ?>