@kdcloudjs/table 1.0.0 → 1.0.3

package/lib/table/common-views.js

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequ
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.ContextMenuStyleWrap = exports.icons = exports.ExpansionCell = exports.InlineFlexCell = void 0;
+exports.icons = exports.InlineFlexCell = exports.ExpansionCell = exports.ContextMenuStyleWrap = void 0;
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 
@@ -22,7 +22,7 @@ var _templateObject, _templateObject2, _templateObject3;
 var InlineFlexCell = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-flex;\n  align-items: center;\n"])));
 
 exports.InlineFlexCell = InlineFlexCell;
-var ExpansionCell = (0, _styledComponents.default)(InlineFlexCell)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  &.leaf {\n    cursor: default;\n  }\n\n  .expansion-icon {\n    fill: #999;\n    flex: 0 0 16px;\n    transition: transform 200ms;\n\n    &.expanded {\n      transform-origin: center center;\n      transform: rotate(90deg);\n    }\n  }\n"])));
+var ExpansionCell = (0, _styledComponents.default)(InlineFlexCell)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  &.", " {\n    cursor: default;\n  }\n\n  .expansion-icon {\n    fill: #999;\n    flex: 0 0 16px;\n    transition: transform 200ms;\n\n    &.", " {\n      transform-origin: center center;\n      transform: rotate(90deg);\n    }\n  }\n"])), _styles.Classes.leaf, _styles.Classes.expanded);
 exports.ExpansionCell = ExpansionCell;
 
 function CaretDownIcon(props) {
@@ -85,6 +85,6 @@ var icons = {
 };
 exports.icons = icons;
 
-var ContextMenuStyleWrap = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  &.", "{\n    border: 1px solid #e9ecf1;\n    border-radius: 2px;\n    background-color: #Fff;\n    box-shadow: 0px 0px 5px 0px rgb(154 154 154 / 50%);\n    cursor: default;\n    font-size: 13px;\n    position:absolute;\n    z-index: 1050;\n    width:120px;\n  }\n\n  .", "{\n    width:100%;\n    display: table;\n  }\n\n  .", " .", "{\n    display: table-row;\n  }\n\n  .", " .", "{\n    background-color: #f5f5f5;\n  }\n\n  .", " .", " .", "{\n    display: table-cell;\n    padding: 5px 8px;\n    color: #666666;\n  }\n\n"])), _styles.MenuClasses.menu, _styles.MenuClasses.menuList, _styles.MenuClasses.menuList, _styles.MenuClasses.menuOption, _styles.MenuClasses.menuList, _styles.MenuClasses.menuOptionActive, _styles.MenuClasses.menuList, _styles.MenuClasses.menuOption, _styles.MenuClasses.menuOptionText);
+var ContextMenuStyleWrap = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  &.", "{\n    border: 1px solid #e9ecf1;\n    border-radius: 2px;\n    background-color: #Fff;\n    box-shadow: 0px 0px 5px 0px rgb(154 154 154 / 50%);\n    cursor: default;\n    font-size: 13px;\n    position:absolute;\n    z-index: 1050;\n    width:120px;\n  }\n\n  .", "{\n    width:100%;\n    display: table;\n  }\n\n  .", " .", "{\n    display: table-row;\n    color: #666666;\n  }\n\n  .", " .", "{\n    background-color: #f5f5f5;\n  }\n\n  .", " .", " .", "{\n    display: table-cell;\n    padding: 5px 8px;\n  }\n  .", " .", ".", "{\n    opacity: .5;\n  }\n\n"])), _styles.MenuClasses.menu, _styles.MenuClasses.menuList, _styles.MenuClasses.menuList, _styles.MenuClasses.menuOption, _styles.MenuClasses.menuList, _styles.MenuClasses.menuOptionActive, _styles.MenuClasses.menuList, _styles.MenuClasses.menuOption, _styles.MenuClasses.menuOptionText, _styles.MenuClasses.menuList, _styles.MenuClasses.menuOption, _styles.MenuClasses.menuOptionDisable);
 
 exports.ContextMenuStyleWrap = ContextMenuStyleWrap;

package/lib/table/pipeline/features/__test__/sort.test.js

@@ -1,5 +1,7 @@
 "use strict";
 
+var _sortInstanceProperty = require("@babel/runtime-corejs3/core-js-stable/instance/sort");
+
 var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
 
 var _find = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find"));
@@ -111,7 +113,7 @@ describe('sort 单元测试', function () {
         result = _renderHook.result;
 
     var tablePipeline = result.current;
-    newPipeline = (0, _sort.sort)(opts)(tablePipeline);
+    newPipeline = (0, _sortInstanceProperty(_sort))(opts)(tablePipeline);
   });
   afterEach(function () {
     newPipeline = null;
@@ -164,7 +166,7 @@ describe('sort 单元测试', function () {
 
     var tablePipeline = result.current;
     opts.keepDataSource = true;
-    var newPipeline = (0, _sort.sort)(opts)(tablePipeline);
+    var newPipeline = (0, _sortInstanceProperty(_sort))(opts)(tablePipeline);
     expect(newPipeline.getDataSource()[0].id).toBe('1');
     opts.keepDataSource = false;
   });
@@ -188,7 +190,7 @@ describe('sort 单元测试', function () {
       order: 'asc'
     }];
     opts.mode = 'multiple';
-    var newPipeline = (0, _sort.sort)(opts)(tablePipeline); // confirm 降序，cure升序
+    var newPipeline = (0, _sortInstanceProperty(_sort))(opts)(tablePipeline); // confirm 降序，cure升序
 
     expect(newPipeline.getDataSource()[3].confirm).toBe(1000);
     expect(newPipeline.getDataSource()[3].cure).toBe(417);

package/lib/table/pipeline/features/__test__/treeMode.test.js

@@ -12,6 +12,8 @@ var _enzyme = require("enzyme");
 
 var _reactHooks = require("@testing-library/react-hooks");
 
+var _styles = require("../../../base/styles");
+
 function makeChildren(prefix) {
   return [{
     id: "".concat(prefix, "-1"),
@@ -164,7 +166,7 @@ describe('treeMode 单元测试', function () {
     expect(opts.onChangeOpenKeys).toBeCalledWith(['4-2'], '4', 'collapse'); // 叶子节点渲染
 
     var leafWrapper = (0, _enzyme.mount)(col[0].render('一级标题', newPipeline.getDataSource()[9], 9));
-    expect((0, _find.default)(leafWrapper).call(leafWrapper, '.expansion-cell.leaf').length).toBe(2);
+    expect((0, _find.default)(leafWrapper).call(leafWrapper, ".expansion-cell.".concat(_styles.Classes.leaf)).length).toBe(2);
   });
   it('getCellProps', function () {
     var col = newPipeline.getColumns(); // clickArea: 'content' 取默认的cellProps

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

@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequ
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.autoFillTableWidth = exports.tableWidthKey = exports.FILL_COLUMN_CODE = void 0;
+exports.tableWidthKey = exports.autoFillTableWidth = exports.FILL_COLUMN_CODE = void 0;
 
 var _find = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/find"));
 
@@ -17,6 +17,8 @@ var _calculations = require("../../base/calculations");
 
 var _utils = require("../../utils");
 
+var _styles = require("../../base/styles");
+
 var FILL_COLUMN_CODE = '$_fill_column_&';
 exports.FILL_COLUMN_CODE = FILL_COLUMN_CODE;
 var tableWidthKey = 'tableWidth';
@@ -42,9 +44,14 @@ var autoFillTableWidth = function autoFillTableWidth() {
         width: width,
         features: {
           resizeable: false
+        },
+        getCellProps: function getCellProps(value, record, rowIndex) {
+          return {
+            className: _styles.Classes.emptyColCell
+          };
         }
       };
-      (0, _splice.default)(columns).call(columns, spliceIndex, 0, _fillColumns);
+      (0, _splice.default)(columns).call(columns, spliceIndex || columns.length, 0, _fillColumns);
     }
 
     pipeline.columns(columns);

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

@@ -7,46 +7,58 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.columnDrag = columnDrag;
 
+var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
+
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/slicedToArray"));
 
 var _extends2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/extends"));
 
-var _filter = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/filter"));
+var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime-corejs3/helpers/toConsumableArray"));
 
 var _utils = require("../../utils");
 
 var _autoFill = require("./autoFill");
 
 var stateKey = 'columnDrag';
+var SCROLL_SIZE = 30;
 
-function sortColumns(cloumns, sort) {
-  var res = new Array(cloumns.length);
+function sortColumns(columns, sort) {
+  var res = new Array(columns.length);
+  var lastColumns = (0, _toConsumableArray2.default)(columns);
 
-  while (cloumns.length) {
-    var cloumn = cloumns.pop();
+  while (columns.length) {
+    var cloumn = columns.pop();
     res[sort[cloumn.code]] = cloumn;
   }
 
+  if ((0, _filter.default)(res).call(res, Boolean).length !== lastColumns.length) {
+    return lastColumns;
+  }
+
   return res;
 }
 
+function stopClickPropagation(e) {
+  e.stopPropagation();
+}
+
 function columnDrag() {
   var opts = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};
   return function (pipeline) {
     var _pipeline$getStateAtK = pipeline.getStateAtKey(stateKey, {}),
-        cloumnsSortData = _pipeline$getStateAtK.cloumnsSortData,
         cloumnsTranslateData = _pipeline$getStateAtK.cloumnsTranslateData;
 
     var columns = pipeline.getColumns();
-
-    if (cloumnsSortData) {
-      columns = sortColumns(columns, cloumnsSortData);
-    }
+    var tableBody = pipeline.ref.current.domHelper && pipeline.ref.current.domHelper.tableBody; // if (cloumnsSortData) {
+    //   columns = sortColumns(columns, cloumnsSortData)
+    // }
 
     pipeline.columns((0, _filter.default)(columns).call(columns, function (column) {
       return column;
     }));
-    return pipeline.mapColumns((0, _utils.makeRecursiveMapper)(function (col) {
+    return pipeline.mapColumns((0, _utils.makeRecursiveMapper)(function (col, recursiveFlatMapInfo) {
+      var path = recursiveFlatMapInfo.path,
+          isLeaf = recursiveFlatMapInfo.isLeaf;
       var style = cloumnsTranslateData ? {
         transition: '.3s',
         transform: "translate3d(".concat(cloumnsTranslateData[col.code], "px, 0px, 0px)")
@@ -62,7 +74,7 @@ function columnDrag() {
           });
         },
         headerCellProps: (0, _utils.mergeCellProps)(col.headerCellProps, {
-          onMouseDown: function onMouseDown(e) {
+          onMouseDown: !isLeaf || path.length > 1 ? undefined : function (e) {
             if (e.button !== 0) {
               return;
             } // const cx = e.clientX
@@ -79,46 +91,60 @@ function columnDrag() {
             var columns = pipeline.getColumns();
 
             var _pipeline$getStateAtK2 = pipeline.getStateAtKey(stateKey, {}),
-                cloumnsSortData = _pipeline$getStateAtK2.cloumnsSortData,
                 cloumnsTranslateData = _pipeline$getStateAtK2.cloumnsTranslateData;
 
-            if (cloumnsSortData) {
-              columns = sortColumns(columns, cloumnsSortData);
-            } else {
-              cloumnsSortData = {};
-              columns.forEach(function (item, index) {
-                cloumnsSortData[item.code] = index;
-              });
-            }
-
+            var cloumnsSortData = {};
+            columns.forEach(function (item, index) {
+              cloumnsSortData[item.code] = index;
+            });
             var currentTarget = e.currentTarget;
             var rect = e.currentTarget.parentElement.getClientRects()[0];
             var startX = rect.left;
             var moveData = [];
+            var allColumns = (0, _utils.collectNodes)(columns);
+            var tableBodyClientRect = tableBody.getBoundingClientRect();
+            var startScrollLeft = pipeline.ref.current.domHelper.virtual.scrollLeft;
+
+            var updateScrollPosition = function updateScrollPosition(client) {
+              var clientX = client.clientX;
+              var left = tableBodyClientRect.left,
+                  width = tableBodyClientRect.width;
+
+              if (clientX + SCROLL_SIZE >= left + width) {
+                pipeline.ref.current.domHelper.virtual.scrollLeft += SCROLL_SIZE;
+              }
+
+              if (clientX - SCROLL_SIZE <= left) {
+                pipeline.ref.current.domHelper.virtual.scrollLeft -= SCROLL_SIZE;
+              }
+            };
+
+            var stopClickPropagationFlag = false;
 
             function handleMouseMove(e) {
-              if (e.clientX - startX < 20) {
+              var client = {
+                clientX: e.clientX,
+                clientY: e.clientY
+              };
+              var scrollDistance = pipeline.ref.current.domHelper.virtual.scrollLeft - startScrollLeft;
+              var leftPosition = startX - scrollDistance; // 表头最左边起点
+
+              updateScrollPosition(client);
+
+              if (e.clientX - leftPosition < 20) {
                 return;
               } else {
+                // 阻止列头点击事件，防止拖动后触发列头过滤事件
+                if (stopClickPropagationFlag === false) {
+                  stopClickPropagationFlag = true;
+                  currentTarget.addEventListener('click', stopClickPropagation);
+                }
+
                 e.stopPropagation();
               }
 
               document.body.style.userSelect = 'none';
-              currentTarget.style.cursor = 'move'; // 计算平移位置
-
-              var replaceIndex = 0;
-              var totalWitdth = columns[replaceIndex].width;
-
-              while (totalWitdth < e.clientX - startX && replaceIndex < columns.length - 1) {
-                replaceIndex++;
-                totalWitdth += columns[replaceIndex].width;
-              } // 重置位置信息
-
-
-              cloumnsTranslateData = {};
-              columns.forEach(function (item) {
-                cloumnsTranslateData[item.code] = 0;
-              }); // 循环计算每一个的位置
+              currentTarget.style.cursor = 'move'; // 循环计算每一个的位置
               // if (startIndex !== replaceIndex) {
               //   const optionColumn = columns[startIndex]
               //   const move = startIndex > replaceIndex ? 1 : -1
@@ -140,11 +166,24 @@ function columnDrag() {
               //   }
               //   index++
               // }
-              // 需要取最新startIndex, 不能直接用makeRecursiveMapper提供的startIndex（因为map时还没添加选择列、充满列等后面use添加的列）
+              // 重置位置信息
+
+              cloumnsTranslateData = {};
+              allColumns.forEach(function (item) {
+                cloumnsTranslateData[item.code] = 0;
+              }); // 计算平移位置
+
+              var replaceIndex = 0;
+              var totalWitdth = getColumnWidth(columns[replaceIndex]);
+
+              while (totalWitdth < e.clientX - leftPosition && replaceIndex < columns.length - 1) {
+                replaceIndex++;
+                totalWitdth += getColumnWidth(columns[replaceIndex]);
+              } // 需要取最新startIndex, 不能直接用makeRecursiveMapper提供的startIndex（因为map时还没添加选择列、充满列等后面use添加的列）
+
 
               var startIndex;
-              var leafColumns = (0, _utils.collectNodes)((0, _utils.collectNodes)(columns, 'leaf-only'));
-              leafColumns.forEach(function (column, index) {
+              columns.forEach(function (column, index) {
                 if (column.code === col.code) {
                   startIndex = index;
                 }
@@ -155,11 +194,25 @@ function columnDrag() {
               if (startIndex > replaceIndex) {
                 // 左移
                 while (index < startIndex) {
-                  var code = columns[index].code;
-
-                  if (code && code !== _autoFill.FILL_COLUMN_CODE && !columns[index].lock) {
+                  var _columns$index = columns[index],
+                      code = _columns$index.code,
+                      lock = _columns$index.lock,
+                      width = _columns$index.width,
+                      children = _columns$index.children;
+
+                  if (enableMove({
+                    code: code,
+                    lock: lock
+                  })) {
                     cloumnsTranslateData[code] += optionColumn.width;
-                    cloumnsTranslateData[optionColumn.code] -= columns[index].width;
+
+                    if ((0, _utils.isLeafNode)(columns[index])) {
+                      cloumnsTranslateData[optionColumn.code] -= width;
+                    } else {
+                      cloumnsTranslateData[optionColumn.code] -= getColumnWidth(columns[index]);
+                      moveAllChildren(children, cloumnsTranslateData, optionColumn.width);
+                    }
+
                     columnMoved = true;
                   }
 
@@ -168,22 +221,34 @@ function columnDrag() {
               } else if (startIndex < replaceIndex) {
                 // 右移
                 while (startIndex < index) {
-                  var _code = columns[index].code;
-
-                  if (_code && _code !== _autoFill.FILL_COLUMN_CODE && !columns[index].lock) {
+                  var _columns$index2 = columns[index],
+                      _code = _columns$index2.code,
+                      _lock = _columns$index2.lock,
+                      _width = _columns$index2.width,
+                      _children = _columns$index2.children;
+
+                  if (enableMove({
+                    code: _code,
+                    lock: _lock
+                  })) {
                     cloumnsTranslateData[_code] -= optionColumn.width;
-                    cloumnsTranslateData[optionColumn.code] += columns[index].width;
+
+                    if ((0, _utils.isLeafNode)(columns[index])) {
+                      cloumnsTranslateData[optionColumn.code] += _width;
+                    } else {
+                      cloumnsTranslateData[optionColumn.code] += getColumnWidth(columns[index]);
+                      moveAllChildren(_children, cloumnsTranslateData, optionColumn.width, true);
+                    }
+
                     columnMoved = true;
                   }
 
                   index--;
                 }
-              } else {// 不动或者移动回原位
               }
 
               window.requestAnimationFrame(function () {
                 pipeline.setStateAtKey(stateKey, {
-                  cloumnsSortData: cloumnsSortData,
                   cloumnsTranslateData: cloumnsTranslateData
                 });
                 moveData = [startIndex, replaceIndex];
@@ -195,6 +260,11 @@ function columnDrag() {
               document.body.removeEventListener('mousemove', handleMouseMove);
               document.body.removeEventListener('mouseup', handleMouseUp);
               window.requestAnimationFrame(function () {
+                // 取消阻止列头点击事件
+                currentTarget.removeEventListener('click', stopClickPropagation);
+                stopClickPropagationFlag = false;
+                currentTarget = null;
+
                 var _moveData = moveData,
                     _moveData2 = (0, _slicedToArray2.default)(_moveData, 2),
                     startIndex = _moveData2[0],
@@ -214,9 +284,14 @@ function columnDrag() {
                 if (startIndex > replaceIndex) {
                   // 左移
                   while (index < startIndex) {
-                    var code = columns[index].code;
-
-                    if (code && code !== _autoFill.FILL_COLUMN_CODE && !columns[index].lock) {
+                    var _columns$index3 = columns[index],
+                        code = _columns$index3.code,
+                        lock = _columns$index3.lock;
+
+                    if (enableMove({
+                      code: code,
+                      lock: lock
+                    })) {
                       cloumnsSortData[code] += 1;
                       cloumnsSortData[optionColumn.code] -= 1;
                       columnMoved = true;
@@ -227,9 +302,14 @@ function columnDrag() {
                 } else if (startIndex < replaceIndex) {
                   // 右移
                   while (index > startIndex) {
-                    var _code2 = columns[index].code;
-
-                    if (_code2 && _code2 !== _autoFill.FILL_COLUMN_CODE && !columns[index].lock) {
+                    var _columns$index4 = columns[index],
+                        _code2 = _columns$index4.code,
+                        _lock2 = _columns$index4.lock;
+
+                    if (enableMove({
+                      code: _code2,
+                      lock: _lock2
+                    })) {
                       cloumnsSortData[_code2] -= 1;
                       cloumnsSortData[optionColumn.code] += 1;
                       columnMoved = true;
@@ -253,14 +333,12 @@ function columnDrag() {
                 }
 
                 pipeline.setStateAtKey(stateKey, {
-                  cloumnsSortData: cloumnsSortData,
                   cloumnsTranslateData: null
                 });
               });
               document.body.style.userSelect = '';
               currentTarget.style.opacity = '';
               currentTarget.style.cursor = '';
-              currentTarget = null;
             }
 
             document.body.addEventListener('mousemove', handleMouseMove);
@@ -275,4 +353,35 @@ function columnDrag() {
       });
     }));
   };
+}
+
+function enableMove(_ref2) {
+  var lock = _ref2.lock,
+      code = _ref2.code;
+  return code && code !== _autoFill.FILL_COLUMN_CODE && !lock;
+}
+
+function getColumnWidth(col) {
+  if (col.children) {
+    return col.children.reduce(function (acc, col) {
+      return acc + getColumnWidth(col);
+    }, 0);
+  }
+
+  return col.width;
+}
+
+function moveAllChildren(cols, cloumnsTranslateData, width, isMinus) {
+  cols.forEach(function (col) {
+    var _a;
+
+    var code = col.code,
+        children = col.children;
+    var movedWidth = (_a = cloumnsTranslateData[code]) !== null && _a !== void 0 ? _a : 0;
+    cloumnsTranslateData[code] = movedWidth + (isMinus ? -width : width);
+
+    if (!(0, _utils.isLeafNode)(col)) {
+      moveAllChildren(children, cloumnsTranslateData, width);
+    }
+  });
 }

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

@@ -27,8 +27,6 @@ var _values = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-sta
 
 var _concat = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/concat"));
 
-var _reduce = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/reduce"));
-
 var _react = _interopRequireDefault(require("react"));
 
 var _classnames = _interopRequireDefault(require("classnames"));
@@ -118,12 +116,11 @@ function filter() {
             isFilterActive: filterActive,
             className: (0, _classnames.default)((_cx = {}, (0, _defineProperty2.default)(_cx, _styles.Classes.tableFilterTrigger, true), (0, _defineProperty2.default)(_cx, "active", filterActive), _cx)),
             stopClickEventPropagation: stopClickEventPropagation
-          })]);
-          result.headerCellProps = (0, _utils.mergeCellProps)(col.headerCellProps, {
-            style: {
-              paddingRight: '18px'
-            }
-          });
+          })]); // result.headerCellProps = mergeCellProps(col.headerCellProps, {
+          //   style: {
+          //     paddingRight: '18px'
+          //   }
+          // })
         }
 
         if (!(0, _utils.isLeafNode)(col)) {
@@ -181,7 +178,7 @@ function filter() {
         });
       }
 
-      return (0, _reduce.default)(dataSource).call(dataSource, function (pre, record) {
+      return dataSource.reduce(function (pre, record) {
         if (isMatchedFilterCondition(record)) {
           return (0, _concat.default)(pre).call(pre, [record]);
         }

package/lib/table/pipeline/features/columnResizeWidth.d.ts

@@ -1,3 +1,5 @@
+import React from 'react';
+import { ArtColumn } from '../../interfaces';
 import { TablePipeline } from '../pipeline';
 interface ColumnSize {
     [key: string]: number;
@@ -14,6 +16,7 @@ export interface ColumnResizeOptions {
     fallbackSize?: number;
     /** 列的最大宽度，默认为 1000 */
     maxSize?: number;
+    doubleClickCallback?(e: React.MouseEvent<HTMLSpanElement>, col: ArtColumn): void;
     onChangeSize?(nextSize: ColumnSize): void;
     afterChangeSize?(nextSize: ColumnSize, changedColumnSize: ChangedColumnSize[]): void;
 }

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

@@ -1,16 +1,18 @@
 "use strict";
 
-var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
+var _typeof = require("@babel/runtime-corejs3/helpers/typeof");
+
+var _WeakMap = require("@babel/runtime-corejs3/core-js-stable/weak-map");
 
-var _interopRequireWildcard = require("@babel/runtime-corejs3/helpers/interopRequireWildcard");
+var _Object$getOwnPropertyDescriptor = require("@babel/runtime-corejs3/core-js-stable/object/get-own-property-descriptor");
+
+var _interopRequireDefault = require("@babel/runtime-corejs3/helpers/interopRequireDefault");
 
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.columnResize = columnResize;
 
-var _reduce = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/reduce"));
-
 var _map = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/instance/map"));
 
 var _keys = _interopRequireDefault(require("@babel/runtime-corejs3/core-js-stable/object/keys"));
@@ -35,6 +37,10 @@ var _styles = require("../../base/styles");
 
 var _templateObject, _templateObject2;
 
+function _getRequireWildcardCache(nodeInterop) { if (typeof _WeakMap !== "function") return null; var cacheBabelInterop = new _WeakMap(); var cacheNodeInterop = new _WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
+
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && _Object$getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? _Object$getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 var TableHeaderCellResize = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: absolute;\n  top: 0;\n  right: -5px;\n  height: 100%;\n  width: 10px;\n  cursor: ew-resize;\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  z-index:1;\n\n  &:after {\n    content: \"\";\n    position: absolute;\n    display: block;\n    left: calc(50% - 1px);\n    width: 1px;\n    height: calc(100% - 14px);\n    top: 7px;\n    background-color: var(--border-color);\n  }\n"])));
 
 var TableHeaderGroupCellResize = (0, _styledComponents.default)(TableHeaderCellResize)(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  &:after {\n    height: 100%;\n    top: 0;\n  }\n"])));
@@ -97,6 +103,10 @@ function columnResize() {
       });
     };
 
+    var handleDoubleClick = function handleDoubleClick(e, col) {
+      opts === null || opts === void 0 ? void 0 : opts.doubleClickCallback(e, col);
+    };
+
     var handleMouseDown = function handleMouseDown(e, col) {
       window.addEventListener('selectstart', disableSelect);
       var changedColumnSize = {};
@@ -113,7 +123,7 @@ function columnResize() {
 
         if ((children === null || children === void 0 ? void 0 : children.length) > 0) {
           var leafChildColumns = (0, _utils.collectNodes)(children, 'leaf-only');
-          var childrenWidthSum = (0, _reduce.default)(leafChildColumns).call(leafChildColumns, function (sum, _ref2) {
+          var childrenWidthSum = leafChildColumns.reduce(function (sum, _ref2) {
             var code = _ref2.code;
             return sum + columnSize[code];
           }, 0);
@@ -174,11 +184,17 @@ function columnResize() {
         width: (_a = columnSize[code]) !== null && _a !== void 0 ? _a : width,
         title: /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, prevTitle, (features === null || features === void 0 ? void 0 : features.resizeable) !== false && (isGroup ? /*#__PURE__*/_react.default.createElement(TableHeaderGroupCellResize, {
           className: _styles.Classes.tableHeaderCellResize,
+          onDoubleClick: function onDoubleClick(e) {
+            return handleDoubleClick(e, col);
+          },
           onMouseDown: function onMouseDown(e) {
             return handleMouseDown(e, col);
           }
         }) : /*#__PURE__*/_react.default.createElement(TableHeaderCellResize, {
           className: _styles.Classes.tableHeaderCellResize,
+          onDoubleClick: function onDoubleClick(e) {
+            return handleDoubleClick(e, col);
+          },
           onMouseDown: function onMouseDown(e) {
             return handleMouseDown(e, col);
           }