Modulname von Modal ändern und den Modul übergeben

components/modales/KueModal.jsx

@@ -1,7 +1,7 @@
 import ReactModal from "react-modal";
 import { useState, useEffect } from "react";
 
-function KueModal({ showModal, onClose, slot }) {
+function KueModal({ showModal, onClose, slot, onModulNameChange }) {
   // Verwende ein Array von Bezeichnungen und Isolationsgrenzwerten für 32 Slots
   const [bezeichnungen, setBezeichnungen] = useState(Array(32).fill("---"));
   const [isolationsgrenzwerte, setIsolationsgrenzwerte] = useState(
@@ -60,6 +60,33 @@ function KueModal({ showModal, onClose, slot }) {
       return updatedGrenzwerte;
     });
   };
+  const handleSave = () => {
+    const newBezeichnung = bezeichnungen[slot];
+    // Angepasstes URL-Format gemäß deinem funktionierenden Test
+    const url = `${
+      process.env.NEXT_PUBLIC_API_BASE_URL
+    }/cpl?Service/kueDetail.HTML&slot=${slot}&KIA${slot}=${encodeURIComponent(
+      newBezeichnung
+    )}`;
+
+    // Fetch-Aufruf, um den neuen Modulnamen zu senden
+    fetch(url, { method: "GET" })
+      .then((response) => {
+        if (response.ok) {
+          alert("Modulname erfolgreich gespeichert!");
+          onModulNameChange(newBezeichnung); // Hier wird die Änderung weitergegeben
+        } else {
+          alert("Fehler beim Speichern des Modulnamens!");
+        }
+      })
+      .catch((error) => {
+        console.error("Fehler:", error);
+        alert("Fehler beim Senden des Modulnamens!");
+      });
+
+    // Schließe das Modal nach dem Speichern
+    onClose();
+  };
 
   return (
     <ReactModal
@@ -188,7 +215,7 @@ function KueModal({ showModal, onClose, slot }) {
       {/* Modal Footer */}
       <div className="flex justify-end bg-gray-100 p-4 rounded-b-lg">
         <button
-          onClick={onClose}
+          onClick={handleSave}
           className="bg-blue-500 text-white p-2 rounded flex items-center"
         >
           <span className="mr-2">💾</span> Speichern