From 6701b65f27d14d978296e2ccca4559f05f7baf2d Mon Sep 17 00:00:00 2001 From: ISA Date: Thu, 24 Apr 2025 12:25:03 +0200 Subject: [PATCH] =?UTF-8?q?fix:=20Modal-Eingaben=20vor=20automatischem=20R?= =?UTF-8?q?edux-Refresh=20gesch=C3=BCtzt?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - isInitialLoad hinzugefügt, um Eingabefelder nur beim ersten Öffnen zu initialisieren - verhindert, dass Hintergrundaktualisierungen durch Redux (fetchThunk) die Benutzereingaben überschreiben - saubere Rücksetzung von Zustand bei Modal-Schließen --- .../main/einausgaenge/modals/InputModal.tsx | 179 ++++++++++++------ config/webVersion.ts | 2 +- 2 files changed, 125 insertions(+), 56 deletions(-) diff --git a/components/main/einausgaenge/modals/InputModal.tsx b/components/main/einausgaenge/modals/InputModal.tsx index f2eac45..64b6348 100644 --- a/components/main/einausgaenge/modals/InputModal.tsx +++ b/components/main/einausgaenge/modals/InputModal.tsx @@ -1,4 +1,5 @@ "use client"; +// /components/main/einausgaenge/modals/InputModal.tsx import React, { useEffect, useState } from "react"; import { useSelector, useDispatch } from "react-redux"; import { RootState } from "../../../../redux/store"; @@ -8,55 +9,94 @@ import { } from "../../../../redux/slices/digitalInputsSlice"; export default function InputModal({ selectedInput, closeInputModal, isOpen }) { - const [invertiert, setInvertiert] = useState(false); - const [name, setName] = useState(""); const dispatch = useDispatch(); - const reduxInput = useSelector((state: RootState) => state.digitalInputsSlice.inputs.find( (input) => input.id === Number(selectedInput?.id) ) ); + const [isInitialLoad, setIsInitialLoad] = useState(true); + + const [name, setName] = useState(""); + const [invertiert, setInvertiert] = useState(false); + const [filterzeit, setFilterzeit] = useState(0); + const [gewichtung, setGewichtung] = useState(0); + const [zaehlerAktiv, setZaehlerAktiv] = useState(false); + useEffect(() => { - if (reduxInput) { - setInvertiert(reduxInput.invertierung); + if (reduxInput && isInitialLoad) { setName(reduxInput.name || ""); + setInvertiert(reduxInput.invertierung); + setFilterzeit(reduxInput.filterzeit); + setGewichtung(reduxInput.gewichtung); + setZaehlerAktiv(reduxInput.zaehlerAktiv); + setIsInitialLoad(false); } - }, [reduxInput]); + }, [reduxInput, isInitialLoad]); if (!isOpen || !selectedInput || !reduxInput) return null; - const handleInvertierungToggle = async () => { - const neueInvertierung = !invertiert; - setInvertiert(neueInvertierung); - dispatch( - updateInvertierung({ id: reduxInput.id, invertierung: neueInvertierung }) - ); + const handleSpeichern = async () => { + const updates: any = { id: reduxInput.id }; + let hasChange = false; - // Update Mock-API - await fetch("/api/cpl/updateDigitaleEingaenge", { - method: "POST", - headers: { "Content-Type": "application/json" }, - body: JSON.stringify({ - id: reduxInput.id, - invertierung: neueInvertierung ? 1 : 0, - }), - }); + if (name !== reduxInput.name) { + updates.name = name; + dispatch(updateName({ id: reduxInput.id, name })); + hasChange = true; + } + + if (invertiert !== reduxInput.invertierung) { + updates.invertierung = invertiert ? 1 : 0; + dispatch( + updateInvertierung({ id: reduxInput.id, invertierung: invertiert }) + ); + hasChange = true; + } + + if (filterzeit !== reduxInput.filterzeit) { + updates.filterzeit = filterzeit; + hasChange = true; + } + + if (gewichtung !== reduxInput.gewichtung) { + updates.gewichtung = gewichtung; + hasChange = true; + } + + if (zaehlerAktiv !== reduxInput.zaehlerAktiv) { + updates.zaehlerAktiv = zaehlerAktiv ? 1 : 0; + hasChange = true; + } + + if (!hasChange) { + alert("⚠️ Keine Änderungen erkannt."); + return; + } + + try { + const res = await fetch("/api/cpl/updateDigitaleEingaenge", { + method: "POST", + headers: { "Content-Type": "application/json" }, + body: JSON.stringify(updates), + }); + + if (!res.ok) { + const errData = await res.json(); + throw new Error(errData.error || "Unbekannter Fehler"); + } + + setIsInitialLoad(true); // Reset + closeInputModal(); // Modal schließen bei Erfolg + } catch (err: any) { + alert("❌ Fehler beim Speichern: " + err.message); + } }; - const handleNameSpeichern = async () => { - dispatch(updateName({ id: reduxInput.id, name })); - - // Update Mock-API - await fetch("/api/cpl/updateDigitaleEingaenge", { - method: "POST", - headers: { "Content-Type": "application/json" }, - body: JSON.stringify({ - id: reduxInput.id, - name: name, - }), - }); + const handleClose = () => { + setIsInitialLoad(true); + closeInputModal(); }; return ( @@ -68,18 +108,18 @@ export default function InputModal({ selectedInput, closeInputModal, isOpen }) {
- Status: + Zustand:
{reduxInput.status ? ( <> - Inaktiv + Aus ) : ( <> - Aktiv + Ein )}
@@ -87,7 +127,7 @@ export default function InputModal({ selectedInput, closeInputModal, isOpen }) {
Name:
-
+
-
Invertierung: {invertiert ? "Ein" : "Aus"} +
- Eingang offline: + Status:
-
{reduxInput.eingangOffline ? "Offline" : "Online"}
+
{reduxInput.eingangOffline ? "Inaktiv" : "Aktiv"}
- +
+ + +
); diff --git a/config/webVersion.ts b/config/webVersion.ts index a2bded4..b5a9471 100644 --- a/config/webVersion.ts +++ b/config/webVersion.ts @@ -6,5 +6,5 @@ 2: Patch oder Hotfix (Bugfixes oder kleine Änderungen). */ -const webVersion = "1.6.268"; +const webVersion = "1.6.269"; export default webVersion;