86 lines
4.0 KiB
PHP
86 lines
4.0 KiB
PHP
<div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:20px">
|
|
<div>
|
|
<h2 style="font-size:1.2rem;font-weight:700">📄 Laporan Tahunan</h2>
|
|
<p class="text-muted text-sm">Rekap penyaluran bantuan tahun <?= $tahun ?></p>
|
|
</div>
|
|
<form method="GET" style="display:flex;gap:8px;align-items:center">
|
|
<label class="text-sm">Tahun:</label>
|
|
<select name="tahun" class="form-control" onchange="this.form.submit()">
|
|
<?php for($y=date('Y');$y>=2020;$y--): ?>
|
|
<option value="<?= $y ?>" <?= $tahun==$y?'selected':'' ?>><?= $y ?></option>
|
|
<?php endfor; ?>
|
|
</select>
|
|
<button type="button" class="btn btn-ghost btn-sm" onclick="window.print()">🖨 Cetak</button>
|
|
</form>
|
|
</div>
|
|
|
|
<!-- Ringkasan -->
|
|
<div class="stats-grid" style="grid-template-columns:repeat(3,1fr);margin-bottom:20px">
|
|
<div class="stat-card"><div class="stat-card-icon green">📦</div>
|
|
<div class="stat-card-body"><div class="stat-card-value"><?= number_format($ringkasan['total_bantuan']??0) ?></div><div class="stat-card-label">Total Penyaluran Bantuan</div></div>
|
|
</div>
|
|
<div class="stat-card"><div class="stat-card-icon blue">👥</div>
|
|
<div class="stat-card-body"><div class="stat-card-value"><?= number_format($ringkasan['total_warga_terbantu']??0) ?></div><div class="stat-card-label">Warga Mendapat Bantuan</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($ringkasan['total_ri_aktif']??0) ?></div><div class="stat-card-label">Rumah Ibadah Aktif</div></div>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Chart bulanan -->
|
|
<div class="card" style="margin-bottom:20px">
|
|
<div class="card-header"><span class="card-icon">📊</span><h3>Grafik Penyaluran Bantuan Bulan per Bulan Tahun <?= $tahun ?></h3></div>
|
|
<div class="card-body"><div class="chart-wrap" style="height:280px"><canvas id="chart-bulanan"></canvas></div></div>
|
|
</div>
|
|
|
|
<!-- Tabel per bulan -->
|
|
<div class="card">
|
|
<div class="card-header"><span class="card-icon">📋</span><h3>Rekap per Bulan</h3></div>
|
|
<div class="card-body no-pad">
|
|
<div class="table-wrap">
|
|
<table>
|
|
<thead><tr><th>Bulan</th><th>Bantuan Disalurkan</th><th>Warga Terbantu</th><th>Rata-rata/Warga</th></tr></thead>
|
|
<tbody>
|
|
<?php
|
|
$namaBulan=['','Januari','Februari','Maret','April','Mei','Juni','Juli','Agustus','September','Oktober','November','Desember'];
|
|
$totalBulanan=0; $totalWarga=0;
|
|
foreach($perBulan as $b):
|
|
$totalBulanan+=$b['bantuan'];
|
|
$totalWarga+=$b['warga_terbantu'];
|
|
$avg=$b['warga_terbantu']>0?round($b['bantuan']/$b['warga_terbantu'],1):0;
|
|
?>
|
|
<tr>
|
|
<td style="font-weight:600"><?= $namaBulan[(int)$b['bulan']] ?></td>
|
|
<td><strong><?= number_format($b['bantuan']) ?></strong></td>
|
|
<td><?= number_format($b['warga_terbantu']) ?> warga</td>
|
|
<td class="text-sm text-muted"><?= $avg ?> kali/warga</td>
|
|
</tr>
|
|
<?php endforeach; ?>
|
|
<!-- Total -->
|
|
<tr style="background:#f0f9ff;font-weight:700">
|
|
<td>TOTAL</td>
|
|
<td><?= number_format($totalBulanan) ?></td>
|
|
<td><?= number_format($totalWarga) ?> (unik)</td>
|
|
<td>—</td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<?php if(empty($perBulan)): ?>
|
|
<div class="empty-state"><div class="empty-state-icon">📭</div><h3>Tidak ada data</h3><p>Belum ada penyaluran pada tahun <?= $tahun ?></p></div>
|
|
<?php endif; ?>
|
|
</div>
|
|
</div>
|
|
|
|
<script>
|
|
document.addEventListener('DOMContentLoaded', () => {
|
|
const bulanData = <?= json_encode($perBulan) ?>;
|
|
const namaBulan = ['','Januari','Februari','Maret','April','Mei','Juni','Juli','Agustus','September','Oktober','November','Desember'];
|
|
Charts.bar('chart-bulanan',
|
|
bulanData.map(b=>namaBulan[parseInt(b.bulan)]),
|
|
[{label:'Bantuan Disalurkan', data:bulanData.map(b=>b.bantuan)},
|
|
{label:'Warga Terbantu', data:bulanData.map(b=>b.warga_terbantu)}]
|
|
);
|
|
});
|
|
</script>
|