From 64bafdbf7abf3f686d04569e24573a4113d02ee4 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@gmail.com> Date: 星期三, 02 四月 2025 16:14:07 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/MapPage.jsx | 39 +++++++++++++++++++++------------------ 1 files changed, 21 insertions(+), 18 deletions(-) diff --git a/zy-acs-flow/src/map/MapPage.jsx b/zy-acs-flow/src/map/MapPage.jsx index ba9ebb1..8082926 100644 --- a/zy-acs-flow/src/map/MapPage.jsx +++ b/zy-acs-flow/src/map/MapPage.jsx @@ -8,7 +8,7 @@ useTheme, Fab, } from '@mui/material'; -import { MAP_MODE } from "./constants"; +import { MAP_MODE, MAP_DEFAULT_ROTATION } from "./constants"; import Player from './player'; import * as Tool from './tool'; import { NotificationProvider, useNotification } from './Notification'; @@ -19,11 +19,12 @@ import * as Http from './http'; import WebSocketClient from './websocket' import ConfirmButton from "../page/components/ConfirmButton"; -import { FitScreen, AltRoute, RotateRight } from '@mui/icons-material'; +import { FitScreen, RotateRight, Flip } from '@mui/icons-material'; import MapSearch from "./header/MapSearch"; import { startupOrShutdown } from "./http"; import PulseSignal from "../page/components/PulseSignal"; import FakeFab from "./header/FakeFab"; +import RouteFab from "./header/RouteFab"; let player; let websocket; @@ -41,6 +42,7 @@ const [mapContainer, setMapContainer] = useState(null); const [mode, setMode] = useState(MAP_MODE.OBSERVER_MODE); + const modeRef = useRef(mode); const [dataFetched, setDataFetched] = useState(false); const [insightVisible, setInsightVisible] = useState(false); const [deviceVisible, setDeviceVisible] = useState(false); @@ -80,10 +82,12 @@ await Http.fetchMapData(curZone, setRcsStatus, setCurSprite); websocket.connect(); websocket.onMessage = (wsMsg) => { - Tool.generateDynamicGraphic(curZone, JSON.parse(wsMsg), setCurSprite); + if (modeRef.current === MAP_MODE.OBSERVER_MODE) { + Tool.generateDynamicGraphic(curZone, JSON.parse(wsMsg), setCurSprite); + } } - player.rotateMap(localStorage.getItem('mapRotation')); + player.rotateMap(localStorage.getItem('mapRotation') || Tool.rotationParseNum(MAP_DEFAULT_ROTATION)); setTimeout(() => { notify.info(translate('page.map.welcome')); player.adaptScreen(); @@ -104,7 +108,6 @@ player.destroy(); window.removeEventListener('resize', handleResize); Tool.patchRaLayout(''); - Tool.isF }; }, []) @@ -118,6 +121,8 @@ }, [themeMode]) const switchMode = (mode) => { + modeRef.current = mode; + Tool.removeSelectedEffect(); player.hideGridLines(); @@ -178,6 +183,9 @@ const { mapX, mapY } = Tool.getRealPosition(x, y); sprite.x = mapX; sprite.y = mapY; + + // sprite.scale.set(mapContainer.scale.x); + sprite.rotation = -mapContainer.rotation; Tool.initSprite(sprite, type); mapContainer.addChild(sprite); @@ -402,18 +410,13 @@ > {mode !== MAP_MODE.MOVABLE_MODE && ( <> - <Fab - variant="extended" - color={showRoutes ? 'primary' : 'default'} - size="small" - onClick={() => { - showRoutes ? Tool.hideRoutes(curZone, setShowRoutes) : Tool.showRoutes(curZone, setShowRoutes) - }} - > - <AltRoute /> - </Fab> - <FakeFab + <RouteFab + curZone={curZone} + showRoutes={showRoutes} + setShowRoutes={setShowRoutes} + notify={notify} /> + <FakeFab /> </> )} <Fab @@ -425,7 +428,7 @@ }} > <RotateRight /> - {/* {translate('page.map.action.adapt')} */} + {translate('page.map.action.rotate')} </Fab> <Fab variant="extended" @@ -436,7 +439,7 @@ }} > <FitScreen /> - {/* {translate('page.map.action.adapt')} */} + {translate('page.map.action.adapt')} </Fab> </Box> </Box> -- Gitblit v1.9.1