Files
CPLv4.0/components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx

64 lines
1.9 KiB
TypeScript
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

// /components/main/kabelueberwachung/kue705FO/Charts/TDRChart/TDRChartActionBar.tsx
import React, { useState } from "react";
import { useDispatch, useSelector } from "react-redux";
import { RootState } from "../../../../../../redux/store";
import { fetchTDRChartDataById } from "../../../../../../services/fetchTDRChartDataById";
import {
setTDRChartDataById,
setSelectedTDRId,
} from "../../../../../../redux/slices/tdrDataByIdSlice";
const TDRChartActionBar: React.FC = () => {
const dispatch = useDispatch();
const tdmChartData = useSelector((state: RootState) => state.tdmChart.data);
const selectedSlot = useSelector(
(state: RootState) => state.kueChartMode.selectedSlot
);
const idsForSlot =
selectedSlot !== null ? tdmChartData[selectedSlot] ?? [] : [];
const [selectedId, setSelectedId] = useState<number | null>(null);
const handleSelectChange = async (
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)); // 👉 wichtig!
};
return (
<div className="flex flex-wrap justify-end items-center p-2 bg-gray-100 rounded-lg space-x-2">
{idsForSlot.length > 0 && (
<>
<label htmlFor="tdrIdSelect" className="text-sm font-semibold">
Messung ID
</label>
<select
id="tdrIdSelect"
value={selectedId ?? ""}
onChange={handleSelectChange}
className="border rounded px-2 py-1 text-sm"
>
<option value="">-- Wähle Messung --</option>
{idsForSlot.map((entry) => (
<option key={entry.id} value={entry.id}>
ID {entry.id} {entry.t}
</option>
))}
</select>
</>
)}
</div>
);
};
export default TDRChartActionBar;