deat: KVz anzeigen

components/main/kabelueberwachung/kue705FO/Kue705FO.tsx

@@ -2,6 +2,7 @@
 import React, { useState, useMemo } from "react";
 import { useSelector } from "react-redux";
 import KueModal from "./modals/SettingsModalWrapper";
+import FallSensors from "../../fall-detection-sensors/FallSensors";
 import "bootstrap-icons/font/bootstrap-icons.css"; // Import Bootstrap Icons
 import { Kue705FOProps } from "../../../../types/Kue705FOProps";
 // Import the new specialized ChartView components
@@ -63,6 +64,7 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
   const [showIsoModal, setShowIsoModal] = useState(false);
   const [showRslModal, setShowRslModal] = useState(false);
   const [showTdrModal, setShowTdrModal] = useState(false);
+  const [showKvzPanel, setShowKvzPanel] = useState(false);
   // Keep original showChartModal for backwards compatibility if needed
   // const [showChartModal, setShowChartModal] = useState(false);
   // Removed unused loopMeasurementCurveChartData state
@@ -162,6 +164,14 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
   const closeTdrModal = () => {
     setShowTdrModal(false);
   };
+
+  const openKvzModal = () => {
+    setShowKvzPanel(!showKvzPanel);
+  };
+
+  const closeKvzModal = () => {
+    setShowKvzPanel(false);
+  };
   //----------------------------------
   //hooks einbinden
   const kueVersion = useKueVersion(slotIndex, reduxKueVersion);
@@ -388,7 +398,10 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
               >
                 TDR
               </button>
-              <button className="bg-littwin-blue text-white text-[0.625rem] flex items-center justify-center p-2">
+              <button
+                onClick={openKvzModal}
+                className="bg-littwin-blue text-white text-[0.625rem] flex items-center justify-center p-2"
+              >
                 KVz
               </button>
             </div>
@@ -399,6 +412,9 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
             <div className="flex flex-col space-y-2 w-full"></div>
           </div>
 
+          {/* ISO Chart Modal */}
+          <div className="absolute bottom-0 left-0 right-0 h-[0.125rem] bg-gray-400"></div>
+
           {/* ISO Chart Modal */}
           <IsoChartView
             isOpen={showIsoModal}
@@ -421,9 +437,17 @@ const Kue705FO: React.FC<Kue705FOProps> = ({
           />
         </>
       )}
+
+      {/* KVz Panel - Anzeige ganz unten */}
+      {showKvzPanel && (
+        <div className=" bg-gray-400 mt-4  border  p-1">
+          <FallSensors />
+        </div>
+      )}
+
       {/* Offline-View */}
       {kueOnline !== 1 && (
-        <div className="flex items-center justify-center h-full text-gray-500">
+        <div className="flex items-center justify-center ">
           {/* Das soll rausgenommen werden 
           <p>Kein Modul im Slot {slotIndex + 0}</p>
          */}