diff --git a/src/components/PlanView.tsx b/src/components/PlanView.tsx index 39eb0f0..adc1268 100644 --- a/src/components/PlanView.tsx +++ b/src/components/PlanView.tsx @@ -75,7 +75,6 @@ type Column = | { kind: "transition"; fromPhase: PhaseComputed; toPhase: PhaseComputed }; type Selection = - | { type: "phaseCell"; elementId: string; phaseId: string } | { type: "phase"; phaseId: string }; export function PlanView({ @@ -94,6 +93,7 @@ export function PlanView({ const [showSettings, setShowSettings] = useState(false); const [reviewFromPhaseId, setReviewFromPhaseId] = useState(null); const [editTransition, setEditTransition] = useState<{ elementId: string; fromPhaseId: string } | null>(null); + const [editPhaseCell, setEditPhaseCell] = useState<{ elementId: string; phaseId: string } | null>(null); const columns = useMemo(() => { const cols: Column[] = []; @@ -389,17 +389,13 @@ export function PlanView({ {columns.map((col) => { if (col.kind === "phase") { const ce = computedElement(col.phase.id, el.id); - const isSel = - selected?.type === "phaseCell" && - selected.elementId === el.id && - selected.phaseId === col.phase.id; return ( setSelected({ type: "phaseCell", elementId: el.id, phaseId: col.phase.id })} + onClick={() => setEditPhaseCell({ elementId: el.id, phaseId: col.phase.id })} className={`cursor-pointer border-b border-r border-border px-2 py-1.5 text-center text-xs ${ - isSel ? "bg-accent-soft" : "" - } ${ce?.locked ? "text-faint" : "text-fg"}`} + ce?.locked ? "text-faint" : "text-fg" + }`} > {phaseCellContent(ce)} @@ -443,10 +439,7 @@ export function PlanView({ {/* Detail-Panel. Der key erzwingt beim Wechsel von Zelle/Phase einen Neuaufbau, damit der lokale Formular-Zustand nicht vom vorher geoeffneten Element uebrig bleibt. */} {selected && ( -
+
{renderDetail()}
)} @@ -526,6 +519,31 @@ export function PlanView({ /> ); })()} + + {editPhaseCell && (() => { + const element = plan.elements.find((e) => e.id === editPhaseCell.elementId); + const phase = computed.phases.find((p) => p.id === editPhaseCell.phaseId); + if (!element || !phase) return null; + const context = buildPhaseContext(phase, element); + return ( + setEditPhaseCell(null)} + onSaved={() => { + setEditPhaseCell(null); + onChanged(); + }} + onDeleted={() => { + setEditPhaseCell(null); + deleteElement(element.id); + }} + /> + ); + })()}
); @@ -541,41 +559,21 @@ export function PlanView({ function renderDetail() { if (!selected) return null; - - if (selected.type === "phase") { - const phase = computed.phases.find((p) => p.id === selected.phaseId); - const phaseInput = plan.phases.find((p) => p.id === selected.phaseId); - if (!phase || !phaseInput) return null; - const isLast = phase.sequenceNumber === computed.phases.length; - return ( - { - setSelected(null); - onChanged(); - }} - /> - ); - } - - const element = plan.elements.find((e) => e.id === selected.elementId); - if (!element) return null; - - // phaseCell - const phase = computed.phases.find((p) => p.id === selected.phaseId)!; - const context = buildPhaseContext(phase, element); + const phase = computed.phases.find((p) => p.id === selected.phaseId); + const phaseInput = plan.phases.find((p) => p.id === selected.phaseId); + if (!phase || !phaseInput) return null; + const isLast = phase.sequenceNumber === computed.phases.length; return ( - deleteElement(element.id)} + onDeleted={() => { + setSelected(null); + onChanged(); + }} /> ); } @@ -1040,6 +1038,38 @@ function TransitionReviewDialog({ ); } +// --- Dialog: Element-Werte einer Lebensphase (per Klick auf eine Phasenzelle) --- +function PhaseCellDialog({ + element, + phase, + context, + phaseData, + onClose, + onSaved, + onDeleted, +}: { + element: ElementInput; + phase: PhaseComputed; + context: CellContext; + phaseData: PhaseData; + onClose: () => void; + onSaved: () => void; + onDeleted: () => void; +}) { + return ( + + + + ); +} + // --- Dialog: einzelner Übergangs-Entscheid (per Klick auf eine Übergangszelle) --- function TransitionCellDialog({ element,