diff --git a/web/src/dashboard/cards.jsx b/web/src/dashboard/cards.jsx
index 7d188cb..5226356 100644
--- a/web/src/dashboard/cards.jsx
+++ b/web/src/dashboard/cards.jsx
@@ -380,6 +380,14 @@ function KarteBewegungen() {
// ---------------------------------------------------------------- Diagramme
function KarteAblaufRing() {
const { daten, fehler } = useDaten(() => api.dashboardExpirySplit());
+ // Ob „Ohne MHD" (Gegenstände/undatierte Chargen) mitgezählt wird – gemerkt.
+ const [mitOhneMhd, setMitOhneMhd] = useState(
+ () => localStorage.getItem("ablauf_mit_ohne_mhd") !== "0",
+ );
+ function umschalten(on) {
+ setMitOhneMhd(on);
+ localStorage.setItem("ablauf_mit_ohne_mhd", on ? "1" : "0");
+ }
if (fehler) return
{fehler}
;
if (!daten) return Lädt…
;
@@ -388,9 +396,20 @@ function KarteAblaufRing() {
{ name: "In Ordnung", value: daten.ok, color: tokenFarbe("--ok", "#2e7d55") },
{ name: "Bald ablaufend", value: daten.soon, color: tokenFarbe("--warn", "#b06f14") },
{ name: "Abgelaufen", value: daten.expired, color: tokenFarbe("--danger", "#c0392b") },
- { name: "Ohne MHD", value: daten.no_date, color: tokenFarbe("--muted", "#6b7480") },
];
- return ;
+ if (mitOhneMhd) {
+ segmente.push({ name: "Ohne MHD", value: daten.no_date, color: tokenFarbe("--muted", "#6b7480") });
+ }
+ return (
+
+
+
+
+ );
}
function KarteKategorienRing() {
diff --git a/web/src/styles.css b/web/src/styles.css
index 384ac50..8a7bf3a 100644
--- a/web/src/styles.css
+++ b/web/src/styles.css
@@ -674,6 +674,9 @@ select.zeitraum:hover { color: var(--text); }
gap: var(--sp-4); flex-wrap: wrap;
flex: 1; min-height: 0;
}
+/* Ablauf-Ring mit „Ohne MHD"-Umschalter darueber; der Ring fuellt den Rest. */
+.ring-mit-schalter { display: flex; flex-direction: column; flex: 1; min-height: 0; }
+.ring-schalter { flex: 0 0 auto; justify-content: flex-end; margin: 0 0 4px; font-size: 0.78rem; color: var(--muted); }
.donut-svg { width: 160px; height: 160px; flex: 0 0 auto; }
.donut-svg circle { transition: stroke-width 120ms ease; cursor: default; }
.donut-value { font-size: 20px; font-weight: 680; fill: var(--text); }