feat: add field and data

Controllers/DataRwController.cs

@@ -13,27 +13,42 @@ namespace BpsRwApp.Controllers
         [HttpGet]
         public IActionResult Table()
         {
-            var data = Enumerable.Range(1, 50)
+                            var data = Enumerable.Range(1, 50)
                 .Select(index =>
                 {
                     var wilayah = ControllerSampleData.WilayahSeeds[(index - 1) % ControllerSampleData.WilayahSeeds.Length];
-                    var jumlahRumahMemilah = 520 + (index * 11 % 260);
+                    var namaPendamping = ControllerSampleData.PersonNames[(index - 1) % ControllerSampleData.PersonNames.Length];
-                    var jumlahRumahNasabah = jumlahRumahMemilah + 40 + (index % 7) * 6;
-                    var jumlahBankSampah = 40 + (index * 3 % 90);
                     var rw = index.ToString("D3");
-                    var kecamatan = $"{wilayah.Kecamatan}, {wilayah.Kota}";
+                    var kota = wilayah.Kota;
+                    var checklist = 20 + (index * 7 % 80);
+                    var jumlahFoto = 5;
+                    var jumlahRumah = 500 + (index * 13 % 500);
+                    var jumlahRumahMemilah = jumlahRumah - (50 + index % 30);
+                    var presentaseRumahMemilah = Math.Round((double)jumlahRumahMemilah / jumlahRumah * 100);
+                    var jumlahRumahNasabah = jumlahRumahMemilah - (10 + index % 20);
+                    var jumlahBankSampah = jumlahRumahMemilah - (10 + index % 20);
 
                     return new
                     {
                         rw,
-                        kecamatan,
+                        kota,
+                        nama_pendamping = namaPendamping,
+                        checklist,
+                        jumlah_foto = jumlahFoto,
+                        jumlah_rumah = jumlahRumah,
                         jumlah_rumah_memilah = jumlahRumahMemilah,
+                        presentase_rumah_memilah = $"{presentaseRumahMemilah}%",
                         jumlah_rumah_nasabah = jumlahRumahNasabah,
                         jumlah_bank_sampah = jumlahBankSampah,
                         aksi = BuildActionButton(
                             rw,
-                            kecamatan,
+                            kota,
+                            namaPendamping,
+                            checklist,
+                            jumlahFoto,
+                            jumlahRumah,
                             jumlahRumahMemilah,
+                            presentaseRumahMemilah,
                             jumlahRumahNasabah,
                             jumlahBankSampah)
                     };
@@ -49,17 +64,32 @@ namespace BpsRwApp.Controllers
 
             static string BuildActionButton(
                 string rw,
-                string kecamatan,
+                string kota,
+                string namaPendamping,
+                int checklist,
+                int jumlahFoto,
+                int jumlahRumah,
                 int jumlahRumahMemilah,
+                double presentaseRumahMemilih,
                 int jumlahRumahNasabah,
                 int jumlahBankSampah)
             {
                 return "<div class=\"flex gap-2\">" +
-                    $"<button type=\"button\" class=\"btn bg-white rounded-full btn-xs btn-view-detail\" data-rw=\"{rw}\" data-kecamatan=\"{kecamatan}\" data-jumlah-rumah-memilah=\"{jumlahRumahMemilah}\" data-jumlah-rumah-nasabah=\"{jumlahRumahNasabah}\" data-jumlah-bank-sampah=\"{jumlahBankSampah}\">" +
+                    $"<button type=\"button\" class=\"btn bg-white rounded-full btn-xs btn-view-detail\" " +
+                    $"data-rw=\"{rw}\" " +
+                    $"data-kota=\"{kota}\" " +
+                    $"data-nama-pendamping=\"{namaPendamping}\" " +
+                    $"data-checklist=\"{checklist}\" " +
+                    $"data-jumlah-foto=\"{jumlahFoto}\" " +
+                    $"data-jumlah-rumah=\"{jumlahRumah}\" " +
+                    $"data-jumlah-rumah-memilah=\"{jumlahRumahMemilah}\" " +
+                    $"data-presentase-rumah-memilah=\"{presentaseRumahMemilih}\" " +
+                    $"data-jumlah-rumah-nasabah=\"{jumlahRumahNasabah}\" " +
+                    $"data-jumlah-bank-sampah=\"{jumlahBankSampah}\">" +
                     "Detail" +
                     "</button>" +
                     "</div>";
             }
         }
     }
-}
+}

Views/DataRw/Index.cshtml

@@ -84,10 +84,18 @@
                 <span class="text-gray-500">Jumlah KK</span>
                 <span class="font-semibold">341</span>
             </div>
+            <div class="flex flex-col">
+                <span class="text-gray-500">Jumlah Rumah</span>
+                <span class="font-semibold" id="detail-jumlah-rumah">-</span>
+            </div>
             <div class="flex flex-col">
                 <span class="text-gray-500">Jumlah Rumah Memilah</span>
                 <span class="font-semibold" id="detail-jumlah-rumah-memilah">-</span>
             </div>
+            <div class="flex flex-col">
+                <span class="text-gray-500">Presentase Rumah Memilah</span>
+                <span class="font-semibold" id="detail-presentase-rumah-memilah">-</span>
+            </div>
             <div class="flex flex-col">
                 <span class="text-gray-500">Jumlah Rumah Nasabah</span>
                 <span class="font-semibold" id="detail-jumlah-rumah-nasabah">-</span>
@@ -114,11 +122,19 @@
             </div>
             <div class="flex flex-col">
                 <span class="text-gray-500">Kota / Kabupaten</span>
-                <span class="font-semibold">Kota Adm. Jakarta Barat</span>
+                <span class="font-semibold" id="detail-kota">-</span>
             </div>
             <div class="flex flex-col">
-                <span class="text-gray-500">Kecamatan</span>
+                <span class="text-gray-500">Nama Pendamping</span>
-                <span class="font-semibold" id="detail-kecamatan">-</span>
+                <span class="font-semibold" id="detail-nama-pendamping">-</span>
+            </div>
+            <div class="flex flex-col">
+                <span class="text-gray-500">Checklist</span>
+                <span class="font-semibold" id="detail-checklist">-</span>
+            </div>
+            <div class="flex flex-col">
+                <span class="text-gray-500">Jumlah Foto</span>
+                <span class="font-semibold" id="detail-jumlah-foto">-</span>
             </div>
             <div class="grid grid-cols-1 md:grid-cols-2 md:gap-2">
                 <div class="flex flex-col">
@@ -158,12 +174,17 @@
         <table class="table-zebra table" id="example">
             <thead>
                 <tr>
-                    <th class="w-[5%]">No</th>
+                    <th class="w-[3%]">No</th>
                     <th class="w-[5%]">RW</th>
-                    <th class="w-[40%]">Kota</th>
+                    <th class="w-[12%]">Kota</th>
-                    <th class="w-[15%]">Jumlah Rumah Memilah</th>
+                    <th class="w-[15%]">Nama Pendamping</th>
-                    <th class="w-[15%]">Jumlah Rumah Nasabah</th>
+                    <th class="w-[8%]">Checklist</th>
-                    <th class="w-[15%]">Jumlah Bank Sampah</th>
+                    <th class="w-[8%]">Jumlah Foto</th>
+                    <th class="w-[10%]">Jumlah Rumah</th>
+                    <th class="w-[10%]">Jumlah Rumah Memilah</th>
+                    <th class="w-[12%]">Presentase Rumah Memilah</th>
+                    <th class="w-[10%]">Jumlah Rumah Nasabah</th>
+                    <th class="w-[10%]">Jumlah Bank Sampah</th>
                     <th class="w-[5%]">Aksi</th>
                 </tr>
             </thead>
@@ -196,8 +217,13 @@
         const detailModal = document.getElementById('rw-detail-modal');
         const detailElements = {
             rw: document.getElementById('detail-rw'),
-            kecamatan: document.getElementById('detail-kecamatan'),
+            kota: document.getElementById('detail-kota'),
+            namaPendamping: document.getElementById('detail-nama-pendamping'),
+            checklist: document.getElementById('detail-checklist'),
+            jumlahFoto: document.getElementById('detail-jumlah-foto'),
+            jumlahRumah: document.getElementById('detail-jumlah-rumah'),
             rumahMemilah: document.getElementById('detail-jumlah-rumah-memilah'),
+            presentaseRumahMemilah: document.getElementById('detail-presentase-rumah-memilah'),
             rumahNasabah: document.getElementById('detail-jumlah-rumah-nasabah'),
             bankSampah: document.getElementById('detail-jumlah-bank-sampah')
         };
@@ -212,8 +238,13 @@
             columns: [
                 { data: null, render: (d, t, r, m) => m.row + 1, orderable: false, searchable: false },
                 { data: 'rw' },
-                { data: 'kecamatan' },
+                { data: 'kota' },
+                { data: 'nama_pendamping' },
+                { data: 'checklist' },
+                { data: 'jumlah_foto' },
+                { data: 'jumlah_rumah' },
                 { data: 'jumlah_rumah_memilah' },
+                { data: 'presentase_rumah_memilah' },
                 { data: 'jumlah_rumah_nasabah' },
                 { data: 'jumlah_bank_sampah' },
                 { data: 'aksi' },
@@ -229,8 +260,13 @@
 
             const dataset = this.dataset;
             detailElements.rw.textContent = dataset.rw || '-';
-            detailElements.kecamatan.textContent = dataset.kecamatan || '-';
+            detailElements.kota.textContent = dataset.kota || '-';
+            detailElements.namaPendamping.textContent = dataset.namaPendamping || '-';
+            detailElements.checklist.textContent = dataset.checklist || '-';
+            detailElements.jumlahFoto.textContent = dataset.jumlahFoto || '-';
+            detailElements.jumlahRumah.textContent = dataset.jumlahRumah || '-';
             detailElements.rumahMemilah.textContent = dataset.jumlahRumahMemilah || '-';
+            detailElements.presentaseRumahMemilah.textContent = dataset.presentaseRumahMemilah + '%' || '-';
             detailElements.rumahNasabah.textContent = dataset.jumlahRumahNasabah || '-';
             detailElements.bankSampah.textContent = dataset.jumlahBankSampah || '-';