fix: link in console

components/main/system/DetailModal.tsx

@@ -2,8 +2,8 @@
 // /components/main/system/DetailModal.tsx
 import React, { useEffect, useRef, useState } from "react";
 import { Line } from "react-chartjs-2";
-import { useSelector, useDispatch } from "react-redux";
-import { RootState } from "@/redux/store";
+import { useSelector } from "react-redux";
+import { RootState, useAppDispatch } from "@/redux/store";
 import { Listbox } from "@headlessui/react";
 import { setFullScreen } from "@/redux/slices/kabelueberwachungChartSlice";
 import DateRangePicker from "@/components/common/DateRangePicker";
@@ -12,6 +12,14 @@ import {
   setBisDatum,
 } from "@/redux/slices/kabelueberwachungChartSlice";
 
+// Import Thunks
+import { getSystemspannung5VplusThunk } from "@/redux/thunks/getSystemspannung5VplusThunk";
+import { getSystemspannung15VplusThunk } from "@/redux/thunks/getSystemspannung15VplusThunk";
+import { getSystemspannung15VminusThunk } from "@/redux/thunks/getSystemspannung15VminusThunk";
+import { getSystemspannung98VminusThunk } from "@/redux/thunks/getSystemspannung98VminusThunk";
+import { getTemperaturAdWandlerThunk } from "@/redux/thunks/getTemperaturAdWandlerThunk";
+import { getTemperaturProzessorThunk } from "@/redux/thunks/getTemperaturProzessorThunk";
+
 import {
   Chart as ChartJS,
   LineElement,
@@ -158,7 +166,7 @@ export const DetailModal = ({
   const isFullScreen = useSelector(
     (state: RootState) => state.kabelueberwachungChartSlice.isFullScreen
   );
-  const dispatch = useDispatch();
+  const dispatch = useAppDispatch();
 
   const toggleFullScreen = () => {
     dispatch(setFullScreen(!isFullScreen));
@@ -186,55 +194,31 @@ export const DetailModal = ({
     loadZoomPlugin();
   }, []);
 
+  // API-Request beim Klick auf "Daten laden"
   const handleFetchData = () => {
     setIsLoading(true);
-    let sortedData = [...reduxData].reverse();
-
-    if (vonDatum && bisDatum) {
-      const vonDate = new Date(vonDatum);
-      const bisDate = new Date(bisDatum);
-      sortedData = sortedData.filter((entry) => {
-        const entryDate = new Date(entry.t);
-        return entryDate >= vonDate && entryDate <= bisDate;
-      });
+    switch (selectedKey) {
+      case "+5V":
+        dispatch(getSystemspannung5VplusThunk(zeitraum));
+        break;
+      case "+15V":
+        dispatch(getSystemspannung15VplusThunk(zeitraum));
+        break;
+      case "-15V":
+        dispatch(getSystemspannung15VminusThunk(zeitraum));
+        break;
+      case "-98V":
+        dispatch(getSystemspannung98VminusThunk(zeitraum));
+        break;
+      case "ADC Temp":
+        dispatch(getTemperaturAdWandlerThunk(zeitraum));
+        break;
+      case "CPU Temp":
+        dispatch(getTemperaturProzessorThunk(zeitraum));
+        break;
+      default:
+        break;
     }
-
-    setFilteredData(sortedData);
-
-    setChartData({
-      datasets: [
-        {
-          label: "Minimum",
-          data: sortedData.map((p) => ({ x: new Date(p.t), y: p.i })),
-          borderColor: "lightgrey",
-          backgroundColor: "rgba(211,211,211,0.3)",
-          borderWidth: 2,
-          pointRadius: 0,
-          tension: 0.1,
-        },
-        {
-          label: "Maximum",
-          data: sortedData.map((p) => ({ x: new Date(p.t), y: p.a })),
-          borderColor: "lightgrey",
-          backgroundColor: "rgba(211,211,211,0.3)",
-          borderWidth: 2,
-          pointRadius: 0,
-          tension: 0.1,
-        },
-        {
-          label: zeitraum === "DIA0" ? "Messwert" : "Durchschnitt",
-          data: sortedData.map((p) => ({
-            x: new Date(p.t),
-            y: zeitraum === "DIA0" ? p.m : p.g,
-          })),
-          borderColor: "rgba(59,130,246,1)",
-          backgroundColor: "rgba(59,130,246,0.3)",
-          borderWidth: 2,
-          pointRadius: 0,
-          tension: 0.1,
-        },
-      ],
-    });
   };
 
   useEffect(() => {