Letzte TDR-Messung anzeigen für ausgewählte Slot

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<ChartSwitcherProps> = ({
 
     return () => clearInterval(interval); // Cleanup, wenn Komponente entladen wird
   }, [dispatch]);
-  //-------------------------------------
 
-  //-------------------------------------
-  useEffect(() => {
-    if (slotIndex !== null) {
-      dispatch(fetchTDRChartDataBySlotThunk(slotIndex));
-    }
-  }, [slotIndex]);
   //-------------------------------------
   return (
     <ReactModal

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

@@ -10,8 +10,6 @@ import "chartjs-adapter-date-fns";
 import { getColor } from "../../../../../../utils/colors";
 import TDRChartActionBar from "./TDRChartActionBar";
 
-import { fetchAllTDRReferenceChartThunk } from "../../../../../../redux/thunks/fetchAllTDRReferenceChartThunk";
-
 const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
   const dispatch = useDispatch<AppDispatch>();
 
@@ -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

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<number | null>(null);
-  //-------------------------------
-  const handleSelectChange = async (
-    e: React.ChangeEvent<HTMLSelectElement>
-  ) => {
+
+  // Dropdown-Auswahl: Neue ID auswählen
+  const handleSelectChange = (e: React.ChangeEvent<HTMLSelectElement>) => {
     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 (
     <div className="flex justify-between items-center p-2 bg-gray-100 rounded-lg space-x-4">
-      {/* Ausgewählte Slot Nummer anzeigen */}
+      {/* Ausgewählter Slot */}
       <div className="text-sm font-semibold">
         {selectedSlot !== null
           ? `Slot ${selectedSlot + 1}`
           : "Kein Slot gewählt"}
       </div>
 
-      {/* 🔵 Linke Seite: Reset-Button */}
-      <button
-        className="border border-gray-300 bg-white rounded px-3 py-1 text-sm hover:bg-gray-200"
-        onClick={handleReset}
-      >
-        Letzte Messung
-      </button>
+      {/* Button: Als Referenzkurve setzen */}
       {selectedId !== null && (
         <button
           onClick={handleSetReference}
@@ -89,7 +74,7 @@ const TDRChartActionBar: React.FC = () => {
         </button>
       )}
 
-      {/* 🔵 Rechte Seite: Dropdown */}
+      {/* Dropdown für Messungsauswahl */}
       <div className="flex items-center space-x-2">
         <label htmlFor="tdrIdSelect" className="text-sm font-semibold">
           Messung ID