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,105 +47,59 @@ 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;
var selectList = [];
var check = checkedAll ? false : true;
data.forEach(function (item) {
item._checked = check;
if (item._checked) {
selectList.push(item);
}
});
_this.setState({
checkedAll: check
});
_this.props.getSelectedDataFunc(selectList);
};
_this.handleClick = function () {};
_this.onCheckboxChange = function (text, record, index) {
return function () {
var data = _this.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;
}
}
_this.setState(_extends({}, _this.state, {
checkedAll: checkedAll
}));
data.forEach(function (da) {
if (da._checked) {
selectList.push(da);
}
});
_this.props.getSelectedDataFunc(selectList);
};
};
_this.getDefaultColumns = function (columns) {
// let checkedAll = init?false:this.state.checkedAll;
var checkedAll = _this.state.checkedAll;
var _defaultColumns = [{
title: _react2["default"].createElement(Checkbox, {
className: 'table-checkbox',
checked: checkedAll
// indeterminate={indeterminate_bool && !this.state.checkedAll}
, onChange: _this.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: _this.handleClick,
onChange: _this.onCheckboxChange(text, record, index)
}));
}
}];
return _defaultColumns.concat(columns);
};
_initialiseProps.call(_this);
var checkedAll = _this.setChecked(props.data);
_this.state = {
checkedAll: false,
// columns:this.getDefaultColumns(props.columns,"init"),
checkedAll: checkedAll,
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)
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;
@ -156,6 +110,86 @@ function newMultiSelect(Table, Checkbox) {
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);
};
};
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'];

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

4018
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 = [];