feat: 支持表头自定义mouseDown事件

.gitignore

@@ -41,3 +41,6 @@ coverage
 package-lock.json
 demo/.DS_Store
 demo/demolist/.DS_Store
+
+# vsCode
+.history

build/Table.js

@@ -638,7 +638,8 @@ var Table = function (_Component) {
         bordered = _props2.bordered,
         onDropBorder = _props2.onDropBorder,
         onDraggingBorder = _props2.onDraggingBorder,
-        bodyDisplayInRow = _props2.bodyDisplayInRow;
+        bodyDisplayInRow = _props2.bodyDisplayInRow,
+        headerEventNoStop = _props2.headerEventNoStop;
 
     this.columnsChildrenList = []; //复杂表头拖拽，重新render表头前，将其置空
     var rows = this.getHeaderRows(columns);
@@ -686,7 +687,8 @@ var Table = function (_Component) {
       bordered: bordered,
       leftFixedWidth: leftFixedWidth,
       rightFixedWidth: rightFixedWidth,
-      bodyDisplayInRow: bodyDisplayInRow
+      bodyDisplayInRow: bodyDisplayInRow,
+      eventNoStop: headerEventNoStop
     })) : null;
   };
 
@@ -972,7 +974,7 @@ var Table = function (_Component) {
         indent: indent,
         indentSize: props.indentSize,
         needIndentSpaced: needIndentSpaced,
-        className: className + ' ' + (props.rowDraggAble && !props.useDragHandle ? 'row-dragg-able ' : ''),
+        className: '' + className,
         record: record,
         expandIconAsCell: expandIconAsCell,
         onDestroy: this.onRowDestroy,

build/TableCell.js

@@ -271,6 +271,12 @@ var TableCell = function (_Component) {
       onPaste(e, position);
     };
 
+    _this.onCellMouseOver = function (e) {
+      var column = _this.props.column;
+
+      _this.props.stopRowDrag(column.notRowDrag);
+    };
+
     _this.isInvalidRenderCellText = _this.isInvalidRenderCellText.bind(_this);
     _this.handleClick = _this.handleClick.bind(_this);
     _this.state = {
@@ -461,6 +467,7 @@ var TableCell = function (_Component) {
         onClick: this.handleClick,
         title: title,
         onPaste: this.onPaste,
+        onMouseOver: this.onCellMouseOver,
         style: _extends({ maxWidth: column.width, color: fontColor, backgroundColor: bgColor }, column.style) },
       indentText,
       expandIcon,

build/TableHeader.js

@@ -569,7 +569,9 @@ var _initialiseProps = function _initialiseProps() {
   };
 
   this.onTrMouseDown = function (e) {
-    _utils.Event.stopPropagation(e);
+    var eventNoStop = _this8.props.eventNoStop;
+
+    !eventNoStop && _utils.Event.stopPropagation(e);
     var event = _utils.Event.getEvent(e),
         targetEvent = _utils.Event.getTarget(event);
     var _props3 = _this8.props,
@@ -668,9 +670,10 @@ var _initialiseProps = function _initialiseProps() {
         onDraggingBorder = _props4.onDraggingBorder,
         leftFixedWidth = _props4.leftFixedWidth,
         rightFixedWidth = _props4.rightFixedWidth,
-        bodyDisplayInRow = _props4.bodyDisplayInRow;
+        bodyDisplayInRow = _props4.bodyDisplayInRow,
+        eventNoStop = _props4.eventNoStop;
 
-    _utils.Event.stopPropagation(e);
+    !eventNoStop && _utils.Event.stopPropagation(e);
     var event = _utils.Event.getEvent(e);
     if (_this8.props.dragborder && _this8.drag.option == "border") {
       //移动改变宽度

build/TableRow.js

@@ -115,7 +115,7 @@ var TableRow = function (_Component) {
     _this.onDragStart = function (e) {
       var onDragRowStart = _this.props.onDragRowStart;
 
-      if (!_this.props.rowDraggAble) return;
+      if (!_this.props.rowDraggAble || _this.notRowDrag) return;
       var event = _utils.Event.getEvent(e),
           target = _utils.Event.getTarget(event);
       if (target.tagName === 'TD') {
@@ -305,6 +305,17 @@ var TableRow = function (_Component) {
       }
     };
 
+    _this.stopRowDrag = function (isStop) {
+      var rowDraggAble = _this.props.rowDraggAble;
+      var notRowDrag = _this.state.notRowDrag;
+
+      if (rowDraggAble && isStop !== notRowDrag) {
+        _this.setState({
+          notRowDrag: isStop
+        });
+      }
+    };
+
     _this.set = function (fn) {
       _this.clear();
       _this._timeout = window.setTimeout(fn, 300);
@@ -576,6 +587,7 @@ var TableRow = function (_Component) {
         lazyStartIndex = _props10.lazyStartIndex,
         lazyEndIndex = _props10.lazyEndIndex,
         expandIconCellWidth = _props10.expandIconCellWidth;
+    var notRowDrag = this.state.notRowDrag;
 
     var showSum = false;
     var className = this.props.className;
@@ -636,6 +648,7 @@ var TableRow = function (_Component) {
         lazyStartIndex: lazyStartIndex,
         lazyEndIndex: lazyEndIndex,
         onPaste: onPaste,
+        stopRowDrag: this.stopRowDrag,
         col: i
       }));
     }
@@ -646,10 +659,15 @@ var TableRow = function (_Component) {
     if (record && record._checked) {
       className += ' selected';
     }
+
+    if (rowDraggAble && !useDragHandle && !notRowDrag) {
+      className += ' row-dragg-able';
+    }
+
     return _react2["default"].createElement(
       'tr',
       {
-        draggable: rowDraggAble && !useDragHandle,
+        draggable: rowDraggAble && !useDragHandle && !notRowDrag,
         onClick: this.onRowClick,
         onDoubleClick: this.onRowDoubleClick,
         onMouseEnter: this.onMouseEnter,

src/Table.js

@@ -436,7 +436,7 @@ class Table extends Component {
   getHeader(columns, fixed, leftFixedWidth, rightFixedWidth) {
     const { lastShowIndex } = this.state;
     const { filterDelay, onFilterChange, onFilterClear, filterable, showHeader, expandIconAsCell, clsPrefix, onDragStart, onDragEnter, onDragOver, onDrop,onDragEnd, draggable,
-      onMouseDown, onMouseMove, onMouseUp, dragborder, onThMouseMove, dragborderKey, minColumnWidth, headerHeight,afterDragColWidth,headerScroll ,bordered,onDropBorder,onDraggingBorder, bodyDisplayInRow} = this.props;
+      onMouseDown, onMouseMove, onMouseUp, dragborder, onThMouseMove, dragborderKey, minColumnWidth, headerHeight,afterDragColWidth,headerScroll ,bordered,onDropBorder,onDraggingBorder, bodyDisplayInRow, headerEventNoStop} = this.props;
     this.columnsChildrenList = []; //复杂表头拖拽，重新render表头前，将其置空
     const rows = this.getHeaderRows(columns);
     if (expandIconAsCell && fixed !== 'right') {
@@ -487,6 +487,7 @@ class Table extends Component {
         leftFixedWidth = {leftFixedWidth}
         rightFixedWidth = {rightFixedWidth}
         bodyDisplayInRow = {bodyDisplayInRow}
+        eventNoStop = {headerEventNoStop}
       />
     ) : null;
   }

src/TableHeader.js

@@ -245,7 +245,8 @@ class TableHeader extends Component {
    * @memberof TableHeader
    */
   onTrMouseDown = (e) => {
-    Event.stopPropagation(e);
+    const { eventNoStop } = this.props;
+    !eventNoStop && Event.stopPropagation(e);
     let event = Event.getEvent(e) ,
     targetEvent = Event.getTarget(event);
     const { clsPrefix, contentTable,lastShowIndex,columnsChildrenList } = this.props;
@@ -337,8 +338,8 @@ class TableHeader extends Component {
    */
   onTrMouseMove = (e) => {
     if(!this.props.dragborder && !this.props.draggable)return;
-    const { clsPrefix ,dragborder,contentDomWidth,scrollbarWidth,contentTable,headerScroll,lastShowIndex,onDraggingBorder, leftFixedWidth, rightFixedWidth, bodyDisplayInRow} = this.props;
+    const { clsPrefix ,dragborder,contentDomWidth,scrollbarWidth,contentTable,headerScroll,lastShowIndex,onDraggingBorder, leftFixedWidth, rightFixedWidth, bodyDisplayInRow, eventNoStop} = this.props;
-    Event.stopPropagation(e);
+    !eventNoStop && Event.stopPropagation(e);
     let event = Event.getEvent(e);
     if(this.props.dragborder && this.drag.option == "border"){
       //移动改变宽度