<!-- Modal Edit Penilaian Ekstrakulikuler -->
<div class="modal fade" id="editNilaiModal" tabindex="-1" aria-hidden="true">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header" style="background-color:#f3e6ff;color:#3b0b6f;">
                <h5 class="modal-title">Edit Penilaian Ekstrakulikuler</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
            </div>
            <form id="formEditNilai" action="#" method="POST">
                <?php echo csrf_field(); ?>
                <?php echo method_field('PUT'); ?>
                <input type="hidden" name="id" value="">
                <div class="modal-body">
                    <?php
                        $kelasList = \App\Models\Kelas::orderBy('nama')->get();
                        $pesertaList = class_exists(\App\Models\DidikPokok::class) ? \App\Models\DidikPokok::orderBy('nama')->get() : collect();
                        // order ekstrakulikuler by kategori then name
                        $ekstraList = collect();
                        if (class_exists(\App\Models\Ekstrakulikuler::class)) {
                            try {
                                $ekstraList = \App\Models\Ekstrakulikuler::orderByRaw("CASE WHEN kategori='wajib 1' THEN 1 WHEN kategori='wajib 2' THEN 2 WHEN kategori='wajib 3' THEN 3 ELSE 4 END")->orderBy('nama')->get();
                            } catch (\Throwable $e) {
                                $ekstraList = \App\Models\Ekstrakulikuler::orderBy('nama')->get();
                            }
                        }
                    ?>
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Kelas</label>
                            <select name="kelas_id" class="form-select">
                                <option value="">-- Pilih Kelas --</option>
                                <?php $__currentLoopData = $kelasList; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $k): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($k->id); ?>"><?php echo e($k->nama ?? $k->nama_kelas ?? $k->nama); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Peserta Didik</label>
                            <select name="peserta_didik_id" class="form-select">
                                <option value="">-- Pilih Peserta --</option>
                                <?php $__currentLoopData = $pesertaList; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $p): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($p->id); ?>"><?php echo e($p->nama); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Ekstrakulikuler</label>
                            <select name="ekstrakulikuler_id" class="form-select">
                                <option value="">-- Pilih Ekstrakulikuler --</option>
                                <?php $__currentLoopData = $ekstraList; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $e): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                    <option value="<?php echo e($e->id); ?>" data-keterangan="<?php echo e($e->keterangan); ?>" data-kategori="<?php echo e($e->kategori); ?>"><?php echo e($e->nama); ?></option>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label">Nilai</label>
                            <div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="nilai" id="editNilaiA" value="A">
                                    <label class="form-check-label" for="editNilaiA">A</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="nilai" id="editNilaiB" value="B">
                                    <label class="form-check-label" for="editNilaiB">B</label>
                                </div>
                                <div class="form-check form-check-inline">
                                    <input class="form-check-input" type="radio" name="nilai" id="editNilaiC" value="C">
                                    <label class="form-check-label" for="editNilaiC">C</label>
                                </div>
                            </div>
                            <div class="small text-muted">A = Mahir, B = Cakap, C = Berkembang</div>
                        </div>
                        <div class="col-12 mb-3">
                            <label class="form-label">Deskripsi Ekstrakulikuler</label>
                            <textarea name="deskripsi" class="form-control" rows="3"></textarea>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                    <button class="btn btn-success">Simpan</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
    (function(){
        function getSelectedEkstraInfo(container){
            const select = container.querySelector('select[name="ekstrakulikuler_id"]');
            if (!select) return {name: null, keterangan: null};
            const opt = select.options[select.selectedIndex];
            return {
                name: opt ? (opt.textContent || opt.innerText || null) : null,
                keterangan: opt ? (opt.dataset.keterangan || null) : null
            };
        }

        function updateDeskripsi(container){
            const teksEl = container.querySelector('textarea[name="deskripsi"]');
            if (!teksEl) return;
            const nilai = (container.querySelector('input[name="nilai"]:checked') || {}).value || null;
            const ekstra = getSelectedEkstraInfo(container);

            let base = ekstra.keterangan || ekstra.name || '';
            base = base ? (base + '\n') : '';

            if (!nilai){
                // leave existing content if any
                return;
            }

            let adjective = '';
            if (nilai === 'A') adjective = 'Mahir';
            else if (nilai === 'B') adjective = 'Cakap';
            else if (nilai === 'C') adjective = 'Berkembang';

            // Put the adjective before the existing description/keterangan
            let template = adjective;
            if (base) {
                template = adjective ? (adjective + ' ' + base) : base;
            }

            // always update deskripsi when nilai or ekstrakulikuler changes
            teksEl.value = template;
            teksEl.dataset._autoSet = '1';
        }

        function initModalListeners(){
            const modal = document.getElementById('editNilaiModal');
            if (!modal) return;
            if (modal._ekstraListenersAttached) return;
            modal._ekstraListenersAttached = true;

            const select = modal.querySelector('select[name="ekstrakulikuler_id"]');
            const radios = modal.querySelectorAll('input[name="nilai"]');

            if (select){
                select.addEventListener('change', function(){ updateDeskripsi(modal); });
            }
            radios.forEach(r => r.addEventListener('change', function(){ updateDeskripsi(modal); }));

            // update when modal is shown
            try {
                modal.addEventListener('shown.bs.modal', function(){ updateDeskripsi(modal); });
            } catch (err) {
                // ignore
            }
        }

        if (document.readyState === 'loading') {
            document.addEventListener('DOMContentLoaded', initModalListeners);
        } else {
            initModalListeners();
        }
    })();
</script>
<?php /**PATH C:\App\laravel\laravel\resources\views/admin/penilaian/ekstrakulikuler/edit.blade.php ENDPATH**/ ?>