Modal für KÜ

components/modules/Kue705FO.jsx

@@ -1,4 +1,5 @@
 import React, { useState } from "react";
+import KueModal from "../modales/KueModal";
 
 function Kue705FO({
   isolationswert, // Übergabeparameter für den Isolationswert
@@ -15,7 +16,16 @@ function Kue705FO({
   const [currentDisplayValue, setCurrentDisplayValue] = useState(
     schleifenwiderstand || "0"
   ); // Wert, der im unteren Display angezeigt wird
+  //--Modales Fenster
+  const [showModal, setShowModal] = useState(false);
+  const handleOpenModal = () => {
+    setShowModal(true);
+  };
 
+  const handleCloseModal = () => {
+    setShowModal(false);
+  };
+  //----
   // Funktion zum Wechseln der Buttons und Anpassen des Anzeigewerts
   const handleButtonClick = (button) => {
     if (button === "Schleife") {
@@ -116,12 +126,17 @@ function Kue705FO({
               <h3 className="text-white font-bold text-[9px] mr-4">KÜ705-FO</h3>
 
               <button
-                onClick={() => console.log("Settings clicked")}
+                onClick={handleOpenModal}
                 className="w-[15px] h-[15px] bg-gray-400 flex items-center justify-center"
               >
                 <span className="text-white text-[20px]">⚙</span>
               </button>
             </div>
+            {/* Modal */}
+            <KueModal showModal={showModal} onClose={handleCloseModal}>
+              <h2>Modul Einstellungen</h2>
+              <p>Hier kannst du Einstellungen für {modulName} vornehmen.</p>
+            </KueModal>
 
             <div className="flex flex-col mt-[10px] ml-[10px]">
               <div className="flex items-center">