diff --git a/Jalan-Rusak/db.sql b/Jalan-Rusak/db.sql
index 8a71f37..defb475 100644
--- a/Jalan-Rusak/db.sql
+++ b/Jalan-Rusak/db.sql
@@ -1,16 +1,27 @@
-CREATE DATABASE db_spbu;
-USE db_spbu;
+CREATE DATABASE IF NOT EXISTS spbu_db;
+USE spbu_db;
-CREATE TABLE spbu (
+CREATE TABLE IF NOT EXISTS admin (
id INT AUTO_INCREMENT PRIMARY KEY,
- nama_spbu VARCHAR(100),
- no_spbu VARCHAR(50),
- status ENUM('Buka 24 Jam', 'Tidak 24 Jam'),
- latitude DOUBLE,
- longitude DOUBLE,
+ username VARCHAR(50) NOT NULL UNIQUE,
+ password VARCHAR(255) NOT NULL,
created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP
);
+INSERT INTO admin (username, password) VALUES
+('admin', '$2y$10$A9m/u6sAxEwgIO4dlmIvNO2WJioIya4TwMvSe06hgFrDsq1xg7x16');
+
+CREATE TABLE IF NOT EXISTS spbu (
+ id INT AUTO_INCREMENT PRIMARY KEY,
+ nama VARCHAR(200) NOT NULL,
+ no_spbu VARCHAR(50) NOT NULL,
+ status ENUM('24jam', 'terbatas') NOT NULL DEFAULT '24jam',
+ latitude DECIMAL(10, 7) NOT NULL,
+ longitude DECIMAL(10, 7) NOT NULL,
+ created_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP,
+ updated_at TIMESTAMP DEFAULT CURRENT_TIMESTAMP ON UPDATE CURRENT_TIMESTAMP
+);
+
CREATE TABLE jalan (
id INT AUTO_INCREMENT PRIMARY KEY,
nama_jalan VARCHAR(100),
diff --git a/Jalan-Rusak/index.php b/Jalan-Rusak/index.php
index c733201..bb3d325 100644
--- a/Jalan-Rusak/index.php
+++ b/Jalan-Rusak/index.php
@@ -11,6 +11,7 @@ while ($row = mysqli_fetch_assoc($result)) {
+
WebGIS SPBU - Modern
@@ -41,7 +42,6 @@ while ($row = mysqli_fetch_assoc($result)) {
transition: all 0.3s ease;
}
- /* SIDEBAR */
.sidebar {
position: absolute;
top: 0;
@@ -64,7 +64,6 @@ while ($row = mysqli_fetch_assoc($result)) {
transform: translateX(-100%);
}
- /* Tombol toggle sidebar (hamburger) */
.toggle-sidebar-btn {
position: absolute;
top: 18px;
@@ -84,23 +83,28 @@ while ($row = mysqli_fetch_assoc($result)) {
transition: all 0.2s;
color: #1f2937;
}
+
body.sidebar-open .toggle-sidebar-btn {
display: none;
}
- /* Atur posisi zoom control Leaflet agar tidak tertutup hamburger */
.leaflet-control-zoom {
transition: margin-left 0.3s ease;
margin-left: 60px;
}
+
body.sidebar-open .leaflet-control-zoom {
margin-left: 340px;
}
+
@media (max-width: 640px) {
body.sidebar-open .leaflet-control-zoom {
margin-left: 280px;
}
- .sidebar { width: 280px; }
+
+ .sidebar {
+ width: 280px;
+ }
}
.sidebar-header {
@@ -110,6 +114,7 @@ while ($row = mysqli_fetch_assoc($result)) {
justify-content: space-between;
align-items: center;
}
+
.sidebar-header h2 {
font-size: 1.35rem;
font-weight: 600;
@@ -118,6 +123,7 @@ while ($row = mysqli_fetch_assoc($result)) {
background-clip: text;
color: transparent;
}
+
.close-sidebar {
background: none;
border: none;
@@ -131,6 +137,7 @@ while ($row = mysqli_fetch_assoc($result)) {
align-items: center;
justify-content: center;
}
+
.close-sidebar:hover {
background: #f1f5f9;
color: #0f172a;
@@ -141,6 +148,7 @@ while ($row = mysqli_fetch_assoc($result)) {
background: #ffffff;
border-bottom: 1px solid #edf2f7;
}
+
.search-box input {
width: 100%;
padding: 10px 16px;
@@ -150,16 +158,19 @@ while ($row = mysqli_fetch_assoc($result)) {
outline: none;
transition: 0.2s;
}
+
.search-box input:focus {
border-color: #6366f1;
box-shadow: 0 0 0 2px rgba(99, 102, 241, 0.2);
}
+
.filter-buttons {
display: flex;
gap: 8px;
flex-wrap: wrap;
margin-top: 12px;
}
+
.filter-chip {
background: #f1f5f9;
border: none;
@@ -171,6 +182,7 @@ while ($row = mysqli_fetch_assoc($result)) {
transition: 0.2s;
color: #334155;
}
+
.filter-chip.active {
background: #6366f1;
color: white;
@@ -181,6 +193,7 @@ while ($row = mysqli_fetch_assoc($result)) {
overflow-y: auto;
padding: 12px 16px;
}
+
.result-card {
background: #ffffff;
border-radius: 16px;
@@ -189,13 +202,15 @@ while ($row = mysqli_fetch_assoc($result)) {
cursor: pointer;
transition: 0.2s;
border: 1px solid #ecf3fa;
- box-shadow: 0 1px 2px rgba(0,0,0,0.02);
+ box-shadow: 0 1px 2px rgba(0, 0, 0, 0.02);
}
+
.result-card:hover {
background: #fafcff;
transform: translateX(4px);
border-color: #cbdff2;
}
+
.result-title {
font-weight: 600;
color: #0f172a;
@@ -203,6 +218,7 @@ while ($row = mysqli_fetch_assoc($result)) {
align-items: center;
gap: 6px;
}
+
.result-sub {
font-size: 0.7rem;
color: #5b6e8c;
@@ -222,8 +238,8 @@ while ($row = mysqli_fetch_assoc($result)) {
display: flex;
gap: 12px;
border: 1px solid rgba(255, 255, 255, 0.5);
- transition: all 0.3s ease;
}
+
.mode-icon {
background: #f1f5f9;
border: none;
@@ -238,22 +254,27 @@ while ($row = mysqli_fetch_assoc($result)) {
transition: 0.2s;
color: #1e293b;
}
+
.mode-icon.active {
background: #6366f1;
color: white;
}
+
.mode-icon.edit-mode {
background: #1e293b;
color: white;
}
+
.mode-icon.edit-mode.active {
background: #10b981;
}
+
.draw-actions {
display: flex;
gap: 12px;
transition: all 0.3s ease;
}
+
body.view-mode .draw-actions {
display: none;
}
@@ -269,8 +290,9 @@ while ($row = mysqli_fetch_assoc($result)) {
display: flex;
gap: 16px;
z-index: 10;
- box-shadow: 0 8px 20px rgba(0,0,0,0.2);
+ box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
}
+
.custom-draw-toolbar button {
background: #334155;
border: none;
@@ -279,6 +301,7 @@ while ($row = mysqli_fetch_assoc($result)) {
border-radius: 40px;
cursor: pointer;
}
+
.custom-draw-toolbar button:hover {
background: #6366f1;
}
@@ -286,7 +309,10 @@ while ($row = mysqli_fetch_assoc($result)) {
.edit-popup {
min-width: 220px;
}
- .edit-popup input, .edit-popup select, .edit-popup textarea {
+
+ .edit-popup input,
+ .edit-popup select,
+ .edit-popup textarea {
width: 100%;
padding: 8px 12px;
margin: 8px 0;
@@ -294,6 +320,7 @@ while ($row = mysqli_fetch_assoc($result)) {
border-radius: 30px;
font-size: 0.85rem;
}
+
.edit-popup button {
padding: 6px 14px;
border-radius: 30px;
@@ -302,10 +329,26 @@ while ($row = mysqli_fetch_assoc($result)) {
cursor: pointer;
font-weight: 500;
}
- .btn-save { background: #10b981; color: white; }
- .btn-cancel { background: #94a3b8; color: white; }
- .btn-edit { background: #f59e0b; color: white; }
- .btn-delete { background: #ef4444; color: white; }
+
+ .btn-save {
+ background: #10b981;
+ color: white;
+ }
+
+ .btn-cancel {
+ background: #94a3b8;
+ color: white;
+ }
+
+ .btn-edit {
+ background: #f59e0b;
+ color: white;
+ }
+
+ .btn-delete {
+ background: #ef4444;
+ color: white;
+ }
.toast {
position: fixed;
@@ -320,22 +363,27 @@ while ($row = mysqli_fetch_assoc($result)) {
transition: 0.2s;
pointer-events: none;
}
- .toast.show { opacity: 1; }
+
+ .toast.show {
+ opacity: 1;
+ }
.drawing-cursor {
cursor: crosshair !important;
}
+
body.view-mode #map {
cursor: grab;
}
+
body.view-mode #map:active {
cursor: grabbing;
}
- /* Kursor saat drag marker */
+
.leaflet-marker-dragging {
cursor: grabbing !important;
}
- /* thumbail foto di popup */
+
.popup-img {
max-width: 200px;
max-height: 150px;
@@ -345,312 +393,270 @@ while ($row = mysqli_fetch_assoc($result)) {
}
+
-
+
-