feat: handleSave final auf API-Handler für Development erweitert

- Änderungen in Dev-Umgebung werden per /api/cpl/updateKueDataAPIHandler gespeichert
- Production weiterhin GET-Request mit Parametern
- Fehlerbehandlung optimiert

components/main/kabelueberwachung/kue705FO/handlers/handleSave.ts

@@ -12,8 +12,8 @@ export interface OriginalValues {
 }
 
 interface HandleSaveParams {
-  ids: string[]; // kueID im Redux-Slice
-  bezeichnungen: string[]; // kueBezeichnungen im Redux-Slice
+  ids: string[];
+  bezeichnungen: string[];
   isolationsgrenzwerte: number[];
   verzoegerung: number[];
   untereSchleifenGrenzwerte: number[];
@@ -26,7 +26,7 @@ interface HandleSaveParams {
   onClose: () => void;
 }
 
-const handleSave = ({
+const handleSave = async ({
   ids,
   bezeichnungen,
   isolationsgrenzwerte,
@@ -39,7 +39,7 @@ const handleSave = ({
   dispatch,
   onModulNameChange,
   onClose,
-}: HandleSaveParams): void => {
+}: HandleSaveParams): Promise<void> => {
   const changes: Partial<{
     KID: string;
     KIA: string;
@@ -81,38 +81,54 @@ const handleSave = ({
   }
 
   if (Object.keys(changes).length > 0) {
-    let url = `/cpl?/kabelueberwachung.html&slot=${slot}`;
-    Object.entries(changes).forEach(([paramKey, paramValue]) => {
-      if (paramValue !== undefined) {
-        url += `&${paramKey}${slot}=${encodeURIComponent(paramValue)}`;
-      }
-    });
+    const isDev = window.location.hostname === "localhost";
 
-    fetch(url, { method: "GET" })
-      .then((response) => {
-        if (response.ok) {
-          alert("Daten erfolgreich gespeichert!");
-          onModulNameChange(ids[slot]);
-
-          dispatch(
-            setKueData({
-              kueID: [...ids],
-              kueBezeichnungen: [...bezeichnungen],
-              isolationsgrenzwerte: [...isolationsgrenzwerte],
-              verzoegerung: [...verzoegerung],
-              untereSchleifenGrenzwerte: [...untereSchleifenGrenzwerte],
-              obereSchleifenGrenzwerte: [...obereSchleifenGrenzwerte],
-              schleifenintervall: [...schleifenintervall],
-            })
-          );
-        } else {
-          alert("Fehler beim Speichern der Daten!");
-        }
-      })
-      .catch((error) => {
-        console.error("Fehler:", error);
-        alert("Fehler beim Senden der Daten!");
+    if (isDev) {
+      await fetch("/api/cpl/updateKueDataAPIHandler", {
+        method: "POST",
+        headers: { "Content-Type": "application/json" },
+        body: JSON.stringify({
+          data: {
+            kueID: ids,
+            kueBezeichnungen: bezeichnungen,
+            isolationsgrenzwerte,
+            verzoegerung,
+            untereSchleifenGrenzwerte,
+            obereSchleifenGrenzwerte,
+            schleifenintervall,
+          },
+        }),
       });
+    } else {
+      let url = `/cpl?/kabelueberwachung.html&slot=${slot}`;
+      Object.entries(changes).forEach(([paramKey, paramValue]) => {
+        if (paramValue !== undefined) {
+          url += `&${paramKey}${slot}=${encodeURIComponent(paramValue)}`;
+        }
+      });
+
+      const response = await fetch(url, { method: "GET" });
+
+      if (!response.ok) {
+        alert("Fehler beim Speichern der Daten!");
+        return;
+      }
+    }
+
+    alert("Daten erfolgreich gespeichert!");
+    onModulNameChange(ids[slot]);
+
+    dispatch(
+      setKueData({
+        kueID: [...ids],
+        kueBezeichnungen: [...bezeichnungen],
+        isolationsgrenzwerte: [...isolationsgrenzwerte],
+        verzoegerung: [...verzoegerung],
+        untereSchleifenGrenzwerte: [...untereSchleifenGrenzwerte],
+        obereSchleifenGrenzwerte: [...obereSchleifenGrenzwerte],
+        schleifenintervall: [...schleifenintervall],
+      })
+    );
   } else {
     alert("Keine Änderungen vorgenommen.");
   }