<?php
// blind_spot.php — Admin view
?>
<div style="margin-bottom:20px">
  <h2 style="font-size:1.2rem;font-weight:700">⚠️ Monitoring Blind Spot</h2>
  <p class="text-muted text-sm"><?= count($data) ?> warga tidak terjangkau radius rumah ibadah manapun</p>
</div>

<?php if(empty($data)): ?>
<div class="card"><div class="card-body" style="text-align:center;padding:48px">
  <div style="font-size:3rem">🎉</div>
  <h3 style="margin:12px 0 6px;font-size:1.1rem">Tidak Ada Blind Spot!</h3>
  <p style="color:var(--clr-text-muted)">Seluruh warga miskin sudah berada dalam radius pelayanan rumah ibadah.</p>
</div></div>
<?php else: ?>

<div class="card" style="margin-bottom:16px">
  <div class="card-body no-pad"><div id="bs-map" style="height:320px"></div></div>
</div>

<div class="card">
  <div class="card-header"><span class="card-icon">⚠️</span><h3>Daftar Warga Blind Spot</h3></div>
  <div class="card-body no-pad">
    <div class="table-wrap">
      <table>
        <thead><tr><th>#</th><th>Nama</th><th>Kecamatan</th><th>Kelurahan</th><th>Status Kemiskinan</th><th>Prioritas</th></tr></thead>
        <tbody>
          <?php foreach($data as $i=>$w): ?>
          <tr>
            <td class="text-xs text-muted"><?= $i+1 ?></td>
            <td style="font-weight:600"><?= e($w['nama']) ?></td>
            <td class="text-sm"><?= e($w['kecamatan']) ?></td>
            <td class="text-sm"><?= 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></td>
          </tr>
          <?php endforeach; ?>
        </tbody>
      </table>
    </div>
  </div>
</div>
<?php endif; ?>

<script>
document.addEventListener('DOMContentLoaded', async () => {
  const map = GISMap.init('bs-map', <?= MAP_DEFAULT_LAT ?>, <?= MAP_DEFAULT_LNG ?>, 12);
  const ri = await App.fetchJSON('<?= APP_URL ?>/api/rumah-ibadah');
  if(ri) GISMap.addRILayer(ri);
  const bs = <?= json_encode(array_map(fn($w)=>['lat'=>(float)$w['lat'],'lng'=>(float)$w['lng'],'nama'=>$w['nama'],'status_kemiskinan'=>$w['status_kemiskinan']], array_filter($data,fn($w)=>$w['lat']&&$w['lng']))) ?>;
  bs.forEach(w => L.circleMarker([w.lat,w.lng],{radius:10,fillColor:'#7c3aed',color:'#fff',weight:2,fillOpacity:0.9}).bindPopup(`<strong>⚠ ${w.nama}</strong><br>${w.status_kemiskinan}`).addTo(map));
  GISMap.autoFitBounds();
});
</script>
