fix(admin): "Material hinzufügen" in die Kartenspalte verschoben
CI / backend-tests (push) Failing after 1m20s
CI / frontend-build (push) Successful in 25s

Saß bisher als volle Bar über Sidebar+Kartenspalte (Screenshot-Fund) - jetzt
Teil der rechten Kartenspalte, direkt über der Positionsliste. Sidebar wird
nur noch gerendert, wenn Positionen existieren (Edge-Case: leeres Objekt
konnte bisher kein erstes Material bekommen, da der ganze Bereich hinter
positionen.length>0 hing).

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01CVgbozhYmuEhiEJHffRXCV
This commit is contained in:
2026-09-04 23:09:29 +02:00
co-authored by Claude Sonnet 5
parent 6f047e3033
commit f11162ebfb
@@ -152,66 +152,66 @@ export function ObjektPositionenPanel({ objektId, vorlageId, materialien, onFehl
const verfuegbareMaterialien = materialien.filter((m) => !vorhandeneMaterialIds.has(m.id)); const verfuegbareMaterialien = materialien.filter((m) => !vorhandeneMaterialIds.has(m.id));
return ( return (
<div> <div style={{ display: "flex", flexDirection: "row", alignItems: "flex-start", gap: "1.25rem" }}>
<div className="row" style={{ flexWrap: "wrap", marginBottom: "1rem" }}>
<select
className="input"
value={neuesMaterialId}
onChange={(e) => setNeuesMaterialId(Number(e.target.value) || "")}
>
<option value="">Material hinzufügen</option>
{verfuegbareMaterialien.map((m) => (
<option key={m.id} value={m.id}>
{m.name}
</option>
))}
</select>
<input
type="number"
min="0"
className="input"
style={{ maxWidth: "8rem" }}
placeholder="Sollmenge"
value={neueSollmenge}
onChange={(e) => setNeueSollmenge(e.target.value)}
/>
<button
className="btn btn-secondary"
onClick={materialHinzufuegen}
disabled={neuesMaterialId === "" || !neueSollmenge || wirdHinzugefuegt}
>
Hinzufügen
</button>
</div>
{positionen.length === 0 && <p className="text-muted">Keine Positionen in diesem Objekt.</p>}
{positionen.length > 0 && ( {positionen.length > 0 && (
<div style={{ display: "flex", flexDirection: "row", alignItems: "flex-start", gap: "1.25rem" }}> <nav
<nav className="card"
className="card" style={{ flex: "0 0 12rem", width: "12rem", boxSizing: "border-box", padding: "0.5rem" }}
style={{ flex: "0 0 12rem", width: "12rem", boxSizing: "border-box", padding: "0.5rem" }} >
<button
className={aktivesFach === null ? "btn btn-primary btn-block" : "btn btn-secondary btn-block"}
style={{ marginBottom: "0.3rem" }}
onClick={() => setAktivesFach(null)}
> >
Alle ({positionen.length})
</button>
{fachGruppen.map(([fach, gruppenPositionen]) => (
<button <button
className={aktivesFach === null ? "btn btn-primary btn-block" : "btn btn-secondary btn-block"} key={fach}
className={aktivesFach === fach ? "btn btn-primary btn-block" : "btn btn-secondary btn-block"}
style={{ marginBottom: "0.3rem" }} style={{ marginBottom: "0.3rem" }}
onClick={() => setAktivesFach(null)} onClick={() => setAktivesFach(fach)}
> >
Alle ({positionen.length}) {fach} ({gruppenPositionen.length})
</button> </button>
{fachGruppen.map(([fach, gruppenPositionen]) => ( ))}
<button </nav>
key={fach} )}
className={aktivesFach === fach ? "btn btn-primary btn-block" : "btn btn-secondary btn-block"}
style={{ marginBottom: "0.3rem" }} <div style={{ flex: "1 1 0%", minWidth: 0 }}>
onClick={() => setAktivesFach(fach)} <div className="row" style={{ flexWrap: "wrap", marginBottom: "1rem" }}>
> <select
{fach} ({gruppenPositionen.length}) className="input"
</button> value={neuesMaterialId}
))} onChange={(e) => setNeuesMaterialId(Number(e.target.value) || "")}
</nav> >
<option value="">Material hinzufügen</option>
{verfuegbareMaterialien.map((m) => (
<option key={m.id} value={m.id}>
{m.name}
</option>
))}
</select>
<input
type="number"
min="0"
className="input"
style={{ maxWidth: "8rem" }}
placeholder="Sollmenge"
value={neueSollmenge}
onChange={(e) => setNeueSollmenge(e.target.value)}
/>
<button
className="btn btn-secondary"
onClick={materialHinzufuegen}
disabled={neuesMaterialId === "" || !neueSollmenge || wirdHinzugefuegt}
>
Hinzufügen
</button>
</div>
{positionen.length === 0 && <p className="text-muted">Keine Positionen in diesem Objekt.</p>}
<div style={{ flex: "1 1 0%", minWidth: 0 }}>
<ul className="card-list"> <ul className="card-list">
{sichtbarePositionen.map((p) => { {sichtbarePositionen.map((p) => {
const typ = materialtyp(p.material_id); const typ = materialtyp(p.material_id);
@@ -295,9 +295,7 @@ export function ObjektPositionenPanel({ objektId, vorlageId, materialien, onFehl
); );
})} })}
</ul> </ul>
</div> </div>
</div>
)}
</div> </div>
); );
} }