initial commit pemetaan kemiskinan

This commit is contained in:
2026-06-12 23:41:56 +07:00
commit 1fdcddc550
22 changed files with 1700 additions and 0 deletions
+13
View File
@@ -0,0 +1,13 @@
<?php
include "../koneksi.php";
$data = [];
$q = mysqli_query($conn,"SELECT * FROM keluarga_miskin");
while($d = mysqli_fetch_assoc($q)){
$data[] = $d;
}
echo json_encode($data);
?>
+16
View File
@@ -0,0 +1,16 @@
<?php
include "../koneksi.php";
$data = [];
$q = mysqli_query($conn,"
SELECT *
FROM rumah_ibadah
");
while($d = mysqli_fetch_assoc($q)){
$data[] = $d;
}
echo json_encode($data);
+27
View File
@@ -0,0 +1,27 @@
<?php
include "../config/koneksi.php";
$keluarga_id = $_POST['keluarga_id'];
$jenis = $_POST['jenis'];
$jumlah = $_POST['jumlah'];
$keterangan = $_POST['keterangan'];
/* 1. INSERT bantuan */
mysqli_query($conn,"
INSERT INTO bantuan(
keluarga_id,jenis,jumlah,keterangan,status,status_aktif
)
VALUES(
'$keluarga_id','$jenis','$jumlah','$keterangan','pending','aktif'
)
");
/* 2. UPDATE keluarga jadi proses */
mysqli_query($conn,"
UPDATE keluarga_miskin
SET status_bantuan='proses'
WHERE id='$keluarga_id'
");
echo "OK";
?>
+18
View File
@@ -0,0 +1,18 @@
<?php
include "../config/koneksi.php";
$result = mysqli_query($conn, "
SELECT b.*, k.nama
FROM bantuan b
JOIN keluarga_miskin k ON b.keluarga_id = k.id
ORDER BY b.tanggal DESC
");
$data = [];
while($row = mysqli_fetch_assoc($result)){
$data[] = $row;
}
echo json_encode($data);
?>
+39
View File
@@ -0,0 +1,39 @@
<?php
include "../config/koneksi.php";
$id = $_GET['id'];
$status = $_GET['status'];
/* update status bantuan */
mysqli_query($conn,"
UPDATE bantuan
SET status='$status'
WHERE id='$id'
");
/* kalau sudah diserahkan = selesai */
if($status == "diserahkan"){
$data = mysqli_fetch_assoc(mysqli_query($conn,"
SELECT keluarga_id FROM bantuan WHERE id='$id'
"));
$keluarga_id = $data['keluarga_id'];
/* update keluarga */
mysqli_query($conn,"
UPDATE keluarga_miskin
SET status_bantuan='sudah'
WHERE id='$keluarga_id'
");
/* update bantuan jadi selesai */
mysqli_query($conn,"
UPDATE bantuan
SET status_aktif='selesai'
WHERE id='$id'
");
}
header("Location: ../bantuan.php?view=validasi");
?>
+18
View File
@@ -0,0 +1,18 @@
<?php
include "../config/koneksi.php";
$nik = $_POST['nik'];
$nama = $_POST['nama_kepala_keluarga'];
$alamat = $_POST['alamat'];
$penghasilan = $_POST['penghasilan'];
$prioritas = $_POST['prioritas'];
$lat = $_POST['lat'];
$lng = $_POST['lng'];
mysqli_query($conn, "INSERT INTO keluarga_miskin
(nik,nama,alamat,penghasilan_kategori,prioritas,lat,lng,status_bantuan)
VALUES
('$nik','$nama','$alamat','$penghasilan','$prioritas','$lat','$lng','belum')");
echo "OK";
?>
+9
View File
@@ -0,0 +1,9 @@
<?php
include "../config/koneksi.php";
$id = $_POST['id'];
mysqli_query($conn,"DELETE FROM keluarga_miskin WHERE id='$id'");
echo json_encode(["status"=>"deleted"]);
?>
+13
View File
@@ -0,0 +1,13 @@
<?php
include "../config/koneksi.php";
$result = mysqli_query($conn, "SELECT * FROM keluarga_miskin");
$data = [];
while($row = mysqli_fetch_assoc($result)){
$data[] = $row;
}
echo json_encode($data);
?>
+24
View File
@@ -0,0 +1,24 @@
<?php
include "../config/koneksi.php";
$id = $_POST['id'];
$nik = $_POST['nik'];
$nama = $_POST['nama_kepala_keluarga'];
$alamat = $_POST['alamat'];
$penghasilan = $_POST['penghasilan_kategori'];
$prioritas = $_POST['prioritas'];
$status = $_POST['status_bantuan'];
$query = mysqli_query($conn,"
UPDATE keluarga_miskin SET
nik='$nik',
nama='$nama',
alamat='$alamat',
penghasilan_kategori='$penghasilan',
prioritas='$prioritas',
status_bantuan='$status'
WHERE id='$id'
");
echo json_encode(["status"=>"success"]);
?>
+24
View File
@@ -0,0 +1,24 @@
<?php
session_start();
include "../config/koneksi.php";
$username = $_POST['username'];
$password = $_POST['password'];
$query = mysqli_query($conn, "
SELECT * FROM users
WHERE username='$username' AND password='$password'
");
$data = mysqli_fetch_assoc($query);
if($data){
$_SESSION['id'] = $data['id'];
$_SESSION['nama'] = $data['nama'];
$_SESSION['role'] = $data['role'];
header("Location: ../index.php");
}else{
echo "Login gagal";
}
?>
+20
View File
@@ -0,0 +1,20 @@
<?php
include "../config/koneksi.php";
$nama = $_POST['nama'];
$jenis = $_POST['jenis'];
$alamat = $_POST['alamat'];
$ketua = $_POST['ketua_pengurus'];
$no_hp = $_POST['no_hp'];
$lat = $_POST['lat'];
$lng = $_POST['lng'];
$radius = $_POST['radius'];
mysqli_query($conn,
"INSERT INTO rumah_ibadah
(nama,jenis,alamat,ketua,no_hp,lat,lng,radius)
VALUES
('$nama','$jenis','$alamat','$ketua','$no_hp','$lat','$lng','$radius')");
echo "success";
?>
+9
View File
@@ -0,0 +1,9 @@
<?php
include "../config/koneksi.php";
$id = $_POST['id'];
mysqli_query($conn,"DELETE FROM rumah_ibadah WHERE id='$id'");
echo json_encode(["status"=>"deleted"]);
?>
+13
View File
@@ -0,0 +1,13 @@
<?php
include "../config/koneksi.php";
$result = mysqli_query($conn,"SELECT * FROM rumah_ibadah");
$data = [];
while($row = mysqli_fetch_assoc($result)){
$data[] = $row;
}
echo json_encode($data);
?>
+24
View File
@@ -0,0 +1,24 @@
<?php
include "../config/koneksi.php";
$id = $_POST['id'];
$nama = $_POST['nama'];
$jenis = $_POST['jenis'];
$alamat = $_POST['alamat'];
$ketua = $_POST['ketua_pengurus'];
$no_hp = $_POST['no_hp'];
$radius = $_POST['radius'];
$query = mysqli_query($conn, "
UPDATE rumah_ibadah SET
nama='$nama',
jenis='$jenis',
alamat='$alamat',
ketua='$ketua',
no_hp='$no_hp',
radius='$radius'
WHERE id='$id'
");
echo json_encode(["status"=>"success"]);
?>
+28
View File
@@ -0,0 +1,28 @@
<?php
include "../koneksi.php";
session_start();
$user_id = $_SESSION['id'];
$nik = $_POST['nik'];
$nama = $_POST['nama_kepala_keluarga'];
$alamat = $_POST['alamat'];
$jumlah = $_POST['jumlah_anggota'];
$pekerjaan = $_POST['pekerjaan'];
$penghasilan = $_POST['penghasilan'];
$kategori = $_POST['kategori'];
$prioritas = $_POST['prioritas'];
$status_bantuan = $_POST['status_bantuan'];
$status_verifikasi = $_POST['status_verifikasi'];
$lat = $_POST['lat'];
$lng = $_POST['lng'];
mysqli_query($conn,"
INSERT INTO keluarga_miskin
(nik,nama_kepala_keluarga,alamat,jumlah_anggota,pekerjaan,penghasilan,kategori,prioritas,status_bantuan,status_verifikasi,lat,lng,user_id)
VALUES
('$nik','$nama','$alamat','$jumlah','$pekerjaan','$penghasilan','$kategori','$prioritas','$status_bantuan','$status_verifikasi','$lat','$lng','$user_id')
");
echo "success";
?>
+20
View File
@@ -0,0 +1,20 @@
<?php
include "../koneksi.php";
$nama = $_POST['nama'];
$jenis = $_POST['jenis'];
$alamat = $_POST['alamat'];
$ketua = $_POST['ketua_pengurus'];
$hp = $_POST['no_hp'];
$lat = $_POST['lat'];
$lng = $_POST['lng'];
$query = "INSERT INTO rumah_ibadah
(nama, jenis, alamat, ketua_pengurus, no_hp, lat, lng)
VALUES
('$nama','$jenis','$alamat','$ketua','$hp','$lat','$lng')";
mysqli_query($conn, $query);
echo "OK";
?>
+422
View File
@@ -0,0 +1,422 @@
<?php
session_start();
if(!isset($_SESSION['id'])){
header("Location: login.php");
exit;
}
include "config/koneksi.php";
$role = $_SESSION['role'];
$view = $_GET['view'] ?? 'status';
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Sistem Bantuan WebGIS</title>
<style>
body{
font-family:Segoe UI;
background:#eef2f7;
margin:0;
}
.header{
background:linear-gradient(135deg,#0f766e,#14b8a6);
color:white;
padding:15px 20px;
}
.container{
max-width:1100px;
margin:auto;
padding:20px;
}
.nav{
display:flex;
gap:10px;
flex-wrap:wrap;
margin:15px 0;
}
.nav a{
background:#0f766e;
color:white;
padding:8px 12px;
border-radius:8px;
text-decoration:none;
font-size:13px;
}
.card{
background:white;
padding:15px;
margin-bottom:12px;
border-radius:12px;
box-shadow:0 8px 20px rgba(0,0,0,0.05);
border-left:5px solid #0ea5e9;
}
.badge{
padding:4px 10px;
border-radius:20px;
font-size:12px;
display:inline-block;
margin-top:5px;
}
.pending{background:#fef3c7;}
.disetujui{background:#dbeafe;}
.diserahkan{background:#dcfce7;}
button{
padding:7px 10px;
border:none;
border-radius:8px;
cursor:pointer;
font-size:13px;
margin-top:8px;
}
.green{background:#22c55e;color:white;}
.blue{background:#0ea5e9;color:white;}
.red{background:#ef4444;color:white;}
/* FORM */
.form-box{
display:none;
background:white;
padding:15px;
border-radius:12px;
box-shadow:0 10px 25px rgba(0,0,0,0.1);
margin-bottom:15px;
}
input,select,textarea{
width:100%;
padding:8px;
margin-top:6px;
margin-bottom:10px;
border:1px solid #ddd;
border-radius:8px;
}
</style>
</head>
<body>
<div class="header">
<h2>🎁 Sistem Bantuan WebGIS</h2>
<p>Role: <b><?= strtoupper($role) ?></b></p>
</div>
<div class="container">
<!-- NAV -->
<div class="nav">
<?php if($role=="admin"){ ?>
<a href="bantuan.php?view=validasi">📊 Validasi</a>
<a href="bantuan.php?view=monitoring">📈 Monitoring</a>
<a href="bantuan.php?view=riwayat">📦 Riwayat</a>
<?php } ?>
<?php if($role=="pengurus"){ ?>
<a href="bantuan.php?view=distribusi">🎁 Distribusi</a>
<a href="bantuan.php?view=radius">📍 Radius</a>
<a href="bantuan.php?view=riwayat">📦 Riwayat</a>
<?php } ?>
<?php if($role=="pengguna"){ ?>
<a href="bantuan.php?view=status">📦 Status Saya</a>
<a href="bantuan.php?view=riwayat">📦 Riwayat</a>
<?php } ?>
<a href="index.php">🏠 Dashboard</a>
</div>
<!-- FORM DISTRIBUSI -->
<div class="form-box" id="formBantuan">
<h3>🎁 Distribusi Bantuan</h3>
<form method="POST" action="api/bantuan_create.php">
<input type="hidden" name="keluarga_id" id="keluarga_id">
<label>Jenis</label>
<select name="jenis">
<option value="uang">Uang</option>
<option value="barang">Barang</option>
</select>
<label>Jumlah</label>
<input type="text" name="jumlah">
<label>Keterangan</label>
<textarea name="keterangan"></textarea>
<button class="green" type="submit">Simpan</button>
<button class="red" type="button" onclick="closeForm()">Tutup</button>
</form>
</div>
<!-- ================= DISTRIBUSI ================= -->
<?php if($role=="pengurus" && $view=="distribusi"){ ?>
<h3>🎁 Distribusi Bantuan</h3>
<?php
$q = mysqli_query($conn,"SELECT * FROM keluarga_miskin WHERE status_bantuan='belum'");
while($d = mysqli_fetch_assoc($q)){
?>
<div class="card">
<b><?= $d['nama'] ?></b><br>
NIK: <?= $d['nik'] ?><br>
Prioritas: <?= $d['prioritas'] ?><br>
<button class="green" onclick="openForm(<?= $d['id'] ?>)">
Beri Bantuan
</button>
</div>
<?php } ?>
<?php } ?>
<!-- ================= VALIDASI ================= -->
<?php if($role=="admin" && $view=="validasi"){ ?>
<h3>📊 Validasi Bantuan</h3>
<?php
$q = mysqli_query($conn,"
SELECT b.*, k.nama, k.nik
FROM bantuan b
JOIN keluarga_miskin k ON b.keluarga_id=k.id
ORDER BY b.id DESC
");
while($d = mysqli_fetch_assoc($q)){
?>
<div class="card">
<b><?= $d['nama'] ?></b><br>
<?= $d['nik'] ?><br>
<?= $d['jenis'] ?> - <?= $d['jumlah'] ?><br>
<span class="badge <?= $d['status'] ?>">
<?= strtoupper($d['status']) ?>
</span>
<br>
<a href="api/bantuan_update_status.php?id=<?= $d['id'] ?>&status=disetujui">
<button class="green">Setujui</button>
</a>
<a href="api/bantuan_update_status.php?id=<?= $d['id'] ?>&status=diserahkan">
<button class="blue">Serahkan</button>
</a>
</div>
<?php } ?>
<?php } ?>
<!-- ================= MONITORING ================= -->
<?php if($role=="admin" && $view=="monitoring"){ ?>
<h3>📈 Monitoring Lengkap</h3>
<h4>🏛 Rumah Ibadah</h4>
<?php
$q = mysqli_query($conn,"SELECT * FROM rumah_ibadah");
while($d = mysqli_fetch_assoc($q)){
echo "<div class='card'>".$d['nama']." - ".$d['radius']."m</div>";
}
?>
<h4>👨‍👩‍👧 Keluarga</h4>
<?php
$q = mysqli_query($conn,"SELECT * FROM keluarga_miskin");
while($d = mysqli_fetch_assoc($q)){
echo "<div class='card'>".$d['nama']." - ".$d['status_bantuan']."</div>";
}
?>
<h4>🎁 Bantuan</h4>
<?php
$q = mysqli_query($conn,"SELECT * FROM bantuan");
while($d = mysqli_fetch_assoc($q)){
echo "<div class='card'>".$d['jenis']." - ".$d['status']."</div>";
}
?>
<?php } ?>
<!-- ================= STATUS USER ================= -->
<?php if($role=="pengguna" && $view=="status"){ ?>
<h3>📦 Status Bantuan Saya</h3>
<?php
$q = mysqli_query($conn,"
SELECT b.*, k.nama
FROM bantuan b
JOIN keluarga_miskin k ON b.keluarga_id=k.id
");
while($d = mysqli_fetch_assoc($q)){
?>
<div class="card">
<b><?= $d['nama'] ?></b><br>
<?= $d['jenis'] ?> - <?= $d['jumlah'] ?><br>
<span class="badge <?= $d['status'] ?>">
<?= $d['status'] ?>
</span>
</div>
<?php } ?>
<?php } ?>
<!-- ================= RIWAYAT ================= -->
<?php if($view=="riwayat"){ ?>
<h3>📦 Riwayat Bantuan</h3>
<?php
$q = mysqli_query($conn,"
SELECT b.*, k.nama
FROM bantuan b
JOIN keluarga_miskin k ON b.keluarga_id=k.id
WHERE b.status='diserahkan'
");
while($d = mysqli_fetch_assoc($q)){
?>
<div class="card">
<b><?= $d['nama'] ?></b><br>
<?= $d['jenis'] ?> - <?= $d['jumlah'] ?><br>
Status: <?= $d['status'] ?>
</div>
<?php } ?>
<?php } ?>
<!-- ================= RADIUS MONITORING (DETAIL LIST) ================= -->
<?php if($role=="pengurus" && $view=="radius"){ ?>
<h3 style="margin-bottom:10px;">📍 Monitoring Radius Rumah Ibadah</h3>
<?php
$ib = mysqli_query($conn,"SELECT * FROM rumah_ibadah");
while($i = mysqli_fetch_assoc($ib)){
$kel_dalam = [];
$kel_luar = [];
$kls = mysqli_query($conn,"SELECT * FROM keluarga_miskin");
while($k = mysqli_fetch_assoc($kls)){
$jarak = 6371000 * acos(
cos(deg2rad($i['lat'])) *
cos(deg2rad($k['lat'])) *
cos(deg2rad($k['lng']) - deg2rad($i['lng'])) +
sin(deg2rad($i['lat'])) *
sin(deg2rad($k['lat']))
);
if($jarak <= $i['radius']){
$kel_dalam[] = $k;
} else {
$kel_luar[] = $k;
}
}
?>
<!-- CARD RUMAH IBADAH -->
<div class="card">
<div style="font-size:16px;font-weight:bold;color:#0f766e;">
🏛 <?= $i['nama'] ?>
</div>
<div style="font-size:13px;margin-top:5px;">
Radius: <b><?= $i['radius'] ?> meter</b><br>
Alamat: <?= $i['alamat'] ?>
</div>
<hr style="margin:10px 0;">
<!-- DALAM RADIUS -->
<div style="margin-bottom:10px;">
<span style="background:#dcfce7;color:#166534;padding:4px 10px;border-radius:20px;font-size:12px;">
🟢 DALAM RADIUS (<?= count($kel_dalam) ?>)
</span>
<div style="margin-top:8px;">
<?php foreach($kel_dalam as $k){ ?>
<div style="padding:6px;border:1px solid #dcfce7;border-radius:8px;margin-top:5px;background:#f0fdf4;">
👤 <?= $k['nama'] ?> - <?= $k['nik'] ?>
</div>
<?php } ?>
</div>
</div>
<!-- LUAR RADIUS -->
<div>
<span style="background:#fee2e2;color:#991b1b;padding:4px 10px;border-radius:20px;font-size:12px;">
🔴 LUAR RADIUS (<?= count($kel_luar) ?>)
</span>
<div style="margin-top:8px;">
<?php foreach($kel_luar as $k){ ?>
<div style="padding:6px;border:1px solid #fee2e2;border-radius:8px;margin-top:5px;background:#fff1f2;">
👤 <?= $k['nama'] ?> - <?= $k['nik'] ?>
</div>
<?php } ?>
</div>
</div>
</div>
<?php } ?>
<?php } ?>
</div>
<script>
function openForm(id){
document.getElementById("formBantuan").style.display="block";
document.getElementById("keluarga_id").value=id;
}
function closeForm(){
document.getElementById("formBantuan").style.display="none";
}
</script>
</body>
</html>
+7
View File
@@ -0,0 +1,7 @@
<?php
$conn = mysqli_connect("localhost","root","","pemetaan_kemiskinan");
if(!$conn){
die("Koneksi gagal");
}
?>
+265
View File
@@ -0,0 +1,265 @@
<?php
session_start();
if(!isset($_SESSION['id'])){
header("Location:login.php");
exit;
}
$role = $_SESSION['role'];
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Dashboard WebGIS</title>
<style>
/* ===== GLOBAL ===== */
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Segoe UI, sans-serif;
}
body{
display:flex;
height:100vh;
background:#f4f7fb;
}
/* ===== SIDEBAR ===== */
.sidebar{
width:260px;
background:#0f766e;
color:white;
padding:20px;
display:flex;
flex-direction:column;
}
.sidebar h2{
font-size:20px;
margin-bottom:10px;
}
.role-box{
background:rgba(255,255,255,0.15);
padding:10px;
border-radius:10px;
margin-bottom:15px;
font-size:13px;
}
.role-badge{
display:inline-block;
margin-top:5px;
padding:4px 10px;
border-radius:20px;
background:#22c55e;
font-size:12px;
}
/* MENU */
.menu a{
display:block;
padding:10px;
margin-bottom:8px;
background:rgba(255,255,255,0.12);
color:white;
text-decoration:none;
border-radius:8px;
font-size:14px;
transition:0.2s;
}
.menu a:hover{
background:rgba(255,255,255,0.25);
transform:translateX(3px);
}
/* ===== CONTENT ===== */
.content{
flex:1;
padding:25px;
overflow:auto;
}
.header h1{
font-size:24px;
margin-bottom:5px;
}
.header p{
color:#6b7280;
margin-bottom:20px;
}
/* CARD */
.cards{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
gap:15px;
}
.card{
background:white;
padding:20px;
border-radius:15px;
box-shadow:0 10px 25px rgba(0,0,0,0.06);
border-left:5px solid #0ea5e9;
}
.card h3{
font-size:20px;
margin-bottom:8px;
}
.card p{
color:#6b7280;
font-size:13px;
}
.tag{
display:inline-block;
margin-top:10px;
padding:5px 10px;
background:#e0f2fe;
color:#0369a1;
border-radius:20px;
font-size:12px;
}
</style>
</head>
<body>
<!-- SIDEBAR -->
<div class="sidebar">
<h2>🌿 WebGIS Kemiskinan</h2>
<div class="role-box">
Login sebagai<br>
<strong><?= $_SESSION['nama'] ?></strong><br>
<span class="role-badge"><?= strtoupper($role) ?></span>
</div>
<div class="menu">
<a href="index.php">🏠 Dashboard</a>
<a href="peta.php">🗺️ Peta Interaktif</a>
<!-- ADMIN -->
<?php if($role == "admin"){ ?>
<a href="bantuan.php?view=validasi">📊 Validasi Bantuan</a>
<a href="bantuan.php?view=monitoring">📈 Semua Data Monitoring</a>
<?php } ?>
<!-- PENGURUS (RUMAH IBADAH) -->
<?php if($role == "pengurus"){ ?>
<a href="bantuan.php?view=distribusi">🎁 Distribusi Bantuan</a>
<a href="bantuan.php?view=radius">📍 Data Radius Monitoring</a>
<?php } ?>
<!-- PENGGUNA (KELUARGA MISKIN) -->
<?php if($role == "pengguna"){ ?>
<a href="bantuan.php?view=status">📦 Status Bantuan Saya</a>
<?php } ?>
<a href="logout.php">🚪 Logout</a>
</div>
</div>
<!-- CONTENT -->
<div class="content">
<div class="header">
<h1>
<?php
if($role=="admin") echo "Admin Dashboard";
elseif($role=="pengurus") echo "Dashboard Pengurus Rumah Ibadah";
else echo "Dashboard Keluarga";
?>
</h1>
<p>
<?php
if($role=="admin"){
echo "Monitoring seluruh sistem, validasi bantuan, dan kontrol data.";
}elseif($role=="pengurus"){
echo "Mengelola rumah ibadah dan distribusi bantuan di wilayah radius.";
}else{
echo "Melihat status bantuan dan menginput data keluarga miskin.";
}
?>
</p>
</div>
<div class="cards">
<?php if($role=="admin"){ ?>
<div class="card">
<h3>⚙️ Kontrol Sistem</h3>
<p>Kelola semua user dan data sistem</p>
<span class="tag">Full Access</span>
</div>
<div class="card">
<h3>📊 Monitoring Global</h3>
<p>Semua data rumah ibadah & keluarga miskin</p>
<span class="tag">Admin View</span>
</div>
<?php } ?>
<?php if($role=="pengurus"){ ?>
<div class="card">
<h3>🏛️ Rumah Ibadah</h3>
<p>Input dan kelola lokasi rumah ibadah</p>
<span class="tag">Input Data</span>
</div>
<div class="card">
<h3>🎁 Distribusi Bantuan</h3>
<p>Memberikan bantuan ke keluarga miskin</p>
<span class="tag">Aid System</span>
</div>
<?php } ?>
<?php if($role=="pengguna"){ ?>
<div class="card">
<h3>👨‍👩‍👧 Data Keluarga</h3>
<p>Input data keluarga miskin</p>
<span class="tag">User Input</span>
</div>
<div class="card">
<h3>📦 Bantuan Saya</h3>
<p>Status bantuan yang diterima</p>
<span class="tag">Tracking</span>
</div>
<?php } ?>
<div class="card">
<h3>🗺️ Peta GIS</h3>
<p>Akses peta interaktif seluruh data</p>
<span class="tag">WebGIS</span>
</div>
</div>
</div>
</body>
</html>
+186
View File
@@ -0,0 +1,186 @@
<?php session_start(); ?>
<!DOCTYPE html>
<html lang="id">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Login WebGIS Kemiskinan</title>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css" rel="stylesheet">
<style>
*{
margin:0;
padding:0;
box-sizing:border-box;
font-family:Segoe UI, sans-serif;
}
body{
height:100vh;
display:flex;
justify-content:center;
align-items:center;
background:linear-gradient(135deg,#0ea5e9,#10b981);
position:relative;
overflow:hidden;
}
/* efek background halus */
body::before{
content:"";
position:absolute;
width:400px;
height:400px;
background:rgba(255,255,255,0.1);
border-radius:50%;
top:-100px;
left:-100px;
}
body::after{
content:"";
position:absolute;
width:300px;
height:300px;
background:rgba(255,255,255,0.08);
border-radius:50%;
bottom:-100px;
right:-100px;
}
.card{
width:360px;
background:white;
border-radius:18px;
padding:30px;
box-shadow:0 15px 40px rgba(0,0,0,0.2);
z-index:1;
animation:fadeIn .5s ease;
}
@keyframes fadeIn{
from{opacity:0;transform:translateY(20px);}
to{opacity:1;transform:translateY(0);}
}
.logo{
text-align:center;
margin-bottom:15px;
}
.logo i{
font-size:40px;
color:#0ea5e9;
}
h2{
text-align:center;
margin-bottom:20px;
color:#0f172a;
font-size:20px;
}
.input-group{
margin-bottom:12px;
position:relative;
}
.input-group i{
position:absolute;
left:10px;
top:50%;
transform:translateY(-50%);
color:#94a3b8;
}
input{
width:100%;
padding:12px 12px 12px 35px;
border:1px solid #e2e8f0;
border-radius:10px;
outline:none;
transition:0.2s;
}
input:focus{
border-color:#0ea5e9;
box-shadow:0 0 0 3px rgba(14,165,233,0.2);
}
button{
width:100%;
padding:12px;
border:none;
border-radius:10px;
background:linear-gradient(135deg,#0ea5e9,#10b981);
color:white;
font-weight:bold;
cursor:pointer;
transition:0.2s;
margin-top:5px;
}
button:hover{
transform:scale(1.02);
}
.footer{
text-align:center;
margin-top:15px;
font-size:11px;
color:#64748b;
}
.role-info{
text-align:center;
font-size:12px;
color:#0f766e;
margin-bottom:10px;
}
</style>
</head>
<body>
<div class="card">
<div class="logo">
<i class="fa-solid fa-map-location-dot"></i>
</div>
<h2>WebGIS Kemiskinan</h2>
<div class="role-info">
Admin • Pengurus • Pengguna
</div>
<form method="POST" action="api/login.php">
<div class="input-group">
<i class="fa fa-user"></i>
<input name="username" placeholder="Username" required>
</div>
<div class="input-group">
<i class="fa fa-lock"></i>
<input name="password" type="password" placeholder="Password" required>
</div>
<button type="submit">
LOGIN
</button>
</form>
<div class="footer">
Sistem Pemetaan Kemiskinan Berbasis GIS
</div>
</div>
</body>
</html>
+5
View File
@@ -0,0 +1,5 @@
<?php
session_start();
session_destroy();
header("Location:login.php");
?>
+500
View File
@@ -0,0 +1,500 @@
<?php
session_start();
if(!isset($_SESSION['id'])){
header("Location: login.php");
exit;
}
$role = $_SESSION['role'];
?>
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>WebGIS Kemiskinan</title>
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css"/>
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
<style>
*{margin:0;padding:0;box-sizing:border-box;font-family:Segoe UI;}
body{display:flex;height:100vh;background:#eef2f7;}
.sidebar{
width:380px;background:#fff;padding:15px;
overflow-y:auto;box-shadow:4px 0 20px rgba(0,0,0,0.08);
}
h2{font-size:16px;color:#0f766e;margin-bottom:10px;}
.role-box{
padding:10px;border-radius:10px;
background:#ecfeff;border:1px solid #a5f3fc;
font-size:12px;margin-bottom:10px;
}
.menu{
display:flex;
gap:8px;
margin-bottom:10px;
}
.menu button{
flex:1;
padding:8px;
border:none;
border-radius:10px;
background:linear-gradient(135deg,#0ea5e9,#10b981);
color:white;
font-size:12px;
cursor:pointer;
}
.menu a{
flex:1;
text-decoration:none;
text-align:center;
padding:8px;
border-radius:10px;
background:linear-gradient(135deg,#64748b,#334155);
color:white;
font-size:12px;
display:flex;
align-items:center;
justify-content:center;
}
.section{
background:#f8fafc;border:1px solid #e2e8f0;
border-radius:12px;padding:10px;margin-bottom:10px;
}
label{font-size:11px;color:#334155;margin-top:6px;display:block;}
input,select,textarea{
width:100%;padding:7px;margin-top:4px;
border-radius:8px;border:1px solid #cbd5e1;
font-size:12px;
}
textarea{height:60px;}
button.action{
width:100%;padding:9px;margin-top:10px;
border:none;border-radius:10px;
background:linear-gradient(135deg,#0ea5e9,#10b981);
color:white;font-weight:bold;font-size:12px;
cursor:pointer;
}
#map{flex:1;}
.hidden{display:none;}
</style>
</head>
<body>
<?php
$dashboard = "index.php";
if(isset($_SESSION['role'])){
if($_SESSION['role'] == "admin"){
$dashboard = "index.php";
} elseif($_SESSION['role'] == "pengurus"){
$dashboard = "index.php";
} elseif($_SESSION['role'] == "pengguna"){
$dashboard = "index.php";
}
}
?>
<div class="sidebar">
<h2>🗺 WebGIS Kemiskinan</h2>
<div class="role-box">
Role: <b><?= htmlspecialchars($role) ?></b>
</div>
<div class="menu">
<?php if($role == 'admin' || $role == 'pengurus'): ?>
<button onclick="setMode('ibadah')">🏛 Rumah Ibadah</button>
<?php endif; ?>
<?php if($role == 'admin' || $role == 'pengguna'): ?>
<button onclick="setMode('miskin')">👨‍👩‍👧 Keluarga</button>
<?php endif; ?>
<a href="<?= $dashboard ?>">⬅ Dashboard</a>
</div>
<div class="section">
<label>Latitude</label>
<input id="lat" readonly>
<label>Longitude</label>
<input id="lng" readonly>
</div>
<div class="section hidden" id="formIbadah">
<h3 style="font-size:13px;color:#0f766e;">Form Rumah Ibadah</h3>
<input type="hidden" id="ibadah_id">
<input id="namaI" placeholder="Nama">
<select id="jenisI">
<option>Masjid</option><option>Gereja</option>
<option>Vihara</option><option>Klenteng</option><option>Pura</option>
</select>
<textarea id="alamatI" placeholder="Alamat"></textarea>
<input id="ketuaI" placeholder="Ketua">
<input id="hpI" placeholder="No HP">
<select id="radiusI">
<option value="100">100m</option>
<option value="200">200m</option>
<option value="300">300m</option>
<option value="400">400m</option>
<option value="500">500m</option>
</select>
<button class="action" onclick="saveIbadah()">Simpan</button>
</div>
<div class="section hidden" id="formMiskin">
<h3 style="font-size:13px;color:#0f766e;">Form Keluarga</h3>
<input type="hidden" id="miskin_id">
<input id="nik" placeholder="NIK">
<input id="namaKK" placeholder="Nama KK">
<textarea id="alamatM" placeholder="Alamat"></textarea>
<select id="penghasilan">
<option>100k-500k</option>
<option>500k-1jt</option>
<option>1jt-2jt</option>
<option>2jt+</option>
</select>
<select id="prioritas">
<option>Tinggi</option>
<option>Sedang</option>
<option>Rendah</option>
</select>
<button class="action" onclick="saveMiskin()">Simpan</button>
</div>
</div>
<div id="map"></div>
<script>
// Tangkap Role dari PHP ke JS
const userRole = "<?= $role ?>";
const map = L.map('map').setView([-0.02,109.34],13);
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
async function getAlamat(lat, lng){
try {
let res = await fetch(
`https://nominatim.openstreetmap.org/reverse?format=jsonv2&lat=${lat}&lon=${lng}`
);
let data = await res.json();
return data.display_name || "Alamat tidak ditemukan";
} catch (e) {
return "Alamat tidak ditemukan";
}
}
// Diperbaiki string url icon yang error pada script aslinya
const iconIbadah = L.icon({iconUrl:'http://maps.google.com/mapfiles/ms/icons/blue-dot.png'});
const iconHijau = L.icon({iconUrl:'http://maps.google.com/mapfiles/ms/icons/green-dot.png'});
const iconMerah = L.icon({iconUrl:'http://maps.google.com/mapfiles/ms/icons/red-dot.png'});
// 🔥 MARKER TEMPORARY
let tempMarker = null;
let tempLat=null,tempLng=null;
// Set mode default berdasarkan role
let mode = (userRole === "pengguna") ? "miskin" : "ibadah";
function setMode(m){
mode=m;
document.getElementById('formIbadah').classList.toggle('hidden',m!=='ibadah');
document.getElementById('formMiskin').classList.toggle('hidden',m!=='miskin');
clearForm();
}
// Inisialisasi tampilan mode pertama kali
setMode(mode);
// ================= MAP CLICK (FIXED + PREVIEW MARKER) =================
map.on('click', async (e)=>{
// Mencegah pengguna memasukkan titik jika mode tidak sesuai
if(userRole === 'pengguna' && mode !== 'miskin') return;
if(userRole === 'pengurus' && mode !== 'ibadah') return;
tempLat = e.latlng.lat;
tempLng = e.latlng.lng;
lat.value = tempLat;
lng.value = tempLng;
// 🔥 AUTO ALAMAT
let alamatAuto = await getAlamat(tempLat, tempLng);
// isi ke form aktif
if(mode === "ibadah"){
alamatI.value = alamatAuto;
} else {
alamatM.value = alamatAuto;
}
// 🔥 HAPUS MARKER LAMA
if(tempMarker){
map.removeLayer(tempMarker);
}
// 🔥 TAMBAH MARKER BARU (PREVIEW)
tempMarker = L.marker([tempLat,tempLng]).addTo(map)
.bindPopup("📍 Lokasi dipilih").openPopup();
});
function clearForm(){
ibadah_id.value="";
miskin_id.value="";
namaI.value="";ketuaI.value="";hpI.value="";alamatI.value="";radiusI.value="100";
nik.value="";namaKK.value="";alamatM.value="";
}
// ================= SAVE =================
function saveIbadah(){
if(userRole === 'pengguna') return alert("Akses Ditolak");
let id=ibadah_id.value;
fetch(id?"api/rumah_ibadah_update.php":"api/rumah_ibadah_create.php",{
method:"POST",
headers:{"Content-Type":"application/x-www-form-urlencoded"},
body:new URLSearchParams({
id:id,
nama:namaI.value,
jenis:jenisI.value,
alamat:alamatI.value,
ketua_pengurus:ketuaI.value,
no_hp:hpI.value,
radius:radiusI.value,
lat:tempLat,
lng:tempLng
})
}).then(()=>{clearForm();loadData();});
}
function saveMiskin(){
if(userRole === 'pengurus') return alert("Akses Ditolak");
let id=miskin_id.value;
fetch(id?"api/keluarga_update.php":"api/keluarga_create.php",{
method:"POST",
headers:{"Content-Type":"application/x-www-form-urlencoded"},
body:new URLSearchParams({
id:id,
nik:nik.value,
nama_kepala_keluarga:namaKK.value,
alamat:alamatM.value,
penghasilan:penghasilan.value,
prioritas:prioritas.value,
lat:tempLat,
lng:tempLng
})
}).then(()=>{clearForm();loadData();});
}
// ================= DATA =================
let ibadah=[],miskin=[];
function loadData(){
fetch("api/rumah_ibadah_read.php").then(r=>r.json()).then(d=>ibadah=d||[]).then(render);
fetch("api/keluarga_read.php").then(r=>r.json()).then(d=>miskin=d||[]).then(render);
}
loadData();
// ================= EDIT =================
function editIbadah(i){
if(userRole === 'pengguna') return;
setMode('ibadah');
ibadah_id.value=i.id;
namaI.value=i.nama;
jenisI.value=i.jenis;
alamatI.value=i.alamat;
ketuaI.value=i.ketua_pengurus;
hpI.value=i.no_hp;
radiusI.value=i.radius;
}
function editMiskin(m){
if(userRole === 'pengurus') return;
setMode('miskin');
miskin_id.value=m.id;
nik.value=m.nik;
namaKK.value=m.nama_kepala_keluarga;
alamatM.value=m.alamat;
penghasilan.value=m.penghasilan;
prioritas.value=m.prioritas;
}
// ================= DELETE =================
function hapusIbadah(id){
if(userRole === 'pengguna') return;
if(!confirm("Hapus data?")) return;
fetch("api/rumah_ibadah_delete.php",{
method:"POST",
headers:{"Content-Type":"application/x-www-form-urlencoded"},
body:new URLSearchParams({id:id})
}).then(()=>loadData());
}
function hapusMiskin(id){
if(userRole === 'pengurus') return;
if(!confirm("Hapus data?")) return;
fetch("api/keluarga_delete.php",{
method:"POST",
headers:{"Content-Type":"application/x-www-form-urlencoded"},
body:new URLSearchParams({id:id})
}).then(()=>loadData());
}
// ================= RENDER =================
function render(){
map.eachLayer(l=>{
if(l instanceof L.Marker || l instanceof L.Circle) map.removeLayer(l);
});
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png').addTo(map);
// IBADAH
ibadah.forEach(i=>{
let r=Number(i.radius)||100;
L.circle([i.lat,i.lng],{
radius:r,color:"#0ea5e9",fillOpacity:0.12
}).addTo(map);
// Hanya tampilkan tombol jika admin atau pengurus
let ibadahActions = "";
if(userRole === 'admin' || userRole === 'pengurus'){
ibadahActions = `
<div style="display:flex;gap:6px;margin-top:10px;">
<button onclick="editIbadah(ibadah.find(x=>x.id==${i.id}))"
style="flex:1;padding:6px;border:none;border-radius:8px;
background:#0ea5e9;color:white;font-size:11px;cursor:pointer;">
✏ Edit
</button>
<button onclick="hapusIbadah(${i.id})"
style="flex:1;padding:6px;border:none;border-radius:8px;
background:#ef4444;color:white;font-size:11px;cursor:pointer;">
🗑 Hapus
</button>
</div>`;
}
L.marker([i.lat,i.lng],{icon:iconIbadah})
.addTo(map)
.bindPopup(`
<div style="
font-family:Segoe UI;
min-width:220px;
background:#ffffff;
border-radius:12px;
padding:10px;
box-shadow:0 10px 20px rgba(0,0,0,0.15);
">
<div style="font-weight:bold;font-size:14px;color:#0ea5e9;margin-bottom:6px;">
🏛 ${i.nama}
</div>
<div style="font-size:12px;line-height:1.6;color:#334155">
<b>Jenis:</b> ${i.jenis}<br>
<b>Alamat:</b> ${i.alamat}<br>
<b>Ketua:</b> ${i.ketua_pengurus}<br>
<b>No HP:</b> ${i.no_hp}<br>
<b>Radius:</b> <span style="color:#10b981;font-weight:bold">${i.radius} m</span>
</div>
${ibadahActions}
</div>
`);
});
// MISKIN
miskin.forEach(m=>{
let status="LUAR",icon=iconMerah;
ibadah.forEach(i=>{
if(map.distance([m.lat,m.lng],[i.lat,i.lng])<=Number(i.radius||100)){
status="DALAM";icon=iconHijau;
}
});
// Hanya tampilkan tombol jika admin atau pengguna
let miskinActions = "";
if(userRole === 'admin' || userRole === 'pengguna'){
miskinActions = `
<div style="display:flex;gap:6px;margin-top:10px;">
<button onclick="editMiskin(miskin.find(x=>x.id==${m.id}))"
style="flex:1;padding:6px;border:none;border-radius:8px;
background:#0ea5e9;color:white;font-size:11px;cursor:pointer;">
✏ Edit
</button>
<button onclick="hapusMiskin(${m.id})"
style="flex:1;padding:6px;border:none;border-radius:8px;
background:#ef4444;color:white;font-size:11px;cursor:pointer;">
🗑 Hapus
</button>
</div>`;
}
L.marker([m.lat,m.lng],{icon})
.addTo(map)
.bindPopup(`
<div style="
font-family:Segoe UI;
min-width:220px;
background:#ffffff;
border-radius:12px;
padding:10px;
box-shadow:0 10px 20px rgba(0,0,0,0.15);
">
<div style="font-weight:bold;font-size:14px;color:#10b981;margin-bottom:6px;">
<b>👨‍👩‍👧 ${m.nama_kepala_keluarga || m.nama}</b><br>
</div>
<div style="font-size:12px;line-height:1.6;color:#334155">
<b>NIK:</b> ${m.nik}<br>
<b>Alamat:</b> ${m.alamat}<br>
<b>Penghasilan:</b> ${m.penghasilan_kategori || m.penghasilan}<br>
<b>Prioritas:</b> ${m.prioritas}<br>
<b>Status:</b> <span style="color:${status=='DALAM'?'#10b981':'#ef4444'};font-weight:bold">
${status}
</span>
</div>
${miskinActions}
</div>
`);
});
}
</script>
</body>
</html>