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 |   89 ++++++++++++++++++++++++++++++++++++++------
 1 files changed, 77 insertions(+), 12 deletions(-)

diff --git a/zy-acs-flow/src/map/MapPage.jsx b/zy-acs-flow/src/map/MapPage.jsx
index 613becc..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',
@@ -245,6 +261,23 @@
                 {mode === MapMode.MOVABLE_MODE && (
                     <>
                         <Button
+                            variant="outlined"
+                            sx={{ mr: 2 }}
+                            onClick={() => {
+                                Tool.clearMapData();
+                            }}
+                        >
+                            {translate('page.map.action.clear')}
+                        </Button>
+                        <ConfirmButton
+                            label="page.map.action.save"
+                            variant="contained"
+                            sx={{ mr: 2 }}
+                            onConfirm={() => {
+                                Http.saveMapData(curZone);
+                            }}
+                        />
+                        <Button
                             variant="contained"
                             color="primary"
                             sx={{ mr: 1 }}
@@ -257,6 +290,15 @@
 
                 {mode === MapMode.SETTINGS_MODE && (
                     <>
+                        <Button
+                            variant="outlined"
+                            sx={{ mr: 2 }}
+                            onClick={() => {
+                                Tool.clearMapData();
+                            }}
+                        >
+                            {translate('page.map.action.clear')}
+                        </Button>
                         <ConfirmButton
                             label="page.map.action.save"
                             variant="contained"
@@ -312,7 +354,7 @@
                     }} />
                 </Box>
 
-                <SpeedDial
+                {/* <SpeedDial
                     ariaLabel="SpeedDial 绀轰緥"
                     sx={{ position: 'absolute', bottom: 16, right: 16 }}
                     icon={<MoreVertIcon />}
@@ -324,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 />
+                        &nbsp;{translate('page.map.action.adapt')}
+                    </Fab>
+                </Box>
             </Box>
 
             <Insight

--
Gitblit v1.9.1