@kdcloudjs/table 1.2.1-canary.4 → 1.2.1-canary.5

package/es/table/pipeline/features/rowDrag.js

@@ -3,7 +3,7 @@ import _sliceInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instan
 import _concatInstanceProperty from "@babel/runtime-corejs3/core-js-stable/instance/concat";
 import React from 'react';
 import { fromEvent } from 'rxjs';
-import { map, takeUntil } from 'rxjs/operators';
+import { map, takeUntil, filter } from 'rxjs/operators';
 import cx from 'classnames';
 import { Classes } from '../../base/styles';
 export var ROW_DRAG_COLUMN_CODE = '$_row_drag_column_&';
@@ -60,13 +60,13 @@ export function rowDrag(opt) {
       pipeline.setStateAtKey(rowDragKey, event);
     };
 
-    var handleDragEnd = function handleDragEnd(event, isOutOfRange) {
+    var handleDragEnd = function handleDragEnd(event, isValid) {
       var _a;
 
       artTable.classList.remove(cx(Classes.rowDragging));
       pipeline.setStateAtKey(rowDragKey, event); // 超出拖拽范围不触发dragend事件
 
-      if (!isOutOfRange) {
+      if (isValid) {
         (_a = opt === null || opt === void 0 ? void 0 : opt.onDragEnd) === null || _a === void 0 ? void 0 : _a.call(opt, event);
       }
     };
@@ -111,6 +111,7 @@ export function rowDrag(opt) {
 
       var dragPosition = 'bottom';
       var isOutOfRange = false;
+      var isValidDrag = false;
       var dragStartEvent = getDragEvent(startRowInfo, endRowInfo, {
         isFinished: false,
         dragPosition: 'bottom'
@@ -119,6 +120,7 @@ export function rowDrag(opt) {
       var tableWidth = tableBody.clientWidth;
       var startRowRects = startRowInfo.cell.getBoundingClientRect(); // 光标位置距离初始拖拽行的偏移量
 
+      var mouseDownClientY = mouseDownEvent.clientY;
       var startOffset = mouseDownEvent.clientY - startRowRects.top;
       var dragElement = createDragElement(startRowRects, tableWidth, rowHeight); // 可拖拽的范围
 
@@ -145,7 +147,15 @@ export function rowDrag(opt) {
       };
 
       document.addEventListener('scroll', scrollCallback, true);
-      var rowDrag$ = mousemove$.pipe(map(function (mouseMoveEvent) {
+      var rowDrag$ = mousemove$.pipe(filter(function (mouseMoveEvent) {
+        var mouseMoveClientY = mouseMoveEvent.clientY; // 上下移动偏移量大于5才是有效的拖拽
+
+        if (Math.abs(mouseMoveClientY - mouseDownClientY) > 5) {
+          isValidDrag = true;
+        }
+
+        return isValidDrag;
+      }), map(function (mouseMoveEvent) {
         var clientX = mouseMoveEvent.clientX,
             clientY = mouseMoveEvent.clientY;
         var tagretRow = getTargetRowInfo(mouseMoveEvent.target, tableBody, dataSource);
@@ -196,7 +206,8 @@ export function rowDrag(opt) {
             isFinished: true,
             dragPosition: dragPosition
           });
-          handleDragEnd(dragEndEvent, isOutOfRange);
+          var isValid = isValidDrag && !isOutOfRange;
+          handleDragEnd(dragEndEvent, isValid);
           removeDragElement(dragElement);
           removeCurSorStyle();
           document.removeEventListener('scroll', scrollCallback, true);

package/lib/table/pipeline/features/rowDrag.js

@@ -1,5 +1,7 @@
 "use strict";
 
+var _filterInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/filter");
+
 var _mapInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/map");
 
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
@@ -84,13 +86,13 @@ function rowDrag(opt) {
       pipeline.setStateAtKey(rowDragKey, event);
     };
 
-    var handleDragEnd = function handleDragEnd(event, isOutOfRange) {
+    var handleDragEnd = function handleDragEnd(event, isValid) {
       var _a;
 
       artTable.classList.remove((0, _classnames.default)(_styles.Classes.rowDragging));
       pipeline.setStateAtKey(rowDragKey, event); // 超出拖拽范围不触发dragend事件
 
-      if (!isOutOfRange) {
+      if (isValid) {
         (_a = opt === null || opt === void 0 ? void 0 : opt.onDragEnd) === null || _a === void 0 ? void 0 : _a.call(opt, event);
       }
     };
@@ -135,6 +137,7 @@ function rowDrag(opt) {
 
       var dragPosition = 'bottom';
       var isOutOfRange = false;
+      var isValidDrag = false;
       var dragStartEvent = getDragEvent(startRowInfo, endRowInfo, {
         isFinished: false,
         dragPosition: 'bottom'
@@ -143,6 +146,7 @@ function rowDrag(opt) {
       var tableWidth = tableBody.clientWidth;
       var startRowRects = startRowInfo.cell.getBoundingClientRect(); // 光标位置距离初始拖拽行的偏移量
 
+      var mouseDownClientY = mouseDownEvent.clientY;
       var startOffset = mouseDownEvent.clientY - startRowRects.top;
       var dragElement = createDragElement(startRowRects, tableWidth, rowHeight); // 可拖拽的范围
 
@@ -169,7 +173,15 @@ function rowDrag(opt) {
       };
 
       document.addEventListener('scroll', scrollCallback, true);
-      var rowDrag$ = mousemove$.pipe((0, _mapInstanceProperty(_operators))(function (mouseMoveEvent) {
+      var rowDrag$ = mousemove$.pipe((0, _filterInstanceProperty(_operators))(function (mouseMoveEvent) {
+        var mouseMoveClientY = mouseMoveEvent.clientY; // 上下移动偏移量大于5才是有效的拖拽
+
+        if (Math.abs(mouseMoveClientY - mouseDownClientY) > 5) {
+          isValidDrag = true;
+        }
+
+        return isValidDrag;
+      }), (0, _mapInstanceProperty(_operators))(function (mouseMoveEvent) {
         var clientX = mouseMoveEvent.clientX,
             clientY = mouseMoveEvent.clientY;
         var tagretRow = getTargetRowInfo(mouseMoveEvent.target, tableBody, dataSource);
@@ -220,7 +232,8 @@ function rowDrag(opt) {
             isFinished: true,
             dragPosition: dragPosition
           });
-          handleDragEnd(dragEndEvent, isOutOfRange);
+          var isValid = isValidDrag && !isOutOfRange;
+          handleDragEnd(dragEndEvent, isValid);
           removeDragElement(dragElement);
           removeCurSorStyle();
           document.removeEventListener('scroll', scrollCallback, true);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kdcloudjs/table",
-  "version": "1.2.1-canary.4",
+  "version": "1.2.1-canary.5",
   "description": "金蝶 react table 组件",
   "title": "table",
   "keywords": [