fixed: 修改和完善代码和文档
This commit is contained in:
parent
9be18be1c9
commit
c61f9fead6
|
@ -1,15 +1,15 @@
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @title 全选功能
|
* @title 列排序、全选功能
|
||||||
* @description 全选功能
|
* @description 列排序、全选功能
|
||||||
*
|
*
|
||||||
*/
|
*/
|
||||||
|
|
||||||
import React, { Component } from "react";
|
import React, { Component } from "react";
|
||||||
import Table from "../../src";
|
import Table from "../../src";
|
||||||
import Checkbox from "bee-checkbox";
|
import Checkbox from "bee-checkbox";
|
||||||
import multiTable from "../../src/lib/multiSelectFunc.js";
|
import multiSelectFunc from "../../src/lib/multiSelectFunc.js";
|
||||||
import sortTable from "../../src/lib/sortFunc.js";
|
import sortFunc from "../../src/lib/sortFunc.js";
|
||||||
|
|
||||||
const columns13 = [
|
const columns13 = [
|
||||||
{
|
{
|
||||||
|
@ -47,7 +47,7 @@ const data13 = [
|
||||||
{ a: "郭靖", b: "男", c: 25, key: "3" }
|
{ a: "郭靖", b: "男", c: 25, key: "3" }
|
||||||
];
|
];
|
||||||
class Demo13 extends Component {
|
class Demo13 extends Component {
|
||||||
setCheckedOjb = (data) =>{
|
getSelectedDataFunc = (data) =>{
|
||||||
console.log(data)
|
console.log(data)
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
|
@ -55,15 +55,14 @@ class Demo13 extends Component {
|
||||||
type: "checkbox",
|
type: "checkbox",
|
||||||
param: "key"
|
param: "key"
|
||||||
};
|
};
|
||||||
let ComplexTable = multiTable(sortTable(Table));
|
let ComplexTable = multiSelectFunc(sortFunc(Table));
|
||||||
return (
|
return (
|
||||||
<div>
|
<div>
|
||||||
<ComplexTable
|
<ComplexTable
|
||||||
columns={columns13}
|
columns={columns13}
|
||||||
data={data13}
|
data={data13}
|
||||||
multiSelect={multiObj}
|
multiSelect={multiObj}
|
||||||
prefixCls="bee-table"
|
getSelectedDataFunc={this.getSelectedDataFunc}
|
||||||
getSelectedDataFunc={this.setCheckedOjb}
|
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -0,0 +1 @@
|
||||||
|
# editType
|
|
@ -0,0 +1,5 @@
|
||||||
|
## Table
|
||||||
|
## Code display
|
||||||
|
## API
|
||||||
|
|Property|Description|Type|Default|
|
||||||
|
|:---|:-----|:----|:------|
|
|
@ -0,0 +1,35 @@
|
||||||
|
## util
|
||||||
|
|
||||||
|
Table拓展功能方法
|
||||||
|
|
||||||
|
### 如何使用
|
||||||
|
xxx
|
||||||
|
|
||||||
|
|
||||||
|
### multiSelectFunc
|
||||||
|
|
||||||
|
全选功能
|
||||||
|
|
||||||
|
#### Table新增参数
|
||||||
|
|
||||||
|
| 参数 | 说明 | 类型 | 默认值 |
|
||||||
|
| ------------------- | -------------------------- | -------- | -------- |
|
||||||
|
| multiSelect | 全选功能的配置对象,属性参见下面 | obj | {} |
|
||||||
|
| multiSelect.type | 全选功能的类型,多选或单选(暂时只支持多选) | string | checkbox |
|
||||||
|
| multiSelect.param | 通过设置该参数来设计获取的数据数组,默认返还所有数据 | string | '' |
|
||||||
|
| getSelectedDataFunc | 返回当前选中的数据数组 | Function | 无 |
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
### sortFunc
|
||||||
|
|
||||||
|
排序功能
|
||||||
|
|
||||||
|
#### Column新增参数
|
||||||
|
|
||||||
|
| 参数 | 说明 | 类型 | 默认值 |
|
||||||
|
| ------ | ---------- | -------- | ---- |
|
||||||
|
| sorter | 排序函数,可以自定义 | Function | 无 |
|
||||||
|
|
||||||
|
|
||||||
|
|
|
@ -0,0 +1,5 @@
|
||||||
|
## Table
|
||||||
|
## Code display
|
||||||
|
## API
|
||||||
|
|Property|Description|Type|Default|
|
||||||
|
|:---|:-----|:----|:------|
|
|
@ -8,7 +8,7 @@ import Checkbox from "bee-checkbox";
|
||||||
* getSelectedDataFunc--function,能获取到选中的数据
|
* getSelectedDataFunc--function,能获取到选中的数据
|
||||||
* 使用全选时得注意,data中的key值一定要是唯一值
|
* 使用全选时得注意,data中的key值一定要是唯一值
|
||||||
*/
|
*/
|
||||||
module.exports = function multiTable(Table) {
|
module.exports = function multiSelectFunc(Table) {
|
||||||
Array.prototype.indexOf = function(val) {
|
Array.prototype.indexOf = function(val) {
|
||||||
for (var i = 0; i < this.length; i++) {
|
for (var i = 0; i < this.length; i++) {
|
||||||
if (this[i] == val) return i;
|
if (this[i] == val) return i;
|
||||||
|
@ -63,11 +63,14 @@ module.exports = function multiTable(Table) {
|
||||||
let self = this;
|
let self = this;
|
||||||
let allFlag = false;
|
let allFlag = false;
|
||||||
let selIds = self.state.selIds;
|
let selIds = self.state.selIds;
|
||||||
let id = self.props.multiSelect.param
|
let id = self.props.multiSelect
|
||||||
|
? self.props.multiSelect.param
|
||||||
? record[self.props.multiSelect.param]
|
? record[self.props.multiSelect.param]
|
||||||
|
: record
|
||||||
: record;
|
: record;
|
||||||
let checkedObj = Object.assign({}, self.state.checkedObj);
|
let checkedObj = Object.assign({}, self.state.checkedObj);
|
||||||
let checkedArray = Object.keys(checkedObj);
|
let checkedArray = Object.keys(checkedObj);
|
||||||
|
let { getSelectedDataFunc } = self.props;
|
||||||
if (checkedObj[record["key"]]) {
|
if (checkedObj[record["key"]]) {
|
||||||
selIds.remove(id);
|
selIds.remove(id);
|
||||||
} else {
|
} else {
|
||||||
|
@ -87,7 +90,9 @@ module.exports = function multiTable(Table) {
|
||||||
checkedObj: checkedObj,
|
checkedObj: checkedObj,
|
||||||
selIds: selIds
|
selIds: selIds
|
||||||
});
|
});
|
||||||
self.props.getSelectedDataFunc(selIds);
|
if(typeof getSelectedDataFunc === 'function'){
|
||||||
|
getSelectedDataFunc(selIds);
|
||||||
|
}
|
||||||
};
|
};
|
||||||
renderColumnsMultiSelect(columns) {
|
renderColumnsMultiSelect(columns) {
|
||||||
const { data } = this.state;
|
const { data } = this.state;
|
||||||
|
|
|
@ -6,7 +6,7 @@ import Icon from 'bee-icon';
|
||||||
* 参数:prefixCls,默认bee-table,用于设置图标的样式
|
* 参数:prefixCls,默认bee-table,用于设置图标的样式
|
||||||
* @param {*} Table
|
* @param {*} Table
|
||||||
*/
|
*/
|
||||||
export default function sortTable(Table) {
|
export default function sortFunc(Table) {
|
||||||
return class Demo11 extends Component {
|
return class Demo11 extends Component {
|
||||||
constructor(props) {
|
constructor(props) {
|
||||||
super(props);
|
super(props);
|
||||||
|
|
Loading…
Reference in New Issue