feat: TDR-Chart aktualisiert sich jetzt automatisch bei Datenänderung

- `fetchAllTDRChartThunk.ts`: Vergleich der aktuellen und neuen Daten mit `lodash.isEqual`, um unnötige Redux-Updates zu vermeiden.
- `TDRChart.tsx`: Nutzt `selectedSlot` aus `kueChartModeSlice.ts`, um nur den relevanten Slot im Chart anzuzeigen.
- `ChartSwitcher.tsx`: Ruft alle 10 Sekunden `fetchAllTDRChartData` auf, um Änderungen zu prüfen.
- `tdrChartSlice.ts`: Speichert nur neue Daten, wenn sie sich von den vorherigen unterscheiden.
- Fix: `activeMode` aus `kueChartModeSlice.ts` wird für die Auswahl zwischen TDR- und Schleifenmessung verwendet.
- Code Cleanup und Logging für bessere Debugging-Unterstützung.

🔥 Jetzt aktualisiert sich der TDR-Chart automatisch, wenn sich die Daten ändern, ohne dass ein Neuladen der Seite erforderlich ist.
This commit is contained in:
ISA
2025-03-20 14:58:52 +01:00
parent 6f0f11306e
commit 75529f030e
7 changed files with 32 additions and 2800 deletions

View File

@@ -1,6 +1,6 @@
"use client"; // /components/modules/kue705FO/charts/ChartSwitcher.tsx
import React, { useState } from "react";
import React, { useState, useEffect } from "react";
import ReactModal from "react-modal";
import LoopChartActionBar from "./LoopMeasurementChart/LoopChartActionBar";
import TDRChartActionBar from "./TDRChart/TDRChartActionBar";
@@ -17,6 +17,7 @@ import {
setSelectedChartType,
} from "../../../../../redux/slices/tdrChartSlice";
import { resetBrushRange } from "../../../../../redux/slices/brushSlice";
import { fetchAllTDRChartData } from "../../../../../redux/thunks/fetchAllTDRChartThunk";
interface ChartSwitcherProps {
isOpen: boolean;
@@ -57,7 +58,18 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({
dispatch(setSelectedSlot(slotIndex));
dispatch(setSelectedChartType(chartType));
};
//-------------------------------------
useEffect(() => {
dispatch(fetchAllTDRChartData()); // Erstes Laden
const interval = setInterval(() => {
dispatch(fetchAllTDRChartData());
}, 10000); // Alle 10 Sekunden neue Daten abrufen
return () => clearInterval(interval); // Cleanup, wenn Komponente entladen wird
}, [dispatch]);
//-------------------------------------
return (
<ReactModal
isOpen={isOpen}