@kdcloudjs/table 1.2.2-canary.5 → 1.2.2-canary.6
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/@kdcloudjs/table.css +1 -1
- package/dist/@kdcloudjs/table.js +104 -53
- package/dist/@kdcloudjs/table.js.map +1 -1
- package/dist/@kdcloudjs/table.min.css +1 -1
- package/dist/@kdcloudjs/table.min.js +6 -6
- package/dist/@kdcloudjs/table.min.js.map +1 -1
- package/es/table/pipeline/features/rowDrag.js +105 -54
- package/lib/table/pipeline/features/rowDrag.js +105 -54
- package/package.json +1 -1
package/dist/@kdcloudjs/table.js
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
/*!
|
|
2
2
|
*
|
|
3
|
-
* @kdcloudjs/table v1.2.2-canary.
|
|
3
|
+
* @kdcloudjs/table v1.2.2-canary.5
|
|
4
4
|
*
|
|
5
5
|
* Copyright 2020-present, Kingdee, Inc.
|
|
6
6
|
* All rights reserved.
|
|
@@ -8862,7 +8862,7 @@ function rowDrag(opt) {
|
|
|
8862
8862
|
direction = getDirection(cell, event.clientY, allowDragIntoRow);
|
|
8863
8863
|
}
|
|
8864
8864
|
}
|
|
8865
|
-
if (overIndex === -1 && dataSource.length > 0 && event.target
|
|
8865
|
+
if (overIndex === -1 && dataSource.length > 0 && dropZoneTarget.contains(event.target)) {
|
|
8866
8866
|
overIndex = dataSource.length - 1;
|
|
8867
8867
|
direction = 'bottom';
|
|
8868
8868
|
}
|
|
@@ -9226,6 +9226,9 @@ function positionDragLine(_ref) {
|
|
|
9226
9226
|
var treeModeOptions = getTreeModeOptions();
|
|
9227
9227
|
var rowDragOptions = getRowDragOptions() || {};
|
|
9228
9228
|
var allowDragIntoRow = rowDragOptions.allowDragIntoRow;
|
|
9229
|
+
var isTreeTable = !!treeModeOptions;
|
|
9230
|
+
var bodyRect = tableContainer.getBoundingClientRect();
|
|
9231
|
+
var offsetParentSize = getElementRectWithOffset(document.body);
|
|
9229
9232
|
if (dataSource.length === 0) {
|
|
9230
9233
|
tableContainer.classList.add(_base_styles__WEBPACK_IMPORTED_MODULE_12__["Classes"].rowDragNoData);
|
|
9231
9234
|
lineElement.style.display = 'none';
|
|
@@ -9235,59 +9238,56 @@ function positionDragLine(_ref) {
|
|
|
9235
9238
|
}
|
|
9236
9239
|
// 鼠标悬停所在的拖拽行信息
|
|
9237
9240
|
var dragItem = getDragRowItem(event.target, tableContainer, dataSource);
|
|
9238
|
-
if (!dragItem)
|
|
9241
|
+
if (!dragItem) {
|
|
9242
|
+
if (dataSource.length > 0 && tableContainer.contains(event.target)) {
|
|
9243
|
+
var _rowIndex = dataSource.length - 1;
|
|
9244
|
+
var _row = dataSource[_rowIndex];
|
|
9245
|
+
var _direction = 'bottom';
|
|
9246
|
+
var _targetCell = isTreeTable ? tableContainer.querySelector("tr[data-rowindex=\"".concat(_rowIndex, "\"] .").concat(_base_styles__WEBPACK_IMPORTED_MODULE_12__["Classes"].tableExtendCell)) : tableContainer.querySelector("tr[data-rowindex=\"".concat(_rowIndex, "\"] .").concat(_base_styles__WEBPACK_IMPORTED_MODULE_12__["Classes"].rowDragCell));
|
|
9247
|
+
if (!_targetCell) return;
|
|
9248
|
+
var _getLinePosition = getLinePosition({
|
|
9249
|
+
treeModeOptions: treeModeOptions,
|
|
9250
|
+
cell: _targetCell,
|
|
9251
|
+
row: _row,
|
|
9252
|
+
direction: _direction,
|
|
9253
|
+
offsetParentSize: offsetParentSize,
|
|
9254
|
+
bodyRect: bodyRect
|
|
9255
|
+
}),
|
|
9256
|
+
_top = _getLinePosition.top,
|
|
9257
|
+
_left = _getLinePosition.left,
|
|
9258
|
+
_width = _getLinePosition.width;
|
|
9259
|
+
lineElement.style.left = "".concat(_left, "px");
|
|
9260
|
+
lineElement.style.top = "".concat(_top, "px");
|
|
9261
|
+
lineElement.style.width = "".concat(_width, "px");
|
|
9262
|
+
}
|
|
9263
|
+
return;
|
|
9264
|
+
}
|
|
9239
9265
|
var cell = dragItem.cell,
|
|
9240
9266
|
rowIndex = dragItem.rowIndex,
|
|
9241
9267
|
row = dragItem.row;
|
|
9242
|
-
var bodyRect = tableContainer.getBoundingClientRect();
|
|
9243
|
-
var offsetParentSize = getElementRectWithOffset(document.body);
|
|
9244
|
-
var isTreeTable = !!treeModeOptions;
|
|
9245
9268
|
var allowDragInto = isTreeTable && allowDragIntoRow;
|
|
9246
9269
|
var direction = getDirection(cell, event.clientY, allowDragInto);
|
|
9247
|
-
|
|
9248
|
-
|
|
9249
|
-
|
|
9250
|
-
|
|
9251
|
-
|
|
9252
|
-
|
|
9253
|
-
|
|
9254
|
-
|
|
9255
|
-
|
|
9256
|
-
|
|
9257
|
-
|
|
9258
|
-
|
|
9259
|
-
|
|
9260
|
-
depth = _row$treeMetaKey.depth,
|
|
9261
|
-
isLeaf = _row$treeMetaKey.isLeaf,
|
|
9262
|
-
expanded = _row$treeMetaKey.expanded;
|
|
9263
|
-
var addWidth = isLeaf ? iconWidth + iconGap : 0;
|
|
9264
|
-
var indent = iconIndent + depth * indentSize + addWidth;
|
|
9265
|
-
var x = expandCellRect.x,
|
|
9266
|
-
_y = expandCellRect.y,
|
|
9267
|
-
_height = expandCellRect.height;
|
|
9268
|
-
var _top = direction === 'bottom' ? _y + _height - offsetParentSize.top : _y - offsetParentSize.top;
|
|
9269
|
-
var offsetX = Math.max(x + paddingLeft + indent - bodyRect.x, 0);
|
|
9270
|
-
var _left = bodyRect.x + offsetX - offsetParentSize.left;
|
|
9271
|
-
lineElement.style.left = "".concat(_left, "px");
|
|
9272
|
-
lineElement.style.top = "".concat(_top, "px");
|
|
9273
|
-
lineElement.style.width = "".concat(bodyRect.width - offsetX, "px");
|
|
9274
|
-
if (direction === 'into') {
|
|
9275
|
-
lineElement.style.display = 'none';
|
|
9276
|
-
} else {
|
|
9277
|
-
lineElement.style.display = 'block';
|
|
9278
|
-
}
|
|
9279
|
-
return;
|
|
9280
|
-
}
|
|
9281
|
-
}
|
|
9282
|
-
// 根据鼠标悬停位置所在单元格和显示位置计算拖拽线的位置
|
|
9283
|
-
var rect = cell.getBoundingClientRect();
|
|
9284
|
-
var y = rect.y,
|
|
9285
|
-
height = rect.height;
|
|
9286
|
-
var top = direction === 'bottom' ? y + height - offsetParentSize.top : y - offsetParentSize.top;
|
|
9287
|
-
var left = bodyRect.x - offsetParentSize.left;
|
|
9270
|
+
var targetCell = isTreeTable ? tableContainer.querySelector("tr[data-rowindex=\"".concat(rowIndex, "\"] .").concat(_base_styles__WEBPACK_IMPORTED_MODULE_12__["Classes"].tableExtendCell)) : cell;
|
|
9271
|
+
if (!targetCell) return;
|
|
9272
|
+
var _getLinePosition2 = getLinePosition({
|
|
9273
|
+
treeModeOptions: treeModeOptions,
|
|
9274
|
+
cell: targetCell,
|
|
9275
|
+
row: row,
|
|
9276
|
+
direction: direction,
|
|
9277
|
+
offsetParentSize: offsetParentSize,
|
|
9278
|
+
bodyRect: bodyRect
|
|
9279
|
+
}),
|
|
9280
|
+
top = _getLinePosition2.top,
|
|
9281
|
+
left = _getLinePosition2.left,
|
|
9282
|
+
width = _getLinePosition2.width;
|
|
9288
9283
|
lineElement.style.left = "".concat(left, "px");
|
|
9289
9284
|
lineElement.style.top = "".concat(top, "px");
|
|
9290
|
-
lineElement.style.width = "".concat(
|
|
9285
|
+
lineElement.style.width = "".concat(width, "px");
|
|
9286
|
+
if (direction === 'into') {
|
|
9287
|
+
lineElement.style.display = 'none';
|
|
9288
|
+
} else {
|
|
9289
|
+
lineElement.style.display = 'block';
|
|
9290
|
+
}
|
|
9291
9291
|
}
|
|
9292
9292
|
function showDragLine(lineElement) {
|
|
9293
9293
|
lineElement.style.display = 'block';
|
|
@@ -9320,11 +9320,11 @@ function positionDragElemment(element, event) {
|
|
|
9320
9320
|
}
|
|
9321
9321
|
function getElementRectWithOffset(el) {
|
|
9322
9322
|
var offsetElementRect = el.getBoundingClientRect();
|
|
9323
|
-
var
|
|
9324
|
-
borderTopWidth =
|
|
9325
|
-
borderLeftWidth =
|
|
9326
|
-
borderRightWidth =
|
|
9327
|
-
borderBottomWidth =
|
|
9323
|
+
var _getElementSize2 = _getElementSize(el),
|
|
9324
|
+
borderTopWidth = _getElementSize2.borderTopWidth,
|
|
9325
|
+
borderLeftWidth = _getElementSize2.borderLeftWidth,
|
|
9326
|
+
borderRightWidth = _getElementSize2.borderRightWidth,
|
|
9327
|
+
borderBottomWidth = _getElementSize2.borderBottomWidth;
|
|
9328
9328
|
return {
|
|
9329
9329
|
top: offsetElementRect.top + (borderTopWidth || 0),
|
|
9330
9330
|
left: offsetElementRect.left + (borderLeftWidth || 0),
|
|
@@ -9451,6 +9451,57 @@ function getDirection(cell, clientY) {
|
|
|
9451
9451
|
}
|
|
9452
9452
|
return direction;
|
|
9453
9453
|
}
|
|
9454
|
+
var getLinePosition = function getLinePosition(_ref2) {
|
|
9455
|
+
var treeModeOptions = _ref2.treeModeOptions,
|
|
9456
|
+
cell = _ref2.cell,
|
|
9457
|
+
row = _ref2.row,
|
|
9458
|
+
direction = _ref2.direction,
|
|
9459
|
+
offsetParentSize = _ref2.offsetParentSize,
|
|
9460
|
+
bodyRect = _ref2.bodyRect;
|
|
9461
|
+
var isTreeTable = !!treeModeOptions;
|
|
9462
|
+
if (isTreeTable) {
|
|
9463
|
+
var iconWidth = treeModeOptions.iconWidth,
|
|
9464
|
+
iconIndent = treeModeOptions.iconIndent,
|
|
9465
|
+
iconGap = treeModeOptions.iconGap,
|
|
9466
|
+
indentSize = treeModeOptions.indentSize,
|
|
9467
|
+
treeMetaKey = treeModeOptions.treeMetaKey;
|
|
9468
|
+
var _getElementSize3 = _getElementSize(cell),
|
|
9469
|
+
paddingLeft = _getElementSize3.paddingLeft;
|
|
9470
|
+
var expandCellRect = cell.getBoundingClientRect();
|
|
9471
|
+
var _row$treeMetaKey = row[treeMetaKey],
|
|
9472
|
+
rowKey = _row$treeMetaKey.rowKey,
|
|
9473
|
+
depth = _row$treeMetaKey.depth,
|
|
9474
|
+
isLeaf = _row$treeMetaKey.isLeaf,
|
|
9475
|
+
expanded = _row$treeMetaKey.expanded;
|
|
9476
|
+
var addWidth = isLeaf ? iconWidth + iconGap : 0;
|
|
9477
|
+
var indent = iconIndent + depth * indentSize + addWidth;
|
|
9478
|
+
var x = expandCellRect.x,
|
|
9479
|
+
_y = expandCellRect.y,
|
|
9480
|
+
_height = expandCellRect.height;
|
|
9481
|
+
var _top2 = direction === 'bottom' ? _y + _height - offsetParentSize.top : _y - offsetParentSize.top;
|
|
9482
|
+
var offsetX = Math.max(x + paddingLeft + indent - bodyRect.x, 0);
|
|
9483
|
+
var _left2 = bodyRect.x + offsetX - offsetParentSize.left;
|
|
9484
|
+
var _width2 = bodyRect.width - offsetX;
|
|
9485
|
+
return {
|
|
9486
|
+
top: _top2,
|
|
9487
|
+
left: _left2,
|
|
9488
|
+
width: _width2
|
|
9489
|
+
};
|
|
9490
|
+
}
|
|
9491
|
+
|
|
9492
|
+
// 根据鼠标悬停位置所在单元格和显示位置计算拖拽线的位置
|
|
9493
|
+
var rect = cell.getBoundingClientRect();
|
|
9494
|
+
var y = rect.y,
|
|
9495
|
+
height = rect.height;
|
|
9496
|
+
var top = direction === 'bottom' ? y + height - offsetParentSize.top : y - offsetParentSize.top;
|
|
9497
|
+
var left = bodyRect.x - offsetParentSize.left;
|
|
9498
|
+
var width = bodyRect.width;
|
|
9499
|
+
return {
|
|
9500
|
+
top: top,
|
|
9501
|
+
left: left,
|
|
9502
|
+
width: width
|
|
9503
|
+
};
|
|
9504
|
+
};
|
|
9454
9505
|
|
|
9455
9506
|
/***/ }),
|
|
9456
9507
|
|