<?xml version="1.0" encoding="UTF-8"?>
<WebElementEntity>
   <description></description>
   <name>main_10 April 2026</name>
   <tag></tag>
   <elementGuidId>aeaaac78-126a-40b8-b4f7-245886fdbbe3</elementGuidId>
   <selectorCollection>
      <entry>
         <key>XPATH</key>
         <value>//main</value>
      </entry>
      <entry>
         <key>CSS</key>
         <value>main</value>
      </entry>
   </selectorCollection>
   <selectorMethod>XPATH</selectorMethod>
   <smartLocatorEnabled>false</smartLocatorEnabled>
   <useRalativeImagePath>true</useRalativeImagePath>
   <webElementProperties>
      <isSelected>false</isSelected>
      <matchCondition>equals</matchCondition>
      <name>tag</name>
      <type>Main</type>
      <value>main</value>
      <webElementGuid>bf1fee23-26ab-4ede-b853-1bb836b1ad6e</webElementGuid>
   </webElementProperties>
   <webElementProperties>
      <isSelected>false</isSelected>
      <matchCondition>equals</matchCondition>
      <name>class</name>
      <type>Main</type>
      <value>flex-grow overflow-y-auto</value>
      <webElementGuid>2bc14c0f-4c46-40e6-b4a8-f22f2268f8bf</webElementGuid>
   </webElementProperties>
   <webElementProperties>
      <isSelected>true</isSelected>
      <matchCondition>equals</matchCondition>
      <name>text</name>
      <type>Main</type>
      <value>
            
                
                
                    
                         10 April 2026
                    
                
            

            
                
    
    
    
    
        
        
            
        
        
            
                Pelanggaran 9A
            
            
                
                
                Monitoring Kedisiplinan
            
        
    

    
        
        
            
                
                Siswa Tercatat
                
                
                    09
                    Siswa
                
            
            
            
        

        
        
             
            Input Data
        
    

    
    
    
        
        
        
            
            
                                    
                        KELAS 7A
                    
                                    
                        KELAS 9A
                    
                            
            
        

        
        
            
            
            
                CARI
            
        
    

    

    
    
    
        
            
                
                    No
                    Nama Peserta Didik
                    Jumlah Kasus
                    Total Poin
                    Aksi
                
            
            
                                
                    
                        1
                    
                    
                        
                            test dua
                            ID: DwQPUt7Lb7al0Of1t5BXL0Yc6Up1
                        
                    
                    
                        
                            4 Kasus
                        
                    
                    
                                                
                            60 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        2
                    
                    
                        
                            Arjuna Pradipta
                            ID: h5M91XVZIKQqRtk6aevRApagyos1
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            50 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        3
                    
                    
                        
                            test tiga
                            ID: 5phVZQXKn6VFLXrP3YgZQd70uvB3
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            30 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        4
                    
                    
                        
                            test satu
                            ID: U7AdAaRYDNYFhcGkXwb7U1ac4au2
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            30 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        5
                    
                    
                        
                            test  keempat
                            ID: yGv1dkK8PbM1SiP0CWQPHm1831K2
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        6
                    
                    
                        
                            michael septa  wahyu angraini
                            ID: 6MxTl0E3WsM4miTa5i1ISwUmp0t1
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        7
                    
                    
                        
                            Ranaima Andara
                            ID: 8NFCQIX9B1hxoF0yaFfzAwjKe8J2
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        8
                    
                    
                        
                            tomi tomblok
                            ID: Ev5bOlIsRbOiL3JDiktt2B3App13
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        9
                    
                    
                        
                            renaldi
                            ID: gH0qvdmgv6dTaPgvskV7sYdlZux1
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                            
        
    





    
        
            
                Riwayat Pelanggaran
                
            
            
                
            
        
        
            
        
        
            Tutup Laporan
        
    




    
        
                                    
            
            
                
                    
                        Edit Data
                        Perbarui Catatan / Poin
                    
                    
                        
                    
                

                
                    
                        Kategori
                        
                            Ringan
                            Sedang
                            Berat
                            Sangat Berat
                        
                    

                    
                        Tanggal
                        
                    

                    
                        Poin Pelanggaran
                        
                    

                    
                        Keterangan
                        
                    
                

                
                    
                        Simpan Perubahan
                    
                
            
        
    






document.addEventListener('DOMContentLoaded', function() {
    
    const summaryData = {&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;:{&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;total_poin&quot;:60,&quot;kasus_count&quot;:4,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:01&quot;,&quot;detail&quot;:&quot;Alpha Mapel MTK (Harian)&quot;,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-05 07:43:38&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN (Harian)&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-05&quot;,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_20260405&quot;},{&quot;created_at&quot;:&quot;2026-04-02 14:47:30&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027uas mtk\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-02&quot;,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_6PatX&quot;},{&quot;created_at&quot;:&quot;2026-04-02 00:42:04&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027lari lari pagi  memutari lapangan\u0027.&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kategori&quot;:null,&quot;tgl&quot;:null,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_juD3H&quot;}]},&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;:{&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;total_poin&quot;:50,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-10 19:20:41&quot;,&quot;detail&quot;:&quot;bermain hp saat kelas berlangsung&quot;,&quot;poin&quot;:25,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;kategori&quot;:&quot;Sedang&quot;,&quot;tgl&quot;:&quot;2026-04-10&quot;,&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;5p8rpnsQKtf1jhEc7Imw&quot;},{&quot;created_at&quot;:&quot;2026-04-10 19:19:04&quot;,&quot;detail&quot;:&quot;bermain hp saat kelas berlangsung&quot;,&quot;poin&quot;:25,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;kategori&quot;:&quot;Sedang&quot;,&quot;tgl&quot;:&quot;2026-04-10&quot;,&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;RdI2lNr8g6ka5ighkFZR&quot;}]},&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;:{&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;total_poin&quot;:30,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:02&quot;,&quot;detail&quot;:&quot;Alpha Mapel MTK (Harian)&quot;,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_5phVZQXKn6VFLXrP3YgZQd70uvB3_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-02 00:42:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027lari lari pagi  memutari lapangan\u0027.&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;kategori&quot;:&quot;Akademik&quot;,&quot;tgl&quot;:&quot;2026-04-02&quot;,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_5phVZQXKn6VFLXrP3YgZQd70uvB3_S1CPC&quot;}]},&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;:{&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;student_name&quot;:&quot;test satu&quot;,&quot;total_poin&quot;:30,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-09 16:37:23&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test satu&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_U7AdAaRYDNYFhcGkXwb7U1ac4au2_20260409&quot;},{&quot;created_at&quot;:&quot;2026-04-09 14:44:24&quot;,&quot;detail&quot;:&quot;gancokkkk&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_name&quot;:&quot;test satu&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;EIDK07XQVgUF9URLeEqf&quot;}]},&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;:{&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:01&quot;,&quot;detail&quot;:null,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_yGv1dkK8PbM1SiP0CWQPHm1831K2_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-09 16:35:46&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_yGv1dkK8PbM1SiP0CWQPHm1831K2_20260409&quot;}]},&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;:{&quot;student_id&quot;:&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;,&quot;student_name&quot;:&quot;michael septa  wahyu angraini&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:09&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;michael septa  wahyu angraini&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_6MxTl0E3WsM4miTa5i1ISwUmp0t1_eBY94&quot;}]},&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;:{&quot;student_id&quot;:&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;,&quot;student_name&quot;:&quot;Ranaima Andara&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:03&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;Ranaima Andara&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_8NFCQIX9B1hxoF0yaFfzAwjKe8J2_i1TAn&quot;}]},&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;:{&quot;student_id&quot;:&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;,&quot;student_name&quot;:&quot;tomi tomblok&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;tomi tomblok&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_Ev5bOlIsRbOiL3JDiktt2B3App13_FOlNu&quot;}]},&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;:{&quot;student_id&quot;:&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;,&quot;student_name&quot;:&quot;renaldi&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;renaldi&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_gH0qvdmgv6dTaPgvskV7sYdlZux1_gPdJE&quot;}]}};
    let donutChartInstance = null;
    let barChartInstance = null;

    // --- SWEETALERT NOTIFICATIONS ---
    
    
    // --- EVENT DELEGATION (Table, Modals &amp; Forms) ---
    document.body.addEventListener('click', function(e) {
        
        // Buka Detail Modal
        const btnDetail = e.target.closest('.btn-show-detail');
        if (btnDetail) {
            showDetail(btnDetail.dataset.id);
        }

        // Buka Edit Modal (Dihasilkan dinamis di dalam Modal Detail)
        const btnEdit = e.target.closest('.btn-edit-riwayat');
        if (btnEdit) {
            const data = JSON.parse(btnEdit.dataset.data);
            openEditModal(data);
        }

        // Tutup Modal Detail
        if (e.target.closest('#btnCloseDetailModal') || e.target.closest('#btnTutupLaporan')) {
            document.getElementById('detailModal').classList.add('hidden');
            document.body.style.overflow = 'auto';
        }

        // Tutup Modal Edit
        if (e.target.closest('#btnCloseEditModal')) {
            document.getElementById('editModal').classList.add('hidden');
            document.body.style.overflow = 'auto';
        }
    });

    // Menangani form hapus, reset &amp; ubah menggunakan SweetAlert
    document.body.addEventListener('submit', function(e) {
        // Reset 1 Siswa (Tabel Utama)
        if (e.target.classList.contains('form-reset-siswa')) {
            e.preventDefault();
            Swal.fire({
                title: 'Hapus Semua Data?',
                text: &quot;Seluruh riwayat dan poin siswa ini akan di-reset menjadi 0!&quot;,
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#ef4444',
                cancelButtonColor: '#9ca3af',
                confirmButtonText: 'Ya, Reset Data!',
                cancelButtonText: 'Batal',
                customClass: { popup: 'rounded-3xl' }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }

        // Hapus Riwayat Spesifik (Dalam Modal Detail)
        if (e.target.classList.contains('form-delete-riwayat')) {
            e.preventDefault();
            Swal.fire({
                title: 'Hapus Catatan Ini?',
                text: &quot;Riwayat pelanggaran akan dihapus permanen.&quot;,
                icon: 'warning',
                showCancelButton: true,
                confirmButtonColor: '#ef4444',
                cancelButtonColor: '#9ca3af',
                confirmButtonText: 'Ya, Hapus!',
                cancelButtonText: 'Batal',
                customClass: { popup: 'rounded-3xl' }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }

        // Konfirmasi Form Edit (Dalam Modal Edit)
        if (e.target.classList.contains('form-edit-riwayat')) {
            e.preventDefault();
            Swal.fire({
                title: 'Simpan Perubahan?',
                text: &quot;Data poin dan catatan pelanggaran akan diperbarui.&quot;,
                icon: 'info',
                showCancelButton: true,
                confirmButtonColor: '#ef4444',
                cancelButtonColor: '#9ca3af',
                confirmButtonText: 'Ya, Simpan!',
                cancelButtonText: 'Batal',
                customClass: { popup: 'rounded-3xl' }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }
    });

    // --- FITUR FILTER KELAS ---
    const filterKelas = document.getElementById('filterKelas');
    if (filterKelas) {
        filterKelas.addEventListener('change', function() {
            document.getElementById('filterFormPelanggaran').submit();
        });
    }

    // --- FITUR LIVE SEARCH (Debounce Optimization) ---
    const searchInput = document.getElementById('violationSearch');
    if (searchInput) {
        let debounceTimer;
        const rows = document.querySelectorAll(&quot;.violation-row&quot;);
        searchInput.addEventListener('input', function(e) {
            clearTimeout(debounceTimer);
            debounceTimer = setTimeout(() => {
                const filter = e.target.value.toUpperCase();
                rows.forEach(tr => {
                    const name = tr.dataset.name || '';
                    tr.style.display = name.includes(filter) ? &quot;&quot; : &quot;none&quot;;
                });
            }, 250); 
        });
    }

    // --- FUNGSI TAMPILKAN DETAIL MODAL ---
    function showDetail(sId) {
        const student = summaryData[sId];
        document.getElementById('modalTitle').innerText = student.student_name;
        document.getElementById('modalSubTitle').innerText = student.kasus_count + &quot; Total Catatan&quot;;
        
        let html = '';
        student.details.forEach(v => {
            const isAuto = (v.detail || '').toLowerCase().includes('otomatis');
            const dataString = JSON.stringify(v).replace(/&quot;/g, '&amp;quot;');
            const isMinus = parseInt(v.poin) &lt; 0;
            
            let badgeClass = isMinus ? 'bg-emerald-500 text-white' : (isAuto ? 'bg-amber-500 text-white' : 'bg-red-600 text-white');
            let borderClass = isMinus ? 'border-emerald-100 bg-emerald-50/30' : (isAuto ? 'bg-amber-50/50 border-amber-100' : 'bg-gray-50 border-gray-100');

            html += `
                &lt;div class=&quot;p-5 ${borderClass} border-2 rounded-[1.5rem] transition-all relative overflow-hidden mb-4&quot;>
                    ${isMinus ? '&lt;i class=&quot;fa-solid fa-medal absolute -right-4 -bottom-4 text-6xl text-emerald-100 opacity-50 rotate-12 pointer-events-none&quot;>&lt;/i>' : ''}
                    &lt;div class=&quot;flex justify-between items-center mb-3 relative z-10&quot;>
                        &lt;span class=&quot;text-[9px] font-black px-3 py-1 rounded-full ${badgeClass} uppercase tracking-widest&quot;>${v.kategori}&lt;/span>
                        &lt;span class=&quot;text-[10px] font-black text-gray-400 italic&quot;>${v.tgl}&lt;/span>
                    &lt;/div>
                    &lt;p class=&quot;text-[11px] font-bold text-slate-700 leading-relaxed mb-3 relative z-10&quot;>${v.detail}&lt;/p>
                    &lt;div class=&quot;flex justify-between items-center border-t ${isMinus ? 'border-emerald-200' : 'border-dashed border-gray-200'} pt-3 relative z-10&quot;>
                        &lt;span class=&quot;text-[12px] font-black ${isMinus ? 'text-emerald-600' : 'text-slate-900'} uppercase&quot;>
                            ${parseInt(v.poin) > 0 ? '+' : ''}${v.poin} Poin
                        &lt;/span>
                        &lt;div class=&quot;flex items-center gap-2&quot;>
                            &lt;button type=&quot;button&quot; data-data=&quot;${dataString}&quot; class=&quot;btn-edit-riwayat text-blue-500 hover:text-blue-700 text-xs p-2&quot;>
                                &lt;i class=&quot;fa-solid fa-pen-to-square pointer-events-none&quot;>&lt;/i>
                            &lt;/button>
                            &lt;form action=&quot;https://sipemkas.my.id/guru/pelanggaran/hapus/${v.kelas}/${v.db_key}&quot; method=&quot;POST&quot; class=&quot;inline form-delete-riwayat&quot;>
                                &lt;input type=&quot;hidden&quot; name=&quot;_token&quot; value=&quot;2nmvaOdti3XiJ0SP9O5tFY8Jvyn8L1eo7cGuJvfZ&quot; autocomplete=&quot;off&quot;> &lt;input type=&quot;hidden&quot; name=&quot;_method&quot; value=&quot;DELETE&quot;>                                &lt;button type=&quot;submit&quot; class=&quot;text-red-500 hover:text-red-700 text-xs p-2&quot;>
                                    &lt;i class=&quot;fa-solid fa-trash-can pointer-events-none&quot;>&lt;/i>
                                &lt;/button>
                            &lt;/form>
                        &lt;/div>
                    &lt;/div>
                &lt;/div>`;
        });
        document.getElementById('modalBody').innerHTML = html;
        document.getElementById('detailModal').classList.remove('hidden');
        document.body.style.overflow = 'hidden';
    }

    // --- FUNGSI BUKA MODAL EDIT ---
    function openEditModal(data) {
        document.getElementById('detailModal').classList.add('hidden');
        
        document.getElementById('edit_kategori').value = data.kategori;
        document.getElementById('edit_tanggal').value = data.tgl;
        document.getElementById('edit_poin').value = data.poin;
        document.getElementById('edit_detail').value = data.detail;

        document.getElementById('editForm').action = &quot;https://sipemkas.my.id/guru/pelanggaran/update/&quot; + data.db_key;
        document.getElementById('editModal').classList.remove('hidden');
    }

    // --- FUNGSI CHART ---
    function initCharts() {
        if (typeof Chart === 'undefined') {
            setTimeout(initCharts, 50); 
            return;
        }

        const ringan = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == 'Ringan').length, 0);
        const sedang = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == 'Sedang').length, 0);
        const berat = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == 'Berat').length, 0);

        const ctxDonut = document.getElementById('violationDonutChart');
        if (ctxDonut) {
            if (donutChartInstance) donutChartInstance.destroy(); 
            donutChartInstance = new Chart(ctxDonut.getContext('2d'), {
                type: 'doughnut',
                data: {
                    labels: ['Ringan', 'Sedang', 'Berat'],
                    datasets: [{
                        data: [ringan, sedang, berat],
                        backgroundColor: ['#f59e0b', '#ef4444', '#b91c1c'],
                        borderWidth: 0,
                        cutout: '80%'
                    }]
                },
                options: { maintainAspectRatio: false, plugins: { legend: { position: 'bottom', labels: { usePointStyle: true, font: { size: 9, weight: 'bold' } } } } }
            });
        }

        const ctxBar = document.getElementById('violationBarChart');
        if (ctxBar) {
            if (barChartInstance) barChartInstance.destroy(); 
            barChartInstance = new Chart(ctxBar.getContext('2d'), {
                type: 'bar',
                data: {
                    labels: Object.values(summaryData).slice(0, 5).map(s => s.student_name.split(' ')[0]),
                    datasets: [{
                        label: 'Total Poin',
                        data: Object.values(summaryData).slice(0, 5).map(s => s.total_poin),
                        backgroundColor: '#1D4ED8',
                        borderRadius: 10
                    }]
                },
                options: { maintainAspectRatio: false, scales: { y: { beginAtZero: true, grid: { display: false } }, x: { grid: { display: false } } }, plugins: { legend: { display: false } } }
            });
        }
    }

    initCharts();
});

            
        </value>
      <webElementGuid>e29897a4-2289-46e3-84f5-687c8b002df5</webElementGuid>
   </webElementProperties>
   <webElementProperties>
      <isSelected>false</isSelected>
      <matchCondition>equals</matchCondition>
      <name>parent</name>
      <type>Main</type>
      <value>md5.v1-218fb090245417cb4fd6b24ede7bb3c9</value>
      <webElementGuid>6f5341e3-018a-4897-b79a-7326da39c89c</webElementGuid>
   </webElementProperties>
   <webElementProperties>
      <isSelected>false</isSelected>
      <matchCondition>equals</matchCondition>
      <name>xpath</name>
      <type>Main</type>
      <value>//main</value>
      <webElementGuid>435f5e14-746a-422a-9b5e-c25ab2c2d3bf</webElementGuid>
   </webElementProperties>
   <webElementXpaths>
      <isSelected>false</isSelected>
      <matchCondition>equals</matchCondition>
      <name>xpath:attributes</name>
      <type>Main</type>
      <value>//main</value>
      <webElementGuid>731a1029-5bca-4fbe-9848-bb3b42bdfbbd</webElementGuid>
   </webElementXpaths>
   <webElementXpaths>
      <isSelected>false</isSelected>
      <matchCondition>equals</matchCondition>
      <name>xpath:customAttributes</name>
      <type>Main</type>
      <value>//main[(text() = concat(&quot;
            
                
                
                    
                         10 April 2026
                    
                
            

            
                
    
    
    
    
        
        
            
        
        
            
                Pelanggaran 9A
            
            
                
                
                Monitoring Kedisiplinan
            
        
    

    
        
        
            
                
                Siswa Tercatat
                
                
                    09
                    Siswa
                
            
            
            
        

        
        
             
            Input Data
        
    

    
    
    
        
        
        
            
            
                                    
                        KELAS 7A
                    
                                    
                        KELAS 9A
                    
                            
            
        

        
        
            
            
            
                CARI
            
        
    

    

    
    
    
        
            
                
                    No
                    Nama Peserta Didik
                    Jumlah Kasus
                    Total Poin
                    Aksi
                
            
            
                                
                    
                        1
                    
                    
                        
                            test dua
                            ID: DwQPUt7Lb7al0Of1t5BXL0Yc6Up1
                        
                    
                    
                        
                            4 Kasus
                        
                    
                    
                                                
                            60 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        2
                    
                    
                        
                            Arjuna Pradipta
                            ID: h5M91XVZIKQqRtk6aevRApagyos1
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            50 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        3
                    
                    
                        
                            test tiga
                            ID: 5phVZQXKn6VFLXrP3YgZQd70uvB3
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            30 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        4
                    
                    
                        
                            test satu
                            ID: U7AdAaRYDNYFhcGkXwb7U1ac4au2
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            30 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        5
                    
                    
                        
                            test  keempat
                            ID: yGv1dkK8PbM1SiP0CWQPHm1831K2
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        6
                    
                    
                        
                            michael septa  wahyu angraini
                            ID: 6MxTl0E3WsM4miTa5i1ISwUmp0t1
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        7
                    
                    
                        
                            Ranaima Andara
                            ID: 8NFCQIX9B1hxoF0yaFfzAwjKe8J2
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        8
                    
                    
                        
                            tomi tomblok
                            ID: Ev5bOlIsRbOiL3JDiktt2B3App13
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        9
                    
                    
                        
                            renaldi
                            ID: gH0qvdmgv6dTaPgvskV7sYdlZux1
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                            
        
    





    
        
            
                Riwayat Pelanggaran
                
            
            
                
            
        
        
            
        
        
            Tutup Laporan
        
    




    
        
                                    
            
            
                
                    
                        Edit Data
                        Perbarui Catatan / Poin
                    
                    
                        
                    
                

                
                    
                        Kategori
                        
                            Ringan
                            Sedang
                            Berat
                            Sangat Berat
                        
                    

                    
                        Tanggal
                        
                    

                    
                        Poin Pelanggaran
                        
                    

                    
                        Keterangan
                        
                    
                

                
                    
                        Simpan Perubahan
                    
                
            
        
    






document.addEventListener(&quot; , &quot;'&quot; , &quot;DOMContentLoaded&quot; , &quot;'&quot; , &quot;, function() {
    
    const summaryData = {&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;:{&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;total_poin&quot;:60,&quot;kasus_count&quot;:4,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:01&quot;,&quot;detail&quot;:&quot;Alpha Mapel MTK (Harian)&quot;,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-05 07:43:38&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN (Harian)&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-05&quot;,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_20260405&quot;},{&quot;created_at&quot;:&quot;2026-04-02 14:47:30&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027uas mtk\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-02&quot;,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_6PatX&quot;},{&quot;created_at&quot;:&quot;2026-04-02 00:42:04&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027lari lari pagi  memutari lapangan\u0027.&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kategori&quot;:null,&quot;tgl&quot;:null,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_juD3H&quot;}]},&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;:{&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;total_poin&quot;:50,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-10 19:20:41&quot;,&quot;detail&quot;:&quot;bermain hp saat kelas berlangsung&quot;,&quot;poin&quot;:25,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;kategori&quot;:&quot;Sedang&quot;,&quot;tgl&quot;:&quot;2026-04-10&quot;,&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;5p8rpnsQKtf1jhEc7Imw&quot;},{&quot;created_at&quot;:&quot;2026-04-10 19:19:04&quot;,&quot;detail&quot;:&quot;bermain hp saat kelas berlangsung&quot;,&quot;poin&quot;:25,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;kategori&quot;:&quot;Sedang&quot;,&quot;tgl&quot;:&quot;2026-04-10&quot;,&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;RdI2lNr8g6ka5ighkFZR&quot;}]},&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;:{&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;total_poin&quot;:30,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:02&quot;,&quot;detail&quot;:&quot;Alpha Mapel MTK (Harian)&quot;,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_5phVZQXKn6VFLXrP3YgZQd70uvB3_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-02 00:42:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027lari lari pagi  memutari lapangan\u0027.&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;kategori&quot;:&quot;Akademik&quot;,&quot;tgl&quot;:&quot;2026-04-02&quot;,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_5phVZQXKn6VFLXrP3YgZQd70uvB3_S1CPC&quot;}]},&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;:{&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;student_name&quot;:&quot;test satu&quot;,&quot;total_poin&quot;:30,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-09 16:37:23&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test satu&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_U7AdAaRYDNYFhcGkXwb7U1ac4au2_20260409&quot;},{&quot;created_at&quot;:&quot;2026-04-09 14:44:24&quot;,&quot;detail&quot;:&quot;gancokkkk&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_name&quot;:&quot;test satu&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;EIDK07XQVgUF9URLeEqf&quot;}]},&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;:{&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:01&quot;,&quot;detail&quot;:null,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_yGv1dkK8PbM1SiP0CWQPHm1831K2_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-09 16:35:46&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_yGv1dkK8PbM1SiP0CWQPHm1831K2_20260409&quot;}]},&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;:{&quot;student_id&quot;:&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;,&quot;student_name&quot;:&quot;michael septa  wahyu angraini&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:09&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;michael septa  wahyu angraini&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_6MxTl0E3WsM4miTa5i1ISwUmp0t1_eBY94&quot;}]},&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;:{&quot;student_id&quot;:&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;,&quot;student_name&quot;:&quot;Ranaima Andara&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:03&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;Ranaima Andara&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_8NFCQIX9B1hxoF0yaFfzAwjKe8J2_i1TAn&quot;}]},&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;:{&quot;student_id&quot;:&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;,&quot;student_name&quot;:&quot;tomi tomblok&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;tomi tomblok&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_Ev5bOlIsRbOiL3JDiktt2B3App13_FOlNu&quot;}]},&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;:{&quot;student_id&quot;:&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;,&quot;student_name&quot;:&quot;renaldi&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;renaldi&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_gH0qvdmgv6dTaPgvskV7sYdlZux1_gPdJE&quot;}]}};
    let donutChartInstance = null;
    let barChartInstance = null;

    // --- SWEETALERT NOTIFICATIONS ---
    
    
    // --- EVENT DELEGATION (Table, Modals &amp; Forms) ---
    document.body.addEventListener(&quot; , &quot;'&quot; , &quot;click&quot; , &quot;'&quot; , &quot;, function(e) {
        
        // Buka Detail Modal
        const btnDetail = e.target.closest(&quot; , &quot;'&quot; , &quot;.btn-show-detail&quot; , &quot;'&quot; , &quot;);
        if (btnDetail) {
            showDetail(btnDetail.dataset.id);
        }

        // Buka Edit Modal (Dihasilkan dinamis di dalam Modal Detail)
        const btnEdit = e.target.closest(&quot; , &quot;'&quot; , &quot;.btn-edit-riwayat&quot; , &quot;'&quot; , &quot;);
        if (btnEdit) {
            const data = JSON.parse(btnEdit.dataset.data);
            openEditModal(data);
        }

        // Tutup Modal Detail
        if (e.target.closest(&quot; , &quot;'&quot; , &quot;#btnCloseDetailModal&quot; , &quot;'&quot; , &quot;) || e.target.closest(&quot; , &quot;'&quot; , &quot;#btnTutupLaporan&quot; , &quot;'&quot; , &quot;)) {
            document.getElementById(&quot; , &quot;'&quot; , &quot;detailModal&quot; , &quot;'&quot; , &quot;).classList.add(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
            document.body.style.overflow = &quot; , &quot;'&quot; , &quot;auto&quot; , &quot;'&quot; , &quot;;
        }

        // Tutup Modal Edit
        if (e.target.closest(&quot; , &quot;'&quot; , &quot;#btnCloseEditModal&quot; , &quot;'&quot; , &quot;)) {
            document.getElementById(&quot; , &quot;'&quot; , &quot;editModal&quot; , &quot;'&quot; , &quot;).classList.add(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
            document.body.style.overflow = &quot; , &quot;'&quot; , &quot;auto&quot; , &quot;'&quot; , &quot;;
        }
    });

    // Menangani form hapus, reset &amp; ubah menggunakan SweetAlert
    document.body.addEventListener(&quot; , &quot;'&quot; , &quot;submit&quot; , &quot;'&quot; , &quot;, function(e) {
        // Reset 1 Siswa (Tabel Utama)
        if (e.target.classList.contains(&quot; , &quot;'&quot; , &quot;form-reset-siswa&quot; , &quot;'&quot; , &quot;)) {
            e.preventDefault();
            Swal.fire({
                title: &quot; , &quot;'&quot; , &quot;Hapus Semua Data?&quot; , &quot;'&quot; , &quot;,
                text: &quot;Seluruh riwayat dan poin siswa ini akan di-reset menjadi 0!&quot;,
                icon: &quot; , &quot;'&quot; , &quot;warning&quot; , &quot;'&quot; , &quot;,
                showCancelButton: true,
                confirmButtonColor: &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;,
                cancelButtonColor: &quot; , &quot;'&quot; , &quot;#9ca3af&quot; , &quot;'&quot; , &quot;,
                confirmButtonText: &quot; , &quot;'&quot; , &quot;Ya, Reset Data!&quot; , &quot;'&quot; , &quot;,
                cancelButtonText: &quot; , &quot;'&quot; , &quot;Batal&quot; , &quot;'&quot; , &quot;,
                customClass: { popup: &quot; , &quot;'&quot; , &quot;rounded-3xl&quot; , &quot;'&quot; , &quot; }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }

        // Hapus Riwayat Spesifik (Dalam Modal Detail)
        if (e.target.classList.contains(&quot; , &quot;'&quot; , &quot;form-delete-riwayat&quot; , &quot;'&quot; , &quot;)) {
            e.preventDefault();
            Swal.fire({
                title: &quot; , &quot;'&quot; , &quot;Hapus Catatan Ini?&quot; , &quot;'&quot; , &quot;,
                text: &quot;Riwayat pelanggaran akan dihapus permanen.&quot;,
                icon: &quot; , &quot;'&quot; , &quot;warning&quot; , &quot;'&quot; , &quot;,
                showCancelButton: true,
                confirmButtonColor: &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;,
                cancelButtonColor: &quot; , &quot;'&quot; , &quot;#9ca3af&quot; , &quot;'&quot; , &quot;,
                confirmButtonText: &quot; , &quot;'&quot; , &quot;Ya, Hapus!&quot; , &quot;'&quot; , &quot;,
                cancelButtonText: &quot; , &quot;'&quot; , &quot;Batal&quot; , &quot;'&quot; , &quot;,
                customClass: { popup: &quot; , &quot;'&quot; , &quot;rounded-3xl&quot; , &quot;'&quot; , &quot; }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }

        // Konfirmasi Form Edit (Dalam Modal Edit)
        if (e.target.classList.contains(&quot; , &quot;'&quot; , &quot;form-edit-riwayat&quot; , &quot;'&quot; , &quot;)) {
            e.preventDefault();
            Swal.fire({
                title: &quot; , &quot;'&quot; , &quot;Simpan Perubahan?&quot; , &quot;'&quot; , &quot;,
                text: &quot;Data poin dan catatan pelanggaran akan diperbarui.&quot;,
                icon: &quot; , &quot;'&quot; , &quot;info&quot; , &quot;'&quot; , &quot;,
                showCancelButton: true,
                confirmButtonColor: &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;,
                cancelButtonColor: &quot; , &quot;'&quot; , &quot;#9ca3af&quot; , &quot;'&quot; , &quot;,
                confirmButtonText: &quot; , &quot;'&quot; , &quot;Ya, Simpan!&quot; , &quot;'&quot; , &quot;,
                cancelButtonText: &quot; , &quot;'&quot; , &quot;Batal&quot; , &quot;'&quot; , &quot;,
                customClass: { popup: &quot; , &quot;'&quot; , &quot;rounded-3xl&quot; , &quot;'&quot; , &quot; }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }
    });

    // --- FITUR FILTER KELAS ---
    const filterKelas = document.getElementById(&quot; , &quot;'&quot; , &quot;filterKelas&quot; , &quot;'&quot; , &quot;);
    if (filterKelas) {
        filterKelas.addEventListener(&quot; , &quot;'&quot; , &quot;change&quot; , &quot;'&quot; , &quot;, function() {
            document.getElementById(&quot; , &quot;'&quot; , &quot;filterFormPelanggaran&quot; , &quot;'&quot; , &quot;).submit();
        });
    }

    // --- FITUR LIVE SEARCH (Debounce Optimization) ---
    const searchInput = document.getElementById(&quot; , &quot;'&quot; , &quot;violationSearch&quot; , &quot;'&quot; , &quot;);
    if (searchInput) {
        let debounceTimer;
        const rows = document.querySelectorAll(&quot;.violation-row&quot;);
        searchInput.addEventListener(&quot; , &quot;'&quot; , &quot;input&quot; , &quot;'&quot; , &quot;, function(e) {
            clearTimeout(debounceTimer);
            debounceTimer = setTimeout(() => {
                const filter = e.target.value.toUpperCase();
                rows.forEach(tr => {
                    const name = tr.dataset.name || &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;;
                    tr.style.display = name.includes(filter) ? &quot;&quot; : &quot;none&quot;;
                });
            }, 250); 
        });
    }

    // --- FUNGSI TAMPILKAN DETAIL MODAL ---
    function showDetail(sId) {
        const student = summaryData[sId];
        document.getElementById(&quot; , &quot;'&quot; , &quot;modalTitle&quot; , &quot;'&quot; , &quot;).innerText = student.student_name;
        document.getElementById(&quot; , &quot;'&quot; , &quot;modalSubTitle&quot; , &quot;'&quot; , &quot;).innerText = student.kasus_count + &quot; Total Catatan&quot;;
        
        let html = &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;;
        student.details.forEach(v => {
            const isAuto = (v.detail || &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;).toLowerCase().includes(&quot; , &quot;'&quot; , &quot;otomatis&quot; , &quot;'&quot; , &quot;);
            const dataString = JSON.stringify(v).replace(/&quot;/g, &quot; , &quot;'&quot; , &quot;&amp;quot;&quot; , &quot;'&quot; , &quot;);
            const isMinus = parseInt(v.poin) &lt; 0;
            
            let badgeClass = isMinus ? &quot; , &quot;'&quot; , &quot;bg-emerald-500 text-white&quot; , &quot;'&quot; , &quot; : (isAuto ? &quot; , &quot;'&quot; , &quot;bg-amber-500 text-white&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;bg-red-600 text-white&quot; , &quot;'&quot; , &quot;);
            let borderClass = isMinus ? &quot; , &quot;'&quot; , &quot;border-emerald-100 bg-emerald-50/30&quot; , &quot;'&quot; , &quot; : (isAuto ? &quot; , &quot;'&quot; , &quot;bg-amber-50/50 border-amber-100&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;bg-gray-50 border-gray-100&quot; , &quot;'&quot; , &quot;);

            html += `
                &lt;div class=&quot;p-5 ${borderClass} border-2 rounded-[1.5rem] transition-all relative overflow-hidden mb-4&quot;>
                    ${isMinus ? &quot; , &quot;'&quot; , &quot;&lt;i class=&quot;fa-solid fa-medal absolute -right-4 -bottom-4 text-6xl text-emerald-100 opacity-50 rotate-12 pointer-events-none&quot;>&lt;/i>&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;}
                    &lt;div class=&quot;flex justify-between items-center mb-3 relative z-10&quot;>
                        &lt;span class=&quot;text-[9px] font-black px-3 py-1 rounded-full ${badgeClass} uppercase tracking-widest&quot;>${v.kategori}&lt;/span>
                        &lt;span class=&quot;text-[10px] font-black text-gray-400 italic&quot;>${v.tgl}&lt;/span>
                    &lt;/div>
                    &lt;p class=&quot;text-[11px] font-bold text-slate-700 leading-relaxed mb-3 relative z-10&quot;>${v.detail}&lt;/p>
                    &lt;div class=&quot;flex justify-between items-center border-t ${isMinus ? &quot; , &quot;'&quot; , &quot;border-emerald-200&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;border-dashed border-gray-200&quot; , &quot;'&quot; , &quot;} pt-3 relative z-10&quot;>
                        &lt;span class=&quot;text-[12px] font-black ${isMinus ? &quot; , &quot;'&quot; , &quot;text-emerald-600&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;text-slate-900&quot; , &quot;'&quot; , &quot;} uppercase&quot;>
                            ${parseInt(v.poin) > 0 ? &quot; , &quot;'&quot; , &quot;+&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;}${v.poin} Poin
                        &lt;/span>
                        &lt;div class=&quot;flex items-center gap-2&quot;>
                            &lt;button type=&quot;button&quot; data-data=&quot;${dataString}&quot; class=&quot;btn-edit-riwayat text-blue-500 hover:text-blue-700 text-xs p-2&quot;>
                                &lt;i class=&quot;fa-solid fa-pen-to-square pointer-events-none&quot;>&lt;/i>
                            &lt;/button>
                            &lt;form action=&quot;https://sipemkas.my.id/guru/pelanggaran/hapus/${v.kelas}/${v.db_key}&quot; method=&quot;POST&quot; class=&quot;inline form-delete-riwayat&quot;>
                                &lt;input type=&quot;hidden&quot; name=&quot;_token&quot; value=&quot;2nmvaOdti3XiJ0SP9O5tFY8Jvyn8L1eo7cGuJvfZ&quot; autocomplete=&quot;off&quot;> &lt;input type=&quot;hidden&quot; name=&quot;_method&quot; value=&quot;DELETE&quot;>                                &lt;button type=&quot;submit&quot; class=&quot;text-red-500 hover:text-red-700 text-xs p-2&quot;>
                                    &lt;i class=&quot;fa-solid fa-trash-can pointer-events-none&quot;>&lt;/i>
                                &lt;/button>
                            &lt;/form>
                        &lt;/div>
                    &lt;/div>
                &lt;/div>`;
        });
        document.getElementById(&quot; , &quot;'&quot; , &quot;modalBody&quot; , &quot;'&quot; , &quot;).innerHTML = html;
        document.getElementById(&quot; , &quot;'&quot; , &quot;detailModal&quot; , &quot;'&quot; , &quot;).classList.remove(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
        document.body.style.overflow = &quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;;
    }

    // --- FUNGSI BUKA MODAL EDIT ---
    function openEditModal(data) {
        document.getElementById(&quot; , &quot;'&quot; , &quot;detailModal&quot; , &quot;'&quot; , &quot;).classList.add(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
        
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_kategori&quot; , &quot;'&quot; , &quot;).value = data.kategori;
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_tanggal&quot; , &quot;'&quot; , &quot;).value = data.tgl;
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_poin&quot; , &quot;'&quot; , &quot;).value = data.poin;
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_detail&quot; , &quot;'&quot; , &quot;).value = data.detail;

        document.getElementById(&quot; , &quot;'&quot; , &quot;editForm&quot; , &quot;'&quot; , &quot;).action = &quot;https://sipemkas.my.id/guru/pelanggaran/update/&quot; + data.db_key;
        document.getElementById(&quot; , &quot;'&quot; , &quot;editModal&quot; , &quot;'&quot; , &quot;).classList.remove(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
    }

    // --- FUNGSI CHART ---
    function initCharts() {
        if (typeof Chart === &quot; , &quot;'&quot; , &quot;undefined&quot; , &quot;'&quot; , &quot;) {
            setTimeout(initCharts, 50); 
            return;
        }

        const ringan = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == &quot; , &quot;'&quot; , &quot;Ringan&quot; , &quot;'&quot; , &quot;).length, 0);
        const sedang = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == &quot; , &quot;'&quot; , &quot;Sedang&quot; , &quot;'&quot; , &quot;).length, 0);
        const berat = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == &quot; , &quot;'&quot; , &quot;Berat&quot; , &quot;'&quot; , &quot;).length, 0);

        const ctxDonut = document.getElementById(&quot; , &quot;'&quot; , &quot;violationDonutChart&quot; , &quot;'&quot; , &quot;);
        if (ctxDonut) {
            if (donutChartInstance) donutChartInstance.destroy(); 
            donutChartInstance = new Chart(ctxDonut.getContext(&quot; , &quot;'&quot; , &quot;2d&quot; , &quot;'&quot; , &quot;), {
                type: &quot; , &quot;'&quot; , &quot;doughnut&quot; , &quot;'&quot; , &quot;,
                data: {
                    labels: [&quot; , &quot;'&quot; , &quot;Ringan&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;Sedang&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;Berat&quot; , &quot;'&quot; , &quot;],
                    datasets: [{
                        data: [ringan, sedang, berat],
                        backgroundColor: [&quot; , &quot;'&quot; , &quot;#f59e0b&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;#b91c1c&quot; , &quot;'&quot; , &quot;],
                        borderWidth: 0,
                        cutout: &quot; , &quot;'&quot; , &quot;80%&quot; , &quot;'&quot; , &quot;
                    }]
                },
                options: { maintainAspectRatio: false, plugins: { legend: { position: &quot; , &quot;'&quot; , &quot;bottom&quot; , &quot;'&quot; , &quot;, labels: { usePointStyle: true, font: { size: 9, weight: &quot; , &quot;'&quot; , &quot;bold&quot; , &quot;'&quot; , &quot; } } } } }
            });
        }

        const ctxBar = document.getElementById(&quot; , &quot;'&quot; , &quot;violationBarChart&quot; , &quot;'&quot; , &quot;);
        if (ctxBar) {
            if (barChartInstance) barChartInstance.destroy(); 
            barChartInstance = new Chart(ctxBar.getContext(&quot; , &quot;'&quot; , &quot;2d&quot; , &quot;'&quot; , &quot;), {
                type: &quot; , &quot;'&quot; , &quot;bar&quot; , &quot;'&quot; , &quot;,
                data: {
                    labels: Object.values(summaryData).slice(0, 5).map(s => s.student_name.split(&quot; , &quot;'&quot; , &quot; &quot; , &quot;'&quot; , &quot;)[0]),
                    datasets: [{
                        label: &quot; , &quot;'&quot; , &quot;Total Poin&quot; , &quot;'&quot; , &quot;,
                        data: Object.values(summaryData).slice(0, 5).map(s => s.total_poin),
                        backgroundColor: &quot; , &quot;'&quot; , &quot;#1D4ED8&quot; , &quot;'&quot; , &quot;,
                        borderRadius: 10
                    }]
                },
                options: { maintainAspectRatio: false, scales: { y: { beginAtZero: true, grid: { display: false } }, x: { grid: { display: false } } }, plugins: { legend: { display: false } } }
            });
        }
    }

    initCharts();
});

            
        &quot;) or . = concat(&quot;
            
                
                
                    
                         10 April 2026
                    
                
            

            
                
    
    
    
    
        
        
            
        
        
            
                Pelanggaran 9A
            
            
                
                
                Monitoring Kedisiplinan
            
        
    

    
        
        
            
                
                Siswa Tercatat
                
                
                    09
                    Siswa
                
            
            
            
        

        
        
             
            Input Data
        
    

    
    
    
        
        
        
            
            
                                    
                        KELAS 7A
                    
                                    
                        KELAS 9A
                    
                            
            
        

        
        
            
            
            
                CARI
            
        
    

    

    
    
    
        
            
                
                    No
                    Nama Peserta Didik
                    Jumlah Kasus
                    Total Poin
                    Aksi
                
            
            
                                
                    
                        1
                    
                    
                        
                            test dua
                            ID: DwQPUt7Lb7al0Of1t5BXL0Yc6Up1
                        
                    
                    
                        
                            4 Kasus
                        
                    
                    
                                                
                            60 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        2
                    
                    
                        
                            Arjuna Pradipta
                            ID: h5M91XVZIKQqRtk6aevRApagyos1
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            50 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        3
                    
                    
                        
                            test tiga
                            ID: 5phVZQXKn6VFLXrP3YgZQd70uvB3
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            30 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        4
                    
                    
                        
                            test satu
                            ID: U7AdAaRYDNYFhcGkXwb7U1ac4au2
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            30 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        5
                    
                    
                        
                            test  keempat
                            ID: yGv1dkK8PbM1SiP0CWQPHm1831K2
                        
                    
                    
                        
                            2 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        6
                    
                    
                        
                            michael septa  wahyu angraini
                            ID: 6MxTl0E3WsM4miTa5i1ISwUmp0t1
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        7
                    
                    
                        
                            Ranaima Andara
                            ID: 8NFCQIX9B1hxoF0yaFfzAwjKe8J2
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        8
                    
                    
                        
                            tomi tomblok
                            ID: Ev5bOlIsRbOiL3JDiktt2B3App13
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                                
                    
                        9
                    
                    
                        
                            renaldi
                            ID: gH0qvdmgv6dTaPgvskV7sYdlZux1
                        
                    
                    
                        
                            1 Kasus
                        
                    
                    
                                                
                            20 Poin
                        
                    
                    
                        
                            
                            
                                
                            
                    
                            
                            
                                                                                                
                                    
                                
                            
                        
                    
                
                            
        
    





    
        
            
                Riwayat Pelanggaran
                
            
            
                
            
        
        
            
        
        
            Tutup Laporan
        
    




    
        
                                    
            
            
                
                    
                        Edit Data
                        Perbarui Catatan / Poin
                    
                    
                        
                    
                

                
                    
                        Kategori
                        
                            Ringan
                            Sedang
                            Berat
                            Sangat Berat
                        
                    

                    
                        Tanggal
                        
                    

                    
                        Poin Pelanggaran
                        
                    

                    
                        Keterangan
                        
                    
                

                
                    
                        Simpan Perubahan
                    
                
            
        
    






document.addEventListener(&quot; , &quot;'&quot; , &quot;DOMContentLoaded&quot; , &quot;'&quot; , &quot;, function() {
    
    const summaryData = {&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;:{&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;total_poin&quot;:60,&quot;kasus_count&quot;:4,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:01&quot;,&quot;detail&quot;:&quot;Alpha Mapel MTK (Harian)&quot;,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-05 07:43:38&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN (Harian)&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-05&quot;,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_20260405&quot;},{&quot;created_at&quot;:&quot;2026-04-02 14:47:30&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027uas mtk\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;test dua&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-02&quot;,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_6PatX&quot;},{&quot;created_at&quot;:&quot;2026-04-02 00:42:04&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027lari lari pagi  memutari lapangan\u0027.&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;DwQPUt7Lb7al0Of1t5BXL0Yc6Up1&quot;,&quot;kategori&quot;:null,&quot;tgl&quot;:null,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_name&quot;:&quot;test dua&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_DwQPUt7Lb7al0Of1t5BXL0Yc6Up1_juD3H&quot;}]},&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;:{&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;total_poin&quot;:50,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-10 19:20:41&quot;,&quot;detail&quot;:&quot;bermain hp saat kelas berlangsung&quot;,&quot;poin&quot;:25,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;kategori&quot;:&quot;Sedang&quot;,&quot;tgl&quot;:&quot;2026-04-10&quot;,&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;5p8rpnsQKtf1jhEc7Imw&quot;},{&quot;created_at&quot;:&quot;2026-04-10 19:19:04&quot;,&quot;detail&quot;:&quot;bermain hp saat kelas berlangsung&quot;,&quot;poin&quot;:25,&quot;student_name&quot;:&quot;Arjuna Pradipta&quot;,&quot;kategori&quot;:&quot;Sedang&quot;,&quot;tgl&quot;:&quot;2026-04-10&quot;,&quot;student_id&quot;:&quot;h5M91XVZIKQqRtk6aevRApagyos1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;RdI2lNr8g6ka5ighkFZR&quot;}]},&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;:{&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;total_poin&quot;:30,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:02&quot;,&quot;detail&quot;:&quot;Alpha Mapel MTK (Harian)&quot;,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_5phVZQXKn6VFLXrP3YgZQd70uvB3_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-02 00:42:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027lari lari pagi  memutari lapangan\u0027.&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;5phVZQXKn6VFLXrP3YgZQd70uvB3&quot;,&quot;kategori&quot;:&quot;Akademik&quot;,&quot;tgl&quot;:&quot;2026-04-02&quot;,&quot;uid_guru&quot;:&quot;tj6gMczau2T1AotiZCd7rs4Geoa2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_name&quot;:&quot;test tiga&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_5phVZQXKn6VFLXrP3YgZQd70uvB3_S1CPC&quot;}]},&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;:{&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;student_name&quot;:&quot;test satu&quot;,&quot;total_poin&quot;:30,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-09 16:37:23&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test satu&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_U7AdAaRYDNYFhcGkXwb7U1ac4au2_20260409&quot;},{&quot;created_at&quot;:&quot;2026-04-09 14:44:24&quot;,&quot;detail&quot;:&quot;gancokkkk&quot;,&quot;poin&quot;:20,&quot;student_id&quot;:&quot;U7AdAaRYDNYFhcGkXwb7U1ac4au2&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_name&quot;:&quot;test satu&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;EIDK07XQVgUF9URLeEqf&quot;}]},&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;:{&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:2,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-02 00:51:01&quot;,&quot;detail&quot;:null,&quot;poin&quot;:10,&quot;is_auto&quot;:true,&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-01&quot;,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_yGv1dkK8PbM1SiP0CWQPHm1831K2_20260401&quot;},{&quot;created_at&quot;:&quot;2026-04-09 16:35:46&quot;,&quot;detail&quot;:&quot;Alpha Mapel BIN&quot;,&quot;is_auto&quot;:true,&quot;poin&quot;:10,&quot;student_name&quot;:&quot;test  keempat&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-09&quot;,&quot;student_id&quot;:&quot;yGv1dkK8PbM1SiP0CWQPHm1831K2&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;db_key&quot;:&quot;AUTO_Alpha_yGv1dkK8PbM1SiP0CWQPHm1831K2_20260409&quot;}]},&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;:{&quot;student_id&quot;:&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;,&quot;student_name&quot;:&quot;michael septa  wahyu angraini&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:09&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;michael septa  wahyu angraini&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;6MxTl0E3WsM4miTa5i1ISwUmp0t1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_6MxTl0E3WsM4miTa5i1ISwUmp0t1_eBY94&quot;}]},&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;:{&quot;student_id&quot;:&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;,&quot;student_name&quot;:&quot;Ranaima Andara&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:03&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;Ranaima Andara&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;8NFCQIX9B1hxoF0yaFfzAwjKe8J2&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_8NFCQIX9B1hxoF0yaFfzAwjKe8J2_i1TAn&quot;}]},&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;:{&quot;student_id&quot;:&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;,&quot;student_name&quot;:&quot;tomi tomblok&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;tomi tomblok&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;Ev5bOlIsRbOiL3JDiktt2B3App13&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_Ev5bOlIsRbOiL3JDiktt2B3App13_FOlNu&quot;}]},&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;:{&quot;student_id&quot;:&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;,&quot;student_name&quot;:&quot;renaldi&quot;,&quot;total_poin&quot;:20,&quot;kasus_count&quot;:1,&quot;details&quot;:[{&quot;created_at&quot;:&quot;2026-04-03 18:46:10&quot;,&quot;detail&quot;:&quot;Mendapat nilai 0 karena tidak mengerjakan \u0027Input Manual: null (Tugas)\u0027.&quot;,&quot;poin&quot;:20,&quot;student_name&quot;:&quot;renaldi&quot;,&quot;kategori&quot;:&quot;Ringan&quot;,&quot;tgl&quot;:&quot;2026-04-03&quot;,&quot;uid_guru&quot;:&quot;J76i0U5HUBYlrSTGsUtfSmLksgq1&quot;,&quot;kelas&quot;:&quot;9A&quot;,&quot;student_id&quot;:&quot;gH0qvdmgv6dTaPgvskV7sYdlZux1&quot;,&quot;db_key&quot;:&quot;MANUAL_NOL_gH0qvdmgv6dTaPgvskV7sYdlZux1_gPdJE&quot;}]}};
    let donutChartInstance = null;
    let barChartInstance = null;

    // --- SWEETALERT NOTIFICATIONS ---
    
    
    // --- EVENT DELEGATION (Table, Modals &amp; Forms) ---
    document.body.addEventListener(&quot; , &quot;'&quot; , &quot;click&quot; , &quot;'&quot; , &quot;, function(e) {
        
        // Buka Detail Modal
        const btnDetail = e.target.closest(&quot; , &quot;'&quot; , &quot;.btn-show-detail&quot; , &quot;'&quot; , &quot;);
        if (btnDetail) {
            showDetail(btnDetail.dataset.id);
        }

        // Buka Edit Modal (Dihasilkan dinamis di dalam Modal Detail)
        const btnEdit = e.target.closest(&quot; , &quot;'&quot; , &quot;.btn-edit-riwayat&quot; , &quot;'&quot; , &quot;);
        if (btnEdit) {
            const data = JSON.parse(btnEdit.dataset.data);
            openEditModal(data);
        }

        // Tutup Modal Detail
        if (e.target.closest(&quot; , &quot;'&quot; , &quot;#btnCloseDetailModal&quot; , &quot;'&quot; , &quot;) || e.target.closest(&quot; , &quot;'&quot; , &quot;#btnTutupLaporan&quot; , &quot;'&quot; , &quot;)) {
            document.getElementById(&quot; , &quot;'&quot; , &quot;detailModal&quot; , &quot;'&quot; , &quot;).classList.add(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
            document.body.style.overflow = &quot; , &quot;'&quot; , &quot;auto&quot; , &quot;'&quot; , &quot;;
        }

        // Tutup Modal Edit
        if (e.target.closest(&quot; , &quot;'&quot; , &quot;#btnCloseEditModal&quot; , &quot;'&quot; , &quot;)) {
            document.getElementById(&quot; , &quot;'&quot; , &quot;editModal&quot; , &quot;'&quot; , &quot;).classList.add(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
            document.body.style.overflow = &quot; , &quot;'&quot; , &quot;auto&quot; , &quot;'&quot; , &quot;;
        }
    });

    // Menangani form hapus, reset &amp; ubah menggunakan SweetAlert
    document.body.addEventListener(&quot; , &quot;'&quot; , &quot;submit&quot; , &quot;'&quot; , &quot;, function(e) {
        // Reset 1 Siswa (Tabel Utama)
        if (e.target.classList.contains(&quot; , &quot;'&quot; , &quot;form-reset-siswa&quot; , &quot;'&quot; , &quot;)) {
            e.preventDefault();
            Swal.fire({
                title: &quot; , &quot;'&quot; , &quot;Hapus Semua Data?&quot; , &quot;'&quot; , &quot;,
                text: &quot;Seluruh riwayat dan poin siswa ini akan di-reset menjadi 0!&quot;,
                icon: &quot; , &quot;'&quot; , &quot;warning&quot; , &quot;'&quot; , &quot;,
                showCancelButton: true,
                confirmButtonColor: &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;,
                cancelButtonColor: &quot; , &quot;'&quot; , &quot;#9ca3af&quot; , &quot;'&quot; , &quot;,
                confirmButtonText: &quot; , &quot;'&quot; , &quot;Ya, Reset Data!&quot; , &quot;'&quot; , &quot;,
                cancelButtonText: &quot; , &quot;'&quot; , &quot;Batal&quot; , &quot;'&quot; , &quot;,
                customClass: { popup: &quot; , &quot;'&quot; , &quot;rounded-3xl&quot; , &quot;'&quot; , &quot; }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }

        // Hapus Riwayat Spesifik (Dalam Modal Detail)
        if (e.target.classList.contains(&quot; , &quot;'&quot; , &quot;form-delete-riwayat&quot; , &quot;'&quot; , &quot;)) {
            e.preventDefault();
            Swal.fire({
                title: &quot; , &quot;'&quot; , &quot;Hapus Catatan Ini?&quot; , &quot;'&quot; , &quot;,
                text: &quot;Riwayat pelanggaran akan dihapus permanen.&quot;,
                icon: &quot; , &quot;'&quot; , &quot;warning&quot; , &quot;'&quot; , &quot;,
                showCancelButton: true,
                confirmButtonColor: &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;,
                cancelButtonColor: &quot; , &quot;'&quot; , &quot;#9ca3af&quot; , &quot;'&quot; , &quot;,
                confirmButtonText: &quot; , &quot;'&quot; , &quot;Ya, Hapus!&quot; , &quot;'&quot; , &quot;,
                cancelButtonText: &quot; , &quot;'&quot; , &quot;Batal&quot; , &quot;'&quot; , &quot;,
                customClass: { popup: &quot; , &quot;'&quot; , &quot;rounded-3xl&quot; , &quot;'&quot; , &quot; }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }

        // Konfirmasi Form Edit (Dalam Modal Edit)
        if (e.target.classList.contains(&quot; , &quot;'&quot; , &quot;form-edit-riwayat&quot; , &quot;'&quot; , &quot;)) {
            e.preventDefault();
            Swal.fire({
                title: &quot; , &quot;'&quot; , &quot;Simpan Perubahan?&quot; , &quot;'&quot; , &quot;,
                text: &quot;Data poin dan catatan pelanggaran akan diperbarui.&quot;,
                icon: &quot; , &quot;'&quot; , &quot;info&quot; , &quot;'&quot; , &quot;,
                showCancelButton: true,
                confirmButtonColor: &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;,
                cancelButtonColor: &quot; , &quot;'&quot; , &quot;#9ca3af&quot; , &quot;'&quot; , &quot;,
                confirmButtonText: &quot; , &quot;'&quot; , &quot;Ya, Simpan!&quot; , &quot;'&quot; , &quot;,
                cancelButtonText: &quot; , &quot;'&quot; , &quot;Batal&quot; , &quot;'&quot; , &quot;,
                customClass: { popup: &quot; , &quot;'&quot; , &quot;rounded-3xl&quot; , &quot;'&quot; , &quot; }
            }).then((result) => {
                if (result.isConfirmed) e.target.submit();
            });
        }
    });

    // --- FITUR FILTER KELAS ---
    const filterKelas = document.getElementById(&quot; , &quot;'&quot; , &quot;filterKelas&quot; , &quot;'&quot; , &quot;);
    if (filterKelas) {
        filterKelas.addEventListener(&quot; , &quot;'&quot; , &quot;change&quot; , &quot;'&quot; , &quot;, function() {
            document.getElementById(&quot; , &quot;'&quot; , &quot;filterFormPelanggaran&quot; , &quot;'&quot; , &quot;).submit();
        });
    }

    // --- FITUR LIVE SEARCH (Debounce Optimization) ---
    const searchInput = document.getElementById(&quot; , &quot;'&quot; , &quot;violationSearch&quot; , &quot;'&quot; , &quot;);
    if (searchInput) {
        let debounceTimer;
        const rows = document.querySelectorAll(&quot;.violation-row&quot;);
        searchInput.addEventListener(&quot; , &quot;'&quot; , &quot;input&quot; , &quot;'&quot; , &quot;, function(e) {
            clearTimeout(debounceTimer);
            debounceTimer = setTimeout(() => {
                const filter = e.target.value.toUpperCase();
                rows.forEach(tr => {
                    const name = tr.dataset.name || &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;;
                    tr.style.display = name.includes(filter) ? &quot;&quot; : &quot;none&quot;;
                });
            }, 250); 
        });
    }

    // --- FUNGSI TAMPILKAN DETAIL MODAL ---
    function showDetail(sId) {
        const student = summaryData[sId];
        document.getElementById(&quot; , &quot;'&quot; , &quot;modalTitle&quot; , &quot;'&quot; , &quot;).innerText = student.student_name;
        document.getElementById(&quot; , &quot;'&quot; , &quot;modalSubTitle&quot; , &quot;'&quot; , &quot;).innerText = student.kasus_count + &quot; Total Catatan&quot;;
        
        let html = &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;;
        student.details.forEach(v => {
            const isAuto = (v.detail || &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;).toLowerCase().includes(&quot; , &quot;'&quot; , &quot;otomatis&quot; , &quot;'&quot; , &quot;);
            const dataString = JSON.stringify(v).replace(/&quot;/g, &quot; , &quot;'&quot; , &quot;&amp;quot;&quot; , &quot;'&quot; , &quot;);
            const isMinus = parseInt(v.poin) &lt; 0;
            
            let badgeClass = isMinus ? &quot; , &quot;'&quot; , &quot;bg-emerald-500 text-white&quot; , &quot;'&quot; , &quot; : (isAuto ? &quot; , &quot;'&quot; , &quot;bg-amber-500 text-white&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;bg-red-600 text-white&quot; , &quot;'&quot; , &quot;);
            let borderClass = isMinus ? &quot; , &quot;'&quot; , &quot;border-emerald-100 bg-emerald-50/30&quot; , &quot;'&quot; , &quot; : (isAuto ? &quot; , &quot;'&quot; , &quot;bg-amber-50/50 border-amber-100&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;bg-gray-50 border-gray-100&quot; , &quot;'&quot; , &quot;);

            html += `
                &lt;div class=&quot;p-5 ${borderClass} border-2 rounded-[1.5rem] transition-all relative overflow-hidden mb-4&quot;>
                    ${isMinus ? &quot; , &quot;'&quot; , &quot;&lt;i class=&quot;fa-solid fa-medal absolute -right-4 -bottom-4 text-6xl text-emerald-100 opacity-50 rotate-12 pointer-events-none&quot;>&lt;/i>&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;}
                    &lt;div class=&quot;flex justify-between items-center mb-3 relative z-10&quot;>
                        &lt;span class=&quot;text-[9px] font-black px-3 py-1 rounded-full ${badgeClass} uppercase tracking-widest&quot;>${v.kategori}&lt;/span>
                        &lt;span class=&quot;text-[10px] font-black text-gray-400 italic&quot;>${v.tgl}&lt;/span>
                    &lt;/div>
                    &lt;p class=&quot;text-[11px] font-bold text-slate-700 leading-relaxed mb-3 relative z-10&quot;>${v.detail}&lt;/p>
                    &lt;div class=&quot;flex justify-between items-center border-t ${isMinus ? &quot; , &quot;'&quot; , &quot;border-emerald-200&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;border-dashed border-gray-200&quot; , &quot;'&quot; , &quot;} pt-3 relative z-10&quot;>
                        &lt;span class=&quot;text-[12px] font-black ${isMinus ? &quot; , &quot;'&quot; , &quot;text-emerald-600&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;text-slate-900&quot; , &quot;'&quot; , &quot;} uppercase&quot;>
                            ${parseInt(v.poin) > 0 ? &quot; , &quot;'&quot; , &quot;+&quot; , &quot;'&quot; , &quot; : &quot; , &quot;'&quot; , &quot;&quot; , &quot;'&quot; , &quot;}${v.poin} Poin
                        &lt;/span>
                        &lt;div class=&quot;flex items-center gap-2&quot;>
                            &lt;button type=&quot;button&quot; data-data=&quot;${dataString}&quot; class=&quot;btn-edit-riwayat text-blue-500 hover:text-blue-700 text-xs p-2&quot;>
                                &lt;i class=&quot;fa-solid fa-pen-to-square pointer-events-none&quot;>&lt;/i>
                            &lt;/button>
                            &lt;form action=&quot;https://sipemkas.my.id/guru/pelanggaran/hapus/${v.kelas}/${v.db_key}&quot; method=&quot;POST&quot; class=&quot;inline form-delete-riwayat&quot;>
                                &lt;input type=&quot;hidden&quot; name=&quot;_token&quot; value=&quot;2nmvaOdti3XiJ0SP9O5tFY8Jvyn8L1eo7cGuJvfZ&quot; autocomplete=&quot;off&quot;> &lt;input type=&quot;hidden&quot; name=&quot;_method&quot; value=&quot;DELETE&quot;>                                &lt;button type=&quot;submit&quot; class=&quot;text-red-500 hover:text-red-700 text-xs p-2&quot;>
                                    &lt;i class=&quot;fa-solid fa-trash-can pointer-events-none&quot;>&lt;/i>
                                &lt;/button>
                            &lt;/form>
                        &lt;/div>
                    &lt;/div>
                &lt;/div>`;
        });
        document.getElementById(&quot; , &quot;'&quot; , &quot;modalBody&quot; , &quot;'&quot; , &quot;).innerHTML = html;
        document.getElementById(&quot; , &quot;'&quot; , &quot;detailModal&quot; , &quot;'&quot; , &quot;).classList.remove(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
        document.body.style.overflow = &quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;;
    }

    // --- FUNGSI BUKA MODAL EDIT ---
    function openEditModal(data) {
        document.getElementById(&quot; , &quot;'&quot; , &quot;detailModal&quot; , &quot;'&quot; , &quot;).classList.add(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
        
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_kategori&quot; , &quot;'&quot; , &quot;).value = data.kategori;
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_tanggal&quot; , &quot;'&quot; , &quot;).value = data.tgl;
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_poin&quot; , &quot;'&quot; , &quot;).value = data.poin;
        document.getElementById(&quot; , &quot;'&quot; , &quot;edit_detail&quot; , &quot;'&quot; , &quot;).value = data.detail;

        document.getElementById(&quot; , &quot;'&quot; , &quot;editForm&quot; , &quot;'&quot; , &quot;).action = &quot;https://sipemkas.my.id/guru/pelanggaran/update/&quot; + data.db_key;
        document.getElementById(&quot; , &quot;'&quot; , &quot;editModal&quot; , &quot;'&quot; , &quot;).classList.remove(&quot; , &quot;'&quot; , &quot;hidden&quot; , &quot;'&quot; , &quot;);
    }

    // --- FUNGSI CHART ---
    function initCharts() {
        if (typeof Chart === &quot; , &quot;'&quot; , &quot;undefined&quot; , &quot;'&quot; , &quot;) {
            setTimeout(initCharts, 50); 
            return;
        }

        const ringan = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == &quot; , &quot;'&quot; , &quot;Ringan&quot; , &quot;'&quot; , &quot;).length, 0);
        const sedang = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == &quot; , &quot;'&quot; , &quot;Sedang&quot; , &quot;'&quot; , &quot;).length, 0);
        const berat = Object.values(summaryData).reduce((acc, s) => acc + s.details.filter(d => d.kategori == &quot; , &quot;'&quot; , &quot;Berat&quot; , &quot;'&quot; , &quot;).length, 0);

        const ctxDonut = document.getElementById(&quot; , &quot;'&quot; , &quot;violationDonutChart&quot; , &quot;'&quot; , &quot;);
        if (ctxDonut) {
            if (donutChartInstance) donutChartInstance.destroy(); 
            donutChartInstance = new Chart(ctxDonut.getContext(&quot; , &quot;'&quot; , &quot;2d&quot; , &quot;'&quot; , &quot;), {
                type: &quot; , &quot;'&quot; , &quot;doughnut&quot; , &quot;'&quot; , &quot;,
                data: {
                    labels: [&quot; , &quot;'&quot; , &quot;Ringan&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;Sedang&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;Berat&quot; , &quot;'&quot; , &quot;],
                    datasets: [{
                        data: [ringan, sedang, berat],
                        backgroundColor: [&quot; , &quot;'&quot; , &quot;#f59e0b&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;#ef4444&quot; , &quot;'&quot; , &quot;, &quot; , &quot;'&quot; , &quot;#b91c1c&quot; , &quot;'&quot; , &quot;],
                        borderWidth: 0,
                        cutout: &quot; , &quot;'&quot; , &quot;80%&quot; , &quot;'&quot; , &quot;
                    }]
                },
                options: { maintainAspectRatio: false, plugins: { legend: { position: &quot; , &quot;'&quot; , &quot;bottom&quot; , &quot;'&quot; , &quot;, labels: { usePointStyle: true, font: { size: 9, weight: &quot; , &quot;'&quot; , &quot;bold&quot; , &quot;'&quot; , &quot; } } } } }
            });
        }

        const ctxBar = document.getElementById(&quot; , &quot;'&quot; , &quot;violationBarChart&quot; , &quot;'&quot; , &quot;);
        if (ctxBar) {
            if (barChartInstance) barChartInstance.destroy(); 
            barChartInstance = new Chart(ctxBar.getContext(&quot; , &quot;'&quot; , &quot;2d&quot; , &quot;'&quot; , &quot;), {
                type: &quot; , &quot;'&quot; , &quot;bar&quot; , &quot;'&quot; , &quot;,
                data: {
                    labels: Object.values(summaryData).slice(0, 5).map(s => s.student_name.split(&quot; , &quot;'&quot; , &quot; &quot; , &quot;'&quot; , &quot;)[0]),
                    datasets: [{
                        label: &quot; , &quot;'&quot; , &quot;Total Poin&quot; , &quot;'&quot; , &quot;,
                        data: Object.values(summaryData).slice(0, 5).map(s => s.total_poin),
                        backgroundColor: &quot; , &quot;'&quot; , &quot;#1D4ED8&quot; , &quot;'&quot; , &quot;,
                        borderRadius: 10
                    }]
                },
                options: { maintainAspectRatio: false, scales: { y: { beginAtZero: true, grid: { display: false } }, x: { grid: { display: false } } }, plugins: { legend: { display: false } } }
            });
        }
    }

    initCharts();
});

            
        &quot;))]</value>
      <webElementGuid>0293dfaa-f1fd-4e46-a473-750541ca7bbd</webElementGuid>
   </webElementXpaths>
</WebElementEntity>
