From ca8eccf05bbc84c549859d29f0a97cb047b70638 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期一, 14 十月 2024 09:55:20 +0800
Subject: [PATCH] #

---
 zy-acs-flow/src/map/MapPage.jsx |  112 +++++++++++++++++++++++++++++++++++++++++++++++--------
 1 files changed, 95 insertions(+), 17 deletions(-)

diff --git a/zy-acs-flow/src/map/MapPage.jsx b/zy-acs-flow/src/map/MapPage.jsx
index cf185ce..2d5e439 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,
@@ -25,15 +25,19 @@
 import Insight from "./insight";
 import Device from "./Device";
 import Settings from "./settings";
+import Batch from "./batch";
 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;
@@ -47,14 +51,22 @@
     const [insightVisible, setInsightVisible] = useState(false);
     const [deviceVisible, setDeviceVisible] = useState(false);
     const [settingsVisible, setSettingsVisible] = useState(false);
+    const [batchSelectionVisible, setBatchSelectionVisible] = useState(false);
 
     const [spriteSettings, setSpriteSettings] = useState(null);
     const prevSpriteSettingsRef = useRef();
+    const [batchSprites, setBatchSprites] = useState([]);
 
     const [curZone, setCurZone] = useState(() => {
         const storedValue = localStorage.getItem('curZone');
         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');
@@ -66,9 +78,16 @@
             Tool.setMapContainer(player.mapContainer);
             Tool.setThemeMode(themeMode);
             Http.setNotify(notify);
+            Http.setMapContainer(player.mapContainer);
             // websocket = new WebSocketClient('/ws/map/websocket');
 
-            await Http.fetchMapData(0);
+            await Http.fetchMapData();
+
+            setTimeout(() => {
+                player.adaptScreen();
+                notify.info('Welcome to Rcs');
+            }, 200)
+
             // websocket.connect();
             // websocket.onMessage = (data) => {
             //     Tool.updateMapStatusInRealTime(data, () => curFloorRef.current, setCurSPrite);
@@ -78,16 +97,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) {
@@ -101,6 +112,10 @@
     }, [])
 
     useEffect(() => {
+        setTimeout(handleResize, 300)
+    }, [sidebarOpen]);
+
+    useEffect(() => {
         player.setTheme(themeMode);
         Tool.setThemeMode(themeMode);
     }, [themeMode])
@@ -110,8 +125,10 @@
 
         setDeviceVisible(false);
         setSettingsVisible(false);
+        setBatchSelectionVisible(false);
 
         setSpriteSettings(null);
+        setBatchSprites([]);
 
         switch (mode) {
             case MapMode.OBSERVER_MODE:
@@ -132,6 +149,10 @@
                         restartFn();
                     });
                 });
+
+                mapContainer.children.forEach(child => {
+                    Tool.beMovable(child);
+                })
                 break
             case MapMode.SETTINGS_MODE:
                 player.hideGridLines();
@@ -196,6 +217,7 @@
     return (
         <Box
             sx={{
+                width: '100%',
                 height: '100%',
                 display: 'flex',
                 flexDirection: 'column',
@@ -231,18 +253,35 @@
                         <Button
                             variant="contained"
                             color="primary"
-                            sx={{ mr: 1 }}
+                            sx={{ mr: 2 }}
                         >
                             鍋滄RCS杩愯浆
                         </Button>
-                        <Button variant="contained" color="secondary">
-                            妯℃嫙AGV杩愯
+                        <Button variant="contained" color="primary">
+                            绯荤粺鎶ュ憡
                         </Button>
                     </>
                 )}
 
                 {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"
@@ -256,11 +295,20 @@
 
                 {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"
                             onConfirm={() => {
-                                Http.saveMapData(curZone, mapContainer);
+                                Http.saveMapData(curZone);
                             }}
                         />
                     </>
@@ -311,7 +359,7 @@
                     }} />
                 </Box>
 
-                <SpeedDial
+                {/* <SpeedDial
                     ariaLabel="SpeedDial 绀轰緥"
                     sx={{ position: 'absolute', bottom: 16, right: 16 }}
                     icon={<MoreVertIcon />}
@@ -323,7 +371,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
@@ -354,6 +425,13 @@
                 width={570}
             />
 
+            <Batch
+                open={batchSelectionVisible}
+                onCancel={() => {
+                    setBatchSelectionVisible(false);
+                }}
+            />
+
         </Box>
     );
 }

--
Gitblit v1.9.1