fixes

static/app.js

@@ -196,22 +196,27 @@ async function updateCharts() {
   const monthFrom = document.getElementById('month_from').value;
   const monthTo = document.getElementById('month_to').value;
 
-  const params = new URLSearchParams();
-  if (species) params.append('species', species);
-  if (zone) params.append('zone', zone);
-  if (gear) params.append('gear', gear);
-  if (monthFrom) params.append('month_from', monthFrom);
-  if (monthTo) params.append('month_to', monthTo);
-  params.append('limit', '10000');
+  const landingsParams = new URLSearchParams();
+  if (species) landingsParams.append('species', species);
+  if (zone) landingsParams.append('zone', zone);
+  if (gear) landingsParams.append('gear', gear);
+  if (monthFrom) landingsParams.append('month_from', monthFrom);
+  if (monthTo) landingsParams.append('month_to', monthTo);
+  landingsParams.append('limit', '10000');
+
+  const summaryParams = new URLSearchParams();
+  if (species) summaryParams.append('species', species);
+  if (monthFrom) summaryParams.append('month_from', monthFrom);
+  if (monthTo) summaryParams.append('month_to', monthTo);
 
   const [landings, summary] = await Promise.all([
-    fetchData(`/api/landings?${params.toString()}`),
-    fetchData(`/api/summary?${species ? `species=${species}` : ''}`),
+    fetchData(`/api/landings?${landingsParams.toString()}`),
+    fetchData(`/api/summary?${summaryParams.toString()}`),
   ]);
 
   showLoading(false);
 
-  if (!landings || landings.length === 0) {
+  if ((!landings || landings.length === 0) && (!summary || !summary.monthly || summary.monthly.length === 0)) {
     showEmptyState();
     return;
   }
@@ -219,64 +224,63 @@ async function updateCharts() {
   hideEmptyState();
   document.getElementById('charts-grid').style.display = 'grid';
 
-  // --- Line Chart ---
-  const months = [...new Set(landings.map((l) => l.month))].sort();
-  const massMap = {};
-  const valueMap = {};
+  setTimeout(() => {
+    chartLine.resize();
+    chartBar.resize();
+    chartDonut.resize();
+  }, 0);
 
-  landings.forEach((l) => {
-    if (!massMap[l.month]) massMap[l.month] = 0;
-    if (!valueMap[l.month]) valueMap[l.month] = 0;
-    if (l.measure_code === 'MASS' && l.value) massMap[l.month] += l.value;
-    if (l.measure_code === 'VALUE' && l.value) valueMap[l.month] += l.value;
-  });
+  // --- Line Chart (from filtered summary) ---
+  if (summary && summary.monthly) {
+    const months = summary.monthly.map((m) => m.month);
+    const massData = summary.monthly.map((m) => m.total_mass || 0);
+    const valueData = summary.monthly.map((m) => m.total_value || 0);
+    renderLineChart(months, massData, valueData);
+  } else {
+    renderLineChart([], [], []);
+  }
 
-  renderLineChart(
-    months,
-    months.map((m) => massMap[m] || 0),
-    months.map((m) => valueMap[m] || 0)
-  );
+  // --- Donut Chart (from filtered summary top_species) ---
+  if (summary && summary.top_species && summary.top_species.length > 0) {
+    const donutData = summary.top_species.slice(0, 10).map((s) => ({
+      name: s.species_label,
+      value: s.total_value || 0,
+    }));
+    renderDonutChart(donutData);
+  } else {
+    renderDonutChart([]);
+  }
 
-  // --- Donut Chart (Top Species by Value) ---
-  const speciesValueMap = {};
-  landings.forEach((l) => {
-    if (l.measure_code === 'VALUE' && l.value) {
-      speciesValueMap[l.species_label] =
-        (speciesValueMap[l.species_label] || 0) + l.value;
-    }
-  });
+  // --- Bar Chart (from filtered landings) ---
+  if (landings && landings.length > 0) {
+    const barSpeciesSet = new Set();
+    landings.forEach((l) => {
+      if (l.measure_code === 'VALUE') barSpeciesSet.add(l.species_label);
+    });
+    const barSpecies = [...barSpeciesSet].slice(0, 10);
 
-  const donutData = Object.entries(speciesValueMap)
-    .sort((a, b) => b[1] - a[1])
-    .slice(0, 10)
-    .map(([name, value]) => ({ name, value }));
+    const months = [...new Set(landings.map((l) => l.month))].sort();
 
-  renderDonutChart(donutData);
+    const barSeries = barSpecies.map((sp) => ({
+      name: sp,
+      type: 'bar',
+      stack: 'total',
+      emphasis: { focus: 'series' },
+      data: months.map((m) => {
+        const row = landings.find(
+          (l) =>
+            l.month === m &&
+            l.species_label === sp &&
+            l.measure_code === 'VALUE'
+        );
+        return row && row.value ? row.value : 0;
+      }),
+    }));
 
-  // --- Bar Chart (Stacked by Species) ---
-  const barSpeciesSet = new Set();
-  landings.forEach((l) => {
-    if (l.measure_code === 'VALUE') barSpeciesSet.add(l.species_label);
-  });
-  const barSpecies = [...barSpeciesSet].slice(0, 10);
-
-  const barSeries = barSpecies.map((sp) => ({
-    name: sp,
-    type: 'bar',
-    stack: 'total',
-    emphasis: { focus: 'series' },
-    data: months.map((m) => {
-      const row = landings.find(
-        (l) =>
-          l.month === m &&
-          l.species_label === sp &&
-          l.measure_code === 'VALUE'
-      );
-      return row && row.value ? row.value : 0;
-    }),
-  }));
-
-  renderBarChart(months, barSeries);
+    renderBarChart(months, barSeries);
+  } else {
+    renderBarChart([], []);
+  }
 }
 
 function showLoading(show) {
@@ -331,5 +335,7 @@ document.getElementById('apply-filters').addEventListener('click', updateCharts)
 })();
 
 // Init
-initCharts();
-populateDropdowns().then(updateCharts);
+document.addEventListener('DOMContentLoaded', () => {
+  initCharts();
+  populateDropdowns().then(updateCharts);
+});