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

42 lines
1.3 KiB
TypeScript

// /components/modules/kue705FO/charts/TDRChart/TDRChartActionBar.tsx
import React, { useState } from "react";
import DateRangePicker from "../DateRangePicker";
import TDRChart from "../../../../kabelueberwachung/kue705FO/Charts/TDRChart/TDRChart";
import { useDispatch } from "react-redux";
import { setChartData } from "../../../../../../redux/slices/chartDataSlice";
const TDRChartActionBar: React.FC = () => {
const dispatch = useDispatch();
const BASE_URL = "http://localhost:3002";
const [showChart, setShowChart] = useState(false);
const handleFetchData = async () => {
try {
const response = await fetch(`${BASE_URL}/tdr`);
if (!response.ok) throw new Error("Fehler beim Abrufen der Daten");
const data = await response.json();
dispatch(setChartData(data));
setShowChart(true);
} catch (error) {
console.error("Fehler beim Laden der Daten:", error);
}
};
return (
<div className="flex justify-end items-center p-2 bg-gray-100 rounded-lg space-x-2">
<DateRangePicker setVonDatum={() => {}} setBisDatum={() => {}} />
<button
onClick={handleFetchData}
className="px-3 py-1 bg-green-500 text-white rounded text-sm"
>
Aktualisieren
</button>
{showChart && null}
</div>
);
};
export default TDRChartActionBar;