Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0" /> | |
| <title>Dashboard — Vedangsoft Change Detection</title> | |
| <link rel="stylesheet" href="/static/css/style.css?v=34" /> | |
| <link rel="stylesheet" href="/static/css/dda.css?v=47" /> | |
| </head> | |
| <body> | |
| <div class="app dda-app"> | |
| {% include "partials/navbar_dda.html" %} | |
| <div class="dda-main-col"> | |
| {% include "partials/alerts_dda.html" %} | |
| <section id="tab-home" class="dda-panel active" role="tabpanel"> | |
| <div class="dda-hero"> | |
| <div class="dda-hero-row"> | |
| <div> | |
| <h1 id="dda-home-greeting">Welcome</h1> | |
| <p class="sub">System-wide overview of every change detection run, region, and report.</p> | |
| </div> | |
| <div class="dda-dash-hero-actions"> | |
| <span id="dda-dash-updated" class="dim dda-dash-updated"></span> | |
| <button type="button" class="btn btn-secondary btn-sm" id="btn-dash-refresh">Refresh</button> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="dda-dash-empty" class="card hidden"> | |
| <div class="card-header"><h3>No detections yet</h3></div> | |
| <p class="sub dim">Run your first comparison to start populating the dashboard with detection statistics, region/village breakdowns, and reports.</p> | |
| <a class="btn btn-primary" href="/detect">Run Change Detection</a> | |
| </div> | |
| <div id="dda-dash-content"> | |
| <!-- Change Detection Overview --> | |
| <div class="card"> | |
| <div class="card-header"><h3>Change Detection Overview</h3></div> | |
| <p class="sub dim">Click any stat to view detection reports.</p> | |
| <div class="dda-dash-kpi-grid" id="dda-dash-kpis"> | |
| <p class="dim">Loading overview…</p> | |
| </div> | |
| </div> | |
| <!-- Latest Result --> | |
| <div class="card"> | |
| <div class="card-header"><h3>Latest Detection Result</h3></div> | |
| <div id="dda-dash-latest"><p class="dim">Loading latest result…</p></div> | |
| </div> | |
| <!-- Detections by Role --> | |
| <div class="card"> | |
| <div class="card-header"><h3>Detections by Role</h3></div> | |
| <p class="sub dim">Detection activity grouped by the role of the user who ran it.</p> | |
| <div id="dda-dash-roles"><p class="dim">Loading role breakdown…</p></div> | |
| </div> | |
| <!-- Region & Village-wise Analysis --> | |
| <div class="card"> | |
| <div class="card-header"> | |
| <h3>Region-wise Analysis</h3> | |
| <span class="dim dda-filter-meta">Click a region to filter villages below</span> | |
| </div> | |
| <div id="dda-dash-regions"><p class="dim">Loading regions…</p></div> | |
| </div> | |
| <div class="card"> | |
| <div class="card-header"> | |
| <h3>Village-wise Analysis</h3> | |
| <div class="dda-reports-toolbar"> | |
| <span id="dda-dash-village-filter-label" class="dim dda-filter-meta hidden"></span> | |
| <button type="button" class="btn btn-ghost btn-sm hidden" id="btn-dash-village-clear">Show all regions</button> | |
| </div> | |
| </div> | |
| <p class="sub dim">Click a village to view its detection history and compare runs.</p> | |
| <div id="dda-dash-villages"><p class="dim">Loading villages…</p></div> | |
| </div> | |
| <!-- Change Comparison --> | |
| <div class="card" id="dda-dash-location-card"> | |
| <div class="card-header"><h3>Change Comparison</h3></div> | |
| <div id="dda-dash-location"><p class="dim">Select a village above to compare its latest and previous detection results.</p></div> | |
| </div> | |
| <!-- Charts --> | |
| <div class="card"> | |
| <div class="card-header"><h3>Charts & Graphs</h3></div> | |
| <div class="dda-dash-chart-grid"> | |
| <div class="dda-dash-chart-box"> | |
| <h4>Detections by Region</h4> | |
| <canvas id="dda-chart-regions" height="220"></canvas> | |
| </div> | |
| <div class="dda-dash-chart-box"> | |
| <h4>Detections by Role</h4> | |
| <canvas id="dda-chart-roles" height="220"></canvas> | |
| </div> | |
| <div class="dda-dash-chart-box"> | |
| <h4>Detections by Village / Location</h4> | |
| <canvas id="dda-chart-villages" height="220"></canvas> | |
| </div> | |
| <div class="dda-dash-chart-box"> | |
| <h4>Detection Trend (last 6 months)</h4> | |
| <canvas id="dda-chart-trend" height="220"></canvas> | |
| </div> | |
| <div class="dda-dash-chart-box"> | |
| <h4>Detected vs Unclassified Changes</h4> | |
| <canvas id="dda-chart-status" height="220"></canvas> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Reports on Dashboard --> | |
| <div class="card"> | |
| <div class="card-header"> | |
| <h3>Recent Reports</h3> | |
| <a class="btn btn-secondary btn-sm" href="/reports">View all reports</a> | |
| </div> | |
| <div id="dda-dash-reports"><p class="dim">Loading recent reports…</p></div> | |
| </div> | |
| </div> | |
| </section> | |
| </div> | |
| </div> | |
| <script src="https://unpkg.com/chart.js@4/dist/chart.umd.js" crossorigin=""></script> | |
| <script src="/static/js/dda/shared.js?v=7"></script> | |
| <script src="/static/js/dda/app.js?v=29"></script> | |
| <script src="/static/js/dda/notifications.js?v=5"></script> | |
| <script src="/static/js/dda/home.js?v=6"></script> | |
| </body> | |
| </html> | |