From fba2fb0f5cc558f060e288ebf26726e5639005dc Mon Sep 17 00:00:00 2001 From: Spynder <19329095+Spynder@users.noreply.github.com> Date: Tue, 6 May 2025 17:56:05 +0300 Subject: [PATCH] more fixes --- src/App.tsx | 11 + src/components/LinkedItems.tsx | 119 ++--- .../modals/StationEditModal/index.tsx | 35 +- src/pages/route-preview/InfiniteCanvas.tsx | 3 +- src/pages/route-preview/MapDataContext.tsx | 1 + src/pages/route-preview/RightSidebar.tsx | 6 +- src/pages/route-preview/index.tsx | 4 - src/pages/route-preview/utils.ts | 10 +- src/pages/route/types.ts | 2 + src/pages/sight/edit.tsx | 466 +++++++++--------- src/pages/station/list.tsx | 20 +- src/store/StationStore.ts | 5 + 12 files changed, 366 insertions(+), 316 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index ca7f9e2..cdcf0f7 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -177,6 +177,17 @@ function App() { icon: , }, }, + { + name: "stationmodal", + show: "/route/:id/station", + edit: "/route/:id/station/", + meta: { + hide: true, + canDelete: true, + label: "Маршруты", + icon: , + }, + }, { name: "vehicle", list: "/vehicle", diff --git a/src/components/LinkedItems.tsx b/src/components/LinkedItems.tsx index 5147a94..86252db 100644 --- a/src/components/LinkedItems.tsx +++ b/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(arr: T[], pos: number, value: T): T[] { const index = pos - 1; if (index >= arr.length) { @@ -90,7 +91,8 @@ export const LinkedItems = ({ }: LinkedItemsProps) => { const { language } = languageStore; const { setArticleModalOpenAction, setArticleIdAction } = articleStore; - const { setStationModalOpenAction, setStationIdAction } = stationStore; + const { setStationModalOpenAction, setStationIdAction, setRouteIdAction } = + stationStore; const [position, setPosition] = useState(1); const [items, setItems] = useState([]); const [linkedItems, setLinkedItems] = useState([]); @@ -306,66 +308,65 @@ export const LinkedItems = ({ isDragDisabled={type !== "edit" || !dragAllowed} > {(provided) => ( - <> - { - if (childResource === "article") { - setArticleModalOpenAction(true); - setArticleIdAction(item.id); - } - if (childResource === "station") { - setStationModalOpenAction(true); - setStationIdAction(item.id); - } - }} - ref={provided.innerRef} - {...provided.draggableProps} - {...provided.dragHandleProps} - hover - > - {type === "edit" && dragAllowed && ( - - - - - - )} - - {index + 1} + { + if (childResource === "article") { + setArticleModalOpenAction(true); + setArticleIdAction(item.id); + } + if (childResource === "station") { + setStationModalOpenAction(true); + setStationIdAction(item.id); + setRouteIdAction(Number(parentId)); + } + }} + ref={provided.innerRef} + {...provided.draggableProps} + {...provided.dragHandleProps} + hover + > + {type === "edit" && dragAllowed && ( + + + + - {fields.map((field, index) => ( - - {field.render - ? field.render(item[field.data]) - : item[field.data]} - - ))} + )} + + {index + 1} + + {fields.map((field, index) => ( + + {field.render + ? field.render(item[field.data]) + : item[field.data]} + + ))} - {type === "edit" && ( - - - - )} - - + {type === "edit" && ( + + + + )} + )} ))} diff --git a/src/components/modals/StationEditModal/index.tsx b/src/components/modals/StationEditModal/index.tsx index 473a421..4a1c74c 100644 --- a/src/components/modals/StationEditModal/index.tsx +++ b/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", - id: selectedStationId ?? undefined, + resource: `route/${selectedRouteId ?? 1}/station`, action: "edit", + id: "", redirect: false, - - onMutationSuccess: () => { + onMutationSuccess: (data) => { + 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 ( ) { > {children} + {/* Show center of the screen. ) { g.circle(center.x, center.y, 1); g.fill("#fff"); }} - /> + /> */} ); } \ No newline at end of file diff --git a/src/pages/route-preview/MapDataContext.tsx b/src/pages/route-preview/MapDataContext.tsx index 0ce7fde..91d654c 100644 --- a/src/pages/route-preview/MapDataContext.tsx +++ b/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' diff --git a/src/pages/route-preview/RightSidebar.tsx b/src/pages/route-preview/RightSidebar.tsx index c0a4b22..591e7be 100644 --- a/src/pages/route-preview/RightSidebar.tsx +++ b/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() { { @@ -160,7 +160,7 @@ export function RightSidebar() { /> { diff --git a/src/pages/route-preview/index.tsx b/src/pages/route-preview/index.tsx index eb71db9..b81045d 100644 --- a/src/pages/route-preview/index.tsx +++ b/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]); diff --git a/src/pages/route-preview/utils.ts b/src/pages/route-preview/utils.ts index 161fd80..fca59b8 100644 --- a/src/pages/route-preview/utils.ts +++ b/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, - y: -longitude*2 + x: longitude, + y: -latitude*2, } } export function localToCoordinates(x: number, y: number) { return { - latitude: x, - longitude: -y/2 + longitude: x, + latitude: -y/2, } } \ No newline at end of file diff --git a/src/pages/route/types.ts b/src/pages/route/types.ts index 9e46072..920b81a 100644 --- a/src/pages/route/types.ts +++ b/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; }; diff --git a/src/pages/sight/edit.tsx b/src/pages/sight/edit.tsx index 91cd2d3..ab14d92 100644 --- a/src/pages/sight/edit.tsx +++ b/src/pages/sight/edit.tsx @@ -460,13 +460,13 @@ export const SightEdit = observer(() => { }, }} > - + + { {/* Блок предпросмотра */} - + { }, }} > + { /> - - - - {!previewSelected && ( - - {mediaFile && mediaFile.src && mediaFile.media_type === 1 && ( - {mediaFile.filename} - )} - - {mediaFile && mediaFile.media_type === 2 && ( - - )} - - { - - {previewSelected && - previewMedia && - previewMedia.src && - previewMedia.media_type === 1 && ( + + {!previewSelected && ( + + {mediaFile && mediaFile.src && mediaFile.media_type === 1 && ( {previewMedia.filename} )} - {previewSelected && - previewMedia && - previewMedia.media_type === 2 && ( + {mediaFile && mediaFile.media_type === 2 && ( + )} - {!previewSelected && ( - - {selectedArticle && ( - + {previewSelected && + previewMedia && + previewMedia.src && + previewMedia.media_type === 1 && ( + {previewMedia.filename} - {selectedArticle.heading} - + /> )} - {selectedArticle && ( - - {selectedArticle.body} - + {previewSelected && + previewMedia && + previewMedia.media_type === 2 && ( + - )} - - + {previewSelected && + previewMedia && + previewMedia.media_type === 3 && ( + {previewMedia.filename} + )} + {previewSelected && + previewMedia && + previewMedia.media_type === 4 && ( + {previewMedia.filename} + )} + + {previewSelected && + previewMedia && + previewMedia.src && + previewMedia.media_type == 5 && ( + + )} + + {previewSelected && + previewMedia && + previewMedia.media_type === 6 && ( + + )} + + {!previewSelected && ( + + {selectedArticle && ( + + {selectedArticle.heading} + + )} + + {selectedArticle && ( + + {selectedArticle.body} + + )} + + )} + - {linkedArticles.map((article, index) => ( - { - setSelectedArticleIndex(index); - setPreviewSelected(false); - }} - sx={{ - cursor: "pointer", - bgcolor: "transparent", - color: "inherit", - textDecoration: - selectedArticleIndex === index ? - "underline" : "none", - p: 1, - borderRadius: 1, - }} - > - - {article.heading} - - - ))} + + {linkedArticles.map((article, index) => ( + { + setSelectedArticleIndex(index); + setPreviewSelected(false); + }} + sx={{ + cursor: "pointer", + bgcolor: "transparent", + color: "inherit", + textDecoration: + selectedArticleIndex === index ? + "underline" : "none", + p: 1, + borderRadius: 1, + }} + > + + {article.heading} + + + ))} + - - } - - + } + + + + @@ -1395,10 +1399,11 @@ export const SightEdit = observer(() => { }, }} > + { /> + {/* Предпросмотр */} { + diff --git a/src/pages/station/list.tsx b/src/pages/station/list.tsx index 2713010..e89cce2 100644 --- a/src/pages/station/list.tsx +++ b/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", - headerName: "Описание", - type: "string", - display: "flex", - align: "left", - headerAlign: "left", - flex: 1, - }, + // { + // field: "description", + // headerName: "Описание", + // type: "string", + // display: "flex", + // align: "left", + // headerAlign: "left", + // flex: 1, + // }, { field: "actions", headerName: "Действия", diff --git a/src/store/StationStore.ts b/src/store/StationStore.ts index 5304821..bed096d 100644 --- a/src/store/StationStore.ts +++ b/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; };