cw
76 lines
3.8 KiB
PHP
76 lines
3.8 KiB
PHP
<?php
|
||
// monitoring.php — Admin monitoring kemiskinan view
|
||
?>
|
||
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:20px">
|
||
<div><h2 style="font-size:1.2rem;font-weight:700">👥 Monitoring Data Kemiskinan</h2>
|
||
<p class="text-muted text-sm"><?= count($warga) ?> warga aktif terdata dalam sistem</p></div>
|
||
</div>
|
||
|
||
<!-- Peta -->
|
||
<div class="card" style="margin-bottom:20px">
|
||
<div class="card-header"><span class="card-icon">🗺</span><h3>Peta Persebaran Seluruh Warga Miskin</h3></div>
|
||
<div class="card-body no-pad" style="position:relative">
|
||
<div id="mon-map" style="height:360px"></div>
|
||
<div class="map-legend">
|
||
<h4>Legenda</h4>
|
||
<div class="map-legend-item"><div class="map-legend-dot legend-dot-ekstrem"></div> Miskin Ekstrem</div>
|
||
<div class="map-legend-item"><div class="map-legend-dot legend-dot-miskin"></div> Miskin</div>
|
||
<div class="map-legend-item"><div class="map-legend-dot legend-dot-rentan"></div> Rentan Miskin</div>
|
||
<div class="map-legend-item"><div class="map-legend-dot legend-dot-blind"></div> Blind Spot</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Search + Table -->
|
||
<div class="filters-bar"><input type="text" id="search-mon" class="form-control" placeholder="🔍 Cari nama, NIK..." style="max-width:300px"></div>
|
||
|
||
<div class="card">
|
||
<div class="card-body no-pad">
|
||
<div class="table-wrap">
|
||
<table id="table-mon">
|
||
<thead><tr><th>#</th><th>Nama</th><th>Wilayah</th><th>Status Kemiskinan</th><th>Prioritas</th><th>Penghasilan</th><th>Tgn</th><th>Rumah Ibadah</th><th>Ket</th></tr></thead>
|
||
<tbody>
|
||
<?php foreach($warga as $i=>$w): ?>
|
||
<tr>
|
||
<td class="text-xs text-muted"><?= $i+1 ?></td>
|
||
<td>
|
||
<div style="font-weight:600;font-size:0.875rem"><?= e($w['nama']) ?></div>
|
||
<div class="text-xs text-muted"><?= $w['nik'] ? 'NIK: '.e($w['nik']) : '' ?></div>
|
||
</td>
|
||
<td class="text-sm"><?= e($w['kecamatan']) ?> › <?= e($w['kelurahan']) ?></td>
|
||
<td><?php $sc=['Miskin Ekstrem'=>'badge-red','Miskin'=>'badge-orange','Rentan Miskin'=>'badge-yellow']; ?>
|
||
<span class="badge <?= $sc[$w['status_kemiskinan']]??'badge-gray' ?>"><?= e($w['status_kemiskinan']) ?></span></td>
|
||
<td><?php $pc=['Tinggi'=>'badge-red','Sedang'=>'badge-yellow','Rendah'=>'badge-green']; ?>
|
||
<span class="badge <?= $pc[$w['level_prioritas']]??'badge-gray' ?>"><?= e($w['level_prioritas']) ?></span>
|
||
<div class="text-xs text-muted"><?= $w['skor_prioritas'] ?>/100</div></td>
|
||
<td class="text-sm"><?= formatRupiah($w['penghasilan_bulanan']??0) ?></td>
|
||
<td class="text-sm text-center"><?= $w['jumlah_tanggungan'] ?></td>
|
||
<td class="text-sm"><?= e($w['rumah_ibadah_nama']??'—') ?></td>
|
||
<td>
|
||
<?php if($w['is_blind_spot']): ?><span class="badge badge-purple" title="Blind Spot">⚠</span><?php endif; ?>
|
||
<?php if($w['is_lansia']): ?><span class="badge badge-orange" title="Lansia">👴</span><?php endif; ?>
|
||
<?php if($w['is_disabilitas']): ?><span class="badge badge-blue" title="Disabilitas">♿</span><?php endif; ?>
|
||
</td>
|
||
</tr>
|
||
<?php endforeach; ?>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<script>
|
||
document.addEventListener('DOMContentLoaded', async () => {
|
||
App.initTableSearch('search-mon','table-mon');
|
||
const map = GISMap.init('mon-map', <?= MAP_DEFAULT_LAT ?>, <?= MAP_DEFAULT_LNG ?>, 12);
|
||
const data = await App.fetchJSON('<?= APP_URL ?>/admin/api/peta');
|
||
if(data) {
|
||
GISMap.addRILayer(data.rumah_ibadah||[]);
|
||
GISMap.addWargaLayer(data.warga||[]);
|
||
GISMap.autoFitBounds();
|
||
} else {
|
||
GISMap.autoFitBounds(true);
|
||
}
|
||
});
|
||
</script>
|