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:
@@ -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}
|
||||
|
||||
Reference in New Issue
Block a user