feat: Referenzkurve pro Slot dynamisch per Redux Slice laden und anzeigen
- Neuen Slice `tdrReferenceChartDataBySlot` eingeführt - Thunk `fetchReferenceCurveBySlotThunk` erstellt - Referenzdaten pro Slot in Redux gespeichert - Zugriff im TDRChart angepasst auf neue Struktur
This commit is contained in:
@@ -9,6 +9,7 @@ import { Chart, registerables } from "chart.js";
|
|||||||
import "chartjs-adapter-date-fns";
|
import "chartjs-adapter-date-fns";
|
||||||
import { getColor } from "../../../../../../utils/colors";
|
import { getColor } from "../../../../../../utils/colors";
|
||||||
import TDRChartActionBar from "./TDRChartActionBar";
|
import TDRChartActionBar from "./TDRChartActionBar";
|
||||||
|
import { fetchReferenceCurveBySlotThunk } from "../../../../../../redux/thunks/fetchReferenceCurveBySlotThunk";
|
||||||
|
|
||||||
const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
|
const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
|
||||||
const dispatch = useDispatch<AppDispatch>();
|
const dispatch = useDispatch<AppDispatch>();
|
||||||
@@ -43,12 +44,18 @@ const TDRChart: React.FC<{ isFullScreen: boolean }> = ({ isFullScreen }) => {
|
|||||||
? tdrDataById[selectedId]
|
? tdrDataById[selectedId]
|
||||||
: [];
|
: [];
|
||||||
//--------------------------------
|
//--------------------------------
|
||||||
|
|
||||||
const referenceChartData = useSelector((state: RootState) =>
|
const referenceChartData = useSelector((state: RootState) =>
|
||||||
selectedSlot !== null
|
selectedSlot !== null
|
||||||
? state.tdrReferenceChart.referenceData[selectedSlot] || []
|
? state.tdrReferenceChartDataBySlot.referenceData[selectedSlot] || []
|
||||||
: []
|
: []
|
||||||
);
|
);
|
||||||
|
//--------------------------------
|
||||||
|
useEffect(() => {
|
||||||
|
if (selectedSlot !== null) {
|
||||||
|
dispatch(fetchReferenceCurveBySlotThunk(selectedSlot));
|
||||||
|
}
|
||||||
|
}, [selectedSlot, dispatch]);
|
||||||
|
|
||||||
//--------------------------------
|
//--------------------------------
|
||||||
const tdmChartData = useSelector(
|
const tdmChartData = useSelector(
|
||||||
(state: RootState) => state.tdmSingleChart.data
|
(state: RootState) => state.tdmSingleChart.data
|
||||||
|
|||||||
@@ -6,5 +6,5 @@
|
|||||||
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
|
2: Patch oder Hotfix (Bugfixes oder kleine Änderungen).
|
||||||
|
|
||||||
*/
|
*/
|
||||||
const webVersion = "1.6.185";
|
const webVersion = "1.6.186";
|
||||||
export default webVersion;
|
export default webVersion;
|
||||||
|
|||||||
41
redux/slices/tdrReferenceChartDataBySlotSlice.ts
Normal file
41
redux/slices/tdrReferenceChartDataBySlotSlice.ts
Normal file
@@ -0,0 +1,41 @@
|
|||||||
|
// /redux/slices/tdrReferenceChartDataBySlotSlice.ts
|
||||||
|
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
|
||||||
|
import { fetchReferenceCurveBySlotThunk } from "../thunks/fetchReferenceCurveBySlotThunk";
|
||||||
|
|
||||||
|
interface TDRReferenceChartState {
|
||||||
|
referenceData: { [slot: number]: any[] };
|
||||||
|
loading: boolean;
|
||||||
|
error: string | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
const initialState: TDRReferenceChartState = {
|
||||||
|
referenceData: {},
|
||||||
|
loading: false,
|
||||||
|
error: null,
|
||||||
|
};
|
||||||
|
|
||||||
|
const tdrReferenceChartDataBySlotSlice = createSlice({
|
||||||
|
name: "tdrReferenceChartDataBySlot",
|
||||||
|
initialState,
|
||||||
|
reducers: {},
|
||||||
|
extraReducers: (builder) => {
|
||||||
|
builder
|
||||||
|
.addCase(fetchReferenceCurveBySlotThunk.pending, (state) => {
|
||||||
|
state.loading = true;
|
||||||
|
state.error = null;
|
||||||
|
})
|
||||||
|
.addCase(
|
||||||
|
fetchReferenceCurveBySlotThunk.fulfilled,
|
||||||
|
(state, action: PayloadAction<{ slot: number; data: any[] }>) => {
|
||||||
|
state.loading = false;
|
||||||
|
state.referenceData[action.payload.slot] = action.payload.data;
|
||||||
|
}
|
||||||
|
)
|
||||||
|
.addCase(fetchReferenceCurveBySlotThunk.rejected, (state, action) => {
|
||||||
|
state.loading = false;
|
||||||
|
state.error = action.error.message ?? "Unbekannter Fehler";
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
export default tdrReferenceChartDataBySlotSlice.reducer;
|
||||||
@@ -20,6 +20,7 @@ import tdrDataByIdReducer from "./slices/tdrDataByIdSlice";
|
|||||||
import kueDataReducer from "./slices/kueDataSlice";
|
import kueDataReducer from "./slices/kueDataSlice";
|
||||||
import selectedChartDataReducer from "./slices/selectedChartDataSlice";
|
import selectedChartDataReducer from "./slices/selectedChartDataSlice";
|
||||||
import tdmSingleChartReducer from "./slices/tdmSingleChartSlice";
|
import tdmSingleChartReducer from "./slices/tdmSingleChartSlice";
|
||||||
|
import tdrReferenceChartDataBySlotReducer from "./slices/tdrReferenceChartDataBySlotSlice";
|
||||||
|
|
||||||
const store = configureStore({
|
const store = configureStore({
|
||||||
reducer: {
|
reducer: {
|
||||||
@@ -42,6 +43,7 @@ const store = configureStore({
|
|||||||
kueData: kueDataReducer,
|
kueData: kueDataReducer,
|
||||||
selectedChartData: selectedChartDataReducer,
|
selectedChartData: selectedChartDataReducer,
|
||||||
tdmSingleChart: tdmSingleChartReducer,
|
tdmSingleChart: tdmSingleChartReducer,
|
||||||
|
tdrReferenceChartDataBySlot: tdrReferenceChartDataBySlotReducer,
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
|
|
||||||
|
|||||||
12
redux/thunks/fetchReferenceCurveBySlotThunk.ts
Normal file
12
redux/thunks/fetchReferenceCurveBySlotThunk.ts
Normal file
@@ -0,0 +1,12 @@
|
|||||||
|
// /redux/thunks/fetchAllTDRReferenceChartThunk.ts
|
||||||
|
import { createAsyncThunk } from "@reduxjs/toolkit";
|
||||||
|
import { fetchTDRReferenceCurve } from "../../services/fetchTDRReferenceCurve";
|
||||||
|
|
||||||
|
export const fetchReferenceCurveBySlotThunk = createAsyncThunk(
|
||||||
|
"tdrReferenceChart/fetchBySlot",
|
||||||
|
async (slot: number) => {
|
||||||
|
const data = await fetchTDRReferenceCurve(slot);
|
||||||
|
if (!data) throw new Error("Keine Referenzdaten gefunden");
|
||||||
|
return { slot, data };
|
||||||
|
}
|
||||||
|
);
|
||||||
24
services/fetchTDRReferenceCurve.ts
Normal file
24
services/fetchTDRReferenceCurve.ts
Normal file
@@ -0,0 +1,24 @@
|
|||||||
|
// /services/fetchTDRReferenceCurve.ts
|
||||||
|
export const fetchTDRReferenceCurve = async (
|
||||||
|
slot: number
|
||||||
|
): Promise<any[] | null> => {
|
||||||
|
if (typeof window === "undefined") return null;
|
||||||
|
|
||||||
|
const isDev = process.env.NEXT_PUBLIC_NODE_ENV === "development";
|
||||||
|
|
||||||
|
const url = isDev
|
||||||
|
? `/CPLmockData/tdr-reference-curves/slot${slot}.json`
|
||||||
|
: `${window.location.origin}/CPL?Service/empty.acp&TDRR=${slot}`;
|
||||||
|
|
||||||
|
try {
|
||||||
|
const res = await fetch(url);
|
||||||
|
if (!res.ok) throw new Error(`HTTP ${res.status}`);
|
||||||
|
return await res.json();
|
||||||
|
} catch (error) {
|
||||||
|
console.error(
|
||||||
|
`❌ Fehler beim Laden der Referenzkurve für Slot ${slot}:`,
|
||||||
|
error
|
||||||
|
);
|
||||||
|
return null;
|
||||||
|
}
|
||||||
|
};
|
||||||
Reference in New Issue
Block a user