@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.
- package/dist/index.esm.js +578 -139
- package/dist/index.js +578 -138
- package/dist/src/context/common.d.ts +3 -0
- package/dist/src/context/common.d.ts.map +1 -1
- package/dist/src/context/mapEdit.d.ts +21 -54
- package/dist/src/context/mapEdit.d.ts.map +1 -1
- package/dist/src/index.d.ts +1 -0
- package/dist/src/index.d.ts.map +1 -1
- package/dist/src/render/BoundarySvgRender.d.ts +10 -0
- package/dist/src/render/BoundarySvgRender.d.ts.map +1 -0
- package/dist/src/render/MowerMapRenderer.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/AddEntry/components/DoodleModal/index.d.ts +1 -1
- package/dist/src/render/svgEditMap/components/AddEntry/components/DoodleModal/index.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/AddEntry/index.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/boundary.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/DirectionModal/index.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/Header/index.d.ts +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/Header/index.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/index.d.ts +2 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/index.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/nameModal.d.ts +2 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/NameEdit/nameModal.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/components/TimePeriod/index.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/index.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/components/HandleElementInfo/obstacle.d.ts.map +1 -1
- package/dist/src/render/svgEditMap/index.d.ts +2 -0
- package/dist/src/render/svgEditMap/index.d.ts.map +1 -1
- package/dist/src/render/svgElement/ChannelClipPath/index.d.ts.map +1 -1
- package/dist/src/render/svgElement/DoodleElement/index.d.ts.map +1 -1
- package/dist/src/render/svgElement/ObstacleElement/index.d.ts.map +1 -1
- package/dist/src/render/svgElement/PolygonELement/components/DistanceLabels.d.ts.map +1 -1
- package/dist/src/render/svgElement/PolygonELement/dashPath/index.d.ts.map +1 -1
- package/dist/src/render/svgElement/PolygonELement/index.d.ts +1 -1
- package/dist/src/render/svgElement/PolygonELement/index.d.ts.map +1 -1
- package/dist/src/render/svgElement/PolygonELement/vertex/index.d.ts.map +1 -1
- package/dist/src/render/svgElement/TransformWrapper/DoodleTransformWrapper/DoodleTransformWrapper.d.ts +1 -0
- package/dist/src/render/svgElement/TransformWrapper/DoodleTransformWrapper/DoodleTransformWrapper.d.ts.map +1 -1
- package/dist/src/render/svgElement/TransformWrapper/VisionOffTransformWrapper/VisionOffTransformWrapper.d.ts.map +1 -1
- package/dist/src/render/svgElement/VisionOffElement/index.d.ts.map +1 -1
- package/dist/src/types/renderer.d.ts +4 -1
- package/dist/src/types/renderer.d.ts.map +1 -1
- 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$
|
|
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$
|
|
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$
|
|
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$
|
|
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$
|
|
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", {
|
|
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
|
-
|
|
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)) ||
|
|
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:
|
|
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 = ({
|
|
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 =
|
|
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 >=
|
|
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
|
-
|
|
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("
|
|
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, {
|
|
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: [
|
|
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, {
|
|
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, {
|
|
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: "#
|
|
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: [
|
|
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' },
|
|
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.
|
|
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 (
|
|
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: [
|
|
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
|
-
}, [
|
|
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, {
|
|
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, {
|
|
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: [
|
|
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: [
|
|
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
|
|
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: `${
|
|
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
|
|
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.
|
|
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
|
-
},
|
|
20610
|
-
|
|
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
|
|
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
|
-
|
|
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;
|