From 83a12f86f4f963b8a1e6741fd18a5f9dcbd60eb8 Mon Sep 17 00:00:00 2001 From: luxiaotao1123 <t1341870251@163.com> Date: 星期六, 12 十月 2024 16:08:01 +0800 Subject: [PATCH] # --- zy-acs-flow/src/map/MapPage.jsx | 63 +++++++++++++++++++++++++------ 1 files changed, 51 insertions(+), 12 deletions(-) diff --git a/zy-acs-flow/src/map/MapPage.jsx b/zy-acs-flow/src/map/MapPage.jsx index f99eaf5..4c11c7d 100644 --- a/zy-acs-flow/src/map/MapPage.jsx +++ b/zy-acs-flow/src/map/MapPage.jsx @@ -1,5 +1,5 @@ import React, { useState, useRef, useEffect, useMemo } from "react"; -import { useTranslate } from "react-admin"; +import { useTranslate, useRefresh, useSidebarState } from "react-admin"; import { TextField, Select, @@ -9,7 +9,7 @@ SpeedDial, SpeedDialAction, useTheme, - Snackbar, + Fab, } from '@mui/material'; import { MoreVert as MoreVertIcon, @@ -28,12 +28,15 @@ import * as Http from './http'; import WebSocketClient from './websocket' import ConfirmButton from "../page/components/ConfirmButton"; +import { FitScreen } from '@mui/icons-material'; + let player; let websocket; const Map = () => { const notify = useNotification(); + const [sidebarOpen] = useSidebarState(); const translate = useTranslate(); const theme = useTheme(); const themeMode = theme.palette.mode; @@ -56,6 +59,12 @@ return storedValue !== null ? JSON.parse(storedValue) : null; }); + const handleResize = () => { + const width = contentRef.current.offsetWidth; + const height = contentRef.current.offsetHeight; + player.resize(width, height); + }; + useEffect(() => { Tool.patchRaLayout('0px'); const initialize = async () => { @@ -70,6 +79,12 @@ // websocket = new WebSocketClient('/ws/map/websocket'); await Http.fetchMapData(); + + setTimeout(() => { + player.adaptScreen(); + notify.info('Welcome to Rcs'); + }, 200) + // websocket.connect(); // websocket.onMessage = (data) => { // Tool.updateMapStatusInRealTime(data, () => curFloorRef.current, setCurSPrite); @@ -79,16 +94,8 @@ initialize(); // resize - const handleResize = () => { - const width = contentRef.current.offsetWidth; - const height = contentRef.current.offsetHeight; - - player.resize(width, height); - }; handleResize(); window.addEventListener('resize', handleResize); - - notify.info('Welcome to Rcs'); return () => { if (websocket) { @@ -100,6 +107,10 @@ Tool.patchRaLayout(''); }; }, []) + + useEffect(() => { + setTimeout(handleResize, 300) + }, [sidebarOpen]); useEffect(() => { player.setTheme(themeMode); @@ -133,6 +144,10 @@ restartFn(); }); }); + + mapContainer.children.forEach(child => { + Tool.beMovable(child); + }) break case MapMode.SETTINGS_MODE: player.hideGridLines(); @@ -197,6 +212,7 @@ return ( <Box sx={{ + width: '100%', height: '100%', display: 'flex', flexDirection: 'column', @@ -338,7 +354,7 @@ }} /> </Box> - <SpeedDial + {/* <SpeedDial ariaLabel="SpeedDial 绀轰緥" sx={{ position: 'absolute', bottom: 16, right: 16 }} icon={<MoreVertIcon />} @@ -350,7 +366,30 @@ tooltipTitle={action.name} /> ))} - </SpeedDial> + </SpeedDial> */} + + <Box + sx={{ + position: 'absolute', + left: 35, + bottom: 30, + display: 'flex', + flexDirection: 'column', + gap: 1 + }} + > + <Fab + variant="extended" + color="primary" + size="medium" + onClick={() => { + player.adaptScreen(); + }} + > + <FitScreen /> + {translate('page.map.action.adapt')} + </Fab> + </Box> </Box> <Insight -- Gitblit v1.9.1