diff --git a/kimi.md b/kimi.md index b4ee12d..7009cd1 100644 --- a/kimi.md +++ b/kimi.md @@ -189,6 +189,13 @@ tar -czf mp-dist.tar.gz -C dist . ## 8. Verlauf / offene Punkte +**Erledigt 04.10. (v1.28):** Zählerübersicht mit Suche + Listenansicht +(Analogie zur Hausübersicht v1.26): Suchfeld über Nummer/Art/Haus/Wohneinheit +(mit Trefferzähler), Toggle Karten/Liste; Liste = Tabelle (Art-Badge mit Icon, +Nummer, Haus, Wohneinheit, Stand rechts tabular-nums, Stand am, Anomalie-Icon, +Aktionen), responsive via hidden sm/md/lg. Bestehende Filter Haus/Art bleiben +und kombinieren mit der Suche. + **Erledigt 04.10. (v1.27):** Zähleranlage ohne Haus-Feld, mit Ablesedatum. POST /api/meters akzeptiert standAm (Validierung via zaehlerVerlauf.parseDatum, Default heute); stand_am + erster Verlaufseintrag (erstbefund) nutzen das Datum. diff --git a/src/pages/Zaehler.tsx b/src/pages/Zaehler.tsx index 4c45e22..226d5f8 100644 --- a/src/pages/Zaehler.tsx +++ b/src/pages/Zaehler.tsx @@ -1,5 +1,5 @@ import { useMemo, useState } from 'react' -import { Gauge, Zap, Droplets, Flame, Building2, Hash, CalendarDays, Pencil, Plus, History, TriangleAlert, Trash2 } from 'lucide-react' +import { Gauge, Zap, Droplets, Flame, Building2, Hash, CalendarDays, Pencil, Plus, History, TriangleAlert, Trash2, Search, List, LayoutGrid } from 'lucide-react' import { Button } from '@/components/ui/button' import { Badge } from '@/components/ui/badge' import { @@ -390,28 +390,32 @@ export default function Zaehler() { const { meters, units, role } = useStore() const [filterHaus, setFilterHaus] = useState('alle') const [filterArt, setFilterArt] = useState<'alle' | ZaehlerArt>('alle') + const [suche, setSuche] = useState('') + const [ansicht, setAnsicht] = useState<'karten' | 'liste'>('karten') const gebaeude = useMemo( () => Array.from(new Set(meters.map((m) => m.building))).sort(), [meters], ) - const visible = useMemo( - () => - meters.filter( - (m) => - (filterHaus === 'alle' || m.building === filterHaus) && - (filterArt === 'alle' || m.art === filterArt), - ), - [meters, filterHaus, filterArt], - ) - const einheitLabel = (m: Meter) => { if (!m.unitId) return 'Allgemeinzähler' const u = units.find((x) => x.id === m.unitId) return u ? `Whg. ${u.number}` : m.unitId } + const visible = useMemo(() => { + const q = suche.trim().toLowerCase() + return meters.filter( + (m) => + (filterHaus === 'alle' || m.building === filterHaus) && + (filterArt === 'alle' || m.art === filterArt) && + (!q || + [m.nummer, m.art, m.building, einheitLabel(m)] + .some((f) => f.toLowerCase().includes(q))), + ) + }, [meters, filterHaus, filterArt, suche, units]) + return (
| Art | +Zählernummer | +Haus | +Wohneinheit | +Stand | +Stand am | ++ | Aktion | +
|---|---|---|---|---|---|---|---|
|
+ |
+ {m.nummer} | +{m.building} | +{einheitLabel(m)} | ++ {fmtStand(m.stand)} + | +{m.standAm} | +
+ {m.letzteAnomalie && (
+ |
+
+
+
+ |
+