From f59fd0d773389adc28504768bea4bd8bb120443e Mon Sep 17 00:00:00 2001
From: ISA <Ismail.ali@littwin-systemtechnik.de>
Date: Wed, 30 Apr 2025 14:52:14 +0200
Subject: [PATCH] =?UTF-8?q?fix:=20TDR-Switch=20=C3=BCbernimmt=20jetzt=20Zu?=
 =?UTF-8?q?stand=20aus=20Redux=20und=20sendet=20aktivierten=20Status=20an?=
 =?UTF-8?q?=20Backend?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Zustand bei Modalöffnung synchronisiert
- CGI-Aufruf im Hintergrund
- UX konsistent beim Öffnen, Schließen und erneuten Öffnen
---
 .../kue705FO/modals/TdrEinstellung.tsx        | 60 +++++++++++++++----
 1 file changed, 49 insertions(+), 11 deletions(-)

diff --git a/components/main/kabelueberwachung/kue705FO/modals/TdrEinstellung.tsx b/components/main/kabelueberwachung/kue705FO/modals/TdrEinstellung.tsx
index ba67c9f..e4a7d51 100644
--- a/components/main/kabelueberwachung/kue705FO/modals/TdrEinstellung.tsx
+++ b/components/main/kabelueberwachung/kue705FO/modals/TdrEinstellung.tsx
@@ -1,7 +1,6 @@
 "use client";
-// /components/main/kabelueberwachung/kue705FO/modals/TdrEinstellung.tsx
 
-import React, { useState } from "react";
+import React, { useState, useEffect } from "react";
 import { useSelector } from "react-redux";
 import { RootState } from "../../../../../redux/store";
 
@@ -12,14 +11,18 @@ interface Props {
 export default function TdrEinstellung({ slot }: Props) {
   const tdrSlice = useSelector((state: RootState) => state.kueDataSlice);
 
-  // Lokaler Zustand, initialisiert aus Redux
   const [tdrData, setTdrData] = useState({
     daempfung: tdrSlice.tdrAtten?.[slot]?.toString() ?? "",
     geschwindigkeit: tdrSlice.tdrSpeed?.[slot]?.toString() ?? "",
     trigger: tdrSlice.tdrTrigger?.[slot]?.toString() ?? "",
   });
 
-  const [tdrActive, setTdrActive] = useState(false); // Kann später aus Redux kommen
+  const [tdrActive, setTdrActive] = useState(false);
+
+  // Zustand beim Öffnen aus Redux übernehmen
+  useEffect(() => {
+    setTdrActive(tdrSlice.tdrActive?.[slot] === 1);
+  }, [slot, tdrSlice.tdrActive]);
 
   const handleSave = () => {
     const { daempfung, geschwindigkeit, trigger } = tdrData;
@@ -28,9 +31,47 @@ export default function TdrEinstellung({ slot }: Props) {
       return;
     }
 
-    const url = `/CPL?KTT${slot}=0&V=${daempfung.trim()}&P=${geschwindigkeit.trim()}&T=${trigger.trim()}`;
-    alert(`Sende: ${url}`);
-    window.location.href = url;
+    const base = `${window.location.origin}/CPL?/kabelueberwachung.html`;
+
+    const urls = [
+      `${base}&KTD${slot}=${tdrData.daempfung.trim()}`,
+      `${base}&KTS${slot}=${tdrData.geschwindigkeit.trim()}`,
+      `${base}&KTE${slot}=${tdrData.trigger.trim()}`,
+    ];
+
+    Promise.all(
+      urls.map((url) =>
+        fetch(url).then((res) => {
+          if (!res.ok) throw new Error(`Fehler bei ${url}`);
+          return res.text();
+        })
+      )
+    )
+      .then(() => {
+        alert("TDR-Einstellungen erfolgreich gesendet.");
+      })
+      .catch((err) => {
+        console.error("Fehler beim Senden:", err);
+        alert("Fehler beim Senden der TDR-Einstellungen.");
+      });
+  };
+
+  const handleTdrToggle = () => {
+    const newState = !tdrActive;
+    setTdrActive(newState);
+
+    const url = `${
+      window.location.origin
+    }/CPL?/kabelueberwachung.html&KTX${slot}=${newState ? 1 : 0}`;
+    fetch(url)
+      .then((res) => {
+        if (!res.ok) throw new Error("TDR-Befehl fehlgeschlagen");
+        console.log("TDR aktiviert/deaktiviert:", res.status);
+      })
+      .catch((err) => {
+        console.error("Fehler beim TDR-Befehl:", err);
+        alert("Fehler beim Umschalten der TDR-Funktion.");
+      });
   };
 
   return (
@@ -45,7 +86,7 @@ export default function TdrEinstellung({ slot }: Props) {
           type="button"
           role="switch"
           aria-checked={tdrActive}
-          onClick={() => setTdrActive(!tdrActive)}
+          onClick={handleTdrToggle}
           className={`relative inline-flex h-6 w-11 items-center rounded-full transition-colors duration-200 ${
             tdrActive ? "bg-green-500" : "bg-gray-300"
           }`}
@@ -62,7 +103,6 @@ export default function TdrEinstellung({ slot }: Props) {
       </div>
 
       <div className="grid grid-cols-1 md:grid-cols-3 gap-4">
-        {/* TDR Dämpfung */}
         <div>
           <label className="block text-sm font-medium mb-1">TDR Dämpfung</label>
           <div className="relative">
@@ -80,7 +120,6 @@ export default function TdrEinstellung({ slot }: Props) {
           </div>
         </div>
 
-        {/* Geschwindigkeit */}
         <div>
           <label className="block text-sm font-medium mb-1">
             Geschwindigkeit
@@ -100,7 +139,6 @@ export default function TdrEinstellung({ slot }: Props) {
           </div>
         </div>
 
-        {/* Trigger */}
         <div>
           <label className="block text-sm font-medium mb-1">Trigger</label>
           <input