fix: Hot bug fix

src/pages/Station/StationCreatePage/index.tsx

@@ -8,33 +8,62 @@ import {
   InputLabel,
 } from "@mui/material";
 import { observer } from "mobx-react-lite";
-import { ArrowLeft, Loader2, Save } from "lucide-react";
+import { ArrowLeft, Save } from "lucide-react";
+import { Loader2 } from "lucide-react";
 import { useNavigate } from "react-router-dom";
 import { toast } from "react-toastify";
-import { stationsStore } from "@shared";
-import { useState } from "react";
+import { stationsStore, languageStore, cityStore } from "@shared";
+import { useEffect, useState } from "react";
 import { LanguageSwitcher } from "@widgets";
 
 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 { language } = languageStore;
+  const {
+    createStationData,
+    setCreateCommonData,
+    createStation,
+    setLanguageCreateStationData,
+  } = stationsStore;
+  const { cities, getCities } = cityStore;
+  const [coordinates, setCoordinates] = useState<string>("");
+
+  useEffect(() => {
+    if (
+      createStationData.common.latitude !== 0 ||
+      createStationData.common.longitude !== 0
+    ) {
+      setCoordinates(
+        `${createStationData.common.latitude}, ${createStationData.common.longitude}`
+      );
+    }
+  }, [createStationData.common.latitude, createStationData.common.longitude]);
 
   const handleCreate = async () => {
     try {
       setIsLoading(true);
-      await stationsStore.createStation(name, systemName, direction);
+      await createStation();
       toast.success("Станция успешно создана");
       navigate("/station");
     } catch (error) {
+      console.error("Error creating station:", error);
       toast.error("Ошибка при создании станции");
     } finally {
       setIsLoading(false);
     }
   };
 
+  useEffect(() => {
+    const fetchCities = async () => {
+      await getCities("ru");
+      await getCities("en");
+      await getCities("zh");
+    };
+
+    fetchCities();
+  }, []);
+
   return (
     <Paper className="w-full h-full p-3 flex flex-col gap-10">
       <LanguageSwitcher />
@@ -47,44 +76,123 @@ export const StationCreatePage = observer(() => {
           Назад
         </button>
       </div>
+
       <div className="flex flex-col gap-10 w-full items-end">
         <div className="flex gap-10 items-center mb-5 max-w-[80%] self-start">
-          <h1 className="text-3xl break-words">{name}</h1>
+          <h1 className="text-3xl break-words">Создание станции</h1>
         </div>
         <TextField
-          className="w-full"
+          fullWidth
           label="Название"
+          value={createStationData[language].name || ""}
           required
-          value={name}
-          onChange={(e) => setName(e.target.value)}
-        />
-        <TextField
-          className="w-full"
-          label="Системное название"
-          required
-          value={systemName}
-          onChange={(e) => setSystemName(e.target.value)}
+          onChange={(e) =>
+            setLanguageCreateStationData(language, {
+              name: e.target.value,
+            })
+          }
         />
+
         <FormControl fullWidth>
-          <InputLabel>Направление</InputLabel>
+          <InputLabel id="direction-label">Прямой/обратный маршрут</InputLabel>
           <Select
-            value={direction}
-            label="Направление"
-            onChange={(e) => setDirection(e.target.value)}
-            required
+            labelId="direction-label"
+            value={createStationData.common.direction ? "Прямой" : "Обратный"}
+            label="Прямой/обратный маршрут"
+            onChange={(e) =>
+              setCreateCommonData({
+                direction: e.target.value === "Прямой",
+              })
+            }
           >
-            <MenuItem value="forward">Прямое</MenuItem>
-            <MenuItem value="backward">Обратное</MenuItem>
+            <MenuItem value="Прямой">Прямой</MenuItem>
+            <MenuItem value="Обратный">Обратный</MenuItem>
+          </Select>
+        </FormControl>
+
+        <TextField
+          fullWidth
+          label="Описание"
+          value={createStationData[language].description || ""}
+          onChange={(e) =>
+            setLanguageCreateStationData(language, {
+              description: e.target.value,
+            })
+          }
+        />
+
+        <TextField
+          fullWidth
+          label="Адрес"
+          value={createStationData[language].address || ""}
+          onChange={(e) =>
+            setLanguageCreateStationData(language, {
+              address: e.target.value,
+            })
+          }
+        />
+
+        <TextField
+          fullWidth
+          label="Координаты"
+          value={coordinates}
+          onChange={(e) => {
+            const newValue = e.target.value;
+            setCoordinates(newValue);
+
+            const input = newValue.replace(/,/g, " ").trim();
+            const [latStr, lonStr] = input.split(/\s+/);
+
+            const lat = parseFloat(latStr);
+            const lon = parseFloat(lonStr);
+
+            const isValidLat = !isNaN(lat);
+            const isValidLon = !isNaN(lon);
+
+            if (isValidLat && isValidLon) {
+              setCreateCommonData({
+                latitude: lat,
+                longitude: lon,
+              });
+            } else {
+              setCreateCommonData({
+                latitude: 0,
+                longitude: 0,
+              });
+            }
+          }}
+          placeholder="Введите координаты в формате: широта долгота (можно использовать запятые или пробелы)"
+        />
+
+        <FormControl fullWidth>
+          <InputLabel>Город</InputLabel>
+          <Select
+            value={createStationData.common.city_id || ""}
+            label="Город"
+            onChange={(e) => {
+              const selectedCity = cities["ru"].data.find(
+                (city) => city.id === e.target.value
+              );
+              setCreateCommonData({
+                city_id: e.target.value as number,
+                city: selectedCity?.name || "",
+              });
+            }}
+          >
+            {cities["ru"].data.map((city) => (
+              <MenuItem key={city.id} value={city.id}>
+                {city.name}
+              </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}
+          disabled={isLoading || !createStationData[language]?.name}
         >
           {isLoading ? (
             <Loader2 size={20} className="animate-spin" />