@fleet-frontend/mower-maps 0.2.0-beta.1 → 0.2.0-beta.3

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 (42) hide show
  1. package/dist/index.esm.js +578 -139
  2. package/dist/index.js +578 -138
  3. package/dist/src/context/common.d.ts +3 -0
  4. package/dist/src/context/common.d.ts.map +1 -1
  5. package/dist/src/context/mapEdit.d.ts +21 -54
  6. package/dist/src/context/mapEdit.d.ts.map +1 -1
  7. package/dist/src/index.d.ts +1 -0
  8. package/dist/src/index.d.ts.map +1 -1
  9. package/dist/src/render/BoundarySvgRender.d.ts +10 -0
  10. package/dist/src/render/BoundarySvgRender.d.ts.map +1 -0
  11. package/dist/src/render/MowerMapRenderer.d.ts.map +1 -1
  12. package/dist/src/render/svgEditMap/components/AddEntry/components/DoodleModal/index.d.ts +1 -1
  13. package/dist/src/render/svgEditMap/components/AddEntry/components/DoodleModal/index.d.ts.map +1 -1
  14. package/dist/src/render/svgEditMap/components/AddEntry/index.d.ts.map +1 -1
  15. package/dist/src/render/svgEditMap/components/HandleElementInfo/boundary.d.ts.map +1 -1
  16. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/DirectionModal/index.d.ts.map +1 -1
  17. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/Header/index.d.ts +1 -1
  18. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/Header/index.d.ts.map +1 -1
  19. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/index.d.ts +2 -1
  20. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/index.d.ts.map +1 -1
  21. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/nameModal.d.ts +2 -1
  22. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/nameModal.d.ts.map +1 -1
  23. package/dist/src/render/svgEditMap/components/HandleElementInfo/components/TimePeriod/index.d.ts.map +1 -1
  24. package/dist/src/render/svgEditMap/components/HandleElementInfo/index.d.ts.map +1 -1
  25. package/dist/src/render/svgEditMap/components/HandleElementInfo/obstacle.d.ts.map +1 -1
  26. package/dist/src/render/svgEditMap/index.d.ts +2 -0
  27. package/dist/src/render/svgEditMap/index.d.ts.map +1 -1
  28. package/dist/src/render/svgElement/ChannelClipPath/index.d.ts.map +1 -1
  29. package/dist/src/render/svgElement/DoodleElement/index.d.ts.map +1 -1
  30. package/dist/src/render/svgElement/ObstacleElement/index.d.ts.map +1 -1
  31. package/dist/src/render/svgElement/PolygonELement/components/DistanceLabels.d.ts.map +1 -1
  32. package/dist/src/render/svgElement/PolygonELement/dashPath/index.d.ts.map +1 -1
  33. package/dist/src/render/svgElement/PolygonELement/index.d.ts +1 -1
  34. package/dist/src/render/svgElement/PolygonELement/index.d.ts.map +1 -1
  35. package/dist/src/render/svgElement/PolygonELement/vertex/index.d.ts.map +1 -1
  36. package/dist/src/render/svgElement/TransformWrapper/DoodleTransformWrapper/DoodleTransformWrapper.d.ts +1 -0
  37. package/dist/src/render/svgElement/TransformWrapper/DoodleTransformWrapper/DoodleTransformWrapper.d.ts.map +1 -1
  38. package/dist/src/render/svgElement/TransformWrapper/VisionOffTransformWrapper/VisionOffTransformWrapper.d.ts.map +1 -1
  39. package/dist/src/render/svgElement/VisionOffElement/index.d.ts.map +1 -1
  40. package/dist/src/types/renderer.d.ts +4 -1
  41. package/dist/src/types/renderer.d.ts.map +1 -1
  42. package/package.json +1 -1
package/dist/index.js CHANGED
@@ -3071,7 +3071,7 @@ function copyObject(source, props, object, customizer) {
3071
3071
  }
3072
3072
 
3073
3073
  /* Built-in method references for those with the same name as other `lodash` methods. */
3074
- var nativeMax$1 = Math.max;
3074
+ var nativeMax$2 = Math.max;
3075
3075
 
3076
3076
  /**
3077
3077
  * A specialized version of `baseRest` which transforms the rest array.
@@ -3083,11 +3083,11 @@ var nativeMax$1 = Math.max;
3083
3083
  * @returns {Function} Returns the new function.
3084
3084
  */
3085
3085
  function overRest(func, start, transform) {
3086
- start = nativeMax$1(start === undefined ? (func.length - 1) : start, 0);
3086
+ start = nativeMax$2(start === undefined ? (func.length - 1) : start, 0);
3087
3087
  return function() {
3088
3088
  var args = arguments,
3089
3089
  index = -1,
3090
- length = nativeMax$1(args.length - start, 0),
3090
+ length = nativeMax$2(args.length - start, 0),
3091
3091
  array = Array(length);
3092
3092
 
3093
3093
  while (++index < length) {
@@ -4089,7 +4089,7 @@ function isPlainObject(value) {
4089
4089
 
4090
4090
  /* Built-in method references for those with the same name as other `lodash` methods. */
4091
4091
  var nativeIsFinite = root$3.isFinite,
4092
- nativeMin$1 = Math.min;
4092
+ nativeMin$2 = Math.min;
4093
4093
 
4094
4094
  /**
4095
4095
  * Creates a function like `_.round`.
@@ -4102,7 +4102,7 @@ function createRound(methodName) {
4102
4102
  var func = Math[methodName];
4103
4103
  return function(number, precision) {
4104
4104
  number = toNumber$2(number);
4105
- precision = precision == null ? 0 : nativeMin$1(toInteger(precision), 292);
4105
+ precision = precision == null ? 0 : nativeMin$2(toInteger(precision), 292);
4106
4106
  if (precision && nativeIsFinite(number)) {
4107
4107
  // Shift with exponential notation to avoid floating-point issues.
4108
4108
  // See [MDN](https://mdn.io/round#Examples) for more details.
@@ -4325,6 +4325,212 @@ function createBaseFor(fromRight) {
4325
4325
  */
4326
4326
  var baseFor = createBaseFor();
4327
4327
 
4328
+ /**
4329
+ * Gets the timestamp of the number of milliseconds that have elapsed since
4330
+ * the Unix epoch (1 January 1970 00:00:00 UTC).
4331
+ *
4332
+ * @static
4333
+ * @memberOf _
4334
+ * @since 2.4.0
4335
+ * @category Date
4336
+ * @returns {number} Returns the timestamp.
4337
+ * @example
4338
+ *
4339
+ * _.defer(function(stamp) {
4340
+ * console.log(_.now() - stamp);
4341
+ * }, _.now());
4342
+ * // => Logs the number of milliseconds it took for the deferred invocation.
4343
+ */
4344
+ var now$2 = function() {
4345
+ return root$3.Date.now();
4346
+ };
4347
+
4348
+ /** Error message constants. */
4349
+ var FUNC_ERROR_TEXT$3 = 'Expected a function';
4350
+
4351
+ /* Built-in method references for those with the same name as other `lodash` methods. */
4352
+ var nativeMax$1 = Math.max,
4353
+ nativeMin$1 = Math.min;
4354
+
4355
+ /**
4356
+ * Creates a debounced function that delays invoking `func` until after `wait`
4357
+ * milliseconds have elapsed since the last time the debounced function was
4358
+ * invoked. The debounced function comes with a `cancel` method to cancel
4359
+ * delayed `func` invocations and a `flush` method to immediately invoke them.
4360
+ * Provide `options` to indicate whether `func` should be invoked on the
4361
+ * leading and/or trailing edge of the `wait` timeout. The `func` is invoked
4362
+ * with the last arguments provided to the debounced function. Subsequent
4363
+ * calls to the debounced function return the result of the last `func`
4364
+ * invocation.
4365
+ *
4366
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
4367
+ * invoked on the trailing edge of the timeout only if the debounced function
4368
+ * is invoked more than once during the `wait` timeout.
4369
+ *
4370
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
4371
+ * until to the next tick, similar to `setTimeout` with a timeout of `0`.
4372
+ *
4373
+ * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
4374
+ * for details over the differences between `_.debounce` and `_.throttle`.
4375
+ *
4376
+ * @static
4377
+ * @memberOf _
4378
+ * @since 0.1.0
4379
+ * @category Function
4380
+ * @param {Function} func The function to debounce.
4381
+ * @param {number} [wait=0] The number of milliseconds to delay.
4382
+ * @param {Object} [options={}] The options object.
4383
+ * @param {boolean} [options.leading=false]
4384
+ * Specify invoking on the leading edge of the timeout.
4385
+ * @param {number} [options.maxWait]
4386
+ * The maximum time `func` is allowed to be delayed before it's invoked.
4387
+ * @param {boolean} [options.trailing=true]
4388
+ * Specify invoking on the trailing edge of the timeout.
4389
+ * @returns {Function} Returns the new debounced function.
4390
+ * @example
4391
+ *
4392
+ * // Avoid costly calculations while the window size is in flux.
4393
+ * jQuery(window).on('resize', _.debounce(calculateLayout, 150));
4394
+ *
4395
+ * // Invoke `sendMail` when clicked, debouncing subsequent calls.
4396
+ * jQuery(element).on('click', _.debounce(sendMail, 300, {
4397
+ * 'leading': true,
4398
+ * 'trailing': false
4399
+ * }));
4400
+ *
4401
+ * // Ensure `batchLog` is invoked once after 1 second of debounced calls.
4402
+ * var debounced = _.debounce(batchLog, 250, { 'maxWait': 1000 });
4403
+ * var source = new EventSource('/stream');
4404
+ * jQuery(source).on('message', debounced);
4405
+ *
4406
+ * // Cancel the trailing debounced invocation.
4407
+ * jQuery(window).on('popstate', debounced.cancel);
4408
+ */
4409
+ function debounce$2(func, wait, options) {
4410
+ var lastArgs,
4411
+ lastThis,
4412
+ maxWait,
4413
+ result,
4414
+ timerId,
4415
+ lastCallTime,
4416
+ lastInvokeTime = 0,
4417
+ leading = false,
4418
+ maxing = false,
4419
+ trailing = true;
4420
+
4421
+ if (typeof func != 'function') {
4422
+ throw new TypeError(FUNC_ERROR_TEXT$3);
4423
+ }
4424
+ wait = toNumber$2(wait) || 0;
4425
+ if (isObject$4(options)) {
4426
+ leading = !!options.leading;
4427
+ maxing = 'maxWait' in options;
4428
+ maxWait = maxing ? nativeMax$1(toNumber$2(options.maxWait) || 0, wait) : maxWait;
4429
+ trailing = 'trailing' in options ? !!options.trailing : trailing;
4430
+ }
4431
+
4432
+ function invokeFunc(time) {
4433
+ var args = lastArgs,
4434
+ thisArg = lastThis;
4435
+
4436
+ lastArgs = lastThis = undefined;
4437
+ lastInvokeTime = time;
4438
+ result = func.apply(thisArg, args);
4439
+ return result;
4440
+ }
4441
+
4442
+ function leadingEdge(time) {
4443
+ // Reset any `maxWait` timer.
4444
+ lastInvokeTime = time;
4445
+ // Start the timer for the trailing edge.
4446
+ timerId = setTimeout(timerExpired, wait);
4447
+ // Invoke the leading edge.
4448
+ return leading ? invokeFunc(time) : result;
4449
+ }
4450
+
4451
+ function remainingWait(time) {
4452
+ var timeSinceLastCall = time - lastCallTime,
4453
+ timeSinceLastInvoke = time - lastInvokeTime,
4454
+ timeWaiting = wait - timeSinceLastCall;
4455
+
4456
+ return maxing
4457
+ ? nativeMin$1(timeWaiting, maxWait - timeSinceLastInvoke)
4458
+ : timeWaiting;
4459
+ }
4460
+
4461
+ function shouldInvoke(time) {
4462
+ var timeSinceLastCall = time - lastCallTime,
4463
+ timeSinceLastInvoke = time - lastInvokeTime;
4464
+
4465
+ // Either this is the first call, activity has stopped and we're at the
4466
+ // trailing edge, the system time has gone backwards and we're treating
4467
+ // it as the trailing edge, or we've hit the `maxWait` limit.
4468
+ return (lastCallTime === undefined || (timeSinceLastCall >= wait) ||
4469
+ (timeSinceLastCall < 0) || (maxing && timeSinceLastInvoke >= maxWait));
4470
+ }
4471
+
4472
+ function timerExpired() {
4473
+ var time = now$2();
4474
+ if (shouldInvoke(time)) {
4475
+ return trailingEdge(time);
4476
+ }
4477
+ // Restart the timer.
4478
+ timerId = setTimeout(timerExpired, remainingWait(time));
4479
+ }
4480
+
4481
+ function trailingEdge(time) {
4482
+ timerId = undefined;
4483
+
4484
+ // Only invoke if we have `lastArgs` which means `func` has been
4485
+ // debounced at least once.
4486
+ if (trailing && lastArgs) {
4487
+ return invokeFunc(time);
4488
+ }
4489
+ lastArgs = lastThis = undefined;
4490
+ return result;
4491
+ }
4492
+
4493
+ function cancel() {
4494
+ if (timerId !== undefined) {
4495
+ clearTimeout(timerId);
4496
+ }
4497
+ lastInvokeTime = 0;
4498
+ lastArgs = lastCallTime = lastThis = timerId = undefined;
4499
+ }
4500
+
4501
+ function flush() {
4502
+ return timerId === undefined ? result : trailingEdge(now$2());
4503
+ }
4504
+
4505
+ function debounced() {
4506
+ var time = now$2(),
4507
+ isInvoking = shouldInvoke(time);
4508
+
4509
+ lastArgs = arguments;
4510
+ lastThis = this;
4511
+ lastCallTime = time;
4512
+
4513
+ if (isInvoking) {
4514
+ if (timerId === undefined) {
4515
+ return leadingEdge(lastCallTime);
4516
+ }
4517
+ if (maxing) {
4518
+ // Handle invocations in a tight loop.
4519
+ clearTimeout(timerId);
4520
+ timerId = setTimeout(timerExpired, wait);
4521
+ return invokeFunc(lastCallTime);
4522
+ }
4523
+ }
4524
+ if (timerId === undefined) {
4525
+ timerId = setTimeout(timerExpired, wait);
4526
+ }
4527
+ return result;
4528
+ }
4529
+ debounced.cancel = cancel;
4530
+ debounced.flush = flush;
4531
+ return debounced;
4532
+ }
4533
+
4328
4534
  /**
4329
4535
  * This function is like `assignValue` except that it doesn't assign
4330
4536
  * `undefined` values.
@@ -4609,6 +4815,71 @@ var merge$1 = createAssigner(function(object, source, srcIndex) {
4609
4815
  */
4610
4816
  var round = createRound('round');
4611
4817
 
4818
+ /** Error message constants. */
4819
+ var FUNC_ERROR_TEXT$2 = 'Expected a function';
4820
+
4821
+ /**
4822
+ * Creates a throttled function that only invokes `func` at most once per
4823
+ * every `wait` milliseconds. The throttled function comes with a `cancel`
4824
+ * method to cancel delayed `func` invocations and a `flush` method to
4825
+ * immediately invoke them. Provide `options` to indicate whether `func`
4826
+ * should be invoked on the leading and/or trailing edge of the `wait`
4827
+ * timeout. The `func` is invoked with the last arguments provided to the
4828
+ * throttled function. Subsequent calls to the throttled function return the
4829
+ * result of the last `func` invocation.
4830
+ *
4831
+ * **Note:** If `leading` and `trailing` options are `true`, `func` is
4832
+ * invoked on the trailing edge of the timeout only if the throttled function
4833
+ * is invoked more than once during the `wait` timeout.
4834
+ *
4835
+ * If `wait` is `0` and `leading` is `false`, `func` invocation is deferred
4836
+ * until to the next tick, similar to `setTimeout` with a timeout of `0`.
4837
+ *
4838
+ * See [David Corbacho's article](https://css-tricks.com/debouncing-throttling-explained-examples/)
4839
+ * for details over the differences between `_.throttle` and `_.debounce`.
4840
+ *
4841
+ * @static
4842
+ * @memberOf _
4843
+ * @since 0.1.0
4844
+ * @category Function
4845
+ * @param {Function} func The function to throttle.
4846
+ * @param {number} [wait=0] The number of milliseconds to throttle invocations to.
4847
+ * @param {Object} [options={}] The options object.
4848
+ * @param {boolean} [options.leading=true]
4849
+ * Specify invoking on the leading edge of the timeout.
4850
+ * @param {boolean} [options.trailing=true]
4851
+ * Specify invoking on the trailing edge of the timeout.
4852
+ * @returns {Function} Returns the new throttled function.
4853
+ * @example
4854
+ *
4855
+ * // Avoid excessively updating the position while scrolling.
4856
+ * jQuery(window).on('scroll', _.throttle(updatePosition, 100));
4857
+ *
4858
+ * // Invoke `renewToken` when the click event is fired, but not more than once every 5 minutes.
4859
+ * var throttled = _.throttle(renewToken, 300000, { 'trailing': false });
4860
+ * jQuery(element).on('click', throttled);
4861
+ *
4862
+ * // Cancel the trailing throttled invocation.
4863
+ * jQuery(window).on('popstate', throttled.cancel);
4864
+ */
4865
+ function throttle$2(func, wait, options) {
4866
+ var leading = true,
4867
+ trailing = true;
4868
+
4869
+ if (typeof func != 'function') {
4870
+ throw new TypeError(FUNC_ERROR_TEXT$2);
4871
+ }
4872
+ if (isObject$4(options)) {
4873
+ leading = 'leading' in options ? !!options.leading : leading;
4874
+ trailing = 'trailing' in options ? !!options.trailing : trailing;
4875
+ }
4876
+ return debounce$2(func, wait, {
4877
+ 'leading': leading,
4878
+ 'maxWait': wait,
4879
+ 'trailing': trailing
4880
+ });
4881
+ }
4882
+
4612
4883
  /**
4613
4884
  * 工具模块类型定义
4614
4885
  */
@@ -13746,6 +14017,7 @@ const CommonContext = React.createContext({
13746
14017
  mapRef: null,
13747
14018
  globalHeight: 0,
13748
14019
  heightOptions: [],
14020
+ overlayScale: 1,
13749
14021
  });
13750
14022
  const CommonContextProvider = CommonContext.Provider;
13751
14023
  const useCommonContext = () => React.useContext(CommonContext);
@@ -14755,13 +15027,15 @@ function generateStraightParallelPaths(points, offsetDistance) {
14755
15027
  }
14756
15028
  return [parallelPath2Data, parallelPath1Data];
14757
15029
  }
14758
- const DashPath = ({ points, stroke, strokeWidth, strokeOpacity, className }) => {
15030
+ const DashPath = ({ points, stroke, strokeWidth, strokeOpacity, className, }) => {
14759
15031
  const [parallelPath2Data, parallelPath1Data] = generateStraightParallelPaths(points, strokeWidth);
14760
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { className: className, fill: "none", d: parallelPath2Data, stroke: stroke, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity, strokeLinecap: "round", strokeLinejoin: "round", strokeDasharray: `${strokeWidth}px ${strokeWidth * 2}px`, style: { pointerEvents: 'none' } }), jsxRuntime.jsx("path", { className: className, fill: "none", d: parallelPath1Data, stroke: stroke, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity, strokeLinecap: "round", strokeLinejoin: "round", strokeDasharray: `${strokeWidth}px ${strokeWidth * 2}px`, style: { pointerEvents: 'none' } })] }));
15032
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("path", { fill: "none", d: parallelPath2Data, stroke: stroke, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity, strokeLinecap: "round", strokeLinejoin: "round", strokeDasharray: `${strokeWidth}px ${strokeWidth * 2}px`, style: { pointerEvents: 'none' }, vectorEffect: "non-scaling-stroke" }), jsxRuntime.jsx("path", { fill: "none", d: parallelPath1Data, stroke: stroke, strokeWidth: strokeWidth, strokeOpacity: strokeOpacity, strokeLinecap: "round", strokeLinejoin: "round", strokeDasharray: `${strokeWidth}px ${strokeWidth * 2}px`, style: { pointerEvents: 'none' }, vectorEffect: "non-scaling-stroke" })] }));
14761
15033
  };
14762
15034
 
14763
15035
  const VertexElement = React.memo(({ r, stroke, ...props }) => {
14764
- return (jsxRuntime.jsx("circle", { r: r || 12, stroke: stroke || "#fff", fill: "#fff", strokeWidth: 2, vectorEffect: "non-scaling-stroke", ...props }));
15036
+ const { overlayScale } = useCommonContext();
15037
+ const radius = typeof r === 'number' ? r : 12;
15038
+ return (jsxRuntime.jsx("circle", { r: radius * overlayScale, stroke: stroke || '#fff', fill: '#fff', strokeWidth: 2 * overlayScale, ...props }));
14765
15039
  });
14766
15040
 
14767
15041
  var _path$c;
@@ -14893,14 +15167,12 @@ const calculatePhysicalDistance$1 = (point1, point2) => {
14893
15167
  * @returns 中点坐标 [x, y]
14894
15168
  */
14895
15169
  const calculateMidpoint$1 = (point1, point2) => {
14896
- return [
14897
- (point1[0] + point2[0]) / 2,
14898
- (point1[1] + point2[1]) / 2
14899
- ];
15170
+ return [(point1[0] + point2[0]) / 2, (point1[1] + point2[1]) / 2];
14900
15171
  };
14901
15172
  const DistanceLabels = ({ coordinates, createMode = false, editMode = false, completed = false, showPoints = false, mousePos: _mousePos = null, ghostLastDistance = null, ghostLastMidpoint = null, ghostFirstDistance = null, ghostFirstMidpoint = null, }) => {
14902
15173
  // 只在显示可操作顶点时显示距离
14903
- if (!(createMode && showPoints || editMode || (createMode && completed)) || coordinates.length < 2) {
15174
+ if (!((createMode && showPoints) || editMode || (createMode && completed)) ||
15175
+ coordinates.length < 1) {
14904
15176
  return null;
14905
15177
  }
14906
15178
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [coordinates.map((coord, idx) => {
@@ -14945,23 +15217,20 @@ var MobileEditMode;
14945
15217
  MobileEditMode[MobileEditMode["EDIT"] = 1] = "EDIT";
14946
15218
  MobileEditMode[MobileEditMode["CREATE"] = 2] = "CREATE";
14947
15219
  })(MobileEditMode || (MobileEditMode = {}));
15220
+ var ClickEventType;
15221
+ (function (ClickEventType) {
15222
+ ClickEventType["DOODLE_ACTIVE_TIME"] = "doodleActiveTime";
15223
+ })(ClickEventType || (ClickEventType = {}));
14948
15224
  const INIT_EDIT_MAP_INFO = {
14949
- minDistance: 0,
14950
15225
  editMap: false,
14951
15226
  selectElement: null,
14952
- createMode: CreateStatus.CREATING,
15227
+ createMode: null,
14953
15228
  elementType: undefined,
14954
15229
  isShowDrag: false,
14955
15230
  mobileMode: MobileEditMode.START,
14956
15231
  allVisionOffPoints: [],
14957
15232
  historyList: [],
14958
15233
  currentHistoryIndex: 0,
14959
- onHandleEnterRecord: () => Promise.resolve(),
14960
- onHandleCompleteRecord: () => Promise.resolve(),
14961
- onHandleStopRecord: () => Promise.resolve(),
14962
- onSaveBoundaryData: () => Promise.resolve(),
14963
- onSaveMap: () => Promise.resolve(),
14964
- onHandleDeleteElement: () => Promise.resolve(),
14965
15234
  };
14966
15235
  const MapEditContext = React.createContext({
14967
15236
  editMapInfo: { ...INIT_EDIT_MAP_INFO },
@@ -15479,8 +15748,9 @@ const createPathData = (points) => {
15479
15748
  }
15480
15749
  return pathData;
15481
15750
  };
15482
- const PolygonElement = ({ coordinates, 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自动判断
15751
+ 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自动判断
15483
15752
  }) => {
15753
+ const { overlayScale } = useCommonContext();
15484
15754
  const { svgRef } = useSvgEditContext();
15485
15755
  const [dragState, setDragState] = React.useState({
15486
15756
  isDragging: false,
@@ -15496,6 +15766,10 @@ const PolygonElement = ({ coordinates, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpa
15496
15766
  const { checkCanNotCreateAtPosition } = useCheckElement();
15497
15767
  const { editMapInfo } = useMapEditContext();
15498
15768
  const { platform } = useCommonContext();
15769
+ // delete icon可能被上一个点遮挡,因为delete在右上方,所以手动处理点让点按照顺时针渲染,这样delete icon层级就会高一些
15770
+ const coordinates = React.useMemo(() => {
15771
+ return editMapInfo?.createMode === CreateStatus.CREATING ? points : [...points].reverse();
15772
+ }, [points, editMapInfo?.createMode]);
15499
15773
  // 计算点到线段的垂足坐标(使用通用工具函数)
15500
15774
  const calculatePerpendicularFoot$1 = React.useCallback((point, lineStart, lineEnd) => {
15501
15775
  return calculatePerpendicularFoot(point, lineStart, lineEnd);
@@ -15697,7 +15971,9 @@ const PolygonElement = ({ coordinates, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpa
15697
15971
  console.log('handleMouseUp', JSON.stringify(dragState));
15698
15972
  if (dragState.isDragging && dragState.currentPosition) {
15699
15973
  // 构建新的坐标数组
15700
- const newCoordinates = [...coordinates];
15974
+ const newCoordinates = editMapInfo?.createMode === CreateStatus.CREATING
15975
+ ? [...coordinates]
15976
+ : [...coordinates].reverse();
15701
15977
  // 如果是新创建的顶点,需要确保它已经被插入
15702
15978
  if (dragState.dragType === 'new' && dragState.newVertexIndex !== -1) {
15703
15979
  if (showNotCreateCursor) ;
@@ -15729,7 +16005,7 @@ const PolygonElement = ({ coordinates, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpa
15729
16005
  edgeInfo: null,
15730
16006
  dragType: null,
15731
16007
  });
15732
- }, [dragState, coordinates, onCoordinatesChange, showNotCreateCursor]);
16008
+ }, [dragState, coordinates, onCoordinatesChange, showNotCreateCursor, editMapInfo?.createMode]);
15733
16009
  // 添加全局事件监听(支持触摸和鼠标事件)
15734
16010
  React.useEffect(() => {
15735
16011
  if (dragState.isDragging) {
@@ -15801,24 +16077,17 @@ const PolygonElement = ({ coordinates, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpa
15801
16077
  mousePos.y,
15802
16078
  ])
15803
16079
  : null;
15804
- const ghostFirstDistance = createMode &&
15805
- mousePos &&
15806
- renderCoordinates.length > 0 &&
15807
- !completed &&
15808
- renderCoordinates.length >= 3
16080
+ const ghostFirstDistance = createMode && mousePos && !completed && renderCoordinates.length >= 1
15809
16081
  ? calculatePhysicalDistance(renderCoordinates[0], [mousePos.x, mousePos.y])
15810
16082
  : null;
15811
16083
  // 虚拟连线的中点坐标
15812
16084
  const ghostLastMidpoint = createMode && mousePos && renderCoordinates.length > 0 && !completed
15813
16085
  ? calculateMidpoint(renderCoordinates[renderCoordinates.length - 1], [mousePos.x, mousePos.y])
15814
16086
  : null;
15815
- const ghostFirstMidpoint = createMode &&
15816
- mousePos &&
15817
- renderCoordinates.length > 0 &&
15818
- !completed &&
15819
- renderCoordinates.length >= 3
16087
+ const ghostFirstMidpoint = createMode && mousePos && !completed && renderCoordinates.length >= 1
15820
16088
  ? calculateMidpoint(renderCoordinates[0], [mousePos.x, mousePos.y])
15821
16089
  : null;
16090
+ console.log('ghostFirstMidpoint', ghostFirstMidpoint, ghostFirstDistance);
15822
16091
  return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [(editMode || (createMode && completed)) &&
15823
16092
  dragState.isDragging &&
15824
16093
  dragState.dragType !== 'new' &&
@@ -15870,14 +16139,14 @@ const PolygonElement = ({ coordinates, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpa
15870
16139
  setHoverVertex(null);
15871
16140
  },
15872
16141
  }) }, `edge-${index}`));
15873
- }), ghostLastPath && (jsxRuntime.jsx("path", { d: ghostLastPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), ghostFirstPath && renderCoordinates.length >= 3 && (jsxRuntime.jsx("path", { d: ghostFirstPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), jsxRuntime.jsx(DragDistanceIndicator, { dragState: dragState, strokeColor: strokeColor, editMode: editMode, createMode: createMode, completed: completed }), jsxRuntime.jsx(DistanceLabels, { coordinates: renderCoordinates, createMode: createMode, editMode: editMode, completed: completed, showPoints: showPoints, mousePos: mousePos, ghostLastDistance: ghostLastDistance, ghostLastMidpoint: ghostLastMidpoint, ghostFirstDistance: ghostFirstDistance, ghostFirstMidpoint: ghostFirstMidpoint }), hoverVertex && !dragState.isDragging && (jsxRuntime.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)) &&
16142
+ }), ghostLastPath && (jsxRuntime.jsx("path", { d: ghostLastPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), ghostFirstPath && renderCoordinates.length >= 2 && (jsxRuntime.jsx("path", { d: ghostFirstPath, stroke: strokeColor, strokeWidth: strokeWidth, vectorEffect: "non-scaling-stroke", opacity: 0.7, onClick: onPathClick })), jsxRuntime.jsx(DragDistanceIndicator, { dragState: dragState, strokeColor: strokeColor, editMode: editMode, createMode: createMode, completed: completed }), jsxRuntime.jsx(DistanceLabels, { coordinates: renderCoordinates, createMode: createMode, editMode: editMode, completed: completed, showPoints: showPoints, mousePos: mousePos, ghostLastDistance: ghostLastDistance, ghostLastMidpoint: ghostLastMidpoint, ghostFirstDistance: ghostFirstDistance, ghostFirstMidpoint: ghostFirstMidpoint }), hoverVertex && !dragState.isDragging && (jsxRuntime.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)) &&
15874
16143
  renderCoordinates.map((coord, idx) => {
15875
16144
  // 判断当前顶点的状态
15876
16145
  const isLastPoint = idx === renderCoordinates.length - 1;
15877
16146
  const canComplete = createMode && !completed && renderCoordinates.length >= 3 && isLastPoint;
15878
16147
  const isCreatedAndCanDrag = createMode && completed; // 创建完成后可拖拽
15879
16148
  const isInEditMode = editMode;
15880
- return (jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx(VertexElement, { className: generateVertexClassName, stroke: strokeColor, cx: coord[0], cy: coord[1], onClick: (e) => handleVertexClick(e, idx), onDoubleClick: (e) => {
16149
+ return (jsxRuntime.jsxs("g", { children: [jsxRuntime.jsx(VertexElement, { className: generateVertexClassName, stroke: strokeColor, cx: coord[0], cy: coord[1], r: canComplete ? 16 : 12, onClick: (e) => handleVertexClick(e, idx), onDoubleClick: (e) => {
15881
16150
  // 阻止双击事件冒泡到Google Maps
15882
16151
  e.preventDefault();
15883
16152
  e.stopPropagation();
@@ -15925,7 +16194,18 @@ const PolygonElement = ({ coordinates, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpa
15925
16194
  }
15926
16195
  }
15927
16196
  },
15928
- }) }), tooltipIndex === idx && (jsxRuntime.jsxs("g", { transform: `translate(${coord[0] + 4}, ${coord[1] - 4})`, onClick: (e) => {
16197
+ onMouseUp: (e) => {
16198
+ // 拖拽逻辑:编辑模式或创建完成后
16199
+ if (isInEditMode || isCreatedAndCanDrag) {
16200
+ if (draggable) {
16201
+ // 延迟执行mouseDown,等待可能的doubleClick
16202
+ if (mouseDownTimerRef.current !== null) {
16203
+ window.clearTimeout(mouseDownTimerRef.current);
16204
+ }
16205
+ }
16206
+ }
16207
+ },
16208
+ }) }), tooltipIndex === idx && (jsxRuntime.jsxs("g", { transform: `translate(${coord[0] + 4 * overlayScale * 2}, ${coord[1] - 4 * overlayScale * 2}) scale(${overlayScale * 2})`, onClick: (e) => {
15929
16209
  e.preventDefault();
15930
16210
  e.stopPropagation();
15931
16211
  if (onVertexDelete &&
@@ -15934,7 +16214,19 @@ const PolygonElement = ({ coordinates, fillColor = 'rgba(0, 0, 0, 0.1)', fillOpa
15934
16214
  onVertexDelete(idx);
15935
16215
  }
15936
16216
  setTooltipIndex(null);
15937
- }, style: { cursor: 'pointer' }, children: [jsxRuntime.jsx("rect", { x: 0, y: -24, width: 20, height: 20, rx: 2, ry: 2, fill: "#fff", strokeWidth: 1, filter: "url(#vertex-tooltip-shadow)" }), jsxRuntime.jsx("g", { transform: `translate(2, -22)`, children: jsxRuntime.jsx(SvgDelete$1, {}) })] })), canComplete && (jsxRuntime.jsx("text", { x: coord[0], y: coord[1], textAnchor: "middle", alignmentBaseline: "middle", fontSize: 20, fill: strokeColor, style: { pointerEvents: 'none' }, children: "\u2713" }))] }, `vertex-${idx}`));
16217
+ }, style: { cursor: 'pointer' }, children: [jsxRuntime.jsx("rect", { x: 0, y: -24, width: 20, height: 20, rx: 2, ry: 2, fill: "#fff", strokeWidth: 1, filter: "url(#vertex-tooltip-shadow)" }), jsxRuntime.jsx("g", { transform: `translate(2, -22)`, children: jsxRuntime.jsx(SvgDelete$1, {}) })] })), canComplete && (jsxRuntime.jsx("g", { style: { pointerEvents: 'none' }, transform: `translate(${coord[0] - 5 * overlayScale * 3}, ${coord[1] - 2.5 * overlayScale * 3}) scale(${overlayScale * 3})`, children: jsxRuntime.jsx("svg", { width: "10", height: "5", viewBox: "0 0 6 5", fill: "none", xmlns: "http://www.w3.org/2000/svg", children: jsxRuntime.jsx("path", { d: "M0.5 2.5L1.3452 3.3452C1.71469 3.71469 2.30636 3.73741 2.7031 3.39735L5.5 1", stroke: "#FF7A33", "stroke-linecap": "round" }) }) })
16218
+ // <rect
16219
+ // x={coord[0]}
16220
+ // y={coord[1]}
16221
+ // width={20}
16222
+ // height={20}
16223
+ // rx={2}
16224
+ // ry={2}
16225
+ // fill="transparent"
16226
+ // style={{ pointerEvents: 'none' }}
16227
+ // >
16228
+ // </rect>
16229
+ )] }, `vertex-${idx}`));
15938
16230
  })] }));
15939
16231
  };
15940
16232
 
@@ -15986,7 +16278,7 @@ const BoundaryElement = ({ data }) => {
15986
16278
  }));
15987
16279
  }
15988
16280
  }, [platform, data, editMapInfo]);
15989
- return (jsxRuntime.jsx(PolygonElement, { coordinates: currentPoints, fillColor: style.fillColor, fillOpacity: style.fillOpacity, strokeColor: style.lineColor, strokeWidth: strokeWidth, editMode: false, onPathClick: onPathClick, onCoordinatesChange: (coordinates) => {
16281
+ return (jsxRuntime.jsx(PolygonElement, { points: currentPoints, fillColor: style.fillColor, fillOpacity: style.fillOpacity, strokeColor: style.lineColor, strokeWidth: strokeWidth, editMode: false, onPathClick: onPathClick, onCoordinatesChange: (coordinates) => {
15990
16282
  console.log('onCoordinatesChange', coordinates);
15991
16283
  setEditMapInfo((prev) => ({
15992
16284
  ...prev,
@@ -16121,6 +16413,7 @@ const ObstacleElement = ({ data }) => {
16121
16413
  }
16122
16414
  }, [editMapInfo]);
16123
16415
  const currentPoints = React.useMemo(() => {
16416
+ // 为了方便解决删除顶点的时候,delete icon被遮挡的问题,所以逆序一下
16124
16417
  if (editMapInfo?.selectElement?.id === data.id) {
16125
16418
  return editMapInfo.selectElement.points;
16126
16419
  }
@@ -16164,7 +16457,11 @@ const ObstacleElement = ({ data }) => {
16164
16457
  setEditMapInfo((prev) => ({
16165
16458
  ...prev,
16166
16459
  selectElement: data,
16167
- historyList: [data],
16460
+ historyList: [
16461
+ {
16462
+ selectElement: data,
16463
+ },
16464
+ ],
16168
16465
  currentHistoryIndex: 0,
16169
16466
  elementType: DataType.OBSTACLE,
16170
16467
  editMap: true,
@@ -16178,7 +16475,7 @@ const ObstacleElement = ({ data }) => {
16178
16475
  }
16179
16476
  return editMapInfo?.selectElement?.id === data.id;
16180
16477
  }, [editMapInfo, data, platform]);
16181
- return (jsxRuntime.jsx(PolygonElement, { coordinates: currentPoints, fillColor: style.fillColor, fillOpacity: style.fillOpacity, strokeColor: style.lineColor, strokeWidth: strokeWidth, editMode: editMode, showPoints: editMapInfo?.selectElement?.id === data.id, onPathClick: onPathClick, onPolygonClick: () => {
16478
+ return (jsxRuntime.jsx(PolygonElement, { points: currentPoints, fillColor: style.fillColor, fillOpacity: style.fillOpacity, strokeColor: style.lineColor, strokeWidth: strokeWidth, editMode: editMode, showPoints: editMapInfo?.selectElement?.id === data.id, onPathClick: onPathClick, onPolygonClick: () => {
16182
16479
  if (platform === PlatformType.H5) {
16183
16480
  onPathClick();
16184
16481
  }
@@ -16767,6 +17064,7 @@ var SvgTransformTranslate = function SvgTransformTranslate(props) {
16767
17064
  };
16768
17065
 
16769
17066
  const VisionOffTransformWrapper = ({ data, isSelected = false, onSelect, onCancel, onDragEnd, onDragMove, disabled = false, className = '', scaleConstraints = { minEdgeLength: 0.5, maxEdgeLength: 10000 }, showInfo = true, }) => {
17067
+ const { overlayScale } = useCommonContext();
16770
17068
  const { platform } = useCommonContext();
16771
17069
  const { editMapInfo } = useMapEditContext();
16772
17070
  const dataPoints = React.useMemo(() => {
@@ -16882,7 +17180,7 @@ const VisionOffTransformWrapper = ({ data, isSelected = false, onSelect, onCance
16882
17180
  return;
16883
17181
  onDragMove?.(currentPoints.map((point) => [point.x, point.y]));
16884
17182
  }, [currentPoints, isSelected, isDragging, isRotating, isScaling]);
16885
- return (jsxRuntime.jsxs("g", { ref: containerRef, className: `vision-off-transform-wrapper ${className} ${isSelected ? 'selected' : ''}`, "data-transform-wrapper": "true", children: [jsxRuntime.jsx(PolygonElement, { coordinates: visionOffData?.points, fillColor: style.fillColor, fillOpacity: style.fillOpacity, strokeColor: style.lineColor, strokeWidth: strokeWidth, editMode: false, onPathClick: () => {
17183
+ return (jsxRuntime.jsxs("g", { ref: containerRef, className: `vision-off-transform-wrapper ${className} ${isSelected ? 'selected' : ''}`, "data-transform-wrapper": "true", children: [jsxRuntime.jsx(PolygonElement, { points: visionOffData?.points, fillColor: style.fillColor, fillOpacity: style.fillOpacity, strokeColor: style.lineColor, strokeWidth: strokeWidth, editMode: false, onPathClick: () => {
16886
17184
  onSelect?.();
16887
17185
  }, onPolygonClick: () => {
16888
17186
  if (platform === PlatformType.H5) {
@@ -16911,9 +17209,9 @@ const VisionOffTransformWrapper = ({ data, isSelected = false, onSelect, onCance
16911
17209
  const infoBoxWidth = 140; // 信息框宽度
16912
17210
  const infoBoxHeight = 30; // 信息框高度
16913
17211
  const infoBoxX = centerX - infoBoxWidth / 2; // 居中对齐
16914
- const scale = isWeb ? 2 : 1;
17212
+ const scale = (isWeb ? 2 : 1) * overlayScale;
16915
17213
  const offsetLeft = 10 * scale;
16916
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("polygon", { points: selectionBoxPoints.map((point) => `${point.x},${point.y}`).join(' '), fill: "none", stroke: "#9EA6BA", strokeWidth: "2", strokeDasharray: "5,5", vectorEffect: "non-scaling-stroke", style: { cursor: 'move' }, ...(platform === PlatformType.H5
17214
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsx("polygon", { points: selectionBoxPoints.map((point) => `${point.x},${point.y}`).join(' '), fill: "none", stroke: "#f16629", strokeWidth: "2", strokeDasharray: "5,5", vectorEffect: "non-scaling-stroke", style: { cursor: 'move' }, ...(platform === PlatformType.H5
16917
17215
  ? {
16918
17216
  onTouchStart: createReactEventHandler((e) => {
16919
17217
  handleMouseDownWithDisabled(e);
@@ -17020,7 +17318,11 @@ const VisionOffElement = ({ data, onSelect }) => {
17020
17318
  ...prev,
17021
17319
  selectElement: data,
17022
17320
  elementType: DataType.VISION_OFF,
17023
- historyList: [data],
17321
+ historyList: [
17322
+ {
17323
+ selectElement: data,
17324
+ },
17325
+ ],
17024
17326
  currentHistoryIndex: 0,
17025
17327
  editMap: true,
17026
17328
  isShowDrag: true,
@@ -17484,7 +17786,7 @@ const DoodleTransform = ({ data, isSelected: _isSelected, onSelect }) => {
17484
17786
  }
17485
17787
  };
17486
17788
 
17487
- const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOperation = false, onSelect, onCancel, onTransformChange, disabled = false, className = '', minScale, onMinScaleReached, onDragMove, onDragEnd, showInfo = true, }) => {
17789
+ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOperation = false, onSelect, onCancel, onTransformChange, disabled = false, className = '', minScale, onMinScaleReached, onDragMove, onDragEnd, showInfo = true, onClickInfo, }) => {
17488
17790
  const { platform } = useCommonContext();
17489
17791
  // 使用自定义hook管理所有变换逻辑
17490
17792
  const { currentCenter, currentScale, currentDirection, isDragging, isRotating, isScaling, initializeTransform, calculateSelectionBoxPoints, handleMouseDown, handleRotateStart, handleScaleStart, handleMouseMove, handleMouseUp, containerRef, dimensions, } = useDoodleTransform(data, onTransformChange, {
@@ -17506,6 +17808,17 @@ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOpe
17506
17808
  };
17507
17809
  }, [data?.svg, currentCenter, currentScale, currentDirection]);
17508
17810
  const isWeb = React.useMemo(() => platform === 'web', [platform]);
17811
+ const activeTime = React.useMemo(() => {
17812
+ // 如果当前时间在有效期范围,则显示有效期,否则显示0
17813
+ const now = Date.now();
17814
+ console.log('now------->', now);
17815
+ console.log('data.create_ts------->', data.create_ts);
17816
+ console.log('data.expiration_ts------->', data.expiration_ts);
17817
+ if (data.create_ts <= now && data.expiration_ts >= now) {
17818
+ return Math.floor((data.expiration_ts - now) / (60 * 60 * 24 * 1000));
17819
+ }
17820
+ return 0;
17821
+ }, [data]);
17509
17822
  // 初始化变换状态
17510
17823
  React.useEffect(() => {
17511
17824
  initializeTransform();
@@ -17523,6 +17836,7 @@ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOpe
17523
17836
  onEnd: (event) => {
17524
17837
  event.preventDefault();
17525
17838
  handleMouseUp();
17839
+ onDragEnd?.(transformedData);
17526
17840
  },
17527
17841
  }, platform);
17528
17842
  document.body.style.userSelect = 'none';
@@ -17686,7 +18000,9 @@ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOpe
17686
18000
  }
17687
18001
  : {
17688
18002
  onMouseDown: handleScaleStartWithDisabled,
17689
- }), transform: `translate(${selectionBoxPoints[2].x}, ${selectionBoxPoints[2].y})`, children: jsxRuntime.jsx("g", { style: { cursor: 'pointer' }, transformOrigin: "center", transform: `translate(-${offsetLeft}, -${offsetLeft}) scale(${scale})`, children: jsxRuntime.jsx(SvgTransformScale, {}) }) }), showInfo && (jsxRuntime.jsx("foreignObject", { x: infoBoxX, y: infoBoxY, width: infoBoxWidth, height: infoBoxHeight, style: { textAlign: 'center' }, children: jsxRuntime.jsxs("div", { style: {
18003
+ }), transform: `translate(${selectionBoxPoints[2].x}, ${selectionBoxPoints[2].y})`, children: jsxRuntime.jsx("g", { style: { cursor: 'pointer' }, transformOrigin: "center", transform: `translate(-${offsetLeft}, -${offsetLeft}) scale(${scale})`, children: jsxRuntime.jsx(SvgTransformScale, {}) }) }), showInfo && (jsxRuntime.jsx("foreignObject", { x: infoBoxX, y: infoBoxY, width: infoBoxWidth, height: infoBoxHeight, style: { textAlign: 'center' }, onClick: () => {
18004
+ onClickInfo?.();
18005
+ }, children: jsxRuntime.jsxs("div", { style: {
17690
18006
  padding: '5px 6px',
17691
18007
  background: 'linear-gradient(266.64deg, #F26A2A 4.1%, #F2942A 86.42%)',
17692
18008
  borderRadius: '10px',
@@ -17702,12 +18018,12 @@ const DoodleTransformWrapper = ({ data, isSelected = false, isSelectedWithoutOpe
17702
18018
  alignItems: 'center',
17703
18019
  justifyContent: 'center',
17704
18020
  gap: '10px',
17705
- }, children: [jsxRuntime.jsx("div", { children: "Active Time:3" }), jsxRuntime.jsx(SvgTransformArrow, {})] })] }) }))] }));
18021
+ }, children: [jsxRuntime.jsxs("div", { children: ["Active Time: ", activeTime] }), jsxRuntime.jsx(SvgTransformArrow, {})] })] }) }))] }));
17706
18022
  })()] }));
17707
18023
  };
17708
18024
 
17709
18025
  const DoodleElement = ({ data }) => {
17710
- const { editMapInfo, setEditMapInfo, onHandleEnterRecord } = useMapEditContext();
18026
+ const { editMapInfo, setEditMapInfo, onHandleEnterRecord, onClickEvent } = useMapEditContext();
17711
18027
  const { addHistory } = useHistoryHandle();
17712
18028
  const { platform } = useCommonContext();
17713
18029
  const isSelected = React.useMemo(() => {
@@ -17743,9 +18059,8 @@ const DoodleElement = ({ data }) => {
17743
18059
  if (platform === PlatformType.H5) {
17744
18060
  // h5编辑模式下,
17745
18061
  // 如果是创建,只能选择新建的doodle
17746
- if ((editMapInfo.mobileMode === MobileEditMode.CREATE ||
17747
- editMapInfo.mobileMode === MobileEditMode.EDIT) &&
17748
- editMapInfo.elementType !== DataType.DOODLE) {
18062
+ if (editMapInfo.mobileMode === MobileEditMode.CREATE ||
18063
+ editMapInfo.mobileMode === MobileEditMode.EDIT) {
17749
18064
  return;
17750
18065
  }
17751
18066
  // 如果是编辑的话
@@ -17766,7 +18081,14 @@ const DoodleElement = ({ data }) => {
17766
18081
  })?.then(() => {
17767
18082
  setEditMapInfo((prev) => ({
17768
18083
  ...prev,
17769
- historyList: [data],
18084
+ historyList: [
18085
+ {
18086
+ selectElement: {
18087
+ ...data,
18088
+ transformedPoints: transformedElements,
18089
+ },
18090
+ },
18091
+ ],
17770
18092
  currentHistoryIndex: 0,
17771
18093
  selectElement: {
17772
18094
  ...data,
@@ -17779,6 +18101,16 @@ const DoodleElement = ({ data }) => {
17779
18101
  });
17780
18102
  }, [data, onHandleEnterRecord, platform, editMapInfo]);
17781
18103
  const handleCancel = React.useCallback(() => {
18104
+ if (platform === PlatformType.H5) {
18105
+ setEditMapInfo((prev) => ({
18106
+ ...prev,
18107
+ selectElement: null,
18108
+ }));
18109
+ addHistory({
18110
+ selectElement: null,
18111
+ });
18112
+ return;
18113
+ }
17782
18114
  setEditMapInfo((prev) => ({
17783
18115
  ...prev,
17784
18116
  editMap: false,
@@ -17787,6 +18119,9 @@ const DoodleElement = ({ data }) => {
17787
18119
  isShowDrag: false,
17788
18120
  }));
17789
18121
  }, []);
18122
+ const handleClickInfo = React.useCallback(() => {
18123
+ onClickEvent?.(ClickEventType.DOODLE_ACTIVE_TIME);
18124
+ }, [onClickEvent]);
17790
18125
  // const handleDragMove = useCallback(
17791
18126
  // (data: DoodleData) => {
17792
18127
  // setEditMapInfo((prev: EditMapInfo) => ({
@@ -17814,7 +18149,7 @@ const DoodleElement = ({ data }) => {
17814
18149
  },
17815
18150
  });
17816
18151
  }, [transformedElements]);
17817
- return (jsxRuntime.jsx(DoodleTransformWrapper, { data: originData, onTransformChange: handleTransformChange, isSelected: isSelected, isSelectedWithoutOperation: isSelectedWithoutOperation, onSelect: handleSelect, onCancel: handleCancel, onDragEnd: handleDragEnd, showInfo: platform === PlatformType.H5 }));
18152
+ return (jsxRuntime.jsx(DoodleTransformWrapper, { data: originData, onTransformChange: handleTransformChange, isSelected: isSelected, isSelectedWithoutOperation: isSelectedWithoutOperation, onSelect: handleSelect, onCancel: handleCancel, onDragEnd: handleDragEnd, showInfo: platform === PlatformType.H5, onClickInfo: handleClickInfo }));
17818
18153
  };
17819
18154
 
17820
18155
  const SvgElement = React.memo(({ type, data, interactive = false }) => {
@@ -17945,12 +18280,7 @@ var classNames = /*@__PURE__*/getDefaultExportFromCjs(classnamesExports);
17945
18280
 
17946
18281
  const ChannelClipPath = React.memo(() => {
17947
18282
  const { svgElementDatas, svgRef } = useSvgEditContext();
17948
- const { editMapInfo } = useMapEditContext();
17949
18283
  const boundaryData = svgElementDatas?.[DataType.BOUNDARY] || [];
17950
- React.useEffect(() => {
17951
- console.log('ChannelClipPath', svgElementDatas);
17952
- }, [svgElementDatas]);
17953
- // console.log('ChannelClipPath refresh', svgElementDatas, editMapInfo);
17954
18284
  const [minX, minY, maxX, maxY] = React.useMemo(() => {
17955
18285
  const baseVal = svgRef?.viewBox.baseVal;
17956
18286
  return [
@@ -17959,7 +18289,13 @@ const ChannelClipPath = React.memo(() => {
17959
18289
  baseVal?.x + (baseVal?.width || 0),
17960
18290
  baseVal?.y + (baseVal?.height || 0),
17961
18291
  ];
17962
- }, [svgRef?.viewBox.baseVal?.x]);
18292
+ }, [
18293
+ svgRef?.viewBox.baseVal?.x,
18294
+ svgRef?.viewBox.baseVal?.y,
18295
+ svgRef?.viewBox.baseVal?.width,
18296
+ svgRef?.viewBox.baseVal?.height,
18297
+ ]);
18298
+ console.log('boundaryData---->', svgRef?.viewBox.baseVal);
17963
18299
  /**
17964
18300
  * 判断多边形是否为逆时针方向
17965
18301
  * 使用叉积法计算多边形的有向面积
@@ -19101,7 +19437,7 @@ const CreateObstacleElement = React.forwardRef(({ enabled = false, svgElement, o
19101
19437
  if (!enabled || points.length === 0) {
19102
19438
  return null;
19103
19439
  }
19104
- return (jsxRuntime.jsx(PolygonElement, { coordinates: 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 }));
19440
+ return (jsxRuntime.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 }));
19105
19441
  });
19106
19442
  CreateObstacleElement.displayName = 'CreateObstacleElement';
19107
19443
 
@@ -19155,7 +19491,7 @@ const useCreateVisionOffElement = () => {
19155
19491
  const SvgEditMap = React.forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMapChange }, ref) => {
19156
19492
  const pointManagerRef = React.useRef(null);
19157
19493
  const { editMapInfo, setEditMapInfo } = useMapEditContext();
19158
- const { getVisionOffPoints } = useCreateVisionOffElement();
19494
+ const { getVisionOffPoints, centerPoint } = useCreateVisionOffElement();
19159
19495
  const { svgElementDatas } = useSvgEditContext();
19160
19496
  const { checkCanNotCreateAtPosition } = useCheckElement();
19161
19497
  const svgRef = React.useRef(null);
@@ -19256,6 +19592,28 @@ const SvgEditMap = React.forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMa
19256
19592
  allVisionOffPoints,
19257
19593
  });
19258
19594
  };
19595
+ const addDoodle = (selectedDoodle) => {
19596
+ const newDoodle = initDoodle();
19597
+ const svg = selectedDoodle?.svgStr;
19598
+ const minLength = selectedDoodle.minLength;
19599
+ const parseSvg = SvgParserNative.parseSvg(svg);
19600
+ const svgMinLength = Math.min(parseSvg.width, parseSvg.height) / SCALE_FACTOR;
19601
+ // 使用获取到的 SVG 内容,如果没有获取到则使用 URL
19602
+ newDoodle.svg = svg;
19603
+ newDoodle.scale = minLength / svgMinLength;
19604
+ newDoodle.direction = 0;
19605
+ newDoodle.center = restorePoint(centerPoint);
19606
+ setEditMapInfo((prev) => ({
19607
+ ...prev,
19608
+ currentHistoryIndex: 0,
19609
+ mobileMode: MobileEditMode.CREATE,
19610
+ elementType: DataType.DOODLE,
19611
+ selectElement: newDoodle,
19612
+ }));
19613
+ addHistory({
19614
+ selectElement: newDoodle,
19615
+ });
19616
+ };
19259
19617
  React.useEffect(() => {
19260
19618
  onEditInfoMapChange?.(editMapInfo);
19261
19619
  }, [editMapInfo]);
@@ -19290,6 +19648,7 @@ const SvgEditMap = React.forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMa
19290
19648
  // 清空历史记录
19291
19649
  clearHistory,
19292
19650
  addHistory,
19651
+ addDoodle,
19293
19652
  }));
19294
19653
  // 初始化多边形绘制 Hook
19295
19654
  const { onSvgClick, onSvgMouseMove, onPointClick, points, completed, mousePos, updatePoints } = usePolygonDrawing({ createMode: isCreating });
@@ -19319,6 +19678,9 @@ const SvgEditMap = React.forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMa
19319
19678
  // pointerEvents: 'auto', // 关键:允许接收鼠标事件
19320
19679
  }, xmlns: "http://www.w3.org/2000/svg", "shape-rendering": "geometricPrecision", "text-rendering": "geometricPrecision", "image-rendering": "optimizeQuality", ref: svgRef, onClick: editMapInfo.createMode && platform !== PlatformType.H5 ? onSvgClick : undefined, onMouseMove: editMapInfo.createMode && platform !== PlatformType.H5 ? onSvgMouseMove : undefined, children: [jsxRuntime.jsxs("defs", { children: [jsxRuntime.jsx("filter", { id: "vertex-tooltip-shadow", x: "-50%", y: "-50%", width: "200%", height: "200%", children: jsxRuntime.jsx("feDropShadow", { dx: "2", dy: "2", stdDeviation: "2", floodColor: "#000", floodOpacity: "0.12" }) }), jsxRuntime.jsxs("filter", { id: `path-hover-${DataType.BOUNDARY}`, x: "-10%", y: "-10%", width: "120%", height: "120%", children: [jsxRuntime.jsx("feMorphology", { operator: "dilate", radius: "1", in: "SourceGraphic", result: "border" }), jsxRuntime.jsx("feFlood", { floodColor: BOUNDARY_STYLES.lineColor, floodOpacity: "1", result: "borderColor" }), jsxRuntime.jsx("feComposite", { in: "borderColor", in2: "border", operator: "in", result: "coloredBorder" }), jsxRuntime.jsxs("feMerge", { children: [jsxRuntime.jsx("feMergeNode", { in: "coloredBorder" }), jsxRuntime.jsx("feMergeNode", { in: "SourceGraphic" })] })] }), jsxRuntime.jsxs("filter", { id: `path-hover-${DataType.VISION_OFF}`, x: "-10%", y: "-10%", width: "120%", height: "120%", children: [jsxRuntime.jsx("feMorphology", { operator: "dilate", radius: "1", in: "SourceGraphic", result: "border" }), jsxRuntime.jsx("feFlood", { floodColor: VISION_OFF_AREA_STYLES.lineColor, floodOpacity: "1", result: "borderColor" }), jsxRuntime.jsx("feComposite", { in: "borderColor", in2: "border", operator: "in", result: "coloredBorder" }), jsxRuntime.jsxs("feMerge", { children: [jsxRuntime.jsx("feMergeNode", { in: "coloredBorder" }), jsxRuntime.jsx("feMergeNode", { in: "SourceGraphic" })] })] }), jsxRuntime.jsxs("filter", { id: `path-hover-${DataType.OBSTACLE}`, x: "-10%", y: "-10%", width: "120%", height: "120%", children: [jsxRuntime.jsx("feMorphology", { operator: "dilate", radius: "1", in: "SourceGraphic", result: "border" }), jsxRuntime.jsx("feFlood", { floodColor: OBSTACLE_STYLES.lineColor, floodOpacity: "1", result: "borderColor" }), jsxRuntime.jsx("feComposite", { in: "borderColor", in2: "border", operator: "in", result: "coloredBorder" }), jsxRuntime.jsxs("feMerge", { children: [jsxRuntime.jsx("feMergeNode", { in: "coloredBorder" }), jsxRuntime.jsx("feMergeNode", { in: "SourceGraphic" })] })] })] }), Object.keys(svgElementDatas)
19321
19680
  ?.sort?.((a, b) => {
19681
+ if (a === DataType.BOUNDARY || b === DataType.BOUNDARY) {
19682
+ return 0;
19683
+ }
19322
19684
  const aVal = a === editMapInfo.elementType ? 1 : 0;
19323
19685
  const bVal = b === editMapInfo.elementType ? 1 : 0;
19324
19686
  return aVal - bVal;
@@ -19330,7 +19692,7 @@ const SvgEditMap = React.forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMa
19330
19692
  editMapInfo.createMode &&
19331
19693
  editMapInfo.elementType !== DataType.DOODLE &&
19332
19694
  editMapInfo.elementType !== DataType.VISION_OFF &&
19333
- (points.length > 0 || editMapInfo?.selectElement?.points?.length > 0) && (jsxRuntime.jsx(PolygonElement, { coordinates: points?.length > 0
19695
+ (points.length > 0 || editMapInfo?.selectElement?.points?.length > 0) && (jsxRuntime.jsx(PolygonElement, { points: points?.length > 0
19334
19696
  ? points.map((p) => [p.x, p.y, 2])
19335
19697
  : editMapInfo?.selectElement?.points, fillColor: createElementStyle.fillColor, strokeColor: createElementStyle.lineColor, strokeWidth: createElementStyle.lineWidth, createMode: editMapInfo.elementType !== DataType.VISION_OFF, showPoints: editMapInfo.elementType !== DataType.VISION_OFF, onPointClick: onPointClick, completed: completed, mousePos: mousePos, onVertexDelete: (vertexIndex) => handleCreateVertexDelete(vertexIndex), onCoordinatesChange: (newCoords) => {
19336
19698
  // 创建模式下的坐标变化(拖拽时)
@@ -19395,7 +19757,10 @@ const SvgEditMap = React.forwardRef(({ mapJson, mapConfig, editMap, onEditInfoMa
19395
19757
  },
19396
19758
  points: item.points,
19397
19759
  id: item.id,
19398
- } })))] }) }));
19760
+ } }))), platform === PlatformType.H5 &&
19761
+ editMapInfo.elementType === DataType.DOODLE &&
19762
+ editMapInfo.mobileMode === MobileEditMode.CREATE &&
19763
+ editMapInfo?.selectElement?.svg && (jsxRuntime.jsx(DoodleElement, { data: { ...editMapInfo?.selectElement } }))] }) }));
19399
19764
  });
19400
19765
  SvgEditMap.displayName = 'SvgEditMap';
19401
19766
 
@@ -19748,7 +20113,11 @@ const DoodleModal = ({ open, onSelect, setOpen, doodleList, centerPoint }) => {
19748
20113
  })?.then(() => {
19749
20114
  setEditMapInfo({
19750
20115
  ...editMapInfo,
19751
- historyList: [newDoodle],
20116
+ historyList: [
20117
+ {
20118
+ selectElement: newDoodle,
20119
+ },
20120
+ ],
19752
20121
  currentHistoryIndex: 0,
19753
20122
  createMode: CreateStatus.COMPLETED,
19754
20123
  elementType: DataType.DOODLE,
@@ -19830,7 +20199,11 @@ const AddEntry = ({ doodleList, disabledObstacles, editMap }) => {
19830
20199
  })?.then(() => {
19831
20200
  setEditMapInfo({
19832
20201
  ...editMapInfo,
19833
- historyList: [newElement],
20202
+ historyList: [
20203
+ {
20204
+ selectElement: newElement,
20205
+ },
20206
+ ],
19834
20207
  currentHistoryIndex: 0,
19835
20208
  createMode: type === DataType.VISION_OFF ? CreateStatus.COMPLETED : CreateStatus.CREATING,
19836
20209
  elementType: type,
@@ -19859,11 +20232,11 @@ const AddEntry = ({ doodleList, disabledObstacles, editMap }) => {
19859
20232
  }), children: jsxRuntime.jsx("div", { className: styles$c.icon, children: jsxRuntime.jsx(SvgAddEntry, {}) }) }), jsxRuntime.jsx(DoodleModal, { centerPoint: centerPoint, doodleList: doodleList, open: doodleOpen, onOk: () => setDoodleOpen(false), setOpen: setDoodleOpen })] }));
19860
20233
  };
19861
20234
 
19862
- var css_248z$9 = ".index-module_handleElementInfo__vWIaf {\n position: absolute;\n right: 0;\n top: 0;\n border-radius: 8px;\n padding: 4px 8px;\n background: #fff;\n width: 265px;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 {\n position: absolute;\n left: -96px;\n top: 0;\n display: flex;\n gap: 12px;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u- {\n background: #fff;\n border-radius: 8px;\n padding: 6px;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X:not(.index-module_disabled__w6gCJ):hover,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u-:not(.index-module_disabled__w6gCJ):hover {\n opacity: 0.8;\n cursor: pointer;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X.index-module_disabled__w6gCJ,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u-.index-module_disabled__w6gCJ {\n color: #d8d8d8;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n padding: 0 0 4px 0;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- input {\n padding: 2px 0;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- .index-module_edit__b0r9I {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.index-module_handleElementInfo__vWIaf .index-module_boundaryOther__FyJvt {\n padding-top: 4px;\n border-top: 1px solid rgb(197, 197, 197);\n}\n.index-module_handleElementInfo__vWIaf .index-module_handle__4mIxr {\n border-top: 1px solid rgb(197, 197, 197);\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 0;\n}\n\n.index-module_doodleInfo__bd2ua .index-module_time__1bUFf {\n width: 100%;\n}\n.index-module_doodleInfo__bd2ua .index-module_exist__gWtNo {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n}\n.index-module_doodleInfo__bd2ua .index-module_tip__1HNmj {\n color: #ff3f33;\n margin-top: 10px;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n}\n\n.index-module_obstacleInfo__w6Sod .index-module_areaInfo__-WJPL {\n border-top: 1px solid rgb(197, 197, 197);\n}\n\n.index-module_areaInfo__-WJPL {\n color: #9e9e9e;\n width: 100%;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px; /* 114.286% */\n}\n.index-module_areaInfo__-WJPL .index-module_areaItem__fk-i2 {\n display: flex;\n justify-content: space-between;\n padding: 6px 0;\n}\n\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM {\n color: #1f1f1f;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 16px;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ .index-module_value__x3-se {\n margin-left: auto;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ .index-module_icon__167WB {\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.index-module_boundaryInfo__VfR-N .index-module_areaInfo__-WJPL {\n border-top: 1px solid rgb(197, 197, 197);\n}";
20235
+ var css_248z$9 = ".index-module_handleElementInfo__vWIaf {\n position: absolute;\n right: 0;\n top: 0;\n border-radius: 8px;\n padding: 4px 8px;\n background: #fff;\n width: 265px;\n user-select: none;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 {\n position: absolute;\n left: -96px;\n top: 0;\n display: flex;\n gap: 12px;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u- {\n background: #fff;\n border-radius: 8px;\n padding: 6px;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X:not(.index-module_disabled__w6gCJ):hover,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u-:not(.index-module_disabled__w6gCJ):hover {\n opacity: 0.8;\n cursor: pointer;\n}\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_undo__lPY1X.index-module_disabled__w6gCJ,\n.index-module_handleElementInfo__vWIaf .index-module_undoAndRedo__EKeA8 .index-module_redo__EU5u-.index-module_disabled__w6gCJ {\n color: #d8d8d8;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n padding: 0 0 4px 0;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- input {\n padding: 2px 0;\n}\n.index-module_handleElementInfo__vWIaf .index-module_nameEdit__eVzQ- .index-module_edit__b0r9I {\n display: flex;\n align-items: center;\n justify-content: center;\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.index-module_handleElementInfo__vWIaf .index-module_boundaryOther__FyJvt {\n padding-top: 4px;\n border-top: 1px solid rgb(197, 197, 197);\n}\n.index-module_handleElementInfo__vWIaf .index-module_handle__4mIxr {\n border-top: 1px solid rgb(197, 197, 197);\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 8px 0;\n}\n\n.index-module_doodleInfo__bd2ua .index-module_time__1bUFf {\n width: 100%;\n}\n.index-module_doodleInfo__bd2ua .index-module_exist__gWtNo {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n}\n.index-module_doodleInfo__bd2ua .index-module_tip__1HNmj {\n color: #ff3f33;\n margin-top: 10px;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px;\n}\n\n.index-module_obstacleInfo__w6Sod .index-module_areaInfo__-WJPL {\n border-top: 1px solid rgb(197, 197, 197);\n}\n\n.index-module_areaInfo__-WJPL {\n color: #9e9e9e;\n width: 100%;\n font-size: 14px;\n font-weight: 400;\n line-height: 16px; /* 114.286% */\n}\n.index-module_areaInfo__-WJPL .index-module_areaItem__fk-i2 {\n display: flex;\n justify-content: space-between;\n padding: 6px 0;\n}\n\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM {\n color: #1f1f1f;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n line-height: 16px;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ {\n display: flex;\n align-items: center;\n justify-content: space-between;\n width: 100%;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ .index-module_value__x3-se {\n margin-left: auto;\n}\n.index-module_boundaryInfo__VfR-N .index-module_otherEdit__17SuM .index-module_otherItem__ATLFZ .index-module_icon__167WB {\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.index-module_boundaryInfo__VfR-N .index-module_areaInfo__-WJPL {\n border-top: 1px solid rgb(197, 197, 197);\n}";
19863
20236
  var styles$9 = {"handleElementInfo":"index-module_handleElementInfo__vWIaf","undoAndRedo":"index-module_undoAndRedo__EKeA8","undo":"index-module_undo__lPY1X","redo":"index-module_redo__EU5u-","disabled":"index-module_disabled__w6gCJ","nameEdit":"index-module_nameEdit__eVzQ-","handle":"index-module_handle__4mIxr","doodleInfo":"index-module_doodleInfo__bd2ua","time":"index-module_time__1bUFf","exist":"index-module_exist__gWtNo","tip":"index-module_tip__1HNmj","obstacleInfo":"index-module_obstacleInfo__w6Sod","areaInfo":"index-module_areaInfo__-WJPL","areaItem":"index-module_areaItem__fk-i2","boundaryInfo":"index-module_boundaryInfo__VfR-N","otherEdit":"index-module_otherEdit__17SuM","otherItem":"index-module_otherItem__ATLFZ","value":"index-module_value__x3-se","icon":"index-module_icon__167WB"};
19864
20237
  styleInject(css_248z$9);
19865
20238
 
19866
- var css_248z$8 = ".index-module_infoHeader__l9F6q {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n padding: 8px 0;\n border-bottom: 1px solid rgb(197, 197, 197);\n}\n.index-module_infoHeader__l9F6q .index-module_headerIcon__sK1hg {\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.index-module_infoHeader__l9F6q .index-module_headerName__UGnrH {\n margin-left: 4px;\n color: rgb(158, 158, 158);\n font-weight: 500;\n font-size: 14px;\n line-height: 16px;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f {\n margin-left: auto;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f .index-module_focus__llcox {\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f .index-module_delete__hD4-Q {\n width: 16px;\n height: 16px;\n margin-left: 8px;\n cursor: pointer;\n}";
20239
+ var css_248z$8 = ".index-module_infoHeader__l9F6q {\n display: flex;\n align-items: center;\n justify-content: flex-start;\n padding: 8px 0;\n border-bottom: 1px solid rgb(197, 197, 197);\n}\n.index-module_infoHeader__l9F6q .index-module_headerIcon__sK1hg {\n width: 16px;\n height: 16px;\n}\n.index-module_infoHeader__l9F6q .index-module_headerName__UGnrH {\n margin-left: 4px;\n color: rgb(158, 158, 158);\n font-weight: 500;\n font-size: 14px;\n line-height: 16px;\n pointer-events: none;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f {\n margin-left: auto;\n display: flex;\n align-items: center;\n justify-content: flex-start;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f .index-module_focus__llcox {\n width: 16px;\n height: 16px;\n cursor: pointer;\n}\n.index-module_infoHeader__l9F6q .index-module_headerHandle__ymh7f .index-module_delete__hD4-Q {\n width: 16px;\n height: 16px;\n margin-left: 8px;\n cursor: pointer;\n}";
19867
20240
  var styles$8 = {"infoHeader":"index-module_infoHeader__l9F6q","headerIcon":"index-module_headerIcon__sK1hg","headerName":"index-module_headerName__UGnrH","headerHandle":"index-module_headerHandle__ymh7f","focus":"index-module_focus__llcox","delete":"index-module_delete__hD4-Q"};
19868
20241
  styleInject(css_248z$8);
19869
20242
 
@@ -19895,7 +20268,7 @@ var SvgDelete = function SvgDelete(props) {
19895
20268
  })));
19896
20269
  };
19897
20270
 
19898
- const Header = ({ handleDelete, handleFocus, showFocus = false, showDelete = true, type }) => {
20271
+ const Header = ({ handleDelete, handleFocus, showFocus = false, showDelete = true, type, }) => {
19899
20272
  const currentType = React.useMemo(() => {
19900
20273
  return DATE_TYPE_MAP.find((item) => item.type === type);
19901
20274
  }, [type]);
@@ -19920,14 +20293,14 @@ var SvgEdit = function SvgEdit(props) {
19920
20293
  })));
19921
20294
  };
19922
20295
 
19923
- const NameModal = ({ name, open, setOpen, onOk }) => {
20296
+ const NameModal = ({ title, name, open, setOpen, onOk }) => {
19924
20297
  const [nameValue, setNameValue] = React.useState('');
19925
20298
  React.useEffect(() => {
19926
20299
  if (open) {
19927
20300
  setNameValue(name || '');
19928
20301
  }
19929
20302
  }, [name, open]);
19930
- return (jsxRuntime.jsx(CustomModal, { title: `${name}`, titleCenter: true, open: open, onOk: () => {
20303
+ return (jsxRuntime.jsx(CustomModal, { title: `${title}`, titleCenter: true, open: open, onOk: () => {
19931
20304
  onOk?.(nameValue);
19932
20305
  setOpen(false);
19933
20306
  }, onCancel: () => setOpen(false), okText: "Confirm", afterClose: () => {
@@ -19935,9 +20308,9 @@ const NameModal = ({ name, open, setOpen, onOk }) => {
19935
20308
  }, children: jsxRuntime.jsx(antd.Input, { maxLength: 120, showCount: true, placeholder: "Please enter boundary name", value: nameValue, onChange: (e) => setNameValue(e.target.value) }) }));
19936
20309
  };
19937
20310
 
19938
- const NameEdit = ({ name, onChange }) => {
20311
+ const NameEdit = ({ title, name, onChange }) => {
19939
20312
  const [open, setOpen] = React.useState(false);
19940
- return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$7.nameEdit, children: [jsxRuntime.jsx("div", { className: styles$7.content, children: name }), jsxRuntime.jsx("div", { className: styles$7.edit, onClick: () => setOpen(true), children: jsxRuntime.jsx(SvgEdit, {}) })] }), jsxRuntime.jsx(NameModal, { name: name, open: open, setOpen: setOpen, onOk: onChange })] }));
20313
+ return (jsxRuntime.jsxs(jsxRuntime.Fragment, { children: [jsxRuntime.jsxs("div", { className: styles$7.nameEdit, children: [jsxRuntime.jsx("div", { className: styles$7.content, children: name }), jsxRuntime.jsx("div", { className: styles$7.edit, onClick: () => setOpen(true), children: jsxRuntime.jsx(SvgEdit, {}) })] }), jsxRuntime.jsx(NameModal, { title: title, name: name, open: open, setOpen: setOpen, onOk: onChange })] }));
19941
20314
  };
19942
20315
 
19943
20316
  var _path$3;
@@ -20058,7 +20431,7 @@ const HeightModal = ({ zoneName, open, setOpen, onChange, value, heightOptions,
20058
20431
  }), children: [jsxRuntime.jsx("div", { className: styles$4.left, children: jsxRuntime.jsxs(antd.Radio, { value: ZoneHeightModalTypeEnum.RADIO, children: ["Customize zone height (", getHeightUnit(unitType), ")"] }) }), jsxRuntime.jsx("div", { className: styles$4.right, children: jsxRuntime.jsx(CutHeightSlider, { units: unitType, value: currentValue?.cuttingHeight, heightOptions: heightOptions, onChange: onHeightChange }) })] })] }) }) }));
20059
20432
  };
20060
20433
 
20061
- var css_248z$3 = ".index-module_directions__Hv0zx {\n color: #1d1d1d;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n}\n.index-module_directions__Hv0zx .index-module_default__sSWp4 {\n position: absolute;\n bottom: 20px;\n left: 9px;\n}\n.index-module_directions__Hv0zx .index-module_tips__VVEuO {\n line-height: 16px;\n}\n.index-module_directions__Hv0zx .index-module_optimal__07le4 {\n color: rgb(255, 113, 51);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 6px;\n margin: 4px 0 12px;\n}\n.index-module_directions__Hv0zx .index-module_content__PiCFf {\n position: relative;\n width: 100%;\n margin-bottom: 12px;\n}\n.index-module_directions__Hv0zx .index-module_background__WM4u- {\n position: absolute;\n width: 100%;\n height: 300px;\n background: #f5f5f5;\n border-radius: 8px;\n z-index: 0;\n}\n.index-module_directions__Hv0zx .index-module_luppan__nGfH2 {\n inset: 0;\n z-index: 1;\n}\n.index-module_directions__Hv0zx .index-module_slideTip__RGnd1 {\n margin: 20px 0;\n}\n.index-module_directions__Hv0zx .index-module_slider__VDKnB {\n padding: 0 24px;\n}";
20434
+ var css_248z$3 = ".index-module_directions__Hv0zx {\n color: #1d1d1d;\n font-size: 14px;\n font-style: normal;\n font-weight: 400;\n}\n.index-module_directions__Hv0zx .index-module_default__sSWp4 {\n position: absolute;\n bottom: 20px;\n left: 9px;\n}\n.index-module_directions__Hv0zx .index-module_tips__VVEuO {\n line-height: 16px;\n}\n.index-module_directions__Hv0zx .index-module_optimal__07le4 {\n color: rgb(255, 113, 51);\n display: flex;\n align-items: center;\n justify-content: flex-start;\n gap: 6px;\n margin: 4px 0 12px;\n}\n.index-module_directions__Hv0zx .index-module_content__PiCFf {\n position: relative;\n width: 100%;\n margin-bottom: 12px;\n}\n.index-module_directions__Hv0zx .index-module_background__WM4u- {\n position: absolute;\n width: 100%;\n height: 300px;\n background: #f5f5f5;\n border-radius: 8px;\n z-index: 0;\n overflow: hidden;\n}\n.index-module_directions__Hv0zx .index-module_luppan__nGfH2 {\n inset: 0;\n z-index: 1;\n}\n.index-module_directions__Hv0zx .index-module_slideTip__RGnd1 {\n margin: 20px 0;\n}\n.index-module_directions__Hv0zx .index-module_slider__VDKnB {\n padding: 0 24px;\n}";
20062
20435
  var styles$3 = {"directions":"index-module_directions__Hv0zx","default":"index-module_default__sSWp4","tips":"index-module_tips__VVEuO","optimal":"index-module_optimal__07le4","content":"index-module_content__PiCFf","background":"index-module_background__WM4u-","luppan":"index-module_luppan__nGfH2","slideTip":"index-module_slideTip__RGnd1","slider":"index-module_slider__VDKnB"};
20063
20436
  styleInject(css_248z$3);
20064
20437
 
@@ -20391,10 +20764,71 @@ const MowDirection_L = (props) => {
20391
20764
  }, children: [jsxRuntime.jsx("div", { className: styles$2.leftTop, children: jsxRuntime.jsx(SvgOption, {}) }), jsxRuntime.jsx("div", { className: styles$2.rightBottom, children: jsxRuntime.jsx(SvgOption, {}) })] })] }) }) }));
20392
20765
  };
20393
20766
 
20767
+ const BoundarySvgRender = React.memo(({ mapJson, id, maxWidth = 300 }) => {
20768
+ const svgElementData = React.useMemo(() => {
20769
+ const data = UnifiedMapDataProcessor.processMapData(mapJson, DEFAULT_STYLES) || {};
20770
+ return data;
20771
+ }, [mapJson, DEFAULT_STYLES]);
20772
+ const boundaryInfo = React.useMemo(() => {
20773
+ const boundary = svgElementData.boundary.find((item) => item.id === id);
20774
+ return boundary;
20775
+ }, [id, svgElementData]);
20776
+ // 计算当前boundary的viewBox
20777
+ const boundaryViewBox = React.useMemo(() => {
20778
+ if (!boundaryInfo?.points || boundaryInfo.points.length === 0) {
20779
+ return null;
20780
+ }
20781
+ // 计算边界
20782
+ let minX = Infinity;
20783
+ let minY = Infinity;
20784
+ let maxX = -Infinity;
20785
+ let maxY = -Infinity;
20786
+ boundaryInfo.points.forEach((point) => {
20787
+ minX = Math.min(minX, point[0]);
20788
+ minY = Math.min(minY, point[1]);
20789
+ maxX = Math.max(maxX, point[0]);
20790
+ maxY = Math.max(maxY, point[1]);
20791
+ });
20792
+ // 添加边距
20793
+ const padding = 50;
20794
+ const width = maxX - minX + padding * 2;
20795
+ const height = maxY - minY + padding * 2;
20796
+ return {
20797
+ x: minX - padding,
20798
+ y: minY - padding,
20799
+ width,
20800
+ height,
20801
+ };
20802
+ }, [boundaryInfo]);
20803
+ const style = React.useMemo(() => {
20804
+ if (boundaryViewBox?.width > boundaryViewBox?.height) {
20805
+ return {
20806
+ width: maxWidth,
20807
+ height: maxWidth * (boundaryViewBox.height / boundaryViewBox.width),
20808
+ };
20809
+ }
20810
+ return {
20811
+ width: maxWidth * (boundaryViewBox.height / boundaryViewBox.width),
20812
+ height: maxWidth,
20813
+ };
20814
+ }, [boundaryViewBox, maxWidth]);
20815
+ return (jsxRuntime.jsxs("div", { style: {
20816
+ position: 'relative',
20817
+ width: style.width,
20818
+ height: style.height,
20819
+ margin: '0 auto',
20820
+ }, children: [jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `${boundaryViewBox.x} ${boundaryViewBox.y} ${boundaryViewBox.width} ${boundaryViewBox.height}`, width: `${style.width}px`, height: `${style.height}px`, style: { position: 'absolute', inset: 0, pointerEvents: 'none' }, children: Object.keys(svgElementData)?.map((key) => {
20821
+ return svgElementData[key]?.map((element) => {
20822
+ if (key === DataType.VISION_OFF)
20823
+ return null;
20824
+ return (jsxRuntime.jsx(GElement, { type: key, data: svgElementData[key], children: jsxRuntime.jsx(SvgElement, { type: key, data: element, onSelect: () => { }, onCancel: () => { } }, element.id) }, key));
20825
+ });
20826
+ }) }), jsxRuntime.jsx(CharginPile, { mapData: mapJson, mapConfig: DEFAULT_STYLES, viewBox: boundaryViewBox || null, rotation: 0 })] }));
20827
+ });
20828
+
20394
20829
  const DirectionModal = ({ directionInfo, open, setOpen, zoneName, optionAngle, onChange, }) => {
20395
- const { mapJson, mapConfig, drag } = useCommonContext();
20830
+ const { mapJson, mapConfig } = useCommonContext();
20396
20831
  const { editMapInfo } = useMapEditContext();
20397
- const { svgElementDatas } = useSvgEditContext();
20398
20832
  const [directions, setDirections] = React.useState(ALL_DIRECTION_SELECTED);
20399
20833
  const [angle, setAngle] = React.useState(MIN_DIRECTION_ANGLE);
20400
20834
  const canSetDefault = React.useMemo(() => {
@@ -20419,34 +20853,6 @@ const DirectionModal = ({ directionInfo, open, setOpen, zoneName, optionAngle, o
20419
20853
  setAngle(defaultAngle);
20420
20854
  }
20421
20855
  };
20422
- // 计算当前boundary的viewBox
20423
- const boundaryViewBox = React.useMemo(() => {
20424
- const currentBoundary = editMapInfo.selectElement;
20425
- if (!currentBoundary?.points || currentBoundary.points.length === 0) {
20426
- return null;
20427
- }
20428
- // 计算边界
20429
- let minX = Infinity;
20430
- let minY = Infinity;
20431
- let maxX = -Infinity;
20432
- let maxY = -Infinity;
20433
- currentBoundary.points.forEach((point) => {
20434
- minX = Math.min(minX, point[0]);
20435
- minY = Math.min(minY, point[1]);
20436
- maxX = Math.max(maxX, point[0]);
20437
- maxY = Math.max(maxY, point[1]);
20438
- });
20439
- // 添加边距
20440
- const padding = 50;
20441
- const width = maxX - minX + padding * 2;
20442
- const height = maxY - minY + padding * 2;
20443
- return {
20444
- x: minX - padding,
20445
- y: minY - padding,
20446
- width,
20447
- height,
20448
- };
20449
- }, [editMapInfo.selectElement]);
20450
20856
  console.log('directionInfo=>', directionInfo, mapJson);
20451
20857
  return (jsxRuntime.jsx(CustomModal, { maskClosable: false, titleCenter: true, title: `${zoneName} mowing direction`, open: open, width: 600, onCancel: () => {
20452
20858
  setOpen(false);
@@ -20456,18 +20862,7 @@ const DirectionModal = ({ directionInfo, open, setOpen, zoneName, optionAngle, o
20456
20862
  }, okText: "Confirm", cancelText: "Cancel", okButtonProps: { disabled: !canSave }, afterClose: () => {
20457
20863
  setDirections(ALL_DIRECTION_SELECTED);
20458
20864
  setAngle(MIN_DIRECTION_ANGLE);
20459
- }, children: jsxRuntime.jsxs("div", { className: styles$3.directions, children: [jsxRuntime.jsx("div", { className: styles$3.default, children: jsxRuntime.jsx(antd.Button, { disabled: !canSetDefault, variant: "link", color: "primary", onClick: resetDirection, children: "Default" }) }), jsxRuntime.jsx("div", { className: styles$3.tips, children: "\u4E00\u4E2A\u7B80\u77ED\u7684\u8BF4\u660E\uFF0C\u5E0C\u671B\u80FD\u5145\u5F53\u7B80\u5355\u7684\u6559\u7A0B\uFF0C\u9700\u8981\u53EF\u5FC3\u6839\u636EC\u7AEF\u5DF2\u6709\u7684\u6574\u5408\u4E00\u4E0B" }), jsxRuntime.jsxs("div", { className: styles$3.optimal, children: [jsxRuntime.jsx("div", { children: "*" }), jsxRuntime.jsx(SvgOption, {}), jsxRuntime.jsx("div", { className: styles$3.text, children: "Optimal direction" })] }), jsxRuntime.jsxs("div", { className: styles$3.content, children: [jsxRuntime.jsx("div", { className: styles$3.background, children: jsxRuntime.jsxs("div", { style: {
20460
- position: 'relative',
20461
- width: `${300 * (boundaryViewBox.width / boundaryViewBox.height)}px`,
20462
- height: '300px',
20463
- margin: '0 auto',
20464
- }, children: [boundaryViewBox && (jsxRuntime.jsx("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: `${boundaryViewBox.x} ${boundaryViewBox.y} ${boundaryViewBox.width} ${boundaryViewBox.height}`, width: `${300 * (boundaryViewBox.width / boundaryViewBox.height)}px`, height: "300px", style: { position: 'absolute', inset: 0, pointerEvents: 'none' }, children: Object.keys(svgElementDatas)?.map((key) => {
20465
- return svgElementDatas[key]?.map((element) => {
20466
- if (key === DataType.VISION_OFF)
20467
- return null;
20468
- return (jsxRuntime.jsx(GElement, { type: key, data: svgElementDatas[key], children: jsxRuntime.jsx(SvgElement, { type: key, data: element, onSelect: () => { }, onCancel: () => { } }, element.id) }, key));
20469
- });
20470
- }) })), jsxRuntime.jsx(CharginPile, { mapData: mapJson, mapConfig: mapConfig, viewBox: boundaryViewBox || null, rotation: drag?.rotation })] }) }), jsxRuntime.jsx("div", { className: styles$3.luppan, children: jsxRuntime.jsx(MowDirection_L, { value: directions, angleValue: angle, optionAngle: optionAngle, onChange: (value) => {
20865
+ }, children: jsxRuntime.jsxs("div", { className: styles$3.directions, children: [jsxRuntime.jsx("div", { className: styles$3.default, children: jsxRuntime.jsx(antd.Button, { disabled: !canSetDefault, variant: "link", color: "primary", onClick: resetDirection, children: "Default" }) }), jsxRuntime.jsx("div", { className: styles$3.tips, children: "\u4E00\u4E2A\u7B80\u77ED\u7684\u8BF4\u660E\uFF0C\u5E0C\u671B\u80FD\u5145\u5F53\u7B80\u5355\u7684\u6559\u7A0B\uFF0C\u9700\u8981\u53EF\u5FC3\u6839\u636EC\u7AEF\u5DF2\u6709\u7684\u6574\u5408\u4E00\u4E0B" }), jsxRuntime.jsxs("div", { className: styles$3.optimal, children: [jsxRuntime.jsx("div", { children: "*" }), jsxRuntime.jsx(SvgOption, {}), jsxRuntime.jsx("div", { className: styles$3.text, children: "Optimal direction" })] }), jsxRuntime.jsxs("div", { className: styles$3.content, children: [jsxRuntime.jsx("div", { className: styles$3.background, children: jsxRuntime.jsx(BoundarySvgRender, { mapJson: mapJson, id: editMapInfo.selectElement.id }) }), jsxRuntime.jsx("div", { className: styles$3.luppan, children: jsxRuntime.jsx(MowDirection_L, { value: directions, angleValue: angle, optionAngle: optionAngle, onChange: (value) => {
20471
20866
  console.log('valie=>', value);
20472
20867
  setDirections(value);
20473
20868
  } }) })] }), jsxRuntime.jsx("div", { className: styles$3.slideTip, children: "\u7528\u6237\u8FD8\u53EF\u4EE5\u901A\u8FC7\u6ED1\u8F68\u5FAE\u8C03\u5272\u8349\u65B9\u5411\uFF08\u975E\u5FC5\u987B\uFF09" }), jsxRuntime.jsx("div", { className: styles$3.slider, children: jsxRuntime.jsx(antd.Slider, { tooltip: {
@@ -20518,7 +20913,7 @@ const BoundaryInfo = ({ onHandleDelete }) => {
20518
20913
  return editMapInfo?.selectElement?.recBaseAngle;
20519
20914
  }, [editMapInfo.selectElement?.recBaseAngle]);
20520
20915
  console.log('height---->', editMapInfo?.selectElement, heightValue, edgeMowingValue);
20521
- return (jsxRuntime.jsxs("div", { className: styles$9.boundaryInfo, children: [jsxRuntime.jsx(Header, { handleDelete: onHandleDelete, handleFocus: onHandleFocus, type: editMapInfo.elementType }), jsxRuntime.jsx("div", { className: styles$9.nameEdit, children: jsxRuntime.jsx(NameEdit, { name: nameValue, onChange: (name) => {
20916
+ return (jsxRuntime.jsxs("div", { className: styles$9.boundaryInfo, children: [jsxRuntime.jsx(Header, { handleDelete: onHandleDelete, handleFocus: onHandleFocus, type: editMapInfo.elementType }), jsxRuntime.jsx("div", { className: styles$9.nameEdit, children: jsxRuntime.jsx(NameEdit, { title: "Boundary name", name: nameValue, onChange: (name) => {
20522
20917
  setEditMapInfo({
20523
20918
  ...editMapInfo,
20524
20919
  isShowDrag: false,
@@ -20578,6 +20973,11 @@ const TimePeriod = ({ value, onChange }) => {
20578
20973
  const [open, setOpen] = React.useState(false);
20579
20974
  const [radioValue, setRadioValue] = React.useState(RadioValue.LONG_TIME);
20580
20975
  console.log('time period->', date, radioValue);
20976
+ React.useEffect(() => {
20977
+ if (!open && date?.length !== 2) {
20978
+ setRadioValue(RadioValue.LONG_TIME);
20979
+ }
20980
+ }, [open]);
20581
20981
  return (jsxRuntime.jsxs("div", { className: styles$1.timePeriod, children: [jsxRuntime.jsxs("div", { className: styles$1.timePeriodHeader, children: [jsxRuntime.jsx("div", { className: styles$1.timePeriodTitle, children: "Enabled" }), jsxRuntime.jsx("div", { className: styles$1.timePeriodHandle, children: jsxRuntime.jsx(antd.Switch, { checked: value.status === 1, onChange: (checked) => {
20582
20982
  onChange({
20583
20983
  ...value,
@@ -20601,15 +21001,11 @@ const TimePeriod = ({ value, onChange }) => {
20601
21001
  // endTimestamp: dayjs().add(1, 'hour').unix(),
20602
21002
  // });
20603
21003
  }
20604
- }, style: { display: 'flex', flexDirection: 'column', gap: '4px' }, children: [jsxRuntime.jsx(antd.Radio, { value: RadioValue.LONG_TIME, children: jsxRuntime.jsx("div", { className: styles$1.timePeriodRadioItem, children: "\u957F\u65F6\u95F4\u5F00\u542F" }) }), jsxRuntime.jsx(antd.Radio, { value: RadioValue.SHORT_TIME, children: jsxRuntime.jsx("div", { className: styles$1.timePeriodRadioItem, children: jsxRuntime.jsx(antd.DatePicker.RangePicker, { open: open, onOpenChange: (open) => {
20605
- if (!open) {
20606
- setRadioValue(RadioValue.LONG_TIME);
20607
- }
21004
+ }, style: { display: 'flex', flexDirection: 'column', gap: '4px' }, children: [jsxRuntime.jsx(antd.Radio, { value: RadioValue.LONG_TIME, children: jsxRuntime.jsx("div", { className: styles$1.timePeriodRadioItem, children: "\u957F\u65F6\u95F4\u5F00\u542F" }) }), jsxRuntime.jsx(antd.Radio, { value: RadioValue.SHORT_TIME, children: jsxRuntime.jsx("div", { className: styles$1.timePeriodRadioItem, children: jsxRuntime.jsx(antd.DatePicker.RangePicker, { open: open, value: date ? date : undefined, disabled: radioValue === RadioValue.LONG_TIME, showTime: { format: 'HH:mm' }, format: "MM/DD/YYYY HH:mm", preserveInvalidOnBlur: true, onOpenChange: (open) => {
20608
21005
  setOpen(open);
20609
- }, value: date ? date : undefined, disabled: radioValue === RadioValue.LONG_TIME, showTime: { format: 'HH:mm' }, format: "MM/DD/YYYY HH:mm", preserveInvalidOnBlur: true, onChange: (dateValue, dateString) => {
20610
- console.log('change->', dateValue);
21006
+ }, onChange: (dateValue, dateString) => {
21007
+ setDate(dateValue);
20611
21008
  if (dateValue?.length === 2) {
20612
- setDate(dateValue);
20613
21009
  onChange({
20614
21010
  status: RadioValue.SHORT_TIME,
20615
21011
  startTimestamp: dateValue[0].unix(),
@@ -20650,7 +21046,7 @@ const ObstacleInfo = ({ onHandleDelete }) => {
20650
21046
  }, [editMapInfo.selectElement]);
20651
21047
  return (jsxRuntime.jsxs("div", { className: styles$9.obstacleInfo, children: [jsxRuntime.jsx(Header, { handleDelete: () => {
20652
21048
  onHandleDelete();
20653
- }, handleFocus: () => { }, type: editMapInfo.elementType }), jsxRuntime.jsx("div", { className: styles$9.nameEdit, children: jsxRuntime.jsx(NameEdit, { name: nameValue, onChange: (name) => {
21049
+ }, handleFocus: () => { }, type: editMapInfo.elementType }), jsxRuntime.jsx("div", { className: styles$9.nameEdit, children: jsxRuntime.jsx(NameEdit, { title: "Obstacle name", name: nameValue, onChange: (name) => {
20654
21050
  setEditMapInfo({
20655
21051
  ...editMapInfo,
20656
21052
  isShowDrag: false,
@@ -20800,7 +21196,7 @@ const HandleElementInfo = () => {
20800
21196
  const isUndoDisabled = React.useMemo(() => {
20801
21197
  if (editMapInfo?.elementType === DataType.OBSTACLE &&
20802
21198
  editMapInfo?.createMode === CreateStatus.CREATING) {
20803
- return !(editMapInfo?.currentHistoryIndex >= 0 && editMapInfo?.historyList?.length);
21199
+ return !(editMapInfo?.currentHistoryIndex > 0 && editMapInfo?.historyList?.length);
20804
21200
  }
20805
21201
  else {
20806
21202
  return !(editMapInfo?.currentHistoryIndex > 0 && editMapInfo?.historyList?.length);
@@ -20815,12 +21211,20 @@ const HandleElementInfo = () => {
20815
21211
  return !(editMapInfo?.currentHistoryIndex < editMapInfo?.historyList?.length - 1 &&
20816
21212
  editMapInfo?.historyList?.length);
20817
21213
  }, [editMapInfo?.currentHistoryIndex, editMapInfo?.historyList]);
20818
- const handleUndo = React.useCallback(() => {
21214
+ const handleUndo = React.useCallback((e) => {
21215
+ e.stopPropagation();
21216
+ e.preventDefault();
21217
+ if (isUndoDisabled)
21218
+ return;
20819
21219
  undo();
20820
- }, [undo]);
20821
- const handleRedo = React.useCallback(() => {
21220
+ }, [undo, isUndoDisabled]);
21221
+ const handleRedo = React.useCallback((e) => {
21222
+ e.stopPropagation();
21223
+ e.preventDefault();
21224
+ if (idRedoDisabled)
21225
+ return;
20822
21226
  redo();
20823
- }, [redo]);
21227
+ }, [redo, idRedoDisabled]);
20824
21228
  const renderElementData = React.useCallback((element) => {
20825
21229
  if (!editMapInfo.selectElement)
20826
21230
  return null;
@@ -21133,7 +21537,7 @@ const defaultMapConfig = DEFAULT_STYLES;
21133
21537
  // 地图渲染器组件
21134
21538
  const MowerMapRenderer = React.forwardRef(({ sn, platform = PlatformType.WEB, edger = false, unitType = UnitsType.Imperial, language = 'en', onlyRead = false, mapConfig,
21135
21539
  // pathConfig,
21136
- modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, onPathLoad, onError, className, style, googleMapInstance: _googleMapInstance, dragMap = false, dragCallbacks, defaultTransform, debug: _debug = false, doodleList = [], editMap = false, unStructMapData, disabledObstacles = false, onHandleEnterRecord, onHandleCompleteRecord, onHandleStopRecord, onHandleDeleteElement, onSaveBoundaryData, onSaveMap, onEditInfoMapChange, onUpdateBoundary, heightOptions, globalHeight, }, ref) => {
21540
+ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, onPathLoad, onError, className, style, googleMapInstance: _googleMapInstance, dragMap = false, dragCallbacks, defaultTransform, debug: _debug = false, doodleList = [], editMap = false, unStructMapData, disabledObstacles = false, onHandleEnterRecord, onHandleCompleteRecord, onHandleStopRecord, onHandleDeleteElement, onSaveBoundaryData, onSaveMap, onEditInfoMapChange, onUpdateBoundary, heightOptions, globalHeight, onClickEvent, }, ref) => {
21137
21541
  const [currentError, setCurrentError] = React.useState(null);
21138
21542
  const overlayRef = React.useRef(null);
21139
21543
  // const mapRef = useMap();
@@ -21148,14 +21552,13 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21148
21552
  });
21149
21553
  const [overlay, setOverlay] = React.useState(null);
21150
21554
  const [overlayLayout, setOverlayLayout] = React.useState(null);
21555
+ const [overlayScale, setOverlayScale] = React.useState(1);
21556
+ // 参考zoom级别,在此级别时overlayScale=1,元素显示原始大小
21557
+ const REFERENCE_ZOOM = 19;
21151
21558
  const svgMapRef = React.useRef(null);
21152
21559
  const svgEditMapRef = React.useRef(null);
21153
21560
  const [editMapInfo, setEditMapInfo] = React.useState({
21154
- editMap: false,
21155
- selectElement: null,
21156
- createMode: null,
21157
- elementType: null,
21158
- isShowDrag: false,
21561
+ ...INIT_EDIT_MAP_INFO,
21159
21562
  });
21160
21563
  const minDistance = React.useMemo(() => {
21161
21564
  return getMinSvgDistanceByModel(modelType);
@@ -21190,6 +21593,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21190
21593
  onSaveMap,
21191
21594
  onHandleDeleteElement,
21192
21595
  onUpdateBoundary,
21596
+ onClickEvent,
21193
21597
  };
21194
21598
  }, [
21195
21599
  minDistance,
@@ -21201,6 +21605,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21201
21605
  onSaveBoundaryData,
21202
21606
  onSaveMap,
21203
21607
  onUpdateBoundary,
21608
+ onClickEvent,
21204
21609
  ]);
21205
21610
  // 合并配置
21206
21611
  const mergedMapConfig = React.useMemo(() => {
@@ -21233,6 +21638,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21233
21638
  mapJson,
21234
21639
  drag: defaultTransform,
21235
21640
  mapRef,
21641
+ overlayScale,
21236
21642
  };
21237
21643
  }, [
21238
21644
  sn,
@@ -21246,6 +21652,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21246
21652
  mapJson,
21247
21653
  defaultTransform,
21248
21654
  mapRef,
21655
+ overlayScale,
21249
21656
  ]);
21250
21657
  // console.log('svgElementDatas->', svgElementDatas, unStructMapData, commonValue);
21251
21658
  // 处理地图分区边界
@@ -21264,7 +21671,6 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21264
21671
  // }
21265
21672
  // return allBoundaryElements;
21266
21673
  // }, [mapJson]);
21267
- React.useMemo(() => antennaConfig, [antennaConfig]);
21268
21674
  const mowerPositionData = React.useMemo(() => {
21269
21675
  // realTimeData 中包含三个种类的数据,之需要实时坐标的数据即可。
21270
21676
  if (!realTimeData || realTimeData.length === 0)
@@ -21477,6 +21883,38 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21477
21883
  React.useEffect(() => {
21478
21884
  setDrag(defaultTransform ?? { x: 0, y: 0, rotation: 0 });
21479
21885
  }, [defaultTransform]);
21886
+ // 监听地图zoom变化,计算缩放比例
21887
+ React.useEffect(() => {
21888
+ if (!mapRef)
21889
+ return;
21890
+ const updateScale = () => {
21891
+ const currentZoom = mapRef.getZoom();
21892
+ if (currentZoom === undefined)
21893
+ return;
21894
+ // 基于固定的参考zoom级别计算overlayScale
21895
+ const zoomDiff = currentZoom - REFERENCE_ZOOM;
21896
+ const scale = Math.pow(2, -zoomDiff); // 负数实现反向缩放
21897
+ setOverlayScale(scale);
21898
+ };
21899
+ // 使用lodash throttle进行节流处理: 100ms内只执行一次
21900
+ const handleZoomChanged = throttle$2(updateScale, 50);
21901
+ // 添加zoom监听
21902
+ const listener = mapRef.addListener('zoom_changed', handleZoomChanged);
21903
+ // 初始化时获取当前zoom
21904
+ updateScale();
21905
+ return () => {
21906
+ if (listener) {
21907
+ window.google.maps.event.removeListener(listener);
21908
+ }
21909
+ // 取消未执行的节流函数
21910
+ handleZoomChanged.cancel();
21911
+ };
21912
+ }, [mapRef]);
21913
+ React.useEffect(() => {
21914
+ if (!editMap) {
21915
+ setEditMapInfo(INIT_EDIT_MAP_INFO);
21916
+ }
21917
+ }, [editMap]);
21480
21918
  React.useEffect(() => {
21481
21919
  if (!mapJson)
21482
21920
  return;
@@ -21547,6 +21985,8 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21547
21985
  clearHistory: () => svgEditMapRef.current?.clearHistory(),
21548
21986
  // 添加历史记录
21549
21987
  addHistory: (history) => svgEditMapRef.current?.addHistory(history),
21988
+ // 添加doodle
21989
+ addDoodle: (doodle) => svgEditMapRef.current?.addDoodle(doodle),
21550
21990
  }));
21551
21991
  /**
21552
21992
  * 根据割草机的位置更新路径
@@ -21571,7 +22011,6 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21571
22011
  pre[cur] = parseFloat(curLayout);
21572
22012
  return pre;
21573
22013
  }, {});
21574
- // console.log('setedit svg ------------->', layout);
21575
22014
  if (layout?.width && layout?.height) {
21576
22015
  svgEditMapRef?.current?.adjustSvgSize?.(layout);
21577
22016
  setOverlayLayout(layout);
@@ -21580,6 +22019,7 @@ modelType, mapRef, mapJson, pathJson, realTimeData, antennaConfig, onMapLoad, on
21580
22019
  });
21581
22020
  MowerMapRenderer.displayName = 'MowerMapRenderer';
21582
22021
 
22022
+ exports.BoundarySvgRender = BoundarySvgRender;
21583
22023
  exports.MapDataProcessor = MapDataProcessor;
21584
22024
  exports.MowerMapRenderer = MowerMapRenderer;
21585
22025
  exports.PathDataProcessor = PathDataProcessor;