npm - @fleet-frontend/mower-maps - Versions diffs - 0.2.0-beta.15 → 0.2.0-beta.16 - Mend

@fleet-frontend/mower-maps 0.2.0-beta.15 → 0.2.0-beta.16

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (27) hide show

package/dist/index.esm.js CHANGED Viewed

@@ -2,7 +2,7 @@ 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 { message } from 'antd';
+import { message, Modal, Popover } from 'antd';
 /**
  * 常量和枚举类型定义
@@ -7985,6 +7985,42 @@ var PlatformType;
     PlatformType["WEB"] = "web";
     PlatformType["H5"] = "h5";
 })(PlatformType || (PlatformType = {}));
+// 禁区的点进行检查的时候的提示
+var CheckObstaclePointErrorType;
+(function (CheckObstaclePointErrorType) {
+    // 禁区相交
+    CheckObstaclePointErrorType["OBSTACLE_INTERSECT"] = "obstacle_intersect";
+    // 禁区与doodle相交
+    CheckObstaclePointErrorType["DOODLE_INTERSECT"] = "doodle_intersect";
+    // 禁区与doodle距离过近
+    CheckObstaclePointErrorType["DOODLE_DISTANCE_TOO_CLOSE"] = "doodle_distance_too_close";
+    // 禁区不在边界内
+    CheckObstaclePointErrorType["BOUNDARY_NOT_IN_BOUNDARY"] = "boundary_not_in_boundary";
+    // 点在禁区内
+    CheckObstaclePointErrorType["POINT_IN_OBSTACLE"] = "point_in_obstacle";
+    // 地图不存在
+    CheckObstaclePointErrorType["MAP_NOT_EXIST"] = "map_not_exist";
+    // 获取点失败
+    CheckObstaclePointErrorType["GET_POINT_FAILED"] = "get_point_failed";
+    // 通用错误
+    CheckObstaclePointErrorType["COMMON_ERROR"] = "common_error";
+})(CheckObstaclePointErrorType || (CheckObstaclePointErrorType = {}));
+// doodle进行检查的提示
+var CheckDoodleErrorType;
+(function (CheckDoodleErrorType) {
+    // 没有选中doodle
+    CheckDoodleErrorType["NO_DOODLE_SELECTED"] = "no_doodle_selected";
+    // doodle没有可移动的点
+    CheckDoodleErrorType["NO_MOVABLE_POINTS"] = "no_movable_points";
+    // doodle不在边界内
+    CheckDoodleErrorType["DOODLE_NOT_IN_BOUNDARY"] = "doodle_not_in_boundary";
+    // doodle距离边界太近
+    CheckDoodleErrorType["DOODLE_DISTANCE_TOO_CLOSE"] = "doodle_distance_too_close";
+    // doodle与其他元素相交
+    CheckDoodleErrorType["DOODLE_INTERSECT"] = "doodle_intersect";
+    // doodle与其他元素距离过近
+    CheckDoodleErrorType["DOODLE_DISTANCE_TOO_CLOSE_TO_OTHER_ELEMENT"] = "doodle_distance_too_close_to_other_element";
+})(CheckDoodleErrorType || (CheckDoodleErrorType = {}));
 /**
  * 触摸事件工具函数
@@ -8582,12 +8618,12 @@ function styleInject(css, ref) {
   }
 }
-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);
+var css_248z$9 = ".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$9 = {"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$9);
 const RotateHandle = ({ onRotateStart, isRotating }) => {
-    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 } }));
+    return (jsx("div", { className: styles$9.rotate, onMouseDown: (e) => onRotateStart(e), onTouchStart: (e) => onRotateStart(e), style: { cursor: isRotating ? 'grabbing' : 'grab' }, dangerouslySetInnerHTML: { __html: DEFAULT_ROTATE_ICON } }));
 };
 /**
@@ -8641,13 +8677,18 @@ function isMobileDevice() {
     // 检查用户代理字符串
     const userAgent = navigator.userAgent.toLowerCase();
     const mobileKeywords = [
-        'android', 'webos', 'iphone', 'ipad', 'ipod',
-        'blackberry', 'windows phone', 'mobile'
+        'android',
+        'webos',
+        'iphone',
+        'ipad',
+        'ipod',
+        'blackberry',
+        'windows phone',
+        'mobile',
     ];
-    const isMobileUserAgent = mobileKeywords.some(keyword => userAgent.includes(keyword));
+    const isMobileUserAgent = mobileKeywords.some((keyword) => userAgent.includes(keyword));
     // 检查触摸屏支持
-    const hasTouchScreen = 'ontouchstart' in window ||
-        (navigator.maxTouchPoints && navigator.maxTouchPoints > 0);
+    const hasTouchScreen = 'ontouchstart' in window || (navigator.maxTouchPoints && navigator.maxTouchPoints > 0);
     // 检查屏幕尺寸（移动设备通常屏幕较小）
     const isSmallScreen = window.innerWidth <= 768;
     // 综合判断：用户代理包含移动设备关键词，或者有触摸屏且屏幕较小
@@ -8659,7 +8700,7 @@ const DragHandle = ({ onDragStart, isDragging }) => {
     if (!isMobileDevice()) {
         return null;
     }
-    return (jsx("div", { className: styles$6.move, onMouseDown: (e) => {
+    return (jsx("div", { className: styles$9.move, onMouseDown: (e) => {
             console.log('down');
             onDragStart(e);
         }, onTouchStart: (e) => onDragStart(e), onMouseUp: (e) => {
@@ -8693,7 +8734,7 @@ const MapDrag = ({ map: _map, dragCallbacks, onBoundaryLabelsCollapse, onTransfo
     if (!isDragMap) {
         return null;
     }
-    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 })] }));
+    return (jsxs("div", { ref: containerRef, className: styles$9.edit, style: { cursor: isDragging ? 'grabbing' : 'move' }, children: [jsx("div", { className: styles$9.border }), jsx(RotateHandle, { onRotateStart: handleRotateStart, isRotating: isRotating }), jsx("div", { className: styles$9.drag, onMouseDown: handleDragStartEvent, onTouchStart: handleDragStartEvent }), jsx(DragHandle, { onDragStart: handleDragStartEvent, isDragging: isDragging })] }));
 };
 /**
@@ -14416,9 +14457,9 @@ const SvgMapComponent = forwardRef(({ editMap, rotate, mapData, pathData, modelT
 // 设置显示名称以便调试
 SvgMapComponent.displayName = 'SvgMapComponent';
-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);
+var css_248z$8 = ".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$8 = {"mowerPosition":"index-module_mowerPosition__yLpIU"};
+styleInject(css_248z$8);
 const usePosition = ({ mowerPositionData, viewBox, modelType, hasEdger, mapData, realTimeData, onMowingPositionChange, }) => {
     // DOM 元素引用，用于直接操作
@@ -14644,7 +14685,7 @@ const MowerPosition = React__default.memo(({ editMap, mowerPositionData, viewBox
         pointerEvents: 'none',
         zIndex: 1000,
     }), []);
-    return (jsx("div", { className: styles$5.mowerPosition, style: containerStyle, children: jsx("div", { ref: elementRef, className: "mower-position", style: {
+    return (jsx("div", { className: styles$8.mowerPosition, style: containerStyle, children: jsx("div", { ref: elementRef, className: "mower-position", style: {
                 position: 'absolute',
                 width: 30,
                 height: 30,
@@ -14713,9 +14754,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$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);
+var css_248z$7 = ".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$7 = {"container":"index-module_container__7IatW","boundaryLabel":"index-module_boundaryLabel__GDHFn","base":"index-module_base__qy2SG","extended":"index-module_extended__0TMAt"};
+styleInject(css_248z$7);
 const useBoundaryLabels = ({ mapData, pathData, unitType, viewBox, mowPartitionData, realTimeData = [], }) => {
     const [processStateIsMowing, updateProcessStateIsMowing] = useState(false);
@@ -14869,7 +14910,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$4.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `${styles$4.boundaryLabel} boundary-label`, "data-boundary-id": item.id, style: {
+    return (jsx("div", { className: styles$7.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `${styles$7.boundaryLabel} boundary-label`, "data-boundary-id": item.id, style: {
                 transform: `translate(-50%, -50%) rotate(${-rotation}deg)`,
                 left: `${item.leftPct}%`,
                 top: `${item.topPct}%`,
@@ -14879,12 +14920,12 @@ const BoundaryLabels = React__default.memo(({ editMap, mapData, pathData, unitTy
                 if (onlyRead)
                     return;
                 handleClick(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))) }));
+            }, children: [jsx("div", { className: styles$7.base, children: item.baseText }), jsxs("div", { className: styles$7.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$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);
+var css_248z$6 = ".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$6 = {"container":"index-module_container__gB52e","item":"index-module_item__zHoZP","icon":"index-module_icon__CS56A","tooltip":"index-module_tooltip__NMCmR"};
+styleInject(css_248z$6);
 const useAntennaInfo = (data = [], options = {}) => {
     const { viewBox } = options;
@@ -14993,13 +15034,13 @@ const Antennas = React__default.memo(({ editMap, antennaConfig = [], viewBox, ro
         document.addEventListener('pointerdown', handleOutside);
         return () => document.removeEventListener('pointerdown', handleOutside);
     }, []);
-    return (jsx("div", { className: styles$3.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `antenna-container-item ${styles$3.item}`, style: {
+    return (jsx("div", { className: styles$6.container, style: containerStyle, children: items.map((item) => (jsxs("div", { className: `antenna-container-item ${styles$6.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$3.icon}`, style: {}, onClick: (e) => {
+            }, children: [jsx("div", { className: `antenna vector-antenna antenna-${item.type} ${item.isOnline ? 'antenna-online' : 'antenna-offline'} ${styles$6.icon}`, style: {}, onClick: (e) => {
                         e.stopPropagation();
                         if (onlyRead)
                             return;
@@ -15014,7 +15055,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$3.tooltip, style: {
+                    }, children: jsx("img", { src: item.imageSrc, style: { width: '100%', height: '100%', objectFit: 'contain', opacity: 1 } }) }), jsxs("div", { className: styles$6.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}`))) }));
@@ -15078,25 +15119,25 @@ const VertexElement = React__default.memo(({ r, stroke, fill, ...props }) => {
     return (jsx("circle", { r: platform === PlatformType.H5 ? (radius * overlayScale) / 2 : radius * overlayScale, stroke: stroke || '#fff', fill: fill || '#fff', strokeWidth: 2 * overlayScale, ...props }));
 });
-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 _path$5;
+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 SvgDelete = function SvgDelete(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$6({
+  return /*#__PURE__*/React.createElement("svg", _extends$b({
     xmlns: "http://www.w3.org/2000/svg",
     width: 16,
     height: 16,
     fill: "none"
-  }, props), _path$2 || (_path$2 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$5 || (_path$5 = /*#__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"
   })));
 };
-const DragDistanceIndicator = ({ fontSize, dragState, strokeColor, editMode = false, createMode = false, completed = false, }) => {
+const DragDistanceIndicator = ({ fontSize, dragState, strokeColor, editMode = false, createMode = false, completed = false, unitType = UnitsType.Metric, }) => {
     // 计算两点间的距离（使用通用工具函数）
     const calculateDistance$1 = React__default.useCallback((point1, point2) => {
         const distance = calculateDistance(point1, point2);
-        const result = convertDistanceByUnits(distance / 50);
+        const result = convertDistanceByUnits(distance / 50, unitType);
         return result.value;
     }, []);
     // 计算点到线段的垂足坐标（使用通用工具函数）
@@ -15197,12 +15238,13 @@ const TextElement = ({ x, y, fontSize = 30, fill = '#fff', text, background = 'r
  * @param point2 第二个点 [x, y]
  * @returns 距离（mi单位）
  */
-const calculatePhysicalDistance$1 = (point1, point2) => {
+const calculatePhysicalDistance$1 = (point1, point2, unit) => {
     const dx = point2[0] - point1[0];
     const dy = point2[1] - point1[1];
     const svgDistance = Math.sqrt(dx * dx + dy * dy);
     const physicalDistance = svgDistance / 50; // SVG坐标是物理单位的50倍
-    return physicalDistance.toFixed(2) + ' m';
+    // return physicalDistance.toFixed(2) + ' m';
+    return convertDistanceByUnits(physicalDistance, unit).value;
 };
 /**
  * 计算两点间的中点坐标
@@ -15213,7 +15255,8 @@ const calculatePhysicalDistance$1 = (point1, point2) => {
 const calculateMidpoint$1 = (point1, point2) => {
     return [(point1[0] + point2[0]) / 2, (point1[1] + point2[1]) / 2];
 };
-const DistanceLabels = ({ coordinates, createMode = false, editMode = false, completed = false, showPoints = false, mousePos: _mousePos = null, ghostLastDistance = null, ghostLastMidpoint = null, ghostFirstDistance = null, ghostFirstMidpoint = null, fontSize = 30, showFirstDistance = true, }) => {
+const DistanceLabels = ({ coordinates, createMode = false, editMode = false, completed = false, showPoints = false, mousePos: _mousePos = null, ghostLastDistance = null, ghostLastMidpoint = null, ghostFirstDistance = null, ghostFirstMidpoint = null, fontSize = 30, showFirstDistance = true, unit = UnitsType.Metric, }) => {
+    const { drag } = useCommonContext();
     // 只在显示可操作顶点时显示距离
     if (!((createMode && showPoints) || editMode || (createMode && completed)) ||
         coordinates.length < (showFirstDistance ? 1 : 2)) {
@@ -15227,7 +15270,7 @@ const DistanceLabels = ({ coordinates, createMode = false, editMode = false, com
                     return null;
                 }
                 const midpoint = calculateMidpoint$1(coord, nextCoord);
-                const distance = calculatePhysicalDistance$1(coord, nextCoord);
+                const distance = calculatePhysicalDistance$1(coord, nextCoord, unit);
                 // 如果当前点和下一个点坐标一致则不现实，处理头尾点一样的问题
                 if (coord[0] === nextCoord[0] && coord[1] === nextCoord[1]) {
                     return null;
@@ -15239,23 +15282,32 @@ const DistanceLabels = ({ coordinates, createMode = false, editMode = false, com
                         WebkitUserSelect: 'none',
                         WebkitTouchCallout: 'none',
                         touchAction: 'none',
+                        transformBox: 'fill-box',
+                        transformOrigin: 'center',
+                        transform: `rotate(-${drag.rotation}deg)`,
                     }, text: distance }, `distance-${idx}`));
             }), ghostLastDistance && ghostLastMidpoint && (jsx(TextElement, { fontSize: fontSize, x: ghostLastMidpoint[0], y: ghostLastMidpoint[1], text: ghostLastDistance, style: {
                     userSelect: 'none',
                     WebkitUserSelect: 'none',
                     WebkitTouchCallout: 'none',
                     touchAction: 'none',
+                    transformBox: 'fill-box',
+                    transformOrigin: 'center',
+                    transform: `rotate(-${drag.rotation}deg)`,
                 } })), ghostFirstDistance && ghostFirstMidpoint && (jsx(TextElement, { fontSize: fontSize, x: ghostFirstMidpoint[0], y: ghostFirstMidpoint[1], text: ghostFirstDistance, style: {
                     userSelect: 'none',
                     WebkitUserSelect: 'none',
                     WebkitTouchCallout: 'none',
                     touchAction: 'none',
+                    transformBox: 'fill-box',
+                    transformOrigin: 'center',
+                    transform: `rotate(-${drag.rotation}deg)`,
                 } }))] }));
 };
-var css_248z$2 = ".index-module_polygonPathG__S-Bpl {\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 css_248z$5 = ".index-module_polygonPathG__S-Bpl {\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$5 = {"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$5);
 var CreateStatus;
 (function (CreateStatus) {
@@ -15283,6 +15335,10 @@ var ClickEventType;
 (function (ClickEventType) {
     // 点击doodle的active time的时候触发
     ClickEventType["DOODLE_ACTIVE_TIME"] = "doodleActiveTime";
+    // 移动禁区点之后报错
+    ClickEventType["MOVE_OBSTACLE_POINT_ERROR"] = "moveObstaclePointError";
+    // 拖拽地图
+    ClickEventType["DRAG_MAP"] = "dragMap";
 })(ClickEventType || (ClickEventType = {}));
 const INIT_EDIT_MAP_INFO = {
     editMap: false,
@@ -15546,17 +15602,24 @@ function coordinatesToPoints$1(coordinates) {
 const useCheckElement = () => {
     const { editMapInfo, minDistance } = useMapEditContext();
-    const { platform } = useCommonContext();
     const { svgElementDatas } = useSvgEditContext();
     const checkDoodle = useCallback(() => {
         console.log('checkdoodle', editMapInfo, svgElementDatas);
         if (!editMapInfo.selectElement || editMapInfo.selectElement.type !== DataType.DOODLE) {
-            return { isValid: false, reason: 'No doodle element selected' };
+            return {
+                isValid: false,
+                reason: 'No doodle element selected',
+                code: CheckDoodleErrorType.NO_DOODLE_SELECTED,
+            };
         }
         const doodleElement = editMapInfo.selectElement;
         const doodlePoints = transformSvgElements(doodleElement).flat();
         if (doodlePoints.length === 0) {
-            return { isValid: false, reason: 'Doodle has no transformed points' };
+            return {
+                isValid: false,
+                reason: 'Doodle has no transformed points',
+                code: CheckDoodleErrorType.NO_MOVABLE_POINTS,
+            };
         }
         const boundary = svgElementDatas?.[DataType.BOUNDARY] || [];
         const obstacle = svgElementDatas?.[DataType.OBSTACLE] || [];
@@ -15584,7 +15647,11 @@ const useCheckElement = () => {
             }
         }
         if (!isInBoundary) {
-            return { isValid: false, reason: 'Doodle 不在任何边界内' };
+            return {
+                isValid: false,
+                reason: 'Doodle 不在任何边界内',
+                code: CheckDoodleErrorType.DOODLE_NOT_IN_BOUNDARY,
+            };
         }
         // 2. 检查 doodle 所有点距离 boundary 边界至少 2m
         const boundaryPoints = coordinatesToPoints$1(containingBoundary.points);
@@ -15594,6 +15661,7 @@ const useCheckElement = () => {
                 return {
                     isValid: false,
                     reason: `Doodle 距离边界过近 (${distanceToBoundary.toFixed(2) / SCALE_FACTOR}m < ${minDistance / SCALE_FACTOR}m)`,
+                    code: CheckDoodleErrorType.DOODLE_DISTANCE_TOO_CLOSE,
                 };
             }
         }
@@ -15624,6 +15692,7 @@ const useCheckElement = () => {
                 return {
                     isValid: false,
                     reason: `Doodle 与${elementTypeName}相交或重叠`,
+                    code: CheckDoodleErrorType.DOODLE_INTERSECT,
                 };
             }
             // 检查距离是否大于 2m
@@ -15639,6 +15708,7 @@ const useCheckElement = () => {
                 return {
                     isValid: false,
                     reason: `Doodle 与${elementTypeName}距离过近 (${distance.toFixed(2) / SCALE_FACTOR}m < ${minDistance / SCALE_FACTOR}m)`,
+                    code: CheckDoodleErrorType.DOODLE_DISTANCE_TOO_CLOSE_TO_OTHER_ELEMENT,
                 };
             }
         }
@@ -15649,7 +15719,7 @@ const useCheckElement = () => {
     const checkCanNotCreateAtPosition = useCallback((checkPoint, checkPoints) => {
         // console.log('editMapInfo.elementType--->', editMapInfo);
         if (!editMapInfo.elementType)
-            return false;
+            return { result: false };
         const currentPoints = editMapInfo?.selectElement?.points;
         const points = checkPoints || currentPoints;
         const firstPoint = coordinatesToPoints$1(points)?.[0] || checkPoint;
@@ -15666,12 +15736,20 @@ const useCheckElement = () => {
         }
         console.log('currentBoundary--->', currentBoundary, points);
         if (!currentBoundary)
-            return true;
+            return {
+                result: true,
+                code: CheckObstaclePointErrorType.BOUNDARY_NOT_IN_BOUNDARY,
+            };
         if (!isPointInPolygon(checkPoint, coordinatesToPoints$1(currentBoundary.points)))
-            return true;
+            return {
+                result: true,
+                code: CheckObstaclePointErrorType.POINT_IN_OBSTACLE,
+            };
         // 如果不是创建 obstacle，则不需要进一步检查
         if (editMapInfo.elementType !== DataType.OBSTACLE)
-            return false;
+            return {
+                result: false,
+            };
         // 获取当前正在创建的 obstacle 的点
         const currentObstaclePoints = coordinatesToPoints$1(points) || [];
         // 构建当前 obstacle 的多边形（包括检查点位置）
@@ -15692,7 +15770,10 @@ const useCheckElement = () => {
             const obstaclePoints = coordinatesToPoints$1(obstacle.points);
             if (doPolygonsIntersect(currentObstaclePolygon, obstaclePoints)) {
                 console.log('Obstacle intersection detected with:', obstacle);
-                return true; // 显示不能创建的光标
+                return {
+                    result: true,
+                    code: CheckObstaclePointErrorType.OBSTACLE_INTERSECT,
+                };
             }
         }
         // 3. 找到在 currentBoundary 内的 doodle 元素
@@ -15708,17 +15789,25 @@ const useCheckElement = () => {
             // 检查相交
             if (doPolygonsIntersect(currentObstaclePolygon, doodleTransformedPoints)) {
                 console.log('Obstacle-Doodle intersection detected with:', doodle);
-                return true; // 显示不能创建的光标
+                return {
+                    result: true,
+                    code: CheckObstaclePointErrorType.DOODLE_INTERSECT,
+                };
             }
             // 检查距离
             const distance = polygonToPolygonDistance(currentObstaclePolygon, doodleTransformedPoints);
             console.log('Obstacle-Doodle distance too close:', distance, 'required:', minDistance);
             if (distance < minDistance) {
                 console.log('Obstacle-Doodle distance too close:', distance, 'required:', minDistance);
-                return true; // 显示不能创建的光标
+                return {
+                    result: true,
+                    code: CheckObstaclePointErrorType.DOODLE_DISTANCE_TOO_CLOSE,
+                };
             }
         }
-        return false;
+        return {
+            result: false,
+        };
     }, [editMapInfo.selectElement, editMapInfo.elementType, svgElementDatas, minDistance]);
     return {
         checkDoodle,
@@ -15740,12 +15829,13 @@ const coordinatesToPoints = (coordinates) => {
  * @param point2 第二个点 [x, y]
  * @returns 距离（mi单位）
  */
-const calculatePhysicalDistance = (point1, point2) => {
+const calculatePhysicalDistance = (point1, point2, unit) => {
     const dx = point2[0] - point1[0];
     const dy = point2[1] - point1[1];
     const svgDistance = Math.sqrt(dx * dx + dy * dy);
     const physicalDistance = svgDistance / 50; // SVG坐标是物理单位的50倍
-    return physicalDistance.toFixed(2) + ' m';
+    // return physicalDistance.toFixed(2) + ' m';
+    return convertDistanceByUnits(physicalDistance, unit).value;
 };
 /**
  * 计算两点间的中点坐标
@@ -15816,7 +15906,8 @@ const createPathData = (points) => {
 };
 const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity = 1, strokeColor = '#000', strokeWidth = 2, strokeOpacity = 1, createMode = false, showPoints = false, onPointClick, completed = false, mousePos = null, editMode = false, onCoordinatesChange, onPathClick, onPolygonClick, onVertexDelete, draggable = true, // 新增参数，如果未指定则根据createMode和editMode自动判断
  }) => {
-    const { overlayScale } = useCommonContext();
+    const { overlayScale, unitType } = useCommonContext();
+    const { onHandleEvent } = useMapEditContext();
     const { svgRef } = useSvgEditContext();
     const [dragState, setDragState] = useState({
         isDragging: false,
@@ -16076,19 +16167,19 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
             return (checkCanNotCreateAtPosition?.({
                 x: dragState.currentPosition[0],
                 y: dragState.currentPosition[1],
-            }) === true);
+            }).result === true);
         const prePoints = coordinates.slice(0, dragState.dragIndex);
         const afterPoints = coordinates.slice(dragState.dragIndex + 1);
         const checkPoints = [...prePoints, dragState.currentPosition, ...afterPoints];
         return (checkCanNotCreateAtPosition?.({
             x: dragState.currentPosition[0],
             y: dragState.currentPosition[1],
-        }, checkPoints) === true);
+        }, checkPoints).result === true);
     }, [dragState.currentPosition, checkCanNotCreateAtPosition, coordinates]);
     const generateVertexClassName = useMemo(() => {
         if (!dragState.isDragging)
-            return styles$2.vertex;
-        return showNotCreateCursor ? styles$2.notCreate : styles$2.dragging;
+            return styles$5.vertex;
+        return showNotCreateCursor ? styles$5.notCreate : styles$5.dragging;
     }, [dragState.isDragging, showNotCreateCursor]);
     // 使用 useRef 来存储 requestAnimationFrame ID
     const rafIdRef = useRef(null);
@@ -16210,7 +16301,15 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
                 ? newCoordinates
                 : newCoordinates.reverse();
             if (showNotCreateCursor) {
-                message.error('Unable to place here, please select a valid spot');
+                if (platform === PlatformType.H5) {
+                    onHandleEvent?.(ClickEventType.MOVE_OBSTACLE_POINT_ERROR, {
+                        result: true,
+                        code: CheckObstaclePointErrorType.COMMON_ERROR,
+                    });
+                }
+                else {
+                    message.error('Unable to place here, please select a valid spot');
+                }
             }
             else {
                 onCoordinatesChange?.(result);
@@ -16282,7 +16381,12 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
     ]);
     // 获取当前渲染用的坐标
     const renderCoordinates = getRenderCoordinates();
-    const polygonPoints = coordinatesToPoints(renderCoordinates);
+    const polygonPoints = useMemo(() => {
+        const points = editMapInfo?.createMode === CreateStatus.CREATING
+            ? [...renderCoordinates, mousePos ? [mousePos.x, mousePos.y] : []]
+            : renderCoordinates;
+        return coordinatesToPoints(points);
+    }, [editMapInfo?.createMode, renderCoordinates, mousePos]);
     // 按type分组坐标点 - 创建模式下不自动闭合
     const pathSegments = groupCoordinatesByType(renderCoordinates, !createMode || completed);
     const dashPaths = pathSegments.filter((segment) => segment.type === 1);
@@ -16295,13 +16399,10 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
         : null;
     // 虚拟连线的距离计算
     const ghostLastDistance = createMode && mousePos && renderCoordinates.length > 0 && !completed
-        ? calculatePhysicalDistance(renderCoordinates[renderCoordinates.length - 1], [
-            mousePos.x,
-            mousePos.y,
-        ])
+        ? calculatePhysicalDistance(renderCoordinates[renderCoordinates.length - 1], [mousePos.x, mousePos.y], unitType)
         : null;
     const ghostFirstDistance = createMode && mousePos && !completed && renderCoordinates.length >= 1
-        ? calculatePhysicalDistance(renderCoordinates[0], [mousePos.x, mousePos.y])
+        ? calculatePhysicalDistance(renderCoordinates[0], [mousePos.x, mousePos.y], unitType)
         : null;
     // 虚拟连线的中点坐标
     const ghostLastMidpoint = createMode && mousePos && renderCoordinates.length > 0 && !completed
@@ -16357,25 +16458,25 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
                         const prevIndex = (dragState.dragIndex - 1 + coordinates.length) % coordinates.length;
                         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: editMapInfo?.editMap ? styles$2.polygonPathG : '', points: polygonPoints, fill: fillColor, fillOpacity: fillOpacity, stroke: "none" // 边框透明
-                , onClick: onPolygonClick })), jsxs("g", { className: styles$2.polygonPathG, children: [renderCoordinates.length >= 2 &&
+                    })()] })), renderCoordinates.length >= 3 && (jsx("polygon", { className: editMapInfo?.createMode === CreateStatus.CREATING ? '' : styles$5.polygonPathG, points: polygonPoints, fill: fillColor, fillOpacity: fillOpacity, stroke: "none" // 边框透明
+                , onClick: onPolygonClick })), jsxs("g", { className: styles$5.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$2.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$5.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$2.polygonPath, points: segment.points, stroke: strokeColor, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity }, index));
+                            return (jsx(DashPath, { className: styles$5.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: platform === PlatformType.H5 ? strokeWidth * 3 : strokeWidth, className: styles$2.addVertex, style: {
+                    return (jsx("line", { x1: coord[0], y1: coord[1], x2: nextCoord[0], y2: nextCoord[1], stroke: isDashPath ? 'transparent' : strokeColor, strokeWidth: platform === PlatformType.H5 ? strokeWidth * 3 : strokeWidth, className: styles$5.addVertex, style: {
                             userSelect: 'none',
                             WebkitUserSelect: 'none',
                             WebkitTouchCallout: 'none',
@@ -16407,7 +16508,7 @@ const PolygonElement = ({ points, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpacity
                                     setHoverVertex(null);
                                 },
                             }) }, `edge-${index}`));
-                }), ghostLastPath && (jsx("path", { d: ghostLastPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), ghostFirstPath && renderCoordinates.length >= 2 && (jsx("path", { d: ghostFirstPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), jsx(DragDistanceIndicator, { dragState: dragState, strokeColor: strokeColor, editMode: editMode, createMode: createMode, completed: completed, fontSize: platform === PlatformType.H5 ? 12 * overlayScale : 30 * overlayScale }), jsx(DistanceLabels, { coordinates: renderCoordinates, createMode: createMode, editMode: editMode, completed: completed, showPoints: showPoints, mousePos: mousePos, ghostLastDistance: ghostLastDistance, ghostLastMidpoint: ghostLastMidpoint, ghostFirstDistance: ghostFirstDistance, ghostFirstMidpoint: ghostFirstMidpoint, fontSize: platform === PlatformType.H5 ? 12 * overlayScale : 30 * overlayScale, showFirstDistance: platform !== PlatformType.H5 }), hoverVertex && !dragState.isDragging && (jsx(VertexElement, { cx: hoverVertex.position.x, cy: hoverVertex.position.y, stroke: strokeColor, strokeOpacity: 0.6, fill: "white", fillOpacity: 0.8, pointerEvents: "none" })), ((createMode && showPoints) || editMode || (createMode && completed)) &&
+                }), ghostLastPath && (jsx("path", { d: ghostLastPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), ghostFirstPath && renderCoordinates.length >= 2 && (jsx("path", { d: ghostFirstPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), jsx(DragDistanceIndicator, { dragState: dragState, strokeColor: strokeColor, editMode: editMode, createMode: createMode, completed: completed, fontSize: platform === PlatformType.H5 ? 12 * overlayScale : 30 * overlayScale, unitType: unitType }), jsx(DistanceLabels, { coordinates: renderCoordinates, createMode: createMode, editMode: editMode, completed: completed, showPoints: showPoints, mousePos: mousePos, ghostLastDistance: ghostLastDistance, ghostLastMidpoint: ghostLastMidpoint, ghostFirstDistance: ghostFirstDistance, ghostFirstMidpoint: ghostFirstMidpoint, fontSize: platform === PlatformType.H5 ? 12 * overlayScale : 30 * overlayScale, showFirstDistance: platform !== PlatformType.H5, unit: unitType }), hoverVertex && !dragState.isDragging && (jsx(VertexElement, { cx: hoverVertex.position.x, cy: hoverVertex.position.y, stroke: strokeColor, strokeOpacity: 0.6, fill: "white", fillOpacity: 0.8, pointerEvents: "none" })), ((createMode && showPoints) || editMode || (createMode && completed)) &&
                 renderCoordinates.map((coord, idx) => {
                     // 判断当前顶点的状态
                     const isLastPoint = idx === renderCoordinates.length - 1;
@@ -16749,7 +16850,8 @@ const ObstacleElement = ({ data }) => {
         if (platform === PlatformType.H5 &&
             editMapInfo?.selectElement?.id === data.id &&
             editMapInfo.mobileMode === MobileEditMode.START) {
-            return dp2px((style.lineWidth || 3) * 3);
+            return dp2px((style.lineWidth || 1) * 2);
+            // return dp2px(((style.lineWidth as number) || 3) * 3);
         }
         return dp2px(style.lineWidth || 3);
     }, [platform, style, editMapInfo]);
@@ -17209,15 +17311,15 @@ const useVisionOffTransform = (data, scaleConstraints
     };
 };
-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 _g$5, _defs$5;
+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 SvgTransformDelete = function SvgTransformDelete(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$5({
+  return /*#__PURE__*/React.createElement("svg", _extends$a({
     xmlns: "http://www.w3.org/2000/svg",
     width: 20,
     height: 20,
     fill: "none"
-  }, props), _g$3 || (_g$3 = /*#__PURE__*/React.createElement("g", {
+  }, props), _g$5 || (_g$5 = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-delete_svg__a)"
   }, /*#__PURE__*/React.createElement("circle", {
     cx: 10,
@@ -17240,7 +17342,7 @@ var SvgTransformDelete = function SvgTransformDelete(props) {
     fill: "#fff",
     rx: 0.8,
     transform: "rotate(45 6.323 5.191)"
-  }))), _defs$3 || (_defs$3 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs$5 || (_defs$5 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-delete_svg__b",
     x1: 17.727,
     x2: -1.215,
@@ -17260,15 +17362,15 @@ var SvgTransformDelete = function SvgTransformDelete(props) {
   })))));
 };
-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 _g$4, _defs$4;
+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 SvgTransformRotate = function SvgTransformRotate(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$4({
+  return /*#__PURE__*/React.createElement("svg", _extends$9({
     xmlns: "http://www.w3.org/2000/svg",
     width: 21,
     height: 20,
     fill: "none"
-  }, props), _g$2 || (_g$2 = /*#__PURE__*/React.createElement("g", {
+  }, props), _g$4 || (_g$4 = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-rotate_svg__a)"
   }, /*#__PURE__*/React.createElement("path", {
     fill: "url(#transform-rotate_svg__b)",
@@ -17276,7 +17378,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$2 || (_defs$2 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs$4 || (_defs$4 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-rotate_svg__b",
     x1: 17.84,
     x2: -1.103,
@@ -17296,15 +17398,15 @@ var SvgTransformRotate = function SvgTransformRotate(props) {
   })))));
 };
-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 _g$3, _defs$3;
+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 SvgTransformScale = function SvgTransformScale(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$3({
+  return /*#__PURE__*/React.createElement("svg", _extends$8({
     xmlns: "http://www.w3.org/2000/svg",
     width: 21,
     height: 20,
     fill: "none"
-  }, props), _g$1 || (_g$1 = /*#__PURE__*/React.createElement("g", {
+  }, props), _g$3 || (_g$3 = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-scale_svg__a)"
   }, /*#__PURE__*/React.createElement("path", {
     fill: "url(#transform-scale_svg__b)",
@@ -17312,7 +17414,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$1 || (_defs$1 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs$3 || (_defs$3 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-scale_svg__b",
     x1: 17.84,
     x2: -1.103,
@@ -17332,15 +17434,15 @@ var SvgTransformScale = function SvgTransformScale(props) {
   })))));
 };
-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 _g$2, _defs$2;
+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 SvgTransformTranslate = function SvgTransformTranslate(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$2({
+  return /*#__PURE__*/React.createElement("svg", _extends$7({
     xmlns: "http://www.w3.org/2000/svg",
     width: 20,
     height: 20,
     fill: "none"
-  }, props), _g || (_g = /*#__PURE__*/React.createElement("g", {
+  }, props), _g$2 || (_g$2 = /*#__PURE__*/React.createElement("g", {
     clipPath: "url(#transform-translate_svg__a)"
   }, /*#__PURE__*/React.createElement("circle", {
     cx: 10,
@@ -17350,7 +17452,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 || (_defs = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
+  }))), _defs$2 || (_defs$2 = /*#__PURE__*/React.createElement("defs", null, /*#__PURE__*/React.createElement("linearGradient", {
     id: "transform-translate_svg__b",
     x1: 17.727,
     x2: -1.215,
@@ -17372,7 +17474,7 @@ var SvgTransformTranslate = function SvgTransformTranslate(props) {
 const VisionOffTransformWrapper = ({ data, isSelected = false, onSelect, onCancel, onDragEnd, onDragMove, disabled = false, className = '', scaleConstraints = { minEdgeLength: 0.5, maxEdgeLength: 10000 }, showInfo = true, }) => {
     const { overlayScale } = useCommonContext();
-    const { platform } = useCommonContext();
+    const { platform, unitType } = useCommonContext();
     const { editMapInfo } = useMapEditContext();
     const dataPoints = useMemo(() => {
         return {
@@ -17396,10 +17498,10 @@ const VisionOffTransformWrapper = ({ data, isSelected = false, onSelect, onCance
         if (platform === PlatformType.H5) {
             if (editMapInfo?.mobileMode === MobileEditMode.START &&
                 editMapInfo?.selectElement?.id === data.id) {
-                return dp2px((style.lineWidth || 2) * 2);
+                return dp2px((style.lineWidth || 1) * 2);
             }
         }
-        return dp2px(style.lineWidth || 2);
+        return dp2px(style.lineWidth || 1);
     }, [style, platform, editMapInfo, data]);
     // 初始化 - 无论是否选中都要初始化点坐标
     useEffect(() => {
@@ -17567,7 +17669,7 @@ const VisionOffTransformWrapper = ({ data, isSelected = false, onSelect, onCance
                                         color: 'white',
                                         fontWeight: '400',
                                         // transform: `translate(0, ${50 * overlayScale}px) scale(${overlayScale})`,
-                                    }, children: [dimensions.height, " m \u00D7 ", dimensions.width, " m"] }) }))] }));
+                                    }, children: [convertDistanceByUnits(dimensions.height, unitType).value, " \u00D7", ' ', convertDistanceByUnits(dimensions.width, unitType).value] }) }))] }));
                 })()] }));
 };
@@ -18028,15 +18130,15 @@ const useDoodleTransform = (data, onTransformChange, options) => {
     };
 };
-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 _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 SvgTransformArrow = function SvgTransformArrow(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends$1({
+  return /*#__PURE__*/React.createElement("svg", _extends$6({
     xmlns: "http://www.w3.org/2000/svg",
     width: 7,
     height: 11,
     fill: "none"
-  }, props), _path$1 || (_path$1 = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$4 || (_path$4 = /*#__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
@@ -18098,7 +18200,7 @@ const DoodleTransform = ({ data, isSelected: _isSelected, onSelect }) => {
 };
 const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOperation = false, onSelect, onCancel, onTransformChange, disabled = false, className = '', minScale, onMinScaleReached, onDragMove, onDragEnd, showInfo = true, onClickInfo, }) => {
-    const { platform, overlayScale } = useCommonContext();
+    const { platform, overlayScale, unitType } = useCommonContext();
     // 使用自定义hook管理所有变换逻辑
     const { currentCenter, currentScale, currentDirection, isDragging, isRotating, isScaling, initializeTransform, calculateSelectionBoxPoints, handleMouseDown, handleRotateStart, handleScaleStart, handleMouseMove, handleMouseUp, containerRef, dimensions, } = useDoodleTransform(data, onTransformChange, {
         minScale,
@@ -18362,7 +18464,7 @@ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOpe
                                         color: 'white',
                                         fontWeight: '400',
                                         // transform: `translate(0, ${50 * overlayScale}px) scale(${overlayScale})`,
-                                    }, children: [jsxs("div", { children: [dimensions.width, " m \u00D7 ", dimensions.height, " m"] }), jsxs("div", { style: {
+                                    }, children: [jsxs("div", { children: [convertDistanceByUnits(dimensions.width, unitType).value, " \u00D7", ' ', convertDistanceByUnits(dimensions.height, unitType).value] }), jsxs("div", { style: {
                                                 display: 'flex',
                                                 alignItems: 'center',
                                                 justifyContent: 'center',
@@ -18555,9 +18657,9 @@ const GElement = ({ type, children }) => {
     return jsx("g", { id: `layer-${type}`, children: children }, type);
 };
-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 css_248z$4 = ".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$4 = {"mapEdit":"index-module_mapEdit__XC5Gw","createMode":"index-module_createMode__14EPH","notCreateCursor":"index-module_notCreateCursor__1-OjF"};
+styleInject(css_248z$4);
 var classnames = {exports: {}};
@@ -19580,7 +19682,7 @@ function usePolygonDrawing(options = {}) {
         const p = getSvgPoint(svgEl, e.clientX, e.clientY);
         if (!p)
             return;
-        if (checkCanNotCreateAtPosition(p)) {
+        if (checkCanNotCreateAtPosition(p)?.result) {
             message.error('Unable to place here, please select a valid spot');
             return;
         }
@@ -19754,24 +19856,38 @@ const CreateObstacleElement = forwardRef(({ enabled = false, svgElement, onPoint
     const addPoint = useCallback(() => {
         if (!enabled || !svgElement) {
             console.warn('未启用创建模式或SVG元素不存在');
-            return { isValid: false, reason: '未启用创建模式或SVG元素不存在' };
+            return {
+                isValid: false,
+                reason: '未启用创建模式或SVG元素不存在',
+                code: CheckObstaclePointErrorType.COMMON_ERROR,
+            };
         }
         if (!mapRef) {
             console.warn('地图实例不存在');
-            return { isValid: false, reason: '地图实例不存在' };
+            return {
+                isValid: false,
+                reason: '地图实例不存在',
+                code: CheckObstaclePointErrorType.MAP_NOT_EXIST,
+            };
         }
         const centerPoint = getScreenCenterSvgPoint(svgElement, mapRef);
         if (!centerPoint) {
             console.warn('无法获取屏幕中心点的SVG坐标或点不在SVG可见区域内');
-            return { isValid: false, reason: '无法获取屏幕中心点的SVG坐标或点不在SVG可见区域内' };
+            return {
+                isValid: false,
+                reason: '无法获取屏幕中心点的SVG坐标或点不在SVG可见区域内',
+                code: CheckObstaclePointErrorType.GET_POINT_FAILED,
+            };
         }
         console.error('centerPoint--->', centerPoint);
-        console.error('checkCanNotCreateAtPosition--->', checkCanNotCreateAtPosition(centerPoint));
+        console.error('checkCanNotCreateAtPosition--->', checkCanNotCreateAtPosition(centerPoint).result);
         // 校验是否能打点
-        if (checkCanNotCreateAtPosition(centerPoint)) {
+        const checkResult = checkCanNotCreateAtPosition(centerPoint);
+        if (checkResult.result) {
             return {
                 isValid: false,
-                reason: '无法获取屏幕中心点的SVG坐标或点不在SVG可见区域内',
+                reason: '',
+                code: checkResult.code || CheckObstaclePointErrorType.COMMON_ERROR,
             };
         }
         const newPoints = [...points, centerPoint];
@@ -19812,7 +19928,7 @@ const CreateObstacleElement = forwardRef(({ enabled = false, svgElement, onPoint
     if (!enabled || points.length === 0) {
         return null;
     }
-    return (jsx(PolygonElement, { points: points.map((p) => [p.x, p.y, 2]), fillColor: styles.fillColor, fillOpacity: 0.3, strokeColor: styles.strokeColor, strokeWidth: 2, strokeOpacity: 1, createMode: true, showPoints: true, editMode: false, completed: true, draggable: false }));
+    return (jsx(PolygonElement, { points: points.map((p) => [p.x, p.y, 2]), fillColor: styles.fillColor, fillOpacity: 0.3, strokeColor: styles.strokeColor, strokeWidth: 1, strokeOpacity: 1, createMode: true, showPoints: true, editMode: false, completed: true, draggable: false }));
 });
 CreateObstacleElement.displayName = 'CreateObstacleElement';
@@ -20107,11 +20223,11 @@ const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChang
     const showNotCreateCursor = useMemo(() => {
         if (!mousePos)
             return false;
-        return checkCanNotCreateAtPosition(mousePos);
+        return checkCanNotCreateAtPosition(mousePos)?.result ?? false;
     }, [mousePos, checkCanNotCreateAtPosition]);
-    return (jsx("div", { ref: containerRef, className: classNames(styles$1.mapEdit, {
-            [styles$1.createMode]: isCreating,
-            [styles$1.notCreateCursor]: showNotCreateCursor,
+    return (jsx("div", { ref: containerRef, className: classNames(styles$4.mapEdit, {
+            [styles$4.createMode]: isCreating,
+            [styles$4.notCreateCursor]: showNotCreateCursor,
         }), style: {
             display: editMap ? 'block' : 'none',
         }, children: jsxs("svg", { style: {
@@ -20209,15 +20325,15 @@ const SvgEditMap = forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChang
 });
 SvgEditMap.displayName = 'SvgEditMap';
-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 _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 SvgMobileAddPoint = function SvgMobileAddPoint(props) {
-  return /*#__PURE__*/React.createElement("svg", _extends({
+  return /*#__PURE__*/React.createElement("svg", _extends$5({
     xmlns: "http://www.w3.org/2000/svg",
     width: 36,
     height: 36,
     fill: "none"
-  }, props), _path || (_path = /*#__PURE__*/React.createElement("path", {
+  }, props), _path$3 || (_path$3 = /*#__PURE__*/React.createElement("path", {
     stroke: "#fff",
     strokeLinecap: "round",
     strokeLinejoin: "round",
@@ -20226,9 +20342,9 @@ var SvgMobileAddPoint = function SvgMobileAddPoint(props) {
   })));
 };
-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 css_248z$3 = ".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$3 = {"crosshair":"index-module_crosshair__etey6"};
+styleInject(css_248z$3);
 /**
  * 十字准心组件
@@ -20245,7 +20361,460 @@ const Crosshair = () => {
         }
         return false;
     }, [platform, editMapInfo]);
-    return isVisible ? (jsx("div", { className: styles.crosshair, children: jsx(SvgMobileAddPoint, {}) })) : null;
+    return isVisible ? (jsx("div", { className: styles$3.crosshair, children: jsx(SvgMobileAddPoint, {}) })) : null;
+};
+var css_248z$2 = ".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$2 = {"addEntry":"index-module_addEntry__QsQHD","icon":"index-module_icon__qIgA4","addItem":"index-module_addItem__mglwZ","label":"index-module_label__QqZ-9"};
+styleInject(css_248z$2);
+var _rect$2, _path$2, _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 SvgAddEntry = function SvgAddEntry(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends$4({
+    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$2 || (_path$2 = /*#__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$1 || (_defs$1 = /*#__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$1, _path2$1, _path3;
+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 SvgBoundary = function SvgBoundary(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends$3({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none"
+  }, props), _path$1 || (_path$1 = /*#__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$1 || (_path2$1 = /*#__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, _path2, _rect$1, _rect2$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 SvgLimitIsland = function SvgLimitIsland(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends$2({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none"
+  }, props), _path || (_path = /*#__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 || (_path2 = /*#__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
+  })));
+};
+var _rect, _rect2, _rect3, _rect4, _g$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 SvgVisionFence = function SvgVisionFence(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends$1({
+    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$1 || (_g$1 = /*#__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 _g, _defs;
+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 SvgDoodle = function SvgDoodle(props) {
+  return /*#__PURE__*/React.createElement("svg", _extends({
+    xmlns: "http://www.w3.org/2000/svg",
+    width: 16,
+    height: 16,
+    fill: "none"
+  }, props), _g || (_g = /*#__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 || (_defs = /*#__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"
+  })))));
+};
+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$1 = ".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$1 = {"modal":"index-module_modal__fkxhn","center":"index-module_center__d461v"};
+styleInject(css_248z$1);
+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$1.modal, {
+            [styles$1.center]: titleCenter,
+        }), cancelButtonProps: { color: 'primary', variant: 'outlined' }, cancelText: 'Cancel', ...props, children: children }));
+};
+var css_248z = ".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 = {"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);
+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.doodleModal, children: [jsx("div", { className: styles.title, children: "Select the doodle that you want to create" }), jsx("div", { className: styles.content, children: doodleList
+                        ?.filter((item) => !noNeed.includes(item.name))
+                        .map((item) => {
+                        return (jsx("div", { className: classNames(styles.item, {
+                                [styles.active]: selectedDoodle?.svg === item.svg,
+                            }), onClick: () => handleSelectDoodle(item), children: jsx("div", { className: styles.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$2.addEntry, children: [jsx(Popover, { open: open, onOpenChange: setOpen, arrow: false, placement: "leftTop", content: addItems?.map((item) => {
+                    return (jsxs("div", { className: styles$2.addItem, onClick: () => {
+                            addNewElement(item.type, item);
+                        }, children: [jsx("div", { className: styles$2.icon, children: item?.icon }), jsx("div", { className: styles$2.label, children: item?.label })] }, item.label));
+                }), children: jsx("div", { className: styles$2.icon, children: jsx(SvgAddEntry, {}) }) }), jsx(DoodleModal, { centerPoint: centerPoint, doodleList: doodleList, open: doodleOpen, onOk: () => setDoodleOpen(false), setOpen: setDoodleOpen })] }));
 };
 // 验证GPS坐标是否有效
@@ -20684,6 +21253,14 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
     useEffect(() => {
         setDrag(defaultTransform ?? { x: 0, y: 0, rotation: 0 });
     }, [defaultTransform]);
+    useEffect(() => {
+        // 监听drag变化，比较drag和defaultTransform
+        onHandleEvent?.(ClickEventType.DRAG_MAP, {
+            isDragMap: drag.x !== defaultTransform.x ||
+                drag.y !== defaultTransform.y ||
+                drag.rotation !== defaultTransform.rotation,
+        });
+    }, [drag, defaultTransform, onHandleEvent]);
     // 监听地图zoom变化,计算缩放比例
     useEffect(() => {
         if (!mapRef)
@@ -20809,7 +21386,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 && (jsx(Fragment, {})), 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, { children: jsx(AddEntry, { disabledObstacles: disabledObstacles, doodleList: doodleList, editMap: editMap }) })), platform === PlatformType.H5 && jsx(Crosshair, {}), jsxs(OverlayViewF, { onLoad: (lay) => {
                             setOverlay(lay);
                         }, onDraw: (style) => {
                             const layout = Object.keys(style).reduce((pre, cur) => {
@@ -20889,4 +21466,4 @@ const BoundarySvgRender = React__default.memo(({ mapJson, id, maxWidth = 300 })
                 }) }), 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, PlatformType, RecordFunctionEnum, RecordTypeEnum, RenderType, SCALE_FACTOR, SvgParserNative, UnifiedMapDataProcessor, VisionOffData, calculateMapGpsCenter, estimateGpsFromMapBounds, initBoundary, initChannel, initDoodle, initObstacle, initVisionOff, restorePointsFormat };
+export { ALL_DIRECTION_SELECTED, AntennaData, AntennaDataBuilder, BaseData, BoundaryData, BoundarySvgRender, ChannelData, ChargingPileData, CheckDoodleErrorType, CheckObstaclePointErrorType, ClickEventType, CreateStatus, DataType, DoodleData, MAX_DIRECTION_ANGLE, MIN_DIRECTION_ANGLE, MapDataProcessor, MobileEditMode, MowerMapRenderer, ObstacleData, PathData, PathDataProcessor, PlatformType, RecordFunctionEnum, RecordTypeEnum, RenderType, SCALE_FACTOR, SvgParserNative, UnifiedMapDataProcessor, VisionOffData, calculateMapGpsCenter, estimateGpsFromMapBounds, initBoundary, initChannel, initDoodle, initObstacle, initVisionOff, restorePointsFormat };