feat: Kabelname anzeigen in den modal kueEinstellung.tsx

components/main/kabelueberwachung/kue705FO/modals/KueEinstellung.tsx

@@ -38,6 +38,7 @@ export default function KueEinstellung({
   const dispatch = useDispatch();
   const {
     kueID,
+    kueName,
     kueLimit1,
     kueDelay1,
     kueLimit2Low,
@@ -57,7 +58,8 @@ export default function KueEinstellung({
   const [formData, setFormData] = useState(() => {
     if (cached) return cached;
     return {
-      name: kueID[slot] || "",
+      kueID: kueID[slot] || "",
+      kueName: kueName[slot] || "",
       limit1: kueLimit1[slot]?.toString() ?? "",
       delay1: kueDelay1[slot]?.toString() ?? "",
       limit2Low: kueLimit2Low[slot]?.toString() ?? "",
@@ -74,9 +76,12 @@ export default function KueEinstellung({
     }
   };
 
-  const handleSaveWrapper = () => {
+  const handleSaveWrapper = async () => {
     const updatedKueID = [...kueID];
-    updatedKueID[slot] = formData.name;
+    updatedKueID[slot] = formData.kueID;
+
+    const updatedKueName = [...kueName];
+    updatedKueName[slot] = formData.kueName;
 
     const updatedLimit1 = [...kueLimit1];
     updatedLimit1[slot] = Number(formData.limit1);
@@ -93,31 +98,9 @@ export default function KueEinstellung({
     const updatedMemoryInterval = [...memoryInterval];
     updatedMemoryInterval[slot] = Number(formData.memoryInterval);
 
-    handleSave({
-      ids: updatedKueID,
-      isolationsgrenzwerte: updatedLimit1,
-      verzoegerung: updatedDelay1,
-      untereSchleifenGrenzwerte: updatedLimit2Low,
-      obereSchleifenGrenzwerte: updatedLimit2Low,
-      schleifenintervall: updatedLoopInterval,
-      speicherintervall: updatedMemoryInterval,
-      originalValues: {
-        kueID,
-        isolationsgrenzwerte: kueLimit1,
-        verzoegerung: kueDelay1,
-        untereSchleifenGrenzwerte: kueLimit2Low,
-        obereSchleifenGrenzwerte: kueLimit2Low,
-        schleifenintervall: kueLoopInterval,
-        speicherintervall: memoryInterval,
-      },
-      slot,
-      dispatch,
-      onModulNameChange: onModulNameChange ?? (() => {}),
-      onClose,
-    });
-
     const newData = {
-      name: updatedKueID[slot],
+      kueID: updatedKueID[slot],
+      kueName: updatedKueName[slot],
       limit1: updatedLimit1[slot].toString(),
       delay1: updatedDelay1[slot].toString(),
       limit2Low: updatedLimit2Low[slot].toString(),
@@ -126,10 +109,35 @@ export default function KueEinstellung({
     };
 
     setFormData(newData);
-
     if (typeof window !== "undefined") {
-      window.__kueCache![formCacheKey] = newData;
+      window.__kueCache![`slot_${slot}`] = newData;
     }
+
+    // 🔧 handleSave aufrufen mit allen Daten
+    await handleSave({
+      slot,
+      ids: updatedKueID,
+      kueName: updatedKueName,
+      isolationsgrenzwerte: updatedLimit1,
+      verzoegerung: updatedDelay1,
+      untereSchleifenGrenzwerte: updatedLimit2Low,
+      obereSchleifenGrenzwerte: updatedLimit2Low, // ggf. anpassen, falls du später High-Werte brauchst
+      schleifenintervall: updatedLoopInterval,
+      speicherintervall: updatedMemoryInterval,
+      originalValues: {
+        kueID,
+        kueName,
+        isolationsgrenzwerte: kueLimit1,
+        verzoegerung: kueDelay1,
+        untereSchleifenGrenzwerte: kueLimit2Low,
+        obereSchleifenGrenzwerte: kueLimit2Low,
+        schleifenintervall: kueLoopInterval,
+        speicherintervall: memoryInterval,
+      },
+      dispatch,
+      onModulNameChange,
+      onClose,
+    });
   };
 
   return (
@@ -137,11 +145,22 @@ export default function KueEinstellung({
       {/* Kabelbezeichnung */}
       <div className="mb-4 grid grid-cols-3 items-center gap-2 w-full">
         <label className="">Kabelbezeichnung:</label>
+        <input
+          type="text"
+          className="w-full border rounded p-1 bg-gray-100 text-gray-600"
+          value={formData.kueID}
+          readOnly
+          title="Feld kann nicht bearbeitet werden"
+        />
+      </div>
+      {/* Kabelname */}
+      <div className="mb-4 grid grid-cols-3 items-center gap-2 w-full">
+        <label className="">Kabelname:</label>
         <input
           type="text"
           className="w-full border rounded p-1"
-          value={formData.name}
-          onChange={(e) => handleChange("name", e.target.value)}
+          value={formData.kueName}
+          onChange={(e) => handleChange("kueName", e.target.value)}
         />
       </div>
       {/* Speicherintervall */}
@@ -223,7 +242,7 @@ export default function KueEinstellung({
           </div>
         </div>
       </div>
-      <div className="flex justify-end gap-2  p-3 rounded">
+      <div className="flex justify-end gap-2  p-0 rounded">
         {isAdminLoggedIn && (
           <button
             onClick={() => firmwareUpdate(slot)}