From 280e039a5ba85fd077acac488efe3ed08ce85f94 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期五, 08 三月 2024 15:57:59 +0800
Subject: [PATCH] #

---
 zy-asrs-flow/src/pages/map/index.jsx |   99 +++++++++++++++++++++++++++++--------------------
 1 files changed, 58 insertions(+), 41 deletions(-)

diff --git a/zy-asrs-flow/src/pages/map/index.jsx b/zy-asrs-flow/src/pages/map/index.jsx
index 09e23b3..00e3809 100644
--- a/zy-asrs-flow/src/pages/map/index.jsx
+++ b/zy-asrs-flow/src/pages/map/index.jsx
@@ -71,6 +71,7 @@
     const [mapContainer, setMapContainer] = React.useState(null);
     const [didClickSprite, setDidClickSprite] = React.useState(false);
     const [spriteBySettings, setSpriteBySettings] = React.useState(null);
+    const prevSpriteBySettingsRef = React.useRef();
 
     // init func
     React.useEffect(() => {
@@ -131,6 +132,7 @@
                 player.activateMapEvent(Utils.MapEvent.SELECTION_BOX);
 
                 Utils.removeSelectedEffect();
+                setSpriteBySettings(null);
                 setSettingsVisible(false);
 
                 mapContainer.children.forEach(child => {
@@ -156,12 +158,12 @@
     }, [model]);
 
     // Add New Device
-    const onDrop = (sprite, x, y) => {
+    const onDrop = (sprite, type, x, y) => {
         const { mapX, mapY } = Utils.getRealPosition(x, y, mapContainer);
         sprite.x = mapX;
         sprite.y = mapY;
 
-        Utils.initSprite(sprite);
+        Utils.initSprite(sprite, type);
         mapContainer.addChild(sprite);
         Utils.beMovable(sprite, setDidClickSprite);
     };
@@ -171,9 +173,14 @@
         player.updateDidClickSprite(didClickSprite);
     }, [didClickSprite])
 
+    // watch spriteBySettings
     React.useEffect(() => {
         if (!mapContainer) {
             return;
+        }
+        prevSpriteBySettingsRef.current = spriteBySettings;
+        if (spriteBySettings && prevSpriteBySettings !== spriteBySettings) {
+            Utils.removeSelectedEffect();
         }
         if (spriteBySettings) {
             Utils.showSelectedEffect(spriteBySettings)
@@ -182,8 +189,10 @@
             Utils.removeSelectedEffect();
         }
     }, [spriteBySettings])
+    const prevSpriteBySettings = prevSpriteBySettingsRef.current;
 
     const settingsFinish = () => {
+        setSettingsVisible(false);
         setSpriteBySettings(null);
     }
 
@@ -219,46 +228,53 @@
                     </Row>
                 </Header>
                 <Content ref={contentRef} className={styles.content}>
-                    <div ref={mapRef} style={{ position: "relative" }} />
-
-                    <FloatButton.Group
-                        shape="square"
-                        style={{
-                            left: 35,
-                            bottom: 35
-                        }}
-                    >
-                        <FloatButton
-                            icon={<CompressOutlined />}
-                        />
-                        <FloatButton.BackTop visibilityHeight={0} />
-                    </FloatButton.Group>
-
-                    <FloatButton.Group
-                        hidden={model === MapModel.OBSERVER_MODEL}
-                        trigger="hover"
-                        style={{
-                            right: 35,
-                            bottom: 35
-                        }}
-                        icon={<AppstoreAddOutlined />}
-                    >
-                        <FloatButton
-                            tooltip={<div><FormattedMessage id='map.device.add' defaultMessage='娣诲姞璁惧' /></div>}
-                            icon={<FileAddOutlined />}
-                            onClick={() => {
-                                setDeviceVisible(true);
+                    <div ref={mapRef} style={{ position: "relative" }} >
+                        <FloatButton.Group
+                            shape="square"
+                            style={{
+                                left: 35,
+                                bottom: 35
                             }}
-                        />
-                        <FloatButton
-                            type={model === MapModel.SETTINGS_MODEL ? 'primary' : 'default'}
-                            tooltip={<div><FormattedMessage id='map.device.oper' defaultMessage='鍙傛暟璁剧疆' /></div>}
-                            icon={<SettingOutlined />}
-                            onClick={() => {
-                                setModel(model === MapModel.SETTINGS_MODEL ? MapModel.MOVABLE_MODEL : MapModel.SETTINGS_MODEL)
+                        >
+                            <FloatButton
+                                icon={<CompressOutlined />}
+                            />
+                            <FloatButton.BackTop visibilityHeight={0} />
+                        </FloatButton.Group>
+
+                        <FloatButton.Group
+                            hidden={model === MapModel.OBSERVER_MODEL}
+                            style={{
+                                left: 35,
+                                bottom: window.innerHeight / 2
                             }}
-                        />
-                    </FloatButton.Group>
+                            icon={<AppstoreAddOutlined />}
+                        >
+                            <FloatButton
+                                hidden={model === MapModel.OBSERVER_MODEL}
+                                type={deviceVisible ? 'primary' : 'default'}
+                                tooltip={<div><FormattedMessage id='map.device.add' defaultMessage='娣诲姞璁惧' /></div>}
+                                icon={<FileAddOutlined />}
+                                onClick={() => {
+                                    if (deviceVisible) {
+                                        setDeviceVisible(false);
+                                    } else {
+                                        setDeviceVisible(true);
+                                        setModel(MapModel.MOVABLE_MODEL);
+                                    }
+                                }}
+                            />
+                            <FloatButton
+                                hidden={model === MapModel.OBSERVER_MODEL}
+                                type={model === MapModel.SETTINGS_MODEL ? 'primary' : 'default'}
+                                tooltip={<div><FormattedMessage id='map.device.oper' defaultMessage='鍙傛暟璁剧疆' /></div>}
+                                icon={<SettingOutlined />}
+                                onClick={() => {
+                                    setModel(model === MapModel.SETTINGS_MODEL ? MapModel.MOVABLE_MODEL : MapModel.SETTINGS_MODEL)
+                                }}
+                            />
+                        </FloatButton.Group>
+                    </div>
                 </Content>
             </Layout>
 
@@ -273,12 +289,13 @@
 
             <Settings
                 open={settingsVisible}
+                curSprite={spriteBySettings}
                 onCancel={() => {
                     setSettingsVisible(false);
                     setSpriteBySettings(null);
                 }}
                 refCurr={mapRef.current}
-                onDrop={settingsFinish}
+                onSubmit={settingsFinish}
             />
         </>
     )

--
Gitblit v1.9.1