feat: Charttitel in ChartSwitcher dynamisch an Slot-Typ angepasst via loopChartTypeSlice

- Neues Redux Slice erstellt zur Verwaltung des Titels
- Dropdown-Auswahl in LoopChartActionBar aktualisiert Redux-Wert
- ChartSwitcher verwendet dynamischen Titel statt statischem Text
This commit is contained in:
ISA
2025-04-02 07:38:48 +02:00
parent 60eba4aa01
commit 76f4b92fb5
5 changed files with 42 additions and 7 deletions

View File

@@ -32,6 +32,9 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({
slotIndex,
}) => {
const dispatch = useDispatch<AppDispatch>();
const chartTitle = useSelector(
(state: RootState) => state.loopChartType.chartTitle
);
// **Redux-States für aktive Messkurve (TDR oder Schleife)**
const activeMode = useSelector(
@@ -146,7 +149,7 @@ const ChartSwitcher: React.FC<ChartSwitcherProps> = ({
>
{activeMode === "Schleife" ? (
<>
<h3 className="text-lg font-semibold">Schleifenmessung</h3>
<h3 className="text-lg font-semibold">{chartTitle}</h3>
<LoopChartActionBar />
<div style={{ flex: 1, height: "90%" }}>
<LoopMeasurementChart />

View File

@@ -12,6 +12,7 @@ import {
setChartOpen,
} from "../../../../../../redux/slices/kabelueberwachungChartSlice";
import { setBrushRange } from "../../../../../../redux/slices/brushSlice";
import { setChartTitle } from "../../../../../../redux/slices/loopChartTypeSlice";
const LoopChartActionBar: React.FC = () => {
const dispatch = useDispatch();
@@ -154,13 +155,19 @@ const LoopChartActionBar: React.FC = () => {
<select
value={selectedSlotType}
onChange={(e) =>
onChange={(e) => {
const value = e.target.value as
| "isolationswiderstand"
| "schleifenwiderstand";
dispatch(setSelectedSlotType(value));
dispatch(
setSelectedSlotType(
e.target.value as "isolationswiderstand" | "schleifenwiderstand"
setChartTitle(
value === "isolationswiderstand"
? "Isolationsmessung"
: "Schleifenmessung"
)
)
}
);
}}
className="px-3 py-1 bg-white border rounded text-sm"
>
<option value="schleifenwiderstand">Schleifenwiderstand</option>

View File

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

View File

@@ -0,0 +1,23 @@
// redux/slices/loopChartTypeSlice.ts
import { createSlice, PayloadAction } from "@reduxjs/toolkit";
interface LoopChartTypeState {
chartTitle: string;
}
const initialState: LoopChartTypeState = {
chartTitle: "Schleifenmessung", // Standardwert
};
const loopChartTypeSlice = createSlice({
name: "loopChartType",
initialState,
reducers: {
setChartTitle: (state, action: PayloadAction<string>) => {
state.chartTitle = action.payload;
},
},
});
export const { setChartTitle } = loopChartTypeSlice.actions;
export default loopChartTypeSlice.reducer;

View File

@@ -21,6 +21,7 @@ import kueDataReducer from "./slices/kueDataSlice";
import selectedChartDataReducer from "./slices/selectedChartDataSlice";
import tdmSingleChartReducer from "./slices/tdmSingleChartSlice";
import tdrReferenceChartDataBySlotReducer from "./slices/tdrReferenceChartDataBySlotSlice";
import loopChartTypeSlice from "./slices/loopChartTypeSlice";
const store = configureStore({
reducer: {
@@ -44,6 +45,7 @@ const store = configureStore({
selectedChartDataSlice: selectedChartDataReducer,
tdmSingleChartSlice: tdmSingleChartReducer,
tdrReferenceChartDataBySlotSlice: tdrReferenceChartDataBySlotReducer,
loopChartType: loopChartTypeSlice,
},
});