diff --git a/components/main/kabelueberwachung/kue705FO/Charts/ChartSwitcher.tsx b/components/main/kabelueberwachung/kue705FO/Charts/ChartSwitcher.tsx index 209eaa5..fe18a54 100644 --- a/components/main/kabelueberwachung/kue705FO/Charts/ChartSwitcher.tsx +++ b/components/main/kabelueberwachung/kue705FO/Charts/ChartSwitcher.tsx @@ -18,9 +18,7 @@ import { setSelectedChartType, } from "../../../../../redux/slices/tdrChartSlice"; import { resetBrushRange } from "../../../../../redux/slices/brushSlice"; -//import { fetchAllTDRChartData } from "../../../../../redux/thunks/fetchAllTDRChartThunk"; -import { fetchTDMDataBySlotThunk } from "../../../../../redux/thunks/fetchTDMDataBySlotThunk"; -import { fetchTDRChartDataBySlotThunk } from "../../../../../redux/thunks/fetchTDRChartDataBySlotThunk"; +import { fetchTDMDataBySlotThunk } from "../../../../../redux/thunks/fetchTDMListBySlotThunk"; interface ChartSwitcherProps { isOpen: boolean; @@ -72,14 +70,7 @@ const ChartSwitcher: React.FC = ({ return () => clearInterval(interval); // Cleanup, wenn Komponente entladen wird }, [dispatch]); - //------------------------------------- - //------------------------------------- - useEffect(() => { - if (slotIndex !== null) { - dispatch(fetchTDRChartDataBySlotThunk(slotIndex)); - } - }, [slotIndex]); //------------------------------------- return ( = ({ isFullScreen }) => { const dispatch = useDispatch(); @@ -33,19 +31,18 @@ const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => { (state: RootState) => state.tdrDataById.dataById ); //-------------------------------- - const tdrDataBySlot = useSelector( - (state: RootState) => state.tdrSingleChart.data - ); const tdrInitialData = - selectedSlot !== null ? tdrDataBySlot[selectedSlot] ?? [] : []; + selectedId !== null && tdrDataById[selectedId] + ? tdrDataById[selectedId] + : []; + //-------------------------------- // Kombinierte Logik: ID hat Vorrang, sonst Initial-Daten für Slot - const tdrChartData = useMemo(() => { - if (selectedId !== null && tdrDataById[selectedId]) { - return tdrDataById[selectedId]; - } - return tdrInitialData; - }, [selectedId, tdrDataById, tdrInitialData]); + const tdrChartData = + selectedId !== null && tdrDataById[selectedId] + ? tdrDataById[selectedId] + : []; + //-------------------------------- const referenceChartData = useSelector((state: RootState) => selectedSlot !== null diff --git a/components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx b/components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx index 6bbaf26..2185979 100644 --- a/components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx +++ b/components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx @@ -1,15 +1,10 @@ // /components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx import React, { useState, useEffect } from "react"; -import { useDispatch, useSelector } from "react-redux"; +import { useSelector } from "react-redux"; import { useAppDispatch } from "../../../../../../redux/store"; - import { RootState } from "../../../../../../redux/store"; -import { fetchTDRChartDataById } from "../../../../../../services/fetchTDRChartDataById"; -import { - setTDRChartDataById, - setSelectedTDRId, -} from "../../../../../../redux/slices/tdrDataByIdSlice"; -import { fetchTDMDataBySlotThunk } from "../../../../../../redux/thunks/fetchTDMDataBySlotThunk"; +import { fetchTDMDataBySlotThunk } from "../../../../../../redux/thunks/fetchTDMListBySlotThunk"; +import { fetchTDRChartDataByIdThunk } from "../../../../../../redux/thunks/fetchTDRChartDataByIdThunk"; const TDRChartActionBar: React.FC = () => { const dispatch = useAppDispatch(); @@ -23,63 +18,53 @@ const TDRChartActionBar: React.FC = () => { selectedSlot !== null ? tdmChartData[selectedSlot] ?? [] : []; const [selectedId, setSelectedId] = useState(null); - //------------------------------- - const handleSelectChange = async ( - e: React.ChangeEvent - ) => { + + // Dropdown-Auswahl: Neue ID auswählen + const handleSelectChange = (e: React.ChangeEvent) => { const id = parseInt(e.target.value); setSelectedId(id); - - const data = await fetchTDRChartDataById(id); - if (!data) return; - - dispatch(setTDRChartDataById({ id, data })); - dispatch(setSelectedTDRId(id)); + dispatch(fetchTDRChartDataByIdThunk(id)); }; - //------------------------------- - const handleReset = () => { - setSelectedId(null); - dispatch(setSelectedTDRId(-1)); // z. B. -1 als „Reset“-Kennzeichnung - }; - //------------------------------- + + // Button: Als Referenzkurve setzen const handleSetReference = async () => { if (selectedId === null || selectedSlot === null) return; const url = `${window.location.origin}/CPL?seite.ACP&KTR${selectedSlot}=${selectedId}`; - try { const response = await fetch(url); if (!response.ok) throw new Error("Fehler beim Setzen der Referenzkurve"); - alert("✅ Referenzkurve erfolgreich gesetzt."); } catch (error) { console.error("❌ Fehler:", error); alert("❌ Referenzkurve konnte nicht gesetzt werden."); } }; - //------------------------------- + + // Automatisch neueste ID laden, wenn Slot sich ändert useEffect(() => { if (selectedSlot !== null) { - dispatch(fetchTDMDataBySlotThunk(selectedSlot)); + dispatch(fetchTDMDataBySlotThunk(selectedSlot)).then((action: any) => { + const slotData = action.payload?.data; + if (slotData?.length > 0) { + const lastId = slotData[0].id; + setSelectedId(lastId); + dispatch(fetchTDRChartDataByIdThunk(lastId)); + } + }); } - }, [selectedSlot]); - //-------------------------------- + }, [selectedSlot, dispatch]); + return (
- {/* Ausgewählte Slot Nummer anzeigen */} + {/* Ausgewählter Slot */}
{selectedSlot !== null ? `Slot ${selectedSlot + 1}` : "Kein Slot gewählt"}
- {/* 🔵 Linke Seite: Reset-Button */} - + {/* Button: Als Referenzkurve setzen */} {selectedId !== null && ( )} - {/* 🔵 Rechte Seite: Dropdown */} + {/* Dropdown für Messungsauswahl */}