feat(动态控制过滤列,并提供回调函数):

This commit is contained in:
wanghaoo 2018-09-04 10:16:53 +08:00
parent 3a2d0328e4
commit ba0dab7110
4 changed files with 113 additions and 100 deletions

View File

@ -220,7 +220,7 @@
overflow-x: scroll; overflow-x: scroll;
padding-bottom: 20px; padding-bottom: 20px;
margin-bottom: -20px; margin-bottom: -20px;
overflow-y: auto; overflow-y: scroll;
box-sizing: border-box; } box-sizing: border-box; }
.u-table-title { .u-table-title {
padding: 12px 8px; padding: 12px 8px;

View File

@ -32,6 +32,7 @@ function _possibleConstructorReturn(self, call) { if (!self) { throw new Referen
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 _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 noop() {}
/** /**
* 参数: 过滤表头 * 参数: 过滤表头
* @param {*} Table * @param {*} Table
@ -65,11 +66,11 @@ function filterColumn(Table, Popover) {
FilterColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) { FilterColumn.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
if (nextProps.columns != this.props.columns) { if (nextProps.columns != this.props.columns) {
this.setState({ this.setState({
columns: (0, _utils.ObjectAssign)(nextProps.columns) columns: this.setColumOrderByIndex((0, _utils.ObjectAssign)(nextProps.columns))
}); });
} }
this.setState({ this.setState({
showModal: false showModal: nextProps.showFilterPopover ? true : false
}); });
}; };
@ -87,7 +88,7 @@ function filterColumn(Table, Popover) {
widthState = 0, widthState = 0,
scroll = scrollPro; scroll = scrollPro;
columns.forEach(function (da) { columns.forEach(function (da) {
if (da.disable) { if (da.ifshow) {
_columns.push(da); _columns.push(da);
if (da.width) { if (da.width) {
widthState++; widthState++;
@ -142,20 +143,30 @@ function filterColumn(Table, Popover) {
return FilterColumn; return FilterColumn;
}(_react.Component), _class.defaultProps = { }(_react.Component), _class.defaultProps = {
prefixCls: "u-table-filter-column" prefixCls: "u-table-filter-column",
afterFilter: noop,
scroll: {}
}, _initialiseProps = function _initialiseProps() { }, _initialiseProps = function _initialiseProps() {
var _this2 = this; var _this2 = this;
this.setColumOrderByIndex = function (_column) { this.setColumOrderByIndex = function (_column) {
_column.forEach(function (da) { _column.forEach(function (da) {
da.checked = true; //默认所有的列都显示如果传递ifshow属性根据ifshow属性值来判断是否显示某列
da.disable = true; if (da.hasOwnProperty('ifshow')) {
da.checked = da.ifshow ? true : false;
da.ifshow = da.checked;
} else {
da.checked = true;
da.ifshow = true;
}
}); });
return _column; return _column;
}; };
this.checkedColumItemClick = function (da) { this.checkedColumItemClick = function (da) {
var checkMinSize = _this2.props.checkMinSize; var _props2 = _this2.props,
checkMinSize = _props2.checkMinSize,
afterFilter = _props2.afterFilter;
// if(checkMinSize) // if(checkMinSize)
var sum = 0, var sum = 0,
@ -170,8 +181,10 @@ function filterColumn(Table, Popover) {
if (sum <= 1 && da.checked) return; if (sum <= 1 && da.checked) return;
} }
da.checked = da.checked ? false : true; da.checked = da.checked ? false : true;
da.disable = da.checked ? true : false; da.ifshow = da.checked ? true : false;
_this2.setState(_extends({}, _this2.state)); _this2.setState(_extends({}, _this2.state));
afterFilter(da, _this2.state.columns);
}; };
this.openCloumList = function () { this.openCloumList = function () {
@ -207,7 +220,7 @@ function filterColumn(Table, Popover) {
columns.forEach(function (da) { columns.forEach(function (da) {
da.checked = true; da.checked = true;
da.disable = true; da.ifshow = true;
}); });
_this2.setState(_extends({}, _this2.state)); _this2.setState(_extends({}, _this2.state));
}; };
@ -219,7 +232,7 @@ function filterColumn(Table, Popover) {
sum += da.width; sum += da.width;
} }
}); });
console.log("sum", sum); // console.log("sum",sum);
return sum; return sum;
}; };
}, _temp; }, _temp;

View File

@ -82,7 +82,7 @@ function sort(Table, Icon) {
}; };
_this.renderColumnsDropdown = function (columns) { _this.renderColumnsDropdown = function (columns) {
var prefixCls = _this.props.prefixCls || "bee-table"; var prefixCls = "bee-table";
return columns.map(function (originColumn) { return columns.map(function (originColumn) {
var column = _extends({}, originColumn); var column = _extends({}, originColumn);
var sortButton = void 0; var sortButton = void 0;

View File

@ -1,91 +1,91 @@
{ {
"name": "bee-table", "name": "bee-table",
"version": "1.3.6", "version": "1.3.7",
"description": "Table ui component for react", "description": "Table ui component for react",
"keywords": [ "keywords": [
"react", "react",
"react-component", "react-component",
"bee-table", "bee-table",
"iuap-design", "iuap-design",
"tinper-bee", "tinper-bee",
"Table" "Table"
],
"engines": {
"node": ">=4.0.0"
},
"jest": {
"moduleFileExtensions": [
"js",
"jsx"
], ],
"engines": { "transform": {
"node": ">=4.0.0" "^.+\\.js$": "babel-jest"
},
"jest": {
"moduleFileExtensions": [
"js",
"jsx"
],
"transform": {
"^.+\\.js$": "babel-jest"
}
},
"homepage": "https://github.com/tinper-bee/bee-table.git",
"author": "Yonyou FED",
"repository": "http://github.com/tinper-bee/bee-table",
"bugs": "https://github.com/tinper-bee/bee-table.git/issues",
"license": "MIT",
"main": "./build/index.js",
"config": {
"port": 3000,
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
},
"scripts": {
"dev": "bee-tools run start",
"build": "bee-tools run build",
"lint": "bee-tools run lint",
"test": "jest",
"chrome": "bee-tools run chrome",
"coveralls": "jest",
"browsers": "bee-tools run browsers",
"pub": "bee-tools run pub",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
},
"dependencies": {
"bee-dnd": "^1.0.2",
"bee-loading": "^1.0.3",
"bee-popover": "^1.0.2",
"bee-select": "^1.0.8",
"classnames": "^2.2.5",
"lodash.clonedeep": "^4.5.0",
"object-path": "^0.11.3",
"shallowequal": "^1.0.2",
"tinper-bee-core": "latest",
"warning": "^3.0.0"
},
"peerDependencies": {
"react": "^15.3.0 || ^16.0",
"react-dom": "^15.3.0 || ^16.0",
"prop-types": "15.6.0"
},
"devDependencies": {
"babel-jest": "^22.0.4",
"bee-animate": "latest",
"bee-button": "latest",
"bee-checkbox": "^1.0.8",
"bee-datepicker": "latest",
"bee-form": "^1.0.8",
"bee-form-control": "latest",
"bee-icon": "latest",
"bee-input-group": "latest",
"bee-layout": "latest",
"bee-pagination": "latest",
"bee-panel": "^1.2.12",
"bee-popconfirm": "^1.0.2",
"bee-tools": "latest",
"bee-tooltip": "^1.0.2",
"chai": "^3.5.0",
"console-polyfill": "~0.2.1",
"cz-conventional-changelog": "^2.1.0",
"enzyme": "^2.9.1",
"es5-shim": "~4.1.10",
"jest": "^22.0.4",
"react": "^15.5.0",
"react-addons-test-utils": "^15.5.0",
"react-dom": "^15.5.0"
} }
} },
"homepage": "https://github.com/tinper-bee/bee-table.git",
"author": "Yonyou FED",
"repository": "http://github.com/tinper-bee/bee-table",
"bugs": "https://github.com/tinper-bee/bee-table.git/issues",
"license": "MIT",
"main": "./build/index.js",
"config": {
"port": 3000,
"commitizen": {
"path": "./node_modules/cz-conventional-changelog"
}
},
"scripts": {
"dev": "bee-tools run start",
"build": "bee-tools run build",
"lint": "bee-tools run lint",
"test": "jest",
"chrome": "bee-tools run chrome",
"coveralls": "jest",
"browsers": "bee-tools run browsers",
"pub": "bee-tools run pub",
"changelog": "conventional-changelog -p angular -i CHANGELOG.md -s -r 0"
},
"dependencies": {
"bee-dnd": "^1.0.2",
"bee-loading": "^1.0.3",
"bee-popover": "^1.0.2",
"bee-select": "^1.0.8",
"classnames": "^2.2.5",
"lodash.clonedeep": "^4.5.0",
"object-path": "^0.11.3",
"shallowequal": "^1.0.2",
"tinper-bee-core": "latest",
"warning": "^3.0.0"
},
"peerDependencies": {
"react": "^15.3.0 || ^16.0",
"react-dom": "^15.3.0 || ^16.0",
"prop-types": "15.6.0"
},
"devDependencies": {
"babel-jest": "^22.0.4",
"bee-animate": "latest",
"bee-button": "latest",
"bee-checkbox": "^1.0.8",
"bee-datepicker": "latest",
"bee-form": "^1.0.8",
"bee-form-control": "latest",
"bee-icon": "latest",
"bee-input-group": "latest",
"bee-layout": "latest",
"bee-pagination": "latest",
"bee-panel": "^1.2.12",
"bee-popconfirm": "^1.0.2",
"bee-tools": "latest",
"bee-tooltip": "^1.0.2",
"chai": "^3.5.0",
"console-polyfill": "~0.2.1",
"cz-conventional-changelog": "^2.1.0",
"enzyme": "^2.9.1",
"es5-shim": "~4.1.10",
"jest": "^22.0.4",
"react": "^15.5.0",
"react-addons-test-utils": "^15.5.0",
"react-dom": "^15.5.0"
}
}