@fleet-frontend/mower-maps 0.2.0-beta.5 → 0.2.0-beta.7

package/dist/index.esm.js

@@ -2,7 +2,6 @@ import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import * as React from 'react';
 import React__default, { memo, useMemo, useEffect, useState, useRef, useCallback, createContext, useContext, forwardRef, useImperativeHandle, useLayoutEffect } from 'react';
 import ReactDOM from 'react-dom';
-import { Modal, message, Popover, Input, Switch, Slider, Radio, Button, DatePicker, Select, Space } from 'antd';
 
 /**
  * 常量和枚举类型定义
@@ -194,7 +193,7 @@ class ObstacleData extends BaseData {
         const convertedPoints = convertPointsFormat(originalData?.points) || [];
         super(originalData?.id, DataType.OBSTACLE, level, RenderType.POLYGON, convertedPoints, originalData);
         this.area = originalData?.area;
-        this.status = originalData?.status || 1;
+        this.status = originalData?.status ?? 1;
         this.start_timestamp = originalData?.start_timestamp;
         this.end_timestamp = originalData?.end_timestamp;
         this.name = originalData?.name || 'Obstacle';
@@ -1315,60 +1314,6 @@ function calculatePerpendicularFoot(point, lineStart, lineEnd) {
 function isFootOnSegment(foot) {
     return foot.param >= 0 && foot.param <= 1;
 }
-/**
- * 计算多边形的面积和周长
- * @param coordinates 多边形顶点坐标数组 [[x1, y1], [x2, y2], ...]
- * @returns 包含面积和周长的对象
- */
-function calculatePolygonAreaAndPerimeter(coordinates) {
-    if (!coordinates || coordinates.length < 3) {
-        return { area: 0, perimeter: 0 };
-    }
-    let area = 0;
-    let perimeter = 0;
-    const n = coordinates.length;
-    // 使用鞋带公式（Shoelace formula）计算面积
-    for (let i = 0; i < n; i++) {
-        const j = (i + 1) % n;
-        const [x1, y1] = coordinates[i];
-        const [x2, y2] = coordinates[j];
-        // 面积计算（鞋带公式）
-        area += x1 * y2 - x2 * y1;
-        // 周长计算（累加每条边的长度）
-        const dx = x2 - x1;
-        const dy = y2 - y1;
-        perimeter += Math.sqrt(dx * dx + dy * dy);
-    }
-    // 面积取绝对值并除以2
-    area = Math.abs(area) / 2;
-    return {
-        area,
-        perimeter
-    };
-}
-/**
- * 计算矩形的长和宽
- * @param points 矩形的4个顶点坐标 [[x1, y1], [x2, y2], [x3, y3], [x4, y4]]
- * @returns 包含宽和高的数组 [width, height]
- */
-function calculateRectangleDimensions(points) {
-    if (!points || points.length !== 4) {
-        return [0, 0];
-    }
-    // 计算每条边的长度
-    const sides = [
-        Math.sqrt(Math.pow(points[1][0] - points[0][0], 2) + Math.pow(points[1][1] - points[0][1], 2)), // 0->1
-        Math.sqrt(Math.pow(points[2][0] - points[1][0], 2) + Math.pow(points[2][1] - points[1][1], 2)), // 1->2  
-        Math.sqrt(Math.pow(points[3][0] - points[2][0], 2) + Math.pow(points[3][1] - points[2][1], 2)), // 2->3
-        Math.sqrt(Math.pow(points[0][0] - points[3][0], 2) + Math.pow(points[0][1] - points[3][1], 2)) // 3->0
-    ];
-    // 矩形的对边应该相等，所以我们取相邻的两条边作为宽和高
-    // sides[0] 和 sides[2] 是对边，sides[1] 和 sides[3] 是对边
-    const width = sides[0]; // 第一条边
-    const height = sides[1]; // 相邻的第二条边
-    // 返回宽和高的数组 [width, height] - 小的作为宽，大的作为高
-    return width <= height ? [width, height] : [height, width];
-}
 
 /**
  * 按Python逻辑创建路径段：根据连续的两点之间的关系确定线段类型
@@ -2116,52 +2061,6 @@ function convertHeightsetToParams(value) {
         cuttingHeight: value,
     };
 }
-function getDefaultAngle(recBaseAngle) {
-    if (recBaseAngle > -15 && recBaseAngle <= 15) {
-        return recBaseAngle;
-    }
-    else if (recBaseAngle > 15 && recBaseAngle <= 45) {
-        return recBaseAngle - 30;
-    }
-    else if (recBaseAngle > 45 && recBaseAngle <= 75) {
-        return recBaseAngle - 60;
-    }
-    else if (recBaseAngle > 75 && recBaseAngle <= 90) {
-        return recBaseAngle - 90;
-    }
-    else if (recBaseAngle > -90 && recBaseAngle <= -75) {
-        return recBaseAngle + 90;
-    }
-    else if (recBaseAngle > -75 && recBaseAngle <= -45) {
-        return recBaseAngle + 60;
-    }
-    else if (recBaseAngle > -45 && recBaseAngle <= -15) {
-        return recBaseAngle + 30;
-    }
-}
-function getSelectAngles(value) {
-    const A = 1 << 0; // bit0 = 1
-    const B = 1 << 1; // bit1 = 2
-    const C = 1 << 2; // bit2 = 4
-    const D = 1 << 3; // bit3 = 8
-    const E = 1 << 4; // bit4 = 16
-    const F = 1 << 5; // bit5 = 32
-    const directions = [];
-    // 检查每个位标志是否被设置
-    if (value & A)
-        directions.push(0, 180);
-    if (value & B)
-        directions.push(30, -150);
-    if (value & C)
-        directions.push(60, -120);
-    if (value & D)
-        directions.push(90, -90);
-    if (value & E)
-        directions.push(120, -60);
-    if (value & F)
-        directions.push(150, -30);
-    return directions;
-}
 
 /** Detect free variable `global` from Node.js. */
 var freeGlobal$2 = typeof global == 'object' && global && global.Object === Object && global;
@@ -5074,18 +4973,6 @@ function convertAreaByUnits(area, type = UnitsType.Metric) {
         unit: UnitsAreaType.ACRE,
     };
 }
-// 割草高度的转化
-function convertCutHeightFormatted(value) {
-    return (Math.ceil(value * 0.03937 * 10) * 0.1).toFixed(1);
-}
-function getHeightUnit(unit) {
-    return unit === UnitsType.Metric ? 'mm' : 'inch';
-}
-function generateHeightStr(value, unit, hasUnit = false) {
-    const unitStr = getHeightUnit(unit);
-    const height = unit === UnitsType.Metric ? value : convertCutHeightFormatted(value || 0);
-    return hasUnit ? `${height} ${unitStr}` : value;
-}
 
 /**
  * 日期时间格式化工具函数
@@ -8692,12 +8579,12 @@ function styleInject(css, ref) {
   }
 }
 
-var css_248z$i = ".index-module_edit__-5VvX {\n  position: absolute;\n  top: 0px;\n  left: 0px;\n  width: 100%;\n  height: 100%;\n  pointer-events: auto;\n  z-index: 1000;\n  cursor: move;\n  touch-action: none;\n  user-select: none;\n  -webkit-tap-highlight-color: transparent;\n}\n.index-module_edit__-5VvX .index-module_border__JdNLM {\n  position: absolute;\n  inset: -10px;\n  border: 2px dashed rgb(241, 102, 41);\n  border-radius: 2px;\n  pointer-events: none;\n}\n.index-module_edit__-5VvX .index-module_drag__uvdPG {\n  position: absolute;\n  inset: -10px;\n  border-radius: 2px;\n}\n.index-module_edit__-5VvX .index-module_rotate__H-KIZ {\n  position: absolute;\n  top: -20px;\n  right: -20px;\n  width: 20px;\n  height: 20px;\n  cursor: grab;\n  z-index: 1001;\n  pointer-events: auto;\n}\n.index-module_edit__-5VvX .index-module_move__mZF8s {\n  position: absolute;\n  bottom: -20px;\n  left: -20px;\n  width: 20px;\n  height: 20px;\n  cursor: move;\n  z-index: 1001;\n  pointer-events: auto;\n}";
-var styles$i = {"edit":"index-module_edit__-5VvX","border":"index-module_border__JdNLM","drag":"index-module_drag__uvdPG","rotate":"index-module_rotate__H-KIZ","move":"index-module_move__mZF8s"};
-styleInject(css_248z$i);
+var css_248z$6 = ".index-module_edit__-5VvX {\n  position: absolute;\n  top: 0px;\n  left: 0px;\n  width: 100%;\n  height: 100%;\n  pointer-events: auto;\n  z-index: 1000;\n  cursor: move;\n  touch-action: none;\n  user-select: none;\n  -webkit-tap-highlight-color: transparent;\n}\n.index-module_edit__-5VvX .index-module_border__JdNLM {\n  position: absolute;\n  inset: -10px;\n  border: 2px dashed rgb(241, 102, 41);\n  border-radius: 2px;\n  pointer-events: none;\n}\n.index-module_edit__-5VvX .index-module_drag__uvdPG {\n  position: absolute;\n  inset: -10px;\n  border-radius: 2px;\n}\n.index-module_edit__-5VvX .index-module_rotate__H-KIZ {\n  position: absolute;\n  top: -20px;\n  right: -20px;\n  width: 20px;\n  height: 20px;\n  cursor: grab;\n  z-index: 1001;\n  pointer-events: auto;\n}\n.index-module_edit__-5VvX .index-module_move__mZF8s {\n  position: absolute;\n  bottom: -20px;\n  left: -20px;\n  width: 20px;\n  height: 20px;\n  cursor: move;\n  z-index: 1001;\n  pointer-events: auto;\n}";
+var styles$6 = {"edit":"index-module_edit__-5VvX","border":"index-module_border__JdNLM","drag":"index-module_drag__uvdPG","rotate":"index-module_rotate__H-KIZ","move":"index-module_move__mZF8s"};
+styleInject(css_248z$6);
 
 const RotateHandle = ({ onRotateStart, isRotating }) => {
-    return (jsx("div", { className: styles$i.rotate, onMouseDown: (e) => onRotateStart(e), onTouchStart: (e) => onRotateStart(e), style: { cursor: isRotating ? 'grabbing' : 'grab' }, dangerouslySetInnerHTML: { __html: DEFAULT_ROTATE_ICON } }));
+    return (jsx("div", { className: styles$6.rotate, onMouseDown: (e) => onRotateStart(e), onTouchStart: (e) => onRotateStart(e), style: { cursor: isRotating ? 'grabbing' : 'grab' }, dangerouslySetInnerHTML: { __html: DEFAULT_ROTATE_ICON } }));
 };
 
 /**
@@ -8769,7 +8656,7 @@ const DragHandle = ({ onDragStart, isDragging }) => {
     if (!isMobileDevice()) {
         return null;
     }
-    return (jsx("div", { className: styles$i.move, onMouseDown: (e) => {
+    return (jsx("div", { className: styles$6.move, onMouseDown: (e) => {
             console.log('down');
             onDragStart(e);
         }, onTouchStart: (e) => onDragStart(e), onMouseUp: (e) => {
@@ -8803,7 +8690,7 @@ const MapDrag = ({ map: _map, dragCallbacks, onBoundaryLabelsCollapse, onTransfo
     if (!isDragMap) {
         return null;
     }
-    return (jsxs("div", { ref: containerRef, className: styles$i.edit, style: { cursor: isDragging ? 'grabbing' : 'move' }, children: [jsx("div", { className: styles$i.border }), jsx(RotateHandle, { onRotateStart: handleRotateStart, isRotating: isRotating }), jsx("div", { className: styles$i.drag, onMouseDown: handleDragStartEvent, onTouchStart: handleDragStartEvent }), jsx(DragHandle, { onDragStart: handleDragStartEvent, isDragging: isDragging })] }));
+    return (jsxs("div", { ref: containerRef, className: styles$6.edit, style: { cursor: isDragging ? 'grabbing' : 'move' }, children: [jsx("div", { className: styles$6.border }), jsx(RotateHandle, { onRotateStart: handleRotateStart, isRotating: isRotating }), jsx("div", { className: styles$6.drag, onMouseDown: handleDragStartEvent, onTouchStart: handleDragStartEvent }), jsx(DragHandle, { onDragStart: handleDragStartEvent, isDragging: isDragging })] }));
 };
 
 /**
@@ -14527,9 +14414,9 @@ const SvgMapComponent = forwardRef(({ editMap, rotate, mapData, pathData, modelT
 // 设置显示名称以便调试
 SvgMapComponent.displayName = 'SvgMapComponent';
 
-var css_248z$h = ".index-module_mowerPosition__yLpIU {\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n}";
-var styles$h = {"mowerPosition":"index-module_mowerPosition__yLpIU"};
-styleInject(css_248z$h);
+var css_248z$5 = ".index-module_mowerPosition__yLpIU {\n  position: absolute;\n  top: 0;\n  left: 0;\n  bottom: 0;\n  right: 0;\n  width: 100%;\n  height: 100%;\n}";
+var styles$5 = {"mowerPosition":"index-module_mowerPosition__yLpIU"};
+styleInject(css_248z$5);
 
 const usePosition = ({ mowerPositionData, viewBox, modelType, hasEdger, mapData, realTimeData, onMowingPositionChange, }) => {
     // DOM 元素引用，用于直接操作
@@ -14755,7 +14642,7 @@ const MowerPosition = React__default.memo(({ editMap, mowerPositionData, viewBox
         pointerEvents: 'none',
         zIndex: 1000,
     }), []);
-    return (jsx("div", { className: styles$h.mowerPosition, style: containerStyle, children: jsx("div", { ref: elementRef, className: "mower-position", style: {
+    return (jsx("div", { className: styles$5.mowerPosition, style: containerStyle, children: jsx("div", { ref: elementRef, className: "mower-position", style: {
                 position: 'absolute',
                 width: 30,
                 height: 30,
@@ -14824,9 +14711,9 @@ const CharginPile = React__default.memo(({ mapData, mapConfig = {}, viewBox, rot
             }, children: jsx("img", { src: item.imageSrc, style: { width: '100%', height: '100%', objectFit: 'contain', opacity: 1 } }) }, `pile-${idx}`))) }));
 });
 
-var css_248z$g = ".index-module_container__7IatW {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n}\n\n.index-module_boundaryLabel__GDHFn {\n  position: absolute;\n  background-color: rgba(30, 30, 31, 0.6);\n  color: rgb(255, 255, 255);\n  padding: 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: bold;\n  max-width: 220px;\n  pointer-events: auto;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);\n  cursor: pointer;\n  user-select: none;\n  white-space: nowrap;\n}\n\n.index-module_base__qy2SG {\n  font-size: 14px;\n}\n\n.index-module_extended__0TMAt {\n  margin-top: 6px;\n  font-size: 11px;\n  opacity: 0.9;\n  border-top: 1px solid rgba(255, 255, 255, 0.2);\n  padding-top: 6px;\n}";
-var styles$g = {"container":"index-module_container__7IatW","boundaryLabel":"index-module_boundaryLabel__GDHFn","base":"index-module_base__qy2SG","extended":"index-module_extended__0TMAt"};
-styleInject(css_248z$g);
+var css_248z$4 = ".index-module_container__7IatW {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n}\n\n.index-module_boundaryLabel__GDHFn {\n  position: absolute;\n  background-color: rgba(30, 30, 31, 0.6);\n  color: rgb(255, 255, 255);\n  padding: 6px;\n  border-radius: 12px;\n  font-size: 12px;\n  font-weight: bold;\n  max-width: 220px;\n  pointer-events: auto;\n  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);\n  cursor: pointer;\n  user-select: none;\n  white-space: nowrap;\n}\n\n.index-module_base__qy2SG {\n  font-size: 14px;\n}\n\n.index-module_extended__0TMAt {\n  margin-top: 6px;\n  font-size: 11px;\n  opacity: 0.9;\n  border-top: 1px solid rgba(255, 255, 255, 0.2);\n  padding-top: 6px;\n}";
+var styles$4 = {"container":"index-module_container__7IatW","boundaryLabel":"index-module_boundaryLabel__GDHFn","base":"index-module_base__qy2SG","extended":"index-module_extended__0TMAt"};
+styleInject(css_248z$4);
 
 const useBoundaryLabels = ({ mapData, pathData, unitType, viewBox, mowPartitionData, realTimeData = [], }) => {
     const [processStateIsMowing, updateProcessStateIsMowing] = useState(false);
@@ -14980,7 +14867,7 @@ const BoundaryLabels = React__default.memo(({ editMap, mapData, pathData, unitTy
         zIndex: expandedId != null ? 9999 : containerZIndex,
         display: editMap ? 'none' : 'block',
     }), [containerZIndex, expandedId, editMap]);
-    return (jsx("div", { className: styles$g.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `${styles$g.boundaryLabel} boundary-label`, "data-boundary-id": item.id, style: {
+    return (jsx("div", { className: styles$4.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `${styles$4.boundaryLabel} boundary-label`, "data-boundary-id": item.id, style: {
                 transform: `translate(-50%, -50%) rotate(${-rotation}deg)`,
                 left: `${item.leftPct}%`,
                 top: `${item.topPct}%`,
@@ -14990,12 +14877,12 @@ const BoundaryLabels = React__default.memo(({ editMap, mapData, pathData, unitTy
                 if (onlyRead)
                     return;
                 handleClick(item.id);
-            }, children: [jsx("div", { className: styles$g.base, children: item.baseText }), jsxs("div", { className: styles$g.extended, style: { display: expandedId === item.id ? 'block' : 'none' }, children: [jsx("div", { style: { marginBottom: 3, fontWeight: 'bold' }, children: item.coverageText }), jsx("div", { children: item.dateText })] })] }, item.id))) }));
+            }, children: [jsx("div", { className: styles$4.base, children: item.baseText }), jsxs("div", { className: styles$4.extended, style: { display: expandedId === item.id ? 'block' : 'none' }, children: [jsx("div", { style: { marginBottom: 3, fontWeight: 'bold' }, children: item.coverageText }), jsx("div", { children: item.dateText })] })] }, item.id))) }));
 });
 
-var css_248z$f = ".index-module_container__gB52e {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n}\n\n.index-module_item__zHoZP {\n  position: absolute;\n  pointer-events: auto;\n}\n\n.index-module_icon__CS56A {\n  position: relative;\n  width: 24px;\n  height: 24px;\n  cursor: pointer;\n  transition: transform 0.2s ease;\n}\n\n.index-module_tooltip__NMCmR {\n  position: absolute;\n  bottom: 40px;\n  left: 0;\n  background-color: rgb(247, 251, 255);\n  color: rgb(65, 93, 116);\n  padding: 10px;\n  border-radius: 16px;\n  font-size: 14px;\n  text-align: left;\n}";
-var styles$f = {"container":"index-module_container__gB52e","item":"index-module_item__zHoZP","icon":"index-module_icon__CS56A","tooltip":"index-module_tooltip__NMCmR"};
-styleInject(css_248z$f);
+var css_248z$3 = ".index-module_container__gB52e {\n  position: absolute;\n  top: 0;\n  left: 0;\n  width: 100%;\n  height: 100%;\n  pointer-events: none;\n}\n\n.index-module_item__zHoZP {\n  position: absolute;\n  pointer-events: auto;\n}\n\n.index-module_icon__CS56A {\n  position: relative;\n  width: 24px;\n  height: 24px;\n  cursor: pointer;\n  transition: transform 0.2s ease;\n}\n\n.index-module_tooltip__NMCmR {\n  position: absolute;\n  bottom: 40px;\n  left: 0;\n  background-color: rgb(247, 251, 255);\n  color: rgb(65, 93, 116);\n  padding: 10px;\n  border-radius: 16px;\n  font-size: 14px;\n  text-align: left;\n}";
+var styles$3 = {"container":"index-module_container__gB52e","item":"index-module_item__zHoZP","icon":"index-module_icon__CS56A","tooltip":"index-module_tooltip__NMCmR"};
+styleInject(css_248z$3);
 
 const useAntennaInfo = (data = [], options = {}) => {
     const { viewBox } = options;
@@ -15104,13 +14991,13 @@ const Antennas = React__default.memo(({ editMap, antennaConfig = [], viewBox, ro
         document.addEventListener('pointerdown', handleOutside);
         return () => document.removeEventListener('pointerdown', handleOutside);
     }, []);
-    return (jsx("div", { className: styles$f.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `antenna-container-item ${styles$f.item}`, style: {
+    return (jsx("div", { className: styles$3.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `antenna-container-item ${styles$3.item}`, style: {
                 left: `${item.leftPct}%`,
                 top: `${item.topPct}%`,
                 transform: `translate(calc(-50% + ${item.offsetX || 0}px), calc(-50% + ${item.offsetY || 0}px)) rotate(${-rotation}deg)`,
                 zIndex: openType === item.type ? 10000 : containerZIndex,
                 pointerEvents: onlyRead ? 'none' : 'auto',
-            }, children: [jsx("div", { className: `antenna vector-antenna antenna-${item.type} ${item.isOnline ? 'antenna-online' : 'antenna-offline'} ${styles$f.icon}`, style: {}, onClick: (e) => {
+            }, children: [jsx("div", { className: `antenna vector-antenna antenna-${item.type} ${item.isOnline ? 'antenna-online' : 'antenna-offline'} ${styles$3.icon}`, style: {}, onClick: (e) => {
                         e.stopPropagation();
                         if (onlyRead)
                             return;
@@ -15125,7 +15012,7 @@ const Antennas = React__default.memo(({ editMap, antennaConfig = [], viewBox, ro
                             return;
                         e.currentTarget.style.transform =
                             'scale(1)';
-                    }, children: jsx("img", { src: item.imageSrc, style: { width: '100%', height: '100%', objectFit: 'contain', opacity: 1 } }) }), jsxs("div", { className: styles$f.tooltip, style: {
+                    }, children: jsx("img", { src: item.imageSrc, style: { width: '100%', height: '100%', objectFit: 'contain', opacity: 1 } }) }), jsxs("div", { className: styles$3.tooltip, style: {
                         display: openType === item.type ? 'block' : 'none',
                         minWidth: item.tooltip.minWidth,
                     }, children: [jsx("div", { style: { marginBottom: 4, fontWeight: 600 }, children: item.tooltip.title }), jsxs("div", { style: { color: 'rgba(65, 93, 116, 1)', fontWeight: 400 }, children: [item.tooltip.statusText, item.tooltip.syncText || ''] })] })] }, `antenna-${item.type}`))) }));
@@ -15189,15 +15076,15 @@ const VertexElement = React__default.memo(({ r, stroke, ...props }) => {
     return (jsx("circle", { r: radius * overlayScale, stroke: stroke || '#fff', fill: '#fff', strokeWidth: 2 * overlayScale, ...props }));
 });
 
-var _path$b;
-function _extends$j() { return _extends$j = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$j.apply(null, arguments); }
-var SvgDelete$1 = function SvgDelete(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$j({
+var _path$2;
+function _extends$6() { return _extends$6 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$6.apply(null, arguments); }
+var SvgDelete = function SvgDelete(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends$6({
     xmlns: "http://www.w3.org/2000/svg",
     width: 16,
     height: 16,
     fill: "none"
-  }, props), _path$b || (_path$b = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$2 || (_path$2 = /*#__PURE__*/React.createElement("path", {
     fill: "#FD494D",
     d: "M6.667 12a.667.667 0 0 0 .666-.667v-4a.667.667 0 1 0-1.333 0v4a.667.667 0 0 0 .667.667m6.666-8h-2.666v-.667a2 2 0 0 0-2-2H7.333a2 2 0 0 0-2 2V4H2.667a.667.667 0 0 0 0 1.333h.666v7.334a2 2 0 0 0 2 2h5.334a2 2 0 0 0 2-2V5.333h.666a.667.667 0 1 0 0-1.333m-6.666-.667a.667.667 0 0 1 .666-.666h1.334a.667.667 0 0 1 .666.666V4H6.667zm4.666 9.334a.667.667 0 0 1-.666.666H5.333a.667.667 0 0 1-.666-.666V5.333h6.666zm-2-.667a.667.667 0 0 0 .667-.667v-4a.667.667 0 0 0-1.333 0v4a.667.667 0 0 0 .666.667"
   })));
@@ -15342,9 +15229,9 @@ const DistanceLabels = ({ coordinates, createMode = false, editMode = false, com
             }), ghostLastDistance && ghostLastMidpoint && (jsx(TextElement, { x: ghostLastMidpoint[0], y: ghostLastMidpoint[1], text: ghostLastDistance })), ghostFirstDistance && ghostFirstMidpoint && (jsx(TextElement, { x: ghostFirstMidpoint[0], y: ghostFirstMidpoint[1], text: ghostFirstDistance }))] }));
 };
 
-var css_248z$e = ".index-module_polygonPathG__S-Bpl {\n  pointer-events: stroke;\n  cursor: pointer;\n}\n\n.index-module_vertex__-Qb1u {\n  cursor: pointer;\n}\n\n.index-module_dragging__xSFdO {\n  cursor: grabbing;\n}\n\n.index-module_createVertex__ldz2E {\n  cursor: crosshair;\n}\n\n.index-module_addVertex__hrF71 {\n  cursor: pointer;\n}\n\n.index-module_polygonPath__PynOn {\n  pointer-events: stroke;\n  cursor: pointer;\n}\n\n.index-module_notCreate__bFnkV {\n  cursor: no-drop;\n}";
-var styles$e = {"polygonPathG":"index-module_polygonPathG__S-Bpl","vertex":"index-module_vertex__-Qb1u","dragging":"index-module_dragging__xSFdO","addVertex":"index-module_addVertex__hrF71","polygonPath":"index-module_polygonPath__PynOn","notCreate":"index-module_notCreate__bFnkV"};
-styleInject(css_248z$e);
+var css_248z$2 = ".index-module_polygonPathG__S-Bpl {\n  pointer-events: stroke;\n  cursor: pointer;\n}\n\n.index-module_vertex__-Qb1u {\n  cursor: pointer;\n}\n\n.index-module_dragging__xSFdO {\n  cursor: grabbing;\n}\n\n.index-module_createVertex__ldz2E {\n  cursor: crosshair;\n}\n\n.index-module_addVertex__hrF71 {\n  cursor: pointer;\n}\n\n.index-module_polygonPath__PynOn {\n  pointer-events: stroke;\n  cursor: pointer;\n}\n\n.index-module_notCreate__bFnkV {\n  cursor: no-drop;\n}";
+var styles$2 = {"polygonPathG":"index-module_polygonPathG__S-Bpl","vertex":"index-module_vertex__-Qb1u","dragging":"index-module_dragging__xSFdO","addVertex":"index-module_addVertex__hrF71","polygonPath":"index-module_polygonPath__PynOn","notCreate":"index-module_notCreate__bFnkV"};
+styleInject(css_248z$2);
 
 var CreateStatus;
 (function (CreateStatus) {
@@ -16067,8 +15954,8 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
     }, [dragState.currentPosition, checkCanNotCreateAtPosition]);
     const generateVertexClassName = useMemo(() => {
         if (!dragState.isDragging)
-            return styles$e.vertex;
-        return showNotCreateCursor ? styles$e.notCreate : styles$e.dragging;
+            return styles$2.vertex;
+        return showNotCreateCursor ? styles$2.notCreate : styles$2.dragging;
     }, [dragState.isDragging, showNotCreateCursor]);
     // 使用 useRef 来存储 requestAnimationFrame ID
     const rafIdRef = useRef(null);
@@ -16246,24 +16133,24 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
                         const nextIndex = (dragState.dragIndex + 1) % coordinates.length;
                         return (jsxs(Fragment, { children: [jsx("line", { x1: coordinates[prevIndex][0], y1: coordinates[prevIndex][1], x2: dragState.originalPosition[0], y2: dragState.originalPosition[1], stroke: strokeColor, strokeWidth: strokeWidth, strokeOpacity: 0.5, strokeDasharray: "5,5", pointerEvents: "none" }), jsx("line", { x1: dragState.originalPosition[0], y1: dragState.originalPosition[1], x2: coordinates[nextIndex][0], y2: coordinates[nextIndex][1], stroke: strokeColor, strokeWidth: strokeWidth, strokeOpacity: 0.5, strokeDasharray: "5,5", pointerEvents: "none" })] }));
                     })()] })), renderCoordinates.length >= 3 && (jsx("polygon", { className: "vector-boundary-fill", points: polygonPoints, fill: fillColor, fillOpacity: fillOpacity, stroke: "none" // 边框透明
-                , onClick: onPolygonClick })), jsxs("g", { className: styles$e.polygonPathG, children: [renderCoordinates.length >= 2 &&
+                , onClick: onPolygonClick })), jsxs("g", { className: styles$2.polygonPathG, children: [renderCoordinates.length >= 2 &&
                         pathSegments.map((segment, index) => {
                             if (segment.points.length < 2)
                                 return null;
                             const pathData = createPathData(segment.points);
                             const isDash = segment.type === 1;
-                            return (jsx("path", { d: pathData, fill: "none", stroke: isDash ? 'none' : strokeColor, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity, strokeLinecap: "round", strokeLinejoin: "round", className: styles$e.polygonPath, vectorEffect: "non-scaling-stroke", onClick: onPathClick }, index));
+                            return (jsx("path", { d: pathData, fill: "none", stroke: isDash ? 'none' : strokeColor, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity, strokeLinecap: "round", strokeLinejoin: "round", className: styles$2.polygonPath, vectorEffect: "non-scaling-stroke", onClick: onPathClick }, index));
                         }), renderCoordinates.length >= 2 &&
                         dashPaths.map((segment, index) => {
                             if (segment.points.length < 2)
                                 return null;
-                            return (jsx(DashPath, { className: styles$e.polygonPath, points: segment.points, stroke: strokeColor, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity }, index));
+                            return (jsx(DashPath, { className: styles$2.polygonPath, points: segment.points, stroke: strokeColor, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity }, index));
                         })] }), (editMode || (createMode && completed)) &&
                 renderCoordinates.length >= 2 &&
                 renderCoordinates.map((coord, index) => {
                     const nextCoord = renderCoordinates[(index + 1) % renderCoordinates.length];
                     const isDashPath = coord[2] === 1;
-                    return (jsx("line", { x1: coord[0], y1: coord[1], x2: nextCoord[0], y2: nextCoord[1], stroke: isDashPath ? 'transparent' : strokeColor, strokeWidth: strokeWidth, className: styles$e.addVertex, vectorEffect: "non-scaling-stroke", ...(platform === PlatformType.H5
+                    return (jsx("line", { x1: coord[0], y1: coord[1], x2: nextCoord[0], y2: nextCoord[1], stroke: isDashPath ? 'transparent' : strokeColor, strokeWidth: strokeWidth, className: styles$2.addVertex, vectorEffect: "non-scaling-stroke", ...(platform === PlatformType.H5
                             ? {
                                 onTouchStart: createReactEventHandler((e) => handleEdgeClick(e, index)),
                             }
@@ -16364,7 +16251,7 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
                                         onVertexDelete(renderCoordinates?.length - 1 - idx);
                                     }
                                     setTooltipIndex(null);
-                                }, style: { cursor: 'pointer' }, children: [jsx("rect", { x: 0, y: -24, width: 20, height: 20, rx: 2, ry: 2, fill: "#fff", strokeWidth: 1, filter: "url(#vertex-tooltip-shadow)" }), jsx("g", { transform: `translate(2, -22)`, children: jsx(SvgDelete$1, {}) })] })), canComplete && (jsx("g", { style: { pointerEvents: 'none' }, transform: `translate(${coord[0] - 5 * overlayScale * 3}, ${coord[1] - 2.5 * overlayScale * 3}) scale(${overlayScale * 3})`, children: jsx("svg", { width: "10", height: "5", viewBox: "0 0 6 5", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M0.5 2.5L1.3452 3.3452C1.71469 3.71469 2.30636 3.73741 2.7031 3.39735L5.5 1", stroke: "#FF7A33", "stroke-linecap": "round" }) }) })
+                                }, style: { cursor: 'pointer' }, children: [jsx("rect", { x: 0, y: -24, width: 20, height: 20, rx: 2, ry: 2, fill: "#fff", strokeWidth: 1, filter: "url(#vertex-tooltip-shadow)" }), jsx("g", { transform: `translate(2, -22)`, children: jsx(SvgDelete, {}) })] })), canComplete && (jsx("g", { style: { pointerEvents: 'none' }, transform: `translate(${coord[0] - 5 * overlayScale * 3}, ${coord[1] - 2.5 * overlayScale * 3}) scale(${overlayScale * 3})`, children: jsx("svg", { width: "10", height: "5", viewBox: "0 0 6 5", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsx("path", { d: "M0.5 2.5L1.3452 3.3452C1.71469 3.71469 2.30636 3.73741 2.7031 3.39735L5.5 1", stroke: "#FF7A33", "stroke-linecap": "round" }) }) })
                             // <rect
                             //   x={coord[0]}
                             //   y={coord[1]}
@@ -16382,7 +16269,7 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
 
 const BoundaryElement = ({ data }) => {
     const style = data.style || {};
-    const { editMapInfo, setEditMapInfo } = useMapEditContext();
+    const { editMapInfo, setEditMapInfo, onSelectElement } = useMapEditContext();
     const { platform } = useCommonContext();
     const currentPoints = useMemo(() => {
         if (editMapInfo?.selectElement?.id === data.id) {
@@ -16404,6 +16291,7 @@ const BoundaryElement = ({ data }) => {
      * 点击边界的回调
      */
     const onPathClick = useCallback(() => {
+        onSelectElement?.(DataType.BOUNDARY);
         if (platform === PlatformType.H5) {
             // 对于地块来说，如果当前有元素是在编辑和创建模式下，则不进行选中
             if (editMapInfo.mobileMode === MobileEditMode.EDIT ||
@@ -16578,7 +16466,7 @@ const ObstacleElement = ({ data }) => {
         if (platform === PlatformType.H5 &&
             editMapInfo?.selectElement?.id === data.id &&
             editMapInfo.mobileMode === MobileEditMode.START) {
-            return (style.lineWidth || 2) * 1.5;
+            return (style.lineWidth || 2) * 3;
         }
         return style.lineWidth || 2;
     }, [platform, style, editMapInfo]);
@@ -17052,15 +16940,15 @@ const useVisionOffTransform = (data, scaleConstraints
     };
 };
 
-var _g$7, _defs$7;
-function _extends$i() { return _extends$i = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$i.apply(null, arguments); }
+var _g$3, _defs$3;
+function _extends$5() { return _extends$5 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$5.apply(null, arguments); }
 var SvgTransformDelete = function SvgTransformDelete(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$i({
+  return /*#__PURE__*/React.createElement("svg", _extends$5({
     xmlns: "http://www.w3.org/2000/svg",
     width: 20,
     height: 20,
     fill: "none"
-  }, props), _g$7 || (_g$7 = /*#__PURE__*/React.createElement("g", {
+  }, props), _g$3 || (_g$3 = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-delete_svg__a)"
   }, /*#__PURE__*/React.createElement("circle", {
     cx: 10,
@@ -17083,7 +16971,7 @@ var SvgTransformDelete = function SvgTransformDelete(props) {
     fill: "#fff",
     rx: 0.8,
     transform: "rotate(45 6.323 5.191)"
-  }))), _defs$7 || (_defs$7 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs$3 || (_defs$3 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-delete_svg__b",
     x1: 17.727,
     x2: -1.215,
@@ -17103,15 +16991,15 @@ var SvgTransformDelete = function SvgTransformDelete(props) {
   })))));
 };
 
-var _g$6, _defs$6;
-function _extends$h() { return _extends$h = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$h.apply(null, arguments); }
+var _g$2, _defs$2;
+function _extends$4() { return _extends$4 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$4.apply(null, arguments); }
 var SvgTransformRotate = function SvgTransformRotate(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$h({
+  return /*#__PURE__*/React.createElement("svg", _extends$4({
     xmlns: "http://www.w3.org/2000/svg",
     width: 21,
     height: 20,
     fill: "none"
-  }, props), _g$6 || (_g$6 = /*#__PURE__*/React.createElement("g", {
+  }, props), _g$2 || (_g$2 = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-rotate_svg__a)"
   }, /*#__PURE__*/React.createElement("path", {
     fill: "url(#transform-rotate_svg__b)",
@@ -17119,7 +17007,7 @@ var SvgTransformRotate = function SvgTransformRotate(props) {
   }), /*#__PURE__*/React.createElement("path", {
     fill: "#fff",
     d: "M11.602 14.719a5.447 5.447 0 0 1-6.608-5.116l-.004-.205a.818.818 0 0 1 1.633-.084l.004.084.01.285a3.81 3.81 0 0 0 2.127 3.137l.26.115a3.8 3.8 0 0 0 2.227.184l.276-.071q.29-.088.561-.219l-1.147-.441a.817.817 0 0 1 .587-1.525l2.54.977a.817.817 0 0 1 .316 1.308l.001.001a5.45 5.45 0 0 1-2.783 1.57M8.623 4.548a5.447 5.447 0 0 1 6.608 5.116l.004.204a.818.818 0 0 1-1.633.084l-.004-.084-.01-.284a3.81 3.81 0 0 0-2.127-3.138l-.26-.115a3.8 3.8 0 0 0-2.227-.184l-.276.072q-.29.087-.561.218l1.147.442a.817.817 0 0 1-.586 1.524l-2.542-.976a.817.817 0 0 1-.315-1.309 5.45 5.45 0 0 1 2.782-1.57"
-  }))), _defs$6 || (_defs$6 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs$2 || (_defs$2 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-rotate_svg__b",
     x1: 17.84,
     x2: -1.103,
@@ -17139,15 +17027,15 @@ var SvgTransformRotate = function SvgTransformRotate(props) {
   })))));
 };
 
-var _g$5, _defs$5;
-function _extends$g() { return _extends$g = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$g.apply(null, arguments); }
+var _g$1, _defs$1;
+function _extends$3() { return _extends$3 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$3.apply(null, arguments); }
 var SvgTransformScale = function SvgTransformScale(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$g({
+  return /*#__PURE__*/React.createElement("svg", _extends$3({
     xmlns: "http://www.w3.org/2000/svg",
     width: 21,
     height: 20,
     fill: "none"
-  }, props), _g$5 || (_g$5 = /*#__PURE__*/React.createElement("g", {
+  }, props), _g$1 || (_g$1 = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-scale_svg__a)"
   }, /*#__PURE__*/React.createElement("path", {
     fill: "url(#transform-scale_svg__b)",
@@ -17155,7 +17043,7 @@ var SvgTransformScale = function SvgTransformScale(props) {
   }), /*#__PURE__*/React.createElement("path", {
     fill: "#fff",
     d: "M5.078 8.265a.8.8 0 0 0 1.6.001v-.544l5.69 5.69h-.494a.8.8 0 0 0 0 1.6l2.474-.002a.8.8 0 0 0 .311-.062.8.8 0 0 0 .49-.738v-2.474a.8.8 0 1 0-1.6 0v.594L7.81 6.59h.544a.8.8 0 0 0 0-1.6H5.879a.8.8 0 0 0-.8.8z"
-  }))), _defs$5 || (_defs$5 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs$1 || (_defs$1 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-scale_svg__b",
     x1: 17.84,
     x2: -1.103,
@@ -17175,15 +17063,15 @@ var SvgTransformScale = function SvgTransformScale(props) {
   })))));
 };
 
-var _g$4, _defs$4;
-function _extends$f() { return _extends$f = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$f.apply(null, arguments); }
+var _g, _defs;
+function _extends$2() { return _extends$2 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$2.apply(null, arguments); }
 var SvgTransformTranslate = function SvgTransformTranslate(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$f({
+  return /*#__PURE__*/React.createElement("svg", _extends$2({
     xmlns: "http://www.w3.org/2000/svg",
     width: 20,
     height: 20,
     fill: "none"
-  }, props), _g$4 || (_g$4 = /*#__PURE__*/React.createElement("g", {
+  }, props), _g || (_g = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-translate_svg__a)"
   }, /*#__PURE__*/React.createElement("circle", {
     cx: 10,
@@ -17193,7 +17081,7 @@ var SvgTransformTranslate = function SvgTransformTranslate(props) {
   }), /*#__PURE__*/React.createElement("path", {
     fill: "#fff",
     d: "M16.18 10.758a.8.8 0 0 0-.105-1.218l-1.66-1.66a.801.801 0 0 0-1.132 1.132l.383.381h-2.96V6.418l.385.386a.8.8 0 1 0 1.131-1.13l-1.75-1.75a.8.8 0 0 0-1.222.11L7.594 5.689a.8.8 0 0 0 1.131 1.13l.381-.38v2.954H6.137l.381-.38a.8.8 0 1 0-1.13-1.132l-1.752 1.75a.8.8 0 0 0 .106 1.22l1.66 1.66a.801.801 0 0 0 1.132-1.133l-.386-.385h2.958v2.972l-.38-.38a.8.8 0 0 0-1.132 1.131l1.751 1.75a.8.8 0 0 0 1.223-.11l1.654-1.655a.8.8 0 1 0-1.13-1.131l-.386.386v-2.963h2.978l-.385.384a.8.8 0 1 0 1.131 1.131z"
-  }))), _defs$4 || (_defs$4 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs || (_defs = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-translate_svg__b",
     x1: 17.727,
     x2: -1.215,
@@ -17868,15 +17756,15 @@ const useDoodleTransform = (data, onTransformChange, options) => {
     };
 };
 
-var _path$a;
-function _extends$e() { return _extends$e = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$e.apply(null, arguments); }
+var _path$1;
+function _extends$1() { return _extends$1 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$1.apply(null, arguments); }
 var SvgTransformArrow = function SvgTransformArrow(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$e({
+  return /*#__PURE__*/React.createElement("svg", _extends$1({
     xmlns: "http://www.w3.org/2000/svg",
     width: 7,
     height: 11,
     fill: "none"
-  }, props), _path$a || (_path$a = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
     fill: "#fff",
     d: "M2.156 1.032a.777.777 0 0 0-1.061 0 .69.69 0 0 0-.062.943l.062.068 3.97 3.78-3.97 3.78a.69.69 0 0 0-.062.944l.062.067c.27.257.696.277.99.06l.07-.06 4.5-4.286a.69.69 0 0 0 .063-.943l-.062-.067z",
     opacity: 0.5
@@ -17972,7 +17860,7 @@ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOpe
             return 0;
         }
         // 保留一位小数
-        return ((currentTime - data.expiration_ts) / (24 * 60 * 60)).toFixed(1);
+        return ((data.expiration_ts - currentTime) / (24 * 60 * 60)).toFixed(1);
     }, [data]);
     // 初始化变换状态
     useEffect(() => {
@@ -18092,6 +17980,7 @@ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOpe
                                 alignItems: 'center',
                                 justifyContent: 'center',
                                 gap: '10px',
+                                color: '#325069',
                             }, children: jsxs("div", { children: ["Remaining Time: ", remainingTime] }) }) }) })] }));
     };
     useEffect(() => {
@@ -18352,7 +18241,6 @@ const DoodleElement = ({ data }) => {
             },
         });
     }, [transformedElements]);
-    console.log('originData--->', originData, minScale);
     return (jsx(DoodleTransformWrapper, { data: originData, onTransformChange: handleTransformChange, isSelected: isSelected, isSelectedWithoutOperation: isSelectedWithoutOperation, onSelect: handleSelect, onCancel: handleCancel, onDragEnd: handleDragEnd, showInfo: platform === PlatformType.H5, onClickInfo: handleClickInfo, minScale: minScale }));
 };
 
@@ -18398,9 +18286,9 @@ const GElement = ({ type, children }) => {
     return jsx("g", { id: `layer-${type}`, children: children }, type);
 };
 
-var css_248z$d = ".index-module_mapEdit__XC5Gw {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 100%;\n  height: 100%;\n  cursor: default;\n}\n.index-module_mapEdit__XC5Gw.index-module_createMode__14EPH {\n  cursor: crosshair;\n}\n.index-module_mapEdit__XC5Gw.index-module_notCreateCursor__1-OjF {\n  cursor: no-drop;\n}";
-var styles$d = {"mapEdit":"index-module_mapEdit__XC5Gw","createMode":"index-module_createMode__14EPH","notCreateCursor":"index-module_notCreateCursor__1-OjF"};
-styleInject(css_248z$d);
+var css_248z$1 = ".index-module_mapEdit__XC5Gw {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 100%;\n  height: 100%;\n  cursor: default;\n}\n.index-module_mapEdit__XC5Gw.index-module_createMode__14EPH {\n  cursor: crosshair;\n}\n.index-module_mapEdit__XC5Gw.index-module_notCreateCursor__1-OjF {\n  cursor: no-drop;\n}";
+var styles$1 = {"mapEdit":"index-module_mapEdit__XC5Gw","createMode":"index-module_createMode__14EPH","notCreateCursor":"index-module_notCreateCursor__1-OjF"};
+styleInject(css_248z$1);
 
 var classnames = {exports: {}};
 
@@ -19399,7 +19287,7 @@ function usePolygonDrawing(options = {}) {
     const [mousePos, setMousePos] = useState(null);
     const { editMapInfo, setEditMapInfo } = useMapEditContext();
     const { checkCanNotCreateAtPosition } = useCheckElement();
-    const { addHistory, clearHistory } = useHistoryHandle();
+    const { addHistory} = useHistoryHandle();
     const points = useMemo(() => {
         console.log('points->', editMapInfo?.selectElement?.points);
         return editMapInfo?.selectElement?.points?.map((item) => ({ x: item[0], y: item[1] })) || [];
@@ -19453,8 +19341,13 @@ function usePolygonDrawing(options = {}) {
             setEditMapInfo({
                 ...editMapInfo,
                 createMode: CreateStatus.COMPLETED,
+                historyList: [
+                    {
+                        selectElement: editMapInfo.selectElement,
+                    },
+                ],
+                currentHistoryIndex: 0,
             });
-            clearHistory();
         }
     }, [points.length, editMapInfo]);
     const reset = useCallback(() => {
@@ -19704,7 +19597,7 @@ const useCreateVisionOffElement = () => {
 
 const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChange }, ref) => {
     const pointManagerRef = useRef(null);
-    const { editMapInfo, setEditMapInfo } = useMapEditContext();
+    const { editMapInfo, setEditMapInfo, onSelectElement } = useMapEditContext();
     const { getVisionOffPoints, centerPoint } = useCreateVisionOffElement();
     const { svgElementDatas } = useSvgEditContext();
     const { checkCanNotCreateAtPosition, checkDoodle } = useCheckElement();
@@ -19722,6 +19615,24 @@ const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChang
     const isCreating = useMemo(() => {
         return editMapInfo.createMode === CreateStatus.CREATING;
     }, [editMapInfo.createMode]);
+    const centerBounds = useMemo(() => {
+        if (!svgRef || !centerPoint)
+            return null;
+        const elementWidth = 50 * 10;
+        const [minX, minY, maxX, maxY] = [
+            centerPoint[0] - elementWidth / 2,
+            centerPoint[1] - elementWidth / 2,
+            centerPoint[0] + elementWidth / 2,
+            centerPoint[1] + elementWidth / 2,
+        ];
+        const elementPoints = [
+            [minX, minY],
+            [minX, maxY],
+            [maxX, maxY],
+            [maxX, minY],
+        ];
+        return elementPoints;
+    }, [centerPoint]);
     // 调整SVG大小的函数
     const adjustSvgSize = (layoutData) => {
         const padding = 20; // 添加一些边距以避免内容贴边
@@ -19811,23 +19722,73 @@ const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChang
         const svg = selectedDoodle?.svgStr;
         const minLength = selectedDoodle.minLength;
         const parseSvg = SvgParserNative.parseSvg(svg);
-        const svgMinLength = Math.min(parseSvg.width, parseSvg.height) / SCALE_FACTOR;
+        const svgMinLength = parseSvg.height / SCALE_FACTOR;
         // 使用获取到的 SVG 内容，如果没有获取到则使用 URL
         newDoodle.svg = svg;
         newDoodle.scale = minLength / svgMinLength;
         newDoodle.direction = 0;
         newDoodle.center = restorePoint(centerPoint);
-        setEditMapInfo((prev) => ({
-            ...prev,
+        if (platform === PlatformType.H5) {
+            setEditMapInfo((prev) => ({
+                ...prev,
+                currentHistoryIndex: 0,
+                mobileMode: MobileEditMode.CREATE,
+                elementType: DataType.DOODLE,
+                selectElement: newDoodle,
+            }));
+            addHistory({
+                selectElement: newDoodle,
+            });
+        }
+        else {
+            setEditMapInfo({
+                ...editMapInfo,
+                historyList: [
+                    {
+                        selectElement: newDoodle,
+                    },
+                ],
+                currentHistoryIndex: 0,
+                createMode: CreateStatus.COMPLETED,
+                elementType: DataType.DOODLE,
+                selectElement: newDoodle,
+                isShowDrag: true,
+            });
+        }
+    };
+    const addElement = (type, item) => {
+        let newElement = null;
+        if (type === DataType.BOUNDARY) {
+            newElement = initBoundary();
+        }
+        else if (type === DataType.OBSTACLE) {
+            newElement = initObstacle();
+        }
+        else if (type === DataType.CHANNEL) {
+            newElement = initChannel();
+        }
+        else if (type === DataType.VISION_OFF) {
+            newElement = initVisionOff();
+            newElement.points = centerBounds;
+        }
+        else if (type === DataType.DOODLE) {
+            addDoodle(item);
+            return;
+        }
+        setEditMapInfo({
+            ...editMapInfo,
+            historyList: [
+                {
+                    selectElement: newElement,
+                },
+            ],
             currentHistoryIndex: 0,
-            mobileMode: MobileEditMode.CREATE,
-            elementType: DataType.DOODLE,
-            selectElement: newDoodle,
-        }));
-        addHistory({
-            selectElement: newDoodle,
+            createMode: type === DataType.VISION_OFF ? CreateStatus.COMPLETED : CreateStatus.CREATING,
+            elementType: type,
+            selectElement: newElement,
         });
     };
+    const saveElement = (type, item) => { };
     useEffect(() => {
         onEditInfoMapChange?.(editMapInfo);
     }, [editMapInfo]);
@@ -19864,6 +19825,8 @@ const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChang
         addHistory,
         addDoodle,
         checkDoodle: () => checkDoodle?.(),
+        addElement,
+        saveElement,
     }));
     // 初始化多边形绘制 Hook
     const { onSvgClick, onSvgMouseMove, onPointClick, points, completed, mousePos, updatePoints } = usePolygonDrawing({ createMode: isCreating });
@@ -19878,10 +19841,9 @@ const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChang
             return false;
         return checkCanNotCreateAtPosition(mousePos);
     }, [mousePos, checkCanNotCreateAtPosition]);
-    console.log('editMapInfo--->', editMapInfo);
-    return (jsx("div", { ref: containerRef, className: classNames(styles$d.mapEdit, {
-            [styles$d.createMode]: isCreating,
-            [styles$d.notCreateCursor]: showNotCreateCursor,
+    return (jsx("div", { ref: containerRef, className: classNames(styles$1.mapEdit, {
+            [styles$1.createMode]: isCreating,
+            [styles$1.notCreateCursor]: showNotCreateCursor,
         }), style: {
             display: editMap ? 'block' : 'none',
         }, children: jsxs("svg", { style: {
@@ -19979,1766 +19941,72 @@ const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChang
 });
 SvgEditMap.displayName = 'SvgEditMap';
 
-var css_248z$c = ".index-module_addEntry__QsQHD {\n  position: absolute;\n  right: 8px;\n  top: 8px;\n  cursor: pointer;\n  z-index: 10;\n}\n.index-module_addEntry__QsQHD .index-module_icon__qIgA4 {\n  padding: 6px;\n  border-radius: 8px;\n  background: #fff;\n  box-shadow: 2px 2px 12px 0px rgba(0, 0, 0, 0.2);\n}\n\n.index-module_addItem__mglwZ {\n  display: flex;\n  align-items: center;\n  padding: 4px;\n  justify-content: flex-start;\n  cursor: pointer;\n}\n.index-module_addItem__mglwZ:hover {\n  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.25);\n  border-radius: 4px;\n}\n.index-module_addItem__mglwZ:not(:last-child) {\n  margin-bottom: 6px;\n}\n.index-module_addItem__mglwZ .index-module_icon__qIgA4 {\n  width: 16px;\n  height: 16px;\n}\n.index-module_addItem__mglwZ .index-module_label__QqZ-9 {\n  font-weight: 500;\n  font-size: 14px;\n  line-height: 16px;\n  color: rgb(158, 158, 158);\n  margin-left: 4px;\n}";
-var styles$c = {"addEntry":"index-module_addEntry__QsQHD","icon":"index-module_icon__qIgA4","addItem":"index-module_addItem__mglwZ","label":"index-module_label__QqZ-9"};
-styleInject(css_248z$c);
-
-var _rect$2, _path$9, _defs$3;
-function _extends$d() { return _extends$d = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$d.apply(null, arguments); }
-var SvgAddEntry = function SvgAddEntry(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$d({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    fill: "none"
-  }, props), _rect$2 || (_rect$2 = /*#__PURE__*/React.createElement("rect", {
-    width: 10.95,
-    height: 10.95,
-    x: 10.613,
-    y: 3.15,
-    fill: "#1F1F1F",
-    stroke: "url(#add-entry_svg__a)",
-    strokeWidth: 0.3,
-    opacity: 0.795,
-    rx: 1.05
-  })), /*#__PURE__*/React.createElement("foreignObject", {
-    width: 23.468,
-    height: 20.501,
-    x: -1.543,
-    y: 3.499
-  }, /*#__PURE__*/React.createElement("div", {
-    xmlns: "http://www.w3.org/1999/xhtml",
-    style: {
-      backdropFilter: "blur(1.63px)",
-      clipPath: "url(#add-entry_svg__b)",
-      height: "100%",
-      width: "100%"
-    }
-  })), _path$9 || (_path$9 = /*#__PURE__*/React.createElement("path", {
-    fill: "#1F1F1F",
-    stroke: "url(#add-entry_svg__c)",
-    strokeWidth: 0.3,
-    d: "M9.302 7.402a1.05 1.05 0 0 1 1.778 0l7.27 11.578a1.05 1.05 0 0 1-.89 1.608H2.92a1.05 1.05 0 0 1-.889-1.608z",
-    "data-figma-bg-blur-radius": 3.262
-  })), _defs$3 || (_defs$3 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
-    id: "add-entry_svg__a",
-    x1: 16.851,
-    x2: 20.384,
-    y1: 10.392,
-    y2: 4.767,
-    gradientUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/React.createElement("stop", {
-    stopColor: "#fff",
-    stopOpacity: 0.01
-  }), /*#__PURE__*/React.createElement("stop", {
-    offset: 1,
-    stopColor: "#fff"
-  })), /*#__PURE__*/React.createElement("linearGradient", {
-    id: "add-entry_svg__c",
-    x1: 21.47,
-    x2: 12.314,
-    y1: 15.036,
-    y2: 5.769,
-    gradientUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/React.createElement("stop", {
-    stopColor: "#fff",
-    stopOpacity: 0.01
-  }), /*#__PURE__*/React.createElement("stop", {
-    offset: 1,
-    stopColor: "#fff"
-  })), /*#__PURE__*/React.createElement("clipPath", {
-    id: "add-entry_svg__b",
-    transform: "translate(1.543 -3.499)"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "M9.302 7.402a1.05 1.05 0 0 1 1.778 0l7.27 11.578a1.05 1.05 0 0 1-.89 1.608H2.92a1.05 1.05 0 0 1-.889-1.608z"
-  })))));
-};
-
-var _path$8, _path2$3, _path3;
-function _extends$c() { return _extends$c = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$c.apply(null, arguments); }
-var SvgBoundary = function SvgBoundary(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$c({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
-    fill: "none"
-  }, props), _path$8 || (_path$8 = /*#__PURE__*/React.createElement("path", {
-    fill: "#1DBEAC",
-    fillRule: "evenodd",
-    d: "M3.385 2h9.23C13.38 2 14 2.62 14 3.385v9.23C14 13.38 13.38 14 12.615 14h-9.23C2.62 14 2 13.38 2 12.615v-9.23C2 2.62 2.62 2 3.385 2m9.692 1.385a.46.46 0 0 0-.462-.462h-9.23a.46.46 0 0 0-.462.462v9.23c0 .255.207.462.462.462h9.23a.46.46 0 0 0 .462-.462z",
-    clipRule: "evenodd",
-    opacity: 0.602
-  })), _path2$3 || (_path2$3 = /*#__PURE__*/React.createElement("path", {
-    fill: "#1DBEAC",
-    d: "M12.615 2.923c.255 0 .462.207.462.462v9.23a.46.46 0 0 1-.462.462h-9.23a.46.46 0 0 1-.462-.462v-9.23c0-.255.207-.462.462-.462z",
-    opacity: 0.152
-  })), _path3 || (_path3 = /*#__PURE__*/React.createElement("path", {
-    fill: "#1DBEAC",
-    fillRule: "evenodd",
-    d: "M2.833 2a.833.833 0 1 0 0 1.667.833.833 0 0 0 0-1.667m0 10.333a.833.833 0 1 0 0 1.667.833.833 0 0 0 0-1.667m9.5-9.5a.833.833 0 1 1 1.667 0 .833.833 0 0 1-1.667 0m.834 9.5a.833.833 0 1 0 0 1.667.833.833 0 0 0 0-1.667M6.49 10.333s.335-4.388 3.451-5.666c-1.725 2.439-1.725 5.666-1.725 5.666zm2.305 0s.548-4.108 2.872-4.816c-1.071 1.7-1.071 4.816-1.071 4.816zM6.87 5.517c-2.384 1.42-2.537 4.816-2.537 4.816h1.582s-.21-2.698.955-4.816",
-    clipRule: "evenodd"
-  })));
-};
-
-var _path$7, _path2$2, _rect$1, _rect2$1;
-function _extends$b() { return _extends$b = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$b.apply(null, arguments); }
-var SvgLimitIsland = function SvgLimitIsland(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$b({
+var _path;
+function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
+var SvgMobileAddPoint = function SvgMobileAddPoint(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
     xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
+    width: 36,
+    height: 36,
     fill: "none"
-  }, props), _path$7 || (_path$7 = /*#__PURE__*/React.createElement("path", {
-    fill: "#FFA077",
-    d: "M11.725 6.714c-1.019-.137-2.516-1.488-1.9-2.14.588-.621 1.91.344 1.9 2.14"
-  })), _path2$2 || (_path2$2 = /*#__PURE__*/React.createElement("path", {
-    fill: "#FF5D17",
-    d: "M11.195 3.637c-.863.109-.623 2.341.354 3.024 1.603.79 2.575-.099 2.517-.459-.072-.445-.983-1.014-2.029-.274.455-.92-.08-2.387-.842-2.291M10.004 9.084l.308.87c1.202.178 2.002.494 2.002.856 0 .556-1.887 1.007-4.215 1.007-2.329 0-4.216-.451-4.217-1.007 0-.334.683-.63 1.733-.812l.593-1.679zm-.777-2.197.518 1.463-3.312-.667.443-1.253zM7.467 4.76a.535.535 0 0 1 1.01 0l.493 1.398L7.1 5.794z"
-  })), _rect$1 || (_rect$1 = /*#__PURE__*/React.createElement("rect", {
-    width: 14.237,
-    height: 10.667,
-    x: 0.882,
-    y: 2.667,
-    fill: "#F50",
-    opacity: 0.15,
-    rx: 2
-  })), _rect2$1 || (_rect2$1 = /*#__PURE__*/React.createElement("rect", {
-    width: 14.237,
-    height: 10.667,
-    x: 0.882,
-    y: 2.667,
-    stroke: "#FF5D17",
-    strokeWidth: 0.867,
-    rx: 2
+  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+    stroke: "#fff",
+    strokeLinecap: "round",
+    strokeLinejoin: "round",
+    strokeWidth: 3,
+    d: "M6 12V9a3 3 0 0 1 3-3h3M6 24v3a3 3 0 0 0 3 3h3M24 6h3a3 3 0 0 1 3 3v3m-6 18h3a3 3 0 0 0 3-3v-3m-16.5-6h9M18 13.5v9"
   })));
 };
 
-var _rect, _rect2, _rect3, _rect4, _g$3;
-function _extends$a() { return _extends$a = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$a.apply(null, arguments); }
-var SvgVisionFence = function SvgVisionFence(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$a({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
-    fill: "none"
-  }, props), _rect || (_rect = /*#__PURE__*/React.createElement("rect", {
-    width: 14.333,
-    height: 10.667,
-    x: 0.833,
-    y: 2.667,
-    fill: "#B1D9FF",
-    rx: 2.667
-  })), _rect2 || (_rect2 = /*#__PURE__*/React.createElement("rect", {
-    width: 13.333,
-    height: 9.667,
-    x: 1.333,
-    y: 3.167,
-    stroke: "#5C9DFF",
-    strokeDasharray: "6.33 6.33",
-    rx: 1.333
-  })), _rect3 || (_rect3 = /*#__PURE__*/React.createElement("rect", {
-    width: 6,
-    height: 6,
-    x: 5,
-    y: 4.833,
-    fill: "#B1D9FF",
-    rx: 3
-  })), /*#__PURE__*/React.createElement("mask", {
-    id: "visionFence_svg__a",
-    width: 6,
-    height: 6,
-    x: 5,
-    y: 5,
-    maskUnits: "userSpaceOnUse",
-    style: {
-      maskType: "alpha"
-    }
-  }, _rect4 || (_rect4 = /*#__PURE__*/React.createElement("rect", {
-    width: 5.333,
-    height: 5.333,
-    x: 5.333,
-    y: 5.5,
-    fill: "#B1D9FF",
-    rx: 2.667
-  }))), _g$3 || (_g$3 = /*#__PURE__*/React.createElement("g", {
-    fill: "#5C9DFF",
-    mask: "url(#visionFence_svg__a)"
-  }, /*#__PURE__*/React.createElement("path", {
-    d: "m8.838 3.395.636.636-5.42 5.421-.637-.636zM9.896 4.452l.637.637-5.422 5.42-.636-.635zM10.954 5.51l.636.637-5.421 5.421-.636-.636zM12.172 6.547l.636.637-5.421 5.42-.636-.635z"
-  }))));
-};
+var css_248z = ".index-module_crosshair__etey6 {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 40px;\n  height: 40px;\n  pointer-events: none;\n  z-index: 99999;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}";
+var styles = {"crosshair":"index-module_crosshair__etey6"};
+styleInject(css_248z);
 
-var _g$2, _defs$2;
-function _extends$9() { return _extends$9 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$9.apply(null, arguments); }
-var SvgDoodle = function SvgDoodle(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$9({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
-    fill: "none"
-  }, props), _g$2 || (_g$2 = /*#__PURE__*/React.createElement("g", {
-    clipPath: "url(#doodle_svg__a)"
-  }, /*#__PURE__*/React.createElement("g", {
-    clipPath: "url(#doodle_svg__b)"
-  }, /*#__PURE__*/React.createElement("rect", {
-    width: 14.237,
-    height: 10.667,
-    x: 0.333,
-    y: 4.332,
-    fill: "#CBFCF7",
-    stroke: "#9AEEE5",
-    strokeWidth: 0.867,
-    rx: 2
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#F2FFFD",
-    d: "M1.374 9.88a4 4 0 0 0 4 4h.546l.514-1.524c.073-.216-.087-.443-.312-.48-1.415-.229-3.6-1.485-4.399-4.639a.35.35 0 0 0-.135-.197c-.138.405-.214.84-.214 1.293z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#50D0C2",
-    d: "M15.814 2.13c-.352 2.267-6.501 9.305-8.003 9.43a.282.282 0 0 1-.238-.455L15.565.828c.398.332.293 1.015.249 1.303"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#50D0C2",
-    d: "M14.208.95c-2.147.946-7.434 8.618-7.15 10.058a.2.2 0 0 0 .017.047.295.295 0 0 0 .498.051L15.565.826c-.437-.28-1.084.003-1.357.123"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#9CE7DE",
-    d: "M7.76 11.558a.282.282 0 0 1-.187-.453.295.295 0 0 1-.498-.05.2.2 0 0 1-.016-.048c-.108-.55.598-2.01 1.63-3.658l2.297 1.689c-1.348 1.415-2.6 2.473-3.174 2.522a.2.2 0 0 1-.053-.002"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#50D0C2",
-    d: "M5.602 11.02c.658-.873 1.769-1.145 2.482-.607.714.537.759 1.68.1 2.553-.657.873-2.733.94-2.733.94s-.507-2.013.15-2.886"
-  })))), _defs$2 || (_defs$2 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("clipPath", {
-    id: "doodle_svg__a"
-  }, /*#__PURE__*/React.createElement("path", {
-    fill: "#fff",
-    d: "M0 0h16v16H0z"
-  })), /*#__PURE__*/React.createElement("clipPath", {
-    id: "doodle_svg__b"
-  }, /*#__PURE__*/React.createElement("path", {
-    fill: "#fff",
-    d: "M0 0h16v16H0z"
-  })))));
+/**
+ * 十字准心组件
+ * 相对于父容器居中显示
+ */
+const Crosshair = () => {
+    const { platform } = useCommonContext();
+    const { editMapInfo } = useMapEditContext();
+    const isVisible = useMemo(() => {
+        if (platform === PlatformType.H5 &&
+            editMapInfo?.mobileMode === MobileEditMode.CREATE &&
+            editMapInfo?.elementType === DataType.OBSTACLE) {
+            return true;
+        }
+        return false;
+    }, [platform, editMapInfo]);
+    return isVisible ? (jsx("div", { className: styles.crosshair, children: jsx(SvgMobileAddPoint, {}) })) : null;
 };
 
-var HandleElementMapType;
-(function (HandleElementMapType) {
-    HandleElementMapType["name"] = "name";
-    HandleElementMapType["focus"] = "focus";
-    HandleElementMapType["delete"] = "delete";
-    HandleElementMapType["timePeriod"] = "timePeriod";
-    HandleElementMapType["area"] = "area";
-    HandleElementMapType["dooleExist"] = "dooleExist";
-})(HandleElementMapType || (HandleElementMapType = {}));
-const DATE_TYPE_MAP = [
-    { type: DataType.BOUNDARY, label: 'Boundary', icon: jsx(SvgBoundary, {}) },
-    {
-        type: DataType.OBSTACLE,
-        paramType: RecordTypeEnum.OBSTACLE,
-        label: 'Off-limit island',
-        icon: jsx(SvgLimitIsland, {}),
-    },
-    // { type: DataType.CHANNEL, label: 'Channel', icon: <ChannelIcon /> },
-    {
-        type: DataType.VISION_OFF,
-        paramType: RecordTypeEnum.VISI_OFF,
-        label: 'VisionFence-off zone',
-        icon: jsx(SvgVisionFence, {}),
-    },
-    {
-        type: DataType.DOODLE,
-        paramType: RecordTypeEnum.DOODLE,
-        label: 'Doodle',
-        icon: jsx(SvgDoodle, {}),
-    },
-];
-({
-    [DataType.BOUNDARY]: {
-        },
-    [DataType.OBSTACLE]: {
-        },
-    [DataType.CHANNEL]: {
-        },
-    [DataType.VISION_OFF]: {
-        },
-    [DataType.DOODLE]: {
-        },
-    [DataType.PATH]: undefined,
-    [DataType.ANTENNA]: undefined,
-    [DataType.CHARGING_PILE]: undefined,
-});
-
-var css_248z$b = ".ant-modal .ant-modal-body .ant-modal-confirm-title {\n  text-align: center;\n}\n.ant-modal .ant-modal-body .ant-modal-confirm-btns {\n  margin-top: 24px;\n}\n.ant-modal .ant-modal-body .ant-modal-confirm-btns .ant-btn + .ant-btn {\n  margin-left: 24px;\n}\n\n.index-module_modal__fkxhn.index-module_center__d461v .ant-modal-title {\n  text-align: center;\n  padding: 10px 20px 0;\n  font-size: 18px;\n}\n.index-module_modal__fkxhn.index-module_center__d461v .ant-modal-header {\n  margin-bottom: 24px;\n}\n.index-module_modal__fkxhn.index-module_center__d461v .ant-modal .ant-modal-footer {\n  margin-top: 24px;\n}\n.index-module_modal__fkxhn.index-module_center__d461v .ant-modal .ant-modal-footer .ant-btn + .ant-btn {\n  margin-left: 24px;\n}";
-var styles$b = {"modal":"index-module_modal__fkxhn","center":"index-module_center__d461v"};
-styleInject(css_248z$b);
-
-const CustomModal = ({ children, titleCenter, hasMinHeight, height, ...props }) => {
-    return (jsx(Modal, { centered: true, styles: {
-            body: {
-                maxHeight: height ? `${height}px` : 'calc(100vh - 200px)',
-                minHeight: hasMinHeight ? '520px' : undefined,
-                overflow: 'auto',
-            },
-        }, wrapClassName: classNames(styles$b.modal, {
-            [styles$b.center]: titleCenter,
-        }), cancelButtonProps: { color: 'primary', variant: 'outlined' }, cancelText: 'Cancel', ...props, children: children }));
+// 验证GPS坐标是否有效
+const isValidGpsCoordinate = (coordinate) => {
+    if (!coordinate || coordinate.length < 2)
+        return false;
+    const [lng, lat] = coordinate;
+    // 检查是否为有效的GPS坐标范围，且不是原点(0,0)
+    return (lng >= -180 &&
+        lng <= 180 &&
+        lat >= -90 &&
+        lat <= 90 &&
+        !(Math.abs(lng) < 0.001 && Math.abs(lat) < 0.001) // 排除接近(0,0)的坐标
+    );
 };
-
-var css_248z$a = ".index-module_doodleModal__EGNPW .index-module_title__ViZuB {\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 20px;\n  color: rgb(29, 29, 29);\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 10px;\n  max-height: 230px;\n  overflow-y: auto;\n  width: 470px;\n  margin: 20px auto 0;\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T .index-module_item__dvoq7 {\n  width: 70px;\n  height: 70px;\n  padding: 10px;\n  border-radius: 8px;\n  cursor: pointer;\n  border: 2px solid transparent;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  transition: all 0.2s ease;\n  position: relative;\n  background: rgb(233, 242, 241);\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T .index-module_item__dvoq7:hover {\n  background-color: rgba(0, 0, 0, 0.05);\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T .index-module_item__dvoq7.index-module_active__1OHfd {\n  border: 2px solid #ff5a00;\n  background-color: rgba(110, 220, 207, 0.1);\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T .index-module_item__dvoq7.index-module_active__1OHfd .index-module_selectIcon__EFQF- {\n  display: block;\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T .index-module_item__dvoq7 .index-module_svgImage__2OT8- {\n  width: 100%;\n  height: 100%;\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T .index-module_item__dvoq7 .index-module_svgImage__2OT8- svg {\n  width: 100%;\n  height: 100%;\n}\n.index-module_doodleModal__EGNPW .index-module_content__h-60T .index-module_item__dvoq7 .index-module_selectIcon__EFQF- {\n  position: absolute;\n  bottom: 4px;\n  right: 4px;\n  display: none;\n}";
-var styles$a = {"doodleModal":"index-module_doodleModal__EGNPW","title":"index-module_title__ViZuB","content":"index-module_content__h-60T","item":"index-module_item__dvoq7","active":"index-module_active__1OHfd","svgImage":"index-module_svgImage__2OT8-"};
-styleInject(css_248z$a);
-
-const DoodleModal = ({ open, onSelect, setOpen, doodleList, centerPoint }) => {
-    const { editMapInfo, setEditMapInfo, onHandleEnterRecord } = useMapEditContext();
-    const [selectedDoodle, setSelectedDoodle] = useState(null);
-    const noNeed = useMemo(() => {
-        return '1234567890QWERTYUIOPASDFGHJKLZXCVBNM';
-    }, []);
-    // 选择 Doodle
-    const handleSelectDoodle = useCallback((item) => {
-        setSelectedDoodle(item);
-    }, []);
-    // 确认选择
-    const handleConfirm = useCallback(() => {
-        if (selectedDoodle) {
-            const newDoodle = initDoodle();
-            const svg = selectedDoodle?.svgStr;
-            const minLength = selectedDoodle.minLength;
-            const parseSvg = SvgParserNative.parseSvg(svg);
-            const svgMinLength = parseSvg.height / SCALE_FACTOR;
-            // 使用获取到的 SVG 内容，如果没有获取到则使用 URL
-            newDoodle.svg = svg;
-            newDoodle.scale = minLength / svgMinLength;
-            newDoodle.direction = 0;
-            newDoodle.center = restorePoint(centerPoint);
-            onHandleEnterRecord?.({
-                type: 1,
-                function: 0,
-            })?.then(() => {
-                setEditMapInfo({
-                    ...editMapInfo,
-                    historyList: [
-                        {
-                            selectElement: newDoodle,
-                        },
-                    ],
-                    currentHistoryIndex: 0,
-                    createMode: CreateStatus.COMPLETED,
-                    elementType: DataType.DOODLE,
-                    selectElement: newDoodle,
-                    isShowDrag: true,
-                });
-                setOpen(false);
-                onSelect?.(svg);
-            }, (error) => {
-                message.error('Save failed, please try again');
-            });
-        }
-    }, [selectedDoodle, setEditMapInfo, editMapInfo, setOpen, onSelect, centerPoint]);
-    return (jsx(CustomModal, { width: 560, title: "Create doodle", titleCenter: true, open: open, onOk: handleConfirm, onCancel: () => setOpen(false), okButtonProps: { disabled: !selectedDoodle }, afterClose: () => setSelectedDoodle(null), okText: "Create", cancelText: "Cancel", children: jsxs("div", { className: styles$a.doodleModal, children: [jsx("div", { className: styles$a.title, children: "Select the doodle that you want to create" }), jsx("div", { className: styles$a.content, children: doodleList
-                        ?.filter((item) => !noNeed.includes(item.name))
-                        .map((item) => {
-                        return (jsx("div", { className: classNames(styles$a.item, {
-                                [styles$a.active]: selectedDoodle?.svg === item.svg,
-                            }), onClick: () => handleSelectDoodle(item), children: jsx("div", { className: styles$a.svgImage, dangerouslySetInnerHTML: { __html: item?.svgStr } }) }, item.id));
-                    }) })] }) }));
-};
-
-const AddEntry = ({ doodleList, disabledObstacles, editMap }) => {
-    const { svgRef } = useSvgEditContext();
-    const { editMapInfo, setEditMapInfo, onHandleEnterRecord } = useMapEditContext();
-    const divRef = useRef(null);
-    const [open, setOpen] = useState(false);
-    const [doodleOpen, setDoodleOpen] = useState(false);
-    const centerPoint = useMemo(() => {
-        if (!svgRef)
-            return null;
-        const baseVal = svgRef?.viewBox.baseVal;
-        const center = [
-            baseVal?.x + (baseVal?.width || 0) / 2,
-            baseVal?.y + (baseVal?.height || 0) / 2,
-        ];
-        return center;
-    }, [svgRef?.viewBox?.baseVal?.x]);
-    const centerBounds = useMemo(() => {
-        if (!svgRef)
-            return null;
-        const elementWidth = 50 * 10;
-        const [minX, minY, maxX, maxY] = [
-            centerPoint[0] - elementWidth / 2,
-            centerPoint[1] - elementWidth / 2,
-            centerPoint[0] + elementWidth / 2,
-            centerPoint[1] + elementWidth / 2,
-        ];
-        const elementPoints = [
-            [minX, minY],
-            [minX, maxY],
-            [maxX, maxY],
-            [maxX, minY],
-        ];
-        return elementPoints;
-    }, [centerPoint]);
-    const addNewElement = useCallback((type, item) => {
-        setOpen(false);
-        let newElement = null;
-        if (type === DataType.BOUNDARY) {
-            newElement = initBoundary();
-        }
-        else if (type === DataType.OBSTACLE) {
-            newElement = initObstacle();
-        }
-        else if (type === DataType.CHANNEL) {
-            newElement = initChannel();
-        }
-        else if (type === DataType.VISION_OFF) {
-            newElement = initVisionOff();
-            newElement.points = centerBounds;
-        }
-        else if (type === DataType.DOODLE) {
-            return setDoodleOpen(true);
-        }
-        onHandleEnterRecord?.({
-            type: item?.paramType,
-            function: item?.type === DataType.OBSTACLE ? 0 : undefined,
-        })?.then(() => {
-            setEditMapInfo({
-                ...editMapInfo,
-                historyList: [
-                    {
-                        selectElement: newElement,
-                    },
-                ],
-                currentHistoryIndex: 0,
-                createMode: type === DataType.VISION_OFF ? CreateStatus.COMPLETED : CreateStatus.CREATING,
-                elementType: type,
-                selectElement: newElement,
-            });
-        }, (errorText) => {
-            message.error('Save failed, please try again');
-        });
-    }, [centerBounds]);
-    const addItems = useMemo(() => {
-        return DATE_TYPE_MAP?.filter((item) => {
-            if (item.type === DataType.OBSTACLE) {
-                return !disabledObstacles;
-            }
-            return item.type !== DataType.BOUNDARY;
-        });
-    }, [disabledObstacles]);
-    // console.log('addEntry->', editMapInfo, editMap);
-    if (editMapInfo.createMode || editMapInfo.editMap || !editMap) {
-        return null;
-    }
-    return (jsxs("div", { ref: divRef, className: styles$c.addEntry, children: [jsx(Popover, { open: open, onOpenChange: setOpen, arrow: false, placement: "leftTop", content: addItems?.map((item) => {
-                    return (jsxs("div", { className: styles$c.addItem, onClick: () => {
-                            addNewElement(item.type, item);
-                        }, children: [jsx("div", { className: styles$c.icon, children: item?.icon }), jsx("div", { className: styles$c.label, children: item?.label })] }, item.label));
-                }), children: jsx("div", { className: styles$c.icon, children: jsx(SvgAddEntry, {}) }) }), jsx(DoodleModal, { centerPoint: centerPoint, doodleList: doodleList, open: doodleOpen, onOk: () => setDoodleOpen(false), setOpen: setDoodleOpen })] }));
-};
-
-var css_248z$9 = ".index-module_handleElementInfo__vWIaf {\n  position: absolute;\n  right: 0;\n  top: 0;\n  border-radius: 8px;\n  padding: 8px;\n  background: #fff;\n  width: 265px;\n  user-select: none;\n}\n.index-module_handleElementInfo__vWIaf .index-module_border__iPL-- {\n  margin: 8px 0;\n  border-top: 1px solid #c5c5c5;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 {\n  position: absolute;\n  left: -96px;\n  top: 0;\n  display: flex;\n  gap: 12px;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u- {\n  background: #fff;\n  border-radius: 8px;\n  padding: 6px;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X:not(.index-module_disabled__w6gCJ):hover,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u-:not(.index-module_disabled__w6gCJ):hover {\n  opacity: 0.8;\n  cursor: pointer;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X.index-module_disabled__w6gCJ,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u-.index-module_disabled__w6gCJ {\n  color: #d8d8d8;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- {\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- input {\n  padding: 2px 0;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- .index-module_edit__b0r9I {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 16px;\n  height: 16px;\n  cursor: pointer;\n}\n.index-module_handleElementInfo__vWIaf .index-module_boundaryOther__FyJvt {\n  padding-top: 4px;\n  border-top: 1px solid rgb(197, 197, 197);\n}\n.index-module_handleElementInfo__vWIaf .index-module_handle__4mIxr {\n  display: flex;\n  align-items: center;\n  justify-content: flex-end;\n  padding: 0px 0 4px 0;\n}\n\n.index-module_doodleInfo__bd2ua .index-module_time__1bUFf {\n  width: 100%;\n}\n.index-module_doodleInfo__bd2ua .index-module_exist__gWtNo {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n}\n.index-module_doodleInfo__bd2ua .index-module_tip__1HNmj {\n  color: #ff3f33;\n  margin-top: 10px;\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 16px;\n}\n\n.index-module_areaInfo__-WJPL {\n  color: #9e9e9e;\n  width: 100%;\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 16px; /* 114.286% */\n}\n.index-module_areaInfo__-WJPL .index-module_areaItem__fk-i2 {\n  display: flex;\n  justify-content: space-between;\n  padding: 6px 0;\n}\n.index-module_areaInfo__-WJPL .index-module_areaItem__fk-i2:not(:last-child) {\n  margin-bottom: 4px;\n}\n\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM {\n  color: #1f1f1f;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n  line-height: 16px;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ {\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  width: 100%;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ .index-module_value__x3-se {\n  margin-left: auto;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ .index-module_icon__167WB {\n  width: 16px;\n  height: 16px;\n  cursor: pointer;\n}";
-var styles$9 = {"handleElementInfo":"index-module_handleElementInfo__vWIaf","border":"index-module_border__iPL--","undoAndRedo":"index-module_undoAndRedo__EKeA8","undo":"index-module_undo__lPY1X","redo":"index-module_redo__EU5u-","disabled":"index-module_disabled__w6gCJ","nameEdit":"index-module_nameEdit__eVzQ-","handle":"index-module_handle__4mIxr","doodleInfo":"index-module_doodleInfo__bd2ua","time":"index-module_time__1bUFf","exist":"index-module_exist__gWtNo","tip":"index-module_tip__1HNmj","areaInfo":"index-module_areaInfo__-WJPL","areaItem":"index-module_areaItem__fk-i2","boundaryInfo":"index-module_boundaryInfo__VfR-N","otherEdit":"index-module_otherEdit__17SuM","otherItem":"index-module_otherItem__ATLFZ","value":"index-module_value__x3-se","icon":"index-module_icon__167WB"};
-styleInject(css_248z$9);
-
-var css_248z$8 = ".index-module_infoHeader__l9F6q {\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding: 6px 0;\n}\n.index-module_infoHeader__l9F6q .index-module_headerIcon__sK1hg {\n  width: 16px;\n  height: 16px;\n}\n.index-module_infoHeader__l9F6q .index-module_headerName__UGnrH {\n  margin-left: 4px;\n  color: rgb(158, 158, 158);\n  font-weight: 500;\n  font-size: 14px;\n  line-height: 16px;\n  pointer-events: none;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f .index-module_focus__llcox {\n  width: 16px;\n  height: 16px;\n  cursor: pointer;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f .index-module_delete__hD4-Q {\n  width: 16px;\n  height: 16px;\n  margin-left: 8px;\n  cursor: pointer;\n}";
-var styles$8 = {"infoHeader":"index-module_infoHeader__l9F6q","headerIcon":"index-module_headerIcon__sK1hg","headerName":"index-module_headerName__UGnrH","headerHandle":"index-module_headerHandle__ymh7f","focus":"index-module_focus__llcox","delete":"index-module_delete__hD4-Q"};
-styleInject(css_248z$8);
-
-var _path$6;
-function _extends$8() { return _extends$8 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$8.apply(null, arguments); }
-var SvgFocus = function SvgFocus(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$8({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
-    fill: "none"
-  }, props), _path$6 || (_path$6 = /*#__PURE__*/React.createElement("path", {
-    fill: "#FF5A00",
-    d: "M8 5.5a2.5 2.5 0 1 0 0 5 2.5 2.5 0 0 0 0-5m-1.733-4h-.022c-.728 0-1.306 0-1.77.038-.476.039-.878.12-1.246.307a3.17 3.17 0 0 0-1.384 1.384c-.187.367-.268.77-.307 1.246-.038.464-.038 1.042-.038 1.77v.022a.5.5 0 0 0 1 0c0-.755 0-1.292.035-1.711.033-.413.098-.67.201-.873.208-.408.54-.74.947-.947.203-.103.46-.167.873-.201.42-.034.956-.035 1.71-.035a.5.5 0 0 0 0-1m3.466 1c.756 0 1.292 0 1.711.035.413.033.67.098.873.201.408.208.74.54.947.947.103.203.167.46.201.873.034.42.035.956.035 1.71a.5.5 0 0 0 1 0v-.021c0-.728 0-1.306-.038-1.77-.039-.476-.12-.878-.307-1.246a3.17 3.17 0 0 0-1.384-1.384c-.368-.187-.77-.268-1.246-.307-.464-.038-1.042-.038-1.77-.038h-.022a.5.5 0 0 0 0 1M2.5 9.733a.5.5 0 0 0-1 0v.022c0 .728 0 1.306.038 1.77.039.476.12.878.307 1.246.304.596.788 1.08 1.384 1.384.367.187.77.268 1.246.307.464.038 1.042.038 1.77.038h.022a.5.5 0 0 0 0-1c-.755 0-1.292 0-1.711-.035-.413-.033-.67-.098-.873-.201a2.17 2.17 0 0 1-.947-.947c-.103-.203-.167-.46-.201-.873-.034-.42-.035-.956-.035-1.71m12 0a.5.5 0 0 0-1 0c0 .756 0 1.292-.035 1.711-.033.413-.098.67-.201.873-.208.408-.54.74-.947.947-.203.103-.46.167-.873.201-.42.034-.956.035-1.71.035a.5.5 0 0 0 0 1h.021c.728 0 1.306 0 1.77-.038.476-.039.878-.12 1.246-.307a3.17 3.17 0 0 0 1.384-1.384c.187-.368.268-.77.307-1.246.038-.464.038-1.042.038-1.77z"
-  })));
-};
-
-var _path$5;
-function _extends$7() { return _extends$7 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$7.apply(null, arguments); }
-var SvgDelete = function SvgDelete(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$7({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
-    fill: "none"
-  }, props), _path$5 || (_path$5 = /*#__PURE__*/React.createElement("path", {
-    fill: "#FF5A00",
-    d: "M4.667 14q-.55 0-.942-.391a1.29 1.29 0 0 1-.392-.942V4h-.666V2.667H6V2h4v.667h3.333V4h-.666v8.667q0 .549-.392.942-.39.391-.942.391zM6 11.333h1.333v-6H6zm2.667 0H10v-6H8.667z"
-  })));
-};
-
-const Header = ({ handleDelete, handleFocus, showFocus = false, showDelete = true, type, }) => {
-    const currentType = useMemo(() => {
-        return DATE_TYPE_MAP.find((item) => item.type === type);
-    }, [type]);
-    return (jsxs("div", { className: styles$8.infoHeader, children: [jsx("div", { className: styles$8.headerIcon, children: currentType?.icon }), jsx("div", { className: styles$8.headerName, children: currentType?.label }), jsxs("div", { className: styles$8.headerHandle, children: [showFocus && (jsx("div", { className: styles$8.focus, onClick: handleFocus, children: jsx(SvgFocus, {}) })), showDelete && (jsx("div", { className: styles$8.delete, onClick: handleDelete, children: jsx(SvgDelete, {}) }))] })] }));
-};
-
-var css_248z$7 = ".index-module_nameEdit__O5bL0 {\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  width: 100%;\n}\n.index-module_nameEdit__O5bL0 .index-module_content__Bi2fa {\n  flex: 1;\n  line-height: 28px;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.index-module_nameEdit__O5bL0 .index-module_edit__3yRM0 {\n  width: 16px;\n  height: 16px;\n  cursor: pointer;\n}";
-var styles$7 = {"nameEdit":"index-module_nameEdit__O5bL0","content":"index-module_content__Bi2fa","edit":"index-module_edit__3yRM0"};
-styleInject(css_248z$7);
-
-var _path$4;
-function _extends$6() { return _extends$6 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$6.apply(null, arguments); }
-var SvgEdit = function SvgEdit(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$6({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
-    fill: "none"
-  }, props), _path$4 || (_path$4 = /*#__PURE__*/React.createElement("path", {
-    fill: "#FF5A00",
-    d: "M9.068 1.916a.751.751 0 0 1 0 1.501h-4.9a.75.75 0 0 0-.75.75v7.667c0 .414.336.75.75.75h7.667c.414 0 .75-.336.75-.75v-4.9a.75.75 0 0 1 1.5 0v4.9a2.25 2.25 0 0 1-2.25 2.25H4.168a2.25 2.25 0 0 1-2.25-2.25V4.167a2.25 2.25 0 0 1 2.25-2.251zm3.735.22a.75.75 0 0 1 1.06 1.061L8.53 8.53a.75.75 0 0 1-1.06-1.06z"
-  })));
-};
-
-const NameModal = ({ title, name, open, setOpen, onOk }) => {
-    const [nameValue, setNameValue] = useState('');
-    useEffect(() => {
-        if (open) {
-            setNameValue(name || '');
-        }
-    }, [name, open]);
-    return (jsx(CustomModal, { title: `${title}`, titleCenter: true, open: open, onOk: () => {
-            onOk?.(nameValue);
-            setOpen(false);
-        }, onCancel: () => setOpen(false), okText: "Confirm", afterClose: () => {
-            setNameValue('');
-        }, children: jsx(Input, { maxLength: 12, showCount: true, placeholder: "Please enter boundary name", value: nameValue, onChange: (e) => setNameValue(e.target.value) }) }));
-};
-
-const NameEdit = ({ title, name, onChange }) => {
-    const [open, setOpen] = React__default.useState(false);
-    return (jsxs(Fragment, { children: [jsxs("div", { className: styles$7.nameEdit, children: [jsx("div", { className: styles$7.content, children: name }), jsx("div", { className: styles$7.edit, onClick: () => setOpen(true), children: jsx(SvgEdit, {}) })] }), jsx(NameModal, { title: title, name: name, open: open, setOpen: setOpen, onOk: onChange })] }));
-};
-
-var _path$3;
-function _extends$5() { return _extends$5 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$5.apply(null, arguments); }
-var SvgArrow = function SvgArrow(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$5({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 16,
-    height: 16,
-    fill: "none"
-  }, props), _path$3 || (_path$3 = /*#__PURE__*/React.createElement("path", {
-    fill: "#1F1F1F",
-    d: "M11.523 7.704c.005.014.015.026.02.04.049.125.065.268.046.406a.73.73 0 0 1-.152.363l-3.88 4.638a.47.47 0 0 1-.377.182.49.49 0 0 1-.369-.208.77.77 0 0 1-.144-.477.76.76 0 0 1 .164-.466l3.483-4.162-3.468-4.224a.77.77 0 0 1-.15-.462c0-.172.053-.338.148-.463a.49.49 0 0 1 .36-.204.47.47 0 0 1 .371.17l3.845 4.682q.007.017.017.032.008.01.018.019c.032.04.046.09.067.134"
-  })));
-};
-
-var css_248z$6 = ".index-module_item__wwHEt {\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 16px;\n  display: flex;\n  align-items: center;\n  padding: 6px 0;\n}\n.index-module_item__wwHEt:not(:last-child) {\n  margin-bottom: 4px;\n}";
-var styles$6 = {"item":"index-module_item__wwHEt"};
-styleInject(css_248z$6);
-
-const Item = ({ children }) => {
-    return (jsx("div", { className: styles$6.item, children: children }));
-};
-
-var css_248z$5 = ".index-module_edgeMowing__kmHPN .index-module_item__O2omj {\n  border-bottom: 1px solid #C5C5C5;\n  margin-bottom: 20px;\n}\n.index-module_edgeMowing__kmHPN .index-module_item__O2omj .index-module_content__ENa5I {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 4px 0;\n}\n.index-module_edgeMowing__kmHPN .index-module_item__O2omj .index-module_tip__BoRNQ {\n  color: #9E9E9E;\n  font-size: 14px;\n  font-weight: 400;\n  line-height: 16px;\n  padding: 10px 0;\n}";
-var styles$5 = {"edgeMowing":"index-module_edgeMowing__kmHPN","item":"index-module_item__O2omj","content":"index-module_content__ENa5I","tip":"index-module_tip__BoRNQ"};
-styleInject(css_248z$5);
-
-const MowingEdgeModal = ({ open, setOpen, onChange, value }) => {
-    const [currentValue, setCurrentValue] = useState({});
-    const handleOk = () => {
-        onChange(currentValue);
-        setOpen(false);
-    };
-    useEffect(() => {
-        if (!open)
-            return;
-        setCurrentValue(value);
-    }, [open]);
-    return (jsx(CustomModal, { title: "Edge Mowing", titleCenter: true, open: open, onCancel: () => setOpen(false), onOk: handleOk, afterClose: () => {
-            setCurrentValue({});
-        }, children: jsxs("div", { className: styles$5.edgeMowing, children: [jsxs("div", { className: styles$5.item, children: [jsxs("div", { className: styles$5.content, children: [jsx("div", { className: styles$5.label, children: "Mow along boundary" }), jsx("div", { className: styles$5.value, children: jsx(Switch, { checked: currentValue['edgeMowing'], onChange: (val) => setCurrentValue({
-                                            obstacleMowEdge: currentValue?.obstacleMowEdge,
-                                            edgeMowing: val,
-                                        }) }) })] }), jsx("div", { className: styles$5.tip, children: "When enabled, the mower will mow along the selected boundary." })] }), jsxs("div", { className: styles$5.item, children: [jsxs("div", { className: styles$5.content, children: [jsx("div", { className: styles$5.label, children: "Mow around off-limit island" }), jsx("div", { className: styles$5.value, children: jsx(Switch, { value: currentValue['obstacleMowEdge'], onChange: (val) => setCurrentValue({
-                                            obstacleMowEdge: val,
-                                            edgeMowing: currentValue?.edgeMowing,
-                                        }) }) })] }), jsx("div", { className: styles$5.tip, children: "When enabled, the mower will mow around the off-limit islands within the selected mowing zone." })] })] }) }));
-};
-
-var css_248z$4 = ".index-module_zoneHeightModal__ehNMQ {\n  padding: 0 10px;\n}\n.index-module_zoneHeightModal__ehNMQ .ant-radio-group {\n  display: block;\n}\n.index-module_zoneHeightModal__ehNMQ .index-module_item__wQUzZ {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  font-size: 14px;\n  opacity: 0.4;\n}\n.index-module_zoneHeightModal__ehNMQ .index-module_item__wQUzZ.index-module_checked__xbxQ4 {\n  opacity: 1;\n}\n.index-module_zoneHeightModal__ehNMQ .index-module_item__wQUzZ:not(:last-child) {\n  margin-bottom: 20px;\n}\n.index-module_zoneHeightModal__ehNMQ .index-module_item__wQUzZ .index-module_right__IuIfk {\n  text-align: right;\n  width: 300px;\n  margin-left: auto;\n}";
-var styles$4 = {"zoneHeightModal":"index-module_zoneHeightModal__ehNMQ","item":"index-module_item__wQUzZ","checked":"index-module_checked__xbxQ4","right":"index-module_right__IuIfk"};
-styleInject(css_248z$4);
-
-const CutHeightSlider = ({ units, value, onChange, heightOptions, ...rest }) => {
-    const converteOptions = useCallback((options) => {
-        return options.map((item) => ({
-            label: units === UnitsType.Metric
-                ? `${item}`
-                : `${convertCutHeightFormatted(item)}`,
-            value: item,
-        }));
-    }, [units, convertCutHeightFormatted]);
-    const options = useMemo(() => {
-        if (heightOptions && heightOptions?.length > 0) {
-            return converteOptions(heightOptions);
-        }
-        return [];
-    }, [heightOptions, converteOptions]);
-    return (jsx(Slider, { value: value, ...rest, tooltip: {
-            open: false,
-        }, step: null, min: options?.[0]?.value, max: options?.[options?.length - 1]?.value, marks: options?.reduce((acc, item) => {
-            acc[item?.value] = {
-                label: item?.label,
-                style: {
-                    color: item?.value === Number(value)
-                        ? 'rgba(241, 102, 41, 1)'
-                        : 'rgba(0, 0, 0, 0.20)',
-                    fontWeight: item?.value === Number(value) ? 'bold' : 'normal',
-                },
-            };
-            return acc;
-        }, {}), onChange: onChange }));
-};
-
-var ZoneHeightModalTypeEnum;
-(function (ZoneHeightModalTypeEnum) {
-    ZoneHeightModalTypeEnum[ZoneHeightModalTypeEnum["GLOBAL"] = 1] = "GLOBAL";
-    ZoneHeightModalTypeEnum[ZoneHeightModalTypeEnum["RADIO"] = 0] = "RADIO";
-})(ZoneHeightModalTypeEnum || (ZoneHeightModalTypeEnum = {}));
-const HeightModal = ({ zoneName, open, setOpen, onChange, value, heightOptions, globalHeight, }) => {
-    const { unitType } = useCommonContext();
-    const [currentValue, setCurrentValue] = useState(value);
-    const handleOk = useCallback(() => {
-        setOpen(false);
-        onChange?.(currentValue);
-    }, [currentValue, setOpen, onChange]);
-    const onHeightChange = useCallback((value) => {
-        console.log('change->', value);
-        setCurrentValue({
-            cuttingHeight: value,
-            isFlowGlobal: ZoneHeightModalTypeEnum.RADIO,
-        });
-    }, []);
-    console.log('globalHeight', globalHeight, heightOptions);
-    useEffect(() => {
-        if (!open)
-            return;
-        setCurrentValue(value);
-    }, [value, open]);
-    return (jsx(CustomModal, { title: `${zoneName} cutting height`, titleCenter: true, width: 600, open: open, onCancel: () => setOpen(false), onOk: handleOk, okText: "Confirm", afterClose: () => { }, children: jsx("div", { className: styles$4.zoneHeightModal, children: jsxs(Radio.Group, { value: currentValue?.isFlowGlobal, onChange: (e) => setCurrentValue({
-                    isFlowGlobal: e.target.value,
-                    cuttingHeight: currentValue?.cuttingHeight,
-                }), children: [jsxs("div", { className: classNames(styles$4.item, {
-                            [styles$4.checked]: currentValue?.isFlowGlobal === ZoneHeightModalTypeEnum.GLOBAL,
-                        }), children: [jsx("div", { className: styles$4.left, children: jsx(Radio, { value: ZoneHeightModalTypeEnum.GLOBAL, children: "Global" }) }), jsx("div", { className: styles$4.right, children: jsx("span", { style: { color: 'rgba(241, 102, 41, 1)' }, children: generateHeightStr(globalHeight, unitType, true) }) })] }), jsxs("div", { className: classNames(styles$4.item, {
-                            [styles$4.checked]: currentValue?.isFlowGlobal === ZoneHeightModalTypeEnum.RADIO,
-                        }), children: [jsx("div", { className: styles$4.left, children: jsxs(Radio, { value: ZoneHeightModalTypeEnum.RADIO, children: ["Customize zone height (", getHeightUnit(unitType), ")"] }) }), jsx("div", { className: styles$4.right, children: jsx(CutHeightSlider, { units: unitType, value: currentValue?.cuttingHeight, heightOptions: heightOptions, onChange: onHeightChange }) })] })] }) }) }));
-};
-
-var css_248z$3 = ".index-module_directions__Hv0zx {\n  color: #1d1d1d;\n  font-size: 14px;\n  font-style: normal;\n  font-weight: 400;\n}\n.index-module_directions__Hv0zx .index-module_default__sSWp4 {\n  position: absolute;\n  bottom: 20px;\n  left: 9px;\n}\n.index-module_directions__Hv0zx .index-module_tips__VVEuO {\n  line-height: 16px;\n}\n.index-module_directions__Hv0zx .index-module_optimal__07le4 {\n  color: rgb(255, 113, 51);\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  gap: 6px;\n  margin: 4px 0 12px;\n}\n.index-module_directions__Hv0zx .index-module_content__PiCFf {\n  position: relative;\n  width: 100%;\n  margin-bottom: 12px;\n}\n.index-module_directions__Hv0zx .index-module_background__WM4u- {\n  position: absolute;\n  width: 100%;\n  height: 300px;\n  background: #f5f5f5;\n  border-radius: 8px;\n  z-index: 0;\n  overflow: hidden;\n}\n.index-module_directions__Hv0zx .index-module_luppan__nGfH2 {\n  inset: 0;\n  z-index: 1;\n}\n.index-module_directions__Hv0zx .index-module_slideTip__RGnd1 {\n  margin: 20px 0;\n}\n.index-module_directions__Hv0zx .index-module_slider__VDKnB {\n  padding: 0 24px;\n}";
-var styles$3 = {"directions":"index-module_directions__Hv0zx","default":"index-module_default__sSWp4","tips":"index-module_tips__VVEuO","optimal":"index-module_optimal__07le4","content":"index-module_content__PiCFf","background":"index-module_background__WM4u-","luppan":"index-module_luppan__nGfH2","slideTip":"index-module_slideTip__RGnd1","slider":"index-module_slider__VDKnB"};
-styleInject(css_248z$3);
-
-var css_248z$2 = ".style-module_commonModalContainer__WHZnl {\n  width: inherit;\n  height: inherit;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C {\n  position: relative;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 100%;\n  height: 100%;\n  box-sizing: border-box;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh {\n  display: flex;\n  flex-direction: column;\n  width: 300px;\n  height: 100%;\n  position: relative;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directText__b7QUs {\n  padding-top: 15px;\n  color: #1d1d1d;\n  text-align: center;\n  font-size: 16px;\n  font-weight: 600;\n  line-height: 24px;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directOption__IFsis {\n  position: absolute;\n  width: 100%;\n  height: 100%;\n  border-radius: 50%;\n  pointer-events: none;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directOption__IFsis .style-module_leftTop__H39Uk {\n  width: 22px;\n  height: 18px;\n  position: absolute;\n  top: -5px;\n  left: 50%;\n  transform: translate(-50%, 0) rotate(90deg);\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directOption__IFsis .style-module_rightBottom__f3c7n {\n  width: 22px;\n  height: 18px;\n  position: absolute;\n  bottom: -5px;\n  left: 50%;\n  transform: translate(-50%, 0) rotate(-90deg);\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n {\n  flex: 1;\n  min-height: 293px;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n .style-module_directDialPlate__zkFHk {\n  position: relative;\n  width: 293px;\n  height: 293px;\n  border-radius: 50%;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n .style-module_directDialPlate__zkFHk .style-module_directLineMain__p60DH {\n  position: absolute;\n  left: 0;\n  top: 0;\n  width: 100%;\n  height: 100%;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n .style-module_directDialPlate__zkFHk .style-module_directLineMain__p60DH .style-module_directLineContent__D9N62 {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  width: 18px;\n  height: 224px;\n  cursor: pointer;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n .style-module_directDialPlate__zkFHk .style-module_directLineMain__p60DH .style-module_directLineContent__D9N62 .style-module_directLineText__DOhL4 {\n  flex: 1;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  font-size: 12px;\n  font-weight: 600;\n  line-height: 1;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n .style-module_directDialPlate__zkFHk .style-module_directLineMain__p60DH .style-module_directLineContent__D9N62 .style-module_directLine__ngnPh {\n  width: 100%;\n  height: 186px;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n .style-module_directDialPlate__zkFHk .style-module_directCenterCircle__YUrtv {\n  position: absolute;\n  left: 50%;\n  top: 50%;\n  transform: translate(-50%, -50%);\n  width: 28px;\n  height: 28px;\n  border: 6px solid #e0e0e6;\n  background: #f2f3f6;\n  border-radius: 50%;\n  box-sizing: border-box;\n}\n.style-module_commonModalContainer__WHZnl .style-module_commonModalContent__UQ98C .style-module_content__tR9Fh .style-module_directDialPlateBox__tie9n .style-module_directDialPlate__zkFHk .style-module_directCenterCircle__YUrtv.style-module_active__ga2w0 {\n  border-color: rgb(254, 226, 213);\n}";
-var styles$2 = {"commonModalContainer":"style-module_commonModalContainer__WHZnl","commonModalContent":"style-module_commonModalContent__UQ98C","content":"style-module_content__tR9Fh","directOption":"style-module_directOption__IFsis","leftTop":"style-module_leftTop__H39Uk","rightBottom":"style-module_rightBottom__f3c7n","directDialPlateBox":"style-module_directDialPlateBox__tie9n","directDialPlate":"style-module_directDialPlate__zkFHk","directLineMain":"style-module_directLineMain__p60DH","directLineContent":"style-module_directLineContent__D9N62","directLineText":"style-module_directLineText__DOhL4","directLine":"style-module_directLine__ngnPh","directCenterCircle":"style-module_directCenterCircle__YUrtv","active":"style-module_active__ga2w0"};
-styleInject(css_248z$2);
-
-const DirectionLine = (props) => {
-    const { selected = false, ...svgProps } = props;
-    const colorMap = useMemo(() => {
-        if (selected) {
-            return {
-                circleFill: '#FEE2D5',
-                circleStroke: '#FF7133',
-                line: '#FF7133',
-            };
-        }
-        return {
-            circleFill: '#E0E0E6',
-            circleStroke: '#B3B4C3',
-            line: '#D2D2E0',
-        };
-    }, [selected]);
-    return (jsxs("svg", { width: "16", height: "186", viewBox: "0 0 16 186", fill: "none", xmlns: "http://www.w3.org/2000/svg", ...svgProps, children: [jsx("path", { d: "M8.54148 10.4062L7.98535 175.173", stroke: colorMap.line, strokeWidth: "2", strokeDasharray: "5 5" }), jsx("circle", { cx: "8.26392", cy: "177.535", r: "6.67359", fill: colorMap.circleFill, stroke: colorMap.circleStroke, strokeWidth: "2" }), jsx("circle", { cx: "8.26344", cy: "8.47047", r: "6.67359", fill: colorMap.circleFill, stroke: colorMap.circleStroke, strokeWidth: "2" })] }));
-};
-
-var _g$1, _defs$1;
-function _extends$4() { return _extends$4 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$4.apply(null, arguments); }
-var SvgDirectDialPlate = function SvgDirectDialPlate(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$4({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 293,
-    height: 293,
-    fill: "none"
-  }, props), _g$1 || (_g$1 = /*#__PURE__*/React.createElement("g", {
-    clipPath: "url(#direct-dial-plate_svg__a)"
-  }, /*#__PURE__*/React.createElement("g", {
-    opacity: 0.55
-  }, /*#__PURE__*/React.createElement("g", {
-    filter: "url(#direct-dial-plate_svg__b)",
-    shapeRendering: "crispEdges"
-  }, /*#__PURE__*/React.createElement("circle", {
-    cx: 146.549,
-    cy: 146.553,
-    r: 133.643,
-    fill: "#fff",
-    fillOpacity: 0.65
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: 146.549,
-    cy: 146.553,
-    r: 133.643,
-    stroke: "#C1C2D1"
-  })), /*#__PURE__*/React.createElement("g", {
-    filter: "url(#direct-dial-plate_svg__c)",
-    shapeRendering: "crispEdges"
-  }, /*#__PURE__*/React.createElement("circle", {
-    cx: 146.549,
-    cy: 146.553,
-    r: 140,
-    fill: "#fff",
-    fillOpacity: 0.65
-  }), /*#__PURE__*/React.createElement("circle", {
-    cx: 146.549,
-    cy: 146.553,
-    r: 140,
-    stroke: "#fff"
-  })), /*#__PURE__*/React.createElement("circle", {
-    cx: 146.549,
-    cy: 146.553,
-    r: 112,
-    fill: "#fff",
-    transform: "rotate(90 146.549 146.553)"
-  })), /*#__PURE__*/React.createElement("circle", {
-    cx: 146.549,
-    cy: 146.553,
-    r: 115,
-    stroke: "#E0E0E6",
-    strokeWidth: 6
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#E0E0E7",
-    d: "m24.863 157.648-.078-.895 6.163-.54q.037.449.075.896zm6.162-21.672-.076.894-6.159-.539.078-.894zm1.346-10.014q-.079.442-.153.886l-6.08-1.071.157-.885zm-6.074 42.25-.156-.885 6.077-1.072q.074.444.153.886zm2.344 10.398-.234-.868 5.954-1.595q.114.434.23.868zm5.95-62.523q-.117.434-.23.869l-5.953-1.594.233-.869zm3.08-9.641-.307.843-5.788-2.105.308-.844zm-5.788 82.319-.307-.845 5.788-2.107q.152.423.307.844zm4.114 9.833-.38-.815 5.587-2.605q.189.408.381.814zM41.585 97.11q-.191.405-.38.814l-5.587-2.604.38-.815zm-.63 110.924-.45-.778 5.345-3.086q.224.39.45.777zm5.347-119.88q-.228.388-.451.777l-5.344-3.084.45-.778zm.412 128.85-.515-.736 5.064-3.546q.256.369.515.735zm4.55-136.626-5.062-3.543.515-.735 5.062 3.544q-.259.366-.515.734m6.713-8.735q-.29.343-.577.688l-4.74-3.977.576-.688zm-4.74 153.795-.577-.689 4.74-3.977q.287.346.577.688zM72.33 57.402q-.345.286-.69.577l-3.977-4.74.689-.578zm-3.977 183.041-.689-.578 3.978-4.74q.342.29.688.577zm11.29-188.662-3.546-5.063.736-.515 3.545 5.062q-.368.256-.735.517M76.834 246.9l-.735-.516 3.545-5.062q.366.26.734.516zM88.93 45.853q-.39.224-.778.451l-3.087-5.346.779-.449zm-3.084 206.741-.779-.449 3.086-5.345q.388.227.778.451zM97.923 41.206q-.408.188-.814.38l-2.605-5.585.813-.38zm-2.604 216.276-.814-.38 2.604-5.585q.407.191.815.38zm9.86 4.043-.844-.307 2.107-5.788q.422.154.844.306zm2.109-224.158q-.423.15-.845.306l-2.107-5.787.845-.308zm8.07 227.327-.868-.233 1.595-5.951q.434.116.869.229zm1.598-230.331q-.435.113-.869.23l-1.595-5.95.868-.233zm8.817 232.599-.884-.156 1.072-6.076q.441.078.885.153zm1.075-234.742q-.444.075-.885.152l-1.072-6.075.884-.156zm10.037-1.27q-.448.037-.895.076l-.539-6.158.895-.078zm-.535 237.365-.895-.079.539-6.159q.447.04.896.077zm20.4 0-.538-6.162q.448-.036.894-.076l.539 6.16zm.36-237.288q-.446-.04-.894-.077l.538-6.16.894.078zm10.029 1.346q-.443-.077-.886-.153l1.071-6.078.885.156zm.187 234.589-1.071-6.08q.443-.075.886-.152l1.071 6.076zm9.688-232.369q-.434-.116-.868-.23l1.594-5.953.867.234zm.728 230.1-1.595-5.954q.435-.113.87-.23l1.593 5.951zm8.912-227.02q-.42-.154-.843-.306l2.106-5.789.844.307zm1.264 223.853-2.106-5.789.844-.307 2.107 5.788zm9.863-4.044-2.603-5.586q.407-.189.813-.38l2.605 5.587zm-1.788-215.894q-.406-.192-.814-.38l2.604-5.587.815.38zm8.954 4.716a98 98 0 0 0-.777-.451l3.086-5.345.778.45zm2.308 206.291-3.085-5.345q.39-.224.776-.451l3.086 5.347zm6.202-200.813q-.367-.26-.735-.516l3.546-5.064.735.515zm2.809 195.119-3.544-5.064.735-.515 3.545 5.063zm5.192-188.922q-.344-.29-.689-.577l3.977-4.74.689.578zm3.288 182.465-3.977-4.742q.345-.287.688-.578l3.978 4.741zM235.7 72.334q-.287-.345-.577-.69l4.741-3.978.577.689zm4.162 153.103-4.739-3.978q.29-.344.577-.689l4.74 3.978zm1.973-145.059q-.257-.368-.517-.734l5.063-3.545.515.735zm4.549 136.626-5.064-3.547q.26-.366.516-.735l5.063 3.547zm.863-128.074q-.224-.39-.45-.776l5.345-3.086.449.777zm4.897 119.105-5.346-3.087q.226-.387.45-.777l5.345 3.087zm-.25-110.112q-.19-.408-.38-.813l5.585-2.605.38.815zm5.205 100.675-5.585-2.606q.191-.405.381-.813l5.584 2.604zm-1.365-91.309q-.151-.423-.306-.844l5.788-2.107.306.845zm5.482 81.477-5.788-2.108q.155-.421.306-.844l5.789 2.108zm-2.479-71.811q-.114-.435-.23-.869l5.951-1.594.232.869zm5.722 61.656-5.951-1.596q.116-.434.229-.867l5.954 1.595zm-3.578-51.762q-.076-.444-.153-.886l6.078-1.071.156.885zm5.923 41.363-6.076-1.072.153-.885 6.079 1.072zm-4.654-31.325q-.035-.447-.075-.894l6.156-.538.079.894zm6.084 20.762-6.159-.54q.04-.447.075-.895l6.162.54z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#B3B4C3",
-    d: "M142.291 27.432v-11h1.684l5.82 8.27-1.339-.693h.97v-7.577h1.865v11h-1.677l-5.819-8.279 1.338.694h-.97v7.585zM57.438 66.693l-4.982-4.982.466-.466 7.337 1.287-.497.152.248-.248-4.14-4.14.463-.463 4.983 4.983-.453.452-7.354-1.278.5-.155-.248.249 4.143 4.143zM63.66 60.471l-6.353-3.611.49-.49 5.342 3.159.034-.035-3.052-5.448.466-.466 5.452 3.048.031-.03-3.156-5.346.487-.486 3.612 6.352-.435.436-5.387-2.942-.034.034 2.942 5.387zM52.28 232.95q-.53-.53-.753-1.105a2.3 2.3 0 0 1-.152-1.119q.07-.546.428-.98l.035-.042.47.47-.035.041a1.2 1.2 0 0 0-.27.698q-.024.396.163.818.189.424.573.808.376.376.79.542.419.162.801.11.387-.055.667-.335l.003-.003a1.07 1.07 0 0 0 .325-.843q-.022-.497-.466-1.204l-.398-.625q-.583-.922-.593-1.582-.007-.663.507-1.177l.004-.004q.397-.397.922-.486a2.1 2.1 0 0 1 1.09.11 2.9 2.9 0 0 1 1.064.704q.487.487.687 1.033.203.549.135 1.06-.063.51-.394.897l-.038.045-.47-.469.032-.045a1.2 1.2 0 0 0 .234-.628q.032-.357-.124-.739a2.15 2.15 0 0 0-.51-.732 2.2 2.2 0 0 0-.736-.501 1.47 1.47 0 0 0-.76-.11q-.367.048-.646.328l-.003.003a.98.98 0 0 0-.297.794q.03.467.47 1.16l.393.629q.405.638.539 1.139.138.504.028.911a1.7 1.7 0 0 1-.456.753l-.004.004a1.9 1.9 0 0 1-.994.545q-.552.103-1.14-.117-.586-.222-1.122-.756M56.209 236.672l3.611-6.353.49.49-3.159 5.341.035.035 5.448-3.052.466.466-3.049 5.452.032.031 5.344-3.156.487.487-6.353 3.611-.435-.435 2.942-5.386-.035-.035-5.386 2.942zM235.144 238.465q-.529.528-1.105.753a2.3 2.3 0 0 1-1.119.151 1.9 1.9 0 0 1-.98-.428l-.042-.034.47-.47.041.035q.301.245.698.269a1.75 1.75 0 0 0 .818-.162 2.7 2.7 0 0 0 .808-.573q.377-.377.542-.791.162-.417.111-.801a1.15 1.15 0 0 0-.335-.666l-.004-.004a1.07 1.07 0 0 0-.842-.324q-.498.02-1.205.466l-.625.397q-.922.583-1.581.594-.663.006-1.178-.508l-.003-.003a1.7 1.7 0 0 1-.487-.922 2.1 2.1 0 0 1 .11-1.091q.208-.566.705-1.064a2.9 2.9 0 0 1 1.032-.687q.549-.203 1.06-.134.511.061.898.393l.045.038-.47.47-.045-.031a1.18 1.18 0 0 0-.628-.235 1.6 1.6 0 0 0-.739.124 2.2 2.2 0 0 0-.732.511q-.345.346-.501.736a1.5 1.5 0 0 0-.11.759q.048.366.328.646l.003.003a.98.98 0 0 0 .794.297q.466-.03 1.161-.469l.628-.394q.64-.404 1.139-.539.504-.138.912-.027.406.11.753.456l.003.003q.442.442.545.994.104.553-.117 1.14-.22.587-.756 1.122M237.875 235.527l-4.982-4.983 3.007-3.007.425.425-2.538 2.538 1.796 1.795 2.413-2.414.421.422-2.413 2.413 1.916 1.916 2.538-2.537.424.424zM226.781 57.137l4.982-4.983.467.466-1.288 7.337-.152-.497.248.249 4.14-4.14.463.463-4.982 4.982-.453-.452 1.278-7.355.155.501-.248-.249-4.144 4.144zM231.943 62.298l4.982-4.982 3.008 3.007-.425.425-2.538-2.538-1.795 1.796 2.413 2.413-.421.421-2.413-2.413-1.917 1.916 2.538 2.538-.425.425zM266.486 152.604l-.197-11.065 6.803-.135.03 1.664-4.924.098.053 2.998 4.655-.092.028 1.572-4.655.092.057 3.167 4.923-.097.03 1.664zM146.805 276.672q-1.278 0-2.222-.378-.936-.377-1.476-1.052a2.8 2.8 0 0 1-.609-1.576l-.008-.102h1.903l.007.073q.047.443.366.77.327.326.867.515.541.182 1.233.182.663 0 1.172-.196.51-.196.799-.538.29-.348.29-.798v-.008a1.11 1.11 0 0 0-.465-.922q-.464-.363-1.529-.581l-1.18-.232q-1.69-.342-2.458-1.089-.762-.756-.761-1.924v-.007q0-.937.517-1.641.525-.705 1.439-1.097.92-.399 2.108-.399 1.218 0 2.108.392.89.384 1.4 1.053.51.667.571 1.51l.008.094h-1.872l-.016-.087a1.34 1.34 0 0 0-.357-.719 1.9 1.9 0 0 0-.754-.493 3.1 3.1 0 0 0-1.103-.182q-.602 0-1.073.182-.473.174-.746.493-.267.32-.267.77v.007q0 .552.449.915.457.363 1.484.567l1.18.239q1.157.233 1.88.617.723.385 1.058.959.342.565.342 1.365v.007q0 1.016-.525 1.757-.518.74-1.484 1.147-.959.407-2.276.407M16.514 152.004l-2.706-10h1.874l1.734 7.505h.098l1.993-7.505h1.601l2.014 7.505h.098l1.728-7.505h1.86l-2.7 10h-1.692l-2.056-7.159h-.105l-2.042 7.159z"
-  }))), _defs$1 || (_defs$1 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("filter", {
-    id: "direct-dial-plate_svg__b",
-    width: 276.285,
-    height: 276.285,
-    x: 8.406,
-    y: 8.41,
-    colorInterpolationFilters: "sRGB",
-    filterUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/React.createElement("feFlood", {
-    floodOpacity: 0,
-    result: "BackgroundImageFix"
-  }), /*#__PURE__*/React.createElement("feColorMatrix", {
-    "in": "SourceAlpha",
-    result: "hardAlpha",
-    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-  }), /*#__PURE__*/React.createElement("feOffset", null), /*#__PURE__*/React.createElement("feGaussianBlur", {
-    stdDeviation: 2
-  }), /*#__PURE__*/React.createElement("feComposite", {
-    in2: "hardAlpha",
-    operator: "out"
-  }), /*#__PURE__*/React.createElement("feColorMatrix", {
-    values: "0 0 0 0 0.0683333 0 0 0 0 0.103468 0 0 0 0 0.133333 0 0 0 0.25 0"
-  }), /*#__PURE__*/React.createElement("feBlend", {
-    in2: "BackgroundImageFix",
-    result: "effect1_dropShadow_10512_51195"
-  }), /*#__PURE__*/React.createElement("feBlend", {
-    "in": "SourceGraphic",
-    in2: "effect1_dropShadow_10512_51195",
-    result: "shape"
-  })), /*#__PURE__*/React.createElement("filter", {
-    id: "direct-dial-plate_svg__c",
-    width: 291,
-    height: 291,
-    x: 1.049,
-    y: 1.053,
-    colorInterpolationFilters: "sRGB",
-    filterUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/React.createElement("feFlood", {
-    floodOpacity: 0,
-    result: "BackgroundImageFix"
-  }), /*#__PURE__*/React.createElement("feColorMatrix", {
-    "in": "SourceAlpha",
-    result: "hardAlpha",
-    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-  }), /*#__PURE__*/React.createElement("feOffset", null), /*#__PURE__*/React.createElement("feGaussianBlur", {
-    stdDeviation: 2.5
-  }), /*#__PURE__*/React.createElement("feComposite", {
-    in2: "hardAlpha",
-    operator: "out"
-  }), /*#__PURE__*/React.createElement("feColorMatrix", {
-    values: "0 0 0 0 0.0683333 0 0 0 0 0.103468 0 0 0 0 0.133333 0 0 0 0.5 0"
-  }), /*#__PURE__*/React.createElement("feBlend", {
-    in2: "BackgroundImageFix",
-    result: "effect1_dropShadow_10512_51195"
-  }), /*#__PURE__*/React.createElement("feBlend", {
-    "in": "SourceGraphic",
-    in2: "effect1_dropShadow_10512_51195",
-    result: "shape"
-  })), /*#__PURE__*/React.createElement("clipPath", {
-    id: "direct-dial-plate_svg__a"
-  }, /*#__PURE__*/React.createElement("path", {
-    fill: "#fff",
-    d: "M.549 292.553v-292h292v292z"
-  })))));
-};
-
-var _g, _defs;
-function _extends$3() { return _extends$3 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$3.apply(null, arguments); }
-var SvgOption = function SvgOption(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$3({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 22,
-    height: 18,
-    fill: "none"
-  }, props), _g || (_g = /*#__PURE__*/React.createElement("g", {
-    filter: "url(#option_svg__a)"
-  }, /*#__PURE__*/React.createElement("mask", {
-    id: "option_svg__b",
-    width: 18,
-    height: 15,
-    x: 2,
-    y: 0.612,
-    fill: "#000",
-    maskUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/React.createElement("path", {
-    fill: "#fff",
-    d: "M2 .612h18v15H2z"
-  }), /*#__PURE__*/React.createElement("path", {
-    d: "M4 4.39a1 1 0 0 1 1.599-.801l4.419 3.302h7.27v1.992H10.32L5.6 12.412A1 1 0 0 1 4 11.61z"
-  })), /*#__PURE__*/React.createElement("path", {
-    fill: "currentColor",
-    d: "M4 4.39a1 1 0 0 1 1.599-.801l4.419 3.302h7.27v1.992H10.32L5.6 12.412A1 1 0 0 1 4 11.61z"
-  }), /*#__PURE__*/React.createElement("path", {
-    fill: "#F5F6F8",
-    d: "M5.599 3.589 4.4 5.19zm4.419 3.302L8.82 8.493l.533.398h.665zm7.27 0h2v-2h-2zm0 1.992v2h2v-2zm-6.968 0v-2h-.665l-.532.398zM5.6 12.412l1.196 1.603.001-.001zM4 11.61H2v.001zm0-7.22h2a1 1 0 0 1-1.599.8L5.6 3.59l1.197-1.602C4.818.509 2 1.919 2 4.39zm1.599-.801L4.402 5.19 8.82 8.493l1.198-1.602 1.197-1.603-4.42-3.301zm4.419 3.302v2h7.27v-4h-7.27zm7.27 0h-2v1.992h4V6.89zm0 1.992v-2H10.32v4h6.967zm-6.968 0L9.123 7.28 4.4 10.81 5.6 12.411l1.197 1.602 4.722-3.53zM5.6 12.412l-1.197-1.603a1 1 0 0 1 1.598.8l-2 .001-2 .001c0 2.466 2.815 3.882 4.795 2.404zM4 11.61h2V4.39H2v7.22z",
-    mask: "url(#option_svg__b)"
-  }))), _defs || (_defs = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("filter", {
-    id: "option_svg__a",
-    width: 21.287,
-    height: 17.232,
-    x: 0,
-    y: 0.384,
-    colorInterpolationFilters: "sRGB",
-    filterUnits: "userSpaceOnUse"
-  }, /*#__PURE__*/React.createElement("feFlood", {
-    floodOpacity: 0,
-    result: "BackgroundImageFix"
-  }), /*#__PURE__*/React.createElement("feColorMatrix", {
-    "in": "SourceAlpha",
-    result: "hardAlpha",
-    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 127 0"
-  }), /*#__PURE__*/React.createElement("feOffset", {
-    dy: 1
-  }), /*#__PURE__*/React.createElement("feGaussianBlur", {
-    stdDeviation: 1
-  }), /*#__PURE__*/React.createElement("feComposite", {
-    in2: "hardAlpha",
-    operator: "out"
-  }), /*#__PURE__*/React.createElement("feColorMatrix", {
-    values: "0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0 0.25 0"
-  }), /*#__PURE__*/React.createElement("feBlend", {
-    in2: "BackgroundImageFix",
-    result: "effect1_dropShadow_13071_1578"
-  }), /*#__PURE__*/React.createElement("feBlend", {
-    "in": "SourceGraphic",
-    in2: "effect1_dropShadow_13071_1578",
-    result: "shape"
-  })))));
-};
-
-// json中返回的是多选方向的加值，所以需要拆开
-function convertDirectionToParams(value) {
-    const A = 1 << 0; // bit0 = 1
-    const B = 1 << 1; // bit1 = 2
-    const C = 1 << 2; // bit2 = 4
-    const D = 1 << 3; // bit3 = 8
-    const E = 1 << 4; // bit4 = 16
-    const F = 1 << 5; // bit5 = 32
-    const directions = [];
-    // 检查每个位标志是否被设置
-    if (value & A)
-        directions.push(A);
-    if (value & B)
-        directions.push(B);
-    if (value & C)
-        directions.push(C);
-    if (value & D)
-        directions.push(D);
-    if (value & E)
-        directions.push(E);
-    if (value & F)
-        directions.push(F);
-    return directions;
-}
-
-const DEFAULT_LIST = [
-    {
-        value: 1 << 0,
-        text: 'A',
-        selected: false,
-    },
-    {
-        value: 1 << 1,
-        text: 'B',
-        selected: false,
-    },
-    {
-        value: 1 << 2,
-        text: 'C',
-        selected: false,
-    },
-    {
-        value: 1 << 3,
-        text: 'D',
-        selected: false,
-    },
-    {
-        value: 1 << 4,
-        text: 'E',
-        selected: false,
-    },
-    {
-        value: 1 << 5,
-        text: 'F',
-        selected: false,
-    },
-];
-const MowDirection_L = (props) => {
-    const { value, angleValue, optionAngle = 45, zIndex = 10000, onChange,
-    // children,
-     } = props;
-    const [angle, setAngle] = useState(0);
-    const lineList = useMemo(() => {
-        return DEFAULT_LIST.map((item) => ({
-            ...item,
-            selected: convertDirectionToParams(value).includes(item.value),
-        }));
-    }, [value]);
-    // const [lineList, setLineList] = useState<LineItem[]>([
-    //   {
-    //     value: 1 << 0,
-    //     text: 'A',
-    //     selected: false,
-    //   },
-    //   {
-    //     value: 1 << 1,
-    //     text: 'B',
-    //     selected: false,
-    //   },
-    //   {
-    //     value: 1 << 2,
-    //     text: 'C',
-    //     selected: false,
-    //   },
-    //   {
-    //     value: 1 << 3,
-    //     text: 'D',
-    //     selected: false,
-    //   },
-    //   {
-    //     value: 1 << 4,
-    //     text: 'E',
-    //     selected: false,
-    //   },
-    //   {
-    //     value: 1 << 5,
-    //     text: 'F',
-    //     selected: false,
-    //   },
-    // ]);
-    const hitRectAngle = useMemo(() => {
-        const direction = lineList
-            ?.filter((item) => item?.selected)
-            ?.reduce((pre, line) => {
-            return pre + line.value;
-        }, 0);
-        const angles = getSelectAngles(direction)?.map((item) => item + angleValue);
-        return angles?.includes(optionAngle);
-    }, [lineList, angleValue, optionAngle]);
-    const allSelect = useMemo(() => {
-        return lineList?.every((item) => item?.selected);
-    }, [lineList]);
-    useEffect(() => {
-        setAngle(angleValue);
-    }, [angleValue]);
-    console.log('hitRectAngle-->', hitRectAngle);
-    const onLineClick = (index) => {
-        const newLine = lineList.map((line, i) => {
-            if (i === index) {
-                return {
-                    ...line,
-                    selected: !line.selected,
-                };
-            }
-            return { ...line };
-        });
-        onChange?.(newLine
-            ?.filter((item) => item?.selected)
-            .reduce((pre, line) => {
-            return pre + line.value;
-        }, 0));
-    };
-    return (jsx("div", { className: styles$2.commonModalContainer, style: { zIndex }, children: jsx("div", { className: styles$2.commonModalContent, children: jsxs("div", { className: styles$2.content, children: [jsx("div", { className: styles$2.directDialPlateBox, children: jsxs("div", { className: styles$2.directDialPlate, children: [jsx(SvgDirectDialPlate, {}), jsx("div", { className: styles$2.directLineMain, style: {
-                                        transform: `rotate(${angle}deg)`,
-                                    }, children: lineList.map((line, index) => (jsxs("div", { className: styles$2.directLineContent, style: {
-                                            transform: `translate(-50%, -50%) rotate(${30 * index}deg)`,
-                                        }, children: [jsx("div", { className: styles$2.directLineText, style: {
-                                                    color: line.selected ? '#FF996C' : '#B3B4C3',
-                                                }, children: line.text }), jsx(DirectionLine, { className: styles$2.directLine, selected: line.selected, onClick: () => onLineClick(index) }), jsx("div", { className: styles$2.directLineText, style: {
-                                                    transform: 'rotate(180deg)',
-                                                    color: line.selected ? '#FF996C' : '#B3B4C3',
-                                                }, children: line.text })] }, line.value))) }), jsx("div", { className: classNames(styles$2.directCenterCircle, {
-                                        [styles$2.active]: allSelect && hitRectAngle,
-                                    }) })] }) }), jsxs("div", { className: styles$2.directOption, style: {
-                            transform: `rotate(${optionAngle}deg)`,
-                            color: hitRectAngle ? '#FF996C' : '#B3B4C3',
-                        }, children: [jsx("div", { className: styles$2.leftTop, children: jsx(SvgOption, {}) }), jsx("div", { className: styles$2.rightBottom, children: jsx(SvgOption, {}) })] })] }) }) }));
-};
-
-const BoundarySvgRender = React__default.memo(({ mapJson, id, maxWidth = 300 }) => {
-    const svgElementData = useMemo(() => {
-        const data = UnifiedMapDataProcessor.processMapData(mapJson, DEFAULT_STYLES) || {};
-        return data;
-    }, [mapJson, DEFAULT_STYLES]);
-    const boundaryInfo = useMemo(() => {
-        const boundary = svgElementData.boundary.find((item) => item.id === id);
-        return boundary;
-    }, [id, svgElementData]);
-    // 计算当前boundary的viewBox
-    const boundaryViewBox = useMemo(() => {
-        if (!boundaryInfo?.points || boundaryInfo.points.length === 0) {
-            return null;
-        }
-        // 计算边界
-        let minX = Infinity;
-        let minY = Infinity;
-        let maxX = -Infinity;
-        let maxY = -Infinity;
-        boundaryInfo.points.forEach((point) => {
-            minX = Math.min(minX, point[0]);
-            minY = Math.min(minY, point[1]);
-            maxX = Math.max(maxX, point[0]);
-            maxY = Math.max(maxY, point[1]);
-        });
-        // 添加边距
-        const padding = 50;
-        const width = maxX - minX + padding * 2;
-        const height = maxY - minY + padding * 2;
-        return {
-            x: minX - padding,
-            y: minY - padding,
-            width,
-            height,
-        };
-    }, [boundaryInfo]);
-    const style = useMemo(() => {
-        if (boundaryViewBox?.width > boundaryViewBox?.height) {
-            return {
-                width: maxWidth,
-                height: maxWidth * (boundaryViewBox.height / boundaryViewBox.width),
-            };
-        }
-        return {
-            width: maxWidth * (boundaryViewBox.height / boundaryViewBox.width),
-            height: maxWidth,
-        };
-    }, [boundaryViewBox, maxWidth]);
-    return (jsxs("div", { style: {
-            position: 'relative',
-            width: style.width,
-            height: style.height,
-            margin: '0 auto',
-        }, children: [jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `${boundaryViewBox.x} ${boundaryViewBox.y} ${boundaryViewBox.width} ${boundaryViewBox.height}`, width: `${style.width}px`, height: `${style.height}px`, style: { position: 'absolute', inset: 0, pointerEvents: 'none' }, children: Object.keys(svgElementData)?.map((key) => {
-                    return svgElementData[key]?.map((element) => {
-                        if (key === DataType.VISION_OFF)
-                            return null;
-                        return (jsx(GElement, { type: key, data: svgElementData[key], children: jsx(SvgElement, { type: key, data: element, onSelect: () => { }, onCancel: () => { } }, element.id) }, key));
-                    });
-                }) }), jsx(CharginPile, { mapData: mapJson, mapConfig: DEFAULT_STYLES, viewBox: boundaryViewBox || null, rotation: 0 })] }));
-});
-
-const DirectionModal = ({ directionInfo, open, setOpen, zoneName, optionAngle, onChange, }) => {
-    const { mapJson, mapConfig } = useCommonContext();
-    const { editMapInfo } = useMapEditContext();
-    const [directions, setDirections] = useState(ALL_DIRECTION_SELECTED);
-    const [angle, setAngle] = useState(MIN_DIRECTION_ANGLE);
-    const canSetDefault = useMemo(() => {
-        const angles = getSelectAngles(directions)?.map((item) => item + angle);
-        const hitRectAngle = angles?.includes(optionAngle);
-        return directions !== ALL_DIRECTION_SELECTED || !hitRectAngle;
-    }, [directions, angle]);
-    const canSave = useMemo(() => {
-        return directions !== directionInfo?.direction || angle !== directionInfo?.angle;
-    }, [directions, angle, directionInfo]);
-    useEffect(() => {
-        if (!open)
-            return;
-        setDirections(directionInfo.direction);
-        setAngle(directionInfo.angle);
-    }, [directionInfo, open]);
-    const resetDirection = () => {
-        setDirections(ALL_DIRECTION_SELECTED);
-        const defaultAngle = getDefaultAngle(optionAngle);
-        console.log('defaultAngle=>', defaultAngle, optionAngle);
-        if (defaultAngle) {
-            setAngle(defaultAngle);
-        }
-    };
-    const handleCancel = useCallback(() => {
-        if (!canSave) {
-            setOpen(false);
-            return;
-        }
-        Modal.confirm({
-            icon: null,
-            centered: true,
-            title: 'Exit editing',
-            content: 'Changes you made will not be saved. Are you sure you want to exit editing the mowing direction?',
-            onOk: () => {
-                setOpen(false);
-            },
-            okText: 'Exit',
-            cancelText: 'Continue editing',
-        });
-    }, [canSave, setOpen]);
-    console.log('directionInfo=>', directionInfo, mapJson);
-    return (jsx(CustomModal, { maskClosable: false, titleCenter: true, title: `${zoneName} mowing direction`, open: open, width: 600, onCancel: handleCancel, onOk: () => {
-            onChange?.(directions, angle);
-            setOpen(false);
-        }, okText: "Confirm", cancelText: "Cancel", okButtonProps: { disabled: !canSave }, afterClose: () => {
-            setDirections(ALL_DIRECTION_SELECTED);
-            setAngle(MIN_DIRECTION_ANGLE);
-        }, children: jsxs("div", { className: styles$3.directions, children: [jsx("div", { className: styles$3.default, children: jsx(Button, { disabled: !canSetDefault, variant: "link", color: "primary", onClick: resetDirection, children: "Default" }) }), jsx("div", { className: styles$3.tips, children: "\u4E00\u4E2A\u7B80\u77ED\u7684\u8BF4\u660E\uFF0C\u5E0C\u671B\u80FD\u5145\u5F53\u7B80\u5355\u7684\u6559\u7A0B\uFF0C\u9700\u8981\u53EF\u5FC3\u6839\u636EC\u7AEF\u5DF2\u6709\u7684\u6574\u5408\u4E00\u4E0B" }), jsxs("div", { className: styles$3.optimal, children: [jsx("div", { children: "*" }), jsx(SvgOption, {}), jsx("div", { className: styles$3.text, children: "Optimal direction" })] }), jsxs("div", { className: styles$3.content, children: [jsx("div", { className: styles$3.background, children: jsx(BoundarySvgRender, { mapJson: mapJson, id: editMapInfo.selectElement.id }) }), jsx("div", { className: styles$3.luppan, children: jsx(MowDirection_L, { value: directions, angleValue: angle, optionAngle: optionAngle, onChange: (value) => {
-                                    console.log('valie=>', value);
-                                    if (!value)
-                                        return message.warning('Choose at least one mowing direction');
-                                    setDirections(value);
-                                } }) })] }), jsx("div", { className: styles$3.slideTip, children: "\u7528\u6237\u8FD8\u53EF\u4EE5\u901A\u8FC7\u6ED1\u8F68\u5FAE\u8C03\u5272\u8349\u65B9\u5411\uFF08\u975E\u5FC5\u987B\uFF09" }), jsx("div", { className: styles$3.slider, children: jsx(Slider, { tooltip: {
-                            formatter: (value) => `${value}°`,
-                        }, min: MIN_DIRECTION_ANGLE, max: MAX_DIRECTION_ANGLE, value: angle, onChange: (value) => setAngle(value) }) })] }) }));
-};
-
-const BoundaryInfo = ({ onHandleDelete }) => {
-    const { unitType, heightOptions, globalHeight } = useCommonContext();
-    const { editMapInfo, setEditMapInfo } = useMapEditContext();
-    const nameValue = editMapInfo.selectElement?.name;
-    const onHandleFocus = () => { };
-    const [open, setOpen] = useState(false);
-    const [heightOpen, setHeightOpen] = useState(false);
-    const [directionOpen, setDirectionOpen] = useState(false);
-    const sizeValue = useMemo(() => {
-        const points = editMapInfo.selectElement?.points?.map((item) => [
-            item[0] / SCALE_FACTOR,
-            item[1] / SCALE_FACTOR,
-        ]);
-        const { area: areaValue, perimeter: perimeterValue } = calculatePolygonAreaAndPerimeter(points) || {};
-        const formatArea = convertAreaByUnits(areaValue);
-        const formatPerimeter = convertDistanceByUnits(perimeterValue);
-        return {
-            area: formatArea.value,
-            perimeter: formatPerimeter.value,
-        };
-    }, [editMapInfo.selectElement]);
-    const edgeMowingValue = useMemo(() => {
-        return {
-            edgeMowing: editMapInfo?.selectElement?.edgeMowing,
-            obstacleMowEdge: editMapInfo?.selectElement?.obstacleMowEdge,
-        };
-    }, [editMapInfo.selectElement]);
-    const heightValue = useMemo(() => {
-        return {
-            isFlowGlobal: editMapInfo?.selectElement?.isFlowGlobal,
-            cuttingHeight: editMapInfo?.selectElement?.cuttingHeight,
-        };
-    }, [editMapInfo.selectElement]);
-    const directionInfo = useMemo(() => {
-        return {
-            direction: editMapInfo?.selectElement?.direction,
-            angle: editMapInfo?.selectElement?.angle,
-        };
-    }, [editMapInfo.selectElement?.direction, editMapInfo.selectElement?.angle]);
-    const optionAngle = useMemo(() => {
-        return editMapInfo?.selectElement?.recBaseAngle;
-    }, [editMapInfo.selectElement?.recBaseAngle]);
-    console.log('height---->', editMapInfo?.selectElement, heightValue, edgeMowingValue);
-    return (jsxs("div", { className: styles$9.boundaryInfo, children: [jsx(Header, { handleDelete: onHandleDelete, handleFocus: onHandleFocus, type: editMapInfo.elementType }), jsx("div", { className: styles$9.nameEdit, children: jsx(NameEdit, { title: "Boundary name", name: nameValue, onChange: (name) => {
-                        setEditMapInfo({
-                            ...editMapInfo,
-                            isShowDrag: false,
-                            selectElement: {
-                                ...editMapInfo.selectElement,
-                                name: name,
-                            },
-                        });
-                    } }) }), jsx("div", { className: styles$9.border }), jsxs("div", { className: styles$9.otherEdit, children: [jsx(Item, { children: jsxs("div", { className: styles$9.otherItem, children: [jsx("div", { className: styles$9.label, children: "Cutting height" }), jsx("div", { className: styles$9.value, children: generateHeightStr(heightValue?.cuttingHeight, unitType, true) }), jsx("div", { className: styles$9.icon, onClick: () => {
-                                        setHeightOpen(true);
-                                    }, children: jsx(SvgArrow, {}) })] }) }), jsx(Item, { children: jsxs("div", { className: styles$9.otherItem, children: [jsx("div", { className: styles$9.label, children: "Mowing direction" }), jsx("div", { className: styles$9.value }), jsx("div", { className: styles$9.icon, onClick: () => {
-                                        setDirectionOpen(true);
-                                    }, children: jsx(SvgArrow, {}) })] }) }), jsx(Item, { children: jsxs("div", { className: styles$9.otherItem, children: [jsx("div", { className: styles$9.label, children: "Edge mowing" }), jsx("div", { className: styles$9.value }), jsx("div", { className: styles$9.icon, onClick: () => {
-                                        setOpen(true);
-                                    }, children: jsx(SvgArrow, {}) })] }) })] }), jsx("div", { className: styles$9.border }), jsxs("div", { className: styles$9.areaInfo, children: [jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Area:" }), jsx("div", { className: styles$9.value, children: sizeValue?.area })] }), jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Perimeter:" }), jsx("div", { className: styles$9.value, children: sizeValue?.perimeter })] })] }), jsx(MowingEdgeModal, { value: edgeMowingValue, onChange: (value) => {
-                    setEditMapInfo({
-                        ...editMapInfo,
-                        selectElement: {
-                            ...editMapInfo.selectElement,
-                            edgeMowing: value.edgeMowing ? 1 : 0,
-                            obstacleMowEdge: value.obstacleMowEdge ? 1 : 0,
-                        },
-                    });
-                }, open: open, setOpen: setOpen }), jsx(HeightModal, { zoneName: editMapInfo.selectElement?.name, heightOptions: heightOptions, globalHeight: globalHeight, open: heightOpen, setOpen: setHeightOpen, value: heightValue, onChange: (value) => {
-                    setEditMapInfo({
-                        ...editMapInfo,
-                        selectElement: {
-                            ...editMapInfo.selectElement,
-                            cuttingHeight: value.cuttingHeight,
-                            isFlowGlobal: value.isFlowGlobal,
-                        },
-                    });
-                } }), jsx(DirectionModal, { directionInfo: directionInfo, optionAngle: optionAngle, open: directionOpen, setOpen: setDirectionOpen, zoneName: editMapInfo.selectElement?.name, onChange: (direction, angle) => {
-                    setEditMapInfo({
-                        ...editMapInfo,
-                        selectElement: {
-                            ...editMapInfo.selectElement,
-                            direction,
-                            angle,
-                        },
-                    });
-                } })] }));
-};
-
-var css_248z$1 = ".index-module_timePeriod__EkVZl {\n  display: flex;\n  flex-direction: column;\n}\n.index-module_timePeriod__EkVZl .index-module_timePeriodHeader__CgJGW {\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n  padding: 4px 0;\n}\n.index-module_timePeriod__EkVZl .index-module_timePeriodHeader__CgJGW .index-module_timePeriodTitle__lnYno {\n  font-weight: 400;\n  font-size: 14px;\n  line-height: 16px;\n  color: rgb(0, 0, 0);\n}\n.index-module_timePeriod__EkVZl .index-module_timePeriodHeader__CgJGW .index-module_timePeriodHandle__pjDTA {\n  margin-left: auto;\n  display: flex;\n  align-items: center;\n  justify-content: flex-start;\n}\n.index-module_timePeriod__EkVZl .index-module_timePeriodContent__pTqdW {\n  margin-top: 4px;\n}\n.index-module_timePeriod__EkVZl .index-module_timePeriodContent__pTqdW .index-module_timePeriodRadioItem__3rd-r {\n  line-height: 28px;\n}";
-var styles$1 = {"timePeriod":"index-module_timePeriod__EkVZl","timePeriodHeader":"index-module_timePeriodHeader__CgJGW","timePeriodTitle":"index-module_timePeriodTitle__lnYno","timePeriodHandle":"index-module_timePeriodHandle__pjDTA","timePeriodContent":"index-module_timePeriodContent__pTqdW","timePeriodRadioItem":"index-module_timePeriodRadioItem__3rd-r"};
-styleInject(css_248z$1);
-
-var RadioValue;
-(function (RadioValue) {
-    RadioValue[RadioValue["LONG_TIME"] = 0] = "LONG_TIME";
-    RadioValue[RadioValue["SHORT_TIME"] = 1] = "SHORT_TIME";
-})(RadioValue || (RadioValue = {}));
-const TimePeriod = ({ value, onChange }) => {
-    // eslint-disable-next-line no-undef
-    const [date, setDate] = useState();
-    const [open, setOpen] = useState(false);
-    const [radioValue, setRadioValue] = useState(RadioValue.LONG_TIME);
-    console.log('time period->', date, radioValue);
-    useEffect(() => {
-        if (!open && date?.length !== 2) {
-            setRadioValue(RadioValue.LONG_TIME);
-        }
-    }, [open]);
-    return (jsxs("div", { className: styles$1.timePeriod, children: [jsxs("div", { className: styles$1.timePeriodHeader, children: [jsx("div", { className: styles$1.timePeriodTitle, children: "Enabled" }), jsx("div", { className: styles$1.timePeriodHandle, children: jsx(Switch, { checked: value.status === 1, onChange: (checked) => {
-                                onChange({
-                                    ...value,
-                                    status: checked ? 1 : 0,
-                                    start_timestamp: checked ? value.start_timestamp : 0,
-                                    end_timestamp: checked ? value.end_timestamp : 0,
-                                });
-                            } }) })] }), jsx("div", { className: styles$1.timePeriodContent, children: jsxs(Radio.Group, { value: radioValue, onChange: (e) => {
-                        setRadioValue(e.target.value);
-                        if (e.target.value === RadioValue.LONG_TIME) {
-                            setDate(null);
-                            onChange({
-                                ...value,
-                                start_timestamp: 0,
-                                end_timestamp: 0,
-                            });
-                        }
-                        else if (e.target.value === RadioValue.SHORT_TIME) {
-                            setOpen(true);
-                            // onChange({
-                            //   ...value,
-                            //   startTimestamp: dayjs().add(30, 'minute').unix(),
-                            //   endTimestamp: dayjs().add(1, 'hour').unix(),
-                            // });
-                        }
-                    }, style: { display: 'flex', flexDirection: 'column', gap: '4px' }, children: [jsx(Radio, { value: RadioValue.LONG_TIME, children: jsx("div", { className: styles$1.timePeriodRadioItem, children: "Always" }) }), jsx(Radio, { value: RadioValue.SHORT_TIME, children: jsx("div", { className: styles$1.timePeriodRadioItem, children: jsx(DatePicker.RangePicker, { open: open, value: date ? date : undefined, disabled: radioValue === RadioValue.LONG_TIME, showTime: { format: 'HH:mm' }, format: "MM/DD/YYYY HH:mm", preserveInvalidOnBlur: true, onOpenChange: (open) => {
-                                        setOpen(open);
-                                    }, onChange: (dateValue, dateString) => {
-                                        setDate(dateValue);
-                                        if (dateValue?.length === 2) {
-                                            onChange({
-                                                status: RadioValue.SHORT_TIME,
-                                                start_timestamp: dateValue[0].unix(),
-                                                end_timestamp: dateValue[1].unix(),
-                                            });
-                                        }
-                                    } }) }) })] }) })] }));
-};
-
-const ObstacleInfo = ({ onHandleDelete }) => {
-    const { editMapInfo, setEditMapInfo } = useMapEditContext();
-    const nameValue = editMapInfo.selectElement?.name;
-    console.log('obstacle->', editMapInfo.selectElement);
-    const timePeriodValue = useMemo(() => {
-        if (!editMapInfo.selectElement)
-            return null;
-        const status = editMapInfo.selectElement?.status;
-        const start_timestamp = editMapInfo.selectElement?.start_timestamp;
-        const end_timestamp = editMapInfo.selectElement?.end_timestamp;
-        return {
-            status,
-            start_timestamp,
-            end_timestamp,
-        };
-    }, [editMapInfo.selectElement]);
-    const sizeValue = useMemo(() => {
-        const points = editMapInfo.selectElement?.points?.map((item) => [
-            item[0] / SCALE_FACTOR,
-            item[1] / SCALE_FACTOR,
-        ]);
-        const { area: areaValue, perimeter: perimeterValue } = calculatePolygonAreaAndPerimeter(points) || {};
-        const formatArea = convertAreaByUnits(areaValue);
-        const formatPerimeter = convertDistanceByUnits(perimeterValue);
-        return {
-            area: formatArea.value,
-            perimeter: formatPerimeter.value,
-        };
-    }, [editMapInfo.selectElement]);
-    return (jsxs("div", { className: styles$9.obstacleInfo, children: [jsx(Header, { handleDelete: () => {
-                    onHandleDelete();
-                }, handleFocus: () => { }, type: editMapInfo.elementType }), jsx("div", { className: styles$9.nameEdit, children: jsx(NameEdit, { title: "Obstacle name", name: nameValue, onChange: (name) => {
-                        setEditMapInfo({
-                            ...editMapInfo,
-                            isShowDrag: false,
-                            selectElement: {
-                                ...editMapInfo.selectElement,
-                                name: name,
-                            },
-                        });
-                    } }) }), jsx("div", { className: styles$9.border }), jsx("div", { className: styles$9.timePeriod, children: jsx(TimePeriod, { value: timePeriodValue, onChange: (value) => {
-                        setEditMapInfo({
-                            ...editMapInfo,
-                            isShowDrag: editMapInfo?.isShowDrag || false,
-                            selectElement: {
-                                ...editMapInfo.selectElement,
-                                status: value.status,
-                                start_timestamp: value.start_timestamp,
-                                end_timestamp: value.end_timestamp,
-                            },
-                        });
-                    } }) }), jsx("div", { className: styles$9.border }), jsxs("div", { className: styles$9.areaInfo, children: [jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Area:" }), jsx("div", { className: styles$9.value, children: sizeValue?.area })] }), jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Perimeter:" }), jsx("div", { className: styles$9.value, children: sizeValue?.perimeter })] })] })] }));
-};
-
-const DoodleInfo = ({ onHandleDelete }) => {
-    const { editMapInfo, setEditMapInfo } = useMapEditContext();
-    const options = useMemo(() => {
-        return new Array(30).fill(0).map((_, index) => {
-            return {
-                label: `${index + 1}day`,
-                value: index + 1,
-            };
-        });
-    }, []);
-    const isCreate = useMemo(() => {
-        return editMapInfo?.createMode;
-    }, [editMapInfo?.createMode]);
-    const doodleInfo = useMemo(() => {
-        if (!editMapInfo.selectElement)
-            return null;
-        const create_ts = editMapInfo?.selectElement?.create_ts;
-        const expiration_ts = editMapInfo.selectElement.expiration_ts;
-        const diff = expiration_ts - create_ts;
-        const day = Math.floor(diff / (60 * 60 * 24));
-        return {
-            day: day,
-        };
-    }, [editMapInfo?.selectElement]);
-    const remainDay = useMemo(() => {
-        if (!editMapInfo.selectElement)
-            return null;
-        const expiration_ts = editMapInfo.selectElement.expiration_ts;
-        const diff = expiration_ts - Date.now() / 1000;
-        return Math.floor(diff / (60 * 60 * 24));
-    }, [editMapInfo?.selectElement]);
-    const sizeValue = useMemo(() => {
-        if (!editMapInfo.selectElement || !editMapInfo.selectElement.svg)
-            return '';
-        const svg = editMapInfo.selectElement?.svg;
-        const scale = editMapInfo.selectElement.scale;
-        const parseSvg = SvgParserNative.parseSvg(svg);
-        const width = (parseSvg.width * scale) / SCALE_FACTOR;
-        const height = (parseSvg.height * scale) / SCALE_FACTOR;
-        console.log('parseSvg->', editMapInfo, parseSvg);
-        return `${width.toFixed(1)} m x ${height.toFixed(1)} m`;
-    }, [editMapInfo.selectElement]);
-    const handleChange = useCallback((day) => {
-        setEditMapInfo((pre) => {
-            return {
-                ...pre,
-                selectElement: {
-                    ...pre.selectElement,
-                    create_ts: Date.now() / 1000,
-                    expiration_ts: Date.now() / 1000 + day * 24 * 60 * 60,
-                },
-            };
-        });
-    }, [editMapInfo.selectElement]);
-    console.log('doodleInfo->', doodleInfo);
-    return (jsxs("div", { className: styles$9.doodleInfo, children: [jsx(Header, { handleDelete: () => {
-                    onHandleDelete();
-                }, handleFocus: () => { }, type: editMapInfo.elementType }), jsx("div", { className: styles$9.border }), isCreate ? (jsxs(Fragment, { children: [jsx(Item, { children: jsxs("div", { className: styles$9.time, children: [jsxs("div", { className: styles$9.exist, children: [jsx("div", { className: styles$9.label, children: "Preserve doodle for" }), jsx("div", { className: styles$9.value, children: jsx(Select, { defaultValue: doodleInfo?.day, style: { width: 80 }, onChange: (value) => handleChange(value), options: options }) })] }), doodleInfo?.day >= 14 && (jsx("div", { className: styles$9.tip, children: "* If the doodle lasts over 14 days, the grass may grow too tall for the mower to mow later." }))] }) }), jsx("div", { className: styles$9.border }), jsx("div", { className: styles$9.areaInfo, children: jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Size:" }), jsx("div", { className: styles$9.value, children: sizeValue })] }) })] })) : (jsxs("div", { className: styles$9.areaInfo, children: [jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Remaining time:" }), jsxs("div", { className: styles$9.value, children: [remainDay, " day"] })] }), jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Size:" }), jsx("div", { className: styles$9.value, children: sizeValue })] })] }))] }));
-};
-
-const VisionOffInfo = ({ onHandleDelete }) => {
-    const { editMapInfo, setEditMapInfo } = useMapEditContext();
-    const sizeValue = useMemo(() => {
-        if (!editMapInfo.selectElement)
-            return '';
-        const points = editMapInfo.selectElement?.points;
-        const [width, height] = calculateRectangleDimensions(points);
-        const formatWidth = convertDistanceByUnits(width / SCALE_FACTOR);
-        const formatHeight = convertDistanceByUnits(height / SCALE_FACTOR);
-        return `${formatWidth.value} x ${formatHeight.value}`;
-    }, [editMapInfo.selectElement]);
-    return (jsxs("div", { className: "visionOffInfo", children: [jsx(Header, { handleDelete: () => {
-                    onHandleDelete?.();
-                }, handleFocus: () => { }, type: DataType.VISION_OFF }), jsx("div", { className: styles$9.border }), jsx("div", { className: styles$9.areaInfo, children: jsxs("div", { className: styles$9.areaItem, children: [jsx("div", { className: styles$9.label, children: "Size:" }), jsx("div", { className: styles$9.value, children: sizeValue })] }) })] }));
-};
-
-var _path$2, _path2$1;
-function _extends$2() { return _extends$2 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$2.apply(null, arguments); }
-var SvgUndo = function SvgUndo(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$2({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    fill: "none"
-  }, props), _path$2 || (_path$2 = /*#__PURE__*/React.createElement("path", {
-    stroke: "currentColor",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 2,
-    d: "M4.329 7.821h10.506a5.581 5.581 0 0 1 0 11.163h-5.27"
-  })), _path2$1 || (_path2$1 = /*#__PURE__*/React.createElement("path", {
-    stroke: "currentColor",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 2,
-    d: "m7.293 3.607-4.39 4.215 4.39 4.316"
-  })));
-};
-
-var _path$1, _path2;
-function _extends$1() { return _extends$1 = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends$1.apply(null, arguments); }
-var SvgRedo = function SvgRedo(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$1({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 24,
-    height: 24,
-    fill: "none"
-  }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
-    stroke: "currentColor",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 2,
-    d: "M19.672 7.821H9.165a5.581 5.581 0 1 0 0 11.163h5.27"
-  })), _path2 || (_path2 = /*#__PURE__*/React.createElement("path", {
-    stroke: "currentColor",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 2,
-    d: "m16.708 3.607 4.389 4.215-4.39 4.315"
-  })));
-};
-
-const HandleElementInfo = () => {
-    const { svgElementDatas } = useSvgEditContext();
-    const { checkDoodle } = useCheckElement();
-    const { undo, redo } = useHistoryHandle();
-    const { editMapInfo, setEditMapInfo, onHandleStopRecord, onHandleCompleteRecord, onHandleDeleteElement, onUpdateBoundary, } = useMapEditContext();
-    const currentType = useMemo(() => {
-        return DATE_TYPE_MAP.find((item) => item.type === editMapInfo.elementType);
-    }, [editMapInfo.elementType]);
-    const isUndoDisabled = useMemo(() => {
-        if (editMapInfo?.elementType === DataType.OBSTACLE &&
-            editMapInfo?.createMode === CreateStatus.CREATING) {
-            return !(editMapInfo?.currentHistoryIndex > 0 && editMapInfo?.historyList?.length);
-        }
-        else {
-            return !(editMapInfo?.currentHistoryIndex > 0 && editMapInfo?.historyList?.length);
-        }
-    }, [
-        editMapInfo?.currentHistoryIndex,
-        editMapInfo?.historyList,
-        editMapInfo?.createMode,
-        editMapInfo?.elementType,
-    ]);
-    const idRedoDisabled = useMemo(() => {
-        return !(editMapInfo?.currentHistoryIndex < editMapInfo?.historyList?.length - 1 &&
-            editMapInfo?.historyList?.length);
-    }, [editMapInfo?.currentHistoryIndex, editMapInfo?.historyList]);
-    const handleUndo = useCallback((e) => {
-        e.stopPropagation();
-        e.preventDefault();
-        if (isUndoDisabled)
-            return;
-        undo();
-    }, [undo, isUndoDisabled]);
-    const handleRedo = useCallback((e) => {
-        e.stopPropagation();
-        e.preventDefault();
-        if (idRedoDisabled)
-            return;
-        redo();
-    }, [redo, idRedoDisabled]);
-    const renderElementData = useCallback((element) => {
-        if (!editMapInfo.selectElement)
-            return null;
-        const data = {
-            doodle: undefined,
-            visionOffAreas: undefined,
-            obstacle: undefined,
-            boundary: undefined,
-        };
-        if (element?.type === DataType.DOODLE) {
-            const doodleData = {
-                center: element.center,
-                direction: element.direction,
-                scale: element.scale,
-                svg: element.svg,
-                expiration_ts: element.expiration_ts,
-                create_ts: element.create_ts,
-            };
-            if (element?.id) {
-                doodleData.id = element?.id;
-            }
-            data.doodle = JSON.stringify([doodleData]);
-        }
-        if (element?.type === DataType.VISION_OFF) {
-            const visionOffArea = svgElementDatas?.[DataType.VISION_OFF]
-                ?.filter((item) => item.id !== element.id)
-                ?.map((item) => ({
-                id: item.id,
-                points: restorePointsFormat(item.points),
-            })) || [];
-            const visionOffAreaData = [
-                ...visionOffArea,
-                {
-                    id: element?.id,
-                    points: restorePointsFormat(element.points),
-                },
-            ]?.map((item) => {
-                if (item?.id) {
-                    return {
-                        id: item.id,
-                        points: item.points,
-                    };
-                }
-                return {
-                    points: item.points,
-                };
-            }) || [];
-            data.visionOffAreas = JSON.stringify(visionOffAreaData);
-        }
-        if (element?.type === DataType.OBSTACLE) {
-            data.obstacle = {
-                name: element?.name,
-                status: element?.status ?? 1,
-                end_timestamp: element?.end_timestamp,
-                start_timestamp: element?.start_timestamp,
-                points: restorePointsFormat(element.points),
-            };
-            if (element?.id) {
-                data.obstacle.id = element?.id;
-            }
-        }
-        if (element?.type === DataType.BOUNDARY) {
-            data.boundary = {
-                cuttingHeight: element?.cuttingHeight,
-                isFlowGlobal: element?.isFlowGlobal,
-                angle: element?.angle,
-                direction: element?.direction,
-                name: element?.name,
-                edgeMowing: element?.edgeMowing,
-                edgeVision: element?.edgeVision,
-                obstacleMowEdge: element?.obstacleMowEdge,
-            };
-            if (element?.id) {
-                data.boundary.id = element?.id;
-            }
-        }
-        return data;
-    }, [editMapInfo.selectElement]);
-    const handleSave = useCallback(() => {
-        const params = renderElementData(editMapInfo?.selectElement);
-        const isObstacle = editMapInfo?.selectElement?.type === DataType.OBSTACLE;
-        const hasNotEnoughPoints = params?.obstacle?.points?.length < 3;
-        const isDoodle = editMapInfo?.selectElement?.type === DataType.DOODLE;
-        const doodleResult = checkDoodle();
-        if (isDoodle && !doodleResult?.isValid) {
-            message.error('Keep more distance from boundaries, off-limit island and other doodles');
-            return;
-        }
-        if (isObstacle && hasNotEnoughPoints) {
-            message.error('Save failed, please draw a closed shape');
-            return;
-        }
-        console.log('save->', editMapInfo, params);
-        if (editMapInfo?.selectElement?.type === DataType.BOUNDARY) {
-            onUpdateBoundary?.(params)?.then(() => {
-                setEditMapInfo({
-                    ...editMapInfo,
-                    createMode: null,
-                    elementType: null,
-                    selectElement: null,
-                    isShowDrag: false,
-                });
-            }, (errorText) => {
-                message.error('Save failed, please try again');
-            });
-        }
-        else {
-            onHandleCompleteRecord?.(params)?.then(() => {
-                setEditMapInfo({
-                    ...editMapInfo,
-                    createMode: null,
-                    elementType: null,
-                    selectElement: null,
-                    isShowDrag: false,
-                });
-            }, (errorText) => {
-                message.error('Save failed, please try again');
-            });
-        }
-    }, [editMapInfo.selectElement, onUpdateBoundary, onHandleCompleteRecord]);
-    const handleCancel = useCallback(() => {
-        const name = DATE_TYPE_MAP.find((item) => item.type === editMapInfo.elementType)?.label;
-        Modal.confirm({
-            icon: null,
-            centered: true,
-            title: 'Quit editing',
-            content: `Changes you made will not be saved. Are you sure you want to quit editing the ${name}?`,
-            okText: 'Quit',
-            cancelText: 'Keep editing',
-            onOk: () => {
-                onHandleStopRecord?.()?.then(() => {
-                    setEditMapInfo({
-                        ...editMapInfo,
-                        createMode: null,
-                        elementType: null,
-                        selectElement: null,
-                        isShowDrag: false,
-                    });
-                });
-            },
-        });
-    }, [editMapInfo]);
-    const handleDelete = useCallback(() => {
-        console.log('handleDelete 1->', editMapInfo);
-        Modal.confirm({
-            icon: null,
-            title: 'Delete',
-            content: 'Are you sure you want to delete this element?',
-            okText: 'Delete',
-            cancelText: 'Cancel',
-            onOk: () => {
-                onHandleStopRecord?.()?.then(() => {
-                    console.log('handleDelete 2->', editMapInfo, onHandleDeleteElement);
-                    if (editMapInfo?.selectElement?.id) {
-                        onHandleDeleteElement?.({
-                            id: editMapInfo.selectElement?.id,
-                            type: editMapInfo.elementType,
-                        })?.then(() => {
-                            setEditMapInfo({
-                                ...editMapInfo,
-                                createMode: null,
-                                elementType: null,
-                                selectElement: null,
-                                isShowDrag: false,
-                            });
-                        }, (errorText) => {
-                            message.error('Save failed, please try again');
-                        });
-                    }
-                    else {
-                        setEditMapInfo({
-                            ...editMapInfo,
-                            createMode: null,
-                            elementType: null,
-                            selectElement: null,
-                            isShowDrag: false,
-                        });
-                    }
-                }, (errorText) => {
-                    message.error('Save failed, please try again');
-                });
-            },
-        });
-    }, [editMapInfo?.selectElement, onHandleDeleteElement, onHandleStopRecord]);
-    if (!editMapInfo.selectElement)
-        return null;
-    console.log('handleElementInfo->', editMapInfo, currentType);
-    return (jsxs("div", { className: styles$9.handleElementInfo, children: [editMapInfo?.elementType !== DataType.BOUNDARY ? (jsxs("div", { className: styles$9.undoAndRedo, children: [jsx("div", { className: classNames(styles$9.undo, { [styles$9.disabled]: isUndoDisabled }), onClick: handleUndo, children: jsx(SvgUndo, {}) }), jsx("div", { className: classNames(styles$9.redo, { [styles$9.disabled]: idRedoDisabled }), onClick: handleRedo, children: jsx(SvgRedo, {}) })] })) : null, editMapInfo?.elementType === DataType.BOUNDARY && (jsx(BoundaryInfo, { onHandleDelete: handleDelete })), editMapInfo?.elementType === DataType.OBSTACLE && (jsx(ObstacleInfo, { onHandleDelete: handleDelete })), editMapInfo?.elementType === DataType.DOODLE && jsx(DoodleInfo, { onHandleDelete: handleDelete }), editMapInfo?.elementType === DataType.VISION_OFF && (jsx(VisionOffInfo, { onHandleDelete: handleDelete })), jsx("div", { className: styles$9.border }), jsx("div", { className: styles$9.handle, children: jsxs(Space, { size: 12, children: [jsx(Button, { variant: "outlined", color: "default", onClick: () => {
-                                handleCancel();
-                            }, children: "Cancel" }), jsx(Button, { variant: "solid", color: "primary", onClick: handleSave, children: "Save" })] }) })] }));
-};
-
-var _path;
-function _extends() { return _extends = Object.assign ? Object.assign.bind() : function (n) { for (var e = 1; e < arguments.length; e++) { var t = arguments[e]; for (var r in t) ({}).hasOwnProperty.call(t, r) && (n[r] = t[r]); } return n; }, _extends.apply(null, arguments); }
-var SvgMobileAddPoint = function SvgMobileAddPoint(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
-    xmlns: "http://www.w3.org/2000/svg",
-    width: 36,
-    height: 36,
-    fill: "none"
-  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
-    stroke: "#fff",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    strokeWidth: 3,
-    d: "M6 12V9a3 3 0 0 1 3-3h3M6 24v3a3 3 0 0 0 3 3h3M24 6h3a3 3 0 0 1 3 3v3m-6 18h3a3 3 0 0 0 3-3v-3m-16.5-6h9M18 13.5v9"
-  })));
-};
-
-var css_248z = ".index-module_crosshair__etey6 {\n  position: absolute;\n  top: 50%;\n  left: 50%;\n  transform: translate(-50%, -50%);\n  width: 40px;\n  height: 40px;\n  pointer-events: none;\n  z-index: 99999;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n}";
-var styles = {"crosshair":"index-module_crosshair__etey6"};
-styleInject(css_248z);
-
-/**
- * 十字准心组件
- * 相对于父容器居中显示
- */
-const Crosshair = () => {
-    const { platform } = useCommonContext();
-    const { editMapInfo } = useMapEditContext();
-    const isVisible = useMemo(() => {
-        if (platform === PlatformType.H5 &&
-            editMapInfo?.mobileMode === MobileEditMode.CREATE &&
-            editMapInfo?.elementType === DataType.OBSTACLE) {
-            return true;
-        }
-        return false;
-    }, [platform, editMapInfo]);
-    return isVisible ? (jsx("div", { className: styles.crosshair, children: jsx(SvgMobileAddPoint, {}) })) : null;
-};
-
-// 验证GPS坐标是否有效
-const isValidGpsCoordinate = (coordinate) => {
-    if (!coordinate || coordinate.length < 2)
-        return false;
-    const [lng, lat] = coordinate;
-    // 检查是否为有效的GPS坐标范围，且不是原点(0,0)
-    return (lng >= -180 &&
-        lng <= 180 &&
-        lat >= -90 &&
-        lat <= 90 &&
-        !(Math.abs(lng) < 0.001 && Math.abs(lat) < 0.001) // 排除接近(0,0)的坐标
-    );
-};
-// 旋转坐标点
-const rotateCoordinate = (point, center, angleRadians) => {
-    const [x, y] = point;
-    const [cx, cy] = center;
-    // 将点移动到原点
-    const dx = x - cx;
-    const dy = y - cy;
-    // 应用旋转矩阵
-    const cos = Math.cos(angleRadians);
-    const sin = Math.sin(angleRadians);
-    const rotatedX = dx * cos - dy * sin;
-    const rotatedY = dx * sin + dy * cos;
-    // 移回原位置
-    return [rotatedX + cx, rotatedY + cy];
+// 旋转坐标点
+const rotateCoordinate = (point, center, angleRadians) => {
+    const [x, y] = point;
+    const [cx, cy] = center;
+    // 将点移动到原点
+    const dx = x - cx;
+    const dy = y - cy;
+    // 应用旋转矩阵
+    const cos = Math.cos(angleRadians);
+    const sin = Math.sin(angleRadians);
+    const rotatedX = dx * cos - dy * sin;
+    const rotatedY = dx * sin + dy * cos;
+    // 移回原位置
+    return [rotatedX + cx, rotatedY + cy];
 };
 // 获取有效的GPS边界
 const getValidGpsBounds = (mapData, rotation = 0) => {
@@ -21796,7 +20064,7 @@ const defaultMapConfig = DEFAULT_STYLES;
 // 地图渲染器组件
 const MowerMapRenderer = forwardRef(({ sn, platform = PlatformType.WEB, edger = false, unitType = UnitsType.Imperial, language = 'en', onlyRead = false, mapConfig, 
 // pathConfig,
-modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, onPathLoad, onError, className, style, googleMapInstance: _googleMapInstance, dragMap = false, dragCallbacks, defaultTransform, debug: _debug = false, doodleList = [], editMap = false, unStructMapData, disabledObstacles = false, onHandleEnterRecord, onHandleCompleteRecord, onHandleStopRecord, onHandleDeleteElement, onSaveBoundaryData, onSaveMap, onEditInfoMapChange, onUpdateBoundary, heightOptions, globalHeight, onHandleEvent, }, ref) => {
+modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, onPathLoad, onError, className, style, googleMapInstance: _googleMapInstance, dragMap = false, dragCallbacks, defaultTransform, debug: _debug = false, doodleList = [], editMap = false, unStructMapData, disabledObstacles = false, onHandleEnterRecord, onHandleCompleteRecord, onHandleStopRecord, onHandleDeleteElement, onSaveBoundaryData, onSaveMap, onEditInfoMapChange, onUpdateBoundary, heightOptions, globalHeight, onHandleEvent, onSelectElement, }, ref) => {
     const [currentError, setCurrentError] = useState(null);
     const overlayRef = useRef(null);
     // const mapRef = useMap();
@@ -21844,7 +20112,10 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
         return {
             minDistance,
             editMapInfo,
-            setEditMapInfo,
+            setEditMapInfo: (editMapInfo) => {
+                setEditMapInfo(editMapInfo);
+                onEditInfoMapChange?.(editMapInfo);
+            },
             onHandleEnterRecord,
             onHandleCompleteRecord,
             onHandleStopRecord,
@@ -21853,6 +20124,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
             onHandleDeleteElement,
             onUpdateBoundary,
             onHandleEvent,
+            onSelectElement,
         };
     }, [
         minDistance,
@@ -21865,6 +20137,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
         onSaveMap,
         onUpdateBoundary,
         onHandleEvent,
+        onSelectElement,
     ]);
     // 合并配置
     const mergedMapConfig = useMemo(() => {
@@ -22258,6 +20531,10 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
         addDoodle: (doodle) => svgEditMapRef.current?.addDoodle(doodle),
         // 检查doodle
         checkDoodle: () => svgEditMapRef.current?.checkDoodle?.(),
+        // 增加元素（web）
+        addElement: (type, item) => svgEditMapRef.current?.addElement(type, item),
+        // 保存元素
+        saveElement: (type, item) => svgEditMapRef.current?.saveElement(type, item),
     }));
     /**
      * 根据割草机的位置更新路径
@@ -22272,7 +20549,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
     }
     // console.log('mowerrender------->', svgViewBox);
     // 使用goole maps自定义叠加层，返回debug信息（如果启用）
-    return (jsx(CommonContextProvider, { value: commonValue, children: jsx(SvgEditContextProvider, { value: svgEditValue, children: jsxs(MapEditContextProvider, { value: mapEditValue, children: [platform !== PlatformType.H5 && (jsxs(Fragment, { children: [jsx(AddEntry, { disabledObstacles: disabledObstacles, doodleList: doodleList, editMap: editMap }), jsx(HandleElementInfo, { editMapInfo: editMapInfo, setEditMapInfo: setEditMapInfo })] })), platform === PlatformType.H5 && jsx(Crosshair, {}), jsxs(OverlayViewF, { onLoad: (lay) => {
+    return (jsx(CommonContextProvider, { value: commonValue, children: jsx(SvgEditContextProvider, { value: svgEditValue, children: jsxs(MapEditContextProvider, { value: mapEditValue, children: [platform !== PlatformType.H5 && (jsx(Fragment, {})), platform === PlatformType.H5 && jsx(Crosshair, {}), jsxs(OverlayViewF, { onLoad: (lay) => {
                             setOverlay(lay);
                         }, onDraw: (style) => {
                             const layout = Object.keys(style).reduce((pre, cur) => {
@@ -22290,4 +20567,66 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
 });
 MowerMapRenderer.displayName = 'MowerMapRenderer';
 
-export { BoundarySvgRender, MapDataProcessor, MowerMapRenderer, PathDataProcessor, calculateMapGpsCenter, estimateGpsFromMapBounds };
+const BoundarySvgRender = React__default.memo(({ mapJson, id, maxWidth = 300 }) => {
+    const svgElementData = useMemo(() => {
+        const data = UnifiedMapDataProcessor.processMapData(mapJson, DEFAULT_STYLES) || {};
+        return data;
+    }, [mapJson, DEFAULT_STYLES]);
+    const boundaryInfo = useMemo(() => {
+        const boundary = svgElementData.boundary.find((item) => item.id === id);
+        return boundary;
+    }, [id, svgElementData]);
+    // 计算当前boundary的viewBox
+    const boundaryViewBox = useMemo(() => {
+        if (!boundaryInfo?.points || boundaryInfo.points.length === 0) {
+            return null;
+        }
+        // 计算边界
+        let minX = Infinity;
+        let minY = Infinity;
+        let maxX = -Infinity;
+        let maxY = -Infinity;
+        boundaryInfo.points.forEach((point) => {
+            minX = Math.min(minX, point[0]);
+            minY = Math.min(minY, point[1]);
+            maxX = Math.max(maxX, point[0]);
+            maxY = Math.max(maxY, point[1]);
+        });
+        // 添加边距
+        const padding = 50;
+        const width = maxX - minX + padding * 2;
+        const height = maxY - minY + padding * 2;
+        return {
+            x: minX - padding,
+            y: minY - padding,
+            width,
+            height,
+        };
+    }, [boundaryInfo]);
+    const style = useMemo(() => {
+        if (boundaryViewBox?.width > boundaryViewBox?.height) {
+            return {
+                width: maxWidth,
+                height: maxWidth * (boundaryViewBox.height / boundaryViewBox.width),
+            };
+        }
+        return {
+            width: maxWidth * (boundaryViewBox.height / boundaryViewBox.width),
+            height: maxWidth,
+        };
+    }, [boundaryViewBox, maxWidth]);
+    return (jsxs("div", { style: {
+            position: 'relative',
+            width: style.width,
+            height: style.height,
+            margin: '0 auto',
+        }, children: [jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `${boundaryViewBox.x} ${boundaryViewBox.y} ${boundaryViewBox.width} ${boundaryViewBox.height}`, width: `${style.width}px`, height: `${style.height}px`, style: { position: 'absolute', inset: 0, pointerEvents: 'none' }, children: Object.keys(svgElementData)?.map((key) => {
+                    return svgElementData[key]?.map((element) => {
+                        if (key === DataType.VISION_OFF)
+                            return null;
+                        return (jsx(GElement, { type: key, data: svgElementData[key], children: jsx(SvgElement, { type: key, data: element, onSelect: () => { }, onCancel: () => { } }, element.id) }, key));
+                    });
+                }) }), jsx(CharginPile, { mapData: mapJson, mapConfig: DEFAULT_STYLES, viewBox: boundaryViewBox || null, rotation: 0 })] }));
+});
+
+export { ALL_DIRECTION_SELECTED, AntennaData, AntennaDataBuilder, BaseData, BoundaryData, BoundarySvgRender, ChannelData, ChargingPileData, CreateStatus, DataType, DoodleData, MAX_DIRECTION_ANGLE, MIN_DIRECTION_ANGLE, MapDataProcessor, MobileEditMode, MowerMapRenderer, ObstacleData, PathData, PathDataProcessor, RecordFunctionEnum, RecordTypeEnum, RenderType, SCALE_FACTOR, SvgParserNative, UnifiedMapDataProcessor, VisionOffData, calculateMapGpsCenter, estimateGpsFromMapBounds, initBoundary, initChannel, initDoodle, initObstacle, initVisionOff, restorePointsFormat };