Ismail/CPLv4.0
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
ISA
2025-03-28 12:26:43 +01:00
parent e2d8bb0f05
commit 37af5702fa
14 changed files with 61 additions and 163 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
components/main/kabelueberwachung/kue705FO/Charts/ChartSwitcher.tsx
View File

@@ -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

21
components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart.tsx
View File

@@ -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

63
components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx
View File

@@ -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

2
config/webVersion.ts
View File

@@ -6,5 +6,5 @@
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
*/
const webVersion = "1.6.181";
const webVersion = "1.6.182";
export default webVersion;

2
redux/slices/tdmSingleChartSlice.ts
View File

@@ -1,7 +1,7 @@
// /redux/slices/tdmSingleChartSlice.ts
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import { fetchTDMDataBySlotThunk } from "../thunks/fetchTDMDataBySlotThunk";
import { fetchTDMDataBySlotThunk } from "../thunks/fetchTDMListBySlotThunk";
interface TDMChartEntry {
id: number;

21
redux/slices/tdrDataByIdSlice.ts
View File

@@ -1,16 +1,10 @@
// redux/slices/tdrDataByIdSlice.ts
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import { fetchTDRChartDataByIdThunk } from "../thunks/fetchTDRChartDataByIdThunk";
interface TDRDataState {
dataById: {
[id: number]: { d: number; p: number }[];
};
selectedId: number | null;
}
const initialState: TDRDataState = {
dataById: {},
selectedId: null,
const initialState = {
dataById: {} as Record<number, { d: number; p: number }[]>,
selectedId: null as number | null,
};
const tdrDataByIdSlice = createSlice({
@@ -27,6 +21,13 @@ const tdrDataByIdSlice = createSlice({
state.selectedId = action.payload;
},
},
extraReducers: (builder) => {
builder.addCase(fetchTDRChartDataByIdThunk.fulfilled, (state, action) => {
const { id, data } = action.payload;
state.dataById[id] = data;
state.selectedId = id;
});
},
});
export const { setTDRChartDataById, setSelectedTDRId } =

53
redux/slices/tdrSingleChartSlice.ts
View File

@@ -1,53 +0,0 @@
// redux/slices/tdrSingleChartSlice.ts
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
import { fetchTDRChartDataBySlotThunk } from "../thunks/fetchTDRChartDataBySlotThunk";
interface TDRSlotData {
[slot: number]: { d: number; p: number }[];
}
interface TdrSingleChartState {
data: TDRSlotData;
loading: boolean;
error: string | null;
}
const initialState: TdrSingleChartState = {
data: {},
loading: false,
error: null,
};
const tdrSingleChartSlice = createSlice({
name: "tdrSingleChart",
initialState,
reducers: {},
extraReducers: (builder) => {
builder
.addCase(fetchTDRChartDataBySlotThunk.pending, (state) => {
state.loading = true;
state.error = null;
})
.addCase(
fetchTDRChartDataBySlotThunk.fulfilled,
(
state,
action: PayloadAction<{
slot: number;
data: { d: number; p: number }[];
}>
) => {
const { slot, data } = action.payload;
state.data[slot] = data;
state.loading = false;
}
)
.addCase(fetchTDRChartDataBySlotThunk.rejected, (state, action) => {
state.loading = false;
state.error = action.error.message ?? "Fehler beim Laden";
});
},
});
export default tdrSingleChartSlice.reducer;

2
redux/store.ts
View File

@@ -19,7 +19,6 @@ import tdmChartReducer from "./slices/tdmChartSlice";
import tdrDataByIdReducer from "./slices/tdrDataByIdSlice";
import kueDataReducer from "./slices/kueDataSlice";
import selectedChartDataReducer from "./slices/selectedChartDataSlice";
import tdrSingleChartReducer from "./slices/tdrSingleChartSlice";
import tdmSingleChartReducer from "./slices/tdmSingleChartSlice";
const store = configureStore({
@@ -42,7 +41,6 @@ const store = configureStore({
tdrDataById: tdrDataByIdReducer,
kueData: kueDataReducer,
selectedChartData: selectedChartDataReducer,
tdrSingleChart: tdrSingleChartReducer,
tdmSingleChart: tdmSingleChartReducer,
},
});

2
redux/thunks/fetchTDMDataBySlotThunk.ts → redux/thunks/fetchTDMListBySlotThunk.ts
View File

@@ -1,7 +1,7 @@
// /redux/thunks/fetchTDMDataBySlotThunk.ts
import { createAsyncThunk } from "@reduxjs/toolkit";
import { fetchTDMDataBySlot } from "../../services/fetchSingleTDMData";
import { fetchTDMDataBySlot } from "../../services/fetchTDMListBySlot";
export const fetchTDMDataBySlotThunk = createAsyncThunk(
"tdmSingleChart/fetchSlotData",

12
redux/thunks/fetchTDRChartDataByIdThunk.ts Normal file
View File

@@ -0,0 +1,12 @@
// /redux/thunks/fetchTDRChartDataByIdThunk.ts
import { createAsyncThunk } from "@reduxjs/toolkit";
import { fetchTDRChartDataById } from "../../services/fetchTDRChartDataById";
export const fetchTDRChartDataByIdThunk = createAsyncThunk(
"tdrDataById/fetchById",
async (id: number) => {
const data = await fetchTDRChartDataById(id);
if (!data) throw new Error(`Keine TDR-Daten für ID ${id}`);
return { id, data };
}
);

13
redux/thunks/fetchTDRChartDataBySlotThunk.ts
View File

@@ -1,13 +0,0 @@
// /redux/thunks/fetchTDRChartDataBySlotThunk.ts
import { createAsyncThunk } from "@reduxjs/toolkit";
import { fetchTDRChartDataBySlot } from "../../services/fetchSingleTDRChartData";
export const fetchTDRChartDataBySlotThunk = createAsyncThunk(
"tdrChart/fetchSlotData",
async (slot: number) => {
const data = await fetchTDRChartDataBySlot(slot);
if (!data) throw new Error(`Daten für Slot ${slot} nicht gefunden`);
return { slot, data };
}
);

20
services/fetchSingleTDRChartData.ts
View File

@@ -1,20 +0,0 @@
// /services/fetchSingleTDRChartData.ts
export const fetchTDRChartDataBySlot = async (
slot: number
): Promise<any[] | null> => {
const isDev = process.env.NEXT_PUBLIC_NODE_ENV === "development";
const url = isDev
? `/CPLmockData/LastTDR/jsonDatei/slot${slot}.json`
: `${window.location.origin}/CPL?/CPL/LastTDR/slot${slot}.json`;
try {
const response = await fetch(url);
if (!response.ok) throw new Error(`HTTP ${response.status}`);
return await response.json();
} catch (error) {
console.error(`❌ Fehler beim Laden von slot${slot}:`, error);
return null;
}
};

0
services/fetchSingleTDMData.ts → services/fetchTDMListBySlot.ts
View File

2
services/fetchTDRChartDataById.ts
View File

@@ -6,7 +6,7 @@ export const fetchTDRChartDataById = async (
const isDev = process.env.NEXT_PUBLIC_NODE_ENV === "development";
const url = isDev
? `http://localhost:3000/CPLmockData/Last100TDR/kue_01/id/${id}.json`
? `http://localhost:3000/CPLmockData/TDR/${id}.json`
: `${window.location.origin}/CPL?Service/empty.acp&TDR=${id}`;
try {