diff --git a/components/modales/KueModal.jsx b/components/modales/KueModal.jsx index f419a71..d3d16aa 100644 --- a/components/modales/KueModal.jsx +++ b/components/modales/KueModal.jsx @@ -1,64 +1,70 @@ "use client"; // components/modales/KueModal.jsx import ReactModal from "react-modal"; import { useState, useEffect } from "react"; +import { useSelector } from "react-redux"; import "bootstrap-icons/font/bootstrap-icons.css"; // Import Bootstrap Icons function KueModal({ showModal, onClose, slot, onModulNameChange }) { - const [ids, setIds] = useState(Array(32).fill("---")); // IDs für jedes Modul + const [ids, setIds] = useState(Array(32).fill("---")); const [bezeichnungen, setBezeichnungen] = useState(Array(32).fill("---")); const [isolationsgrenzwerte, setIsolationsgrenzwerte] = useState( Array(32).fill(10.0) - ); // Default 10.0 MOhm - const [verzoegerung, setVerzoegerung] = useState(Array(32).fill(1.0)); // Default Verzögerung 1 Sekunde + ); + const [verzoegerung, setVerzoegerung] = useState(Array(32).fill(1.0)); const [untereSchleifenGrenzwerte, setUntereSchleifenGrenzwerte] = useState( Array(32).fill(0.1) - ); // kOhm + ); const [obereSchleifenGrenzwerte, setObereSchleifenGrenzwerte] = useState( Array(32).fill(1.0) - ); // kOhm + ); const [schleifenintervall, setSchleifenintervall] = useState( Array(32).fill(24) - ); // Default 24 Stunden - // Originalwerte speichern - const [originalValues, setOriginalValues] = useState({}); - useEffect(() => { - const initialValues = { - ids: [...ids], - bezeichnungen: [...bezeichnungen], - isolationsgrenzwerte: [...isolationsgrenzwerte], - verzoegerung: [...verzoegerung], - untereSchleifenGrenzwerte: [...untereSchleifenGrenzwerte], - obereSchleifenGrenzwerte: [...obereSchleifenGrenzwerte], - schleifenintervall: [...schleifenintervall], - }; - setOriginalValues(initialValues); - }, [showModal]); + ); + const [originalValues, setOriginalValues] = useState({}); + + // Werte aus dem Redux-Store abrufen + const { + kueID, + kueLimit1, + kueDelay1, + kueLimit2Low, + kueLimit2High, + kueLoopInterval, + } = useSelector((state) => state.variables); + + // Initiale Werte festlegen, wenn das Modal geöffnet wird useEffect(() => { - // Initialisierung mit Werten aus dem globalen `window`-Objekt - //ID statt Name - if (window.kueID && Array.isArray(window.kueID)) { - setIds(window.kueID.map((id) => id.trim() || "---")); + if (showModal) { + setIds(kueID ? kueID.map((id) => id.trim() || "---") : ids); + setBezeichnungen( + kueID ? kueID.map((name) => name.trim() || "---") : bezeichnungen + ); + setIsolationsgrenzwerte(kueLimit1 || isolationsgrenzwerte); + setVerzoegerung(kueDelay1 || verzoegerung); + setUntereSchleifenGrenzwerte(kueLimit2Low || untereSchleifenGrenzwerte); + setObereSchleifenGrenzwerte(kueLimit2High || obereSchleifenGrenzwerte); + setSchleifenintervall(kueLoopInterval || schleifenintervall); + + setOriginalValues({ + ids: [...ids], + bezeichnungen: [...bezeichnungen], + isolationsgrenzwerte: [...isolationsgrenzwerte], + verzoegerung: [...verzoegerung], + untereSchleifenGrenzwerte: [...untereSchleifenGrenzwerte], + obereSchleifenGrenzwerte: [...obereSchleifenGrenzwerte], + schleifenintervall: [...schleifenintervall], + }); } - if (window.kueID && Array.isArray(window.kueID)) { - setBezeichnungen(window.kueID.map((name) => name.trim() || "---")); - } - if (window.kueLimit1 && Array.isArray(window.kueLimit1)) { - setIsolationsgrenzwerte(window.kueLimit1); - } - if (window.kueDelay1 && Array.isArray(window.kueDelay1)) { - setVerzoegerung(window.kueDelay1); - } - if (window.kueLimit2Low && Array.isArray(window.kueLimit2Low)) { - setUntereSchleifenGrenzwerte(window.kueLimit2Low); - } - if (window.kueLimit2High && Array.isArray(window.kueLimit2High)) { - setObereSchleifenGrenzwerte(window.kueLimit2High); - } - if (window.kueLoopInterval && Array.isArray(window.kueLoopInterval)) { - setSchleifenintervall(window.kueLoopInterval); - } - }, []); + }, [ + showModal, + kueID, + kueLimit1, + kueDelay1, + kueLimit2Low, + kueLimit2High, + kueLoopInterval, + ]); // Funktionen zur Änderung der Werte const handleChange = (setter, e, slot) => { @@ -71,17 +77,9 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) { }; const handleSave = () => { - // Validierung: Der obere Grenzwert darf nicht kleiner als der untere sein - /* if (obereSchleifenGrenzwerte[slot] < untereSchleifenGrenzwerte[slot]) { wird nicht mehr benötigt - alert( - `Der obere Schleifengrenzwert (${obereSchleifenGrenzwerte[slot]} kOhm) darf nicht kleiner als der untere Grenzwert (${untereSchleifenGrenzwerte[slot]} kOhm) sein!` - ); - return; // Speichern verhindern - } - */ const changes = {}; - // Vergleich mit den Originalwerten, um Änderungen zu erkennen + // Überprüfen, ob Änderungen gegenüber den Originalwerten vorliegen if (ids[slot] !== originalValues.ids[slot]) { changes.KID = ids[slot]; } @@ -112,10 +110,8 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) { changes.KRI = schleifenintervall[slot]; } - // Falls Änderungen vorhanden sind, die fetch-Requests auslösen if (Object.keys(changes).length > 0) { let url = `/cpl?/CPL/SERVICE/kueDetail.HTML&slot=${slot}`; - Object.keys(changes).forEach((paramKey) => { url += `&${paramKey}${slot}=${encodeURIComponent(changes[paramKey])}`; }); @@ -124,7 +120,7 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) { .then((response) => { if (response.ok) { alert("Daten erfolgreich gespeichert!"); - onModulNameChange(ids[slot]); // Weitergabe der Änderung + onModulNameChange(ids[slot]); } else { alert("Fehler beim Speichern der Daten!"); } @@ -137,7 +133,6 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) { alert("Keine Änderungen vorgenommen."); } - // Schließe das Modal nach dem Speichern onClose(); }; @@ -183,7 +178,6 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) { }, }} > - {/* Modal Header */}
| Grenzwert (kOhm) | -Schleifenintervall (h) | @@ -287,19 +266,18 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) { type="number" className="w-[6rem] border rounded p-1 text-sm" value={untereSchleifenGrenzwerte[slot]} - step="0.1" // Schrittgröße für Nachkommastellen + step="0.1" onChange={(e) => handleChange(setUntereSchleifenGrenzwerte, e, slot) } /> -handleChange(setSchleifenintervall, e, slot)} /> | @@ -308,7 +286,6 @@ function KueModal({ showModal, onClose, slot, onModulNameChange }) {
|---|