diff --git a/components/main/einausgaenge/modals/OutputModal.tsx b/components/main/einausgaenge/modals/OutputModal.tsx index 36e8753..fd7538f 100644 --- a/components/main/einausgaenge/modals/OutputModal.tsx +++ b/components/main/einausgaenge/modals/OutputModal.tsx @@ -1,5 +1,7 @@ -"use client"; // /compoenents/main/einausgaenge/modals/OutputModal.tsx +"use client"; // /components/main/einausgaenge/modals/OutputModal.tsx import React, { useState } from "react"; +import { useSelector } from "react-redux"; +import { RootState } from "../../../../redux/store"; export default function OutputModal({ selectedOutput, @@ -10,25 +12,45 @@ export default function OutputModal({ closeOutputModal: () => void; isOpen: boolean; }) { - if (!isOpen || !selectedOutput) return null; + const allOutputs = useSelector( + (state: RootState) => state.digitalOutputsSlice.outputs + ); const [label, setLabel] = useState(selectedOutput.label || ""); const [status, setStatus] = useState(selectedOutput.status || false); - const [timer, setTimer] = useState(0); // Optional: Sekunden für temporäres Einschalten + const [timer, setTimer] = useState(0); + const [isSaving, setIsSaving] = useState(false); + const [errorMsg, setErrorMsg] = useState(""); - const handleSave = () => { - // TODO: Ersetze dies durch echten API-Call (z. B. per fetch) - console.log("🔧 Neue Einstellungen:", { - id: selectedOutput.id, - label, - status, - timer: timer > 0 ? timer : null, - }); + if (!isOpen || !selectedOutput) return null; - // Optional: Fake-Aufruf an CGI-Endpoint - // location.href = `CPL?Service/ausgaenge.ACP&DA${selectedOutput.id}=${status ? 1 : 0}`; + const handleSave = async () => { + setIsSaving(true); + setErrorMsg(""); - closeOutputModal(); + const updatedOutputs = allOutputs.map((output) => + output.id === selectedOutput.id ? { ...output, label, status } : output + ); + + try { + const res = await fetch("/api/cpl/updateDigitalOutputs", { + method: "POST", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify({ outputs: updatedOutputs }), + }); + + if (!res.ok) { + const err = await res.json(); + setErrorMsg(err?.error || "Fehler beim Speichern."); + } else { + console.log("✅ Änderungen gespeichert"); + closeOutputModal(); + } + } catch (err) { + setErrorMsg("❌ Netzwerkfehler beim Speichern."); + } finally { + setIsSaving(false); + } }; return ( @@ -75,18 +97,22 @@ export default function OutputModal({ /> + {errorMsg &&
{errorMsg}
} +