Initial commit
This commit is contained in:
@@ -0,0 +1,46 @@
|
||||
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:20px">
|
||||
<div>
|
||||
<h2 style="font-size:1.2rem;font-weight:700">📦 Histori Bantuan</h2>
|
||||
<p class="text-muted text-sm"><?= e($ri['nama']) ?> · <?= count($data) ?> catatan penyaluran</p>
|
||||
</div>
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/bantuan/tambah" class="btn btn-success">➕ Catat Bantuan Baru</a>
|
||||
</div>
|
||||
|
||||
<div class="filters-bar">
|
||||
<input type="text" id="search-b" class="form-control" placeholder="🔍 Cari nama warga, kategori..." style="max-width:280px">
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-body no-pad">
|
||||
<div class="table-wrap">
|
||||
<table id="tbl-b">
|
||||
<thead>
|
||||
<tr><th>Kode</th><th>Warga</th><th>Kategori</th><th>Jumlah</th><th>Tanggal</th><th>Status</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach($data as $b): ?>
|
||||
<tr>
|
||||
<td><code style="font-size:0.72rem;background:#f1f5f9;padding:1px 5px;border-radius:3px"><?= e($b['kode_bantuan']) ?></code></td>
|
||||
<td style="font-weight:600"><?= e($b['warga']) ?></td>
|
||||
<td><span class="badge badge-green"><?= e($b['kategori']) ?></span></td>
|
||||
<td class="text-sm">
|
||||
<?= $b['jumlah'] ? ($b['satuan']==='rupiah' ? formatRupiah($b['jumlah']) : number_format($b['jumlah']).' '.$b['satuan']) : '—' ?>
|
||||
</td>
|
||||
<td class="text-sm"><?= formatTanggal($b['tanggal_penyaluran']) ?></td>
|
||||
<td><span class="badge badge-green">✅ <?= ucfirst($b['status']) ?></span></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php if(empty($data)): ?>
|
||||
<div class="empty-state">
|
||||
<div class="empty-state-icon">📭</div>
|
||||
<h3>Belum ada penyaluran</h3>
|
||||
<p>Mulai catat penyaluran bantuan pertama Anda</p>
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/bantuan/tambah" class="btn btn-success" style="margin-top:12px">➕ Catat Bantuan</a>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
<script>document.addEventListener('DOMContentLoaded',()=>App.initTableSearch('search-b','tbl-b'));</script>
|
||||
@@ -0,0 +1,175 @@
|
||||
<?php ob_start(); ?>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', async () => {
|
||||
const ri = <?= json_encode(['lat'=>(float)$ri['lat'],'lng'=>(float)$ri['lng'],'nama'=>$ri['nama'],'radius_meter'=>(int)$ri['radius_meter']]) ?>;
|
||||
|
||||
// Fokus ke lokasi rumah ibadah
|
||||
const map = GISMap.init('ri-dashboard-map', ri.lat, ri.lng, 15);
|
||||
|
||||
// Marker rumah ibadah
|
||||
L.circle([ri.lat, ri.lng], {
|
||||
radius: ri.radius_meter, fillColor:'#16a34a', fillOpacity:0.08,
|
||||
color:'#16a34a', weight:2, dashArray:'6,4'
|
||||
}).addTo(map).bindPopup('<strong>Radius Pelayanan: '+ri.radius_meter+'m</strong>');
|
||||
|
||||
GISMap.createRIMarker(ri).bindPopup('<strong>'+ri.nama+'</strong>').addTo(map).openPopup();
|
||||
|
||||
// Warga binaan
|
||||
const wargaData = await App.fetchJSON('<?= APP_URL ?>/rumah-ibadah/api/peta');
|
||||
if (wargaData?.warga && wargaData.warga.length > 0) {
|
||||
GISMap.addWargaLayer(wargaData.warga, w => {
|
||||
window.location.href = '<?= APP_URL ?>/rumah-ibadah/warga/' + w.id;
|
||||
});
|
||||
// Zoom ke area RI + warga binaan (sudah fokus ke RI dari init)
|
||||
// Tambahkan koordinat RI ke bounds agar tetap kelihatan
|
||||
GISMap._allMarkerBounds.push([ri.lat, ri.lng]);
|
||||
GISMap.autoFitBounds();
|
||||
}
|
||||
// Jika tidak ada warga, tetap fokus ke lokasi RI (sudah di-setView dari init)
|
||||
|
||||
// Chart prioritas
|
||||
const pData = <?= json_encode([
|
||||
($stats['prioritas_tinggi']??0),
|
||||
($stats['prioritas_sedang']??0),
|
||||
(($stats['total_warga']??0)-($stats['prioritas_tinggi']??0)-($stats['prioritas_sedang']??0))
|
||||
]) ?>;
|
||||
Charts.donut('chart-prioritas',
|
||||
['Prioritas Tinggi','Prioritas Sedang','Prioritas Rendah'],
|
||||
pData, ['#dc2626','#d97706','#16a34a']
|
||||
);
|
||||
});
|
||||
</script>
|
||||
<?php $extraJs = ob_get_clean(); ?>
|
||||
|
||||
<!-- Header RI Info -->
|
||||
<div style="background:var(--clr-primary);color:#fff;border-radius:var(--radius-md);padding:20px 24px;margin-bottom:20px;display:flex;align-items:center;gap:20px">
|
||||
<div style="font-size:3rem">⛪</div>
|
||||
<div>
|
||||
<div style="font-size:1.2rem;font-weight:800"><?= e($ri['nama']) ?></div>
|
||||
<div style="font-size:0.85rem;color:rgba(255,255,255,0.7)"><?= e($ri['jenis']??'') ?> · <?= e($ri['kelurahan']??'') ?>, <?= e($ri['kecamatan']??'') ?></div>
|
||||
<div style="font-size:0.8rem;color:rgba(255,255,255,0.6);margin-top:4px">📍 <?= e($ri['alamat']??'') ?> | Radius: <?= number_format($ri['radius_meter']??500) ?>m</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Stats -->
|
||||
<div class="stats-grid">
|
||||
<div class="stat-card">
|
||||
<div class="stat-card-icon blue">👥</div>
|
||||
<div class="stat-card-body">
|
||||
<div class="stat-card-value"><?= number_format($stats['total_warga']??0) ?></div>
|
||||
<div class="stat-card-label">Total Warga Binaan</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-card-icon red">🔥</div>
|
||||
<div class="stat-card-body">
|
||||
<div class="stat-card-value"><?= number_format($stats['prioritas_tinggi']??0) ?></div>
|
||||
<div class="stat-card-label">Prioritas Tinggi</div>
|
||||
<div class="stat-card-sub"><a href="<?= APP_URL ?>/rumah-ibadah/prioritas" style="color:var(--clr-primary-l)">Lihat →</a></div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-card-icon orange">⚠</div>
|
||||
<div class="stat-card-body">
|
||||
<div class="stat-card-value"><?= number_format($stats['ekstrem']??0) ?></div>
|
||||
<div class="stat-card-label">Miskin Ekstrem</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="stat-card">
|
||||
<div class="stat-card-icon green">📦</div>
|
||||
<div class="stat-card-body">
|
||||
<div class="stat-card-value"><?= number_format($stats['total_bantuan']??0) ?></div>
|
||||
<div class="stat-card-label">Total Bantuan Disalurkan</div>
|
||||
<div class="stat-card-sub"><?= number_format($stats['bantuan_bulan_ini']??0) ?> bulan ini</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Dashboard Grid: Peta + Sidebar -->
|
||||
<div class="dashboard-grid" style="margin-bottom:20px">
|
||||
<!-- PETA: fokus ke rumah ibadah + radius + warga -->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<span class="card-icon">🗺</span>
|
||||
<h3>Peta Wilayah Pelayanan & Warga Binaan</h3>
|
||||
<div class="card-actions">
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/bantuan/tambah" class="btn btn-accent btn-sm">➕ Catat Bantuan</a>
|
||||
</div>
|
||||
</div>
|
||||
<div class="card-body no-pad" style="position:relative">
|
||||
<div id="ri-dashboard-map" style="height:460px"></div>
|
||||
<div class="map-legend">
|
||||
<h4>Legenda</h4>
|
||||
<div class="map-legend-item"><div class="map-legend-dot legend-dot-ri"></div> Rumah Ibadah Anda</div>
|
||||
<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>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SIDEBAR -->
|
||||
<div style="display:flex;flex-direction:column;gap:16px">
|
||||
<!-- Chart Prioritas -->
|
||||
<div class="card">
|
||||
<div class="card-header"><span class="card-icon">📊</span><h3>Distribusi Prioritas</h3></div>
|
||||
<div class="card-body"><div class="chart-wrap" style="height:180px"><canvas id="chart-prioritas"></canvas></div></div>
|
||||
</div>
|
||||
|
||||
<!-- Warga Prioritas Tinggi -->
|
||||
<div class="card" style="flex:1">
|
||||
<div class="card-header">
|
||||
<span class="card-icon">🔥</span><h3>Warga Prioritas Tinggi</h3>
|
||||
<div class="card-actions"><a href="<?= APP_URL ?>/rumah-ibadah/prioritas" class="btn btn-ghost btn-sm">Semua</a></div>
|
||||
</div>
|
||||
<div class="card-body no-pad" style="max-height:280px;overflow-y:auto">
|
||||
<?php
|
||||
$topWarga = array_filter($wargaList, fn($w) => $w['level_prioritas']==='Tinggi');
|
||||
foreach(array_slice($topWarga,0,8) as $w):
|
||||
?>
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/warga/<?= $w['id'] ?>" style="display:block;text-decoration:none;color:inherit">
|
||||
<div class="sidebar-panel-item">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center">
|
||||
<h4 style="font-size:0.82rem"><?= e($w['nama']) ?></h4>
|
||||
<span style="font-size:0.78rem;font-weight:700;color:var(--clr-danger)"><?= $w['skor_prioritas'] ?>/100</span>
|
||||
</div>
|
||||
<p><?= e($w['status_kemiskinan']) ?> · Tgn: <?= $w['jumlah_tanggungan'] ?></p>
|
||||
</div>
|
||||
</a>
|
||||
<?php endforeach; ?>
|
||||
<?php if(empty($topWarga)): ?>
|
||||
<div class="empty-state" style="padding:20px"><p>Tidak ada warga prioritas tinggi</p></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Bantuan Terakhir -->
|
||||
<div class="card">
|
||||
<div class="card-header">
|
||||
<span class="card-icon">📦</span><h3>Bantuan Terakhir Disalurkan</h3>
|
||||
<div class="card-actions"><a href="<?= APP_URL ?>/rumah-ibadah/bantuan" class="btn btn-ghost btn-sm">Histori Lengkap</a></div>
|
||||
</div>
|
||||
<div class="card-body no-pad">
|
||||
<div class="table-wrap">
|
||||
<table>
|
||||
<thead><tr><th>Kode</th><th>Warga</th><th>Kategori</th><th>Jumlah</th><th>Tanggal</th></tr></thead>
|
||||
<tbody>
|
||||
<?php foreach($bantuanTerakhir as $b): ?>
|
||||
<tr>
|
||||
<td><code style="font-size:0.72rem;background:#f1f5f9;padding:1px 5px;border-radius:3px"><?= e($b['kode_bantuan']) ?></code></td>
|
||||
<td style="font-weight:600;font-size:0.875rem"><?= e($b['warga']) ?></td>
|
||||
<td><span class="badge badge-green"><?= e($b['kategori']) ?></span></td>
|
||||
<td class="text-sm"><?= $b['jumlah'] ? ($b['satuan']==='rupiah'?formatRupiah($b['jumlah']):(number_format($b['jumlah']).' '.$b['satuan'])) : '—' ?></td>
|
||||
<td class="text-sm text-muted"><?= formatTanggal($b['tanggal_penyaluran']) ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php if(empty($bantuanTerakhir)): ?>
|
||||
<div class="empty-state" style="padding:24px"><div class="empty-state-icon">📭</div><p>Belum ada bantuan disalurkan</p></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,127 @@
|
||||
<?php ob_start(); ?>
|
||||
<script>
|
||||
document.addEventListener('DOMContentLoaded', () => {
|
||||
const lat = <?= (float)$warga['lat'] ?>;
|
||||
const lng = <?= (float)$warga['lng'] ?>;
|
||||
if(lat && lng) {
|
||||
const map = L.map('ri-warga-map').setView([lat,lng],16);
|
||||
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png',{maxZoom:19}).addTo(map);
|
||||
const color = '<?= warnaMiskin($warga['status_kemiskinan']) ?>';
|
||||
L.circleMarker([lat,lng],{radius:12,fillColor:color,color:'#fff',weight:3,fillOpacity:0.9})
|
||||
.bindPopup('<strong><?= addslashes($warga['nama']) ?></strong>').addTo(map).openPopup();
|
||||
// Rumah ibadah marker
|
||||
const ri = <?= json_encode(['lat'=>(float)$ri['lat'],'lng'=>(float)$ri['lng'],'nama'=>$ri['nama'],'radius_meter'=>(int)$ri['radius_meter']]) ?>;
|
||||
GISMap.map = map;
|
||||
GISMap.createRIMarker(ri).bindPopup(ri.nama).addTo(map);
|
||||
L.circle([ri.lat,ri.lng],{radius:ri.radius_meter,fillColor:'#16a34a',fillOpacity:0.06,color:'#16a34a',weight:1.5,dashArray:'5,4'}).addTo(map);
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<?php $extraJs = ob_get_clean(); ?>
|
||||
|
||||
<div style="display:flex;align-items:center;gap:12px;margin-bottom:20px">
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/warga" class="btn btn-ghost btn-sm">← Kembali</a>
|
||||
<h2 style="font-size:1.1rem;font-weight:700"><?= e($warga['nama']) ?></h2>
|
||||
<?php $sc=['Miskin Ekstrem'=>'badge-red','Miskin'=>'badge-orange','Rentan Miskin'=>'badge-yellow']; ?>
|
||||
<span class="badge <?= $sc[$warga['status_kemiskinan']]??'badge-gray' ?>"><?= e($warga['status_kemiskinan']) ?></span>
|
||||
<div style="margin-left:auto">
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/bantuan/tambah" class="btn btn-success btn-sm">📦 Catat Bantuan</a>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div style="display:grid;grid-template-columns:1fr 320px;gap:20px">
|
||||
<div style="display:flex;flex-direction:column;gap:16px">
|
||||
<!-- Skor -->
|
||||
<div class="card" style="border-left:4px solid <?= ['Tinggi'=>'#dc2626','Sedang'=>'#d97706','Rendah'=>'#16a34a'][$warga['level_prioritas']]??'#6b7280' ?>">
|
||||
<div class="card-body">
|
||||
<div style="display:flex;align-items:center;gap:20px">
|
||||
<div style="text-align:center;min-width:80px">
|
||||
<div style="font-size:2.5rem;font-weight:900;color:<?= ['Tinggi'=>'#dc2626','Sedang'=>'#d97706','Rendah'=>'#16a34a'][$warga['level_prioritas']]??'#6b7280' ?>"><?= $warga['skor_prioritas'] ?></div>
|
||||
<div class="text-xs text-muted">Skor Prioritas</div>
|
||||
</div>
|
||||
<div style="flex:1">
|
||||
<div class="priority-bar" style="height:10px;margin-bottom:8px">
|
||||
<div class="priority-bar-fill <?= strtolower($warga['level_prioritas'])==='tinggi'?'high':(strtolower($warga['level_prioritas'])==='sedang'?'medium':'low') ?>"
|
||||
style="width:<?= min(100,$warga['skor_prioritas']) ?>%"></div>
|
||||
</div>
|
||||
<div style="font-weight:700">Prioritas <?= e($warga['level_prioritas']) ?></div>
|
||||
<div class="text-sm text-muted"><?= e($warga['status_kemiskinan']) ?></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Data Pribadi -->
|
||||
<div class="card">
|
||||
<div class="card-header"><span class="card-icon">👤</span><h3>Data Pribadi</h3></div>
|
||||
<div class="card-body">
|
||||
<div style="display:grid;grid-template-columns:repeat(2,1fr);gap:14px">
|
||||
<?php $items = [
|
||||
['Nama Lengkap',$warga['nama']],
|
||||
['NIK',$warga['nik']??'—'],
|
||||
['Kelurahan',$warga['kelurahan']??'—'],
|
||||
['Kecamatan',$warga['kecamatan']??'—'],
|
||||
['Pendidikan',$warga['pendidikan_terakhir']??'—'],
|
||||
['Pekerjaan',$warga['pekerjaan']??'—'],
|
||||
['Penghasilan',formatRupiah($warga['penghasilan_bulanan']??0).'/bln'],
|
||||
['Tanggungan',($warga['jumlah_tanggungan']??0).' orang'],
|
||||
['Kondisi Rumah',$warga['kondisi_rumah']??'—'],
|
||||
['Riwayat Penyakit',$warga['riwayat_penyakit']??'—'],
|
||||
]; foreach($items as [$l,$v]): ?>
|
||||
<div>
|
||||
<div class="text-xs text-muted"><?= $l ?></div>
|
||||
<div style="font-weight:500;font-size:0.875rem;margin-top:2px"><?= e($v) ?></div>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
<div style="display:flex;gap:8px;margin-top:12px;flex-wrap:wrap">
|
||||
<?php if($warga['is_lansia']): ?><span class="badge badge-orange">👴 Lansia</span><?php endif; ?>
|
||||
<?php if($warga['is_disabilitas']): ?><span class="badge badge-blue">♿ Disabilitas</span><?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Histori Bantuan -->
|
||||
<div class="card">
|
||||
<div class="card-header"><span class="card-icon">📦</span><h3>Histori Bantuan Diterima (<?= count($bantuan) ?>)</h3></div>
|
||||
<div class="card-body no-pad">
|
||||
<?php if($bantuan): ?>
|
||||
<div class="table-wrap">
|
||||
<table>
|
||||
<thead><tr><th>Tanggal</th><th>Kategori</th><th>Jumlah</th></tr></thead>
|
||||
<tbody>
|
||||
<?php foreach($bantuan as $b): ?>
|
||||
<tr>
|
||||
<td class="text-sm"><?= formatTanggal($b['tanggal_penyaluran']) ?></td>
|
||||
<td><span class="badge badge-green"><?= e($b['kategori']) ?></span></td>
|
||||
<td class="text-sm"><?= $b['jumlah'] ? ($b['satuan']==='rupiah'?formatRupiah($b['jumlah']):(number_format($b['jumlah']).' '.$b['satuan'])) : '—' ?></td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php else: ?>
|
||||
<div class="empty-state" style="padding:20px"><p>Belum menerima bantuan</p></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- KANAN: Peta -->
|
||||
<div>
|
||||
<div class="card">
|
||||
<div class="card-header"><span class="card-icon">📍</span><h3>Lokasi Warga</h3></div>
|
||||
<div class="card-body no-pad">
|
||||
<div id="ri-warga-map" style="height:300px"></div>
|
||||
</div>
|
||||
<div class="card-body">
|
||||
<div class="text-xs text-muted">Koordinat</div>
|
||||
<div style="font-family:monospace;font-size:0.78rem"><?= $warga['lat'] ?>, <?= $warga['lng'] ?></div>
|
||||
<?php if($warga['alamat']): ?>
|
||||
<div class="text-xs text-muted" style="margin-top:8px">Alamat</div>
|
||||
<div style="font-size:0.8rem"><?= e($warga['alamat']) ?></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,133 @@
|
||||
<div style="display:flex;align-items:center;gap:12px;margin-bottom:20px">
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/bantuan" class="btn btn-ghost btn-sm">← Kembali</a>
|
||||
<h2 style="font-size:1.1rem;font-weight:700">Catat Penyaluran Bantuan</h2>
|
||||
</div>
|
||||
|
||||
<div style="display:grid;grid-template-columns:1fr 340px;gap:20px">
|
||||
<div>
|
||||
<div class="card">
|
||||
<div class="card-header"><span class="card-icon">📦</span><h3>Form Penyaluran Bantuan</h3></div>
|
||||
<div class="card-body">
|
||||
<form method="POST" action="<?= APP_URL ?>/rumah-ibadah/bantuan/store" enctype="multipart/form-data">
|
||||
<?= csrfField() ?>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-label">Warga Penerima <span class="required">*</span></label>
|
||||
<select name="id_warga" id="sel-warga" class="form-control" required onchange="showWargaInfo(this)">
|
||||
<option value="">— Pilih Warga —</option>
|
||||
<?php foreach($wargaList as $w): ?>
|
||||
<option value="<?= $w['id'] ?>"
|
||||
data-status="<?= e($w['status_kemiskinan']) ?>"
|
||||
data-level="<?= e($w['level_prioritas']) ?>">
|
||||
<?= e($w['nama']) ?> [<?= e($w['level_prioritas']) ?>]
|
||||
</option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
|
||||
<!-- Info warga terpilih -->
|
||||
<div id="warga-info" style="display:none;margin-bottom:16px;padding:12px;background:#eff6ff;border-radius:8px;border:1px solid #bfdbfe">
|
||||
<div style="font-size:0.8rem;font-weight:600;color:var(--clr-primary)">ℹ️ Info Warga Terpilih</div>
|
||||
<div style="font-size:0.82rem;margin-top:4px">
|
||||
Status: <span id="info-status" style="font-weight:700"></span> ·
|
||||
Prioritas: <span id="info-level" style="font-weight:700"></span>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row cols-2">
|
||||
<div class="form-group">
|
||||
<label class="form-label">Kategori Bantuan <span class="required">*</span></label>
|
||||
<select name="id_kategori_bantuan" class="form-control" required onchange="setSatuan(this)">
|
||||
<option value="">— Pilih Kategori —</option>
|
||||
<?php foreach($kategori as $k): ?>
|
||||
<option value="<?= $k['id'] ?>" data-satuan="<?= e($k['satuan']??'paket') ?>"><?= e($k['nama']) ?></option>
|
||||
<?php endforeach; ?>
|
||||
</select>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Tanggal Penyaluran <span class="required">*</span></label>
|
||||
<input type="date" name="tanggal_penyaluran" class="form-control" value="<?= date('Y-m-d') ?>" required>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-row cols-2">
|
||||
<div class="form-group">
|
||||
<label class="form-label">Jumlah <span class="required">*</span></label>
|
||||
<input type="number" name="jumlah" id="inp-jumlah" class="form-control" value="1" min="0.01" step="0.01" required>
|
||||
</div>
|
||||
<div class="form-group">
|
||||
<label class="form-label">Satuan</label>
|
||||
<input type="text" name="satuan" id="inp-satuan" class="form-control" value="paket" placeholder="paket/kg/rupiah">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-label">Deskripsi Bantuan</label>
|
||||
<textarea name="deskripsi" class="form-control" rows="3" placeholder="Contoh: Sembako bulanan terdiri dari beras 5kg, minyak, gula..."></textarea>
|
||||
</div>
|
||||
|
||||
<div class="form-group">
|
||||
<label class="form-label">Foto Bukti Penyaluran</label>
|
||||
<input type="file" name="foto_bukti" class="form-control" accept="image/*">
|
||||
<div class="form-hint">Upload foto saat penyerahan bantuan sebagai bukti dokumentasi</div>
|
||||
</div>
|
||||
|
||||
<div style="display:flex;justify-content:flex-end;gap:12px;margin-top:8px">
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/bantuan" class="btn btn-ghost">Batal</a>
|
||||
<button type="submit" class="btn btn-success" style="padding:10px 24px">✅ Simpan Penyaluran</button>
|
||||
</div>
|
||||
</form>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- SIDEBAR: Daftar warga prioritas -->
|
||||
<div>
|
||||
<div class="card" style="position:sticky;top:80px">
|
||||
<div class="card-header"><span class="card-icon">🔥</span><h3>Warga Prioritas Tinggi</h3></div>
|
||||
<div class="card-body no-pad" style="max-height:500px;overflow-y:auto">
|
||||
<?php
|
||||
$topWarga = array_filter($wargaList, fn($w) => $w['level_prioritas']==='Tinggi');
|
||||
foreach($topWarga as $w):
|
||||
?>
|
||||
<div class="sidebar-panel-item" onclick="document.getElementById('sel-warga').value='<?= $w['id'] ?>';showWargaInfo(document.getElementById('sel-warga'))" style="cursor:pointer">
|
||||
<div style="display:flex;justify-content:space-between;align-items:center">
|
||||
<h4><?= e($w['nama']) ?></h4>
|
||||
<span style="font-weight:700;font-size:0.78rem;color:var(--clr-danger)"><?= isset($w['skor_prioritas']) ? $w['skor_prioritas'] . '/100' : 'N/A' ?></span>
|
||||
</div>
|
||||
<p><?= e($w['status_kemiskinan']) ?></p>
|
||||
</div>
|
||||
<?php endforeach; ?>
|
||||
<?php if(empty($topWarga)): ?>
|
||||
<div class="empty-state" style="padding:20px"><p>Tidak ada prioritas tinggi</p></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>
|
||||
function showWargaInfo(sel) {
|
||||
const opt = sel.options[sel.selectedIndex];
|
||||
const info = document.getElementById('warga-info');
|
||||
if(sel.value) {
|
||||
info.style.display='block';
|
||||
document.getElementById('info-status').textContent = opt.dataset.status||'—';
|
||||
document.getElementById('info-level').textContent = opt.dataset.level||'—';
|
||||
} else {
|
||||
info.style.display='none';
|
||||
}
|
||||
}
|
||||
function setSatuan(sel) {
|
||||
const opt = sel.options[sel.selectedIndex];
|
||||
const satuan = opt.dataset.satuan||'paket';
|
||||
document.getElementById('inp-satuan').value = satuan;
|
||||
if(satuan==='rupiah'){
|
||||
document.getElementById('inp-jumlah').step='1000';
|
||||
document.getElementById('inp-jumlah').placeholder='mis: 300000';
|
||||
} else {
|
||||
document.getElementById('inp-jumlah').step='0.01';
|
||||
document.getElementById('inp-jumlah').placeholder='';
|
||||
}
|
||||
}
|
||||
</script>
|
||||
@@ -0,0 +1,45 @@
|
||||
<div style="margin-bottom:20px">
|
||||
<h2 style="font-size:1.2rem;font-weight:700">🔥 Daftar Prioritas Bantuan</h2>
|
||||
<p class="text-muted text-sm"><?= e($ri['nama']) ?> · Diurutkan berdasarkan skor prioritas tertinggi</p>
|
||||
</div>
|
||||
<div class="card">
|
||||
<div class="card-body no-pad">
|
||||
<div class="table-wrap">
|
||||
<table>
|
||||
<thead><tr><th>Rank</th><th>Nama</th><th>Skor</th><th>Status</th><th>Penghasilan</th><th>Tanggungan</th><th>Bantuan Terakhir</th><th>Total</th><th>Aksi</th></tr></thead>
|
||||
<tbody>
|
||||
<?php foreach($data as $i=>$w): ?>
|
||||
<tr>
|
||||
<td>
|
||||
<div style="width:28px;height:28px;border-radius:50%;background:<?= $i<3?['#dc2626','#d97706','#0284c7'][$i]:'#e2e8f0' ?>;color:<?= $i<3?'#fff':'var(--clr-text)' ?>;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:0.8rem"><?= $i+1 ?></div>
|
||||
</td>
|
||||
<td>
|
||||
<div style="font-weight:600"><?= e($w['nama']) ?></div>
|
||||
<?php if($w['is_lansia']): ?><span class="badge badge-orange" style="font-size:0.62rem">Lansia</span><?php endif; ?>
|
||||
<?php if($w['is_disabilitas']): ?><span class="badge badge-blue" style="font-size:0.62rem">Disabilitas</span><?php endif; ?>
|
||||
</td>
|
||||
<td>
|
||||
<div style="font-size:1.2rem;font-weight:800;color:<?= ['Tinggi'=>'#dc2626','Sedang'=>'#d97706','Rendah'=>'#16a34a'][$w['level_prioritas']]??'#6b7280' ?>"><?= $w['skor_prioritas'] ?></div>
|
||||
<?php $pc=['Tinggi'=>'badge-red','Sedang'=>'badge-yellow','Rendah'=>'badge-green']; ?>
|
||||
<span class="badge <?= $pc[$w['level_prioritas']]??'badge-gray' ?>" style="font-size:0.62rem"><?= $w['level_prioritas'] ?></span>
|
||||
</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 class="text-sm"><?= formatRupiah($w['penghasilan_bulanan']??0) ?>/bln</td>
|
||||
<td class="text-sm text-center"><?= $w['jumlah_tanggungan'] ?> orang</td>
|
||||
<td class="text-xs text-muted"><?= $w['bantuan_terakhir'] ? formatTanggal($w['bantuan_terakhir']) : '<span style="color:#dc2626;font-weight:600">Belum pernah</span>' ?></td>
|
||||
<td class="text-sm text-center"><?= number_format($w['jml_bantuan']) ?>×</td>
|
||||
<td>
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/warga/<?= $w['id'] ?>" class="btn btn-ghost btn-sm">Detail</a>
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/bantuan/tambah" class="btn btn-success btn-sm">📦 Bantu</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php if(empty($data)): ?>
|
||||
<div class="empty-state"><div class="empty-state-icon">👥</div><h3>Tidak ada warga binaan</h3></div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
@@ -0,0 +1,62 @@
|
||||
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:20px">
|
||||
<div>
|
||||
<h2 style="font-size:1.2rem;font-weight:700">👥 Daftar Warga Binaan</h2>
|
||||
<p class="text-muted text-sm"><?= e($ri['nama']) ?> · <?= count($data) ?> warga</p>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="tabs">
|
||||
<?php foreach(['semua'=>'Semua','Tinggi'=>'🔥 Prioritas Tinggi','Sedang'=>'⚡ Sedang','Rendah'=>'✅ Rendah'] as $l=>$label): ?>
|
||||
<a href="?level=<?= $l ?>" class="tab-btn <?= $level===$l?'active':'' ?>"><?= $label ?></a>
|
||||
<?php endforeach; ?>
|
||||
</div>
|
||||
|
||||
<div class="filters-bar">
|
||||
<input type="text" id="search-w" class="form-control" placeholder="🔍 Cari nama warga..." style="max-width:280px">
|
||||
</div>
|
||||
|
||||
<div class="card">
|
||||
<div class="card-body no-pad">
|
||||
<div class="table-wrap">
|
||||
<table id="tbl-w">
|
||||
<thead>
|
||||
<tr><th>#</th><th>Nama</th><th>Status Kemiskinan</th><th>Prioritas</th><th>Penghasilan</th><th>Tanggungan</th><th>Aksi</th></tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<?php foreach($data as $i=>$w): ?>
|
||||
<tr>
|
||||
<td class="text-xs text-muted"><?= $i+1 ?></td>
|
||||
<td>
|
||||
<div style="font-weight:600"><?= e($w['nama']) ?></div>
|
||||
<div class="text-xs text-muted"><?= e($w['kelurahan']??'') ?></div>
|
||||
</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'] ?> orang</td>
|
||||
<td>
|
||||
<a href="<?= APP_URL ?>/rumah-ibadah/warga/<?= $w['id'] ?>" class="btn btn-ghost btn-sm">Detail</a>
|
||||
</td>
|
||||
</tr>
|
||||
<?php endforeach; ?>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
<?php if(empty($data)): ?>
|
||||
<div class="empty-state">
|
||||
<div class="empty-state-icon">👥</div>
|
||||
<h3>Tidak ada warga binaan</h3>
|
||||
<p>Warga binaan akan otomatis ditugaskan berdasarkan radius pelayanan</p>
|
||||
</div>
|
||||
<?php endif; ?>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<script>document.addEventListener('DOMContentLoaded',()=>App.initTableSearch('search-w','tbl-w'));</script>
|
||||
Reference in New Issue
Block a user