feat: 合并multiSelect 和newmultiSelect

合并multiSelect 和newmultiSelect

BREAKING CHANGE: 合并multiSelect 和newmultiSelect

build/Table.css

@@ -374,6 +374,8 @@
       display: inline-block; }
   .u-table-thead .th-drag {
     cursor: move; }
+  .u-table-thead .th-drag:hover {
+    background: #e3f2fd; }
   .u-table-thead .th-drag-hover {
     background: #ccc; }
   .u-table-thead-th {
@@ -383,18 +385,14 @@
       position: absolute;
       right: 0px;
       top: 0;
-      background: transparent;
+      background: #ccc;
-      width: 1px;
+      width: 2px;
       box-sizing: border-box;
-      z-index: 100; }
+      z-index: 1; }
     .u-table-thead-th .th-drag-gap {
       background: transparent; }
     .u-table-thead-th .th-drag-gap-hover {
-      background: #ccc;
       cursor: col-resize; }
-    .u-table-thead-th.th-can-not-drag .th-drag-gap-hover {
-      cursor: none;
-      width: 0px; }
   .u-table-thead-th:last-child-drag-gap {
     border: none; }
   .u-table-filter-column-pop-cont {

build/TableHeader.js

@@ -61,6 +61,11 @@ var TableHeader = function (_Component) {
     };
 
     _this.onDragOver = function (event, data) {
+      var dragAbleOrBordStart = _this.state.dragAbleOrBordStart;
+
+      _this.setState({
+        dragAbleOrBordStart: ""
+      });
       if (!_this.currentObj || _this.currentObj.key == data.key) return;
       event.preventDefault();
       _this.props.onDragOver(event, data);
@@ -84,7 +89,25 @@ var TableHeader = function (_Component) {
       event.target.className = clsPrefix + "-thead-th-drag-gap th-drag-gap-hover";
     };
 
+    _this.ableOnMouseMove = function (event, data) {
+      var dragAbleOrBord = _this.state.dragAbleOrBord;
+
+      if (dragAbleOrBord === "borderStart" || dragAbleOrBord === "ableStart") return;
+      if (dragAbleOrBord === "able") return;
+      _this.setState({
+        dragAbleOrBord: "able"
+      });
+    };
+
     _this.onMouseMove = function (event, data) {
+      var dragAbleOrBord = _this.state.dragAbleOrBord;
+
+      if (dragAbleOrBord === "borderStart" || dragAbleOrBord === "ableStart") return;
+      if (dragAbleOrBord != "border") {
+        _this.setState({
+          dragAbleOrBord: "border"
+        });
+      }
       //如果是固定列没有拖拽功能
       if (_this.border || data.fixed) return;
       // const {clsPrefix} = this.props;
@@ -99,6 +122,14 @@ var TableHeader = function (_Component) {
     };
 
     _this.onMouseDown = function (event, data) {
+      var _this$state = _this.state,
+          dragAbleOrBord = _this$state.dragAbleOrBord,
+          dragAbleOrBordStart = _this$state.dragAbleOrBordStart;
+
+      _this.setState({
+        dragAbleOrBordStart: dragAbleOrBord === "border" ? "borderStart" : ""
+      });
+      // console.log("-改变宽-----度--",dragAbleOrBordStart);
       _this.border = true;
       var _this$props = _this.props,
           clsPrefix = _this$props.clsPrefix,
@@ -127,6 +158,9 @@ var TableHeader = function (_Component) {
     };
 
     _this.onMouseUp = function (event, data) {
+      _this.setState({
+        dragAbleOrBordStart: ""
+      });
       _this.border = false;
       var clsPrefix = _this.props.clsPrefix;
 
@@ -315,7 +349,11 @@ var TableHeader = function (_Component) {
 
     _this.currentObj = null;
     _this.state = {
-      border: false
+      border: false,
+      dragAbleOrBord: props.draggable ? "able" : "", //border 拖拽列宽，able 交换列,
+      dragAbleOrBordStart: "" // borderStart 开始拖拽宽度 ableStart 开始交换列
+
+      // draggable:props.draggable?props.draggable:false,
     };
     //拖拽宽度处理
     if (!props.dragborder) return _possibleConstructorReturn(_this);
@@ -341,10 +379,25 @@ var TableHeader = function (_Component) {
     return _this;
   }
 
-  TableHeader.prototype.shouldComponentUpdate = function shouldComponentUpdate(nextProps) {
+  TableHeader.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
-    return !(0, _shallowequal2["default"])(nextProps, this.props);
+    if (this.props.draggable != nextProps.draggable) {
+      this.setState({
+        dragAbleOrBord: nextProps.draggable ? "able" : "" //border 拖拽列宽，able 交换列
+        // draggable:nextProps.draggable,
+      });
+    }
+
+    if (this.props.dragborder != nextProps.dragborder) {
+      this.setState({
+        dragAbleOrBord: nextProps.dragborder ? "border" : "" //border 拖拽列宽，able 交换列
+      });
+    }
   };
 
+  // shouldComponentUpdate(nextProps) {
+  //   return !shallowequal(nextProps, this.props);
+  // }
+
   /**
    * @description 过滤输入后的回调函数
    */
@@ -361,6 +414,9 @@ var TableHeader = function (_Component) {
   TableHeader.prototype.render = function render() {
     var _this2 = this;
 
+    var _state = this.state,
+        dragAbleOrBord = _state.dragAbleOrBord,
+        dragAbleOrBordStart = _state.dragAbleOrBordStart;
     var _props = this.props,
         clsPrefix = _props.clsPrefix,
         rowStyle = _props.rowStyle,
@@ -368,19 +424,20 @@ var TableHeader = function (_Component) {
         onDragOver = _props.onDragOver,
         onDrop = _props.onDrop,
         draggable = _props.draggable,
+        dragborder = _props.dragborder,
         rows = _props.rows,
         filterable = _props.filterable,
         onFilterRowsChange = _props.onFilterRowsChange,
         onMouseDown = _props.onMouseDown,
         onMouseMove = _props.onMouseMove,
         onMouseUp = _props.onMouseUp,
-        dragborder = _props.dragborder,
         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(
       "thead",
       _extends({ className: clsPrefix + "-thead" }, attr),
@@ -409,74 +466,103 @@ var TableHeader = function (_Component) {
               da.children = _this2.filterRenderType(da["filtertype"], da.dataindex, i);
               delete da.filterdropdownfocus;
             }
-            if (draggable) {
+
-              return _react2["default"].createElement("th", _extends({}, da, {
+            var thAbleObj = {},
-                onDragStart: function onDragStart(event) {
+                thBorObj = {},
-                  _this2.onDragStart(event, da);
+                thDefaultObj = {},
-                },
+                thLineObj = {};
-                onDragOver: function onDragOver(event) {
+            var thClassName = "" + da.className;
-                  _this2.onDragOver(event, da);
+            if (draggable || dragborder) {
-                },
+              if (draggable && dragAbleOrBordStart != "borderStart") {
-                onDrop: function onDrop(event) {
+                thAbleObj = _extends({}, da, {
-                  _this2.onDrop(event, da);
+                  onDragStart: function onDragStart(e) {
-                },
+                    _this2.onDragStart(e, da);
-                onDragEnter: function onDragEnter(event) {
-                  _this2.onDragEnter(event, da);
-                },
-                draggable: draggable,
-                className: da.className + " " + clsPrefix + "-thead th-drag " + thHover + " " + fixedStyle,
-                key: da.key
-              }));
-            } else if (dragborder) {
-              return _react2["default"].createElement(
-                "th",
-                {
-                  style: { width: da.width },
-                  onMouseMove: function onMouseMove(event) {
-                    _this2.onThMouseMove(event, da);
                   },
-                  onMouseUp: function onMouseUp(event) {
+                  onDragOver: function onDragOver(e) {
-                    _this2.onThMouseUp(event, da);
+                    _this2.onDragOver(e, da);
                   },
-                  className: da.className + " " + clsPrefix + "-thead-th " + canDotDrag + "  " + fixedStyle,
+                  onDrop: function onDrop(e) {
-                  key: i
+                    _this2.onDrop(e, da);
-                },
-                da.children,
-                da.fixed ? "" : _react2["default"].createElement("div", {
-                  ref: function ref(el) {
-                    return _this2.gap = el;
                   },
-                  onMouseMove: function onMouseMove(event) {
+                  onDragEnter: function onDragEnter(e) {
-                    _this2.onMouseMove(event, da);
+                    _this2.onDragEnter(e, da);
                   },
-                  onMouseOut: function onMouseOut(event) {
+                  onMouseMove: function onMouseMove(e) {
-                    _this2.onMouseOut(event, da);
+                    _this2.ableOnMouseMove(e, da);
                   },
-                  onMouseDown: function onMouseDown(event) {
+                  onMouseDown: function onMouseDown(e) {
-                    _this2.onMouseDown(event, da);
+                    var _state2 = _this2.state,
+                        dragAbleOrBord = _state2.dragAbleOrBord,
+                        dragAbleOrBordStart = _state2.dragAbleOrBordStart;
+
+                    _this2.setState({
+                      dragAbleOrBordStart: dragAbleOrBord === "able" ? "ableStart" : ""
+                    });
                   },
-                  onMouseUp: function onMouseUp(event) {
+                  draggable: draggable,
-                    _this2.onMouseUp(event, da);
+                  // className:thObj.className+`${clsPrefix}-thead th-drag ${thHover}`,
+                  key: da.key
+                });
+                thClassName += clsPrefix + "-thead th-drag " + thHover + " ";
+              }
+              // if (dragborder && dragAbleOrBord === "border") {
+              if (dragborder && dragAbleOrBordStart != "ableStart") {
+                thBorObj.style = { 'width': da.width
+                  // thObj.className= thObj.className+`${clsPrefix}-thead-th ${canDotDrag}`,
+                };thBorObj.onMouseMove = function (e) {
+                  if (draggable) {
+                    _this2.ableOnMouseMove(e, da);
+                  }
+                  _this2.onThMouseMove(e, da);
+                };
+                thBorObj.onMouseUp = function (e) {
+                  _this2.onThMouseUp(e, da);
+                };
+
+                thClassName += clsPrefix + "-thead-th " + canDotDrag;
+                thBorObj.style = { width: da.width
+                  // key:i
+                };
+              }
+              // thObj.className = thObj.className+`${fixedStyle}`;
+              thClassName += "" + fixedStyle;
+              if (!da.fixed) {
+                thLineObj = {
+                  onMouseMove: function onMouseMove(e) {
+                    e.stopPropagation();_this2.onMouseMove(e, da);
                   },
-                  onMouseOver: function onMouseOver(event) {
+                  onMouseOut: function onMouseOut(e) {
-                    _this2.onMouseOver(event, da);
+                    _this2.onMouseOut(e, da);
+                  },
+                  onMouseDown: function onMouseDown(e) {
+                    e.stopPropagation();_this2.onMouseDown(e, da);
+                  },
+                  onMouseUp: function onMouseUp(e) {
+                    _this2.onMouseUp(e, da);
+                  },
+                  onMouseOver: function onMouseOver(e) {
+                    _this2.onMouseOver(e, da);
                   },
                   className: clsPrefix + "-thead-th-drag-gap "
-                })
+                };
+              }
+              return _react2["default"].createElement(
+                "th",
+                _extends({ key: Math.random() }, thAbleObj, thBorObj, { className: thClassName }),
+                da.children,
+                da.fixed ? "" : _react2["default"].createElement("div", _extends({ ref: function ref(el) {
+                    return _this2.gap = el;
+                  } }, thLineObj))
               );
             } else {
-              var th = void 0;
+              thDefaultObj = _extends({}, da, {
-              th = da.onClick ? _react2["default"].createElement("th", _extends({}, da, {
                 className: da.className + " " + fixedStyle,
-                key: i,
+                key: i
-                onClick: function onClick(event) {
+              });
-                  da.onClick(da, event);
+              da.onClick ? thDefaultObj.onClick = function (e) {
-                }
+                da.onClick(da, e);
-              })) : _react2["default"].createElement("th", _extends({}, da, {
+              } : "";
-                key: i,
+              return _react2["default"].createElement("th", thDefaultObj);
-                className: da.className + "  " + fixedStyle
-              }));
-              return th;
             }
           })
         );

build/lib/multiSelect.js

@@ -12,263 +12,209 @@ var _react = require('react');
 
 var _react2 = _interopRequireDefault(_react);
 
+var _beeCheckbox = require('bee-checkbox');
+
+var _beeCheckbox2 = _interopRequireDefault(_beeCheckbox);
+
+var _util = require('./util');
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
 function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
 
-function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
-
 function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
 
 function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
 
 function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
 
-function indexOf(array, val) {
-  for (var i = 0; i < array.length; i++) {
-    if (array[i] === val) return i;
-  }
-  return -1;
-};
-
-function remove(array, val) {
-  var index = indexOf(array, val);
-  if (index > -1) {
-    array.splice(index, 1);
-  }
-};
-
 /**
- * multiSelect={
+ * 参数: 过滤表头
- *  type--默认值为checkbox
+ * @param {*} Table
- *  param--可以设置返回的选中的数据属性；默认值：null；
+ * @param {*} Checkbox
- * }
+ * @param {*} Popover
- * getSelectedDataFunc--function，能获取到选中的数据
+ * @param {*} Icon
- * 使用全选时得注意，data中的key值一定要是唯一值
  */
+
 function multiSelect(Table, Checkbox) {
   var _class, _temp, _initialiseProps;
 
   return _temp = _class = function (_Component) {
-    _inherits(MultiSelect, _Component);
+    _inherits(NewMultiSelect, _Component);
 
-    function MultiSelect(props) {
+    function NewMultiSelect(props) {
-      _classCallCheck(this, MultiSelect);
+      _classCallCheck(this, NewMultiSelect);
 
       var _this = _possibleConstructorReturn(this, _Component.call(this, props));
 
       _initialiseProps.call(_this);
 
-      _this.state = {
+      var obj = _this.getCheckedOrIndeter(props.data);
-        checkedAll: false,
+      _this.state = _extends({}, obj, {
-        checkedObj: {},
+        data: (0, _util.ObjectAssign)(props.data)
-        selIds: [],
+      });
-        data: props.data
-      };
       return _this;
     }
 
-    MultiSelect.prototype.componentDidMount = function componentDidMount() {
+    NewMultiSelect.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
-      this.setState(this.initCheckedObj(this.props));
+      if (this.props.data != nextProps.data) {
-    };
+        var obj = this.getCheckedOrIndeter(props.data);
-
+        this.setState(_extends({}, obj, {
-    MultiSelect.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
+          data: (0, _util.ObjectAssign)(nextProps.data)
-      var props = this.props,
+        }));
-          selectDisabled = props.selectDisabled,
-          selectedRow = props.selectedRow,
-          data = props.data,
-          selIds = void 0,
-          obj = void 0,
-          checkedObj = {};
-
-      if (nextProps.data !== data || nextProps.selectDisabled !== selectDisabled || nextProps.selectedRow !== selectedRow) {
-        obj = this.initCheckedObj(nextProps);
-        checkedObj = obj.checkedObj;
-        selIds = obj.selIds;
-        this.setState({
-          checkedAll: false,
-          checkedObj: checkedObj,
-          selIds: selIds,
-          data: nextProps.data
-        });
       }
     };
 
-    MultiSelect.prototype.renderColumnsMultiSelect = function renderColumnsMultiSelect(columns) {
+    /**
-      var _this2 = this;
+     * @param {*} data 
+     */
 
+
+    NewMultiSelect.prototype.getCheckedOrIndeter = function getCheckedOrIndeter(data) {
+      var obj = {};
+      var checkStatus = this.setChecked(data);
+      if (!checkStatus) {
+        obj.checkedAll = false;
+        obj.indeterminate = false;
+        return obj;
+      }
+      if (checkStatus == 'indeter') {
+        obj.indeterminate = true;
+        obj.checkedAll = false;
+      } else if (checkStatus == 'all') {
+        obj.checkedAll = true;
+        obj.indeterminate = false;
+      }
+      return obj;
+    };
+
+    /**
+     * 判断数据是否全部选中
+     * @param {*} data 
+     * reutnr  string  all(全选)、indeter(半选)
+     */
+
+
+    NewMultiSelect.prototype.setChecked = function setChecked(data) {
+      if (!this.isArray(data)) return false;
+      var count = 0;
+      data.forEach(function (da) {
+        if (da._checked) {
+          count++;
+        }
+      });
+
+      if (data.length == count) {
+        return "all";
+      }
+      return count == 0 ? false : "indeter";
+    };
+
+    /**
+     * 判断是否是数组
+     * @param {*} o 
+     */
+
+
+    NewMultiSelect.prototype.isArray = function isArray(o) {
+      return Object.prototype.toString.call(o) == '[object Array]';
+    };
+
+    NewMultiSelect.prototype.render = function render() {
+      var columns = this.props.columns;
       var data = this.state.data;
 
-      var checkedObj = _extends({}, this.state.checkedObj);
+      return _react2["default"].createElement(Table, _extends({}, this.props, { columns: this.getDefaultColumns(columns), data: data }));
-      var checkedArray = Object.keys(checkedObj);
-      var multiSelect = this.props.multiSelect;
-
-      var select_column = {};
-      var indeterminate_bool = false;
-      if (!multiSelect || !multiSelect.type) {
-        multiSelect = _extends({}, multiSelect, { type: "checkbox" });
-      }
-      if (multiSelect && multiSelect.type === "checkbox") {
-        var i = checkedArray.length;
-        while (i--) {
-          if (checkedObj[checkedArray[i]]) {
-            indeterminate_bool = true;
-            break;
-          }
-        }
-        var defaultColumns = [{
-          title: _react2["default"].createElement(Checkbox, {
-            className: 'table-checkbox',
-            checked: this.state.checkedAll,
-            indeterminate: indeterminate_bool && !this.state.checkedAll,
-            onChange: this.onAllCheckChange
-          }),
-          key: "checkbox",
-          dataIndex: "checkbox",
-          width: "55",
-          render: function render(text, record, index) {
-            var rowKey = record["key"] ? record["key"] : _this2.getRowKey(record, i);
-            var bool = checkedObj.hasOwnProperty(rowKey);
-            return _react2["default"].createElement(Checkbox, {
-              className: 'table-checkbox',
-              checked: checkedObj[rowKey],
-              disabled: !bool,
-              onClick: _this2.handleClick,
-              onChange: _this2.onCheckboxChange.bind(_this2, text, record, index)
-            });
-          }
-        }];
-        columns = defaultColumns.concat(columns);
-      }
-      return columns;
     };
 
-    MultiSelect.prototype.render = function render() {
+    return NewMultiSelect;
-      var _this3 = this;
+  }(_react.Component), _class.defaultProps = {
+    prefixCls: "u-table-mult-select"
+  }, _initialiseProps = function _initialiseProps() {
+    var _this2 = this;
 
-      var columns = this.renderColumnsMultiSelect(this.props.columns).concat();
+    this.onAllCheckChange = function () {
-      return _react2["default"].createElement(Table, _extends({ ref: function ref(table_ref) {
+      var _state = _this2.state,
-          _this3.table_ref = table_ref;
+          data = _state.data,
-        } }, this.props, { columns: columns }));
+          checkedAll = _state.checkedAll,
-    };
+          indeterminate = _state.indeterminate;
 
-    return MultiSelect;
+      var check = false;
-  }(_react.Component), _initialiseProps = function _initialiseProps() {
+      if (checkedAll) {
-    var _this4 = this;
+        check = false;
-
+      } else {
-    this.getRowKey = function (record, index) {
+        if (indeterminate) {
-      var rowKey = _this4.props.rowKey || 'key';
+          check = true;
-      var key = typeof rowKey === 'function' ? rowKey(record, index) : record[rowKey];
+        } else {
-      return key;
+          check = true;
-    };
-
-    this.initCheckedObj = function (props) {
-      var checkedObj = {},
-          selectDisabled = props.selectDisabled,
-          selectedRow = props.selectedRow,
-          data = props.data,
-          selIds_ = [].concat(_toConsumableArray(_this4.state.selIds)),
-          selIds_length = selIds_.length;
-
-      for (var i = 0; i < data.length; i++) {
-        var bool = selectDisabled && selectDisabled(data[i], i) || false;
-        var rowKey = data[i]["key"] ? data[i]["key"] : _this4.getRowKey(data[i], i);
-        if (!bool) {
-          if (selectedRow && selectedRow(data[i], i)) {
-            if (selIds_length > 0) {
-              for (var index = 0; index < selIds_length; index++) {
-                var selid = selIds_[index];
-                if (selid[rowKey] !== data[i][rowKey]) {
-                  selIds_.push(data[i]);
-                }
-              }
-            } else {
-              selIds_.push(data[i]);
-            }
-            checkedObj[rowKey] = true;
-          } else {
-            checkedObj[rowKey] = false;
-          }
         }
       }
-      return {
+      var selectList = [];
-        checkedObj: checkedObj,
+      data.forEach(function (item) {
-        selIds: selIds_
+        item._checked = check;
+        if (item._checked) {
+          selectList.push(item);
+        }
+      });
+      _this2.setState({
+        indeterminate: false,
+        checkedAll: check
+      });
+      _this2.props.getSelectedDataFunc(selectList);
+    };
+
+    this.handleClick = function () {};
+
+    this.onCheckboxChange = function (text, record, index) {
+      return function () {
+        var data = _this2.state.data;
+
+        var selectList = [];
+        record._checked = record._checked ? false : true;
+        var obj = _this2.getCheckedOrIndeter(data);
+        _this2.setState(_extends({
+          data: data
+        }, obj));
+        data.forEach(function (da) {
+          if (da._checked) {
+            selectList.push(da);
+          }
+        });
+        _this2.props.getSelectedDataFunc(selectList, record, index);
       };
     };
 
-    this.onAllCheckChange = function () {
+    this.getDefaultColumns = function (columns) {
-      var self = _this4;
+      var _state2 = _this2.state,
-      var listData = self.state.data.concat();
+          checkedAll = _state2.checkedAll,
-      var checkedObj = _extends({}, self.state.checkedObj);
+          indeterminate = _state2.indeterminate;
-      var data = self.props.data;
 
-      var selIds = [];
+      var checkAttr = { checked: checkedAll ? true : false };
-      var id = self.props.multiSelect.param;
+      indeterminate ? checkAttr.indeterminate = true : "";
-      if (self.state.checkedAll) {
+      var _defaultColumns = [{
-        selIds = [];
+        title: _react2["default"].createElement(Checkbox, _extends({
-      } else {
+          className: 'table-checkbox'
-        for (var i = 0; i < listData.length; i++) {
+        }, checkAttr, {
-          if (id) {
+          onChange: _this2.onAllCheckChange
-            selIds[i] = listData[i][id];
+        })),
-          } else {
+        key: "checkbox",
-            selIds[i] = listData[i];
+        dataIndex: "checkbox",
-          }
+        fixed: "left",
+        width: 50,
+        render: function render(text, record, index) {
+          var attr = {};
+          record._disabled ? attr.disabled = record._disabled : "";
+          return _react2["default"].createElement(Checkbox, _extends({
+            key: index,
+            className: 'table-checkbox'
+          }, attr, {
+            checked: record._checked,
+            onClick: _this2.handleClick,
+            onChange: _this2.onCheckboxChange(text, record, index)
+          }));
         }
-      }
+      }];
-      for (var i = 0; i < data.length; i++) {
+      return _defaultColumns.concat(columns);
-        var rowKey = data[i]["key"] ? data[i]["key"] : _this4.getRowKey(data[i], i);
-        var bool = checkedObj.hasOwnProperty(rowKey);
-        if (!bool) {
-          selIds.splice(i, 1);
-        } else {
-          checkedObj[rowKey] = !self.state.checkedAll;
-        }
-      }
-      self.setState({
-        checkedAll: !self.state.checkedAll,
-        checkedObj: checkedObj,
-        selIds: selIds
-      });
-      self.props.getSelectedDataFunc(selIds);
-    };
-
-    this.onCheckboxChange = function (text, record, index) {
-      var self = _this4;
-      var allFlag = false;
-      var selIds = self.state.selIds;
-      var id = self.props.multiSelect ? self.props.multiSelect.param ? record[self.props.multiSelect.param] : record : record;
-      var checkedObj = _extends({}, self.state.checkedObj);
-      var checkedArray = Object.keys(checkedObj);
-      var getSelectedDataFunc = self.props.getSelectedDataFunc;
-
-      var rowKey = record["key"] ? record["key"] : _this4.getRowKey(record, i);
-      if (checkedObj[rowKey]) {
-        remove(selIds, id);
-      } else {
-        selIds.push(id);
-      }
-      checkedObj[rowKey] = !checkedObj[rowKey];
-      for (var i = 0; i < checkedArray.length; i++) {
-        if (!checkedObj[checkedArray[i]]) {
-          allFlag = false;
-          break;
-        } else {
-          allFlag = true;
-        }
-      }
-      self.setState({
-        checkedAll: allFlag,
-        checkedObj: checkedObj,
-        selIds: selIds
-      });
-      if (typeof getSelectedDataFunc === "function") {
-        getSelectedDataFunc(selIds);
-      }
-    };
-
-    this.handleClick = function (e) {
-      e.stopPropagation();
     };
   }, _temp;
 }

build/lib/newMultiSelect.js

@@ -1,195 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-
-var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
-
-exports["default"] = newMultiSelect;
-
-var _react = require('react');
-
-var _react2 = _interopRequireDefault(_react);
-
-var _beeCheckbox = require('bee-checkbox');
-
-var _beeCheckbox2 = _interopRequireDefault(_beeCheckbox);
-
-var _util = require('./util');
-
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
-
-function _defaults(obj, defaults) { var keys = Object.getOwnPropertyNames(defaults); for (var i = 0; i < keys.length; i++) { var key = keys[i]; var value = Object.getOwnPropertyDescriptor(defaults, key); if (value && value.configurable && obj[key] === undefined) { Object.defineProperty(obj, key, value); } } return obj; }
-
-function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
-
-function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; }
-
-function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : _defaults(subClass, superClass); }
-
-/**
- * 参数: 过滤表头
- * @param {*} Table
- * @param {*} Checkbox
- * @param {*} Popover
- * @param {*} Icon
- */
-
-function newMultiSelect(Table, Checkbox) {
-  var _class, _temp, _initialiseProps;
-
-  return _temp = _class = function (_Component) {
-    _inherits(NewMultiSelect, _Component);
-
-    function NewMultiSelect(props) {
-      _classCallCheck(this, NewMultiSelect);
-
-      var _this = _possibleConstructorReturn(this, _Component.call(this, props));
-
-      _initialiseProps.call(_this);
-
-      var checkedAll = _this.setChecked(props.data);
-      _this.state = {
-        checkedAll: checkedAll,
-        data: (0, _util.ObjectAssign)(props.data)
-      };
-      return _this;
-    }
-
-    NewMultiSelect.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
-      if (this.props.data != nextProps.data) {
-        this.setState({
-          data: (0, _util.ObjectAssign)(nextProps.data),
-          checkedAll: this.setChecked(nextProps.data)
-        });
-      }
-    };
-
-    NewMultiSelect.prototype.setChecked = function setChecked(data) {
-      var allCheck = true;
-      if (data) {
-        var _iteratorNormalCompletion = true;
-        var _didIteratorError = false;
-        var _iteratorError = undefined;
-
-        try {
-          for (var _iterator = data[Symbol.iterator](), _step; !(_iteratorNormalCompletion = (_step = _iterator.next()).done); _iteratorNormalCompletion = true) {
-            var da = _step.value;
-
-            if (!da._checked) {
-              allCheck = false;
-              break;
-            }
-          }
-        } catch (err) {
-          _didIteratorError = true;
-          _iteratorError = err;
-        } finally {
-          try {
-            if (!_iteratorNormalCompletion && _iterator["return"]) {
-              _iterator["return"]();
-            }
-          } finally {
-            if (_didIteratorError) {
-              throw _iteratorError;
-            }
-          }
-        }
-      }
-      return allCheck;
-    };
-
-    NewMultiSelect.prototype.render = function render() {
-      var columns = this.props.columns;
-      var data = this.state.data;
-
-      return _react2["default"].createElement(Table, _extends({}, this.props, { columns: this.getDefaultColumns(columns), data: data }));
-    };
-
-    return NewMultiSelect;
-  }(_react.Component), _class.defaultProps = {
-    prefixCls: "u-table-mult-select"
-  }, _initialiseProps = function _initialiseProps() {
-    var _this2 = this;
-
-    this.onAllCheckChange = function () {
-      var _state = _this2.state,
-          data = _state.data,
-          checkedAll = _state.checkedAll;
-
-      var selectList = [];
-      var check = checkedAll ? false : true;
-      data.forEach(function (item) {
-        item._checked = check;
-        if (item._checked) {
-          selectList.push(item);
-        }
-      });
-      _this2.setState({
-        checkedAll: check
-      });
-      _this2.props.getSelectedDataFunc(selectList);
-    };
-
-    this.handleClick = function () {};
-
-    this.onCheckboxChange = function (text, record, index) {
-      return function () {
-        var data = _this2.state.data;
-
-        var selectList = [];
-        record._checked = record._checked ? false : true;
-        var checkedAll = true;
-        for (var i = 0; i < data.length; i++) {
-          var item = data[i];
-          if (!item._checked || item._checked == false) {
-            checkedAll = false;
-            break;
-          }
-        }
-        _this2.setState(_extends({}, _this2.state, {
-          checkedAll: checkedAll
-        }));
-        data.forEach(function (da) {
-          if (da._checked) {
-            selectList.push(da);
-          }
-        });
-        _this2.props.getSelectedDataFunc(selectList, record, index);
-      };
-    };
-
-    this.getDefaultColumns = function (columns) {
-      // let checkedAll = init?false:this.state.checkedAll;
-      var checkedAll = _this2.state.checkedAll;
-
-      var _defaultColumns = [{
-        title: _react2["default"].createElement(Checkbox, {
-          className: 'table-checkbox',
-          checked: checkedAll
-          // indeterminate={indeterminate_bool && !this.state.checkedAll}
-          , onChange: _this2.onAllCheckChange
-        }),
-        key: "checkbox",
-        dataIndex: "checkbox",
-        fixed: "left",
-        width: 50,
-        render: function render(text, record, index) {
-          var attr = {};
-          record._disabled ? attr.disabled = record._disabled : "";
-          return _react2["default"].createElement(Checkbox, _extends({
-            key: index,
-            className: 'table-checkbox'
-          }, attr, {
-            checked: record._checked,
-            onClick: _this2.handleClick,
-            onChange: _this2.onCheckboxChange(text, record, index)
-          }));
-        }
-      }];
-      return _defaultColumns.concat(columns);
-    };
-  }, _temp;
-}
-module.exports = exports['default'];

dist/demo.css

@@ -2420,9 +2420,6 @@ i.uf {
 /*
  * 选择时删除文本阴影，及设置默认选中颜色
  */
-::-moz-selection {
-  background: rgb(187,222,251);
-  text-shadow: none; }
 ::selection {
   background: rgb(187,222,251);
   text-shadow: none; }
@@ -6672,7 +6669,8 @@ input.u-button[type="submit"] {
   border-radius: 0 500px 500px 0; }
 
 .u-pagination {
-  font-size: 14px; }
+  font-size: 14px;
+  position: relative; }
   .u-pagination-list {
     float: left;
     margin: 5px; }
@@ -6810,6 +6808,15 @@ input.u-button[type="submit"] {
     margin: 5px; }
     .u-pagination-total span {
       padding: 0 5px; }
+  .u-pagination.u-pagination-disabled .u-pagination-disabled-mask {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 46px;
+    background: rgba(255, 255, 255, 0.6);
+    z-index: 2;
+    cursor: not-allowed; }
 
 .pagination-state {
   float: left;
@@ -8635,6 +8642,8 @@ ul {
       display: inline-block; }
   .u-table-thead .th-drag {
     cursor: move; }
+  .u-table-thead .th-drag:hover {
+    background: #e3f2fd; }
   .u-table-thead .th-drag-hover {
     background: #ccc; }
   .u-table-thead-th {
@@ -8644,18 +8653,14 @@ ul {
       position: absolute;
       right: 0px;
       top: 0;
-      background: transparent;
+      background: #ccc;
-      width: 1px;
+      width: 2px;
       box-sizing: border-box;
-      z-index: 100; }
+      z-index: 1; }
     .u-table-thead-th .th-drag-gap {
       background: transparent; }
     .u-table-thead-th .th-drag-gap-hover {
-      background: #ccc;
       cursor: col-resize; }
-    .u-table-thead-th.th-can-not-drag .th-drag-gap-hover {
-      cursor: none;
-      width: 0px; }
   .u-table-thead-th:last-child-drag-gap {
     border: none; }
   .u-table-filter-column-pop-cont {

package.json

@@ -1,6 +1,6 @@
 {
  "name": "bee-table",
- "version": "1.4.39",
+ "version": "1.5.0",
  "description": "Table ui component for react",
  "keywords": [
   "react",