87 lines
2.7 KiB
TypeScript
87 lines
2.7 KiB
TypeScript
import { createFileRoute, useNavigate } from "@tanstack/react-router";
|
|
import { Box, Typography, IconButton } from "@mui/material";
|
|
import ArrowBackIcon from "@mui/icons-material/ArrowBack";
|
|
import { KPIForm } from "../components/KPIForm";
|
|
import type { Kennzahl } from "../types/kpi";
|
|
|
|
export const Route = createFileRoute("/config-add")({
|
|
component: ConfigAddPage,
|
|
});
|
|
|
|
function ConfigAddPage() {
|
|
const navigate = useNavigate();
|
|
|
|
const handleSave = async (formData: Partial<Kennzahl>) => {
|
|
try {
|
|
const existingKPIsResponse = await fetch('http://localhost:5050/api/kpi_setting/');
|
|
const existingKPIs = await existingKPIsResponse.json();
|
|
const maxPosition = existingKPIs.length > 0
|
|
? Math.max(...existingKPIs.map((kpi: Kennzahl) => kpi.position))
|
|
: 0;
|
|
|
|
const kpiData = {
|
|
...formData,
|
|
position: maxPosition + 1,
|
|
active: formData.active !== false
|
|
};
|
|
|
|
const response = await fetch('http://localhost:5050/api/kpi_setting/', {
|
|
method: 'POST',
|
|
headers: {
|
|
'Content-Type': 'application/json',
|
|
},
|
|
body: JSON.stringify(kpiData),
|
|
});
|
|
|
|
if (!response.ok) {
|
|
throw new Error(`HTTP error! status: ${response.status}`);
|
|
}
|
|
|
|
navigate({ to: "/config" });
|
|
} catch (error) {
|
|
console.error('Error creating KPI:', error);
|
|
throw error;
|
|
}
|
|
};
|
|
|
|
const handleCancel = () => {
|
|
navigate({ to: "/config" });
|
|
};
|
|
|
|
return (
|
|
<Box
|
|
minHeight="100vh"
|
|
width="100vw"
|
|
bgcolor="#f5f5f5"
|
|
display="flex"
|
|
flexDirection="column"
|
|
alignItems="center"
|
|
pt={3}
|
|
pb={4}
|
|
>
|
|
<Box
|
|
width="100%"
|
|
display="flex"
|
|
justifyContent="flex-start"
|
|
alignItems="center"
|
|
px={4}
|
|
mb={4}
|
|
>
|
|
<Box display="flex" alignItems="center">
|
|
<IconButton onClick={() => navigate({ to: "/config" })}>
|
|
<ArrowBackIcon fontSize="large" sx={{ color: '#383838' }}/>
|
|
</IconButton>
|
|
<Typography variant="h5" fontWeight="bold" ml={3}>
|
|
Neue Kennzahl hinzufügen
|
|
</Typography>
|
|
</Box>
|
|
</Box>
|
|
|
|
<KPIForm
|
|
mode="add"
|
|
onSave={handleSave}
|
|
onCancel={handleCancel}
|
|
/>
|
|
</Box>
|
|
);
|
|
} |