From 7f70cb15d035f0c233b9e62b9e43aa985317c908 Mon Sep 17 00:00:00 2001
From: luxiaotao1123 <t1341870251@163.com>
Date: 星期一, 04 十一月 2024 10:22:45 +0800
Subject: [PATCH] #

---
 zy-acs-flow/src/map/header/MapSearch.jsx |   69 ++++++++++++++++++++--------------
 1 files changed, 40 insertions(+), 29 deletions(-)

diff --git a/zy-acs-flow/src/map/header/MapSearch.jsx b/zy-acs-flow/src/map/header/MapSearch.jsx
index 0adc126..6d473b1 100644
--- a/zy-acs-flow/src/map/header/MapSearch.jsx
+++ b/zy-acs-flow/src/map/header/MapSearch.jsx
@@ -1,4 +1,3 @@
-// MapSearch.js
 import React, { useState, useEffect } from 'react';
 import {
     Select,
@@ -19,10 +18,10 @@
 const deviceTypeSelectOptionsFn = (translate) => {
     const deviceTypes = [
         { key: DEVICE_TYPE.SHELF, id: 'page.map.devices.shelf' },
-        { key: DEVICE_TYPE.STATION, id: 'page.map.devices.station' },
         { key: DEVICE_TYPE.AGV, id: 'page.map.devices.agv' },
+        { key: DEVICE_TYPE.STATION, id: 'page.map.devices.station' },
         { key: DEVICE_TYPE.POINT, id: 'page.map.devices.point' },
-        // 娣诲姞鍏朵粬璁惧绫诲瀷
+        // ... other devices
     ];
 
     return deviceTypes.map(({ key, id }) => ({
@@ -35,9 +34,10 @@
     const {
         mode,
         setMode,
+        dataFetched,
         curZone,
+        curSprite,
         setCurSprite,
-        setSpriteSettings,
     } = props;
 
     const theme = useTheme();
@@ -59,11 +59,16 @@
     };
 
     useEffect(() => {
-        if (!Tool.getMapContainer()) return;
-        setTimeout(() => {
+        if (dataFetched) {
             resetSearch();
-        }, 200);
-    }, [curDeviceType, curZone]);
+        }
+    }, [curDeviceType, dataFetched, curZone]);
+
+    useEffect(() => {
+        if (!curSprite) {
+            resetSearch();
+        }
+    }, [curSprite]);
 
     useEffect(() => {
         if (!Tool.getMapContainer()) return;
@@ -84,19 +89,17 @@
             Tool.focusSprite(selectSprite);
         }
         switch (mode) {
-            case MAP_MODE.OBSERVER_MODE:
-                setCurSprite(selectSprite);
-                break;
+            // case MAP_MODE.OBSERVER_MODE:
+            // case MAP_MODE.SETTINGS_MODE:
+            //     break;
             case MAP_MODE.MOVABLE_MODE:
                 setMode(MAP_MODE.SETTINGS_MODE);
                 setTimeout(() => {
-                    setSpriteSettings(selectSprite);
+                    setCurSprite(selectSprite);
                 }, 200);
                 break;
-            case MAP_MODE.SETTINGS_MODE:
-                setSpriteSettings(selectSprite);
-                break;
             default:
+                setCurSprite(selectSprite);
                 break;
         }
     };
@@ -119,7 +122,7 @@
     };
 
     return (
-        <Stack direction="row" spacing={2} alignItems="center">
+        <Stack direction="row" spacing={1} alignItems="center">
             <Select
                 variant="outlined"
                 size="small"
@@ -139,18 +142,21 @@
                 size="small"
                 options={filterDeviceList}
                 getOptionLabel={(option) => option.value}
-                renderOption={(props, option) => (
-                    <li {...props}>
-                        <Stack direction="row" justifyContent="space-between" width="100%">
-                            <Typography variant="body1" fontWeight="bold">
-                                {option.label}
-                            </Typography>
-                            <Typography variant="body2" color="text.secondary">
-                                {option.uuid}
-                            </Typography>
-                        </Stack>
-                    </li>
-                )}
+                renderOption={(optionProps, option) => {
+                    const { key, ...otherProps } = optionProps;
+                    return (
+                        <li key={option.uuid} {...otherProps}>
+                            <Stack direction="row" justifyContent="space-between" width="100%">
+                                <Typography variant="body1" fontWeight="bold">
+                                    {option.label}
+                                </Typography>
+                                <Typography variant="body2" color="text.secondary">
+                                    {option.uuid}
+                                </Typography>
+                            </Stack>
+                        </li>
+                    )
+                }}
                 renderInput={(params) => (
                     <TextField
                         {...params}
@@ -168,6 +174,7 @@
                                                 onClick={() => {
                                                     setInputValue('');
                                                     setSelectedOption(null);
+                                                    setCurSprite(null);
                                                 }}
                                             >
                                                 <CloseIcon fontSize="small" />
@@ -177,7 +184,10 @@
                                 </>
                             ),
                         }}
-                        sx={{ minWidth: 360 }}
+                        sx={{
+                            minWidth: 360,
+                            marginBottom: '7px',
+                        }}
                     />
                 )}
                 value={selectedOption}
@@ -189,6 +199,7 @@
                 onInputChange={(event, newInputValue) => {
                     setInputValue(newInputValue);
                 }}
+                disableClearable
             />
         </Stack>
     );

--
Gitblit v1.9.1