fix: 解决合计行与排序组合使用时的问题
This commit is contained in:
parent
350dc43193
commit
6f6abe5303
|
@ -10,7 +10,7 @@ import Table from "../../src";
|
|||
import Checkbox from "bee-checkbox";
|
||||
import multiSelect from "../../src/lib/multiSelect.js";
|
||||
import sort from "../../src/lib/sort.js";
|
||||
import Sum from "../../src/lib/sum.js";
|
||||
import sum from "../../src/lib/sum.js";
|
||||
|
||||
const columns13 = [
|
||||
{
|
||||
|
@ -54,7 +54,6 @@ class Demo13 extends Component {
|
|||
render() {
|
||||
let multiObj = {
|
||||
type: "checkbox",
|
||||
param: "key"
|
||||
};
|
||||
let ComplexTable = multiSelect(sum(sort(Table)));
|
||||
return (
|
||||
|
|
File diff suppressed because one or more lines are too long
|
@ -34,6 +34,7 @@
|
|||
},
|
||||
"dependencies": {
|
||||
"classnames": "^2.2.5",
|
||||
"lodash.clonedeep": "^4.5.0",
|
||||
"object-path": "^0.11.3",
|
||||
"shallowequal": "^0.2.2",
|
||||
"tinper-bee-core": "^0.1.6",
|
||||
|
|
|
@ -115,6 +115,7 @@ $table-move-in-color: $bg-color-base;
|
|||
&-expand-icon {
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-right: 10px;
|
||||
width: 16px;
|
||||
height: 16px;
|
||||
text-align: center;
|
||||
|
|
|
@ -1,6 +1,5 @@
|
|||
|
||||
import React, { Component } from 'react';
|
||||
import Icon from 'bee-icon';
|
||||
import React, { Component } from "react";
|
||||
import Icon from "bee-icon";
|
||||
|
||||
/**
|
||||
* 参数:prefixCls,默认bee-table,用于设置图标的样式
|
||||
|
@ -17,13 +16,13 @@ export default function sort(Table) {
|
|||
}
|
||||
toggleSortOrder = (order, column) => {
|
||||
let { sortOrder, data, oldData } = this.state;
|
||||
let ascend_sort = function (key) {
|
||||
return function (a, b) {
|
||||
let ascend_sort = function(key) {
|
||||
return function(a, b) {
|
||||
return a.key - b.key;
|
||||
};
|
||||
};
|
||||
let descend_sort = function (key) {
|
||||
return function (a, b) {
|
||||
let descend_sort = function(key) {
|
||||
return function(a, b) {
|
||||
return b.key - a.key;
|
||||
};
|
||||
};
|
||||
|
@ -35,11 +34,11 @@ export default function sort(Table) {
|
|||
oldData = data.concat();
|
||||
}
|
||||
if (order === "ascend") {
|
||||
data = data.sort(function (a, b) {
|
||||
data = data.sort(function(a, b) {
|
||||
return column.sorter(a, b);
|
||||
});
|
||||
} else if (order === "descend") {
|
||||
data = data.sort(function (a, b) {
|
||||
data = data.sort(function(a, b) {
|
||||
return column.sorter(b, a);
|
||||
});
|
||||
} else {
|
||||
|
@ -50,10 +49,10 @@ export default function sort(Table) {
|
|||
data: data,
|
||||
oldData: oldData
|
||||
});
|
||||
}
|
||||
};
|
||||
renderColumnsDropdown(columns) {
|
||||
const { sortOrder } = this.state;
|
||||
const prefixCls = this.props.prefixCls || 'bee-table';
|
||||
const prefixCls = this.props.prefixCls || "bee-table";
|
||||
return columns.map(originColumn => {
|
||||
let column = Object.assign({}, originColumn);
|
||||
let sortButton;
|
||||
|
@ -93,8 +92,8 @@ export default function sort(Table) {
|
|||
});
|
||||
}
|
||||
render() {
|
||||
let columns = this.renderColumnsDropdown(this.props.columns).concat();
|
||||
return <Table{...this.props} columns={columns} data={this.state.data}/>;
|
||||
let columns = this.renderColumnsDropdown(this.props.columns.concat());
|
||||
return <Table {...this.props} columns={columns} data={this.state.data} />;
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
}
|
||||
|
|
|
@ -1,4 +1,5 @@
|
|||
import React from "react";
|
||||
import clonedeep from "lodash.clonedeep";
|
||||
|
||||
//创建新列存放 “合计” 字段
|
||||
let columns2 = {
|
||||
|
@ -16,7 +17,7 @@ let sum = Table => {
|
|||
//合计数字列,并将计算所得数据存储到一个obj对象中
|
||||
currentFooter = () => {
|
||||
let data_2 = this.props.data;
|
||||
let columns_sum = this.props.columns;
|
||||
let columns_sum = clonedeep(this.props.columns);
|
||||
//用一个对象存储合计数据,这里合计对象的属性对应每列字段
|
||||
let obj = {};
|
||||
if (Array.isArray(data_2)) {
|
||||
|
@ -42,16 +43,20 @@ let sum = Table => {
|
|||
columns_sum[0] = Object.assign({}, columns_sum[0], columns2);
|
||||
// }
|
||||
//除去列为特殊渲染的,避免像a标签这种html代码写入到合计中
|
||||
columns_sum = columns_sum.map((item, index) => {
|
||||
columns_sum.map((item, index) => {
|
||||
if (typeof item.render == "function") {
|
||||
delete item.render;
|
||||
item.render = '';
|
||||
}
|
||||
return item;
|
||||
});
|
||||
return <Table showHeader={false} columns={columns_sum} data={obj} />;
|
||||
};
|
||||
render() {
|
||||
return <Table {...this.props} footer={this.currentFooter} />;
|
||||
return <Table
|
||||
columns={this.props.columns}
|
||||
data={this.props.data}
|
||||
footer={this.currentFooter}
|
||||
/>;
|
||||
}
|
||||
};
|
||||
};
|
||||
|
|
Loading…
Reference in New Issue