feat(发布拖拽表头列的宽度): 发布拖拽表头列的宽度
发布拖拽表头列的宽度 BREAKING CHANGE: 发布拖拽表头列的宽度
This commit is contained in:
jonyshi
parent
2a0df99975
commit
67688d557f
|
|
@ -335,6 +335,33 @@
|
|||
background: #ccc; }
|
||||
.u-table-thead-th:last-child-drag-gap {
|
||||
border: none; }
|
||||
.u-table-filter-column-pop-cont {
|
||||
margin: 10px;
|
||||
margin-top: 0px; }
|
||||
.u-table-filter-column-clear-setting {
|
||||
border-bottom: 1px solid #ccc;
|
||||
cursor: pointer; }
|
||||
.u-table-filter-column-cont {
|
||||
position: relative; }
|
||||
.u-table-filter-column-pop-column-filter {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 3px;
|
||||
width: 30px;
|
||||
height: 30px; }
|
||||
.u-table-filter-column-pop-cont-item {
|
||||
margin-top: 10px;
|
||||
line-height: 30px;
|
||||
cursor: pointer; }
|
||||
.u-table-filter-column-pop-cont-item > span {
|
||||
margin-left: 5px;
|
||||
width: 100px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap; }
|
||||
.u-table-filter-column-pop .u-modal-dialog {
|
||||
border: 1px solid #ccc;
|
||||
background: #fff; }
|
||||
|
||||
.u-table.bordered table {
|
||||
border-collapse: collapse; }
|
||||
|
|
@ -513,40 +540,6 @@
|
|||
-webkit-transition: all 0.3s;
|
||||
transition: all 0.3s; }
|
||||
|
||||
.bee-table-column-filter-cont {
|
||||
position: relative; }
|
||||
|
||||
.bee-table-column-filter {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
right: 3px;
|
||||
width: 30px;
|
||||
height: 30px; }
|
||||
|
||||
.pop .u-modal-dialog {
|
||||
border: 1px solid #ccc;
|
||||
background: #fff; }
|
||||
|
||||
.clear-setting {
|
||||
border-bottom: 1px solid #ccc;
|
||||
cursor: pointer; }
|
||||
|
||||
.pop-cont {
|
||||
margin: 10px;
|
||||
margin-top: 0px; }
|
||||
|
||||
.item {
|
||||
margin-top: 10px;
|
||||
line-height: 30px;
|
||||
cursor: pointer; }
|
||||
|
||||
.item > span {
|
||||
margin-left: 5px;
|
||||
width: 100px;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap; }
|
||||
|
||||
.col-resize-container {
|
||||
height: 0px;
|
||||
position: relative; }
|
||||
|
|
|
|||
|
|
@ -1,145 +0,0 @@
|
|||
"use strict";
|
||||
|
||||
Object.defineProperty(exports, "__esModule", {
|
||||
value: true
|
||||
});
|
||||
|
||||
var _react = require("react");
|
||||
|
||||
var _react2 = _interopRequireDefault(_react);
|
||||
|
||||
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); }
|
||||
|
||||
var Table = function (_React$PureComponent) {
|
||||
_inherits(Table, _React$PureComponent);
|
||||
|
||||
function Table() {
|
||||
_classCallCheck(this, Table);
|
||||
|
||||
return _possibleConstructorReturn(this, _React$PureComponent.apply(this, arguments));
|
||||
}
|
||||
|
||||
Table.prototype.render = function render() {
|
||||
return _react2["default"].createElement(
|
||||
"table",
|
||||
{ className: "table table-bordered" },
|
||||
_react2["default"].createElement(
|
||||
"thead",
|
||||
null,
|
||||
_react2["default"].createElement(
|
||||
"tr",
|
||||
null,
|
||||
_react2["default"].createElement(
|
||||
"th",
|
||||
null,
|
||||
"#"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"th",
|
||||
null,
|
||||
"First Name"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"th",
|
||||
null,
|
||||
"Last Name"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"th",
|
||||
null,
|
||||
"Username"
|
||||
)
|
||||
)
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"tbody",
|
||||
null,
|
||||
_react2["default"].createElement(
|
||||
"tr",
|
||||
null,
|
||||
_react2["default"].createElement(
|
||||
"th",
|
||||
{ scope: "row" },
|
||||
"1"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"Mark"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"Otto"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"@mdo"
|
||||
)
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"tr",
|
||||
null,
|
||||
_react2["default"].createElement(
|
||||
"th",
|
||||
{ scope: "row" },
|
||||
"2"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"Jacob"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"Thornton"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"@fat"
|
||||
)
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"tr",
|
||||
null,
|
||||
_react2["default"].createElement(
|
||||
"th",
|
||||
{ scope: "row" },
|
||||
"3"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"Larry"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"the Bird"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
"td",
|
||||
null,
|
||||
"@twitter"
|
||||
)
|
||||
)
|
||||
)
|
||||
);
|
||||
};
|
||||
|
||||
return Table;
|
||||
}(_react2["default"].PureComponent);
|
||||
|
||||
exports["default"] = Table;
|
||||
module.exports = exports["default"];
|
||||
|
|
@ -75,7 +75,9 @@ function filterColumn(Table) {
|
|||
}
|
||||
|
||||
filterColumn.prototype.render = function render() {
|
||||
var data = this.props.data;
|
||||
var _props = this.props,
|
||||
data = _props.data,
|
||||
prefixCls = _props.prefixCls;
|
||||
var _state = this.state,
|
||||
columns = _state.columns,
|
||||
showModal = _state.showModal,
|
||||
|
|
@ -92,10 +94,10 @@ function filterColumn(Table) {
|
|||
|
||||
var content = _react2["default"].createElement(
|
||||
"div",
|
||||
{ className: "pop-cont" },
|
||||
{ className: prefixCls + "-pop-cont" },
|
||||
_react2["default"].createElement(
|
||||
"span",
|
||||
{ className: "clear-setting", onClick: this.clear },
|
||||
{ className: prefixCls + "-clear-setting", onClick: this.clear },
|
||||
"\u6E05\u9664\u8BBE\u7F6E"
|
||||
),
|
||||
_react2["default"].createElement(
|
||||
|
|
@ -107,7 +109,7 @@ function filterColumn(Table) {
|
|||
|
||||
return _react2["default"].createElement(
|
||||
"div",
|
||||
{ className: "bee-table-column-filter-cont" },
|
||||
{ className: prefixCls + "-cont" },
|
||||
_react2["default"].createElement(Table, _extends({}, this.props, { columns: _columns, data: data })),
|
||||
_react2["default"].createElement(
|
||||
_beePopover2["default"],
|
||||
|
|
@ -117,7 +119,7 @@ function filterColumn(Table) {
|
|||
show: showModal },
|
||||
_react2["default"].createElement(
|
||||
"div",
|
||||
{ className: "bee-table-column-filter" },
|
||||
{ className: prefixCls + "-pop-column-filter" },
|
||||
_react2["default"].createElement(_beeIcon2["default"], { type: "uf-navmenu", onClick: this.openCloumList })
|
||||
)
|
||||
)
|
||||
|
|
@ -125,7 +127,9 @@ function filterColumn(Table) {
|
|||
};
|
||||
|
||||
return filterColumn;
|
||||
}(_react.Component), _initialiseProps = function _initialiseProps() {
|
||||
}(_react.Component), _class.defaultProps = {
|
||||
prefixCls: "u-table-filter-column"
|
||||
}, _initialiseProps = function _initialiseProps() {
|
||||
var _this2 = this;
|
||||
|
||||
this.getShowModal = function (event) {
|
||||
|
|
@ -156,12 +160,13 @@ function filterColumn(Table) {
|
|||
};
|
||||
|
||||
this.getCloumItem = function () {
|
||||
var prefixCls = _this2.props.prefixCls;
|
||||
var columns = _this2.state.columns;
|
||||
|
||||
return columns.map(function (da, i) {
|
||||
return _react2["default"].createElement(
|
||||
"div",
|
||||
{ key: da.key + "_" + i, className: "item", onClick: function onClick() {
|
||||
{ key: da.key + "_" + i, className: prefixCls + "-pop-cont-item", onClick: function onClick() {
|
||||
_this2.checkedColumItemClick(da);
|
||||
} },
|
||||
_react2["default"].createElement(_beeCheckbox2["default"], { id: da.key, checked: da.checked }),
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "bee-table",
|
||||
"version": "1.1.6",
|
||||
"version": "1.1.7",
|
||||
"description": "Table ui component for react",
|
||||
"keywords": [
|
||||
"react",
|
||||
|
|
|
|||
Loading…
Reference in New Issue