FLO/hagfish
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

move filters to left box

Browse Source
This commit is contained in:
bartal-lsn
2026-08-25 21:25:50 +01:00
parent e4e09df834
commit 225aa9b1c6
2 changed files with 107 additions and 87 deletions
Download Patch File Download Diff File Expand all files Collapse all files
static/index.html
+49 -43
View File
@@ -30,55 +30,61 @@
</nav>
<main class="page-body">
<div class="dashboard">
<div class="sidebar">
<div class="filters-panel">
<div class="filters">
<div class="filter-group multi-select" id="species">
<label>Species</label>
<div class="dropdown-trigger dropdown-label">All</div>
<div class="checkbox-dropdown-list"></div>
</div>
<div class="filter-group multi-select" id="zone">
<label>Zone</label>
<div class="dropdown-trigger dropdown-label">All</div>
<div class="checkbox-dropdown-list"></div>
</div>
<div class="filter-group multi-select" id="gear">
<label>Gear</label>
<div class="dropdown-trigger dropdown-label">All</div>
<div class="checkbox-dropdown-list"></div>
</div>
<div class="filter-group">
<label for="month_from">From</label>
<select id="month_from"><option value="">All</option></select>
</div>
<div class="filter-group">
<label for="month_to">To</label>
<select id="month_to"><option value="">All</option></select>
</div>
<button class="apply-btn" id="apply-filters">Apply</button>
</div>
</div>
</div>
<div class="dashboard-wrapper">
<div id="loading-overlay" class="loading-overlay">
<span>Loading fisheries data…</span>
</div>
<div class="filters">
<div class="filter-group multi-select" id="species">
<label>Species</label>
<div class="dropdown-trigger dropdown-label">All</div>
<div class="checkbox-dropdown-list"></div>
<div class="dashboard">
<div id="empty-state" class="empty-state" style="display:none;">
<p>No data available for the selected filters.</p>
<p>Try adjusting your filters or running an ingestion.</p>
</div>
<div class="filter-group multi-select" id="zone">
<label>Zone</label>
<div class="dropdown-trigger dropdown-label">All</div>
<div class="checkbox-dropdown-list"></div>
</div>
<div class="filter-group multi-select" id="gear">
<label>Gear</label>
<div class="dropdown-trigger dropdown-label">All</div>
<div class="checkbox-dropdown-list"></div>
</div>
<div class="filter-group">
<label for="month_from">From</label>
<select id="month_from"><option value="">All</option></select>
</div>
<div class="filter-group">
<label for="month_to">To</label>
<select id="month_to"><option value="">All</option></select>
</div>
<button class="apply-btn" id="apply-filters">Apply</button>
</div>
<div id="empty-state" class="empty-state" style="display:none;">
<p>No data available for the selected filters.</p>
<p>Try adjusting your filters or running an ingestion.</p>
</div>
<div id="charts-grid" class="charts-grid" style="display:none;">
<div class="chart-container full-width">
<div class="chart-title">Total Landings (Mass & Value)</div>
<div id="chart-line" style="width:100%; height:420px;"></div>
</div>
<div class="chart-container">
<div class="chart-title">Top Species by Value</div>
<div id="chart-donut" style="width:100%; height:380px;"></div>
</div>
<div class="chart-container">
<div class="chart-title">Monthly Value by Top Species</div>
<div id="chart-bar" style="width:100%; height:380px;"></div>
<div id="charts-grid" class="charts-grid" style="display:none;">
<div class="chart-container full-width">
<div class="chart-title">Total Landings (Mass & Value)</div>
<div id="chart-line" style="width:100%; height:420px;"></div>
</div>
<div class="chart-container">
<div class="chart-title">Top Species by Value</div>
<div id="chart-donut" style="width:100%; height:380px;"></div>
</div>
<div class="chart-container">
<div class="chart-title">Monthly Value by Top Species</div>
<div id="chart-bar" style="width:100%; height:380px;"></div>
</div>
</div>
</div>
</div>