增加默认宽度200，固定列在主表中hidden

build/Column.js

@@ -28,7 +28,8 @@ var propTypes = {
   width: _propTypes2["default"].oneOfType([_propTypes2["default"].number, _propTypes2["default"].string]),
   fixed: _propTypes2["default"].oneOf([true, 'left', 'right']),
   render: _propTypes2["default"].func,
-  onCellClick: _propTypes2["default"].func
+  onCellClick: _propTypes2["default"].func,
+  ifshow: _propTypes2["default"].bool
 };
 
 var Column = function (_Component) {
@@ -43,6 +44,12 @@ var Column = function (_Component) {
   return Column;
 }(_react.Component);
 
+Column.defaultProps = {
+  width: '200',
+  ifshow: true
+};
+
+
 Column.propTypes = propTypes;
 
 exports["default"] = Column;

build/ColumnManager.js

@@ -85,35 +85,53 @@ var ColumnManager = function () {
     });
   };
 
-  ColumnManager.prototype.leafColumns = function leafColumns() {
+  ColumnManager.prototype.centerColumns = function centerColumns() {
     var _this6 = this;
 
+    return this._cache('centerColumns', function () {
+      return _this6.groupedColumns().filter(function (column) {
+        return !column.fixed;
+      });
+    });
+  };
+
+  ColumnManager.prototype.leafColumns = function leafColumns() {
+    var _this7 = this;
+
     return this._cache('leafColumns', function () {
-      return _this6._leafColumns(_this6.columns);
+      return _this7._leafColumns(_this7.columns);
     });
   };
 
   ColumnManager.prototype.leftLeafColumns = function leftLeafColumns() {
-    var _this7 = this;
+    var _this8 = this;
 
     return this._cache('leftLeafColumns', function () {
-      return _this7._leafColumns(_this7.leftColumns());
+      return _this8._leafColumns(_this8.leftColumns());
     });
   };
 
   ColumnManager.prototype.rightLeafColumns = function rightLeafColumns() {
-    var _this8 = this;
+    var _this9 = this;
 
     return this._cache('rightLeafColumns', function () {
-      return _this8._leafColumns(_this8.rightColumns());
+      return _this9._leafColumns(_this9.rightColumns());
+    });
+  };
+
+  ColumnManager.prototype.centerLeafColumns = function centerLeafColumns() {
+    var _this10 = this;
+
+    return this._cache('centerLeafColumns', function () {
+      return _this10._leafColumns(_this10.centerColumns());
     });
   };
 
   // add appropriate rowspan and colspan to column
 
 
-  ColumnManager.prototype.groupedColumns = function groupedColumns() {
+  ColumnManager.prototype.groupedColumns = function groupedColumns(type) {
-    var _this9 = this;
+    var _this11 = this;
 
     return this._cache('groupedColumns', function () {
       var _groupColumns = function _groupColumns(columns) {
@@ -132,7 +150,14 @@ var ColumnManager = function () {
           }
         };
         columns.forEach(function (column, index) {
-          var newColumn = _extends({}, column);
+          var defaultOpt = {
+            ifshow: true,
+            width: 200
+            //获取非固定列
+          };if (type == 'nofixed' && column.fixed) {
+            return false;
+          }
+          var newColumn = _extends({}, defaultOpt, column);
           rows[currentRow].push(newColumn);
           parentColumn.colSpan = parentColumn.colSpan || 0;
           if (newColumn.children && newColumn.children.length > 0) {
@@ -153,22 +178,22 @@ var ColumnManager = function () {
         });
         return grouped;
       };
-      return _groupColumns(_this9.columns);
+      return _groupColumns(_this11.columns);
     });
   };
 
   ColumnManager.prototype.normalize = function normalize(elements) {
-    var _this10 = this;
+    var _this12 = this;
 
     var columns = [];
     _react2["default"].Children.forEach(elements, function (element) {
-      if (!_this10.isColumnElement(element)) return;
+      if (!_this12.isColumnElement(element)) return;
       var column = _extends({}, element.props);
       if (element.key) {
         column.key = element.key;
       }
       if (element.type === _ColumnGroup2["default"]) {
-        column.children = _this10.normalize(column.children);
+        column.children = _this12.normalize(column.children);
       }
       columns.push(column);
     });
@@ -184,6 +209,46 @@ var ColumnManager = function () {
     this._cached = {};
   };
 
+  ColumnManager.prototype.getColumnWidth = function getColumnWidth() {
+    var computeWidth = 0;
+    var columns = this.groupedColumns();
+    columns.forEach(function (col) {
+      //如果列显示，固定列也要去掉
+      if (col.ifshow && !col.fixed) {
+        computeWidth += parseInt(col.width);
+      }
+    });
+    return computeWidth;
+  };
+
+  ColumnManager.prototype.getLeftColumnsWidth = function getLeftColumnsWidth() {
+    var _this13 = this;
+
+    return this._cache('leftColumnsWidth', function () {
+      var leftColumnsWidth = 0;
+      _this13.groupedColumns().forEach(function (column) {
+        if (column.fixed === 'left' || column.fixed === true) {
+          leftColumnsWidth += column.width;
+        }
+      });
+      return leftColumnsWidth;
+    });
+  };
+
+  ColumnManager.prototype.getRightColumnsWidth = function getRightColumnsWidth() {
+    var _this14 = this;
+
+    return this._cache('rightColumnsWidth', function () {
+      var rightColumnsWidth = 0;
+      _this14.groupedColumns().forEach(function (column) {
+        if (column.fixed === 'right') {
+          rightColumnsWidth += column.width;
+        }
+      });
+      return rightColumnsWidth;
+    });
+  };
+
   ColumnManager.prototype._cache = function _cache(name, fn) {
     if (name in this._cached) {
       return this._cached[name];
@@ -193,14 +258,22 @@ var ColumnManager = function () {
   };
 
   ColumnManager.prototype._leafColumns = function _leafColumns(columns) {
-    var _this11 = this;
+    var _this15 = this;
 
     var leafColumns = [];
+    var parWidth = 0;
     columns.forEach(function (column) {
       if (!column.children) {
-        leafColumns.push(column);
+
+        var defaultOpt = {
+          ifshow: true,
+          width: 200
+        };
+        var newColumn = _extends({}, defaultOpt, column);
+        parWidth += newColumn.width;
+        leafColumns.push(newColumn);
       } else {
-        leafColumns.push.apply(leafColumns, _toConsumableArray(_this11._leafColumns(column.children)));
+        leafColumns.push.apply(leafColumns, _toConsumableArray(_this15._leafColumns(column.children)));
       }
     });
     return leafColumns;

build/Table.css

@@ -313,7 +313,10 @@
   .u-table-scroll-position-right .u-table-fixed-right {
     box-shadow: none; }
   .u-table-thead th {
-    background: #f7f7f7; }
+    background: #f7f7f7;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis; }
   .u-table-thead .th-drag {
     cursor: pointer; }
   .u-table-thead .th-drag-hover {
@@ -327,12 +330,13 @@
       top: 0;
       background: transparent;
       width: 2px;
-      cursor: col-resize;
+      box-sizing: border-box;
-      box-sizing: border-box; }
+      z-index: 100; }
     .u-table-thead-th .th-drag-gap {
       background: transparent; }
     .u-table-thead-th .th-drag-gap-hover {
-      background: #ccc; }
+      background: #ccc;
+      cursor: col-resize; }
   .u-table-thead-th:last-child-drag-gap {
     border: none; }
   .u-table-filter-column-pop-cont {
@@ -366,6 +370,9 @@
   .u-table-filter-column-pop .u-modal-dialog {
     border: 1px solid #ccc;
     background: #fff; }
+  .u-table-row-fixed-columns-in-body {
+    visibility: hidden;
+    pointer-events: none; }
 
 .u-table.bordered table {
   border-collapse: collapse; }

build/Table.js

@@ -87,8 +87,8 @@ var propTypes = {
   rowRef: _propTypes2["default"].func,
   getBodyWrapper: _propTypes2["default"].func,
   children: _propTypes2["default"].node,
-
+  draggable: _propTypes2["default"].bool,
-  draggable: _propTypes2["default"].bool
+  minColumnWidth: _propTypes2["default"].number
 };
 
 var defaultProps = {
@@ -125,7 +125,8 @@ var defaultProps = {
   },
   emptyText: function emptyText() {
     return 'No Data';
-  }
+  },
+  minColumnWidth: 80
 };
 
 var Table = function (_Component) {
@@ -202,12 +203,16 @@ var Table = function (_Component) {
     _this.detectScrollTarget = _this.detectScrollTarget.bind(_this);
     _this.handleBodyScroll = _this.handleBodyScroll.bind(_this);
     _this.handleRowHover = _this.handleRowHover.bind(_this);
-
+    _this.computeTableWidth = _this.computeTableWidth.bind(_this);
     return _this;
   }
 
   Table.prototype.componentDidMount = function componentDidMount() {
     setTimeout(this.resetScrollY, 300);
+    //后续也放在recevice里面
+    if (!this.props.originWidth) {
+      this.computeTableWidth();
+    }
     if (this.columnManager.isAnyColumnsFixed()) {
       this.syncFixedTableRowHeight();
       this.resizeEvent = (0, _addEventListener2["default"])(window, 'resize', (0, _utils.debounce)(this.syncFixedTableRowHeight, 150));
@@ -233,6 +238,9 @@ var Table = function (_Component) {
     } else if (nextProps.children !== this.props.children) {
       this.columnManager.reset(null, nextProps.children);
     }
+    if (!nextProps.originWidth) {
+      this.computeTableWidth();
+    }
   };
 
   Table.prototype.componentDidUpdate = function componentDidUpdate() {
@@ -247,6 +255,16 @@ var Table = function (_Component) {
     }
   };
 
+  Table.prototype.computeTableWidth = function computeTableWidth() {
+    //计算总表格宽度、根据表格宽度和各列的宽度和比较，重置最后一列
+    this.contentWidth = this.contentTable.clientWidth; //表格宽度
+    this.computeWidth = this.columnManager.getColumnWidth();
+    if (this.computeWidth < this.contentWidth) {
+      var contentWidthDiff = this.contentWidth - this.computeWidth;
+      this.setState({ contentWidthDiff: contentWidthDiff });
+    }
+  };
+
   Table.prototype.onExpandedRowsChange = function onExpandedRowsChange(expandedRowKeys) {
     if (!this.props.expandedRowKeys) {
       this.setState({ expandedRowKeys: expandedRowKeys });
@@ -311,7 +329,8 @@ var Table = function (_Component) {
         onMouseUp = _props.onMouseUp,
         dragborder = _props.dragborder,
         onThMouseMove = _props.onThMouseMove,
-        dragborderKey = _props.dragborderKey;
+        dragborderKey = _props.dragborderKey,
+        minColumnWidth = _props.minColumnWidth;
 
     var rows = this.getHeaderRows(columns);
     if (expandIconAsCell && fixed !== 'right') {
@@ -326,11 +345,19 @@ var Table = function (_Component) {
     var trStyle = fixed ? this.getHeaderRowStyle(columns, rows) : null;
     var drop = draggable ? { onDragStart: onDragStart, onDragOver: onDragOver, onDrop: onDrop, onDragEnter: onDragEnter, draggable: draggable } : {};
     var dragBorder = dragborder ? { onMouseDown: onMouseDown, onMouseMove: onMouseMove, onMouseUp: onMouseUp, dragborder: dragborder, onThMouseMove: onThMouseMove, dragborderKey: dragborderKey } : {};
-
+    var contentWidthDiff = 0;
+    //非固定表格,宽度不够时自动扩充
+    if (!fixed) {
+      contentWidthDiff = this.state.contentWidthDiff;
+    }
     return showHeader ? _react2["default"].createElement(_TableHeader2["default"], _extends({}, drop, dragBorder, {
+      minColumnWidth: minColumnWidth,
+      contentWidthDiff: contentWidthDiff,
       clsPrefix: clsPrefix,
       rows: rows,
-      rowStyle: trStyle
+      contentTable: this.contentTable,
+      rowStyle: trStyle,
+      fixed: fixed
     })) : null;
   };
 
@@ -354,7 +381,8 @@ var Table = function (_Component) {
         className: column.className || '',
         children: column.title,
         drgHover: column.drgHover,
-        width: column.width
+        fixed: column.fixed,
+        width: column.width ? column.width : 200
       };
       if (column.onHeadCellClick) {
         cell.onClick = column.onHeadCellClick;
@@ -513,7 +541,8 @@ var Table = function (_Component) {
         key: key,
         hoverKey: key,
         ref: rowRef,
-        store: this.store
+        store: this.store,
+        fixed: fixed
       })));
       this.treeRowIndex++;
       var subVisible = visible && isRowExpanded;
@@ -537,6 +566,10 @@ var Table = function (_Component) {
 
   Table.prototype.getColGroup = function getColGroup(columns, fixed) {
     var cols = [];
+    var _state$contentWidthDi = this.state.contentWidthDiff,
+        contentWidthDiff = _state$contentWidthDi === undefined ? 0 : _state$contentWidthDi;
+
+
     if (this.props.expandIconAsCell && fixed !== 'right') {
       cols.push(_react2["default"].createElement('col', {
         className: this.props.clsPrefix + '-expand-icon-col',
@@ -545,14 +578,20 @@ var Table = function (_Component) {
     }
     var leafColumns = void 0;
     if (fixed === 'left') {
+      contentWidthDiff = 0;
       leafColumns = this.columnManager.leftLeafColumns();
     } else if (fixed === 'right') {
+      contentWidthDiff = 0;
       leafColumns = this.columnManager.rightLeafColumns();
     } else {
       leafColumns = this.columnManager.leafColumns();
     }
-    cols = cols.concat(leafColumns.map(function (c) {
+    cols = cols.concat(leafColumns.map(function (c, i, arr) {
-      return _react2["default"].createElement('col', { key: c.key, style: { width: c.width, minWidth: c.width } });
+      var width = c.width;
+      if (arr.length == i + 1) {
+        width = parseInt(width) + contentWidthDiff;
+      }
+      return _react2["default"].createElement('col', { key: c.key, style: { width: width, minWidth: c.width } });
     }));
     return _react2["default"].createElement(
       'colgroup',
@@ -862,6 +901,8 @@ var Table = function (_Component) {
   };
 
   Table.prototype.render = function render() {
+    var _this5 = this;
+
     var props = this.props;
     var clsPrefix = props.clsPrefix;
 
@@ -886,7 +927,9 @@ var Table = function (_Component) {
     }
     return _react2["default"].createElement(
       'div',
-      { className: className, style: props.style },
+      { className: className, style: props.style, ref: function ref(el) {
+          return _this5.contentTable = el;
+        } },
       this.getTitle(),
       _react2["default"].createElement(
         'div',

build/TableCell.js

@@ -71,10 +71,11 @@ var TableCell = function (_Component) {
         indent = _props2.indent,
         index = _props2.index,
         expandIcon = _props2.expandIcon,
-        column = _props2.column;
+        column = _props2.column,
+        fixed = _props2.fixed;
     var dataIndex = column.dataIndex,
-        render = column.render,
+        render = column.render;
-        _column$className = column.className,
+    var _column$className = column.className,
         className = _column$className === undefined ? '' : _column$className;
 
 
@@ -105,6 +106,10 @@ var TableCell = function (_Component) {
     if (rowSpan === 0 || colSpan === 0) {
       return null;
     }
+    //不是固定表格并且当前列是固定，则隐藏当前列
+    if (column.fixed && !fixed) {
+      className = className + (clsPrefix + '-fixed-columns-in-body');
+    }
     return _react2["default"].createElement(
       'td',
       {

build/TableHeader.js

@@ -70,13 +70,21 @@ var TableHeader = function (_Component) {
       _this.props.onDrop(event, data);
     };
 
-    _this.onMouseMove = function (event, data) {
+    _this.onMouseOver = function (event, data) {
-      if (_this.border) return;
+      //如果是固定列没有拖拽功能
+      if (_this.border || data.fixed) return;
       var clsPrefix = _this.props.clsPrefix;
 
       event.target.className = clsPrefix + '-thead-th-drag-gap th-drag-gap-hover';
     };
 
+    _this.onMouseMove = function (event, data) {
+      //如果是固定列没有拖拽功能
+      if (_this.border || data.fixed) return;
+      // const {clsPrefix} = this.props; 
+      // event.target.className = `${clsPrefix}-thead-th-drag-gap th-drag-gap-hover`;
+    };
+
     _this.onMouseOut = function (event, data) {
       if (_this.border) return;
       var clsPrefix = _this.props.clsPrefix;
@@ -86,7 +94,9 @@ var TableHeader = function (_Component) {
 
     _this.onMouseDown = function (event, data) {
       _this.border = true;
-      var clsPrefix = _this.props.clsPrefix;
+      var _this$props = _this.props,
+          clsPrefix = _this$props.clsPrefix,
+          contentTable = _this$props.contentTable;
 
       _this.drag.initPageLeftX = event.pageX;
       _this.drag.initLeft = (0, _utils.tryParseInt)(event.target.style.left);
@@ -95,6 +105,8 @@ var TableHeader = function (_Component) {
         return da.key == data.key;
       });
       _this.drag.width = _this.drag.data[_this.drag.currIndex].width;
+
+      _this.contentTableWidth = contentTable.width;
     };
 
     _this.onMouseUp = function (event, data) {
@@ -110,10 +122,23 @@ var TableHeader = function (_Component) {
 
     _this.onThMouseMove = function (event, data) {
       if (!_this.border) return;
-      var dragborderKey = _this.props.dragborderKey;
+      var _this$props2 = _this.props,
+          dragborderKey = _this$props2.dragborderKey,
+          contentTable = _this$props2.contentTable;
 
-      console.log(data);
       var x = event.pageX - _this.drag.initPageLeftX + _this.drag.initLeft - 0;
+      if (!_this.contentTableWidth) {
+        _this.contentTableWidth = contentTable.clientWidth;
+      }
+      var newTableWidth = _this.contentTableWidth + x;
+      var newWidth = _this.drag.width + x;
+      if (newWidth < _this.props.minColumnWidth) {
+        //清楚样式
+        var moveDom = event.target.querySelector('.th-drag-gap-hover');
+        moveDom && moveDom.classList.remove('th-drag-gap-hover');
+        // event.target.classList.remove('th-drag-gap-hover');
+        return;
+      }
       //设置hiden的left
       //"u-table-drag-hide-table"
       var currentHideDom = document.getElementById("u-table-drag-hide-table-" + dragborderKey).getElementsByTagName("div")[_this.drag.currIndex];
@@ -135,9 +160,11 @@ var TableHeader = function (_Component) {
 
       //设置当前的宽度 
       var currentData = _this.drag.data[_this.drag.currIndex];
-      currentData.width = _this.drag.width + x;
+      currentData.width = newWidth;
       var currentDom = document.getElementById("u-table-drag-thead-" + _this.theadKey).getElementsByTagName("th")[_this.drag.currIndex];
-      currentDom.style.width = currentData.width + "px";
+      currentDom.style.width = newWidth + "px";
+      // this.contentTableWidth = newTableWidth;
+      contentTable.style.width = newTableWidth + 'px';
       _this.drag.x = x;
     };
 
@@ -187,7 +214,9 @@ var TableHeader = function (_Component) {
         onMouseMove = _props.onMouseMove,
         onMouseUp = _props.onMouseUp,
         dragborder = _props.dragborder,
-        onMouseOut = _props.onMouseOut;
+        onMouseOut = _props.onMouseOut,
+        contentWidthDiff = _props.contentWidthDiff,
+        fixed = _props.fixed;
 
     var attr = dragborder ? { id: 'u-table-drag-thead-' + this.theadKey } : {};
     return _react2["default"].createElement(
@@ -197,9 +226,16 @@ var TableHeader = function (_Component) {
         return _react2["default"].createElement(
           'tr',
           { key: index, style: rowStyle },
-          row.map(function (da, i) {
+          row.map(function (da, i, arr) {
             var thHover = da.drgHover ? ' ' + clsPrefix + '-thead th-drag-hover' : "";
             delete da.drgHover;
+            var fixedStyle = '';
+            if (!fixed && da.fixed) {
+              fixedStyle = clsPrefix + '-row-fixed-columns-in-body';
+            }
+            if (arr.length == i + 1) {
+              da.width = parseInt(da.width) + contentWidthDiff;
+            }
             if (draggable) {
               return _react2["default"].createElement('th', _extends({}, da, {
                 onDragStart: function onDragStart(event) {
@@ -215,20 +251,21 @@ var TableHeader = function (_Component) {
                   _this2.onDragEnter(event, da);
                 },
                 draggable: draggable,
-                className: da.className + ' ' + clsPrefix + '-thead th-drag ' + thHover,
+                className: da.className + ' ' + clsPrefix + '-thead th-drag ' + thHover + ' ' + fixedStyle,
                 key: da.key }));
             } else if (dragborder) {
+
               return _react2["default"].createElement(
                 'th',
                 {
-                  style: { width: da.width, minWidth: da.width },
+                  style: { width: da.width },
                   onMouseMove: function onMouseMove(event) {
                     _this2.onThMouseMove(event, da);
                   },
                   onMouseUp: function onMouseUp(event) {
                     _this2.onThMouseUp(event, da);
                   },
-                  className: da.className + ' ' + clsPrefix + '-thead-th ',
+                  className: da.className + ' ' + clsPrefix + '-thead-th  ' + fixedStyle,
                   key: i },
                 da.children,
                 _react2["default"].createElement('div', { ref: function ref(el) {
@@ -246,12 +283,15 @@ var TableHeader = function (_Component) {
                   onMouseUp: function onMouseUp(event) {
                     _this2.onMouseUp(event, da);
                   },
+                  onMouseOver: function onMouseOver(event) {
+                    _this2.onMouseOver(event, da);
+                  },
                   className: clsPrefix + '-thead-th-drag-gap ' })
               );
             } else {
-              var th = da.onClick ? _react2["default"].createElement('th', _extends({}, da, { key: i, onClick: function onClick(event) {
+              var th = da.onClick ? _react2["default"].createElement('th', _extends({}, da, { className: ' ' + fixedStyle, key: i, onClick: function onClick(event) {
                   da.onClick(da, event);
-                } })) : _react2["default"].createElement('th', _extends({}, da, { key: i }));
+                } })) : _react2["default"].createElement('th', _extends({}, da, { key: i, className: ' ' + fixedStyle }));
               return th;
             }
           })
@@ -263,6 +303,9 @@ var TableHeader = function (_Component) {
   return TableHeader;
 }(_react.Component);
 
+TableHeader.defaultProps = {
+  contentWidthDiff: 0
+};
 ;
 
 TableHeader.propTypes = propTypes;

build/TableRow.js

@@ -185,7 +185,8 @@ var TableRow = function (_Component) {
         needIndentSpaced = _props7.needIndentSpaced,
         indent = _props7.indent,
         indentSize = _props7.indentSize,
-        isHiddenExpandIcon = _props7.isHiddenExpandIcon;
+        isHiddenExpandIcon = _props7.isHiddenExpandIcon,
+        fixed = _props7.fixed;
     var className = this.props.className;
 
 
@@ -225,6 +226,7 @@ var TableRow = function (_Component) {
         index: index,
         column: columns[i],
         key: columns[i].key,
+        fixed: fixed,
         expandIcon: isColumnHaveExpandIcon ? expandIcon : null
       }));
     }

build/lib/dragColumn.js

@@ -156,10 +156,10 @@ function dragColumn(Table) {
         onDragOver: this.onDragOver,
         onDrop: this.onDrop,
         onDragEnter: this.onDragEnter,
-        draggable: draggable
+        draggable: draggable,
-        // dragborder={dragborder}
+        dragborder: dragborder
-        , dragborder: false,
+        // dragborder={false}
-        dragborderKey: key
+        , dragborderKey: key
       }));
     };
 

build/lib/multiSelect.js

@@ -125,7 +125,7 @@ function multiSelect(Table, Checkbox) {
           }),
           key: "checkbox",
           dataIndex: "checkbox",
-          width: "100px",
+          width: "100",
           render: function render(text, record, index) {
             var rowKey = record["key"] ? record["key"] : _this2.getRowKey(record, i);
             var bool = checkedObj.hasOwnProperty(rowKey);

build/lib/sum.js

@@ -192,7 +192,8 @@ function sum(Table) {
         footerScroll: true,
         columns: this.props.columns,
         data: this.props.data,
-        footer: this.setFooterRender
+        footer: this.setFooterRender,
+        originWidth: true
       }));
     };
 

build/utils.js

@@ -13,6 +13,7 @@ exports.warningOnce = warningOnce;
 exports.addClass = addClass;
 exports.removeClass = removeClass;
 exports.ObjectAssign = ObjectAssign;
+exports.closest = closest;
 
 var _warning = require('warning');
 
@@ -144,4 +145,21 @@ function ObjectAssign(obj) {
     _extends(tagObj, obj);
   }
   return tagObj;
+}
+/**
+ * 获取某个父元素
+ * */
+
+function closest(ele, selector) {
+  var matches = ele.matches || ele.webkitMatchesSelector || ele.mozMatchesSelector || ele.msMatchesSelector;
+  if (matches) {
+    while (ele) {
+      if (matches.call(ele, selector)) {
+        return ele;
+      } else {
+        ele = ele.parentElement;
+      }
+    }
+  }
+  return null;
 }

dist/demo.css

@@ -8528,7 +8528,10 @@ ul {
   .u-table-scroll-position-right .u-table-fixed-right {
     box-shadow: none; }
   .u-table-thead th {
-    background: #f7f7f7; }
+    background: #f7f7f7;
+    overflow: hidden;
+    white-space: nowrap;
+    text-overflow: ellipsis; }
   .u-table-thead .th-drag {
     cursor: pointer; }
   .u-table-thead .th-drag-hover {
@@ -8542,12 +8545,13 @@ ul {
       top: 0;
       background: transparent;
       width: 2px;
-      cursor: col-resize;
+      box-sizing: border-box;
-      box-sizing: border-box; }
+      z-index: 100; }
     .u-table-thead-th .th-drag-gap {
       background: transparent; }
     .u-table-thead-th .th-drag-gap-hover {
-      background: #ccc; }
+      background: #ccc;
+      cursor: col-resize; }
   .u-table-thead-th:last-child-drag-gap {
     border: none; }
   .u-table-filter-column-pop-cont {
@@ -8581,6 +8585,9 @@ ul {
   .u-table-filter-column-pop .u-modal-dialog {
     border: 1px solid #ccc;
     background: #fff; }
+  .u-table-row-fixed-columns-in-body {
+    visibility: hidden;
+    pointer-events: none; }
 
 .u-table.bordered table {
   border-collapse: collapse; }

dist/demo.js

@@ -9187,8 +9187,8 @@
 	  rowRef: _propTypes2['default'].func,
 	  getBodyWrapper: _propTypes2['default'].func,
 	  children: _propTypes2['default'].node,
-	
+	  draggable: _propTypes2['default'].bool,
-	  draggable: _propTypes2['default'].bool
+	  minColumnWidth: _propTypes2['default'].number
 	};
 	
 	var defaultProps = {
@@ -9225,7 +9225,8 @@
 	  },
 	  emptyText: function emptyText() {
 	    return 'No Data';
-	  }
+	  },
+	  minColumnWidth: 80
 	};
 	
 	var Table = function (_Component) {
@@ -9256,7 +9257,7 @@
 	
 	    var expandedRowKeys = [];
 	    var rows = [].concat(_toConsumableArray(props.data));
-	    _this.columnManager = new _ColumnManager2['default'](props.columns, props.children);
+	    _this.columnManager = new _ColumnManager2['default'](props.columns, props.children, props.originWidth);
 	    _this.store = (0, _createStore2['default'])({ currentHoverKey: null });
 	
 	    if (props.defaultExpandAllRows) {
@@ -9302,12 +9303,16 @@
 	    _this.detectScrollTarget = _this.detectScrollTarget.bind(_this);
 	    _this.handleBodyScroll = _this.handleBodyScroll.bind(_this);
 	    _this.handleRowHover = _this.handleRowHover.bind(_this);
-	
+	    _this.computeTableWidth = _this.computeTableWidth.bind(_this);
 	    return _this;
 	  }
 	
 	  Table.prototype.componentDidMount = function componentDidMount() {
 	    setTimeout(this.resetScrollY, 300);
+	    //后续也放在recevice里面
+	    if (!this.props.originWidth) {
+	      this.computeTableWidth();
+	    }
 	    if (this.columnManager.isAnyColumnsFixed()) {
 	      this.syncFixedTableRowHeight();
 	      this.resizeEvent = (0, _addEventListener2['default'])(window, 'resize', (0, _utils.debounce)(this.syncFixedTableRowHeight, 150));
@@ -9333,6 +9338,9 @@
 	    } else if (nextProps.children !== this.props.children) {
 	      this.columnManager.reset(null, nextProps.children);
 	    }
+	    if (!nextProps.originWidth) {
+	      this.computeTableWidth();
+	    }
 	  };
 	
 	  Table.prototype.componentDidUpdate = function componentDidUpdate() {
@@ -9347,6 +9355,27 @@
 	    }
 	  };
 	
+	  Table.prototype.computeTableWidth = function computeTableWidth() {
+	    //计算总表格宽度、根据表格宽度和各列的宽度和比较，重置最后一列
+	    this.contentWidth = this.contentTable.clientWidth; //表格宽度
+	    //如果用户传了scroll.x按用户传的为主
+	    var setWidthParam = this.props.scroll.x;
+	    if (setWidthParam) {
+	      if (typeof setWidthParam == 'string' && setWidthParam.indexOf('%')) {
+	        this.contentWidth = this.contentWidth * parseInt(setWidthParam) / 100;
+	      } else {
+	        this.contentWidth = parseInt(setWidthParam);
+	      }
+	    }
+	    var computeObj = this.columnManager.getColumnWidth();
+	    var lastShowIndex = computeObj.lastShowIndex;
+	    this.computeWidth = computeObj.computeWidth;
+	    if (this.computeWidth < this.contentWidth) {
+	      var contentWidthDiff = this.contentWidth - this.computeWidth;
+	      this.setState({ contentWidthDiff: contentWidthDiff, lastShowIndex: lastShowIndex });
+	    }
+	  };
+	
 	  Table.prototype.onExpandedRowsChange = function onExpandedRowsChange(expandedRowKeys) {
 	    if (!this.props.expandedRowKeys) {
 	      this.setState({ expandedRowKeys: expandedRowKeys });
@@ -9411,7 +9440,8 @@
 	        onMouseUp = _props.onMouseUp,
 	        dragborder = _props.dragborder,
 	        onThMouseMove = _props.onThMouseMove,
-	        dragborderKey = _props.dragborderKey;
+	        dragborderKey = _props.dragborderKey,
+	        minColumnWidth = _props.minColumnWidth;
 	
 	    var rows = this.getHeaderRows(columns);
 	    if (expandIconAsCell && fixed !== 'right') {
@@ -9426,11 +9456,20 @@
 	    var trStyle = fixed ? this.getHeaderRowStyle(columns, rows) : null;
 	    var drop = draggable ? { onDragStart: onDragStart, onDragOver: onDragOver, onDrop: onDrop, onDragEnter: onDragEnter, draggable: draggable } : {};
 	    var dragBorder = dragborder ? { onMouseDown: onMouseDown, onMouseMove: onMouseMove, onMouseUp: onMouseUp, dragborder: dragborder, onThMouseMove: onThMouseMove, dragborderKey: dragborderKey } : {};
-	
+	    var contentWidthDiff = 0;
+	    //非固定表格,宽度不够时自动扩充
+	    if (!fixed) {
+	      contentWidthDiff = this.state.contentWidthDiff;
+	    }
 	    return showHeader ? _react2['default'].createElement(_TableHeader2['default'], _extends({}, drop, dragBorder, {
+	      minColumnWidth: minColumnWidth,
+	      contentWidthDiff: contentWidthDiff,
+	      lastShowIndex: this.state.lastShowIndex,
 	      clsPrefix: clsPrefix,
 	      rows: rows,
-	      rowStyle: trStyle
+	      contentTable: this.contentTable,
+	      rowStyle: trStyle,
+	      fixed: fixed
 	    })) : null;
 	  };
 	
@@ -9454,6 +9493,7 @@
 	        className: column.className || '',
 	        children: column.title,
 	        drgHover: column.drgHover,
+	        fixed: column.fixed,
 	        width: column.width
 	      };
 	      if (column.onHeadCellClick) {
@@ -9613,7 +9653,8 @@
 	        key: key,
 	        hoverKey: key,
 	        ref: rowRef,
-	        store: this.store
+	        store: this.store,
+	        fixed: fixed
 	      })));
 	      this.treeRowIndex++;
 	      var subVisible = visible && isRowExpanded;
@@ -9637,6 +9678,12 @@
 	
 	  Table.prototype.getColGroup = function getColGroup(columns, fixed) {
 	    var cols = [];
+	    var _state = this.state,
+	        _state$contentWidthDi = _state.contentWidthDiff,
+	        contentWidthDiff = _state$contentWidthDi === undefined ? 0 : _state$contentWidthDi,
+	        _state$lastShowIndex = _state.lastShowIndex,
+	        lastShowIndex = _state$lastShowIndex === undefined ? 0 : _state$lastShowIndex;
+	
 	    if (this.props.expandIconAsCell && fixed !== 'right') {
 	      cols.push(_react2['default'].createElement('col', {
 	        className: this.props.clsPrefix + '-expand-icon-col',
@@ -9645,14 +9692,20 @@
 	    }
 	    var leafColumns = void 0;
 	    if (fixed === 'left') {
+	      contentWidthDiff = 0;
 	      leafColumns = this.columnManager.leftLeafColumns();
 	    } else if (fixed === 'right') {
+	      contentWidthDiff = 0;
 	      leafColumns = this.columnManager.rightLeafColumns();
 	    } else {
 	      leafColumns = this.columnManager.leafColumns();
 	    }
-	    cols = cols.concat(leafColumns.map(function (c) {
+	    cols = cols.concat(leafColumns.map(function (c, i, arr) {
-	      return _react2['default'].createElement('col', { key: c.key, style: { width: c.width, minWidth: c.width } });
+	      var width = c.width;
+	      if (lastShowIndex == i) {
+	        width = parseInt(width) + contentWidthDiff;
+	      }
+	      return _react2['default'].createElement('col', { key: c.key, style: { width: width, minWidth: c.width } });
 	    }));
 	    return _react2['default'].createElement(
 	      'colgroup',
@@ -9962,6 +10015,8 @@
 	  };
 	
 	  Table.prototype.render = function render() {
+	    var _this5 = this;
+	
 	    var props = this.props;
 	    var clsPrefix = props.clsPrefix;
 	
@@ -9986,7 +10041,9 @@
 	    }
 	    return _react2['default'].createElement(
 	      'div',
-	      { className: className, style: props.style },
+	      { className: className, style: props.style, ref: function ref(el) {
+	          return _this5.contentTable = el;
+	        } },
 	      this.getTitle(),
 	      _react2['default'].createElement(
 	        'div',
@@ -10217,7 +10274,8 @@
 	        needIndentSpaced = _props7.needIndentSpaced,
 	        indent = _props7.indent,
 	        indentSize = _props7.indentSize,
-	        isHiddenExpandIcon = _props7.isHiddenExpandIcon;
+	        isHiddenExpandIcon = _props7.isHiddenExpandIcon,
+	        fixed = _props7.fixed;
 	    var className = this.props.className;
 	
 	
@@ -10257,6 +10315,7 @@
 	        index: index,
 	        column: columns[i],
 	        key: columns[i].key,
+	        fixed: fixed,
 	        expandIcon: isColumnHaveExpandIcon ? expandIcon : null
 	      }));
 	    }
@@ -10367,10 +10426,11 @@
 	        indent = _props2.indent,
 	        index = _props2.index,
 	        expandIcon = _props2.expandIcon,
-	        column = _props2.column;
+	        column = _props2.column,
+	        fixed = _props2.fixed;
 	    var dataIndex = column.dataIndex,
-	        render = column.render,
+	        render = column.render;
-	        _column$className = column.className,
+	    var _column$className = column.className,
 	        className = _column$className === undefined ? '' : _column$className;
 	
 	
@@ -10401,6 +10461,10 @@
 	    if (rowSpan === 0 || colSpan === 0) {
 	      return null;
 	    }
+	    //不是固定表格并且当前列是固定，则隐藏当前列
+	    if (column.fixed && !fixed) {
+	      className = className + (clsPrefix + '-fixed-columns-in-body');
+	    }
 	    return _react2['default'].createElement(
 	      'td',
 	      {
@@ -10939,13 +11003,21 @@
 	      _this.props.onDrop(event, data);
 	    };
 	
-	    _this.onMouseMove = function (event, data) {
+	    _this.onMouseOver = function (event, data) {
-	      if (_this.border) return;
+	      //如果是固定列没有拖拽功能
+	      if (_this.border || data.fixed) return;
 	      var clsPrefix = _this.props.clsPrefix;
 	
 	      event.target.className = clsPrefix + '-thead-th-drag-gap th-drag-gap-hover';
 	    };
 	
+	    _this.onMouseMove = function (event, data) {
+	      //如果是固定列没有拖拽功能
+	      if (_this.border || data.fixed) return;
+	      // const {clsPrefix} = this.props; 
+	      // event.target.className = `${clsPrefix}-thead-th-drag-gap th-drag-gap-hover`;
+	    };
+	
 	    _this.onMouseOut = function (event, data) {
 	      if (_this.border) return;
 	      var clsPrefix = _this.props.clsPrefix;
@@ -10955,7 +11027,9 @@
 	
 	    _this.onMouseDown = function (event, data) {
 	      _this.border = true;
-	      var clsPrefix = _this.props.clsPrefix;
+	      var _this$props = _this.props,
+	          clsPrefix = _this$props.clsPrefix,
+	          contentTable = _this$props.contentTable;
 	
 	      _this.drag.initPageLeftX = event.pageX;
 	      _this.drag.initLeft = (0, _utils.tryParseInt)(event.target.style.left);
@@ -10964,6 +11038,8 @@
 	        return da.key == data.key;
 	      });
 	      _this.drag.width = _this.drag.data[_this.drag.currIndex].width;
+	
+	      _this.contentTableWidth = contentTable.width;
 	    };
 	
 	    _this.onMouseUp = function (event, data) {
@@ -10979,10 +11055,23 @@
 	
 	    _this.onThMouseMove = function (event, data) {
 	      if (!_this.border) return;
-	      var dragborderKey = _this.props.dragborderKey;
+	      var _this$props2 = _this.props,
+	          dragborderKey = _this$props2.dragborderKey,
+	          contentTable = _this$props2.contentTable;
 	
-	      console.log(data);
 	      var x = event.pageX - _this.drag.initPageLeftX + _this.drag.initLeft - 0;
+	      if (!_this.contentTableWidth) {
+	        _this.contentTableWidth = contentTable.clientWidth;
+	      }
+	      var newTableWidth = _this.contentTableWidth + x;
+	      var newWidth = _this.drag.width + x;
+	      if (newWidth < _this.props.minColumnWidth) {
+	        //清楚样式
+	        var moveDom = event.target.querySelector('.th-drag-gap-hover');
+	        moveDom && moveDom.classList.remove('th-drag-gap-hover');
+	        // event.target.classList.remove('th-drag-gap-hover');
+	        return;
+	      }
 	      //设置hiden的left
 	      //"u-table-drag-hide-table"
 	      var currentHideDom = document.getElementById("u-table-drag-hide-table-" + dragborderKey).getElementsByTagName("div")[_this.drag.currIndex];
@@ -11004,9 +11093,11 @@
 	
 	      //设置当前的宽度 
 	      var currentData = _this.drag.data[_this.drag.currIndex];
-	      currentData.width = _this.drag.width + x;
+	      currentData.width = newWidth;
 	      var currentDom = document.getElementById("u-table-drag-thead-" + _this.theadKey).getElementsByTagName("th")[_this.drag.currIndex];
-	      currentDom.style.width = currentData.width + "px";
+	      currentDom.style.width = newWidth + "px";
+	      // this.contentTableWidth = newTableWidth;
+	      contentTable.style.width = newTableWidth + 'px';
 	      _this.drag.x = x;
 	    };
 	
@@ -11056,7 +11147,10 @@
 	        onMouseMove = _props.onMouseMove,
 	        onMouseUp = _props.onMouseUp,
 	        dragborder = _props.dragborder,
-	        onMouseOut = _props.onMouseOut;
+	        onMouseOut = _props.onMouseOut,
+	        contentWidthDiff = _props.contentWidthDiff,
+	        fixed = _props.fixed,
+	        lastShowIndex = _props.lastShowIndex;
 	
 	    var attr = dragborder ? { id: 'u-table-drag-thead-' + this.theadKey } : {};
 	    return _react2['default'].createElement(
@@ -11066,9 +11160,16 @@
 	        return _react2['default'].createElement(
 	          'tr',
 	          { key: index, style: rowStyle },
-	          row.map(function (da, i) {
+	          row.map(function (da, i, arr) {
 	            var thHover = da.drgHover ? ' ' + clsPrefix + '-thead th-drag-hover' : "";
 	            delete da.drgHover;
+	            var fixedStyle = '';
+	            if (!fixed && da.fixed) {
+	              fixedStyle = clsPrefix + '-row-fixed-columns-in-body';
+	            }
+	            if (lastShowIndex == i) {
+	              da.width = parseInt(da.width) + contentWidthDiff;
+	            }
 	            if (draggable) {
 	              return _react2['default'].createElement('th', _extends({}, da, {
 	                onDragStart: function onDragStart(event) {
@@ -11084,20 +11185,21 @@
 	                  _this2.onDragEnter(event, da);
 	                },
 	                draggable: draggable,
-	                className: da.className + ' ' + clsPrefix + '-thead th-drag ' + thHover,
+	                className: da.className + ' ' + clsPrefix + '-thead th-drag ' + thHover + ' ' + fixedStyle,
 	                key: da.key }));
 	            } else if (dragborder) {
+	
 	              return _react2['default'].createElement(
 	                'th',
 	                {
-	                  style: { width: da.width, minWidth: da.width },
+	                  style: { width: da.width },
 	                  onMouseMove: function onMouseMove(event) {
 	                    _this2.onThMouseMove(event, da);
 	                  },
 	                  onMouseUp: function onMouseUp(event) {
 	                    _this2.onThMouseUp(event, da);
 	                  },
-	                  className: da.className + ' ' + clsPrefix + '-thead-th ',
+	                  className: da.className + ' ' + clsPrefix + '-thead-th  ' + fixedStyle,
 	                  key: i },
 	                da.children,
 	                _react2['default'].createElement('div', { ref: function ref(el) {
@@ -11115,12 +11217,15 @@
 	                  onMouseUp: function onMouseUp(event) {
 	                    _this2.onMouseUp(event, da);
 	                  },
+	                  onMouseOver: function onMouseOver(event) {
+	                    _this2.onMouseOver(event, da);
+	                  },
 	                  className: clsPrefix + '-thead-th-drag-gap ' })
 	              );
 	            } else {
-	              var th = da.onClick ? _react2['default'].createElement('th', _extends({}, da, { key: i, onClick: function onClick(event) {
+	              var th = da.onClick ? _react2['default'].createElement('th', _extends({}, da, { className: ' ' + fixedStyle, key: i, onClick: function onClick(event) {
 	                  da.onClick(da, event);
-	                } })) : _react2['default'].createElement('th', _extends({}, da, { key: i }));
+	                } })) : _react2['default'].createElement('th', _extends({}, da, { key: i, className: ' ' + fixedStyle }));
 	              return th;
 	            }
 	          })
@@ -11132,6 +11237,9 @@
 	  return TableHeader;
 	}(_react.Component);
 	
+	TableHeader.defaultProps = {
+	  contentWidthDiff: 0
+	};
 	;
 	
 	TableHeader.propTypes = propTypes;
@@ -11158,6 +11266,7 @@
 	exports.addClass = addClass;
 	exports.removeClass = removeClass;
 	exports.ObjectAssign = ObjectAssign;
+	exports.closest = closest;
 	
 	var _warning = __webpack_require__(31);
 	
@@ -11290,6 +11399,23 @@
 	  }
 	  return tagObj;
 	}
+	/**
+	 * 获取某个父元素
+	 * */
+	
+	function closest(ele, selector) {
+	  var matches = ele.matches || ele.webkitMatchesSelector || ele.mozMatchesSelector || ele.msMatchesSelector;
+	  if (matches) {
+	    while (ele) {
+	      if (matches.call(ele, selector)) {
+	        return ele;
+	      } else {
+	        ele = ele.parentElement;
+	      }
+	    }
+	  }
+	  return null;
+	}
 
 /***/ }),
 /* 101 */
@@ -11731,12 +11857,13 @@
 	//行控制管理
 	
 	var ColumnManager = function () {
-	  function ColumnManager(columns, elements) {
+	  function ColumnManager(columns, elements, originWidth) {
 	    _classCallCheck(this, ColumnManager);
 	
 	    this._cached = {};
 	
 	    this.columns = columns || this.normalize(elements);
+	    this.originWidth = originWidth;
 	  }
 	
 	  ColumnManager.prototype.isAnyColumnsFixed = function isAnyColumnsFixed() {
@@ -11789,35 +11916,53 @@
 	    });
 	  };
 	
-	  ColumnManager.prototype.leafColumns = function leafColumns() {
+	  ColumnManager.prototype.centerColumns = function centerColumns() {
 	    var _this6 = this;
 	
+	    return this._cache('centerColumns', function () {
+	      return _this6.groupedColumns().filter(function (column) {
+	        return !column.fixed;
+	      });
+	    });
+	  };
+	
+	  ColumnManager.prototype.leafColumns = function leafColumns() {
+	    var _this7 = this;
+	
 	    return this._cache('leafColumns', function () {
-	      return _this6._leafColumns(_this6.columns);
+	      return _this7._leafColumns(_this7.columns);
 	    });
 	  };
 	
 	  ColumnManager.prototype.leftLeafColumns = function leftLeafColumns() {
-	    var _this7 = this;
+	    var _this8 = this;
 	
 	    return this._cache('leftLeafColumns', function () {
-	      return _this7._leafColumns(_this7.leftColumns());
+	      return _this8._leafColumns(_this8.leftColumns());
 	    });
 	  };
 	
 	  ColumnManager.prototype.rightLeafColumns = function rightLeafColumns() {
-	    var _this8 = this;
+	    var _this9 = this;
 	
 	    return this._cache('rightLeafColumns', function () {
-	      return _this8._leafColumns(_this8.rightColumns());
+	      return _this9._leafColumns(_this9.rightColumns());
+	    });
+	  };
+	
+	  ColumnManager.prototype.centerLeafColumns = function centerLeafColumns() {
+	    var _this10 = this;
+	
+	    return this._cache('centerLeafColumns', function () {
+	      return _this10._leafColumns(_this10.centerColumns());
 	    });
 	  };
 	
 	  // add appropriate rowspan and colspan to column
 	
 	
-	  ColumnManager.prototype.groupedColumns = function groupedColumns() {
+	  ColumnManager.prototype.groupedColumns = function groupedColumns(type) {
-	    var _this9 = this;
+	    var _this11 = this;
 	
 	    return this._cache('groupedColumns', function () {
 	      var _groupColumns = function _groupColumns(columns) {
@@ -11836,7 +11981,17 @@
 	          }
 	        };
 	        columns.forEach(function (column, index) {
-	          var newColumn = _extends({}, column);
+	          var defaultOpt = {
+	            ifshow: true
+	          };
+	          if (!_this11.originWidth) {
+	            defaultOpt.width = 200;
+	          }
+	          //获取非固定列
+	          if (type == 'nofixed' && column.fixed) {
+	            return false;
+	          }
+	          var newColumn = _extends({}, defaultOpt, column);
 	          rows[currentRow].push(newColumn);
 	          parentColumn.colSpan = parentColumn.colSpan || 0;
 	          if (newColumn.children && newColumn.children.length > 0) {
@@ -11857,22 +12012,22 @@
 	        });
 	        return grouped;
 	      };
-	      return _groupColumns(_this9.columns);
+	      return _groupColumns(_this11.columns);
 	    });
 	  };
 	
 	  ColumnManager.prototype.normalize = function normalize(elements) {
-	    var _this10 = this;
+	    var _this12 = this;
 	
 	    var columns = [];
 	    _react2['default'].Children.forEach(elements, function (element) {
-	      if (!_this10.isColumnElement(element)) return;
+	      if (!_this12.isColumnElement(element)) return;
 	      var column = _extends({}, element.props);
 	      if (element.key) {
 	        column.key = element.key;
 	      }
 	      if (element.type === _ColumnGroup2['default']) {
-	        column.children = _this10.normalize(column.children);
+	        column.children = _this12.normalize(column.children);
 	      }
 	      columns.push(column);
 	    });
@@ -11888,6 +12043,49 @@
 	    this._cached = {};
 	  };
 	
+	  ColumnManager.prototype.getColumnWidth = function getColumnWidth() {
+	    var columns = this.groupedColumns();
+	    var res = { computeWidth: 0, lastShowIndex: 0 };
+	    columns.forEach(function (col, index) {
+	      //如果列显示
+	      if (col.ifshow) {
+	        res.computeWidth += parseInt(col.width);
+	        if (!col.fixed) {
+	          res.lastShowIndex = index;
+	        }
+	      }
+	    });
+	    return res;
+	  };
+	
+	  ColumnManager.prototype.getLeftColumnsWidth = function getLeftColumnsWidth() {
+	    var _this13 = this;
+	
+	    return this._cache('leftColumnsWidth', function () {
+	      var leftColumnsWidth = 0;
+	      _this13.groupedColumns().forEach(function (column) {
+	        if (column.fixed === 'left' || column.fixed === true) {
+	          leftColumnsWidth += column.width;
+	        }
+	      });
+	      return leftColumnsWidth;
+	    });
+	  };
+	
+	  ColumnManager.prototype.getRightColumnsWidth = function getRightColumnsWidth() {
+	    var _this14 = this;
+	
+	    return this._cache('rightColumnsWidth', function () {
+	      var rightColumnsWidth = 0;
+	      _this14.groupedColumns().forEach(function (column) {
+	        if (column.fixed === 'right') {
+	          rightColumnsWidth += column.width;
+	        }
+	      });
+	      return rightColumnsWidth;
+	    });
+	  };
+	
 	  ColumnManager.prototype._cache = function _cache(name, fn) {
 	    if (name in this._cached) {
 	      return this._cached[name];
@@ -11896,15 +12094,27 @@
 	    return this._cached[name];
 	  };
 	
+	  //todo 含有children的宽度计算
+	
+	
 	  ColumnManager.prototype._leafColumns = function _leafColumns(columns) {
-	    var _this11 = this;
+	    var _this15 = this;
 	
 	    var leafColumns = [];
+	
 	    columns.forEach(function (column) {
 	      if (!column.children) {
-	        leafColumns.push(column);
+	
+	        var defaultOpt = {
+	          ifshow: true
+	        };
+	        if (!_this15.originWidth) {
+	          defaultOpt.width = 200;
+	        }
+	        var newColumn = _extends({}, defaultOpt, column);
+	        leafColumns.push(newColumn);
 	      } else {
-	        leafColumns.push.apply(leafColumns, _toConsumableArray(_this11._leafColumns(column.children)));
+	        leafColumns.push.apply(leafColumns, _toConsumableArray(_this15._leafColumns(column.children)));
 	      }
 	    });
 	    return leafColumns;
@@ -11950,7 +12160,8 @@
 	  width: _propTypes2['default'].oneOfType([_propTypes2['default'].number, _propTypes2['default'].string]),
 	  fixed: _propTypes2['default'].oneOf([true, 'left', 'right']),
 	  render: _propTypes2['default'].func,
-	  onCellClick: _propTypes2['default'].func
+	  onCellClick: _propTypes2['default'].func,
+	  ifshow: _propTypes2['default'].bool
 	};
 	
 	var Column = function (_Component) {
@@ -11965,6 +12176,11 @@
 	  return Column;
 	}(_react.Component);
 	
+	Column.defaultProps = {
+	  ifshow: true
+	};
+	
+	
 	Column.propTypes = propTypes;
 	
 	exports['default'] = Column;
@@ -13365,7 +13581,7 @@
 	          }),
 	          key: "checkbox",
 	          dataIndex: "checkbox",
-	          width: "100px",
+	          width: "100",
 	          render: function render(text, record, index) {
 	            var rowKey = record["key"] ? record["key"] : _this2.getRowKey(record, i);
 	            var bool = checkedObj.hasOwnProperty(rowKey);
@@ -13764,7 +13980,7 @@
 	          }
 	          return item;
 	        });
-	        return _react2["default"].createElement(Table, _extends({}, _this.props, { loading: false, footerScroll: true, showHeader: false, columns: columns_sum, data: obj }));
+	        return _react2["default"].createElement(Table, _extends({}, _this.props, { loading: false, footerScroll: true, showHeader: false, columns: columns_sum, data: obj, originWidth: true }));
 	      };
 	
 	      _this.currentTreeFooter = function () {
@@ -13816,7 +14032,7 @@
 	
 	        var _sumArray = [_extends({ key: "sumData", showSum: "合计" }, _countObj)];
 	        columns[0] = _extends({}, columns[0], columns2);
-	        return _react2["default"].createElement(Table, _extends({}, _this.props, { bordered: false, loading: false, footerScroll: true, showHeader: false, columns: columns, data: _sumArray }));
+	        return _react2["default"].createElement(Table, _extends({}, _this.props, { bordered: false, loading: false, footerScroll: true, showHeader: false, columns: columns, data: _sumArray, originWidth: true }));
 	      };
 	
 	      _this.getNodeItem = function (array, newArray) {
@@ -13882,7 +14098,8 @@
 	        footerScroll: true,
 	        columns: this.props.columns,
 	        data: this.props.data,
-	        footer: this.setFooterRender
+	        footer: this.setFooterRender,
+	        originWidth: true
 	      }));
 	    };
 	
@@ -57354,10 +57571,10 @@
 	        onDragOver: this.onDragOver,
 	        onDrop: this.onDrop,
 	        onDragEnter: this.onDragEnter,
-	        draggable: draggable
+	        draggable: draggable,
-	        // dragborder={dragborder}
+	        dragborder: dragborder
-	        , dragborder: false,
+	        // dragborder={false}
-	        dragborderKey: key
+	        , dragborderKey: key
 	      }));
 	    };
 	

src/Column.js

@@ -16,11 +16,14 @@ const propTypes = {
       'right',
     ]),
     render: PropTypes.func,
-    onCellClick: PropTypes.func
+    onCellClick: PropTypes.func,
+    ifshow:PropTypes.bool
 }
 
 class Column extends Component {
-
+  static defaultProps = {
+    ifshow:true
+  }
 }
 
 Column.propTypes = propTypes;

src/ColumnManager.js

@@ -7,8 +7,9 @@ import ColumnGroup from './ColumnGroup';
 export default class ColumnManager {
   _cached = {}
 
-  constructor(columns, elements) {
+  constructor(columns, elements,originWidth) {
     this.columns = columns || this.normalize(elements);
+    this.originWidth = originWidth;
   }
 
   isAnyColumnsFixed() {
@@ -48,6 +49,14 @@ export default class ColumnManager {
       );
     });
   }
+  
+  centerColumns() {
+    return this._cache('centerColumns', () => {
+      return this.groupedColumns().filter(
+        column => !column.fixed 
+      );
+    });
+  }
 
   leafColumns() {
     return this._cache('leafColumns', () =>
@@ -66,9 +75,14 @@ export default class ColumnManager {
       this._leafColumns(this.rightColumns())
     );
   }
+  centerLeafColumns() {
+    return this._cache('centerLeafColumns', () =>
+      this._leafColumns(this.centerColumns())
+    );
+  }
 
   // add appropriate rowspan and colspan to column
-  groupedColumns() {
+  groupedColumns(type) {
     return this._cache('groupedColumns', () => {
       const _groupColumns = (columns, currentRow = 0, parentColumn = {}, rows = []) => {
         // track how many rows we got
@@ -85,7 +99,17 @@ export default class ColumnManager {
           }
         };
         columns.forEach((column, index) => {
-          const newColumn = { ...column };
+          let defaultOpt= {
+            ifshow:true
+          }
+          if(!this.originWidth){
+            defaultOpt.width = 200
+          }
+          //获取非固定列
+          if(type=='nofixed' && column.fixed){
+            return false;
+          }
+          const newColumn = { ...defaultOpt,...column };
           rows[currentRow].push(newColumn);
           parentColumn.colSpan = parentColumn.colSpan || 0;
           if (newColumn.children && newColumn.children.length > 0) {
@@ -134,6 +158,44 @@ export default class ColumnManager {
     this.columns = columns || this.normalize(elements);
     this._cached = {};
   }
+  getColumnWidth(){
+    let columns = this.groupedColumns();
+    let res={computeWidth:0,lastShowIndex:0};
+    columns.forEach((col,index)=>{
+      //如果列显示
+      if(col.ifshow){
+        res.computeWidth += parseInt(col.width);
+        if(!col.fixed){
+          res.lastShowIndex = index;
+        }
+      }
+    })
+    return res;
+  }
+
+  getLeftColumnsWidth() {
+    return this._cache('leftColumnsWidth', () => {
+       let leftColumnsWidth =0;
+       this.groupedColumns().forEach(column =>{
+        if (column.fixed === 'left' || column.fixed === true){
+          leftColumnsWidth += column.width;
+        }
+       });
+       return leftColumnsWidth;
+    });
+  }
+
+  getRightColumnsWidth() {
+    return this._cache('rightColumnsWidth', () => {
+      let rightColumnsWidth =0;
+      this.groupedColumns().forEach(column =>{
+       if (column.fixed === 'right'){
+        rightColumnsWidth += column.width;
+       }
+      });
+      return rightColumnsWidth;
+    });
+  }
 
   _cache(name, fn) {
     if (name in this._cached) {
@@ -143,11 +205,21 @@ export default class ColumnManager {
     return this._cached[name];
   }
 
+  //todo 含有children的宽度计算
   _leafColumns(columns) {
     const leafColumns = [];
+ 
     columns.forEach(column => {
       if (!column.children) {
-        leafColumns.push(column);
+
+        let defaultOpt= {
+          ifshow:true
+        }
+        if(!this.originWidth){
+          defaultOpt.width = 200
+        }
+        const newColumn = { ...defaultOpt,...column };
+        leafColumns.push(newColumn);
       } else {
         leafColumns.push(...this._leafColumns(column.children));
       }

src/Table.js

@@ -40,8 +40,8 @@ const propTypes = {
     rowRef: PropTypes.func,
     getBodyWrapper: PropTypes.func,
     children: PropTypes.node,
-
     draggable: PropTypes.bool,
+    minColumnWidth:PropTypes.number
 };
 
 const defaultProps = {
@@ -68,6 +68,7 @@ const defaultProps = {
     rowRef: () => null,
     getBodyWrapper: body => body,
     emptyText: () => 'No Data',
+    minColumnWidth:80
 };
 
 class Table extends Component{
@@ -75,7 +76,7 @@ class Table extends Component{
       super(props);
       let expandedRowKeys = [];
       let rows = [...props.data];
-      this.columnManager = new ColumnManager(props.columns, props.children);
+      this.columnManager = new ColumnManager(props.columns, props.children,props.originWidth);
       this.store = createStore({ currentHoverKey: null });
 
       if (props.defaultExpandAllRows) {
@@ -121,17 +122,22 @@ class Table extends Component{
     this.detectScrollTarget = this.detectScrollTarget.bind(this);
     this.handleBodyScroll = this.handleBodyScroll.bind(this);
     this.handleRowHover = this.handleRowHover.bind(this);
-
+    this.computeTableWidth = this.computeTableWidth.bind(this);
   }
 
   componentDidMount() {
     setTimeout(this.resetScrollY,300);
+    //后续也放在recevice里面
+    if(!this.props.originWidth){
+      this.computeTableWidth();
+    }
     if (this.columnManager.isAnyColumnsFixed()) {
       this.syncFixedTableRowHeight();
       this.resizeEvent = addEventListener(
         window, 'resize', debounce(this.syncFixedTableRowHeight, 150)
       );
     }
+
   }
 
   componentWillReceiveProps(nextProps) {
@@ -153,6 +159,10 @@ class Table extends Component{
     } else if (nextProps.children !== this.props.children) {
       this.columnManager.reset(null, nextProps.children);
     }
+    if(!nextProps.originWidth){
+      this.computeTableWidth();
+    }
+    
   }
 
   componentDidUpdate() {
@@ -167,6 +177,27 @@ class Table extends Component{
     }
   }
 
+  computeTableWidth(){
+      //计算总表格宽度、根据表格宽度和各列的宽度和比较，重置最后一列
+      this.contentWidth = this.contentTable.clientWidth//表格宽度
+      //如果用户传了scroll.x按用户传的为主
+      let setWidthParam = this.props.scroll.x
+      if(setWidthParam){
+        if(typeof(setWidthParam)=='string' && setWidthParam.indexOf('%')){
+          this.contentWidth = this.contentWidth * parseInt(setWidthParam) /100
+        }else{
+          this.contentWidth = parseInt(setWidthParam);
+        }
+      }
+      const computeObj = this.columnManager.getColumnWidth();
+      let lastShowIndex = computeObj.lastShowIndex;
+      this.computeWidth = computeObj.computeWidth;
+      if(this.computeWidth < this.contentWidth){
+        let contentWidthDiff = this.contentWidth - this.computeWidth;
+        this.setState({contentWidthDiff,lastShowIndex});
+      }
+
+  }
   onExpandedRowsChange(expandedRowKeys) {
     if (!this.props.expandedRowKeys) {
       this.setState({ expandedRowKeys });
@@ -223,7 +254,7 @@ class Table extends Component{
 
   getHeader(columns, fixed) {
     const { showHeader, expandIconAsCell, clsPrefix ,onDragStart,onDragEnter,onDragOver,onDrop,draggable,
-      onMouseDown,onMouseMove,onMouseUp,dragborder,onThMouseMove,dragborderKey} = this.props;
+      onMouseDown,onMouseMove,onMouseUp,dragborder,onThMouseMove,dragborderKey,minColumnWidth} = this.props;
     const rows = this.getHeaderRows(columns);
     if (expandIconAsCell && fixed !== 'right') {
       rows[0].unshift({
@@ -237,14 +268,23 @@ class Table extends Component{
     const trStyle = fixed ? this.getHeaderRowStyle(columns, rows) : null;
     let drop = draggable?{onDragStart,onDragOver,onDrop,onDragEnter,draggable}:{};
     let dragBorder = dragborder?{onMouseDown,onMouseMove,onMouseUp,dragborder,onThMouseMove,dragborderKey}:{};
-
+    let contentWidthDiff = 0;
+    //非固定表格,宽度不够时自动扩充
+    if(!fixed){
+      contentWidthDiff =  this.state.contentWidthDiff
+    }
     return showHeader ? (
       <TableHeader
         {...drop}
         {...dragBorder}
+        minColumnWidth={minColumnWidth}
+        contentWidthDiff = {contentWidthDiff}
+        lastShowIndex = {this.state.lastShowIndex}
         clsPrefix={clsPrefix}
         rows={rows}
+        contentTable = {this.contentTable}
         rowStyle={trStyle}
+        fixed={fixed}
       />
     ) : null;
   }
@@ -264,6 +304,7 @@ class Table extends Component{
         className: column.className || '',
         children: column.title,
         drgHover: column.drgHover,
+        fixed:column.fixed,
         width:column.width
       };
       if(column.onHeadCellClick){
@@ -420,6 +461,7 @@ class Table extends Component{
           hoverKey={key}
           ref={rowRef}
           store={this.store}
+          fixed={fixed}
         />
       );
       this.treeRowIndex++;
@@ -448,6 +490,7 @@ class Table extends Component{
 
   getColGroup(columns, fixed) {
     let cols = [];
+    let {contentWidthDiff=0,lastShowIndex=0} = this.state;
     if (this.props.expandIconAsCell && fixed !== 'right') {
       cols.push(
         <col
@@ -458,14 +501,20 @@ class Table extends Component{
     }
     let leafColumns;
     if (fixed === 'left') {
+      contentWidthDiff = 0;
       leafColumns = this.columnManager.leftLeafColumns();
     } else if (fixed === 'right') {
+      contentWidthDiff = 0;
       leafColumns = this.columnManager.rightLeafColumns();
     } else {
       leafColumns = this.columnManager.leafColumns();
     }
-    cols = cols.concat(leafColumns.map(c => {
+    cols = cols.concat(leafColumns.map((c,i,arr) => {
-      return <col key={c.key} style={{ width: c.width, minWidth: c.width }} />;
+      let width = c.width;
+      if(lastShowIndex == i ){
+        width = parseInt(width) + contentWidthDiff;
+      }
+      return <col key={c.key} style={{ width: width, minWidth: c.width }} />;
     }));
     return <colgroup>{cols}</colgroup>;
   }
@@ -549,7 +598,7 @@ class Table extends Component{
       ) : null;
       let _drag_class = this.props.dragborder?"table-drag-bordered":""
       return (
-        <table className={` ${tableClassName} table table-bordered ${_drag_class} `} style={tableStyle}>
+        <table className={` ${tableClassName} table table-bordered ${_drag_class} `} style={tableStyle}  >
           {this.props.dragborder?null:this.getColGroup(columns, fixed)}
           {hasHead ? this.getHeader(columns, fixed) : null}
           {tableBody}
@@ -774,7 +823,7 @@ class Table extends Component{
       };
     }
     return (
-      <div className={className} style={props.style}>
+      <div className={className} style={props.style} ref={el => this.contentTable = el}>
         {this.getTitle()}
         <div className={`${clsPrefix}-content`}>
           {this.columnManager.isAnyColumnsLeftFixed() &&

src/Table.scss

@@ -268,6 +268,9 @@ $table-move-in-color: $bg-color-base;
 
     th{
       background: $table-head-background-color;
+      overflow: hidden;
+      white-space: nowrap;
+      text-overflow: ellipsis;
     }
     .th-drag{
       cursor: pointer;
@@ -289,14 +292,16 @@ $table-move-in-color: $bg-color-base;
         top: 0;
         background:transparent;
         width: 2px;
-        cursor: col-resize;
+        
         box-sizing: border-box;
+        z-index: 100;
       }
       .th-drag-gap{
         background:transparent;
       }
       .th-drag-gap-hover{
         background: #ccc;
+        cursor: col-resize;
       }
     }
     &-th:last-child {
@@ -349,6 +354,10 @@ $table-move-in-color: $bg-color-base;
     }
   }
   //拖拽宽度代码
+  &-row-fixed-columns-in-body{
+    visibility: hidden;
+    pointer-events: none;
+  }
 }
 
 .u-table.bordered {

src/TableCell.js

@@ -30,8 +30,9 @@ class TableCell extends Component{
   }
   render() {
     const { record, indentSize, clsPrefix, indent,
-            index, expandIcon, column } = this.props;
+            index, expandIcon, column ,fixed} = this.props;
-    const { dataIndex, render, className = '' } = column;
+    const { dataIndex, render } = column;
+    let {className = ''} = column;
 
     let text = objectPath.get(record, dataIndex);
     let tdProps;
@@ -63,6 +64,10 @@ class TableCell extends Component{
     if (rowSpan === 0 || colSpan === 0) {
       return null;
     }
+    //不是固定表格并且当前列是固定，则隐藏当前列
+    if(column.fixed && !fixed){
+      className = className+`${clsPrefix}-fixed-columns-in-body`;
+    }
     return (
       <td
         colSpan={colSpan}

src/TableHeader.js

@@ -40,7 +40,10 @@ class TableHeader extends Component{
       _row.push(newItem);
     });
     this.drag.data = _row;//JSON.parse(JSON.stringify(this.props.rows[0]));
-
+    
+  }
+  static defaultProps = {
+    contentWidthDiff:0
   }
 
   shouldComponentUpdate(nextProps) {
@@ -71,12 +74,19 @@ class TableHeader extends Component{
     this.props.onDrop(event,data);
   }
 
-
+  onMouseOver=(event,data)=>{
-  onMouseMove=(event,data)=>{
+    //如果是固定列没有拖拽功能
-    if(this.border)return; 
+    if(this.border || data.fixed)return; 
     const {clsPrefix} = this.props; 
     event.target.className = `${clsPrefix}-thead-th-drag-gap th-drag-gap-hover`;
   }
+
+  onMouseMove=(event,data)=>{
+    //如果是固定列没有拖拽功能
+    if(this.border || data.fixed)return; 
+    // const {clsPrefix} = this.props; 
+    // event.target.className = `${clsPrefix}-thead-th-drag-gap th-drag-gap-hover`;
+  }
   onMouseOut=(event,data)=>{
     if(this.border)return;
     const {clsPrefix} = this.props;
@@ -84,12 +94,14 @@ class TableHeader extends Component{
   }
   onMouseDown=(event,data)=>{
     this.border = true;
-    const {clsPrefix} = this.props; 
+    const {clsPrefix,contentTable} = this.props; 
     this.drag.initPageLeftX = event.pageX;
     this.drag.initLeft = tryParseInt(event.target.style.left);
     this.drag.x = this.drag.initLeft;
     this.drag.currIndex = this.props.rows[0].findIndex(da=>da.key==data.key);
     this.drag.width = this.drag.data[this.drag.currIndex].width;
+
+    this.contentTableWidth = contentTable.width;
   }
   onMouseUp=(event,data)=>{
     this.border = false;
@@ -102,9 +114,20 @@ class TableHeader extends Component{
    
   onThMouseMove=(event,data)=>{ 
     if(!this.border)return;
-    const {dragborderKey} = this.props;
+    const {dragborderKey,contentTable} = this.props;
-    console.log(data);
     let x = (event.pageX - this.drag.initPageLeftX) + this.drag.initLeft-0;
+    if(!this.contentTableWidth){
+      this.contentTableWidth = contentTable.clientWidth;
+    }
+    const newTableWidth = this.contentTableWidth + x;
+    const newWidth = this.drag.width + x;
+    if(newWidth<this.props.minColumnWidth){
+      //清楚样式
+      let moveDom = event.target.querySelector('.th-drag-gap-hover');
+      moveDom && moveDom.classList.remove('th-drag-gap-hover');
+      // event.target.classList.remove('th-drag-gap-hover');
+      return
+    }
     //设置hiden的left
     //"u-table-drag-hide-table"
     let currentHideDom = document.getElementById("u-table-drag-hide-table-"+dragborderKey).getElementsByTagName("div")[this.drag.currIndex];
@@ -126,15 +149,18 @@ class TableHeader extends Component{
 
     //设置当前的宽度 
     let  currentData = this.drag.data[this.drag.currIndex]; 
-    currentData.width = this.drag.width + x; 
+    currentData.width = newWidth; 
     let  currentDom = document.getElementById("u-table-drag-thead-"+this.theadKey).getElementsByTagName("th")[this.drag.currIndex];
-    currentDom.style.width = (currentData.width)+"px"; 
+    currentDom.style.width = newWidth+"px"; 
+    // this.contentTableWidth = newTableWidth;
+    contentTable.style.width = newTableWidth+'px';
     this.drag.x = x; 
+
   }
  
   render() {
     const { clsPrefix, rowStyle ,onDragStart,onDragOver,onDrop,draggable,rows,
-      onMouseDown,onMouseMove,onMouseUp,dragborder,onMouseOut
+      onMouseDown,onMouseMove,onMouseUp,dragborder,onMouseOut,contentWidthDiff,fixed,lastShowIndex
       } = this.props;
     let attr = dragborder?{id:`u-table-drag-thead-${this.theadKey}`}:{}
     return (
@@ -142,9 +168,16 @@ class TableHeader extends Component{
         {
           rows.map((row, index) => (
             <tr key={index} style={rowStyle}>
-              {row.map((da, i) => {
+              {row.map((da, i,arr) => {
                 let thHover =  da.drgHover?` ${clsPrefix}-thead th-drag-hover`:""; 
                 delete da.drgHover;
+                let fixedStyle='';
+                if(!fixed && da.fixed){
+                  fixedStyle=`${clsPrefix}-row-fixed-columns-in-body`;
+                }
+                if(lastShowIndex == i){
+                  da.width = parseInt(da.width) + contentWidthDiff;
+                }
                 if(draggable){
                   return ( <th {...da}
                     onDragStart={(event)=>{this.onDragStart(event,da)}} 
@@ -152,14 +185,15 @@ class TableHeader extends Component{
                     onDrop={(event)=>{this.onDrop(event,da)}} 
                     onDragEnter={(event)=>{this.onDragEnter(event,da)}}
                     draggable={draggable}
-                    className={`${da.className} ${clsPrefix}-thead th-drag ${thHover}`}
+                    className={`${da.className} ${clsPrefix}-thead th-drag ${thHover} ${fixedStyle}`}
                     key={da.key} />)
                 }else if(dragborder){
+                    
                     return(<th
-                    style={{width:da.width,minWidth:da.width}}
+                    style={{width:da.width}}
                     onMouseMove={(event)=>{this.onThMouseMove(event,da)}}
                     onMouseUp={(event)=>{this.onThMouseUp(event,da)}}
-                    className={`${da.className} ${clsPrefix}-thead-th `}
+                    className={`${da.className} ${clsPrefix}-thead-th  ${fixedStyle}`}
                     key={i} >
                       {da.children}
                     <div ref={el=>this.gap = el }
@@ -167,10 +201,11 @@ class TableHeader extends Component{
                       onMouseOut={(event)=>{this.onMouseOut(event,da)}}
                       onMouseDown={(event)=>{this.onMouseDown(event,da)}}
                       onMouseUp={(event)=>{this.onMouseUp(event,da)}} 
+                      onMouseOver={(event)=>{this.onMouseOver(event,da)}}
                       className={`${clsPrefix}-thead-th-drag-gap `}></div>
                     </th>)
                 }else{
-                  let th = da.onClick?(<th {...da} key={i} onClick={(event)=>{da.onClick(da,event)}}/>):(<th {...da} key={i} />);
+                  let th = da.onClick?(<th {...da} className={` ${fixedStyle}`} key={i} onClick={(event)=>{da.onClick(da,event)}}/>):(<th {...da} key={i} className={` ${fixedStyle}`} />);
                   return (th);
                 }
             })}

src/TableRow.js

@@ -123,7 +123,7 @@ class TableRow extends Component{
     const {
       clsPrefix, columns, record, height, visible, index,
       expandIconColumnIndex, expandIconAsCell, expanded, expandRowByClick,
-      expandable, onExpand, needIndentSpaced, indent, indentSize,isHiddenExpandIcon
+      expandable, onExpand, needIndentSpaced, indent, indentSize,isHiddenExpandIcon,fixed
     } = this.props;
 
     let { className } = this.props;
@@ -168,6 +168,7 @@ class TableRow extends Component{
           index={index}
           column={columns[i]}
           key={columns[i].key}
+          fixed= {fixed}
           expandIcon={(isColumnHaveExpandIcon) ? expandIcon : null}
         />
       );

src/lib/dragColumn.js

@@ -117,8 +117,8 @@ export default function dragColumn(Table) {
               onDrop={this.onDrop}
               onDragEnter={this.onDragEnter}
               draggable={draggable}
-              // dragborder={dragborder}
+              dragborder={dragborder}
-              dragborder={false}
+              // dragborder={false}
               dragborderKey={key}
           />)
     }

src/lib/multiSelect.js

@@ -199,7 +199,7 @@ export default function multiSelect(Table, Checkbox) {
             ),
             key: "checkbox",
             dataIndex: "checkbox",
-            width: "100px",
+            width: "100",
             render: (text, record, index) => {
               let rowKey = record["key"] ? record["key"] : this.getRowKey(record,i);
               let bool = checkedObj.hasOwnProperty(rowKey);

src/lib/sum.js

@@ -61,7 +61,7 @@ export default function sum(Table) {
         }
         return item;
       });
-      return <Table{...this.props} loading={false} footerScroll showHeader={false} columns={columns_sum} data={obj} />;
+      return <Table{...this.props} loading={false} footerScroll showHeader={false} columns={columns_sum} data={obj} originWidth={true}/>;
     };
 
     currentTreeFooter =()=>{
@@ -84,7 +84,7 @@ export default function sum(Table) {
       }
       let _sumArray = [{key:"sumData",showSum:"合计",..._countObj}];
       columns[0] = Object.assign({}, columns[0], columns2);
-      return <Table{...this.props} bordered={false} loading={false} footerScroll showHeader={false} columns={columns} data={_sumArray} />;
+      return <Table{...this.props} bordered={false} loading={false} footerScroll showHeader={false} columns={columns} data={_sumArray} originWidth={true}/>;
     }
 
     getNodeItem =(array,newArray)=>{
@@ -132,6 +132,7 @@ export default function sum(Table) {
           columns={this.props.columns}
           data={this.props.data}
           footer={this.setFooterRender}
+          originWidth={true}
         />
       );
     }

src/utils.js

@@ -126,3 +126,20 @@ export function ObjectAssign(obj){
   }
   return tagObj;
 }
+/**
+ * 获取某个父元素
+ * */
+
+export function closest(ele, selector) {
+  const matches = ele.matches || ele.webkitMatchesSelector || ele.mozMatchesSelector || ele.msMatchesSelector;
+  if (matches) {
+    while (ele) {
+      if (matches.call(ele, selector)) {
+        return ele;
+      } else {
+        ele = ele.parentElement;
+      }
+    }
+  }
+  return null;
+}