<?php $__env->startSection('content'); ?>

<style>
    /* STYLE UNTUK MEMPERCANTIK TAMPILAN DARK/LIGHT */
    [data-theme="dark"] .modal-content,
    [data-theme="dark"] .card {
        background-color: var(--bg-card);
        border: 1px solid var(--border-color);
        color: var(--text-main);
    }
    [data-theme="dark"] .form-control,
    [data-theme="dark"] .form-select {
        background-color: var(--hover-bg);
        border-color: var(--border-color);
        color: var(--text-main);
    }
    [data-theme="dark"] .text-muted { color: #cbd5e1 !important; }
    [data-theme="dark"] h2, [data-theme="dark"] h5, [data-theme="dark"] label { color: #f1f5f9; }
    [data-theme="dark"] .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
    
    /* Agar Textarea lebih rapat secara visual */
    textarea.form-control {
        line-height: 1.3;
    }

    /* --- Styling Accordion & Dark Mode Support --- */
    .accordion-asesmen .accordion-item {
        border: 1px solid var(--border-color, #dee2e6);
        border-radius: 8px !important;
        margin-bottom: 15px;
        box-shadow: 0 2px 4px rgba(0,0,0,0.02);
        overflow: hidden;
        background-color: transparent;
    }
    .accordion-asesmen .accordion-button {
        font-size: 1.05rem;
        padding: 1rem 1.25rem;
    }
    .accordion-asesmen .accordion-button:not(.collapsed) {
        background-color: #f8f9fa;
        color: #0d6efd;
        box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);
    }
    .accordion-asesmen .accordion-body {
        background-color: #f8f9fa; /* Latar belakang abu-abu terang agar kartu lebih menonjol */
        padding: 1.5rem;
    }
    
    /* Dark Mode Accordion */
    [data-theme="dark"] .accordion-asesmen .accordion-item { background-color: var(--bg-card); border-color: var(--border-color); }
    [data-theme="dark"] .accordion-asesmen .accordion-button { background-color: var(--bg-card); color: var(--text-main); }
    [data-theme="dark"] .accordion-asesmen .accordion-button:not(.collapsed) { background-color: var(--hover-bg); color: #6ea8fe; border-bottom: 1px solid var(--border-color); }
    [data-theme="dark"] .accordion-asesmen .accordion-button::after { filter: invert(1); }
    [data-theme="dark"] .accordion-asesmen .accordion-body { background-color: #1e293b; } /* Latar gelap untuk isi accordion */
</style>

<div class="container py-4">
    
    <div class="d-flex justify-content-between align-items-center mb-4">
        <div>
            <h2 class="fw-bold">Asesmen & Evaluasi</h2>
            <p class="text-muted mb-0">Bank Soal, Rubrik Penilaian, dan Program Remedial</p>
        </div>
        <div>
            <button class="btn btn-secondary me-2 shadow-sm" data-bs-toggle="modal" data-bs-target="#modalCetak">
                <i class="bi bi-printer"></i> Cetak Asesmen
            </button>
            <button class="btn btn-primary shadow-sm" data-bs-toggle="modal" data-bs-target="#modalAsesmen">
                <i class="bi bi-plus-circle"></i> Buat Asesmen
            </button>
        </div>
    </div>

    <?php if(session('success')): ?>
    <div class="alert alert-success alert-dismissible fade show">
        <?php echo e(session('success')); ?>

        <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
    </div>
    <?php endif; ?>

    
    <?php
        $groupedAssessments = $assessments->groupBy(function($item) {
            return $item->subject->name ?? 'Tanpa Mata Pelajaran';
        })->map(function($group) {
            // Mengurutkan asesmen terbaru di atas
            return $group->sortByDesc('created_at')->values();
        });
    ?>

    <div class="accordion accordion-asesmen" id="accordionAsesmenMapel">
        <?php $__empty_1 = true; $__currentLoopData = $groupedAssessments; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $subjectName => $subjectAssessments): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); $__empty_1 = false; ?>
            <div class="accordion-item border-0 shadow-sm">
                <h2 class="accordion-header" id="heading-<?php echo e($loop->index); ?>">
                    
                    <button class="accordion-button fw-bold collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse-<?php echo e($loop->index); ?>" aria-expanded="false" aria-controls="collapse-<?php echo e($loop->index); ?>">
                        <i class="bi bi-journal-check me-2 text-primary"></i> 
                        <?php echo e($subjectName); ?>

                        <span class="badge bg-primary ms-3 rounded-pill"><?php echo e($subjectAssessments->count()); ?> Asesmen</span>
                    </button>
                </h2>
                
                <div id="collapse-<?php echo e($loop->index); ?>" class="accordion-collapse collapse" aria-labelledby="heading-<?php echo e($loop->index); ?>">
                    <div class="accordion-body">
                        
                        <div class="row">
                            <?php $__currentLoopData = $subjectAssessments; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                            <div class="col-md-6 mb-4">
                                <div class="card h-100 shadow-sm border-0">
                                    <div class="card-header d-flex justify-content-between align-items-center bg-transparent border-bottom-0 pt-3 pb-0">
                                        <span class="badge bg-primary"><?php echo e($item->subject->name); ?></span>
                                        <small class="text-muted"><i class="bi bi-calendar3"></i> <?php echo e($item->created_at->format('d M Y')); ?></small>
                                    </div>
                                    <div class="card-body">
                                        <h5 class="card-title fw-bold mb-3"><?php echo e($item->title); ?></h5>
                                        <div class="mb-3">
                                            <span class="badge bg-info text-dark me-1"><i class="bi bi-tag"></i> <?php echo e(ucfirst($item->type)); ?></span>
                                            <span class="badge bg-secondary"><i class="bi bi-pen"></i> <?php echo e(ucfirst($item->technique)); ?></span>
                                        </div>
                                        
                                        <p class="card-text text-muted small p-3 bg-light rounded" style="border-left: 3px solid #0dcaf0;">
                                            <strong>Preview Soal:</strong><br>
                                            <?php echo e(Str::limit($item->questions, 120)); ?>

                                        </p>
                                    </div>
                                    <div class="card-footer bg-transparent border-top-0 pb-3 pt-0">
                                        <div class="d-flex justify-content-end gap-2">
                                            <button class="btn btn-sm btn-outline-info" data-bs-toggle="modal" data-bs-target="#detailModal<?php echo e($item->id); ?>" title="Lihat Detail">
                                                <i class="bi bi-eye"></i> Detail
                                            </button>
                                            <button class="btn btn-sm btn-warning text-white" data-bs-toggle="modal" data-bs-target="#editModal<?php echo e($item->id); ?>" title="Edit">
                                                <i class="bi bi-pencil"></i> Edit
                                            </button>
                                            <form action="<?php echo e(route('asesmen.destroy', $item->id)); ?>" method="POST" onsubmit="return confirm('Hapus asesmen ini?')">
                                                <?php echo csrf_field(); ?> <?php echo method_field('DELETE'); ?>
                                                <button class="btn btn-sm btn-outline-danger" title="Hapus"><i class="bi bi-trash"></i> Hapus</button>
                                            </form>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                        </div>
                    </div>
                </div>
            </div>
        <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); if ($__empty_1): ?>
            <div class="card shadow-sm border-0">
                <div class="card-body text-center py-5">
                    <div class="text-muted opacity-50 mb-3">
                        <i class="bi bi-clipboard-x" style="font-size: 4rem;"></i>
                    </div>
                    <h5 class="text-muted fw-bold">Belum Ada Asesmen</h5>
                    <p class="text-muted">Mulai buat bank soal asesmen dan evaluasi Anda sekarang.</p>
                </div>
            </div>
        <?php endif; ?>
    </div>
</div>


<div class="modal fade" id="modalCetak" tabindex="-1">
    <div class="modal-dialog modal-lg">
        <div class="modal-content">
            <div class="modal-header bg-secondary text-white">
                <h5 class="modal-title"><i class="bi bi-printer"></i> Pilih Asesmen untuk Dicetak</h5>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
            </div>
            <form action="<?php echo e(route('asesmen.print_bulk')); ?>" method="POST" target="_blank">
                <?php echo csrf_field(); ?>
                <div class="modal-body">
                    <div class="table-responsive" style="max-height: 400px; overflow-y: auto;">
                        <table class="table table-sm table-bordered table-hover mb-0">
                            <thead class="table-light sticky-top">
                                <tr>
                                    <th width="40" class="text-center"><input type="checkbox" id="checkAll"></th>
                                    <th>Judul Asesmen</th>
                                    <th>Mapel</th>
                                    <th>Jenis</th>
                                </tr>
                            </thead>
                            <tbody>
                                <?php $__currentLoopData = $assessments; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $m): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
                                <tr>
                                    <td class="text-center"><input type="checkbox" name="assessment_ids[]" value="<?php echo e($m->id); ?>" class="check-item"></td>
                                    <td><?php echo e($m->title); ?></td>
                                    <td><?php echo e($m->subject->name); ?></td>
                                    <td><?php echo e(ucfirst($m->type)); ?></td>
                                </tr>
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </tbody>
                        </table>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-light" data-bs-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-dark">Cetak Terpilih</button>
                </div>
            </form>
        </div>
    </div>
</div>


<?php $__currentLoopData = $assessments; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $item): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?>
    <div class="modal fade" id="detailModal<?php echo e($item->id); ?>" tabindex="-1">
        <div class="modal-dialog modal-lg">
            <div class="modal-content">
                <div class="modal-header bg-info text-white">
                    <h5 class="modal-title"><i class="bi bi-file-text"></i> <?php echo e($item->title); ?></h5>
                    <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
                </div>
                <div class="modal-body">
                    <div class="bg-light p-3 rounded mb-3 border">
                        <h6 class="fw-bold text-primary border-bottom pb-2"><i class="bi bi-question-circle"></i> Soal / Instrumen:</h6>
                        <p class="text-dark mt-2 mb-0" style="white-space: pre-line;"><?php echo e($item->questions); ?></p>
                    </div>
                    <div class="bg-light p-3 rounded mb-3 border">
                        <h6 class="fw-bold text-success border-bottom pb-2"><i class="bi bi-check2-square"></i> Rubrik Penilaian / Kunci:</h6>
                        <p class="text-dark mt-2 mb-0" style="white-space: pre-line;"><?php echo e($item->rubric ?? '-'); ?></p>
                    </div>
                    <div class="row">
                        <div class="col-md-6">
                            <div class="bg-light p-3 rounded h-100 border">
                                <h6 class="fw-bold text-warning border-bottom pb-2"><i class="bi bi-arrow-repeat"></i> Rencana Remedial:</h6>
                                <p class="text-dark mt-2 mb-0" style="white-space: pre-line;"><?php echo e($item->remedial_plan ?? '-'); ?></p>
                            </div>
                        </div>
                        <div class="col-md-6">
                            <div class="bg-light p-3 rounded h-100 border">
                                <h6 class="fw-bold text-info border-bottom pb-2"><i class="bi bi-stars"></i> Rencana Pengayaan:</h6>
                                <p class="text-dark mt-2 mb-0" style="white-space: pre-line;"><?php echo e($item->enrichment ?? '-'); ?></p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <div class="modal fade" id="editModal<?php echo e($item->id); ?>" tabindex="-1">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header bg-warning text-dark">
                <h5 class="modal-title"><i class="bi bi-pencil-square"></i> Edit Asesmen</h5>
                <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
            </div>
            <form action="<?php echo e(route('asesmen.update', $item->id)); ?>" method="POST">
                <?php echo csrf_field(); ?> <?php echo method_field('PUT'); ?>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Mata Pelajaran</label>
                            <select name="subject_id" class="form-select" required>
                                <?php $__currentLoopData = $subjects; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $s): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?> 
                                    <option value="<?php echo e($s->id); ?>" <?php echo e($item->subject_id == $s->id ? 'selected' : ''); ?>><?php echo e($s->name); ?></option> 
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Judul Asesmen</label>
                            <input type="text" name="title" class="form-control" value="<?php echo e($item->title); ?>" required>
                        </div>
                    </div>

                    <div class="row bg-light p-3 rounded border mx-1 mb-3">
                        <div class="col-md-4 mb-2">
                            <label class="form-label fw-bold">Jenis Asesmen</label>
                            <select name="type" class="form-select" required>
                                <option value="formatif" <?php echo e($item->type == 'formatif' ? 'selected' : ''); ?>>Formatif</option>
                                <option value="sumatif" <?php echo e($item->type == 'sumatif' ? 'selected' : ''); ?>>Sumatif</option>
                                <option value="diagnostik" <?php echo e($item->type == 'diagnostik' ? 'selected' : ''); ?>>Diagnostik</option>
                            </select>
                        </div>
                        <div class="col-md-4 mb-2">
                            <label class="form-label fw-bold">Teknik Penilaian</label>
                            <select name="technique" class="form-select" required>
                                <option value="tulis" <?php echo e($item->technique == 'tulis' ? 'selected' : ''); ?>>Tes Tulis</option>
                                <option value="lisan" <?php echo e($item->technique == 'lisan' ? 'selected' : ''); ?>>Tes Lisan</option>
                                <option value="proyek" <?php echo e($item->technique == 'proyek' ? 'selected' : ''); ?>>Proyek</option>
                                <option value="portofolio" <?php echo e($item->technique == 'portofolio' ? 'selected' : ''); ?>>Portofolio</option>
                            </select>
                        </div>
                        <div class="col-md-4 mb-2">
                            <label class="form-label fw-bold">Skor Total</label>
                            <input type="number" name="total_score" class="form-control" value="<?php echo e($item->total_score); ?>">
                        </div>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold">Butir Soal</label>
                        <textarea name="questions" class="form-control" rows="6" required><?php echo e($item->questions); ?></textarea>
                    </div>

                    <div class="mb-3">
                        <label class="form-label fw-bold">Rubrik / Kunci Jawaban</label>
                        <textarea name="rubric" class="form-control" rows="5"><?php echo e($item->rubric); ?></textarea>
                    </div>
                                                    
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Soal Remedial</label>
                            <textarea name="remedial_plan" class="form-control" rows="5"><?php echo e($item->remedial_plan); ?></textarea>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Soal Pengayaan</label>
                            <textarea name="enrichment" class="form-control" rows="5"><?php echo e($item->enrichment); ?></textarea>
                        </div>
                    </div>
                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-warning px-4 fw-bold">Simpan Perubahan</button>
                </div>
            </form>
        </div>
    </div>
</div>
<?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>


<div class="modal fade" id="modalAsesmen" tabindex="-1">
    <div class="modal-dialog modal-xl">
        <div class="modal-content">
            <div class="modal-header bg-primary text-white">
                <h5 class="modal-title"><i class="bi bi-robot"></i> Buat Asesmen Baru</h5>
                <button type="button" class="btn-close btn-close-white" data-bs-dismiss="modal"></button>
            </div>
            
            <form action="<?php echo e(route('asesmen.store')); ?>" method="POST" id="formCreateAsesmen">
                <?php echo csrf_field(); ?>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Mata Pelajaran <span class="text-danger">*</span></label>
                            <select name="subject_id" id="ai_subject" class="form-select" required>
                                <option value="" selected disabled>-- Pilih Mapel --</option>
                                <?php $__currentLoopData = $subjects; $__env->addLoop($__currentLoopData); foreach($__currentLoopData as $s): $__env->incrementLoopIndices(); $loop = $__env->getLastLoop(); ?> 
                                    <option value="<?php echo e($s->id); ?>" data-name="<?php echo e($s->name); ?>"><?php echo e($s->name); ?></option> 
                                <?php endforeach; $__env->popLoop(); $loop = $__env->getLastLoop(); ?>
                            </select>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Judul Asesmen <span class="text-danger">*</span></label>
                            <input type="text" name="title" id="ai_title" class="form-control" placeholder="Cth: Ulangan Harian Bab 1" required>
                        </div>
                    </div>

                    <div class="row bg-light p-3 rounded border mx-1 mb-4">
                        <div class="col-md-3 mb-2">
                            <label class="form-label fw-bold">Jenis <span class="text-danger">*</span></label>
                            <select name="type" id="ai_type" class="form-select" required>
                                <option value="" selected disabled>-- Pilih Jenis --</option>
                                <option value="formatif">Formatif</option>
                                <option value="sumatif">Sumatif</option>
                                <option value="diagnostik">Diagnostik</option>
                            </select>
                        </div>
                        <div class="col-md-3 mb-2">
                            <label class="form-label fw-bold">Teknik <span class="text-danger">*</span></label>
                            <select name="technique" id="ai_technique" class="form-select" required>
                                <option value="" selected disabled>-- Pilih Teknik --</option>
                                <option value="tulis">Tes Tulis</option>
                                <option value="lisan">Tes Lisan</option>
                                <option value="proyek">Proyek</option>
                            </select>
                        </div>
                        <div class="col-md-3 mb-2">
                            <label class="form-label fw-bold">Bentuk Soal (AI) <span class="text-danger">*</span></label>
                            <select id="ai_form_type" class="form-select" required>
                                <option value="" selected disabled>-- Pilih Bentuk --</option>
                                <option value="Pilihan Ganda">Pilihan Ganda</option>
                                <option value="Uraian / Essay">Uraian / Essay</option>
                                <option value="Isian Singkat">Isian Singkat</option>
                            </select>
                        </div>
                        <div class="col-md-3 mb-2">
                            <label class="form-label fw-bold">Skor Total</label>
                            <input type="number" name="total_score" id="ai_score" class="form-control" placeholder="100" value="100" required>
                        </div>
                    </div>

                    
                    <div class="card bg-white border-primary mb-4 shadow-sm">
                        <div class="card-body py-3">
                            <h6 class="text-primary fw-bold border-bottom pb-2 mb-3"><i class="bi bi-cpu"></i> Generator AI</h6>
                            <div class="row">
                                <div class="col-md-6 mb-2">
                                    <input type="text" id="ai_topic" class="form-control form-control-sm" placeholder="Topik Utama (Wajib Diisi)">
                                </div>
                                <div class="col-md-3 mb-2">
                                    <input type="number" id="ai_duration" class="form-control form-control-sm" placeholder="Durasi (mnt)">
                                </div>
                                <div class="col-md-3 mb-2">
                                    <input type="number" id="ai_count" class="form-control form-control-sm" placeholder="Jml Soal" >
                                </div>

                                <div class="col-12 mb-2">
                                    <textarea id="ai_material" class="form-control form-control-sm" rows="3" placeholder="Detail Materi (Opsional) - Contoh: Fokuskan pada fungsi komponen utama dan cara kerjanya..."></textarea>
                                </div>

                                <div class="col-12 mt-2">
                                    <button type="button" id="btnGenerateAI" class="btn btn-primary w-100 fw-bold">
                                        <i class="bi bi-magic"></i> Generate Konten dengan AI
                                    </button>
                                </div>
                            </div>
                            <div id="loadingIndicator" class="text-center mt-3" style="display:none;">
                                <div class="spinner-border text-primary" role="status"></div>
                                <div class="text-muted mt-2 fw-bold">AI sedang menyusun soal. Harap tunggu...</div>
                            </div>
                        </div>
                    </div>
                    
                    
                    <div class="mb-3">
                        <label class="form-label fw-bold">Butir Soal</label>
                        <textarea name="questions" id="q_soal" class="form-control" rows="8" placeholder="Hasil generate soal akan muncul di sini..." required></textarea>
                    </div>                  
                    <div class="mb-3">
                        <label class="form-label fw-bold">Rubrik / Kunci Jawaban</label>
                        <textarea name="rubric" id="q_rubrik" class="form-control" rows="5"></textarea>
                    </div>

                    <div class="row">
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Soal Pengayaan</label>
                            <textarea name="enrichment" id="q_pengayaan" class="form-control" rows="5"></textarea>
                        </div>
                        <div class="col-md-6 mb-3">
                            <label class="form-label fw-bold">Soal Remedial</label>
                            <textarea name="remedial_plan" id="q_remedial" class="form-control" rows="5"></textarea>
                        </div>
                    </div>

                </div>
                <div class="modal-footer">
                    <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Batal</button>
                    <button type="submit" class="btn btn-success px-4 fw-bold">Simpan Asesmen</button>
                </div>
            </form>
        </div>
    </div>
</div>

<script>
document.addEventListener('DOMContentLoaded', function() {
    
    // --- 1. RESET FORM ---
    const modalAsesmen = document.getElementById('modalAsesmen');
    if (modalAsesmen) {
        modalAsesmen.addEventListener('show.bs.modal', function () {
            document.getElementById('formCreateAsesmen').reset();
            ['q_soal', 'q_rubrik', 'q_remedial', 'q_pengayaan'].forEach(id => {
                const el = document.getElementById(id);
                if(el) el.value = '';
            });
            const btnAI = document.getElementById('btnGenerateAI');
            if(btnAI) {
                btnAI.disabled = false;
                btnAI.innerHTML = '<i class="bi bi-magic"></i> Generate Konten dengan AI';
            }
            document.getElementById('loadingIndicator').style.display = 'none';
        });
    }

    // --- 2. SELECT ALL CETAK ---
    let checkAllBtn = document.getElementById('checkAll');
    if(checkAllBtn){
        checkAllBtn.addEventListener('click', function() {
            let checkboxes = document.querySelectorAll('.check-item');
            checkboxes.forEach((checkbox) => { checkbox.checked = this.checked; });
        });
    }

    // --- 3. FORMATTER OUTPUT AI ---
    function formatAIOutput(data) {
        if (!data) return "";
        let content = "";
        if (Array.isArray(data)) {
            content = data.map(item => item.trim()).join('\n');
        } else {
            content = data;
        }
        return content.replace(/\n\s*\n/g, '\n').trim();
    }

    // --- 4. LOGIC GENERATE AI ---
    const btnAI = document.getElementById('btnGenerateAI');
    if(btnAI) {
        btnAI.addEventListener('click', async function() {
            // A. Ambil Data
            const subjectSelect = document.getElementById('ai_subject');
            if(subjectSelect.selectedIndex === 0 || !subjectSelect.value) { 
                alert("Pilih Mata Pelajaran terlebih dahulu."); 
                return; 
            }
            
            const mapelName = subjectSelect.options[subjectSelect.selectedIndex].getAttribute('data-name');
            const topik = document.getElementById('ai_topic').value;
            const materi = document.getElementById('ai_material').value;
            const bentuk = document.getElementById('ai_form_type').value;
            const jenis = document.getElementById('ai_type').value;
            const teknik = document.getElementById('ai_technique').value;
            const jumlah = document.getElementById('ai_count').value || '5';
            
            // B. VALIDASI WAJIB 
            if(!jenis) { alert("Pilih Jenis Asesmen terlebih dahulu."); return; }
            if(!teknik) { alert("Pilih Teknik Penilaian terlebih dahulu."); return; }
            if(!bentuk) { alert("Pilih Bentuk Soal terlebih dahulu."); return; }
            if(!topik) { alert("Mohon isi Topik asesmen terlebih dahulu."); return; }

            // C. UI Loading
            document.getElementById('loadingIndicator').style.display = 'block';
            btnAI.disabled = true;
            btnAI.innerHTML = '<i class="spinner-border spinner-border-sm"></i> Menghubungi AI...';

            // D. Hitung
            const jumlahTambahan = Math.ceil(parseInt(jumlah) / 2);

            // E. Prompt
            let instruksiBentuk = `Bentuk soal adalah ${bentuk}.`;
            if (bentuk.toLowerCase().includes('pilihan ganda')) {
                instruksiBentuk = `PENTING: Karena 'Pilihan Ganda', WAJIB sertakan opsi A-E di bawah pertanyaan.\nFormat:\n1. Pertanyaan..\n   A. Opsi\n   B. Opsi\n   ...`;
            }

            const apiKey = "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"; 
            
            const messages = [
                {
                    role: "system",
                    content: "Anda adalah Guru SMK. Buat JSON Asesmen."
                },
                {
                    role: "user",
                    content: `Buatkan soal ujian.
                    - Mapel: ${mapelName}
                    - Topik: ${topik} (${materi})
                    - Bentuk: ${bentuk}
                    - Jml: ${jumlah}
                    
                    ${instruksiBentuk}
                    
                    OUTPUT JSON (RFC8259) ONLY:
                    {
                        "soal": "(Gabungan ${jumlah} soal utama)",
                        "rubrik": "(Kunci Jawaban)",
                        "remedial": "(${jumlahTambahan} soal remedial)",
                        "pengayaan": "(${jumlahTambahan} soal pengayaan)"
                    }
                    Gunakan '\\n' untuk baris baru.`
                }
            ];

            try {
                const response = await fetch("https://api.groq.com/openai/v1/chat/completions", {
                    method: "POST",
                    headers: {
                        "Content-Type": "application/json",
                        "Authorization": `Bearer ${apiKey}`
                    },
                    body: JSON.stringify({
                        model: "llama-3.3-70b-versatile",
                        messages: messages,
                        temperature: 0.7,
                        response_format: { type: "json_object" }
                    })
                });

                if (!response.ok) throw new Error(`API Error: ${response.status}`);
                const data = await response.json();
                const result = JSON.parse(data.choices[0].message.content);

                // F. Format & Masukkan ke Input
                if(result.soal) {
                    document.getElementById('q_soal').value = formatAIOutput(result.soal);
                    document.getElementById('q_rubrik').value = formatAIOutput(result.rubrik);
                    document.getElementById('q_remedial').value = formatAIOutput(result.remedial);
                    document.getElementById('q_pengayaan').value = formatAIOutput(result.pengayaan);
                } else {
                    alert("Gagal parsing JSON dari AI.");
                }

            } catch (error) {
                console.error(error);
                alert("Gagal: " + error.message);
            } finally {
                document.getElementById('loadingIndicator').style.display = 'none';
                btnAI.disabled = false;
                btnAI.innerHTML = '<i class="bi bi-magic"></i> Generate Konten dengan AI';
            }
        });
    }
});
</script>
<?php $__env->stopSection(); ?>
<?php echo $__env->make('layouts.app', array_diff_key(get_defined_vars(), ['__data' => 1, '__path' => 1]))->render(); ?><?php /**PATH /home/vol15_7/infinityfree.com/if0_40829333/htdocs/resources/views/pages/perangkat/asesmen/index.blade.php ENDPATH**/ ?>