tdrChartData und loopMeasurementCurveChartData in einem Redux Slice kabelueberwachung für bessere Struktur

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

@@ -9,8 +9,8 @@ const TDRChart: React.FC = () => {
   const chartInstance = useRef<Chart | null>(null);
 
   // TDR-Daten aus dem Redux Store selektieren
-  const loopMeasurementCurveChartData = useSelector(
+  const tdrChartData = useSelector(
-    (state: any) => state.tdrChartData.data
+    (state: any) => state.kabelueberwachungChart.tdrChartData
   );
 
   useEffect(() => {
@@ -18,7 +18,7 @@ const TDRChart: React.FC = () => {
     import("chartjs-plugin-zoom").then((zoomPlugin) => {
       Chart.register(...registerables, zoomPlugin.default);
 
-      if (chartRef.current && loopMeasurementCurveChartData.length > 0) {
+      if (chartRef.current && tdrChartData.length > 0) {
         if (chartInstance.current) {
           chartInstance.current.destroy();
         }
@@ -31,7 +31,7 @@ const TDRChart: React.FC = () => {
               datasets: [
                 {
                   label: "TDR Entfernung (km)",
-                  data: loopMeasurementCurveChartData,
+                  data: tdrChartData,
                   borderColor: "rgba(255, 99, 132, 1)",
                   backgroundColor: "rgba(255, 99, 132, 0.2)",
                   tension: 0.1,
@@ -82,7 +82,7 @@ const TDRChart: React.FC = () => {
         }
       }
     });
-  }, [loopMeasurementCurveChartData]);
+  }, [tdrChartData]);
 
   return (
     <div>

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

@@ -1,11 +1,7 @@
 // /components/modules/kue705FO/charts/TDRChart/TDRChartActionBar.tsx
 import React, { useState, useEffect, useRef } from "react";
-import DateRangePicker from "../DateRangePicker";
-import TDRChart from "../../../../kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart";
-import { setLoopMeasurementCurveChartData } from "../../../../../../redux/slices/chartDataSlice";
-import { parseISO } from "date-fns";
 import { useDispatch } from "react-redux";
-import { setTDRChartData } from "../../../../../../redux/slices/tdrChartDataSlice";
+import { setTDRChartData } from "../../../../../../redux/slices/kabelueberwachungChartSlice";
 
 const TDRChartActionBar: React.FC = () => {
   const dispatch = useDispatch();
@@ -101,8 +97,9 @@ const TDRChartActionBar: React.FC = () => {
   const chartRef = useRef<HTMLCanvasElement>(null);
 
   // Zustand für die Chart-Daten
-  const [loopMeasurementCurveChartData, setLoopMeasurementCurveChartData] =
+  const [tdrChartData, settdrChartData] = useState<
-    useState<{ timestamp: string; tdr: number }[]>([]);
+    { timestamp: string; tdr: number }[]
+  >([]);
 
   useEffect(() => {
     // Aktuelles Jahr und Monat ermitteln
@@ -126,7 +123,7 @@ const TDRChartActionBar: React.FC = () => {
       })
       .then((data) => {
         // Annahme: data ist ein Array von Objekten mit den Eigenschaften 'timestamp' und 'tdr'
-        setLoopMeasurementCurveChartData(data);
+        settdrChartData(data);
       })
       .catch((error) => {
         console.error("Fehler beim Abrufen der Daten:", error);

config/webVersion.ts

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

redux/slices/kabelueberwachungChartSlice.ts

@@ -1,5 +1,14 @@
+// redux/slices/kabelueberwachungChartSlice.ts
+
 import { createSlice, PayloadAction } from "@reduxjs/toolkit";
 
+// Definition des Interface für den Zustand des TDR-Charts
+interface TDRData {
+  timestamp: string;
+  tdr: number;
+}
+
+// Definition des Interface für den gesamten Zustand der Kabelüberwachung
 interface KabelueberwachungChartState {
   loopMeasurementCurveChartData: any[];
   vonDatum: string;
@@ -7,9 +16,11 @@ interface KabelueberwachungChartState {
   selectedMode: "DIA0" | "DIA1" | "DIA2";
   selectedSlotType: "isolationswiderstand" | "schleifenwiderstand";
   isChartOpen: boolean;
-  slotNumber: number | null; // NEU: Slot-Nummer speichern
+  slotNumber: number | null;
+  tdrChartData: TDRData[]; // Hinzufügen des TDR-Datenzustands
 }
 
+// Initialer Zustand des Slices
 const initialState: KabelueberwachungChartState = {
   loopMeasurementCurveChartData: [],
   vonDatum: "2025-02-01",
@@ -17,52 +28,70 @@ const initialState: KabelueberwachungChartState = {
   selectedMode: "DIA0",
   selectedSlotType: "schleifenwiderstand",
   isChartOpen: false,
-  slotNumber: null, // Standard: Kein Slot gewählt
+  slotNumber: null,
+  tdrChartData: [], // Initialisierung mit leerem Array
 };
 
+// Erstellung des Slices
 const kabelueberwachungChartSlice = createSlice({
   name: "kabelueberwachungChart",
   initialState,
   reducers: {
+    // Aktion zum Setzen der Slot-Nummer
     setSlotNumber: (state, action: PayloadAction<number | null>) => {
       state.slotNumber = action.payload;
     },
+    // Aktion zum Setzen der Schleifenmesskurven-Daten
     setLoopMeasurementCurveChartData: (state, action: PayloadAction<any[]>) => {
       state.loopMeasurementCurveChartData = action.payload;
     },
+    // Aktion zum Setzen des Startdatums
     setVonDatum: (state, action: PayloadAction<string>) => {
-      state.vonDatum = action.payload.replace(/-/g, ";"); // Speichert als "YYYY;MM;DD"
+      state.vonDatum = action.payload.replace(/-/g, ";");
     },
+    // Aktion zum Setzen des Enddatums
     setBisDatum: (state, action: PayloadAction<string>) => {
-      state.bisDatum = action.payload.replace(/-/g, ";"); // Speichert als "YYYY;MM;DD"
+      state.bisDatum = action.payload.replace(/-/g, ";");
     },
-
+    // Aktion zum Setzen des ausgewählten Modus
     setSelectedMode: (
       state,
       action: PayloadAction<"DIA0" | "DIA1" | "DIA2">
     ) => {
       state.selectedMode = action.payload;
     },
+    // Aktion zum Setzen des ausgewählten Slot-Typs
     setSelectedSlotType: (
       state,
       action: PayloadAction<"isolationswiderstand" | "schleifenwiderstand">
     ) => {
       state.selectedSlotType = action.payload;
     },
+    // Aktion zum Öffnen oder Schließen des Charts
     setChartOpen: (state, action: PayloadAction<boolean>) => {
       state.isChartOpen = action.payload;
     },
+    // Aktion zum Setzen der TDR-Charts-Daten
+    setTDRChartData: (
+      state,
+      action: PayloadAction<{ timestamp: string; tdr: number }[]>
+    ) => {
+      state.tdrChartData = action.payload;
+    },
   },
 });
 
+// Export der Aktionen
 export const {
+  setSlotNumber,
   setLoopMeasurementCurveChartData,
   setVonDatum,
   setBisDatum,
   setSelectedMode,
   setSelectedSlotType,
   setChartOpen,
-  setSlotNumber, // NEU: Action für Slot-Nummer exportieren
+  setTDRChartData,
 } = kabelueberwachungChartSlice.actions;
 
+// Export des Reducers
 export default kabelueberwachungChartSlice.reducer;

redux/slices/tdrChartDataSlice.ts

@@ -1,26 +0,0 @@
-// redux/slices/tdrChartDataSlice.ts
-import { createSlice, PayloadAction } from "@reduxjs/toolkit";
-
-interface TDRChartDataState {
-  data: { timestamp: string; tdr: number }[];
-}
-
-const initialState: TDRChartDataState = {
-  data: [],
-};
-
-const tdrChartDataSlice = createSlice({
-  name: "tdrChartData",
-  initialState,
-  reducers: {
-    setTDRChartData(
-      state,
-      action: PayloadAction<{ timestamp: string; tdr: number }[]>
-    ) {
-      state.data = action.payload;
-    },
-  },
-});
-
-export const { setTDRChartData } = tdrChartDataSlice.actions;
-export default tdrChartDataSlice.reducer;

redux/store.ts

@@ -6,7 +6,6 @@ import chartDataReducer from "./slices/chartDataSlice";
 import webVersionReducer from "./slices/webVersionSlice";
 import digitalInputsReducer from "./slices/digitalInputsSlice";
 import kabelueberwachungChartReducer from "./slices/kabelueberwachungChartSlice";
-import tdrChartDataReducer from "./slices/tdrChartDataSlice";
 
 const store = configureStore({
   reducer: {
@@ -16,7 +15,6 @@ const store = configureStore({
     webVersion: webVersionReducer,
     digitalInputs: digitalInputsReducer,
     kabelueberwachungChart: kabelueberwachungChartReducer,
-    tdrChartData: tdrChartDataReducer,
   },
 });