This commit is contained in:
wanghaoo 2018-09-19 10:47:09 +08:00
commit c31f73979c
8 changed files with 2171 additions and 2094 deletions

View File

@ -70,7 +70,7 @@
right: 0;
bottom: 0;
left: 0;
z-index: 1900;
z-index: 1600;
opacity: .7;
filter: blur(0.5px);
background-color: #fff; }

View File

@ -37,7 +37,7 @@ function _inherits(subClass, superClass) { if (typeof superClass !== "function"
*/
function newMultiSelect(Table, Checkbox) {
var _class, _temp;
var _class, _temp, _initialiseProps;
return _temp = _class = function (_Component) {
_inherits(NewMultiSelect, _Component);
@ -47,10 +47,76 @@ function newMultiSelect(Table, Checkbox) {
var _this = _possibleConstructorReturn(this, _Component.call(this, props));
_this.onAllCheckChange = function () {
var _this$state = _this.state,
data = _this$state.data,
checkedAll = _this$state.checkedAll;
_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;
@ -60,17 +126,17 @@ function newMultiSelect(Table, Checkbox) {
selectList.push(item);
}
});
_this.setState({
_this2.setState({
checkedAll: check
});
_this.props.getSelectedDataFunc(selectList);
_this2.props.getSelectedDataFunc(selectList);
};
_this.handleClick = function () {};
this.handleClick = function () {};
_this.onCheckboxChange = function (text, record, index) {
this.onCheckboxChange = function (text, record, index) {
return function () {
var data = _this.state.data;
var data = _this2.state.data;
var selectList = [];
record._checked = record._checked ? false : true;
@ -82,7 +148,7 @@ function newMultiSelect(Table, Checkbox) {
break;
}
}
_this.setState(_extends({}, _this.state, {
_this2.setState(_extends({}, _this2.state, {
checkedAll: checkedAll
}));
data.forEach(function (da) {
@ -90,20 +156,20 @@ function newMultiSelect(Table, Checkbox) {
selectList.push(da);
}
});
_this.props.getSelectedDataFunc(selectList);
_this2.props.getSelectedDataFunc(selectList);
};
};
_this.getDefaultColumns = function (columns) {
this.getDefaultColumns = function (columns) {
// let checkedAll = init?false:this.state.checkedAll;
var checkedAll = _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: _this.onAllCheckChange
, onChange: _this2.onAllCheckChange
}),
key: "checkbox",
dataIndex: "checkbox",
@ -117,45 +183,13 @@ function newMultiSelect(Table, Checkbox) {
className: 'table-checkbox'
}, attr, {
checked: record._checked,
onClick: _this.handleClick,
onChange: _this.onCheckboxChange(text, record, index)
onClick: _this2.handleClick,
onChange: _this2.onCheckboxChange(text, record, index)
}));
}
}];
return _defaultColumns.concat(columns);
};
_this.state = {
checkedAll: false,
// columns:this.getDefaultColumns(props.columns,"init"),
data: (0, _util.ObjectAssign)(props.data)
};
return _this;
}
NewMultiSelect.prototype.componentWillReceiveProps = function componentWillReceiveProps(nextProps) {
// if(this.props.columns != nextProps.columns){
// this.setState({
// columns:this.getDefaultColumns(nextProps.columns)
// })
// }
if (this.props.data != nextProps.data) {
this.setState({
data: (0, _util.ObjectAssign)(nextProps.data)
});
}
};
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"
}, _temp;
}
module.exports = exports['default'];

View File

@ -8,7 +8,7 @@
import React, { Component } from 'react';
import Table from '../../src';
import multiSelect from "../../src/lib/multiSelect.js";
import multiSelect from "../../src/lib/newMultiSelect.js";
import Checkbox from 'bee-checkbox';
const columns12 = [
@ -39,9 +39,9 @@ const columns12 = [
];
const data12 = [
{ a: "杨过", b: "男", c: 30,d:'内行', key: "2" },
{ a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" },
{ a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" }
{ a: "杨过", b: "男", c: 30,d:'内行', key: "2",_checked:true },
{ a: "令狐冲", b: "男", c: 41,d:'大侠', key: "1" ,_checked:true},
{ a: "郭靖", b: "男", c: 25,d:'大侠', key: "3" ,_checked:true}
];
//拼接成复杂功能的table组件不能在render中定义需要像此例子声明在组件的外侧不然操作state会导致功能出现异常
let MultiSelectTable = multiSelect(Table, Checkbox);

File diff suppressed because one or more lines are too long

4020
dist/demo.js vendored

File diff suppressed because one or more lines are too long

2
dist/demo.js.map vendored

File diff suppressed because one or more lines are too long

View File

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

View File

@ -18,26 +18,35 @@ export default function newMultiSelect(Table, Checkbox) {
constructor(props) {
super(props);
let checkedAll = this.setChecked(props.data);
this.state = {
checkedAll:false,
// columns:this.getDefaultColumns(props.columns,"init"),
checkedAll,
data:ObjectAssign(props.data),
}
}
componentWillReceiveProps(nextProps){
// if(this.props.columns != nextProps.columns){
// this.setState({
// columns:this.getDefaultColumns(nextProps.columns)
// })
// }
if(this.props.data != nextProps.data){
this.setState({
data:ObjectAssign(nextProps.data)
data:ObjectAssign(nextProps.data),
checkedAll:this.setChecked(nextProps.data),
})
}
}
setChecked(data){
let allCheck = true;
if(data){
for (const da of data) {
if(!da._checked){
allCheck = false;
break;
}
}
}
return allCheck;
}
onAllCheckChange=()=>{
let {data,checkedAll} = this.state;
let selectList = [];