feat: Add more pages
This commit is contained in:
		
							
								
								
									
										94
									
								
								src/pages/Station/StationCreatePage/index.tsx
									
									
									
									
									
										Normal file
									
								
							
							
						
						
									
										94
									
								
								src/pages/Station/StationCreatePage/index.tsx
									
									
									
									
									
										Normal file
									
								
							| @@ -0,0 +1,94 @@ | ||||
| import { | ||||
|   Button, | ||||
|   Paper, | ||||
|   TextField, | ||||
|   Select, | ||||
|   MenuItem, | ||||
|   FormControl, | ||||
|   InputLabel, | ||||
| } from "@mui/material"; | ||||
| import { observer } from "mobx-react-lite"; | ||||
| import { ArrowLeft, Loader2, Save } from "lucide-react"; | ||||
| import { useNavigate } from "react-router-dom"; | ||||
| import { toast } from "react-toastify"; | ||||
| import { stationsStore } from "@shared"; | ||||
| import { useState } from "react"; | ||||
|  | ||||
| export const StationCreatePage = observer(() => { | ||||
|   const navigate = useNavigate(); | ||||
|   const [name, setName] = useState(""); | ||||
|   const [systemName, setSystemName] = useState(""); | ||||
|   const [direction, setDirection] = useState(""); | ||||
|   const [isLoading, setIsLoading] = useState(false); | ||||
|  | ||||
|   const handleCreate = async () => { | ||||
|     try { | ||||
|       setIsLoading(true); | ||||
|       await stationsStore.createStation(name, systemName, direction); | ||||
|       toast.success("Станция успешно создана"); | ||||
|       navigate("/station"); | ||||
|     } catch (error) { | ||||
|       toast.error("Ошибка при создании станции"); | ||||
|     } finally { | ||||
|       setIsLoading(false); | ||||
|     } | ||||
|   }; | ||||
|  | ||||
|   return ( | ||||
|     <Paper className="w-full h-full p-3 flex flex-col gap-10"> | ||||
|       <div className="flex justify-between items-center"> | ||||
|         <button | ||||
|           className="flex items-center gap-2" | ||||
|           onClick={() => navigate(-1)} | ||||
|         > | ||||
|           <ArrowLeft size={20} /> | ||||
|           Назад | ||||
|         </button> | ||||
|       </div> | ||||
|       <h1 className="text-2xl font-bold">Создание станции</h1> | ||||
|       <div className="flex flex-col gap-10 w-full items-end"> | ||||
|         <TextField | ||||
|           className="w-full" | ||||
|           label="Название" | ||||
|           required | ||||
|           value={name} | ||||
|           onChange={(e) => setName(e.target.value)} | ||||
|         /> | ||||
|         <TextField | ||||
|           className="w-full" | ||||
|           label="Системное название" | ||||
|           required | ||||
|           value={systemName} | ||||
|           onChange={(e) => setSystemName(e.target.value)} | ||||
|         /> | ||||
|         <FormControl fullWidth> | ||||
|           <InputLabel>Направление</InputLabel> | ||||
|           <Select | ||||
|             value={direction} | ||||
|             label="Направление" | ||||
|             onChange={(e) => setDirection(e.target.value)} | ||||
|             required | ||||
|           > | ||||
|             <MenuItem value="forward">Прямое</MenuItem> | ||||
|             <MenuItem value="backward">Обратное</MenuItem> | ||||
|           </Select> | ||||
|         </FormControl> | ||||
|  | ||||
|         <Button | ||||
|           variant="contained" | ||||
|           color="primary" | ||||
|           className="w-min flex gap-2 items-center" | ||||
|           startIcon={<Save size={20} />} | ||||
|           onClick={handleCreate} | ||||
|           disabled={isLoading || !name || !systemName || !direction} | ||||
|         > | ||||
|           {isLoading ? ( | ||||
|             <Loader2 size={20} className="animate-spin" /> | ||||
|           ) : ( | ||||
|             "Создать" | ||||
|           )} | ||||
|         </Button> | ||||
|       </div> | ||||
|     </Paper> | ||||
|   ); | ||||
| }); | ||||
		Reference in New Issue
	
	Block a user