Merge branch 'master' of github.com:tinper-bee/bee-table

build/Table.css

@@ -187,7 +187,7 @@
   .u-table td {
     border-bottom: 1px solid rgb(233,233,233); }
     .u-table td a {
-      color: rgb(245, 60, 50); }
+      color: #2196F3; }
       .u-table td a:hover {
         color: rgb(230, 0, 18); }
       .u-table td a:active {
@@ -361,8 +361,8 @@
     -moz-user-select: -moz-none;
     -khtml-user-select: none;
     -webkit-user-select: none;
-    /*
+    /*
-        Introduced in IE 10. 
+        Introduced in IE 10. 
       */
     -ms-user-select: none;
     user-select: none; }
@@ -569,7 +569,8 @@
   display: none; }
 
 .editable-cell-input-wrapper .u-input-group .u-form-control {
-  height: 26px; }
+  height: 26px;
+  font-size: 12px; }
 
 .editable-cell-text-wrapper {
   padding: 5px 24px 5px 5px;
@@ -673,7 +674,7 @@
   display: none;
   align-items: center;
   justify-content: center;
-  background: #E7F2FC; }
+  background: transparent; }
 
 .u-row-hover2 {
   position: absolute;

build/lib/dragColumn.js

@@ -1,7 +1,7 @@
 'use strict';
 
 Object.defineProperty(exports, "__esModule", {
-  value: true
+    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; };
@@ -36,137 +36,137 @@ var cloneDeep = require('lodash.clonedeep');
 
 function dragColumn(Table) {
 
-  return function (_Component) {
+    return function (_Component) {
-    _inherits(DragColumn, _Component);
+        _inherits(DragColumn, _Component);
 
-    function DragColumn(props) {
+        function DragColumn(props) {
-      _classCallCheck(this, DragColumn);
+            _classCallCheck(this, DragColumn);
 
-      var _this = _possibleConstructorReturn(this, _Component.call(this, props));
+            var _this = _possibleConstructorReturn(this, _Component.call(this, props));
 
-      _this.setColumOrderByIndex = function (_column) {
+            _this.setColumOrderByIndex = function (_column) {
-        _column.forEach(function (da, i) {
+                _column.forEach(function (da, i) {
-          da.dragIndex = i;
+                    da.dragIndex = i;
-          da.drgHover = false;
+                    da.drgHover = false;
-        });
+                });
-        return _column;
+                return _column;
-      };
+            };
 
-      _this.onDrop = function (event, data) {
+            _this.onDrop = function (event, data) {
-        var dragSource = data.dragSource,
+                var dragSource = data.dragSource,
-            dragTarg = data.dragTarg;
+                    dragTarg = data.dragTarg;
-        var columns = _this.state.columns;
+                var columns = _this.state.columns;
 
-        var sourceIndex = -1,
+                var sourceIndex = -1,
-            targetIndex = -1;
+                    targetIndex = -1;
 
-        sourceIndex = columns.findIndex(function (da, i) {
+                sourceIndex = columns.findIndex(function (da, i) {
-          return da.key == dragSource.key;
+                    return da.key == dragSource.key;
-        });
+                });
-        targetIndex = columns.findIndex(function (da, i) {
+                targetIndex = columns.findIndex(function (da, i) {
-          return da.key == dragTarg.key;
+                    return da.key == dragTarg.key;
-        });
+                });
-        // for (let index = 0; index < columns.length; index++) {
+                // for (let index = 0; index < columns.length; index++) {
-        //   const da = columns[index];
+                //   const da = columns[index];
-        //   if(da.key === dragSource.key){
+                //   if(da.key === dragSource.key){
-        //     columns[index] = dragTargColum; 
+                //     columns[index] = dragTargColum; 
-        //   }
+                //   }
-        //   if(da.key === dragTarg.key){
+                //   if(da.key === dragTarg.key){
-        //     columns[index] = dragSourceColum;
+                //     columns[index] = dragSourceColum;
-        //   }
+                //   }
-        // }
+                // }
-        // 向前移动
+                // 向前移动
-        if (targetIndex < sourceIndex) {
+                if (targetIndex < sourceIndex) {
-          targetIndex = targetIndex + 1;
+                    targetIndex = targetIndex + 1;
+                }
+                columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
+                _this.setState({
+                    columns: cloneDeep(columns)
+                });
+                if (_this.props.onDrop) {
+                    _this.props.onDrop(event, data, columns);
+                }
+            };
+
+            _this.getTarget = function (evt) {
+                return evt.target || evt.srcElement;
+            };
+
+            _this.state = {
+                columns: _this.setColumOrderByIndex(props.columns)
+            };
+            return _this;
         }
-        columns.splice(targetIndex, 0, columns.splice(sourceIndex, 1)[0]);
+
-        _this.setState({
+        DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
-          columns: cloneDeep(columns)
+            if (nextProps.columns != this.props.columns) {
+                this.setState({
+                    columns: this.setColumOrderByIndex(nextProps.columns)
+                });
+            }
+        };
+
+        DragColumn.prototype.cloneDeep = function cloneDeep(obj) {
+            if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object' || Object.keys(obj).length === 0) {
+                return obj;
+            }
+            var resultData = {};
+            return this.recursion(obj, resultData);
+        };
+
+        DragColumn.prototype.recursion = function (_recursion) {
+            function recursion(_x) {
+                return _recursion.apply(this, arguments);
+            }
+
+            recursion.toString = function () {
+                return _recursion.toString();
+            };
+
+            return recursion;
+        }(function (obj) {
+            var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
+
+            for (key in obj) {
+                if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
+                    data[key] = recursion(obj[key]);
+                } else {
+                    data[key] = obj[key];
+                }
+            }
+            return data;
         });
-        if (_this.props.onDrop) {
-          _this.props.onDrop(event, data, columns);
-        }
-      };
 
-      _this.getTarget = function (evt) {
+        DragColumn.prototype.render = function render() {
-        return evt.target || evt.srcElement;
+            var _props = this.props,
-      };
+                data = _props.data,
+                dragborder = _props.dragborder,
+                draggable = _props.draggable,
+                className = _props.className,
+                columns = _props.columns,
+                onDragStart = _props.onDragStart,
+                onDragEnter = _props.onDragEnter,
+                onDragOver = _props.onDragOver,
+                onDrop = _props.onDrop,
+                others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
 
-      _this.state = {
+            var key = new Date().getTime();
-        columns: _this.setColumOrderByIndex(props.columns)
+            return _react2["default"].createElement(Table, _extends({}, others, {
-      };
+                columns: this.state.columns,
-      return _this;
+                data: data,
-    }
+                className: className + ' u-table-drag-border',
+                onDragStart: this.onDragStart,
+                onDragOver: this.onDragOver,
+                onDrop: this.onDrop,
+                onDragEnter: this.onDragEnter,
+                draggable: draggable,
+                dragborder: dragborder
+                // dragborder={false}
+                , dragborderKey: key
+            }));
+        };
 
-    DragColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
+        return DragColumn;
-      if (nextProps.columns != this.props.columns) {
+    }(_react.Component);
-        this.setState({
-          columns: this.setColumOrderByIndex(nextProps.columns)
-        });
-      }
-    };
-
-    DragColumn.prototype.cloneDeep = function cloneDeep(obj) {
-      if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) !== 'object' || Object.keys(obj).length === 0) {
-        return obj;
-      }
-      var resultData = {};
-      return this.recursion(obj, resultData);
-    };
-
-    DragColumn.prototype.recursion = function (_recursion) {
-      function recursion(_x) {
-        return _recursion.apply(this, arguments);
-      }
-
-      recursion.toString = function () {
-        return _recursion.toString();
-      };
-
-      return recursion;
-    }(function (obj) {
-      var data = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {};
-
-      for (key in obj) {
-        if (_typeof(obj[key]) == 'object' && Object.keys(obj[key].length > 0)) {
-          data[key] = recursion(obj[key]);
-        } else {
-          data[key] = obj[key];
-        }
-      }
-      return data;
-    });
-
-    DragColumn.prototype.render = function render() {
-      var _props = this.props,
-          data = _props.data,
-          dragborder = _props.dragborder,
-          draggable = _props.draggable,
-          className = _props.className,
-          columns = _props.columns,
-          onDragStart = _props.onDragStart,
-          onDragEnter = _props.onDragEnter,
-          onDragOver = _props.onDragOver,
-          onDrop = _props.onDrop,
-          others = _objectWithoutProperties(_props, ['data', 'dragborder', 'draggable', 'className', 'columns', 'onDragStart', 'onDragEnter', 'onDragOver', 'onDrop']);
-
-      var key = new Date().getTime();
-      return _react2["default"].createElement(Table, _extends({}, others, {
-        columns: this.state.columns,
-        data: data,
-        className: className + ' u-table-drag-border',
-        onDragStart: this.onDragStart,
-        onDragOver: this.onDragOver,
-        onDrop: this.onDrop,
-        onDragEnter: this.onDragEnter,
-        draggable: draggable,
-        dragborder: dragborder
-        // dragborder={false}
-        , dragborderKey: key
-      }));
-    };
-
-    return DragColumn;
-  }(_react.Component);
 }
 module.exports = exports['default'];

build/lib/multiSelect.js

@@ -1,4 +1,4 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -8,15 +8,11 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 
 exports["default"] = multiSelect;
 
-var _react = require('react');
+var _react = require("react");
 
 var _react2 = _interopRequireDefault(_react);
 
-var _beeCheckbox = require('bee-checkbox');
+var _util = require("./util");
-
-var _beeCheckbox2 = _interopRequireDefault(_beeCheckbox);
-
-var _util = require('./util');
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -27,6 +23,8 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 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); }
+// import Checkbox from 'bee-checkbox';
+
 
 /**
  * 参数: 过滤表头
@@ -218,7 +216,7 @@ function multiSelect(Table, Checkbox) {
 
       var _defaultColumns = [{
         title: _react2["default"].createElement(Checkbox, _extends({
-          className: 'table-checkbox'
+          className: "table-checkbox"
         }, checkAttr, {
           disabled: disabledCount == dataLength ? true : false,
           onChange: _this2.onAllCheckChange
@@ -232,7 +230,7 @@ function multiSelect(Table, Checkbox) {
           record._disabled ? attr.disabled = record._disabled : "";
           return _react2["default"].createElement(Checkbox, _extends({
             key: index,
-            className: 'table-checkbox'
+            className: "table-checkbox"
           }, attr, {
             checked: record._checked,
             onClick: _this2.handleClick,
@@ -244,4 +242,4 @@ function multiSelect(Table, Checkbox) {
     };
   }, _temp;
 }
-module.exports = exports['default'];
+module.exports = exports["default"];

build/lib/newMultiSelect.js

@@ -1,4 +1,4 @@
-'use strict';
+"use strict";
 
 Object.defineProperty(exports, "__esModule", {
   value: true
@@ -8,15 +8,11 @@ var _extends = Object.assign || function (target) { for (var i = 1; i < argument
 
 exports["default"] = newMultiSelect;
 
-var _react = require('react');
+var _react = require("react");
 
 var _react2 = _interopRequireDefault(_react);
 
-var _beeCheckbox = require('bee-checkbox');
+var _util = require("./util");
-
-var _beeCheckbox2 = _interopRequireDefault(_beeCheckbox);
-
-var _util = require('./util');
 
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -27,6 +23,8 @@ function _classCallCheck(instance, Constructor) { if (!(instance instanceof Cons
 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); }
+// import Checkbox from 'bee-checkbox';
+
 
 /**
  * 参数: 过滤表头
@@ -166,7 +164,7 @@ function newMultiSelect(Table, Checkbox) {
 
       var _defaultColumns = [{
         title: _react2["default"].createElement(Checkbox, {
-          className: 'table-checkbox',
+          className: "table-checkbox",
           checked: checkedAll
           // indeterminate={indeterminate_bool && !this.state.checkedAll}
           , onChange: _this2.onAllCheckChange
@@ -180,7 +178,7 @@ function newMultiSelect(Table, Checkbox) {
           record._disabled ? attr.disabled = record._disabled : "";
           return _react2["default"].createElement(Checkbox, _extends({
             key: index,
-            className: 'table-checkbox'
+            className: "table-checkbox"
           }, attr, {
             checked: record._checked,
             onClick: _this2.handleClick,
@@ -192,4 +190,4 @@ function newMultiSelect(Table, Checkbox) {
     };
   }, _temp;
 }
-module.exports = exports['default'];
+module.exports = exports["default"];

build/lib/util.js

@@ -1,7 +1,7 @@
 'use strict';
 
 Object.defineProperty(exports, "__esModule", {
-    value: true
+  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; };
@@ -20,29 +20,29 @@ exports.ObjectAssign = ObjectAssign;
 */
 
 function sortBy(arr, prop, desc) {
-    var props = [],
+  var props = [],
-        ret = [],
+      ret = [],
-        i = 0,
+      i = 0,
-        len = arr.length;
+      len = arr.length;
-    if (typeof prop == 'string') {
+  if (typeof prop == 'string') {
-        for (; i < len; i++) {
+    for (; i < len; i++) {
-            var oI = arr[i];
+      var oI = arr[i];
-            (props[i] = new String(oI && oI[prop] || ''))._obj = oI;
+      (props[i] = new String(oI && oI[prop] || ''))._obj = oI;
-        }
-    } else if (typeof prop == 'function') {
-        for (; i < len; i++) {
-            var _oI = arr[i];
-            (props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
-        }
-    } else {
-        throw '参数类型错误';
     }
-    props.sort();
+  } else if (typeof prop == 'function') {
-    for (i = 0; i < len; i++) {
+    for (; i < len; i++) {
-        ret[i] = props[i]._obj;
+      var _oI = arr[i];
+      (props[i] = new String(_oI && prop(_oI) || ''))._obj = _oI;
     }
-    if (desc) ret.reverse();
+  } else {
-    return ret;
+    throw '参数类型错误';
+  }
+  props.sort();
+  for (i = 0; i < len; i++) {
+    ret[i] = props[i]._obj;
+  }
+  if (desc) ret.reverse();
+  return ret;
 };
 
 /**
@@ -51,11 +51,11 @@ function sortBy(arr, prop, desc) {
  * @param {} property 
  */
 function compare(property) {
-    return function (a, b) {
+  return function (a, b) {
-        var value1 = a[property];
+    var value1 = a[property];
-        var value2 = b[property];
+    var value2 = b[property];
-        return value1 - value2;
+    return value1 - value2;
-    };
+  };
 }
 
 /**
@@ -63,17 +63,17 @@ function compare(property) {
  * @param {*} obj 要拷贝的对象 
  */
 function ObjectAssign(obj) {
-    var b = obj instanceof Array;
+  var b = obj instanceof Array;
-    var tagObj = b ? [] : {};
+  var tagObj = b ? [] : {};
-    if (b) {
+  if (b) {
-        //数组
+    //数组
-        obj.forEach(function (da) {
+    obj.forEach(function (da) {
-            var _da = {};
+      var _da = {};
-            _extends(_da, da);
+      _extends(_da, da);
-            tagObj.push(_da);
+      tagObj.push(_da);
-        });
+    });
-    } else {
+  } else {
-        _extends(tagObj, obj);
+    _extends(tagObj, obj);
-    }
+  }
-    return tagObj;
+  return tagObj;
 }

demo/TableDemo.scss

@@ -26,7 +26,6 @@
 }
 
 .demo25{
-  width: 700px;
   height: 100%;
 
   .u-table-filter-column-filter-icon{

demo/demolist/Demo14.js

@@ -161,6 +161,7 @@ class Demo14 extends React.Component {
               isclickTrigger={true}
               value={text}
               onChange={this.onSelectChange(index, "address")}
+              size="sm"
             >
               <Option value="jack">boyuzhou</Option>
               <Option value="lucy">renhualiu</Option>

demo/demolist/Demo19.js

@@ -121,6 +121,7 @@ class Demo19 extends React.Component {
               onChange={this.onSelectChange(index, "address")}
               onFocus={this.handFocus}
               onBlur={this.onBlur}
+              size="sm"
               autofocus
             >
               <Option value="jack">boyuzhou</Option>

demo/demolist/Demo35.js

@@ -81,7 +81,7 @@ class Demo35 extends Component {
   this.currentRecord = record;
  }
   getHoverContent=()=>{
-    return <div className="opt-btns"><button  onClick={this.delFun}>删除</button> </div>
+    return <div className="opt-btns"><Button size="sm" onClick={this.delFun}>删除</Button> </div>
   }
   render() {
     return (

demo/demolist/Demo35.scss

@@ -1,8 +1,11 @@
 .opt-btns{
-    button{
+    .u-button{
-      background: #505F79 ;
+        background-color: #505F79;
-      height: 26px;
+        border-color: #505F79;
-      color:#FFFFFF;
+        color: #fff;
-      line-height: 26px;
+        &:hover, &:active{
+            background-color: #344563;
+            border-color: #344563;
+        }
     }
-  }
+}

dist/demo.css

@@ -6081,12 +6081,9 @@ input.u-button[type="submit"] {
   color: rgb(255,255,255);
   background-color: rgb(245, 60, 50);
   border: 1px rgb(245, 60, 50) solid; }
-  .u-button.u-button-primary:hover {
+  .u-button.u-button-primary.focus, .u-button.u-button-primary:focus, .u-button.u-button-primary:hover {
     background-color: rgb(230, 0, 18);
     border-color: rgb(230, 0, 18); }
-  .u-button.u-button-primary.focus, .u-button.u-button-primary:focus:hover {
-    background-color: rgb(245, 60, 50);
-    border-color: rgb(245, 60, 50); }
   .u-button.u-button-primary.active, .u-button.u-button-primary:active {
     background-color: rgb(230, 0, 18);
     border-color: rgb(230, 0, 18); }
@@ -6095,12 +6092,9 @@ input.u-button[type="submit"] {
   color: rgb(33,33,33);
   background-color: rgb(224,224,224);
   border: 1px rgb(224,224,224) solid; }
-  .u-button.u-button-secondary:hover {
+  .u-button.u-button-secondary.focus, .u-button.u-button-secondary:focus, .u-button.u-button-secondary:hover {
     background-color: rgb(189,189,189);
     border-color: rgb(189,189,189); }
-  .u-button.u-button-secondary.focus, .u-button.u-button-secondary:focus:hover {
-    background-color: rgb(224,224,224);
-    border-color: rgb(224,224,224); }
   .u-button.u-button-secondary.active, .u-button.u-button-secondary:active {
     background-color: rgb(189,189,189);
     border-color: rgb(189,189,189); }
@@ -6109,12 +6103,9 @@ input.u-button[type="submit"] {
   color: rgb(255,255,255);
   background-color: rgb(244,67,54);
   border: 1px rgb(244,67,54) solid; }
-  .u-button.u-button-danger:hover {
+  .u-button.u-button-danger.focus, .u-button.u-button-danger:focus, .u-button.u-button-danger:hover {
     background-color: rgb(211,47,47);
     border-color: rgb(211,47,47); }
-  .u-button.u-button-danger.focus, .u-button.u-button-danger:focus:hover {
-    background-color: rgb(244,67,54);
-    border-color: rgb(244,67,54); }
   .u-button.u-button-danger.active, .u-button.u-button-danger:active {
     background-color: rgb(211,47,47);
     border-color: rgb(211,47,47); }
@@ -6123,12 +6114,9 @@ input.u-button[type="submit"] {
   color: rgb(255,255,255);
   background-color: rgb(0,188,212);
   border: 1px rgb(0,188,212) solid; }
-  .u-button.u-button-info:hover {
+  .u-button.u-button-info.focus, .u-button.u-button-info:focus, .u-button.u-button-info:hover {
     background-color: rgb(0,151,167);
     border-color: rgb(0,151,167); }
-  .u-button.u-button-info.focus, .u-button.u-button-info:focus:hover {
-    background-color: rgb(0,188,212);
-    border-color: rgb(0,188,212); }
   .u-button.u-button-info.active, .u-button.u-button-info:active {
     background-color: rgb(0,151,167);
     border-color: rgb(0,151,167); }
@@ -6137,12 +6125,9 @@ input.u-button[type="submit"] {
   color: rgb(255,255,255);
   background-color: rgb(255,152,0);
   border: 1px rgb(255,152,0) solid; }
-  .u-button.u-button-warning:hover {
+  .u-button.u-button-warning.focus, .u-button.u-button-warning:focus, .u-button.u-button-warning:hover {
     background-color: rgb(245,124,0);
     border-color: rgb(245,124,0); }
-  .u-button.u-button-warning.focus, .u-button.u-button-warning:focus:hover {
-    background-color: rgb(255,152,0);
-    border-color: rgb(255,152,0); }
   .u-button.u-button-warning.active, .u-button.u-button-warning:active {
     background-color: rgb(245,124,0);
     border-color: rgb(245,124,0); }
@@ -6151,12 +6136,9 @@ input.u-button[type="submit"] {
   color: rgb(255,255,255);
   background-color: rgb(76,175,80);
   border: 1px rgb(76,175,80) solid; }
-  .u-button.u-button-success:hover {
+  .u-button.u-button-success.focus, .u-button.u-button-success:focus, .u-button.u-button-success:hover {
     background-color: rgb(56,142,60);
     border-color: rgb(56,142,60); }
-  .u-button.u-button-success.focus, .u-button.u-button-success:focus:hover {
-    background-color: rgb(76,175,80);
-    border-color: rgb(76,175,80); }
   .u-button.u-button-success.active, .u-button.u-button-success:active {
     background-color: rgb(56,142,60);
     border-color: rgb(56,142,60); }
@@ -6165,12 +6147,9 @@ input.u-button[type="submit"] {
   color: rgb(255,255,255);
   background-color: rgb(97,97,97);
   border: 1px rgb(97,97,97) solid; }
-  .u-button.u-button-dark:hover {
+  .u-button.u-button-dark.focus, .u-button.u-button-dark:focus, .u-button.u-button-dark:hover {
     background-color: rgb(66,66,66);
     border-color: rgb(66,66,66); }
-  .u-button.u-button-dark.focus, .u-button.u-button-dark:focus:hover {
-    background-color: rgb(97,97,97);
-    border-color: rgb(97,97,97); }
   .u-button.u-button-dark.active, .u-button.u-button-dark:active {
     background-color: rgb(66,66,66);
     border-color: rgb(66,66,66); }
@@ -6179,12 +6158,9 @@ input.u-button[type="submit"] {
   color: rgb(97,97,97);
   background-color: rgb(255,255,255);
   border: 1px rgb(255,255,255) solid; }
-  .u-button.u-button-light:hover {
+  .u-button.u-button-light.focus, .u-button.u-button-light:focus, .u-button.u-button-light:hover {
     background-color: rgb(189,189,189);
     border-color: rgb(189,189,189); }
-  .u-button.u-button-light.focus, .u-button.u-button-light:focus:hover {
-    background-color: rgb(255,255,255);
-    border-color: rgb(255,255,255); }
   .u-button.u-button-light.active, .u-button.u-button-light:active {
     background-color: rgb(189,189,189);
     border-color: rgb(189,189,189); }
@@ -6193,14 +6169,10 @@ input.u-button[type="submit"] {
   color: rgb(76,175,80);
   background-color: #fff;
   border: 1px rgb(76,175,80) solid; }
-  .u-button-border.u-button-success:hover {
+  .u-button-border.u-button-success.focus, .u-button-border.u-button-success:focus, .u-button-border.u-button-success:hover {
     background-color: rgb(56,142,60);
     border-color: rgb(56,142,60);
     color: #fff; }
-  .u-button-border.u-button-success.focus, .u-button-border.u-button-success:focus:hover {
-    color: rgb(76,175,80);
-    background-color: #fff;
-    border-color: rgb(76,175,80); }
   .u-button-border.u-button-success.active, .u-button-border.u-button-success:active {
     color: #fff;
     background-color: rgb(56,142,60);
@@ -6210,14 +6182,10 @@ input.u-button[type="submit"] {
   color: rgb(255,152,0);
   background-color: #fff;
   border: 1px rgb(255,152,0) solid; }
-  .u-button-border.u-button-warning:hover {
+  .u-button-border.u-button-warning.focus, .u-button-border.u-button-warning:focus, .u-button-border.u-button-warning:hover {
     background-color: rgb(245,124,0);
     border-color: rgb(245,124,0);
     color: #fff; }
-  .u-button-border.u-button-warning.focus, .u-button-border.u-button-warning:focus:hover {
-    color: rgb(255,152,0);
-    background-color: #fff;
-    border-color: rgb(255,152,0); }
   .u-button-border.u-button-warning.active, .u-button-border.u-button-warning:active {
     color: #fff;
     background-color: rgb(245,124,0);
@@ -6227,14 +6195,10 @@ input.u-button[type="submit"] {
   color: rgb(244,67,54);
   background-color: #fff;
   border: 1px rgb(244,67,54) solid; }
-  .u-button-border.u-button-danger:hover {
+  .u-button-border.u-button-danger.focus, .u-button-border.u-button-danger:focus, .u-button-border.u-button-danger:hover {
     background-color: rgb(211,47,47);
     border-color: rgb(211,47,47);
     color: #fff; }
-  .u-button-border.u-button-danger.focus, .u-button-border.u-button-danger:focus:hover {
-    color: rgb(244,67,54);
-    background-color: #fff;
-    border-color: rgb(244,67,54); }
   .u-button-border.u-button-danger.active, .u-button-border.u-button-danger:active {
     color: #fff;
     background-color: rgb(211,47,47);
@@ -6244,14 +6208,10 @@ input.u-button[type="submit"] {
   color: rgb(0,188,212);
   background-color: #fff;
   border: 1px rgb(0,188,212) solid; }
-  .u-button-border.u-button-info:hover {
+  .u-button-border.u-button-info.focus, .u-button-border.u-button-info:focus, .u-button-border.u-button-info:hover {
     background-color: rgb(0,151,167);
     border-color: rgb(0,151,167);
     color: #fff; }
-  .u-button-border.u-button-info.focus, .u-button-border.u-button-info:focus:hover {
-    color: rgb(0,188,212);
-    background-color: #fff;
-    border-color: rgb(0,188,212); }
   .u-button-border.u-button-info.active, .u-button-border.u-button-info:active {
     color: #fff;
     background-color: rgb(0,151,167);
@@ -6261,14 +6221,10 @@ input.u-button[type="submit"] {
   color: rgb(245, 60, 50);
   background-color: #fff;
   border: 1px rgb(245, 60, 50) solid; }
-  .u-button-border.u-button-primary:hover {
+  .u-button-border.u-button-primary.focus, .u-button-border.u-button-primary:focus, .u-button-border.u-button-primary:hover {
     background-color: rgb(230, 0, 18);
     border-color: rgb(230, 0, 18);
     color: #fff; }
-  .u-button-border.u-button-primary.focus, .u-button-border.u-button-primary:focus:hover {
-    color: rgb(245, 60, 50);
-    background-color: #fff;
-    border-color: rgb(245, 60, 50); }
   .u-button-border.u-button-primary.active, .u-button-border.u-button-primary:active {
     color: #fff;
     background-color: rgb(230, 0, 18);
@@ -6278,14 +6234,10 @@ input.u-button[type="submit"] {
   color: rgb(224,224,224);
   background-color: #fff;
   border: 1px rgb(224,224,224) solid; }
-  .u-button-border.u-button-secondary:hover {
+  .u-button-border.u-button-secondary.focus, .u-button-border.u-button-secondary:focus, .u-button-border.u-button-secondary:hover {
     background-color: rgb(189,189,189);
     border-color: rgb(189,189,189);
     color: #fff; }
-  .u-button-border.u-button-secondary.focus, .u-button-border.u-button-secondary:focus:hover {
-    color: rgb(224,224,224);
-    background-color: #fff;
-    border-color: rgb(224,224,224); }
   .u-button-border.u-button-secondary.active, .u-button-border.u-button-secondary:active {
     color: #fff;
     background-color: rgb(189,189,189);
@@ -6295,14 +6247,10 @@ input.u-button[type="submit"] {
   color: rgb(97,97,97);
   background-color: #fff;
   border: 1px rgb(97,97,97) solid; }
-  .u-button-border.u-button-dark:hover {
+  .u-button-border.u-button-dark.focus, .u-button-border.u-button-dark:focus, .u-button-border.u-button-dark:hover {
     background-color: rgb(66,66,66);
     border-color: rgb(66,66,66);
     color: #fff; }
-  .u-button-border.u-button-dark.focus, .u-button-border.u-button-dark:focus:hover {
-    color: rgb(97,97,97);
-    background-color: #fff;
-    border-color: rgb(97,97,97); }
   .u-button-border.u-button-dark.active, .u-button-border.u-button-dark:active {
     color: #fff;
     background-color: rgb(66,66,66);
@@ -6312,14 +6260,10 @@ input.u-button[type="submit"] {
   color: rgb(97,97,97);
   background-color: #fff;
   border: 1px rgb(255,255,255) solid; }
-  .u-button-border.u-button-light:hover {
+  .u-button-border.u-button-light.focus, .u-button-border.u-button-light:focus, .u-button-border.u-button-light:hover {
     background-color: rgb(189,189,189);
     border-color: rgb(189,189,189);
     color: #fff; }
-  .u-button-border.u-button-light.focus, .u-button-border.u-button-light:focus:hover {
-    color: rgb(97,97,97);
-    background-color: #fff;
-    border-color: rgb(255,255,255); }
   .u-button-border.u-button-light.active, .u-button-border.u-button-light:active {
     color: #fff;
     background-color: rgb(189,189,189);
@@ -6529,14 +6473,14 @@ input.u-button[type="submit"] {
   display: inline-block;
   padding: 0 12px;
   width: 100%;
-  height: 32px;
+  height: 30px;
   cursor: text;
   font-size: 14px;
   line-height: 1.5;
   color: #424242;
   background-color: #fff;
   background-image: none;
-  border: 1px solid rgb(165, 173, 186);
+  border: 1px solid #bdbdbd;
   border-radius: 3px;
   transition: all .3s; }
   .u-form-control:focus {
@@ -6546,18 +6490,18 @@ input.u-button[type="submit"] {
     display: none; }
 
 .u-form-control[disabled] {
-  background: #F7F9FB;
+  background: #eee;
-  border-color: #DFE1E6;
+  border-color: #e0e0e0;
-  color: #909090;
+  color: #BDBDBD;
   cursor: not-allowed; }
 
 .u-form-control.lg {
-  height: 40px;
+  height: 38px;
   font-size: 14px; }
 
 .u-form-control.sm {
   font-size: 12px;
-  height: 26px; }
+  height: 24px; }
 
 .u-form-control-search-wrapper {
   position: absolute;
@@ -6615,9 +6559,9 @@ input.u-button[type="submit"] {
     .u-pagination-list > li > a, .u-pagination-list > li > span {
       display: inline-block;
       text-decoration: none;
-      border-top: 1px solid rgb(165, 173, 186);
+      border-top: 1px solid #d7d7d7;
-      border-bottom: 1px solid rgb(165, 173, 186);
+      border-bottom: 1px solid #d7d7d7;
-      border-left: 1px solid rgb(165, 173, 186);
+      border-left: 1px solid #d7d7d7;
       background-color: transparent;
       text-align: center;
       color: #666666;
@@ -6635,14 +6579,14 @@ input.u-button[type="submit"] {
     .u-pagination-list > li[role="next"] > a {
       border-top-right-radius: 4px;
       border-bottom-right-radius: 4px;
-      border-right: 1px solid rgb(165, 173, 186); }
+      border-right: 1px solid #d7d7d7; }
     .u-pagination-list > li {
       float: left;
       list-style-type: none; }
       .u-pagination-list > li > a:hover, .u-pagination-list > li > span:hover, .u-pagination-list > li > a:focus, .u-pagination-list > li > span:focus {
         color: #666;
         background-color: rgb(235, 236, 240);
-        border-color: rgb(165, 173, 186);
+        border-color: #d7d7d7;
         cursor: pointer; }
       .u-pagination-list > li > a > i {
         color: #7a869a; }
@@ -6656,13 +6600,13 @@ input.u-button[type="submit"] {
       color: #777;
       cursor: not-allowed;
       background-color: transparent;
-      border-color: rgb(165, 173, 186); }
+      border-color: #ddd; }
     .u-pagination-list > .disabled > a > i {
       color: #C1C7D0; }
     .u-pagination-list > li[role="gap"] > a {
       background-color: transparent;
-      border-bottom: 0 solid rgb(165, 173, 186);
+      border-bottom: 0 solid #d7d7d7;
-      border-top: 0 solid rgb(165, 173, 186);
+      border-top: 0 solid #d7d7d7;
       padding: 7px 11px;
       line-height: 1.57142857; }
     .u-pagination-list > li[role="gap"] > a:hover, .u-pagination-list > li[role="gap"] > a:focus {
@@ -6677,7 +6621,7 @@ input.u-button[type="submit"] {
       padding: 0px;
       font-size: 14px; }
     .u-pagination-list > li:last-child > a, .u-pagination-list > li:last-child > span {
-      border-right: 1px solid rgb(165, 173, 186); }
+      border-right: 1px solid #d7d7d7; }
   .u-pagination .temp-main {
     width: 100px;
     height: 100px;
@@ -6740,7 +6684,7 @@ input.u-button[type="submit"] {
     border-radius: 3px;
     width: 50px;
     text-align: center;
-    border: 1px solid rgb(165, 173, 186); }
+    border: 1px solid #d7d7d7; }
   .u-pagination .page_jump_btn,
   .u-pagination .page_jump_value {
     margin: 0 8px;
@@ -6902,16 +6846,16 @@ input.u-button[type="submit"] {
 .u-pagination-gap > li > a {
   margin: 0 5px;
   border-radius: 5px;
-  border: 1px solid rgb(165, 173, 186); }
+  border: 1px solid #d7d7d7; }
   .u-pagination-gap > li > a:hover {
-    background-color: rgb(235, 236, 240);
+    background-color: transparent;
-    border-color: rgb(165, 173, 186); }
+    border-color: #7A869A; }
 
 .u-pagination-gap > li:first-child > a, .u-pagination-gap > li:last-child > a {
   border-radius: 5px; }
 
 .u-pagination-gap > li[role="gap"] > a {
-  border: 0 solid rgb(165, 173, 186); }
+  border: 0 solid #d7d7d7; }
 
 /* FormGroup */
 /*  Navlayout  */
@@ -7312,8 +7256,8 @@ ul {
     box-sizing: border-box;
     display: block;
     background-color: #fff;
-    border-radius: 3px;
+    border-radius: 4px;
-    border: 1px solid rgb(165, 173, 186);
+    border: 1px solid #d9d9d9;
     transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
     .u-select .u-select-selection :hover {
       border-color: #40a5ed; }
@@ -7430,7 +7374,7 @@ ul {
   line-height: 24px; }
 
 .u-select-sm .u-select-selection {
-  border-radius: 3px; }
+  border-radius: 4px; }
 
 .u-select-sm .u-select-selection--single {
   height: 26px; }
@@ -7481,7 +7425,7 @@ ul {
     width: 100%;
     background: transparent;
     outline: 0;
-    border-radius: 3px; }
+    border-radius: 4px; }
   .u-select-search--inline .u-select-search-field-mirror {
     position: absolute;
     top: 0;
@@ -7520,7 +7464,7 @@ ul {
     line-height: 24px; }
   .u-select-selection--multiple .u-select-selection-choice {
     background-color: #f3f3f3;
-    border-radius: 3px;
+    border-radius: 4px;
     cursor: default;
     float: left;
     padding: 0 16px;
@@ -7615,7 +7559,7 @@ ul {
 .u-select-dropdown {
   background-color: white;
   box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2);
-  border-radius: 3px;
+  border-radius: 4px;
   box-sizing: border-box;
   z-index: 1800;
   left: -9999px;
@@ -7754,7 +7698,7 @@ ul {
   vertical-align: middle; }
 
 .u-search-input.u-input-group .u-input:first-child, .u-search-input.u-input-group .u-select:first-child {
-  border-radius: 3px;
+  border-radius: 4px;
   position: absolute;
   top: -1px;
   width: 100%; }
@@ -8242,7 +8186,7 @@ ul {
     border-top-width: 0;
     border-bottom-color: #fff; }
   .u-tooltip.inverse.bottom .tooltip-arrow {
-    border-bottom-color: rgb(165, 173, 186); }
+    border-bottom-color: rgb(224,224,224); }
   .u-tooltip.inverse-arrow.inverse.top .tooltip-arrow::after {
     top: 1px;
     margin-left: -5px;
@@ -8250,14 +8194,14 @@ ul {
     border-bottom-color: #fff;
     border-bottom-width: inherit; }
   .u-tooltip.inverse-arrow.inverse.top .tooltip-arrow {
-    border-bottom-color: rgb(165, 173, 186); }
+    border-bottom-color: rgb(224,224,224); }
   .u-tooltip.inverse.left .tooltip-arrow::after {
     border-right-width: 0;
     top: -5px;
     margin-left: -6px;
     border-left-color: #fff; }
   .u-tooltip.inverse.left .tooltip-arrow {
-    border-left-color: rgb(165, 173, 186); }
+    border-left-color: rgb(224,224,224); }
   .u-tooltip.inverse-arrow.inverse.right .tooltip-arrow::after {
     border-right-width: 0;
     top: -5px;
@@ -8265,14 +8209,14 @@ ul {
     border-left-color: #fff;
     border-left-width: inherit; }
   .u-tooltip.inverse-arrow.inverse.right .tooltip-arrow {
-    border-left-color: rgb(165, 173, 186); }
+    border-left-color: rgb(224,224,224); }
   .u-tooltip.inverse.right .tooltip-arrow::after {
     border-left-width: 0;
     top: -5px;
     margin-left: 1px;
     border-right-color: #fff; }
   .u-tooltip.inverse.right .tooltip-arrow {
-    border-right-color: rgb(165, 173, 186); }
+    border-right-color: rgb(224,224,224); }
   .u-tooltip.inverse-arrow.inverse.left .tooltip-arrow::after {
     border-left-width: 0;
     top: -5px;
@@ -8280,7 +8224,7 @@ ul {
     border-right-color: #fff;
     border-right-width: inherit; }
   .u-tooltip.inverse-arrow.inverse.left .tooltip-arrow {
-    border-right-color: rgb(165, 173, 186); }
+    border-right-color: rgb(224,224,224); }
   .u-tooltip.inverse.top .tooltip-arrow::after {
     top: -6px;
     margin-left: -5px;
@@ -8288,7 +8232,7 @@ ul {
     border-bottom-color: #d9d9d9;
     border-top-color: #fff; }
   .u-tooltip.inverse.top .tooltip-arrow {
-    border-top-color: rgb(165, 173, 186); }
+    border-top-color: rgb(224,224,224); }
   .u-tooltip.inverse-arrow.inverse.bottom .tooltip-arrow::after {
     top: -6px;
     margin-left: -5px;
@@ -8297,11 +8241,11 @@ ul {
     border-top-color: #fff;
     border-top-width: inherit; }
   .u-tooltip.inverse-arrow.inverse.bottom .tooltip-arrow {
-    border-top-color: rgb(165, 173, 186); }
+    border-top-color: rgb(224,224,224); }
   .u-tooltip.inverse .tooltip-inner {
     background-color: #fff;
     color: #333333;
-    border: 1px solid rgb(165, 173, 186); }
+    border: 1px solid rgb(224,224,224); }
   .u-tooltip.inverse .tooltip-arrow::after {
     position: absolute;
     display: block;
@@ -8484,7 +8428,7 @@ ul {
   .u-table td {
     border-bottom: 1px solid rgb(233,233,233); }
     .u-table td a {
-      color: rgb(245, 60, 50); }
+      color: #2196F3; }
       .u-table td a:hover {
         color: rgb(230, 0, 18); }
       .u-table td a:active {
@@ -8663,8 +8607,8 @@ ul {
     background-clip: padding-box;
     -moz-user-select: -moz-none;
     -webkit-user-select: none;
-    /*
+    /*
-        Introduced in IE 10. 
+        Introduced in IE 10. 
       */
     -ms-user-select: none;
     user-select: none; }
@@ -8868,7 +8812,8 @@ ul {
   display: none; }
 
 .editable-cell-input-wrapper .u-input-group .u-form-control {
-  height: 26px; }
+  height: 26px;
+  font-size: 12px; }
 
 .editable-cell-text-wrapper {
   padding: 5px 24px 5px 5px;
@@ -8974,7 +8919,7 @@ ul {
   align-items: center;
   -ms-flex-pack: center;
   justify-content: center;
-  background: #E7F2FC; }
+  background: transparent; }
 
 .u-row-hover2 {
   position: absolute;
@@ -9011,14 +8956,14 @@ ul {
   display: inline-block;
   padding: 0 12px;
   width: 100%;
-  height: 32px;
+  height: 30px;
   cursor: text;
   font-size: 14px;
   line-height: 1.5;
   color: #424242;
   background-color: #fff;
   background-image: none;
-  border: 1px solid rgb(165, 173, 186);
+  border: 1px solid #bdbdbd;
   border-radius: 3px;
   transition: all .3s; }
   .u-form-control:focus {
@@ -9028,18 +8973,18 @@ ul {
     display: none; }
 
 .u-form-control[disabled] {
-  background: #F7F9FB;
+  background: #eee;
-  border-color: #DFE1E6;
+  border-color: #e0e0e0;
-  color: #909090;
+  color: #BDBDBD;
   cursor: not-allowed; }
 
 .u-form-control.lg {
-  height: 40px;
+  height: 38px;
   font-size: 14px; }
 
 .u-form-control.sm {
   font-size: 12px;
-  height: 26px; }
+  height: 24px; }
 
 .u-form-control-search-wrapper {
   position: absolute;
@@ -9138,7 +9083,7 @@ ul {
   border-collapse: separate; }
   .u-input-group .u-input-group-btn .u-button {
     border: 1px solid #ccc;
-    height: 32px;
+    height: 30px;
     line-height: 1.3; }
   .u-input-group .u-form-control {
     position: relative;
@@ -9158,9 +9103,9 @@ ul {
     border-radius: 3px; }
   .u-input-group.simple .u-input-group-btn {
     position: absolute;
-    top: 4px;
+    top: 2px;
     bottom: 0;
-    right: 6px;
+    right: 5px;
     min-width: 20px; }
   .u-input-group.simple .u-form-control:not(:last-child) {
     padding-right: 23px; }
@@ -9382,7 +9327,7 @@ ul {
   border-radius: 3px;
   box-shadow: 0 1px 5px #ccc;
   background-clip: padding-box;
-  border: 1px solid rgb(165, 173, 186);
+  border: 1px solid rgb(224,224,224);
   line-height: 1.5; }
 
 .rc-calendar-date-panel,
@@ -10527,7 +10472,6 @@ li.rc-time-picker-panel-select-option-disabled:hover {
   background: #e3f2fd; }
 
 .demo25 {
-  width: 700px;
   height: 100%; }
   .demo25 .u-table-filter-column-filter-icon {
     right: 15px; }
@@ -10545,11 +10489,13 @@ th:hover .uf {
   padding-bottom: 0px; }
 
 
-.opt-btns button {
+.opt-btns .u-button {
-  background: #505F79;
+  background-color: #505F79;
-  height: 26px;
+  border-color: #505F79;
-  color: #FFFFFF;
+  color: #fff; }
-  line-height: 26px; }
+  .opt-btns .u-button:hover, .opt-btns .u-button:active {
+    background-color: #344563;
+    border-color: #344563; }
 
 .demo8 .u-table {
   margin-bottom: 11px; }

src/Table.scss

@@ -58,7 +58,7 @@ $checkbox-height:16px;
   td {
     border-bottom: 1px solid $table-border-color;
     a{
-      color: $brand-primary;
+      color: #2196F3;
       &:hover{
         color: $brand-primary-hover;
       }
@@ -642,6 +642,7 @@ $checkbox-height:16px;
   }
   .u-input-group .u-form-control{
     height: 26px;
+    font-size: 12px;
   }
 }
 
@@ -787,7 +788,7 @@ $checkbox-height:16px;
   display: none;
   align-items: center;
   justify-content: center;
-  background: $table-hover-color
+  background: transparent;
 }
 
 .u-row-hover2{

src/lib/multiSelect.js

@@ -1,5 +1,5 @@
 import React, { Component } from "react";
-import Checkbox from 'bee-checkbox';
+// import Checkbox from 'bee-checkbox';
 import {ObjectAssign} from './util';
 /**
  * 参数: 过滤表头

src/lib/newMultiSelect.js

@@ -1,5 +1,5 @@
 import React, { Component } from "react";
-import Checkbox from 'bee-checkbox';
+// import Checkbox from 'bee-checkbox';
 import {ObjectAssign} from './util';
 /**
  * 参数: 过滤表头