增加复杂场景下大数据渲染示例;左右固定宽度支持字符串

This commit is contained in:
wanghaoo 2018-12-24 11:24:51 +08:00
parent 097537ef75
commit b9c66aed7f
6 changed files with 49 additions and 28 deletions

View File

@ -14,9 +14,8 @@ import Table from "../../src";
import BigData from "../../src/lib/bigData";
import multiSelect from '../../src/lib/MultiSelect';
import filterColumn from '../../src/lib/filterColumn';
import sort from '../../src/lib/sort';
let ComplexTable = filterColumn(BigData(multiSelect(Table, Checkbox)), Popover, Icon);
let ComplexTable = filterColumn(multiSelect(BigData(Table), Checkbox), Popover, Icon);
const columns = [
{
@ -88,6 +87,9 @@ class Demo32 extends Component {
selectedRowIndex: 0
}
}
getSelectedDataFunc = data => {
console.log(data);
};
render() {
return (
@ -102,8 +104,7 @@ class Demo32 extends Component {
selectedRowIndex: index
});
}}
/>
getSelectedDataFunc={this.getSelectedDataFunc}/>
);
}

File diff suppressed because one or more lines are too long

40
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

@ -177,24 +177,32 @@ export default class ColumnManager {
return res;
}
getLeftColumnsWidth() {
getLeftColumnsWidth(contentWidth=1) {
return this._cache('leftColumnsWidth', () => {
let leftColumnsWidth =0;
this.groupedColumns().forEach(column =>{
if (column.fixed === 'left' || column.fixed === true){
leftColumnsWidth += column.width;
let width = column.width;
if(typeof(width) == 'string' && width.includes('%') ){
width = contentWidth * parseInt(col.width) /100;
}
leftColumnsWidth += parseInt(width)
}
});
return leftColumnsWidth;
});
}
getRightColumnsWidth() {
getRightColumnsWidth(contentWidth=1) {
return this._cache('rightColumnsWidth', () => {
let rightColumnsWidth =0;
this.groupedColumns().forEach(column =>{
if (column.fixed === 'right'){
rightColumnsWidth += column.width;
let width = column.width;
if(typeof(width) == 'string' && width.includes('%') ){
width = contentWidth * parseInt(col.width) /100;
}
rightColumnsWidth += parseInt(width)
}
});
return rightColumnsWidth;

View File

@ -760,12 +760,12 @@ class Table extends Component {
if (scroll.x === true) {
tableStyle.tableLayout = 'fixed';
} else {
tableStyle.width = this.contentWidth - this.columnManager.getLeftColumnsWidth() - this.columnManager.getRightColumnsWidth();
tableStyle.width = this.contentWidth - this.columnManager.getLeftColumnsWidth(this.contentWidth) - this.columnManager.getRightColumnsWidth(this.contentWidth);
}
}
// 自动出现滚动条
if ( !fixed && this.contentDomWidth < this.contentWidth) {
tableStyle.width = this.contentWidth - this.columnManager.getLeftColumnsWidth() - this.columnManager.getRightColumnsWidth();
tableStyle.width = this.contentWidth - this.columnManager.getLeftColumnsWidth(this.contentWidth) - this.columnManager.getRightColumnsWidth(this.contentWidth);
}
const tableBody = hasBody ? getBodyWrapper(
<tbody className={`${clsPrefix}-tbody`}>
@ -840,8 +840,8 @@ class Table extends Component {
</div>
);
}
const leftFixedWidth = this.columnManager.getLeftColumnsWidth();
const rightFixedWidth = this.columnManager.getRightColumnsWidth();
const leftFixedWidth = this.columnManager.getLeftColumnsWidth(this.contentWidth);
const rightFixedWidth = this.columnManager.getRightColumnsWidth(this.contentWidth);
let parStyle = {}
if(!fixed){
parStyle = {'marginLeft':leftFixedWidth,'marginRight':rightFixedWidth}