From ce7cab3f73e46f76b10efd7f8ff8dd5ce712482b Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期二, 12 十一月 2024 14:39:43 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/MapPage.jsx | 60 ++++++++++++++++++++++++++++++++++++++---------------------- 1 files changed, 38 insertions(+), 22 deletions(-) diff --git a/zy-acs-flow/src/map/MapPage.jsx b/zy-acs-flow/src/map/MapPage.jsx index 6c83383..ba9ebb1 100644 --- a/zy-acs-flow/src/map/MapPage.jsx +++ b/zy-acs-flow/src/map/MapPage.jsx @@ -19,10 +19,11 @@ import * as Http from './http'; import WebSocketClient from './websocket' import ConfirmButton from "../page/components/ConfirmButton"; -import { FitScreen, AltRoute } from '@mui/icons-material'; +import { FitScreen, AltRoute, RotateRight } from '@mui/icons-material'; import MapSearch from "./header/MapSearch"; import { startupOrShutdown } from "./http"; import PulseSignal from "../page/components/PulseSignal"; +import FakeFab from "./header/FakeFab"; let player; let websocket; @@ -39,7 +40,7 @@ const [app, setApp] = useState(null); const [mapContainer, setMapContainer] = useState(null); - const [mode, setMode] = useState(null); + const [mode, setMode] = useState(MAP_MODE.OBSERVER_MODE); const [dataFetched, setDataFetched] = useState(false); const [insightVisible, setInsightVisible] = useState(false); const [deviceVisible, setDeviceVisible] = useState(false); @@ -47,7 +48,6 @@ const [batchSelectionVisible, setBatchSelectionVisible] = useState(false); const [curSprite, setCurSprite] = useState(null); - const prevCurSpriteRef = useRef(); const [batchSprites, setBatchSprites] = useState([]); const [rcsStatus, setRcsStatus] = useState(null); @@ -77,17 +77,17 @@ Http.setMapContainer(player.mapContainer); websocket = new WebSocketClient('/ws/map/websocket'); - await Http.fetchMapData(curZone, setRcsStatus); + await Http.fetchMapData(curZone, setRcsStatus, setCurSprite); websocket.connect(); websocket.onMessage = (wsMsg) => { Tool.generateDynamicGraphic(curZone, JSON.parse(wsMsg), setCurSprite); } + player.rotateMap(localStorage.getItem('mapRotation')); setTimeout(() => { notify.info(translate('page.map.welcome')); player.adaptScreen(); setDataFetched(true); - setMode(MAP_MODE.OBSERVER_MODE); }, 200) } initialize(); @@ -189,10 +189,7 @@ if (!mapContainer) { return; } - prevCurSpriteRef.current = curSprite; - if (curSprite && prevCurSprite !== curSprite) { - Tool.removeSelectedEffect(); - } + Tool.removeSelectedEffect(); if (curSprite) { if (mode === MAP_MODE.OBSERVER_MODE) { Tool.showSelectedEffect(curSprite); @@ -208,7 +205,6 @@ setSettingsVisible(false); } }, [curSprite]); - const prevCurSprite = prevCurSpriteRef.current; // watch batchSprites React.useEffect(() => { @@ -259,7 +255,12 @@ {mode === MAP_MODE.OBSERVER_MODE && ( <> <Box sx={{ mr: 2, display: 'flex', alignItems: 'center' }}> - <PulseSignal negative flag={rcsStatus} width={12} /> + <PulseSignal + negative + negativeColor='#a4b0be' + flag={rcsStatus} + width={12} + /> </Box> <Button variant="contained" @@ -396,26 +397,41 @@ bottom: 30, display: 'flex', flexDirection: 'column', - gap: 1 + gap: 2 }} > {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> + <> + <Fab + variant="extended" + color={showRoutes ? 'primary' : 'default'} + size="small" + onClick={() => { + showRoutes ? Tool.hideRoutes(curZone, setShowRoutes) : Tool.showRoutes(curZone, setShowRoutes) + }} + > + <AltRoute /> + </Fab> + <FakeFab + /> + </> )} <Fab variant="extended" color="primary" size="small" onClick={() => { + player.rotateMap(Math.PI / 2); + }} + > + <RotateRight /> + {/* {translate('page.map.action.adapt')} */} + </Fab> + <Fab + variant="extended" + color="primary" + size="small" + onClick={() => { player.adaptScreen(); }} > -- Gitblit v1.9.1