feat : fix fetch bug
This commit is contained in:
unknown
+7
-36
@@ -62,27 +62,18 @@
|
||||
<div id="status_message_container" class="p-8 text-center text-sm text-gray-500 hidden"></div>
|
||||
|
||||
<div class="divide-y divide-gray-100" id="wadah_list_antrean">
|
||||
</div>
|
||||
</div>
|
||||
</section>
|
||||
|
||||
</main>
|
||||
|
||||
<script>
|
||||
// Mengambil token autentikasi petugas untuk validasi sesi REST API
|
||||
const token_petugas = localStorage.getItem('token_petugas');
|
||||
|
||||
// Fungsi pengecekan proteksi halaman (RBAC) saat pertama kali dimuat
|
||||
function periksa_sesi_petugas() {
|
||||
/* Sesi dummy dinonaktifkan sementara untuk mempermudah pengujian UAS.
|
||||
Jika nanti sistem login admin/petugas Anda sudah aktif menggunakan JWT,
|
||||
cukup hapus baris komentar pada blok proteksi di bawah ini. */
|
||||
// if (!token_petugas) {
|
||||
// alert('Akses ditolak. Silakan login terlebih dahulu.');
|
||||
// window.location.href = 'petugas_login.html';
|
||||
// }
|
||||
// Sesi dinonaktifkan sementara untuk mempermudah testing
|
||||
}
|
||||
|
||||
// Fungsi merender list data antrean warga ke elemen DOM secara aman (XSS Prevention)
|
||||
function render_data_ke_tabel(daftar_warga) {
|
||||
const wadah_list = document.getElementById('wadah_list_antrean');
|
||||
const label_antrean = document.getElementById('label_jumlah_antrean');
|
||||
@@ -96,7 +87,6 @@
|
||||
|
||||
label_antrean.textContent = `${daftar_warga.length} Rumah Tangga`;
|
||||
|
||||
// Variabel counter untuk menghitung jumlah status agregat data
|
||||
let total_pending = 0;
|
||||
let total_verified = 0;
|
||||
|
||||
@@ -107,9 +97,6 @@
|
||||
const item_div = document.createElement('div');
|
||||
item_div.className = 'p-4 flex justify-between items-center hover:bg-gray-50 transition-colors';
|
||||
|
||||
/* Baris Kompleks: Pembuatan elemen daftar dilakukan dengan kombinasi literal template Tailwind CSS.
|
||||
Setiap teks string mentah yang berasal dari properti database dilewatkan melalui properti textContent
|
||||
pada sub-elemen internal terpisah guna menangkal celah keamanan injeksi skrip berbahaya (Cross-Site Scripting). */
|
||||
item_div.innerHTML = `
|
||||
<div class="space-y-1">
|
||||
<h4 class="font-bold text-gray-800 text-sm kelas-nama"></h4>
|
||||
@@ -123,14 +110,12 @@
|
||||
</div>
|
||||
`;
|
||||
|
||||
// Menyuntikkan nilai data secara aman menggunakan textContent
|
||||
item_div.querySelector('.kelas-nama').textContent = warga.nama_kk;
|
||||
item_div.querySelector('.kelas-nik').textContent = warga.nik;
|
||||
|
||||
const badge = item_div.querySelector('.kelas-badge');
|
||||
badge.textContent = warga.status_validasi;
|
||||
|
||||
// Menentukan warna badge visual berdasarkan status validasi dari database
|
||||
if (warga.status_validasi.toLowerCase() === 'verified') {
|
||||
badge.className += ' bg-emerald-50 text-emerald-700';
|
||||
} else if (warga.status_validasi.toLowerCase() === 'rejected') {
|
||||
@@ -142,13 +127,11 @@
|
||||
wadah_list.appendChild(item_div);
|
||||
});
|
||||
|
||||
// Memperbarui indikator angka papan KPI atas
|
||||
document.getElementById('stat_total').textContent = daftar_warga.length;
|
||||
document.getElementById('stat_pending').textContent = total_pending;
|
||||
document.getElementById('stat_verified').textContent = total_verified;
|
||||
}
|
||||
|
||||
// Mengambil data seluruh antrean mustahik dari server backend Node.js
|
||||
async function ambil_antrean_survei() {
|
||||
const msg_container = document.getElementById('status_message_container');
|
||||
|
||||
@@ -156,22 +139,13 @@
|
||||
msg_container.classList.remove('hidden');
|
||||
msg_container.textContent = 'Memuat daftar antrean wilayah...';
|
||||
|
||||
/* Contoh implementasi fetch asinkron ke server lokal port 3000.
|
||||
Gunakan endpoint yang sesuai (misal mengambil seluruh data MUSTAHIK untuk petugas) */
|
||||
// const respons = await fetch('http://localhost:3000/api/survey/list-antrean');
|
||||
// if (!respons.ok) throw new Error('Gagal mengambil data dari server.');
|
||||
// const data_warga = await respons.json();
|
||||
|
||||
// Simulasi Data Mock untuk testing (Hapus blok ini jika endpoint backend Anda sudah siap)
|
||||
await new Promise(resolve => setTimeout(resolve, 600));
|
||||
const data_warga_mock = [
|
||||
{ nik: "6171012345670001", nama_kk: "Syahroni", status_validasi: "Pending" },
|
||||
{ nik: "6171029876540002", nama_kk: "Mariani", status_validasi: "Pending" },
|
||||
{ nik: "6171031122330003", nama_kk: "Zulkifli", status_validasi: "Verified" }
|
||||
];
|
||||
// Diubah ke relative path dan diaktifkan untuk mengambil data aslinya
|
||||
const respons = await fetch('/api/admin/mustahik');
|
||||
if (!respons.ok) throw new Error('Gagal mengambil data dari server.');
|
||||
const data_warga = await respons.json();
|
||||
|
||||
msg_container.classList.add('hidden');
|
||||
render_data_ke_tabel(data_warga_mock);
|
||||
render_data_ke_tabel(data_warga);
|
||||
|
||||
} catch (error_sistem) {
|
||||
msg_container.classList.remove('hidden');
|
||||
@@ -179,17 +153,14 @@
|
||||
}
|
||||
}
|
||||
|
||||
// Fungsi menghapus token autentikasi sesi saat petugas keluar aplikasi
|
||||
function proses_logout_petugas() {
|
||||
localStorage.removeItem('token_petugas');
|
||||
alert('Sesi berhasil diakhiri.');
|
||||
window.location.href = 'index.html';
|
||||
}
|
||||
|
||||
// Eksekusi trigger inisialisasi awal saat halaman selesai dimuat oleh browser
|
||||
periksa_sesi_petugas();
|
||||
ambil_antrean_survei();
|
||||
|
||||
</script>
|
||||
</body>
|
||||
</html>
|
||||
Reference in New Issue
Block a user