diff --git a/frontend/src/tools/statistik.jsx b/frontend/src/tools/statistik.jsx index 2e80fb6..731fc22 100644 --- a/frontend/src/tools/statistik.jsx +++ b/frontend/src/tools/statistik.jsx @@ -1,4 +1,4 @@ -import { useState, useEffect, useCallback } from 'react'; +import { useState, useEffect } from 'react'; import { BarChart, Bar, LineChart, Line, XAxis, YAxis, Tooltip, ResponsiveContainer, Cell, PieChart, Pie, Legend } from 'recharts'; const api = (path, opts={}) => { @@ -96,23 +96,23 @@ function KPI({ label, value, color, sub }) { ); } -// Bestellungen diesen Monat – eigene Komponente mit eigenem Fetch -function MonthOrders({ currentMonth }) { +// Bestellungen im gewählten Zeitraum +function OrdersInPeriod({ period, custom }) { const [orders, setOrders] = useState(null); useEffect(() => { - const from = currentMonth + '-01'; - const last = new Date(currentMonth.split('-')[0], currentMonth.split('-')[1], 0).getDate(); - const to = currentMonth + '-' + String(last).padStart(2,'0'); - api(`/tools/statistik/month-orders?from=${from}&to=${to}`).then(setOrders).catch(()=>setOrders([])); - }, [currentMonth]); + const { from, to } = periodRange(period, custom); + const q = from ? `?from=${from}&to=${to}` : ''; + api(`/tools/statistik/month-orders${q}`).then(setOrders).catch(()=>setOrders([])); + }, [period, custom]); const statusColor = { warteliste:'#ffe66d', in_arbeit:'#4ecdc4', fertig:'#6bcb77' }; + const periodLabel = period==='week'?'DIESER WOCHE':period==='month'?'DIESEM MONAT':period==='year'?'DIESEM JAHR':period==='all'?'GESAMT':'IM ZEITRAUM'; return (