Schleifenmessung starten mit goLoop Funktion

components/modules/Kue705FO.jsx

@@ -38,21 +38,52 @@ function Kue705FO({
       slot: slot,
     };
 
-    // Die Basis-URL von der Umgebungsvariable holen
     const apiUrl = process.env.NEXT_PUBLIC_API_BASE_URL;
 
-    // Sende die POST-Anfrage an den Server mit der Basis-URL
     fetch(`${apiUrl}/CPL?Service/KUEdetailTDR.ACP`, {
       method: "POST",
       headers: {
         "Content-Type": "application/json",
       },
-      body: JSON.stringify(data), // Konvertiere die Daten in JSON-Format
+      body: JSON.stringify(data),
+    })
+      .then((response) => {
+        if (response.ok) {
+          console.log("POST erfolgreich gesendet für Slot", slot);
+        } else {
+          console.error("Fehler beim Senden der POST-Anfrage");
+        }
+      })
+      .catch((error) => {
+        console.error("Fehler:", error);
+      });
+  };
+
+  const goLoop = () => {
+    let slot = slotIndex + 1;
+
+    if (slot >= 32) {
+      return;
+    }
+
+    let slotFormat = slot < 10 ? `0${slot}` : `${slot}`;
+    const data = {
+      [`KS_${slotFormat}`]: 1,
+      slot: slot,
+    };
+
+    const apiUrl = process.env.NEXT_PUBLIC_API_BASE_URL;
+
+    fetch(`${apiUrl}/CPL?Service/KUEdetail.HTML`, {
+      method: "POST",
+      headers: {
+        "Content-Type": "application/json",
+      },
+      body: JSON.stringify(data),
     })
       .then((response) => {
         if (response.ok) {
           console.log("POST erfolgreich gesendet für Slot", slot);
-          // Hier kannst du zusätzliche Logik hinzufügen, z. B. eine Erfolgsnachricht anzeigen
         } else {
           console.error("Fehler beim Senden der POST-Anfrage");
         }
@@ -65,23 +96,27 @@ function Kue705FO({
   // Überprüfe, ob ein Modul im Slot vorhanden ist
   const isModulPresent = kueOnline[slotIndex] === 1;
 
+  // Bestimme, welche Funktion ausgeführt wird, basierend auf dem aktiven Button
+  const handleRefreshClick = () => {
+    if (activeButton === "Schleife") {
+      goLoop(); // Wenn Schleife aktiv ist, starte goLoop
+    } else if (activeButton === "TDR") {
+      goTDR(); // Wenn TDR aktiv ist, starte goTDR
+    }
+  };
+
   return (
     <div className="relative bg-gray-300 w-[116px] h-[390px] border border-gray-400 scale-110 top-3">
       {isModulPresent ? (
         <>
-          {/* Hauptkörper - Linker Bereich */}
           <div className="relative w-[113.202px] h-[242.492px] bg-littwin-blue border-[1.5px] border-gray-400 z-0">
-            {/* Header-Bereich mit Slotnummer und Zahnrad */}
             <div className="flex items-start justify-between h-[30px] ">
-              {/* Slotnummer */}
               <div className="relative w-[20px] h-[20px] bg-gray-800 flex items-center justify-center">
                 <span className="text-white text-[10px]">{slotIndex + 1}</span>
               </div>
 
-              {/* KÜ705-FO Text */}
               <h3 className="text-white font-bold text-[9px] mr-4">KÜ705-FO</h3>
 
-              {/* Zahnrad-Icon */}
               <button
                 onClick={() => console.log("Settings clicked")}
                 className="w-[15px] h-[15px] bg-gray-400 flex items-center justify-center"
@@ -90,7 +125,6 @@ function Kue705FO({
               </button>
             </div>
 
-            {/* Betrieb und Alarm Status */}
             <div className="flex flex-col mt-[10px] ml-[10px]">
               <div className="flex items-center">
                 <div className="w-[10px] h-[10px] bg-green-500 rounded-full mr-2"></div>
@@ -102,55 +136,45 @@ function Kue705FO({
               </div>
             </div>
 
-            {/* Isolationswert-Anzeige */}
             <div className="relative mt-[50px] mx-auto bg-black text-white w-[80px] h-[40px] flex items-center justify-center text-[18px] z-10">
               <div className="text-center">
-                <span>{isolationswert || ">200"}</span>{" "}
+                <span>{isolationswert || ">200"}</span>
-                {/* Dynamischer Isolationswert */}
                 <div className="text-[8px]">ISO MOhm</div>
               </div>
             </div>
 
-            {/* Weiße Linien */}
             <div className="absolute top-0 left-[75px] w-[3px] h-full bg-white z-0"></div>
             <div className="absolute top-[40px] left-[75px] w-[40px] h-[3px] bg-white z-0"></div>
 
-            {/* Modulname-Anzeige */}
             <div className="absolute bottom-[20px] left-[10px] text-black text-[10px] bg-gray-300 p-1 w-[100px] text-center">
-              {modulName || "Test1"} {/* Dynamischer Modulname */}
+              {modulName || "Test1"}
             </div>
 
-            {/* Version */}
             <div className="absolute bottom-1 right-1 text-black text-[8px]">
-              {kueVersion} {/* Dynamische Version */}
+              {kueVersion}
             </div>
           </div>
 
-          {/* Unterer Bereich - Schleifenwiderstand und Messkurve */}
           <div className="absolute bottom-1 left-[1.095px] w-[113.182px] h-[130px] bg-gray-300 border-[1.5px] border-gray-400 p-1">
             <span className="text-black text-[6px] absolute top-[2px] left-1 mt-1">
               {displayText}
             </span>
-            {/* Schleifenwiderstand Anzeige */}
+
             <div className="relative w-full h-[45px] bg-gray-100 border border-gray-400 flex items-center justify-center mt-3">
-              {/* Icon rechts oben */}
               <button
-                onClick={goTDR} // Funktion beim Klick auf den Button aufrufen
+                onClick={handleRefreshClick} // Dynamische Funktion basierend auf aktivem Button
                 className="absolute -top-1 -right-1 w-[20px] h-[20px] bg-gray-400 flex items-center justify-center"
               >
                 <span className="text-white text-[18px]">⟳</span>
               </button>
 
-              {/* Wertanzeige */}
               <div className="absolute bottom-[5px] left-1/2 transform -translate-x-1/2">
-                {/* Dynamischer Schleifenwiderstand */}
                 <div className="top-[220px] left-[10px] text-black text-[10px]">
                   <p>{schleifenwiderstand || "0"} kOhm</p>
                 </div>
               </div>
             </div>
 
-            {/* Schleife und TDR Buttons nebeneinander */}
             <div className="flex mt-2 space-x-1">
               <button
                 onClick={() => handleButtonClick("Schleife")}
@@ -172,7 +196,6 @@ function Kue705FO({
               </button>
             </div>
 
-            {/* Messkurve Button */}
             <button
               onClick={() => console.log("Messkurve clicked")}
               className="w-full h-[25px] bg-littwin-blue text-white text-[10px] flex items-center justify-center mt-1"