From d835d1b51f832889929cdf69010034a30ef44d02 Mon Sep 17 00:00:00 2001
From: Junjie <xjj@123>
Date: 星期四, 17 十月 2024 13:57:29 +0800
Subject: [PATCH] #

---
 zy-asrs-flow/src/pages/map/index.jsx |   63 +++++++++++++++++++++++++++++--
 1 files changed, 59 insertions(+), 4 deletions(-)

diff --git a/zy-asrs-flow/src/pages/map/index.jsx b/zy-asrs-flow/src/pages/map/index.jsx
index 03d7388..8407a6d 100644
--- a/zy-asrs-flow/src/pages/map/index.jsx
+++ b/zy-asrs-flow/src/pages/map/index.jsx
@@ -1,20 +1,21 @@
 import * as React from 'react'
-import * as PIXI from 'pixi.js';
+import * as TWEEDLE from 'tweedle.js';
 import { FormattedMessage, useIntl, useModel } from '@umijs/max';
-import { Layout, Button, Flex, Row, Col, FloatButton, Select, notification, Segmented } from 'antd';
+import { Layout, Button, Flex, Row, Col, FloatButton, Select, notification, Segmented, message, Popconfirm } from 'antd';
 const { Header, Content } = Layout;
 import {
     AppstoreAddOutlined,
     FileAddOutlined,
     CompressOutlined,
     SettingOutlined,
-    CloseOutlined
 } from '@ant-design/icons';
 import './index.css'
 import { createStyles } from 'antd-style';
 import Edit from './components/device';
+import Http from '@/utils/http';
 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 +61,7 @@
     SETTINGS_MODEL: "3",
 })
 
-let player;
+let player, websocket;
 
 const Map = () => {
     const intl = useIntl();
@@ -90,6 +91,7 @@
         const storedValue = localStorage.getItem('curFloor');
         return storedValue !== null ? JSON.parse(storedValue) : null;
     });
+    const curFloorRef = React.useRef(curFloor);
     const [batchSprites, setBatchSprites] = React.useState([]);
     const [batchDrawerVisible, setBatchDrawerVisible] = React.useState(false);
 
@@ -102,6 +104,12 @@
             Utils.syncApp(player.app);
             Utils.syncMapContainer(player.mapContainer);
             Utils.syncNotify(notify);
+
+            websocket = new WebSocketClient('/ws/map/websocket');
+            websocket.connect();
+            websocket.onMessage = (data) => {
+                Utils.updateMapStatusInRealTime(data, () => curFloorRef.current, setCurSPrite);
+            }
 
             const handleResize = () => {
                 setWindowSize({
@@ -124,6 +132,13 @@
             }, 200)
         }
         initialize();
+
+        return () => {
+            websocket.onMessage = (data) => { }
+            if (websocket) {
+                websocket.close();
+            }
+        }
     }, []);
 
     // resize
@@ -235,6 +250,29 @@
     }, [curSprite]);
     const prevCurSprite = prevCurSpriteRef.current;
 
+    const clearLockPathConfirm = (e) => {
+        clearLockPath(curFloor);
+    };
+
+    const clearLockPath = async (floor) => {
+        const hide = message.loading(intl.formatMessage({ id: 'page.clearing', defaultMessage: '姝ｅ湪娓呯┖' }));
+        try {
+            const resp = await Http.doGet('api/map/clearLockPath', { lev: floor });
+            if (resp.code === 200) {
+                message.success(intl.formatMessage({ id: 'page.clearing.success', defaultMessage: '娓呯┖鎴愬姛' }));
+                return true;
+            } else {
+                message.error(resp.msg);
+                return false;
+            }
+        } catch (error) {
+            message.error(intl.formatMessage({ id: 'page.clearing.fail', defaultMessage: '娓呯┖澶辫触璇烽噸璇曪紒' }));
+            return false;
+        } finally {
+            hide();
+        }
+    }
+
     // fn switch floor
     const switchFloor = async (floor) => {
         await Utils.fetchMapData(floor);
@@ -248,6 +286,7 @@
 
     // watch curFloor
     React.useEffect(() => {
+        curFloorRef.current = curFloor;
         if (!mapContainer && !dataFetched) {
             return;
         }
@@ -310,6 +349,22 @@
 
                                 {model === MapModel.OBSERVER_MODEL && (
                                     <>
+                                        <Popconfirm
+                                            title="娓呯┖璺緞"
+                                            description="姝ゆ搷浣滃彲鑳藉鑷村皬杞︾鎾烇紝纭娓呯┖璺緞鍚楋紵"
+                                            onConfirm={clearLockPathConfirm}
+                                            okText="纭"
+                                            cancelText="鍙栨秷"
+                                        >
+                                            <Button
+                                                className='map-header-button'
+                                                size={'large'}
+                                            >
+                                                <FormattedMessage id='map.clearLockPath' defaultMessage='娓呯┖璺緞' />
+                                            </Button>
+                                        </Popconfirm>
+
+
                                         <Button
                                             className='map-header-button'
                                             size={'large'}

--
Gitblit v1.9.1