feat: Fullscreen-Zustand mit Redux verwaltet

- `isFullScreen` zum Redux-Slice hinzugefügt
- `ChartSwitcher.tsx` angepasst, um Redux zu nutzen
- `LoopMeasurementChart.tsx` & `TDRChart.tsx` auf Redux umgestellt
- Fullscreen-Zustand bleibt jetzt persistent

components/main/kabelueberwachung/kue705FO/Charts/ChartSwitcher.tsx

@@ -7,7 +7,10 @@ import LoopMeasurementChart from "./LoopMeasurementChart/LoopMeasurementChart";
 import TDRChart from "./TDRChart/TDRChart";
 import { useSelector, useDispatch } from "react-redux";
 import { RootState } from "../../../../../redux/store";
-import { setChartOpen } from "../../../../../redux/slices/kabelueberwachungChartSlice";
+import {
+  setChartOpen,
+  setFullScreen,
+} from "../../../../../redux/slices/kabelueberwachungChartSlice";
 
 interface ChartSwitcherProps {
   isOpen: boolean;
@@ -19,17 +22,20 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({ isOpen, onClose }) => {
   const activeMode = useSelector(
     (state: RootState) => state.kueChartMode.activeMode
   );
-  const [isFullScreen, setIsFullScreen] = useState(false);
+  const isFullScreen = useSelector(
+    (state: RootState) => state.kabelueberwachungChart.isFullScreen
+  );
 
   // **Modal schließen + Redux-Status zurücksetzen**
   const handleClose = () => {
     dispatch(setChartOpen(false));
+    dispatch(setFullScreen(false));
     onClose();
   };
 
   // **Vollbildmodus umschalten**
   const toggleFullScreen = () => {
-    setIsFullScreen(!isFullScreen);
+    dispatch(setFullScreen(!isFullScreen));
   };
 
   return (
@@ -108,7 +114,7 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({ isOpen, onClose }) => {
           <>
             <h3 className="text-lg font-semibold">Schleifenmessung</h3>
             <LoopChartActionBar />
-            <div style={{ flex: 1, height: "100%" }}>
+            <div style={{ flex: 1, height: "90%" }}>
               <LoopMeasurementChart isFullScreen={isFullScreen} />
             </div>
           </>
@@ -116,7 +122,7 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({ isOpen, onClose }) => {
           <>
             <h3 className="text-lg font-semibold">TDR-Messung</h3>
             <TDRChartActionBar />
-            <div style={{ flex: 1, height: "100%" }}>
+            <div style={{ flex: 1, height: "90%" }}>
               <TDRChart isFullScreen={isFullScreen} />
             </div>
           </>

components/main/kabelueberwachung/kue705FO/Charts/LoopMeasurementChart/LoopMeasurementChart.tsx

@@ -6,7 +6,11 @@ import { RootState } from "../../../../../../redux/store";
 import Chart from "chart.js/auto";
 import "chartjs-adapter-moment";
 
-const LoopMeasurementChart = ({ isFullScreen }: { isFullScreen: boolean }) => {
+const LoopMeasurementChart = () => {
+  const isFullScreen = useSelector(
+    (state: RootState) => state.kabelueberwachungChart.isFullScreen
+  );
+
   const chartRef = useRef<HTMLCanvasElement>(null);
   const chartInstance = useRef<Chart | null>(null);
   const [zoomPlugin, setZoomPlugin] = useState<any>(null);

components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart.tsx

@@ -1,10 +1,15 @@
 // components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart.tsx
 import React, { useEffect, useRef } from "react";
+import { RootState } from "../../../../../../redux/store";
 import { useSelector } from "react-redux";
 import { Chart, registerables } from "chart.js";
 import "chartjs-adapter-date-fns";
 
-const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
+const TDRChart: React.FC = () => {
+  const isFullScreen = useSelector(
+    (state: RootState) => state.kabelueberwachungChart.isFullScreen
+  );
+
   const chartRef = useRef<HTMLCanvasElement>(null);
   const chartInstance = useRef<Chart | null>(null);
 

config/webVersion.ts

@@ -6,5 +6,5 @@
 2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
 
 */
-const webVersion = "1.6.108";
+const webVersion = "1.6.109";
 export default webVersion;

redux/slices/kabelueberwachungChartSlice.ts

@@ -18,6 +18,7 @@ interface KabelueberwachungChartState {
   isChartOpen: boolean;
   slotNumber: number | null;
   tdrChartData: TDRData[]; // Hinzufügen des TDR-Datenzustands
+  isFullScreen: boolean;
 }
 
 // Initialer Zustand des Slices
@@ -30,6 +31,7 @@ const initialState: KabelueberwachungChartState = {
   isChartOpen: false,
   slotNumber: null,
   tdrChartData: [], // Initialisierung mit leerem Array
+  isFullScreen: false,
 };
 
 // Erstellung des Slices
@@ -78,6 +80,9 @@ const kabelueberwachungChartSlice = createSlice({
     ) => {
       state.tdrChartData = action.payload;
     },
+    setFullScreen: (state, action: PayloadAction<boolean>) => {
+      state.isFullScreen = action.payload; // **⬅️ Neue Action für Fullscreen**
+    },
   },
 });
 
@@ -91,6 +96,7 @@ export const {
   setSelectedSlotType,
   setChartOpen,
   setTDRChartData,
+  setFullScreen,
 } = kabelueberwachungChartSlice.actions;
 
 // Export des Reducers