GuavaPopper
8476c5d643
- Add AdminUserController: CRUD users, assign role, reset password,
self-delete guard (403 on own account)
- Add admin route group under role:administrator middleware
(GET/POST/PUT/DELETE /api/admin/users, PUT /api/admin/users/{id}/password)
- Add resources/views/admin/users.blade.php: DaisyUI table + 4 modals
(create, edit, reset password, delete confirm), stats grid, toast
- Add Admin nav link (administrator-only) to map and data navbars
- 9 new tests covering page access, API CRUD, self-delete guard, password reset
- Mark Plan 3 complete in missing_features.md; update README page list
- Save plan3 to docs/ for reference
Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
140 lines
6.5 KiB
Markdown
140 lines
6.5 KiB
Markdown
# Dokumentasi Fungsional: WebGIS Pemetaan Kemiskinan
|
|
|
|
Proyek ini adalah sistem informasi geografis (WebGIS) berbasis web yang dirancang untuk memetakan sebaran rumah ibadah dan keluarga kurang mampu (miskin). Sistem ini memungkinkan pengguna untuk melakukan analisis spasial berdasarkan radius untuk mengetahui dampak atau jangkauan layanan rumah ibadah terhadap komunitas di sekitarnya.
|
|
|
|
## Filosofi & Latar Belakang
|
|
|
|
Proyek ini dibangun atas dasar filosofi kepedulian sosial, di mana rumah ibadah memiliki peran sentral dalam kesejahteraan masyarakat di sekitarnya. Prinsip utama sistem ini adalah:
|
|
> **Setiap keluarga kurang mampu yang tinggal di sekitar rumah ibadah dianggap sebagai tanggungan atau prioritas utama untuk mendapatkan bantuan dari rumah ibadah tersebut.**
|
|
|
|
Dengan adanya sistem WebGIS ini, pengelola rumah ibadah dapat dengan mudah memetakan siapa saja yang membutuhkan bantuan dalam radius tertentu, sehingga distribusi bantuan menjadi lebih tepat sasaran dan terorganisir.
|
|
|
|
## Fitur Utama
|
|
|
|
### 1. Peta Interaktif (Interactive WebGIS)
|
|
Menggunakan library **Leaflet.js**, sistem menyediakan antarmuka peta yang responsif dengan fitur:
|
|
- **Toggle Layer**: Berpindah antara tampilan jalan (Street) dan citra satelit.
|
|
- **Marker Kustom**: Ikon berbeda untuk membedakan antara Rumah Ibadah (hijau) dan Rumah Miskin (merah).
|
|
- **Geocoding Otomatis**: Saat menambahkan data baru, sistem secara otomatis mengambil alamat lengkap berdasarkan koordinat klik menggunakan OpenStreetMap Nominatim.
|
|
|
|
### 2. Manajemen Data (CRUD)
|
|
Sistem mendukung pengelolaan data secara penuh:
|
|
- **Tambah Data via Peta**: Klik pada lokasi di peta untuk memunculkan formulir input data baru.
|
|
- **Edit Data via Form**: Klik tombol "Edit" pada popup marker di peta atau pada baris di tabel data untuk membuka formulir edit. Mendukung pembaruan semua field teks untuk Rumah Ibadah (nama, jenis, pengurus, telepon, jemaah, radius, keterangan) dan Keluarga Miskin (nama KK, jumlah jiwa, pekerjaan, pendapatan, kondisi, keterangan).
|
|
- **Update Lokasi (Drag & Drop)**: Marker dapat digeser (drag) untuk memperbarui koordinat lokasi di database secara real-time.
|
|
- **Hapus Data**: Menghapus data melalui popup pada marker atau melalui tabel data.
|
|
- **Ownership Rumah Ibadah**: Pengurus Rumah Ibadah hanya dapat mengubah atau menghapus data rumah ibadah yang mereka tambahkan sendiri. Administrator dapat mengubah semua data.
|
|
- **Data Tabular**: Halaman khusus yang menampilkan seluruh data dalam bentuk tabel dengan statistik ringkasan.
|
|
|
|
### 3. Analisis Spasial Radius
|
|
Fitur unggulan untuk menganalisis sebaran keluarga miskin di sekitar rumah ibadah:
|
|
- **Analisis Otomatis**: Mengklik marker rumah ibadah akan langsung memunculkan lingkaran radius dan panel statistik.
|
|
- **Penghitungan Real-time**: Menggunakan **Turf.js**, sistem menghitung secara instan jumlah rumah, jumlah Kepala Keluarga (KK), dan jumlah Jiwa yang berada di dalam radius terpilih.
|
|
- **Slider Radius**: Pengguna dapat menggeser slider (50m hingga 2000m) untuk melihat perubahan statistik secara dinamis.
|
|
- **Highlight Visual**: Marker rumah miskin yang masuk ke dalam radius akan berubah warna menjadi kuning untuk memudahkan identifikasi visual.
|
|
|
|
## Arsitektur Teknis
|
|
|
|
Proyek ini telah dimigrasikan ke framework **Laravel 13** dengan struktur sebagai berikut:
|
|
|
|
- **Backend**:
|
|
- **Laravel Eloquent**: Digunakan untuk interaksi database yang aman dan efisien.
|
|
- **RESTful API**: Menyediakan endpoint `/api/ibadah` dan `/api/miskin` untuk komunikasi frontend-backend.
|
|
- **Migrations**: Skema database yang terstruktur dan mudah dikelola.
|
|
- **Frontend**:
|
|
- **Blade Templates**: Mesin templating Laravel untuk antarmuka yang dinamis.
|
|
- **Tailwind CSS & DaisyUI**: Memberikan desain antarmuka yang modern, premium, dan responsif.
|
|
- **JavaScript (Vanilla)**: Menangani logika peta dan interaksi API tanpa beban framework berat.
|
|
- **Database**: MySQL/MariaDB untuk penyimpanan data spasial dan atribut.
|
|
|
|
## Cara Menjalankan Project
|
|
|
|
Cara utama untuk menjalankan project ini adalah menggunakan **Docker Compose**. Setup Docker sudah mencakup Laravel app, Vite dev server, dan MySQL.
|
|
|
|
### Prasyarat
|
|
|
|
- Docker Desktop sudah terinstall dan berjalan.
|
|
- Port `8000`, `5173`, dan `3307` sedang tidak dipakai aplikasi lain.
|
|
|
|
### Menjalankan dengan Docker
|
|
|
|
Jalankan perintah berikut dari root project:
|
|
|
|
```powershell
|
|
docker compose up -d --build
|
|
```
|
|
|
|
Container `app` akan otomatis:
|
|
|
|
- menginstall dependency Composer jika `vendor` belum ada di volume Docker,
|
|
- membuat file `.env` dari `.env.docker.example` jika `.env` belum ada,
|
|
- generate `APP_KEY` jika masih kosong,
|
|
- membersihkan config cache,
|
|
- menjalankan migration ke database MySQL.
|
|
|
|
Container `vite` akan otomatis menginstall dependency Node jika `node_modules` belum ada di volume Docker, lalu menjalankan Vite dev server.
|
|
|
|
Setelah container berjalan, buka:
|
|
|
|
- Aplikasi: `http://localhost:8000`
|
|
- Vite dev server: `http://localhost:5173`
|
|
- MySQL dari host: `127.0.0.1:3307`
|
|
- MySQL dari container Laravel: `mysql:3306`
|
|
|
|
### Konfigurasi Database
|
|
|
|
Konfigurasi database development menggunakan MySQL:
|
|
|
|
```env
|
|
DB_CONNECTION=mysql
|
|
DB_HOST=mysql
|
|
DB_PORT=3306
|
|
DB_DATABASE=webgis_miskin
|
|
DB_USERNAME=webgis
|
|
DB_PASSWORD=secret
|
|
```
|
|
|
|
Credential MySQL root:
|
|
|
|
```text
|
|
MYSQL_ROOT_PASSWORD=root
|
|
```
|
|
|
|
### Perintah yang Sering Dipakai
|
|
|
|
```powershell
|
|
docker compose ps
|
|
docker compose logs -f app
|
|
docker compose logs -f vite
|
|
docker compose exec app php artisan migrate:status
|
|
docker compose exec app php artisan migrate
|
|
docker compose exec app php artisan test
|
|
docker compose down
|
|
```
|
|
|
|
Untuk menghapus database MySQL Docker dan mulai dari database kosong:
|
|
|
|
```powershell
|
|
docker compose down -v
|
|
```
|
|
|
|
### Menjalankan Artisan di Docker
|
|
|
|
Semua perintah Artisan dijalankan lewat service `app`.
|
|
|
|
```powershell
|
|
docker compose exec app php artisan route:list
|
|
docker compose exec app php artisan migrate:fresh
|
|
docker compose exec app php artisan cache:clear
|
|
```
|
|
|
|
## Daftar Halaman
|
|
|
|
1. **Beranda (`/`)**: Halaman landing dengan latar belakang peta animasi dan navigasi cepat.
|
|
2. **Peta Interaktif (`/map`)**: Antarmuka utama untuk melihat sebaran dan melakukan analisis radius.
|
|
3. **Data Tabular (`/data`)**: Manajemen data dalam format tabel dengan ringkasan statistik total.
|
|
4. **Admin Pengguna (`/admin/users`)**: Manajemen pengguna sistem — tambah, edit, hapus akun, assign role, dan reset password. Hanya dapat diakses oleh Administrator.
|
|
|
|
---
|
|
*Dokumentasi ini dibuat untuk menjelaskan kapabilitas sistem WebGIS Pemetaan Kemiskinan versi Laravel.*
|