Files
CPLv4.0/redux/slices/kabelueberwachungChartSlice.ts
ISA cdd26931a1 feat: implement chart modal with report functionality for cable monitoring
- Add chartTitle state management to kabelueberwachungChartSlice with "Messkurve"/"Meldungen" options
- Update IsoChartActionBar dropdown to show current chartTitle value with proper binding
- Implement conditional rendering in IsoChartView between IsoMeasurementChart and Report components
- Create Report.tsx component using same data structure as MeldungenView (Meldung type)
- Add slot-based message filtering for specific cable monitoring units (KÜ)
- Integrate getMessagesThunk for consistent data loading across components
- Style Report component with consistent table layout, German date formatting, and Littwin branding
- Enable seamless switching between measurement chart and filtered messages in modal
2025-07-31 15:25:46 +02:00

125 lines
3.6 KiB
TypeScript

// redux/slices/kabelueberwachungChartSlice.ts
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
// Definition des Interface für den Zustand des TDR-Charts
interface TDRData {
timestamp: string;
tdr: number;
}
// Definition des Interface für den gesamten Zustand der Kabelüberwachung
interface KabelueberwachungChartState {
loopMeasurementCurveChartData: any[];
isoMeasurementCurveChartData: any[];
vonDatum: string;
bisDatum: string;
selectedMode: "DIA0" | "DIA1" | "DIA2";
selectedSlotType: "isolationswiderstand" | "schleifenwiderstand";
isChartOpen: boolean;
slotNumber: number | null;
tdrChartData: TDRData[];
isFullScreen: boolean;
unit: "kOhm" | "MOhm";
isLoading: boolean;
chartTitle: "Messkurve" | "Meldungen";
}
// Dynamische Initialisierung der Datumswerte
const today = new Date();
const thirtyDaysAgo = new Date();
thirtyDaysAgo.setDate(today.getDate() - 30);
// Initialer Zustand des Slices
const initialState: KabelueberwachungChartState = {
isLoading: false,
loopMeasurementCurveChartData: [],
isoMeasurementCurveChartData: [],
vonDatum: thirtyDaysAgo.toISOString().split("T")[0], // 30 Tage zurück
bisDatum: today.toISOString().split("T")[0], // Heute
selectedMode: "DIA0",
selectedSlotType: "isolationswiderstand",
isChartOpen: false,
slotNumber: null,
tdrChartData: [],
isFullScreen: false,
unit: "MOhm",
chartTitle: "Messkurve", // Standard: Messkurve ausgewählt
};
// Erstellung des Slices
const kabelueberwachungChartSlice = createSlice({
name: "kabelueberwachungChartSlice",
initialState,
reducers: {
setSlotNumber: (state, action: PayloadAction<number | null>) => {
state.slotNumber = action.payload;
},
setLoopMeasurementCurveChartData: (state, action: PayloadAction<any[]>) => {
state.loopMeasurementCurveChartData = action.payload;
},
setIsoMeasurementCurveChartData: (state, action: PayloadAction<any[]>) => {
state.isoMeasurementCurveChartData = action.payload;
},
setVonDatum: (state, action: PayloadAction<string>) => {
state.vonDatum = action.payload;
},
setBisDatum: (state, action: PayloadAction<string>) => {
state.bisDatum = action.payload;
},
setSelectedMode: (
state,
action: PayloadAction<"DIA0" | "DIA1" | "DIA2">
) => {
state.selectedMode = action.payload;
},
setSelectedSlotType: (
state,
action: PayloadAction<"isolationswiderstand" | "schleifenwiderstand">
) => {
state.selectedSlotType = action.payload;
state.unit = action.payload === "schleifenwiderstand" ? "kOhm" : "MOhm";
},
setChartOpen: (state, action: PayloadAction<boolean>) => {
state.isChartOpen = action.payload;
},
setTDRChartData: (
state,
action: PayloadAction<{ timestamp: string; tdr: number }[]>
) => {
state.tdrChartData = action.payload;
},
setFullScreen: (state, action: PayloadAction<boolean>) => {
state.isFullScreen = action.payload;
},
setLoading: (state, action: PayloadAction<boolean>) => {
state.isLoading = action.payload;
},
setChartTitle: (
state,
action: PayloadAction<"Messkurve" | "Meldungen">
) => {
state.chartTitle = action.payload;
},
},
});
// Export der Aktionen
export const {
setSlotNumber,
setLoopMeasurementCurveChartData,
setIsoMeasurementCurveChartData,
setVonDatum,
setBisDatum,
setSelectedMode,
setSelectedSlotType,
setChartOpen,
setTDRChartData,
setFullScreen,
setLoading,
setChartTitle,
} = kabelueberwachungChartSlice.actions;
// Export des Reducers
export default kabelueberwachungChartSlice.reducer;