#
vincentlu
2025-12-15 8b093ec56bd4e5e721bf48ca497efc819691b2bc
zy-acs-flow/src/map/MapPage.jsx
@@ -16,6 +16,7 @@
import Device from "./Device";
import Settings from "./settings";
import Batch from "./batch";
import AreaSettings from "./areaSettings";
import * as Http from './http';
import WebSocketClient from './websocket'
import ConfirmButton from "../page/components/ConfirmButton";
@@ -49,6 +50,7 @@
    const [deviceVisible, setDeviceVisible] = useState(false);
    const [settingsVisible, setSettingsVisible] = useState(false);
    const [batchSelectionVisible, setBatchSelectionVisible] = useState(false);
    const [areaSettingsVisible, setAreaSettingsVisible] = useState(false);
    const [areaDrawing, setAreaDrawing] = useState(false);
    const [curSprite, setCurSprite] = useState(null);
@@ -133,6 +135,9 @@
        setDeviceVisible(false);
        setSettingsVisible(false);
        setBatchSelectionVisible(false);
        setAreaSettingsVisible(false);
        setAreaDrawing(false);
        Tool.cancelAreaDrawing();
        setCurSprite(null);
        setBatchSprites([]);
@@ -219,12 +224,13 @@
            }
            if (mode === MAP_MODE.AREA_MODE) {
                Tool.showSelectedEffect(curSprite);
                setSettingsVisible(true);
                setAreaSettingsVisible(true);
            }
        } else {
            Tool.removeSelectedEffect();
            setInsightVisible(false);
            setSettingsVisible(false);
            setAreaSettingsVisible(false);
        }
    }, [curSprite]);
@@ -361,12 +367,16 @@
                            sx={{}}
                            disabled={areaDrawing}
                            onClick={() => {
                                setCurSprite(null);
                                const started = Tool.startAreaDrawing({
                                    promptText: translate('page.map.prompt.areaName'),
                                    onComplete: ({ name, start, end, color }) => {
                                    onComplete: ({ name, start, end, color, graphics }) => {
                                        if (name) {
                                            Http.saveAreaData(curZone, { name, start, end, color });
                                            notify.success(translate('page.map.msg.areaCreated', { name }));
                                            Http.saveAreaData(curZone, { name, start, end, color }).then((savedArea) => {
                                                if (savedArea?.id && graphics?.data) {
                                                    graphics.data.id = savedArea.id;
                                                }
                                            });
                                        }
                                    },
                                    onFinish: () => {
@@ -529,6 +539,16 @@
                width={570}
            />
            <AreaSettings
                open={areaSettingsVisible}
                onCancel={() => {
                    setCurSprite(null);
                }}
                sprite={curSprite}
                setSpriteSettings={setCurSprite}
                width={570}
            />
        </Box>
    );
}