From 9a3eb7d810f9d5e5f9de90f74ef5c8a79e7ae854 Mon Sep 17 00:00:00 2001 From: patrick Date: Sun, 6 Sep 2026 21:45:09 +0200 Subject: [PATCH] feat(ui): UI-008 echte Status-Badges statt badge-neutral, Epic 20 komplett MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit FehlbestandListePage, MangelListePage (Status + Prioritäts-Badge statt Inline-Farbe) und admin/GeraeteInstanzenListe zeigten Status immer als neutrales Badge statt farblich zu unterscheiden. Letzte hartkodierte Hex-Fallbacks (NachfuellDialog, BeladungsplanerBoard) auf reine Tokens umgestellt. Damit ist Epic 20 (UI-Redesign, UI-001..008) vollständig durchlaufen. Co-Authored-By: Claude Sonnet 5 Claude-Session: https://claude.ai/code/session_01CVgbozhYmuEhiEJHffRXCV --- arbeitskacheln/00_index.md | 2 +- arbeitskacheln/20_ui_redesign.md | 9 ++++++++- frontend/src/pages/FehlbestandListePage.tsx | 12 +++++++++++- frontend/src/pages/MangelListePage.tsx | 13 +++++++++++-- frontend/src/pages/admin/BeladungsplanerBoard.tsx | 4 ++-- frontend/src/pages/admin/GeraeteInstanzenListe.tsx | 9 ++++++++- frontend/src/pages/kontrolle/NachfuellDialog.tsx | 2 +- 7 files changed, 42 insertions(+), 9 deletions(-) diff --git a/arbeitskacheln/00_index.md b/arbeitskacheln/00_index.md index ea72f0d..830c0b8 100644 --- a/arbeitskacheln/00_index.md +++ b/arbeitskacheln/00_index.md @@ -272,7 +272,7 @@ eigenes Modul (MAINT-\*, MABEA hat nur Prüfung, keine Wartung)**. | `17_zustaendigkeit.md` | ZUST-001 … ZUST-002 (vollständig, nachträglich ergänzt) | | `18_notifications.md` | NOTIF-001 … NOTIF-002 (vollständig, nachträglich ergänzt) | | `19_satelliten_server.md` | SAT-001 (Platzhalter, nachträglich ergänzt, bewusst zurückgestellt) | -| `20_ui_redesign.md` | UI-001 … UI-008 (vollständig, nachträglich ergänzt, in Umsetzung) | +| `20_ui_redesign.md` | UI-001 … UI-008 (vollständig umgesetzt, 2026-09-06) | **Alle 20 Epics durchgegangen** (16 ursprüngliche + 17 Zuständigkeit/18 Notifications/19 Satelliten-Server/20 UI-Redesign, nachträglich ergänzt). Detaillierungsphase diff --git a/arbeitskacheln/20_ui_redesign.md b/arbeitskacheln/20_ui_redesign.md index e3fb0a2..e82cfd6 100644 --- a/arbeitskacheln/20_ui_redesign.md +++ b/arbeitskacheln/20_ui_redesign.md @@ -207,7 +207,14 @@ Aktueller Stand vor Redesign: 39 Seiten-/Komponenten-Dateien, ~7.000 Zeilen, ein - **Rechte:** keine Änderung - **Akzeptanzkriterien:** keine Seite mehr im alten Stil. - **Tests:** bestehende Tests bleiben grün. -- **DoD:** offen. +- **DoD:** umgesetzt (2026-09-06). Rest-Audit über alle Seiten/Komponenten + (`grep` nach Hex-Farben, `badge-neutral` auf echten Status-Feldern): letzte + hartkodierte Hex-Fallbacks (`NachfuellDialog.tsx`, `BeladungsplanerBoard.tsx`) + auf reine Tokens umgestellt. `FehlbestandListePage`, `MangelListePage` + (Status UND Prioritäts-Badge statt Inline-Farbe) und + `GeraeteInstanzenListe.tsx` (Admin) bekamen echte Status-Farben statt immer + `badge-neutral`. Damit ist Epic 20 (UI-Redesign, UI-001..008) vollständig + durchlaufen. --- diff --git a/frontend/src/pages/FehlbestandListePage.tsx b/frontend/src/pages/FehlbestandListePage.tsx index 7e18011..ba946fc 100644 --- a/frontend/src/pages/FehlbestandListePage.tsx +++ b/frontend/src/pages/FehlbestandListePage.tsx @@ -4,6 +4,16 @@ import { apiRequest } from "../api/client"; import { useAuth } from "../auth/AuthContext"; import type { Fehlbestand, Material, Objekt } from "../api/types"; +// UI-008 (Epic 20): Status war bisher immer badge-neutral, unabhängig vom +// tatsächlichen Zustand - andere Listen (Mängel, Ausgabe) unterscheiden längst +// visuell zwischen offen/erledigt. +const STATUS_BADGE: Record = { + offen: "badge-warning", + in_bearbeitung: "badge-warning", + nachgefuellt_teilweise: "badge-warning", + erledigt: "badge-success", +}; + // Eigenständige Abarbeitung offener Fehlbestände (Nutzer-Vorgabe): Nachfüllen/ // Mindermenge-Genehmigung sollen ohne komplette Kontrolle möglich sein - Backend // (GET /fehlbestaende, POST .../nachfuellungen, POST .../mindermenge) existierte @@ -112,7 +122,7 @@ export function FehlbestandListePage() { {objektName(fb.objekt_id)} – {materialName(fb.material_id)} - {fb.status} + {fb.status}
Soll {fb.sollmenge} / Ist {fb.istmenge} – Fehlmenge {fb.fehlmenge} diff --git a/frontend/src/pages/MangelListePage.tsx b/frontend/src/pages/MangelListePage.tsx index 99dee71..e05f60a 100644 --- a/frontend/src/pages/MangelListePage.tsx +++ b/frontend/src/pages/MangelListePage.tsx @@ -14,6 +14,15 @@ const STATUS_LABEL: Record = { erledigt: "Erledigt", }; +// UI-008 (Epic 20): Status-Badge war immer neutral, unabhängig vom Zustand. +const STATUS_BADGE: Record = { + neu: "badge-warning", + in_bearbeitung: "badge-warning", + ersatzteil_bestellt: "badge-warning", + reparatur_geplant: "badge-warning", + erledigt: "badge-success", +}; + const STATUS_OPTIONEN: MangelStatus[] = [ "neu", "in_bearbeitung", @@ -150,9 +159,9 @@ export function MangelListePage() {
{objektName(m.objekt_id)} - {m.prioritaet === "hoch" && ⚠ hoch} + {m.prioritaet === "hoch" && ⚠ hoch} - {STATUS_LABEL[m.status]} + {STATUS_LABEL[m.status]}
{m.beschreibung}
{darfStatusAendern && m.status !== "erledigt" && ( diff --git a/frontend/src/pages/admin/BeladungsplanerBoard.tsx b/frontend/src/pages/admin/BeladungsplanerBoard.tsx index 10a4226..c1c9a35 100644 --- a/frontend/src/pages/admin/BeladungsplanerBoard.tsx +++ b/frontend/src/pages/admin/BeladungsplanerBoard.tsx @@ -80,7 +80,7 @@ export function BeladungsplanerBoard({ zeilen, onZeilenChange, materialien, faec marginBottom: "0.4rem", padding: "0.35rem 0.5rem", cursor: "pointer", - outline: ausgewaehlt === m.id ? "2px solid var(--color-primary, #2563eb)" : "none", + outline: ausgewaehlt === m.id ? "2px solid var(--color-primary)" : "none", }} > {m.name} @@ -99,7 +99,7 @@ export function BeladungsplanerBoard({ zeilen, onZeilenChange, materialien, faec flex: "0 0 14rem", minHeight: "8rem", cursor: ausgewaehlt !== null ? "pointer" : "default", - borderColor: ausgewaehlt !== null ? "var(--color-primary, #2563eb)" : undefined, + borderColor: ausgewaehlt !== null ? "var(--color-primary)" : undefined, }} onClick={() => zuordnen(spalte)} > diff --git a/frontend/src/pages/admin/GeraeteInstanzenListe.tsx b/frontend/src/pages/admin/GeraeteInstanzenListe.tsx index e675b81..074aa81 100644 --- a/frontend/src/pages/admin/GeraeteInstanzenListe.tsx +++ b/frontend/src/pages/admin/GeraeteInstanzenListe.tsx @@ -15,6 +15,13 @@ const STATUS_LABEL: Record = { in_reparatur: "In Reparatur", }; +// UI-008 (Epic 20): Status-Badge war immer neutral, unabhängig vom Zustand. +const STATUS_BADGE: Record = { + einsatzbereit: "badge-success", + defekt: "badge-danger", + in_reparatur: "badge-warning", +}; + /** Karte 14: löst das Einzelfeld objektposition.seriennummer ab - beliebig * viele Geräte-Exemplare pro Position (z.B. 2 Pulsoxymeter im selben * Rucksack), je mit eigenem Prüfdatum/Status. */ @@ -103,7 +110,7 @@ export function GeraeteInstanzenListe({ objektpositionId, pruefintervallMonate,
{instanz.status === "einsatzbereit" ? "✓" : "✗"} {instanz.seriennummer}{" "} - {STATUS_LABEL[instanz.status]}{" "} + {STATUS_LABEL[instanz.status]}{" "} {instanz.naechste_pruefung && ( nächste Prüfung: {instanz.naechste_pruefung} )} diff --git a/frontend/src/pages/kontrolle/NachfuellDialog.tsx b/frontend/src/pages/kontrolle/NachfuellDialog.tsx index a62d1f7..b7d8d56 100644 --- a/frontend/src/pages/kontrolle/NachfuellDialog.tsx +++ b/frontend/src/pages/kontrolle/NachfuellDialog.tsx @@ -26,7 +26,7 @@ export function NachfuellDialog({ const [begruendung, setBegruendung] = useState(""); return ( -
+
Fehlmenge bei {materialName} – jetzt aus Lager nachfüllen?