drip-public/iview
6
1
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

update table columns width compute

Browse source
This commit is contained in:
huanghong 2018-04-16 21:26:54 +08:00
parent b0794170c4
commit 0f983a5c5a
2 changed files with 16 additions and 13 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

15
examples/routers/table.vue
View file

@ -57,8 +57,9 @@
<Header :style="{background: '#eee'}"><Button @click="toggleCollapse">菜单</Button></Header> <Header :style="{background: '#eee'}"><Button @click="toggleCollapse">菜单</Button></Header>
<Content :style="{background:'#FFCF9E'}"> <Content :style="{background:'#FFCF9E'}">
<!-- <Table border :columns="columns1" height="500" :data="data1"></Table> --> <!-- <Table border :columns="columns1" height="500" :data="data1"></Table> -->
<br> <!-- <br> -->
<Table border :columns="columns5" :data="data5"></Table> <!-- <Table border :columns="columns5" :data="data5"></Table> -->
<Table border :columns="columns8" height="240" :data="data7"></Table>
</Content> </Content>
<Footer>sdfsdsdfsdfs</Footer> <Footer>sdfsdsdfsdfs</Footer>
</Layout> </Layout>
@ -462,8 +463,8 @@
title: 'Date', title: 'Date',
key: 'date', key: 'date',
sortable: true, sortable: true,
minWidth:100, minWidth:80,
maxWidth:200, maxWidth:150,
}, },
{ {
title: 'Name', title: 'Name',
@ -474,14 +475,14 @@
{ {
title: 'Age', title: 'Age',
key: 'age', key: 'age',
minWidth:100, minWidth:60,
maxWidth:200, maxWidth:100,
}, },
{ {
title: 'Address', title: 'Address',
key: 'address', key: 'address',
minWidth:200, minWidth:200,
maxWidth:300, //maxWidth:300,
} }
], ],
} }

14
src/components/table/table.vue
View file

@ -367,6 +367,7 @@
let unUsableWidth = hasWidthColumns.map(cell => cell.width).reduce((a, b) => a + b, 0); let unUsableWidth = hasWidthColumns.map(cell => cell.width).reduce((a, b) => a + b, 0);
console.log(tableWidth);
let usableWidth = tableWidth - unUsableWidth - (this.showVerticalScrollBar?this.scrollBarWidth:0); let usableWidth = tableWidth - unUsableWidth - (this.showVerticalScrollBar?this.scrollBarWidth:0);
let usableLength = noWidthColumns.length; let usableLength = noWidthColumns.length;
let columnWidth = 0; let columnWidth = 0;
@ -425,13 +426,13 @@
if (column._width) { if (column._width) {
width = column._width; width = column._width;
} }
else if (column.minWidth > width){
width = column.minWidth;
}
else if (column.maxWidth < width){
width = column.maxWidth;
}
else { else {
if (column.minWidth > width){
width = column.minWidth;
}
else if (column.maxWidth < width){
width = column.maxWidth;
}
if (usableWidth>0) { if (usableWidth>0) {
if (usableLength > 1) { if (usableLength > 1) {
usableLength--; usableLength--;
@ -457,6 +458,7 @@
} }
//this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0); //this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0);
this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0) + (this.showVerticalScrollBar?this.scrollBarWidth:0); this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0) + (this.showVerticalScrollBar?this.scrollBarWidth:0);
console.log(this.tableWidth);
this.columnsWidth = columnsWidth; this.columnsWidth = columnsWidth;
this.fixedHeader(); this.fixedHeader();
}, },