@kdcloudjs/table 1.2.2-canary.13 → 1.2.2-canary.14

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.
@@ -21,6 +21,7 @@ var _classnames = _interopRequireDefault(require("classnames"));
21
21
  var _styles = require("../../base/styles");
22
22
  var _const = require("../const");
23
23
  var _internals = require("../../internals");
24
+ var _touchEventUtils = require("./utils/touchEventUtils");
24
25
  var ROW_DRAG_COLUMN_CODE = '$_row_drag_column_&';
25
26
  exports.ROW_DRAG_COLUMN_CODE = ROW_DRAG_COLUMN_CODE;
26
27
  var rowDragKey = 'rowDragKey';
@@ -43,15 +44,14 @@ var defaultRowDragColumn = {
43
44
  },
44
45
  render: function render(value, row, rowIndex) {
45
46
  return /*#__PURE__*/_react.default.createElement("svg", {
46
- viewBox: '0 0 1024 1024',
47
- version: '1.1',
48
- xmlns: 'http://www.w3.org/1999/xlink',
49
- "data-icon": 'drag',
50
- width: '16',
51
- height: '16'
47
+ viewBox: "0 0 1024 1024",
48
+ version: "1.1",
49
+ xmlns: "http://www.w3.org/1999/xlink",
50
+ "data-icon": "drag",
51
+ width: "16",
52
+ height: "16"
52
53
  }, /*#__PURE__*/_react.default.createElement("path", {
53
- d: 'M298.688 192a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0zM298.688 512a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m-298.624 320a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z',
54
- "p-id": '4278'
54
+ d: "M298.688 192a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0zM298.688 512a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m-298.624 320a64 64 0 1 0 128 0 64 64 0 0 0-128 0z m298.624 0a64 64 0 1 0 128 0 64 64 0 0 0-128 0z"
55
55
  }));
56
56
  }
57
57
  };
@@ -81,19 +81,19 @@ function rowDrag(opt) {
81
81
  var treeModeOptions = getTreeModeOptions();
82
82
  var rowDragOptions = getRowDragOptions();
83
83
  var allowDragIntoRow = !!treeModeOptions && (rowDragOptions === null || rowDragOptions === void 0 ? void 0 : rowDragOptions.allowDragIntoRow);
84
- var isLeave = !isMouseOnDropTarget(event, dropZoneTarget);
84
+ var isLeave = !isPointerOnDropTarget(event, dropZoneTarget);
85
85
  var overIndex = -1;
86
86
  var direction = 'bottom';
87
87
  if (!isLeave && dataSource.length > 0) {
88
- var overDragItem = getDragRowItem(event.target, dropZoneTarget, dataSource);
88
+ var overDragItem = getDragRowItem((0, _touchEventUtils.getEventTarget)(event), dropZoneTarget, dataSource);
89
89
  if (overDragItem) {
90
90
  var rowIndex = overDragItem.rowIndex,
91
91
  cell = overDragItem.cell;
92
92
  overIndex = rowIndex;
93
- direction = getDirection(cell, event.clientY, allowDragIntoRow);
93
+ direction = getDirection(cell, (0, _touchEventUtils.getEventCoordinates)(event).clientY, allowDragIntoRow);
94
94
  }
95
95
  }
96
- if (overIndex === -1 && dataSource.length > 0 && dropZoneTarget.contains(event.target)) {
96
+ if (overIndex === -1 && dataSource.length > 0 && dropZoneTarget.contains((0, _touchEventUtils.getEventTarget)(event))) {
97
97
  overIndex = dataSource.length - 1;
98
98
  direction = 'bottom';
99
99
  }
@@ -169,9 +169,25 @@ function rowDrag(opt) {
169
169
  }
170
170
  };
171
171
  var onMouseDown = function onMouseDown(event) {
172
+ handlePointerDown(event.nativeEvent);
173
+ };
174
+ // PC 单据移动端显示,兼容移动端的拖拽事件
175
+ var onTouchStart = function onTouchStart(event) {
176
+ // 尝试阻止触摸事件的默认行为,防止页面滚动
177
+ try {
178
+ if (event.cancelable) {
179
+ event.preventDefault();
180
+ }
181
+ } catch (error) {
182
+ // 忽略passive event listener错误
183
+ console.warn('preventDefault failed in passive touch event listener');
184
+ }
185
+ handlePointerDown(event.nativeEvent);
186
+ };
187
+ // 统一的拖拽处理函数
188
+ var handlePointerDown = function handlePointerDown(startEvent) {
172
189
  var _a;
173
- var mouseDownEvent = event.nativeEvent;
174
- var startDataItem = getDragRowItem(mouseDownEvent.target, tableBody, dataSource);
190
+ var startDataItem = getDragRowItem((0, _touchEventUtils.getEventTarget)(startEvent), tableBody, dataSource);
175
191
  if (!startDataItem || startDataItem.code !== rowDragColumn.code) return;
176
192
  if ((_a = opt === null || opt === void 0 ? void 0 : opt.isDisabled) === null || _a === void 0 ? void 0 : _a.call(opt, startDataItem.row, startDataItem.rowIndex)) return;
177
193
  var isValidDrag = false;
@@ -183,7 +199,7 @@ function rowDrag(opt) {
183
199
  var intervalId = null;
184
200
  var expandRowTimeoutId = null;
185
201
  var expandRowCallBackList = [];
186
- var updateScrollPosition = function updateScrollPosition(tableBody, mouseMoveEvent) {
202
+ var updateScrollPosition = function updateScrollPosition(tableBody, moveEvent) {
187
203
  if (opt === null || opt === void 0 ? void 0 : opt.suppressScrollMove) return;
188
204
  if (timeoutId) {
189
205
  clearTimeout(timeoutId);
@@ -192,7 +208,7 @@ function rowDrag(opt) {
192
208
  clearInterval(intervalId);
193
209
  }
194
210
  if (!tableBody) return;
195
- var moveOffset = getScrollMoveOffset(tableBody, mouseMoveEvent);
211
+ var moveOffset = getScrollMoveOffset(tableBody, moveEvent);
196
212
  if (moveOffset === 0) {
197
213
  return;
198
214
  }
@@ -202,30 +218,53 @@ function rowDrag(opt) {
202
218
  }, 50);
203
219
  }, 500);
204
220
  };
205
- var handleDragStart = function handleDragStart(mouseDownEvent) {
221
+ var handleDragStart = function handleDragStart(event) {
206
222
  var _a;
207
- dragElement = createDragElement(mouseDownEvent, tableBody); // 创建拖拽悬浮框
223
+ // 屏蔽默认事件,防止文本选择、框选等
224
+ try {
225
+ if (event.cancelable) {
226
+ event.preventDefault();
227
+ }
228
+ } catch (error) {
229
+ // 忽略passive event listener错误
230
+ console.warn('preventDefault failed in passive event listener');
231
+ }
232
+ // 禁用页面的文本选择
233
+ document.body.style.userSelect = 'none';
234
+ document.body.style.webkitUserSelect = 'none';
235
+ // 添加拖拽状态的CSS类,可以在样式中进一步控制
236
+ document.body.classList.add('row-dragging');
237
+ dragElement = createDragElement(event, tableBody); // 创建拖拽悬浮框
208
238
  var isTreeTable = !!pipeline.getFeatureOptions('treeModeOptions');
209
239
  dragLine = createDragLine(isTreeTable); // 创建拖拽插入指示线
210
240
  var dragText = (opt === null || opt === void 0 ? void 0 : opt.rowDragText) ? (_a = opt === null || opt === void 0 ? void 0 : opt.rowDragText) === null || _a === void 0 ? void 0 : _a.call(opt, startDataItem.row, startDataItem.rowIndex) : "\u7B2C".concat(startDataItem.rowIndex, "\u884C\u5185\u5BB9");
211
241
  setDragText(dragElement, dragText); // 设置悬浮框显示文本
212
242
  artTable.classList.add((0, _classnames.default)(_styles.Classes.rowDragging));
213
243
  rowDragApi.setDragStatus('start');
214
- var dragEvent = createDropTargetEvent(currentDropZone, mouseDownEvent, startDataItem, currentDropZone);
244
+ var dragEvent = createDropTargetEvent(currentDropZone, event, startDataItem, currentDropZone);
215
245
  onDragStart(dragEvent);
216
246
  };
217
- var handleDragMove = function handleDragMove(mouseMoveEvent) {
247
+ var handleDragMove = function handleDragMove(moveEvent) {
218
248
  var _a;
249
+ // 尝试屏蔽默认事件,在passive监听器中可能会失败
250
+ try {
251
+ if (moveEvent.cancelable) {
252
+ moveEvent.preventDefault();
253
+ }
254
+ } catch (error) {
255
+ // 忽略passive event listener错误
256
+ console.warn('preventDefault failed in passive event listener');
257
+ }
219
258
  var isRTL = pipeline.ctx.direction === 'rtl';
220
- positionDragElemment(dragElement, mouseMoveEvent, isRTL); // 更新拖拽悬浮框位置
259
+ positionDragElemment(dragElement, moveEvent, isRTL); // 更新拖拽悬浮框位置
221
260
  rowDragApi.setDragStatus('dragging');
222
261
  setDragElementIcon(dragElement, 'move');
223
262
  var rowDropZones = rowDragApi.getRowDropZone();
224
263
  var validDropZones = (0, _concat.default)(rowDropZones).call(rowDropZones, currentDropZone); // 可放置区域加上自身
225
264
  var dropTarget = (0, _find.default)(validDropZones).call(validDropZones, function (zone) {
226
- return isMouseOnDropTarget(mouseMoveEvent, zone.getContainer());
265
+ return isPointerOnDropTarget(moveEvent, zone.getContainer());
227
266
  }) || null;
228
- updateScrollPosition(dropTarget === null || dropTarget === void 0 ? void 0 : dropTarget.getContainer(), mouseMoveEvent); // 拖拽到底时让滚动条可以滚动
267
+ updateScrollPosition(dropTarget === null || dropTarget === void 0 ? void 0 : dropTarget.getContainer(), moveEvent); // 拖拽到底时让滚动条可以滚动
229
268
  if (dropTarget !== lastDropTarget) {
230
269
  // 拖拽离开表格
231
270
  if (lastDropTarget !== null && dropTarget === null) {
@@ -233,7 +272,7 @@ function rowDrag(opt) {
233
272
  setDragElementIcon(dragElement, 'notAllowed');
234
273
  hiddenDragLine(dragLine);
235
274
  lastDropTarget.getContainer().classList.remove(_styles.Classes.rowDragNoData);
236
- var dragEvent = createDropTargetEvent(lastDropTarget, mouseMoveEvent, startDataItem, currentDropZone);
275
+ var dragEvent = createDropTargetEvent(lastDropTarget, moveEvent, startDataItem, currentDropZone);
237
276
  lastDropTarget.onDragLeave(dragEvent);
238
277
  }
239
278
  }
@@ -253,7 +292,7 @@ function rowDrag(opt) {
253
292
  dragLine.classList.remove(_styles.Classes.treeTableRowDragLine);
254
293
  }
255
294
  }
256
- var _dragEvent = createDropTargetEvent(dropTarget, mouseMoveEvent, startDataItem, currentDropZone);
295
+ var _dragEvent = createDropTargetEvent(dropTarget, moveEvent, startDataItem, currentDropZone);
257
296
  dropTarget.onDragEnter(_dragEvent);
258
297
  }
259
298
  }
@@ -265,7 +304,7 @@ function rowDrag(opt) {
265
304
  positionDragLine({
266
305
  lineElement: dragLine,
267
306
  dragZone: dropTarget,
268
- event: mouseMoveEvent,
307
+ event: moveEvent,
269
308
  isRTL: isRTL
270
309
  });
271
310
  }
@@ -282,7 +321,7 @@ function rowDrag(opt) {
282
321
  onCollapse = treeModeOptions.onCollapse;
283
322
  // 鼠标悬停所在的拖拽行信息
284
323
  var dataSource = dropTarget.tableParams.getDataSource();
285
- var dragItem = getDragRowItem(mouseMoveEvent.target, dropTarget.getContainer(), dataSource);
324
+ var dragItem = getDragRowItem((0, _touchEventUtils.getEventTarget)(moveEvent), dropTarget.getContainer(), dataSource);
286
325
  if (!dragItem) return;
287
326
  var row = dragItem.row;
288
327
  var _row$treeMetaKey = row[treeMetaKey],
@@ -297,15 +336,20 @@ function rowDrag(opt) {
297
336
  }, 1000);
298
337
  }
299
338
  if (dropTarget.onDragging) {
300
- var _dragEvent2 = createDropTargetEvent(dropTarget, mouseMoveEvent, startDataItem, currentDropZone);
339
+ var _dragEvent2 = createDropTargetEvent(dropTarget, moveEvent, startDataItem, currentDropZone);
301
340
  dropTarget.onDragging(_dragEvent2);
302
341
  }
303
342
  }
304
343
  };
305
- var handleDragStop = function handleDragStop(mouseUpEvent) {
344
+ var handleDragStop = function handleDragStop(endEvent) {
306
345
  if (!isValidDrag) {
307
346
  return;
308
347
  }
348
+ // 恢复默认的文本选择功能
349
+ document.body.style.userSelect = '';
350
+ document.body.style.webkitUserSelect = '';
351
+ // 移除拖拽状态的CSS类
352
+ document.body.classList.remove('row-dragging');
309
353
  removeElement(dragElement);
310
354
  removeElement(dragLine);
311
355
  artTable.classList.remove((0, _classnames.default)(_styles.Classes.rowDragging));
@@ -320,10 +364,10 @@ function rowDrag(opt) {
320
364
  });
321
365
  var validDropZones = (0, _concat.default)(rowDropZones).call(rowDropZones, currentDropZone);
322
366
  var dropTarget = (0, _find.default)(validDropZones).call(validDropZones, function (zone) {
323
- return isMouseOnDropTarget(mouseUpEvent, zone.getContainer());
367
+ return isPointerOnDropTarget(endEvent, zone.getContainer());
324
368
  });
325
369
  if (dropTarget && dropTarget.onDragStop) {
326
- var dragEvent = createDropTargetEvent(dropTarget, mouseUpEvent, startDataItem, currentDropZone);
370
+ var dragEvent = createDropTargetEvent(dropTarget, endEvent, startDataItem, currentDropZone);
327
371
  dropTarget.onDragStop(dragEvent);
328
372
  }
329
373
  while (expandRowCallBackList.length > 0) {
@@ -331,32 +375,73 @@ function rowDrag(opt) {
331
375
  callback();
332
376
  }
333
377
  };
334
- var mousemove$ = (0, _rxjs.fromEvent)(window, 'mousemove');
335
- var mouseup$ = (0, _rxjs.fromEvent)(window, 'mouseup');
336
- var rowDragMove$ = mousemove$.pipe((0, _filterInstanceProperty(_operators))(function (mouseMoveEvent) {
337
- var mouseMoveClientY = mouseMoveEvent.clientY;
338
- var mouseDownClientY = mouseDownEvent.clientY;
339
- // 上下移动偏移量大于5才是有效的拖拽
340
- if (Math.abs(mouseMoveClientY - mouseDownClientY) > 5) {
341
- isValidDrag = true;
342
- }
343
- return isValidDrag;
344
- }), (0, _mapInstanceProperty(_operators))(function (mouseMoveEvent) {
345
- if (!isDragging) {
346
- isDragging = true;
347
- handleDragStart(mouseDownEvent);
348
- handleDragMove(mouseDownEvent);
349
- }
350
- handleDragMove(mouseMoveEvent);
351
- }), (0, _operators.takeUntil)(mouseup$));
352
- rowDragMove$.subscribe();
353
- var rowDragEnd$ = mouseup$.pipe((0, _mapInstanceProperty(_operators))(function (mouseUpEvent) {
354
- handleDragStop(mouseUpEvent);
355
- })).subscribe({
356
- next: function next() {
357
- rowDragEnd$.unsubscribe();
358
- }
359
- });
378
+ // 判断是鼠标事件还是触摸事件,分别监听对应的移动和结束事件
379
+ var isTouchEvent = ('touches' in startEvent);
380
+ if (isTouchEvent) {
381
+ // 触摸事件处理
382
+ var touchmove$ = (0, _rxjs.fromEvent)(window, 'touchmove', {
383
+ passive: false
384
+ });
385
+ var touchend$ = (0, _rxjs.fromEvent)(window, 'touchend', {
386
+ passive: false
387
+ });
388
+ var touchDragMove$ = touchmove$.pipe((0, _filterInstanceProperty(_operators))(function (moveEvent) {
389
+ var coordinates = (0, _touchEventUtils.getEventCoordinates)(moveEvent);
390
+ var startCoordinates = (0, _touchEventUtils.getEventCoordinates)(startEvent);
391
+ var moveClientY = coordinates.clientY;
392
+ var startClientY = startCoordinates.clientY;
393
+ // 上下移动偏移量大于5才是有效的拖拽
394
+ if (Math.abs(moveClientY - startClientY) > 5) {
395
+ isValidDrag = true;
396
+ }
397
+ return isValidDrag;
398
+ }), (0, _mapInstanceProperty(_operators))(function (moveEvent) {
399
+ if (!isDragging) {
400
+ isDragging = true;
401
+ handleDragStart(startEvent);
402
+ handleDragMove(startEvent);
403
+ }
404
+ handleDragMove(moveEvent);
405
+ }), (0, _operators.takeUntil)(touchend$));
406
+ touchDragMove$.subscribe();
407
+ var touchDragEnd$ = touchend$.pipe((0, _mapInstanceProperty(_operators))(function (endEvent) {
408
+ handleDragStop(endEvent);
409
+ })).subscribe({
410
+ next: function next() {
411
+ touchDragEnd$.unsubscribe();
412
+ }
413
+ });
414
+ } else {
415
+ // 鼠标事件处理
416
+ var mousemove$ = (0, _rxjs.fromEvent)(window, 'mousemove');
417
+ var mouseup$ = (0, _rxjs.fromEvent)(window, 'mouseup');
418
+ var rowDragMove$ = mousemove$.pipe((0, _filterInstanceProperty(_operators))(function (moveEvent) {
419
+ var coordinates = (0, _touchEventUtils.getEventCoordinates)(moveEvent);
420
+ var startCoordinates = (0, _touchEventUtils.getEventCoordinates)(startEvent);
421
+ var moveClientY = coordinates.clientY;
422
+ var startClientY = startCoordinates.clientY;
423
+ // 上下移动偏移量大于5才是有效的拖拽
424
+ if (Math.abs(moveClientY - startClientY) > 5) {
425
+ isValidDrag = true;
426
+ }
427
+ return isValidDrag;
428
+ }), (0, _mapInstanceProperty(_operators))(function (moveEvent) {
429
+ if (!isDragging) {
430
+ isDragging = true;
431
+ handleDragStart(startEvent);
432
+ handleDragMove(startEvent);
433
+ }
434
+ handleDragMove(moveEvent);
435
+ }), (0, _operators.takeUntil)(mouseup$));
436
+ rowDragMove$.subscribe();
437
+ var rowDragEnd$ = mouseup$.pipe((0, _mapInstanceProperty(_operators))(function (endEvent) {
438
+ handleDragStop(endEvent);
439
+ })).subscribe({
440
+ next: function next() {
441
+ rowDragEnd$.unsubscribe();
442
+ }
443
+ });
444
+ }
360
445
  };
361
446
  var rowDragColumn = (opt === null || opt === void 0 ? void 0 : opt.rowDragColumn) || defaultRowDragColumn;
362
447
  pipeline.setFeatureOptions('rowDragColumnKey', rowDragColumn.code);
@@ -365,7 +450,8 @@ function rowDrag(opt) {
365
450
  nextColumns.unshift(rowDragColumn);
366
451
  pipeline.columns(nextColumns);
367
452
  pipeline.addTableProps({
368
- onMouseDown: onMouseDown
453
+ onMouseDown: onMouseDown,
454
+ onTouchStart: onTouchStart
369
455
  });
370
456
  pipeline.appendRowPropsGetter(function (row, rowIndex) {
371
457
  var _cx;
@@ -435,13 +521,13 @@ function isEleInFooter(target) {
435
521
  }
436
522
  return false;
437
523
  }
438
- function createDragElement(mouseDownEvent, tableBody) {
524
+ function createDragElement(event, tableBody) {
439
525
  var _context3, _context4;
440
526
  var ELEMENT_TEMPLATE = (0, _concat.default)(_context3 = (0, _concat.default)(_context4 = "<div class='".concat(_styles.Classes.rowDragElement, "'>\n <span class='")).call(_context4, _styles.Classes.rowDragElementIcon, "'></span>\n <div class='")).call(_context3, _styles.Classes.rowDragElementLabel, "'></div>\n </div>");
441
527
  var element = document.createElement('div');
442
528
  element.innerHTML = ELEMENT_TEMPLATE;
443
529
  var dragElement = element.firstChild;
444
- var targetRow = findTargetRow(mouseDownEvent.target, tableBody);
530
+ var targetRow = findTargetRow((0, _touchEventUtils.getEventTarget)(event), tableBody);
445
531
  if (targetRow) {
446
532
  var rect = targetRow.getBoundingClientRect();
447
533
  dragElement.style.height = rect.height + 'px';
@@ -486,9 +572,9 @@ function positionDragLine(_ref) {
486
572
  lineElement.style.display = 'block';
487
573
  }
488
574
  // 鼠标悬停所在的拖拽行信息
489
- var dragItem = getDragRowItem(event.target, tableContainer, dataSource);
575
+ var dragItem = getDragRowItem((0, _touchEventUtils.getEventTarget)(event), tableContainer, dataSource);
490
576
  if (!dragItem) {
491
- if (dataSource.length > 0 && tableContainer.contains(event.target)) {
577
+ if (dataSource.length > 0 && tableContainer.contains((0, _touchEventUtils.getEventTarget)(event))) {
492
578
  var _context5, _context6;
493
579
  var _rowIndex = dataSource.length - 1;
494
580
  var _row = dataSource[_rowIndex];
@@ -517,7 +603,7 @@ function positionDragLine(_ref) {
517
603
  rowIndex = dragItem.rowIndex,
518
604
  row = dragItem.row;
519
605
  var allowDragInto = isTreeTable && allowDragIntoRow;
520
- var direction = getDirection(cell, event.clientY, allowDragInto);
606
+ var direction = getDirection(cell, (0, _touchEventUtils.getEventCoordinates)(event).clientY, allowDragInto);
521
607
  var targetCell = isTreeTable ? tableContainer.querySelector((0, _concat.default)(_context7 = "tr[data-rowindex=\"".concat(rowIndex, "\"] .")).call(_context7, _styles.Classes.tableExtendCell)) : cell;
522
608
  if (!targetCell) return;
523
609
  var _getLinePosition2 = getLinePosition({
@@ -555,8 +641,9 @@ function positionDragElemment(element, event, isRTL) {
555
641
  var browserWidth = (_b = (_a = document.body) === null || _a === void 0 ? void 0 : _a.clientWidth) !== null && _b !== void 0 ? _b : window.innerHeight || ((_c = document.documentElement) === null || _c === void 0 ? void 0 : _c.clientWidth) || 0;
556
642
  var browserHeight = (_e = (_d = document.body) === null || _d === void 0 ? void 0 : _d.clientHeight) !== null && _e !== void 0 ? _e : window.innerHeight || ((_f = document.documentElement) === null || _f === void 0 ? void 0 : _f.clientHeight) || 0;
557
643
  var offsetParentSize = getElementRectWithOffset(element.offsetParent);
558
- var clientX = event.clientX,
559
- clientY = event.clientY;
644
+ var _getEventCoordinates = (0, _touchEventUtils.getEventCoordinates)(event),
645
+ clientX = _getEventCoordinates.clientX,
646
+ clientY = _getEventCoordinates.clientY;
560
647
  var top = clientY - offsetParentSize.top - eleHeight / 2;
561
648
  var left = clientX - offsetParentSize.left;
562
649
  var right = Math.max(browserWidth - clientX, 0);
@@ -572,12 +659,11 @@ function positionDragElemment(element, event, isRTL) {
572
659
  right = Math.max(browserWidth + windowScrollX - element.clientWidth, 0);
573
660
  }
574
661
  if (isRTL) {
575
- var _context8;
576
- element.style.cssText += (0, _concat.default)(_context8 = ";right: ".concat(right, "px; top: ")).call(_context8, top, "px;");
577
- return;
662
+ element.style.right = right + 'px';
663
+ } else {
664
+ element.style.left = left + 'px';
578
665
  }
579
- element.style.left = "".concat(left, "px");
580
- element.style.top = "".concat(top, "px");
666
+ element.style.top = top + 'px';
581
667
  }
582
668
  function getElementRectWithOffset(el) {
583
669
  var offsetElementRect = el.getBoundingClientRect();
@@ -644,12 +730,13 @@ function setDragElementIcon(element, iconName) {
644
730
  elementIcon.appendChild(iconElement);
645
731
  }
646
732
  function clearElementChildren(element) {
647
- while (element && element.firstChild) {
733
+ while (element === null || element === void 0 ? void 0 : element.firstChild) {
648
734
  element.removeChild(element.firstChild);
649
735
  }
650
736
  }
651
- function getScrollMoveOffset(tableBody, mouseMoveEvent) {
652
- var clientY = mouseMoveEvent.clientY;
737
+ function getScrollMoveOffset(tableBody, moveEvent) {
738
+ var _getEventCoordinates2 = (0, _touchEventUtils.getEventCoordinates)(moveEvent),
739
+ clientY = _getEventCoordinates2.clientY;
653
740
  var tableBodyClientRect = tableBody.getBoundingClientRect();
654
741
  var top = tableBodyClientRect.top,
655
742
  height = tableBodyClientRect.height;
@@ -667,15 +754,19 @@ function setDragText(element, dragText) {
667
754
  var stringNode = document.createTextNode(dragTextString);
668
755
  elementIcon.appendChild(stringNode);
669
756
  }
670
- function isMouseOnDropTarget(mouseEvent, target) {
671
- return target.contains(mouseEvent.target);
757
+ function isPointerOnDropTarget(pointerEvent, target) {
758
+ var eventTarget = (0, _touchEventUtils.getEventTarget)(pointerEvent);
759
+ return target.contains(eventTarget);
672
760
  }
673
761
  function createDropTargetEvent(dropZone, event, dragItem, startDropZone) {
674
762
  var dropZoneTarget = dropZone.getContainer();
675
763
  var startDropZoneTagret = startDropZone.getContainer();
676
764
  var rect = dropZoneTarget.getBoundingClientRect();
677
- var x = event.clientX - rect.left;
678
- var y = event.clientY - rect.top;
765
+ var _getEventCoordinates3 = (0, _touchEventUtils.getEventCoordinates)(event),
766
+ clientX = _getEventCoordinates3.clientX,
767
+ clientY = _getEventCoordinates3.clientY;
768
+ var x = clientX - rect.left;
769
+ var y = clientY - rect.top;
679
770
  var startDropZoneOptions = startDropZone.tableParams.getRowDragOptions();
680
771
  var startCommonParams = startDropZoneOptions === null || startDropZoneOptions === void 0 ? void 0 : startDropZoneOptions.commonParams;
681
772
  var targetEvent = {
@@ -732,10 +823,8 @@ var getLinePosition = function getLinePosition(_ref2) {
732
823
  paddingRight = _getElementSize3.paddingRight;
733
824
  var expandCellRect = cell.getBoundingClientRect();
734
825
  var _row$treeMetaKey2 = row[treeMetaKey],
735
- rowKey = _row$treeMetaKey2.rowKey,
736
826
  depth = _row$treeMetaKey2.depth,
737
- isLeaf = _row$treeMetaKey2.isLeaf,
738
- expanded = _row$treeMetaKey2.expanded;
827
+ isLeaf = _row$treeMetaKey2.isLeaf;
739
828
  var addWidth = isLeaf ? iconWidth + iconGap : 0;
740
829
  var indent = iconIndent + depth * indentSize + addWidth;
741
830
  var x = expandCellRect.x,
@@ -0,0 +1,15 @@
1
+ export declare function getEventCoordinates(event: MouseEvent | TouchEvent): {
2
+ clientX: number;
3
+ clientY: number;
4
+ };
5
+ export declare function getEventTarget(event: MouseEvent | TouchEvent): EventTarget;
6
+ export declare function isTouchEvent(event: MouseEvent | TouchEvent): event is TouchEvent;
7
+ export declare function addPointerEventListeners(element: Element | Window | Document, handlers: {
8
+ onPointerMove: (e: MouseEvent | TouchEvent) => void;
9
+ onPointerUp: (e: MouseEvent | TouchEvent) => void;
10
+ }, isTouchStart: boolean): void;
11
+ export declare function removePointerEventListeners(element: Element | Window | Document, handlers: {
12
+ onPointerMove: (e: MouseEvent | TouchEvent) => void;
13
+ onPointerUp: (e: MouseEvent | TouchEvent) => void;
14
+ }, isTouchStart: boolean): void;
15
+ export declare function hasMovedEnough(startX: number, startY: number, endX: number, endY: number, threshold?: number): boolean;
@@ -0,0 +1,76 @@
1
+ "use strict";
2
+
3
+ Object.defineProperty(exports, "__esModule", {
4
+ value: true
5
+ });
6
+ exports.addPointerEventListeners = addPointerEventListeners;
7
+ exports.getEventCoordinates = getEventCoordinates;
8
+ exports.getEventTarget = getEventTarget;
9
+ exports.hasMovedEnough = hasMovedEnough;
10
+ exports.isTouchEvent = isTouchEvent;
11
+ exports.removePointerEventListeners = removePointerEventListeners;
12
+ // 统一获取事件坐标的函数
13
+ function getEventCoordinates(event) {
14
+ if ('touches' in event && event.touches.length > 0) {
15
+ return {
16
+ clientX: event.touches[0].clientX,
17
+ clientY: event.touches[0].clientY
18
+ };
19
+ } else if ('changedTouches' in event && event.changedTouches.length > 0) {
20
+ return {
21
+ clientX: event.changedTouches[0].clientX,
22
+ clientY: event.changedTouches[0].clientY
23
+ };
24
+ } else {
25
+ return {
26
+ clientX: event.clientX,
27
+ clientY: event.clientY
28
+ };
29
+ }
30
+ }
31
+ // 获取事件目标元素
32
+ function getEventTarget(event) {
33
+ if ('touches' in event && event.touches.length > 0) {
34
+ return document.elementFromPoint(event.touches[0].clientX, event.touches[0].clientY);
35
+ }
36
+ // 处理touchend事件,此时touches为空,需要使用changedTouches
37
+ if ('changedTouches' in event && event.changedTouches.length > 0) {
38
+ return document.elementFromPoint(event.changedTouches[0].clientX, event.changedTouches[0].clientY);
39
+ }
40
+ return event.target;
41
+ }
42
+ // 判断是否为触摸事件
43
+ function isTouchEvent(event) {
44
+ return 'touches' in event;
45
+ }
46
+ // 为元素添加统一的指针事件监听器
47
+ function addPointerEventListeners(element, handlers, isTouchStart) {
48
+ if (isTouchStart) {
49
+ element.addEventListener('touchmove', handlers.onPointerMove, {
50
+ passive: false
51
+ });
52
+ element.addEventListener('touchend', handlers.onPointerUp, {
53
+ passive: false
54
+ });
55
+ } else {
56
+ element.addEventListener('mousemove', handlers.onPointerMove);
57
+ element.addEventListener('mouseup', handlers.onPointerUp);
58
+ }
59
+ }
60
+ // 移除统一的指针事件监听器
61
+ function removePointerEventListeners(element, handlers, isTouchStart) {
62
+ if (isTouchStart) {
63
+ element.removeEventListener('touchmove', handlers.onPointerMove);
64
+ element.removeEventListener('touchend', handlers.onPointerUp);
65
+ } else {
66
+ element.removeEventListener('mousemove', handlers.onPointerMove);
67
+ element.removeEventListener('mouseup', handlers.onPointerUp);
68
+ }
69
+ }
70
+ // 检查是否移动了足够的距离(用于区分点击和拖拽)
71
+ function hasMovedEnough(startX, startY, endX, endY) {
72
+ var threshold = arguments.length > 4 && arguments[4] !== undefined ? arguments[4] : 5;
73
+ var xDiff = endX - startX;
74
+ var yDiff = endY - startY;
75
+ return Math.sqrt(xDiff * xDiff + yDiff * yDiff) > threshold;
76
+ }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@kdcloudjs/table",
3
- "version": "1.2.2-canary.13",
3
+ "version": "1.2.2-canary.14",
4
4
  "description": "金蝶 react table 组件",
5
5
  "title": "table",
6
6
  "keywords": [