Commit 0f983a5c5add73148e146eb4f63886dc8ab17c90

Authored by huanghong
1 parent b0794170

update table columns width compute

Showing 2 changed files with 16 additions and 13 deletions   Show diff stats
examples/routers/table.vue
... ... @@ -57,8 +57,9 @@
57 57 <Header :style="{background: '#eee'}"><Button @click="toggleCollapse">่œๅ•</Button></Header>
58 58 <Content :style="{background:'#FFCF9E'}">
59 59 <!-- <Table border :columns="columns1" height="500" :data="data1"></Table> -->
60   - <br>
61   - <Table border :columns="columns5" :data="data5"></Table>
  60 + <!-- <br> -->
  61 + <!-- <Table border :columns="columns5" :data="data5"></Table> -->
  62 + <Table border :columns="columns8" height="240" :data="data7"></Table>
62 63 </Content>
63 64 <Footer>sdfsdsdfsdfs</Footer>
64 65 </Layout>
... ... @@ -462,8 +463,8 @@
462 463 title: 'Date',
463 464 key: 'date',
464 465 sortable: true,
465   - minWidth:100,
466   - maxWidth:200,
  466 + minWidth:80,
  467 + maxWidth:150,
467 468 },
468 469 {
469 470 title: 'Name',
... ... @@ -474,14 +475,14 @@
474 475 {
475 476 title: 'Age',
476 477 key: 'age',
477   - minWidth:100,
478   - maxWidth:200,
  478 + minWidth:60,
  479 + maxWidth:100,
479 480 },
480 481 {
481 482 title: 'Address',
482 483 key: 'address',
483 484 minWidth:200,
484   - maxWidth:300,
  485 + //maxWidth:300,
485 486 }
486 487 ],
487 488 }
... ...
src/components/table/table.vue
... ... @@ -367,6 +367,7 @@
367 367  
368 368  
369 369 let unUsableWidth = hasWidthColumns.map(cell => cell.width).reduce((a, b) => a + b, 0);
  370 + console.log(tableWidth);
370 371 let usableWidth = tableWidth - unUsableWidth - (this.showVerticalScrollBar?this.scrollBarWidth:0);
371 372 let usableLength = noWidthColumns.length;
372 373 let columnWidth = 0;
... ... @@ -425,13 +426,13 @@
425 426 if (column._width) {
426 427 width = column._width;
427 428 }
428   - else if (column.minWidth > width){
429   - width = column.minWidth;
430   - }
431   - else if (column.maxWidth < width){
432   - width = column.maxWidth;
433   - }
434 429 else {
  430 + if (column.minWidth > width){
  431 + width = column.minWidth;
  432 + }
  433 + else if (column.maxWidth < width){
  434 + width = column.maxWidth;
  435 + }
435 436 if (usableWidth>0) {
436 437 if (usableLength > 1) {
437 438 usableLength--;
... ... @@ -457,6 +458,7 @@
457 458 }
458 459 //this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0);
459 460 this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0) + (this.showVerticalScrollBar?this.scrollBarWidth:0);
  461 + console.log(this.tableWidth);
460 462 this.columnsWidth = columnsWidth;
461 463 this.fixedHeader();
462 464 },
... ...