feat(MasterSubKategoriSampah): add ketegori & jenis on table. Add Field kategori on modal

Controllers/Master/SubKategoriSampahController.cs

@@ -16,7 +16,7 @@ namespace BankSampahApp.Controllers.Master
             var data = new[]
             {
                 new {
-                    nama = "Duplek",
+                    nama = "Kertas",
                     kategori_sampah = "Kertas",
                     jenis_sampah = "Anorganik",
                     aksi = "<div class=\"flex gap-2\">" +
@@ -26,7 +26,7 @@ namespace BankSampahApp.Controllers.Master
                 },
                 new {
                     nama = "Kardus",
-                    kategori_sampah = "Kertas",
+                    kategori_sampah = "Kardus",
                     jenis_sampah = "Anorganik",
                     aksi = "<div class=\"flex gap-2\">" +
                         "<a href=\"#\" class=\"btn btn-circle btn-warning text-white btn-sm\"><i class=\"ph ph-note-pencil\"></i></a>" +
@@ -34,8 +34,8 @@ namespace BankSampahApp.Controllers.Master
                         "</div>",
                 },
                 new {
-                    nama = "Kertas HVS/Putihan",
+                    nama = "Plastik",
-                    kategori_sampah = "Kertas",
+                    kategori_sampah = "Plastik",
                     jenis_sampah = "Anorganik",
                     aksi = "<div class=\"flex gap-2\">" +
                         "<a href=\"#\" class=\"btn btn-circle btn-warning text-white btn-sm\"><i class=\"ph ph-note-pencil\"></i></a>" +
@@ -43,8 +43,8 @@ namespace BankSampahApp.Controllers.Master
                         "</div>",
                 },
                 new {
-                    nama = "Buku",
+                    nama = "Lain-lain",
-                    kategori_sampah = "Kertas",
+                    kategori_sampah = "Lain-lain",
                     jenis_sampah = "Anorganik",
                     aksi = "<div class=\"flex gap-2\">" +
                         "<a href=\"#\" class=\"btn btn-circle btn-warning text-white btn-sm\"><i class=\"ph ph-note-pencil\"></i></a>" +
@@ -52,9 +52,18 @@ namespace BankSampahApp.Controllers.Master
                         "</div>",
                 },
                 new {
-                    nama = "Majalah",
+                    nama = "Sisa Makanan",
-                    kategori_sampah = "Kertas",
+                    kategori_sampah = "Sisa Makanan",
-                    jenis_sampah = "Anorganik",
+                    jenis_sampah = "Organik",
+                    aksi = "<div class=\"flex gap-2\">" +
+                        "<a href=\"#\" class=\"btn btn-circle btn-warning text-white btn-sm\"><i class=\"ph ph-note-pencil\"></i></a>" +
+                        "<a href=\"#\" class=\"btn btn-circle btn-error delete text-white btn-sm\"><i class=\"ph ph-trash\"></i></a>" +
+                        "</div>",
+                },
+                new {
+                    nama = "Baterai Bekas",
+                    kategori_sampah = "Baterai Bekas",
+                    jenis_sampah = "B3 Sampah Rumah Tangga",
                     aksi = "<div class=\"flex gap-2\">" +
                         "<a href=\"#\" class=\"btn btn-circle btn-warning text-white btn-sm\"><i class=\"ph ph-note-pencil\"></i></a>" +
                         "<a href=\"#\" class=\"btn btn-circle btn-error delete text-white btn-sm\"><i class=\"ph ph-trash\"></i></a>" +

Views/Master/SubKategoriSampah/Index.cshtml

@@ -10,7 +10,7 @@
     </div>
 
     <div class="flex flex-col gap-2 md:flex-row">
-        <button class="btn btn-sm bg-green-800 max-w-full rounded-full text-white hover:bg-green-900" onclick="modal_tambah.showModal()">
+        <button class="btn btn-sm bg-green-800 max-w-full rounded-full text-white hover:bg-green-900" onclick="openModal()">
             <i class="ph ph-plus"></i>
             Tambah Sub Kategori Sampah
         </button>
@@ -24,6 +24,19 @@
         <form id="formTambah" onsubmit="submitForm(event)">
             <input type="hidden" id="edit_mode" value="false">
             <div class="flex flex-col gap-6">
+                <!-- Kategori Sampah -->
+                <div class="flex flex-col">
+                    <fieldset class="fieldset">
+                        <legend class="fieldset-legend">
+                            Kategori Sampah
+                            <span class="text-red-500">*</span>
+                        </legend>
+                        <select id="kategori_sampah" class="select w-full" required>
+                            <option value="" disabled selected>Pilih Kategori Sampah</option>
+                        </select>
+                    </fieldset>
+                </div>
+
                 <!-- Field Nama -->
                 <div class="flex flex-col">
                     <fieldset class="fieldset">
@@ -62,7 +75,9 @@
                 <thead>
                     <tr>
                         <th class="w-[5%]">No</th>
-                        <th class="w-[85%]">Nama Sub Kategori Sampah</th>
+                        <th class="w-[30%]">Nama Sub Kategori Sampah</th>
+                        <th class="w-[30%]">Kategori</th>
+                        <th class="w-[25%]">Jenis</th>
                         <th class="w-[10%]">Aksi</th>
                     </tr>
                 </thead>
@@ -88,6 +103,8 @@
             columns: [
                 { data: null, render: (d, t, r, m) => m.row + 1, orderable: false, searchable: false },
                 { data: 'nama' },
+                { data: 'kategori_sampah' },
+                { data: 'jenis_sampah' },
                 { data: 'aksi' },
             ]
         });
@@ -147,6 +164,36 @@
         });
     });
 
+    function openModal() {
+        modal_tambah.showModal();
+
+        // load dropdown setiap modal dibuka
+        loadKategoriSampah();
+    }
+
+    function loadKategoriSampah() {
+        $.ajax({
+            url: '/Master/KategoriSampah/table',   // Ganti sesuai endpoint kamu
+            method: 'GET',
+            dataType: 'json',
+            success: function (response) {    
+                 // Buat HTML option dengan map
+                let options = response.data
+                    .map(item => `<option value="${item.nama}">${item.nama}</option>`)
+                    .join("");
+
+                // Masukkan ke dropdown
+                $("#kategori_sampah").html(`
+                    <option value="" disabled selected>Pilih Jenis Sampah</option>
+                    ${options}
+                `);
+            },
+            error: function () {
+                console.error('Gagal memuat data jenis sampah.');
+            }
+        });
+    }
+
     function closeModal() {
         // Reset form
         $('#formTambah')[0].reset();
@@ -155,6 +202,7 @@
 
         // Close modal
         modal_tambah.close();
+        loadKategoriSampah();
     }
 
     function submitForm(e) {