96 lines
2.8 KiB
TypeScript
96 lines
2.8 KiB
TypeScript
import {
|
||
Button,
|
||
Dialog,
|
||
DialogActions,
|
||
DialogContent,
|
||
DialogTitle,
|
||
TextField,
|
||
Typography,
|
||
IconButton,
|
||
Box,
|
||
} from "@mui/material";
|
||
import { routeStore } from "@shared";
|
||
import { observer } from "mobx-react-lite";
|
||
import { ArrowLeft } from "lucide-react";
|
||
import { useParams } from "react-router-dom";
|
||
import { toast } from "react-toastify";
|
||
|
||
interface EditStationModalProps {
|
||
open: boolean;
|
||
onClose: () => void;
|
||
}
|
||
|
||
export const EditStationModal = observer(
|
||
({ open, onClose }: EditStationModalProps) => {
|
||
const { id: routeId } = useParams<{ id: string }>();
|
||
const {
|
||
selectedStationId,
|
||
setRouteStations,
|
||
saveRouteStations,
|
||
routeStations,
|
||
} = routeStore;
|
||
|
||
const handleSave = async () => {
|
||
await saveRouteStations(Number(routeId), selectedStationId);
|
||
toast.success("Успешно сохранено");
|
||
onClose();
|
||
};
|
||
|
||
const station = routeStations[Number(routeId)]?.find(
|
||
(station: any) => station.id === selectedStationId
|
||
);
|
||
|
||
return (
|
||
<Dialog open={open} onClose={onClose} maxWidth="md" fullWidth>
|
||
<DialogTitle>
|
||
<Box display="flex" alignItems="center" gap={2}>
|
||
<IconButton onClick={onClose}>
|
||
<ArrowLeft />
|
||
</IconButton>
|
||
<Box>
|
||
<Typography variant="caption" color="text.secondary">
|
||
Маршруты / Редактировать
|
||
</Typography>
|
||
<Typography variant="h6">Редактирование остановки</Typography>
|
||
</Box>
|
||
</Box>
|
||
</DialogTitle>
|
||
<DialogContent>
|
||
<Box sx={{ mt: 2, display: "flex", gap: 2, flexDirection: "column" }}>
|
||
<TextField
|
||
label="Смещение (X)"
|
||
name="offset_x"
|
||
type="number"
|
||
fullWidth
|
||
onChange={(e) => {
|
||
setRouteStations(Number(routeId), selectedStationId, {
|
||
offset_x: Number(e.target.value),
|
||
});
|
||
}}
|
||
defaultValue={station?.offset_x}
|
||
/>
|
||
|
||
<TextField
|
||
label="Смещение (Y)"
|
||
name="offset_y"
|
||
type="number"
|
||
fullWidth
|
||
onChange={(e) => {
|
||
setRouteStations(Number(routeId), selectedStationId, {
|
||
offset_y: Number(e.target.value),
|
||
});
|
||
}}
|
||
defaultValue={station?.offset_y}
|
||
/>
|
||
</Box>
|
||
</DialogContent>
|
||
<DialogActions sx={{ p: 3, justifyContent: "flex-end" }}>
|
||
<Button onClick={handleSave} variant="contained" color="primary">
|
||
Сохранить
|
||
</Button>
|
||
</DialogActions>
|
||
</Dialog>
|
||
);
|
||
}
|
||
);
|