Danial HB
80 lines
3.6 KiB
HTML
80 lines
3.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>Donation Distribution WebGIS</title>
|
|
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&display=swap" rel="stylesheet">
|
|
<link rel="stylesheet" href="https://unpkg.com/leaflet@1.9.4/dist/leaflet.css" />
|
|
<link rel="stylesheet" href="style.css" />
|
|
</head>
|
|
|
|
<body>
|
|
<div id="map"></div>
|
|
|
|
<div id="navbar">
|
|
<div class="logo">🌍 DonationGIS</div>
|
|
<div class="auth-controls">
|
|
<span id="user-info" style="display:none; color:white; margin-right:15px; font-weight:500;"></span>
|
|
<button id="btn-admin-panel" onclick="openAdminPanel()" style="display:none;" class="nav-btn">Admin
|
|
Dashboard</button>
|
|
<button id="btn-logistics" onclick="toggleLogisticsDashboard()" style="display:none;" class="nav-btn">📦
|
|
Sembako Logistics</button>
|
|
<button id="btn-logout" onclick="logout()" style="display:none;" class="nav-btn logout">Logout</button>
|
|
<button id="btn-open-login" onclick="openLogin()" class="nav-btn">Login</button>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Login Overlay -->
|
|
<div id="login-overlay" class="overlay hidden">
|
|
<div class="glass-panel">
|
|
<h2>Welcome Back</h2>
|
|
<p>Sign in to manage map data.</p>
|
|
<input type="email" id="login-email" placeholder="Email Address">
|
|
<input type="password" id="login-password" placeholder="Password">
|
|
<button onclick="login()" class="primary-btn">Sign In</button>
|
|
<button onclick="closeLogin()" class="text-btn">Cancel</button>
|
|
<p id="login-error" class="error-msg"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- Admin Dashboard Overlay -->
|
|
<div id="admin-overlay" class="overlay hidden">
|
|
<div class="glass-panel">
|
|
<h2>Admin Dashboard</h2>
|
|
<p>Register new Surveyor Accounts.</p>
|
|
<input type="text" id="reg-username" placeholder="Username">
|
|
<input type="email" id="reg-email" placeholder="Email Address">
|
|
<input type="password" id="reg-password" placeholder="Password">
|
|
<button onclick="registerSurveyor()" class="primary-btn">Register Surveyor</button>
|
|
<button onclick="closeAdminPanel()" class="text-btn">Close</button>
|
|
<p id="reg-msg" class="msg"></p>
|
|
</div>
|
|
</div>
|
|
|
|
<div id="toolbar" class="hidden">
|
|
<h3>Mapping Tools</h3>
|
|
<button id="btn-place" onclick="setMode('place')" class="tool-btn">📍 Add Religious Place</button>
|
|
<button id="btn-house" onclick="setMode('house')" class="tool-btn">🏠 Add House</button>
|
|
<button id="btn-cancel" onclick="cancelDraw()" class="tool-btn cancel-btn" style="display:none;">Cancel</button>
|
|
<p id="status-text">Select a tool to begin.</p>
|
|
</div>
|
|
|
|
<!-- Sembako Logistics Dashboard Sidebar -->
|
|
<div id="logistics-panel" class="hidden">
|
|
<div class="logistics-header">
|
|
<h3>📦 Distribusi Sembako</h3>
|
|
<p>Kebutuhan per Pusat Ibadah</p>
|
|
<button class="logistics-refresh-btn" onclick="loadSembakoDashboard()" title="Refresh Data">🔄</button>
|
|
</div>
|
|
<div id="logistics-content">
|
|
<p style="text-align:center; color:#888; padding:20px 0;">Click 📦 Sembako Logistics to load data.</p>
|
|
</div>
|
|
</div>
|
|
|
|
<script src="https://unpkg.com/leaflet@1.9.4/dist/leaflet.js"></script>
|
|
<script src="app.js"></script>
|
|
</body>
|
|
|
|
</html> |