From 0254b3caa25819d038754baa58b03824303b5fa7 Mon Sep 17 00:00:00 2001
From: Junjie <xjj@123>
Date: 星期日, 07 四月 2024 08:35:55 +0800
Subject: [PATCH] #

---
 zy-asrs-flow/src/pages/map/index.jsx |   39 +++++++++++++++++++++++++++++++--------
 1 files changed, 31 insertions(+), 8 deletions(-)

diff --git a/zy-asrs-flow/src/pages/map/index.jsx b/zy-asrs-flow/src/pages/map/index.jsx
index a0745fd..a1c3cb2 100644
--- a/zy-asrs-flow/src/pages/map/index.jsx
+++ b/zy-asrs-flow/src/pages/map/index.jsx
@@ -8,13 +8,13 @@
     FileAddOutlined,
     CompressOutlined,
     SettingOutlined,
-    CloseOutlined
 } from '@ant-design/icons';
 import './index.css'
 import { createStyles } from 'antd-style';
 import Edit from './components/device';
 import Settings from './components/settings'
 import * as Utils from './utils'
+import WebSocketClient from './websocket'
 import Player from './player';
 import MapSearch from './header/search';
 import MapFloor from './header/floor';
@@ -60,7 +60,7 @@
     SETTINGS_MODEL: "3",
 })
 
-let player;
+let player, websocket;
 
 const Map = () => {
     const intl = useIntl();
@@ -85,9 +85,11 @@
     const [dataFetched, setDataFetched] = React.useState(false);
     const [curSprite, setCurSPrite] = React.useState(null);
     const prevCurSpriteRef = React.useRef();
-    const hasFloor = true;
-    // const [hasFloor, setHasFloor] = React.useState(true);
-    const [curFloor, setCurFloor] = React.useState(1);
+    const [floorList, setFloorList] = React.useState([]);
+    const [curFloor, setCurFloor] = React.useState(() => {
+        const storedValue = localStorage.getItem('curFloor');
+        return storedValue !== null ? JSON.parse(storedValue) : null;
+    });
     const [batchSprites, setBatchSprites] = React.useState([]);
     const [batchDrawerVisible, setBatchDrawerVisible] = React.useState(false);
 
@@ -101,6 +103,10 @@
             Utils.syncMapContainer(player.mapContainer);
             Utils.syncNotify(notify);
 
+            websocket = new WebSocketClient('/ws/map/websocket');
+            websocket.connect();
+            websocket.onMessage = Utils.updateMapStatusInRealTime;
+
             const handleResize = () => {
                 setWindowSize({
                     width: window.innerWidth,
@@ -109,7 +115,11 @@
             };
             window.addEventListener('resize', handleResize);
 
-            await Utils.fetchMapData(curFloor);
+            const mapFloorData = await Utils.fetchMapFloor();
+            setFloorList(mapFloorData);
+            let defaultFloor = curFloor || mapFloorData?.[0]?.value;
+            setCurFloor(defaultFloor);
+            await Utils.fetchMapData(defaultFloor);
             setDataFetched(true);
             setModel(MapModel.OBSERVER_MODEL)
             setTimeout(() => {
@@ -141,6 +151,8 @@
         setDrawerVisible(false);
         setSpriteBySettings(null);
         setSettingsVisible(false);
+        setBatchSprites([]);
+        setBatchDrawerVisible(false);
 
         switch (model) {
             case MapModel.OBSERVER_MODEL:
@@ -244,6 +256,7 @@
             return;
         }
         switchFloor(curFloor);
+        localStorage.setItem('curFloor', JSON.stringify(curFloor));
     }, [curFloor]);
 
     // watch spriteBySettings
@@ -264,10 +277,15 @@
     }, [spriteBySettings])
     const prevSpriteBySettings = prevSpriteBySettingsRef.current;
 
+    // watch batchSprites
     React.useEffect(() => {
+        if (!mapContainer) {
+            return;
+        }
         if (batchSprites?.length > 0) {
             setBatchDrawerVisible(true)
         } else {
+            player.clearSelectedSprites();
             setBatchDrawerVisible(false)
         }
     }, [batchSprites])
@@ -284,6 +302,7 @@
                                     model={model}
                                     setModel={setModel}
                                     ModelEnum={MapModel}
+                                    curFloor={curFloor}
                                     curSprite={curSprite}
                                     setCurSPrite={setCurSPrite}
                                     setSpriteBySettings={setSpriteBySettings}
@@ -356,8 +375,9 @@
                 <Content ref={contentRef} className={styles.content}>
                     <div ref={mapRef} />
 
-                    {hasFloor && (
+                    {floorList.length > 0 && (
                         <MapFloor
+                            floorList={floorList}
                             curFloor={curFloor}
                             setCurFloor={setCurFloor}
                         />
@@ -416,6 +436,7 @@
             <MapDrawer
                 open={drawerVisible}
                 curSprite={curSprite}
+                curFloor={curFloor}
                 refCurr={mapRef.current}
                 onCancel={() => {
                     setCurSPrite(null);
@@ -427,8 +448,10 @@
                 open={batchDrawerVisible}
                 batchSprites={batchSprites}
                 refCurr={mapRef.current}
+                model={model}
+                ModelEnum={MapModel}
                 onCancel={() => {
-                    setBatchSprites(null);
+                    setBatchSprites([]);
                     setBatchDrawerVisible(false);
                 }}
             />

--
Gitblit v1.9.1