more fixes

src/App.tsx

@@ -177,6 +177,17 @@ function App() {
                       icon: <StationIcon />,
                     },
                   },
+                  {
+                    name: "stationmodal",
+                    show: "/route/:id/station",
+                    edit: "/route/:id/station/",
+                    meta: {
+                      hide: true,
+                      canDelete: true,
+                      label: "Маршруты",
+                      icon: <RouteIcon />,
+                    },
+                  },
                   {
                     name: "vehicle",
                     list: "/vehicle",

src/components/LinkedItems.tsx

@@ -34,6 +34,7 @@ import { articleStore } from "../store/ArticleStore";
 import { ArticleEditModal } from "./modals/ArticleEditModal";
 import { StationEditModal } from "./modals/StationEditModal";
 import { stationStore } from "../store/StationStore";
+
 function insertAtPosition<T>(arr: T[], pos: number, value: T): T[] {
   const index = pos - 1;
   if (index >= arr.length) {
@@ -90,7 +91,8 @@ export const LinkedItems = <T extends { id: number; [key: string]: any }>({
 }: LinkedItemsProps<T>) => {
   const { language } = languageStore;
   const { setArticleModalOpenAction, setArticleIdAction } = articleStore;
-  const { setStationModalOpenAction, setStationIdAction } = stationStore;
+  const { setStationModalOpenAction, setStationIdAction, setRouteIdAction } =
+    stationStore;
   const [position, setPosition] = useState<number>(1);
   const [items, setItems] = useState<T[]>([]);
   const [linkedItems, setLinkedItems] = useState<T[]>([]);
@@ -306,7 +308,6 @@ export const LinkedItems = <T extends { id: number; [key: string]: any }>({
                             isDragDisabled={type !== "edit" || !dragAllowed}
                           >
                             {(provided) => (
-                              <>
                               <TableRow
                                 sx={{
                                   cursor:
@@ -322,6 +323,7 @@ export const LinkedItems = <T extends { id: number; [key: string]: any }>({
                                   if (childResource === "station") {
                                     setStationModalOpenAction(true);
                                     setStationIdAction(item.id);
+                                    setRouteIdAction(Number(parentId));
                                   }
                                 }}
                                 ref={provided.innerRef}
@@ -365,7 +367,6 @@ export const LinkedItems = <T extends { id: number; [key: string]: any }>({
                                   </TableCell>
                                 )}
                               </TableRow>
-                              </>
                             )}
                           </Draggable>
                         ))}

src/components/modals/StationEditModal/index.tsx

@@ -20,6 +20,9 @@ import { LanguageSwitch } from "../../LanguageSwitch/index";
 
 import { useState } from "react";
 import { stationStore } from "../../../store/StationStore";
+import { useCustom } from "@refinedev/core";
+import { useApiUrl } from "@refinedev/core";
+import { StationItem } from "src/pages/route/types";
 const MemoizedSimpleMDE = memo(MarkdownEditor);
 
 const TRANSFER_FIELDS = [
@@ -47,7 +50,7 @@ const style = {
 };
 
 export const StationEditModal = observer(() => {
-  const { stationModalOpen, setStationModalOpenAction, selectedStationId } =
+  const { stationModalOpen, setStationModalOpenAction, selectedStationId, selectedRouteId } =
     stationStore;
   const { language } = languageStore;
 
@@ -57,6 +60,14 @@ export const StationEditModal = observer(() => {
     };
   }, []);
 
+  const apiUrl = useApiUrl();
+
+  const { data: stationQuery, isLoading: isStationLoading } = useCustom({
+	  url: `${apiUrl}/route/${selectedRouteId ?? 1}/station`,
+	  method: 'get'
+	});
+
+
   const {
     register,
     control,
@@ -65,14 +76,15 @@ export const StationEditModal = observer(() => {
     reset,
     setValue,
     watch,
+    handleSubmit,
   } = useForm({
     refineCoreProps: {
-      resource: "station",
+      resource: `route/${selectedRouteId ?? 1}/station`,
-      id: selectedStationId ?? undefined,
       action: "edit",
+      id: "",
       redirect: false,
-
+      onMutationSuccess: (data) => {
-      onMutationSuccess: () => {
+        console.log(data);
         setStationModalOpenAction(false);
         reset();
         window.location.reload();
@@ -85,6 +97,19 @@ export const StationEditModal = observer(() => {
     },
   });
 
+  useEffect(() => {
+    if (stationModalOpen) {
+      const station = stationQuery?.data?.find((station: StationItem) => station.id === selectedStationId);
+      if(!station) return;
+      for(const key in station) {
+        setValue(key, station[key]);
+        console.log(key, station[key]);
+      }
+      setValue("station_id", station.id);
+      console.log(stationQuery);
+    }
+  }, [stationModalOpen, stationQuery]);
+
   return (
     <Modal
       open={stationModalOpen}

src/pages/route-preview/InfiniteCanvas.tsx

@@ -163,6 +163,7 @@ export function InfiniteCanvas({children} : Readonly<{children?: ReactNode}>) {
 			>
 				{children}
 			</pixiContainer>
+			{/* Show center of the screen.
 			<pixiGraphics
 				eventMode="none"
 
@@ -172,7 +173,7 @@ export function InfiniteCanvas({children} : Readonly<{children?: ReactNode}>) {
 					g.circle(center.x, center.y, 1);
 					g.fill("#fff");
 				}}
-			/>
+			/> */}
 		</ErrorBoundary>
 	);
 }

src/pages/route-preview/MapDataContext.tsx

@@ -59,6 +59,7 @@ export function MapDataProvider({ children }: Readonly<{ children: ReactNode }>)
 	  url: `${apiUrl}/route/${routeId}`,
 	  method: 'get',
 	});
+	
 	const { data: stationQuery, isLoading: isStationLoading } = useCustom({
 	  url: `${apiUrl}/route/${routeId}/station`,
 	  method: 'get'

src/pages/route-preview/RightSidebar.tsx

@@ -52,7 +52,7 @@ export function RightSidebar() {
 	}
 
 	function pan({x, y}: {x: number, y: number}) {
-		const coordinates = coordinatesToLocal(y,x);
+		const coordinates = coordinatesToLocal(x,y);
 		setTransform(coordinates.x, coordinates.y);
 	}
 
@@ -144,7 +144,7 @@ export function RightSidebar() {
 			<Stack direction="row" spacing={2}>
 				<TextField
 					type="number"
-					label="Центр карты X"
+					label="Центр карты, широта"
 					variant="filled"
 					value={Math.round(localCenter.x*100000)/100000}
 					onChange={(e) => {
@@ -160,7 +160,7 @@ export function RightSidebar() {
 				/>
 				<TextField
 					type="number"
-					label="Центр карты Y" 
+					label="Центр карты, высота" 
 					variant="filled"
 					value={Math.round(localCenter.y*100000)/100000}
 					onChange={(e) => {

src/pages/route-preview/index.tsx

@@ -77,8 +77,6 @@ export function RouteMap() {
 			return;
 		}
 
-		console.log("Use effect fired")
-
 		if (
 			originalRouteData?.center_latitude === originalRouteData?.center_longitude &&
 			originalRouteData?.center_latitude === 0
@@ -99,7 +97,6 @@ export function RouteMap() {
 					y: -(boundingBox.from.y + boundingBox.to.y) / 2
 				};
 				setPosition(newCenter);
-				console.log("Taking easy way out", originalRouteData)
 				setIsSetup(true);
 			}
 		} else if (
@@ -114,7 +111,6 @@ export function RouteMap() {
 				originalRouteData?.rotate,
 				originalRouteData?.scale_min
 			);
-			console.log("Setup complete")
 			setIsSetup(true);
 		}
 	}, [points, originalRouteData?.center_latitude, originalRouteData?.center_longitude, originalRouteData?.rotate, isSetup, screenCenter]);

src/pages/route-preview/utils.ts

@@ -1,14 +1,14 @@
 // approximation
-export function coordinatesToLocal(longitude: number, latitude: number) {
+export function coordinatesToLocal(latitude: number, longitude: number) {
     return {
-        x: latitude,
+        x: longitude,
-        y: -longitude*2
+        y: -latitude*2,
     }
 }
 
 export function localToCoordinates(x: number, y: number) {
 	return {
-        latitude: x,
+        longitude: x,
-        longitude: -y/2
+        latitude: -y/2,
     }
 }

src/pages/route/types.ts

@@ -4,6 +4,8 @@ export type StationItem = {
   id: number;
   name: string;
   description: string;
+  offset_x: number;
+  offset_y: number;
   [key: string]: string | number;
 };
 

src/pages/sight/edit.tsx

@@ -460,13 +460,13 @@ export const SightEdit = observer(() => {
             },
           }}
         >
-          <Box sx={{ display: "flex", gap: 2, position: "relative" }}>
+        <Box sx={{ display: "flex", flexDirection: "row", gap: 2 }}>
+          <Box sx={{ display: "flex", gap: 2, position: "relative", flex:1 }}>
             <Box
               sx={{
                 display: "flex",
                 flexDirection: "column",
                 flex: 1,
-                maxWidth: "50%",
                 gap: 10,
                 justifyContent: "space-between",
               }}
@@ -830,9 +830,10 @@ export const SightEdit = observer(() => {
             </Box>
 
             {/* Блок предпросмотра */}
+           
+          </Box>
           <Paper
               sx={{
-                position: "fixed",
                 p: 2,
                 width: "30%",
 
@@ -1014,11 +1015,12 @@ export const SightEdit = observer(() => {
             },
           }}
         >
+        <Box sx={{ display: "flex", flexDirection: "row", gap: 2 }}>
           <Box
             sx={{
-              maxWidth: "50%",
+              // display: "flex",
-              display: "flex",
+               flex:1,
-              flexDirection: "column",
+              // flexDirection: "column",
               gap: 2,
               position: "relative",
             }}
@@ -1098,14 +1100,14 @@ export const SightEdit = observer(() => {
               />
             </Box>
           </Box>
-        </Edit>
+          {/* Предпросмотр */}
           <Paper
             sx={{
               display: "flex",
               flexDirection: "column",
-            position: "fixed",
               p: 0,
               height: "max-content",
+              minWidth: "400px",
               width: "30%",
 
               top: "178px",
@@ -1383,6 +1385,8 @@ export const SightEdit = observer(() => {
               }
             </Box>
           </Paper>
+        </Box>
+      </Edit>
       </CustomTabPanel>
 
       <CustomTabPanel value={tabValue} index={2}>
@@ -1395,10 +1399,11 @@ export const SightEdit = observer(() => {
             },
           }}
         >
+        <Box sx={{ display: "flex", flexDirection: "row", gap: 2 }}>
           <Box
             sx={{
-              maxWidth: "50%",
               display: "flex",
+              flex: 1,
               gap: 2,
               position: "relative",
             }}
@@ -1616,11 +1621,11 @@ export const SightEdit = observer(() => {
               />
             </Box>
 
+            {/* Предпросмотр */}
             <Paper
               sx={{
-                position: "fixed",
                 p: 2,
-
+                minWidth: "fit-content",
                 width: "30%",
 
                 top: "178px",
@@ -1758,6 +1763,7 @@ export const SightEdit = observer(() => {
               </Box>
             </Paper>
           </Box>
+          </Box>
         </Edit>
       </CustomTabPanel>
       <ArticleEditModal />

src/pages/station/list.tsx

@@ -55,6 +55,7 @@ export const StationList = observer(() => {
         display: "flex",
         align: "left",
         headerAlign: "left",
+        flex: 1,
       },
       {
         field: "system_name",
@@ -64,6 +65,7 @@ export const StationList = observer(() => {
         display: "flex",
         align: "left",
         headerAlign: "left",
+        flex: 1,
       },
       {
         field: "direction",
@@ -123,15 +125,15 @@ export const StationList = observer(() => {
         align: "left",
         headerAlign: "left",
       },
-      {
+      // {
-        field: "description",
+      //   field: "description",
-        headerName: "Описание",
+      //   headerName: "Описание",
-        type: "string",
+      //   type: "string",
-        display: "flex",
+      //   display: "flex",
-        align: "left",
+      //   align: "left",
-        headerAlign: "left",
+      //   headerAlign: "left",
-        flex: 1,
+      //   flex: 1,
-      },
+      // },
       {
         field: "actions",
         headerName: "Действия",

src/store/StationStore.ts

@@ -3,6 +3,7 @@ import { makeAutoObservable } from "mobx";
 class StationStore {
   stationModalOpen: boolean = false;
   selectedStationId: number | null = null;
+  selectedRouteId: number | null = null;
 
   constructor() {
     makeAutoObservable(this);
@@ -12,6 +13,10 @@ class StationStore {
     this.selectedStationId = id;
   };
 
+  setRouteIdAction = (id: number) => {
+    this.selectedRouteId = id;
+  };
+
   setStationModalOpenAction = (open: boolean) => {
     this.stationModalOpen = open;
   };