feat: add anggota and bantuan buttons to miskin popup on map

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>

resources/views/map.blade.php

@@ -475,6 +475,42 @@
         </div>
     </dialog>
 
+    <!-- Modal Anggota (dari popup peta) -->
+    <dialog id="mapmodal_anggota" class="modal">
+        <div class="modal-box w-11/12 max-w-2xl">
+            <h3 class="font-bold text-lg mb-1 flex items-center gap-2"><i class="fa-solid fa-users text-info"></i> Anggota Keluarga</h3>
+            <p id="map_anggota_label" class="text-xs opacity-50 mb-4">-</p>
+            <div class="overflow-x-auto">
+                <table class="table table-sm w-full">
+                    <thead><tr class="text-xs uppercase opacity-50"><th>Nama</th><th>Hubungan</th><th>Umur</th><th>Pendidikan</th><th>Status</th></tr></thead>
+                    <tbody id="map_bodyAnggota"><tr><td colspan="5" class="text-center py-4 opacity-30 italic">Memuat...</td></tr></tbody>
+                </table>
+            </div>
+            <div class="modal-action">
+                <button onclick="document.getElementById('mapmodal_anggota').close()" class="btn btn-ghost">Tutup</button>
+            </div>
+        </div>
+        <form method="dialog" class="modal-backdrop"><button>close</button></form>
+    </dialog>
+
+    <!-- Modal Bantuan (dari popup peta) -->
+    <dialog id="mapmodal_bantuan" class="modal">
+        <div class="modal-box w-11/12 max-w-2xl">
+            <h3 class="font-bold text-lg mb-1 flex items-center gap-2"><i class="fa-solid fa-hand-holding-heart text-success"></i> Riwayat Bantuan</h3>
+            <p id="map_bantuan_label" class="text-xs opacity-50 mb-4">-</p>
+            <div class="overflow-x-auto">
+                <table class="table table-sm w-full">
+                    <thead><tr class="text-xs uppercase opacity-50"><th>Tanggal</th><th>Jenis</th><th>Dari Ibadah</th><th>Dicatat oleh</th></tr></thead>
+                    <tbody id="map_bodyBantuan"><tr><td colspan="4" class="text-center py-4 opacity-30 italic">Memuat...</td></tr></tbody>
+                </table>
+            </div>
+            <div class="modal-action">
+                <button onclick="document.getElementById('mapmodal_bantuan').close()" class="btn btn-ghost">Tutup</button>
+            </div>
+        </div>
+        <form method="dialog" class="modal-backdrop"><button>close</button></form>
+    </dialog>
+
     <!-- Toast Container -->
     <div class="toast toast-end toast-bottom z-[9999]" id="toastBox"></div>
 
@@ -837,7 +873,9 @@
                     <div><strong>KK/Jiwa:</strong><br>${item.jumlah_kk}/${item.jumlah_orang}</div>
                     <div><strong>Kondisi:</strong><br><span class="capitalize">${item.kondisi_rumah || '-'}</span></div>
                 </div>
-                <div class="flex gap-1 border-t pt-2 mt-1">
+                <div class="flex gap-1 border-t pt-2 mt-1 flex-wrap">
+                    <button class="btn btn-xs btn-info btn-outline" onclick="openMapAnggotaModal('${item.id_rumah}')"><i class="fa-solid fa-users mr-1"></i>Anggota</button>
+                    <button class="btn btn-xs btn-success btn-outline" onclick="openMapBantuanModal('${item.id_rumah}')"><i class="fa-solid fa-hand-holding-heart mr-1"></i>Bantuan</button>
                     ${canEditMiskin ? `<button class="btn btn-xs btn-warning btn-outline" onclick="openEditMiskinById('${item.id_rumah}')"><i class="fa-solid fa-pen mr-1"></i>Edit</button>` : ''}
                     ${canEditMiskin ? `<button class="btn btn-xs btn-error btn-outline" onclick="prepDelete('miskin', '${item.id_rumah}')">Hapus</button>` : ''}
                 </div>
@@ -1054,6 +1092,40 @@
             }
         }
 
+        // ── ANGGOTA & BANTUAN dari popup peta ──────────────────────────────────
+        async function openMapAnggotaModal(idRumah) {
+            const item = miskinData?.find(m => m.id_rumah === idRumah);
+            document.getElementById('map_anggota_label').textContent = `ID: ${idRumah} — ${item?.nama_kk || '-'}`;
+            document.getElementById('mapmodal_anggota').showModal();
+            const res = await fetch(`{{ url('/api/miskin') }}/${encodeURIComponent(idRumah)}/anggota`, { headers: { 'X-CSRF-TOKEN': csrfToken } });
+            const list = await res.json();
+            document.getElementById('map_bodyAnggota').innerHTML = list.length ? list.map(a => `
+                <tr>
+                    <td class="font-semibold">${esc(a.nama)}</td>
+                    <td class="capitalize text-xs">${esc(a.hubungan.replace(/_/g, ' '))}</td>
+                    <td class="text-xs">${a.umur !== null ? esc(String(a.umur)) + ' th' : '-'}</td>
+                    <td class="capitalize text-xs">${a.pendidikan ? esc(a.pendidikan.replace(/_/g, ' ')) : '-'}</td>
+                    <td><span class="badge badge-xs ${a.status_hidup === 'hidup' ? 'badge-success' : 'badge-error'}">${esc(a.status_hidup)}</span></td>
+                </tr>`).join('')
+                : '<tr><td colspan="5" class="text-center py-4 opacity-30 italic">Belum ada anggota</td></tr>';
+        }
+
+        async function openMapBantuanModal(idRumah) {
+            const item = miskinData?.find(m => m.id_rumah === idRumah);
+            document.getElementById('map_bantuan_label').textContent = `ID: ${idRumah} — ${item?.nama_kk || '-'}`;
+            document.getElementById('mapmodal_bantuan').showModal();
+            const res = await fetch(`{{ url('/api/miskin') }}/${encodeURIComponent(idRumah)}/bantuan`, { headers: { 'X-CSRF-TOKEN': csrfToken } });
+            const list = await res.json();
+            document.getElementById('map_bodyBantuan').innerHTML = list.length ? list.map(b => `
+                <tr>
+                    <td class="text-xs whitespace-nowrap">${esc(b.tanggal_bantuan)}</td>
+                    <td class="font-semibold text-sm">${esc(b.jenis_bantuan)}</td>
+                    <td class="text-xs">${esc(b.ibadah_nama || '-')}</td>
+                    <td class="text-xs">${esc(b.pencatat_nama)}</td>
+                </tr>`).join('')
+                : '<tr><td colspan="4" class="text-center py-4 opacity-30 italic">Belum ada riwayat bantuan</td></tr>';
+        }
+
         // ── NOTIFIKASI PERUBAHAN DATA ────────────────────────────────────────
         (function initNotifPolling() {
             const POLL_MS    = 30000;