From 77201524baf3a26262824783c8586074af81a48a Mon Sep 17 00:00:00 2001
From: huanghong <huanghong1125@126.com>
Date: Fri, 30 Mar 2018 22:12:54 +0800
Subject: [PATCH] column add prop minValue and maxValue

---
 examples/routers/table.vue     |  42 ++++++++++++++++++++++++++++++++++++------
 src/components/table/table.vue | 150 +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++-----------------------------------------------
 2 files changed, 139 insertions(+), 53 deletions(-)

diff --git a/examples/routers/table.vue b/examples/routers/table.vue
index d6e094b..7434bfd 100644
--- a/examples/routers/table.vue
+++ b/examples/routers/table.vue
@@ -1,15 +1,17 @@
 <template>
     <div>
-        <br><br><br><br><br>
+        <!-- <br><br><br><br><br>
         <Table border :columns="columns1" height="500" :data="data1"></Table>
-        <br><br><br><br><br>
+        <br><br><br><br><br> -->
         <!--<Table width="550" height="200" border :columns="columns2" :data="data4"></Table>-->
         <!--<br><br><br><br><br>-->
-        <Table border :columns="columns5" height="240" :data="data5"></Table>
+        <!-- <Table border :columns="columns5" height="240" :data="data5"></Table> -->
         <br><br><br><br><br>
-        <Table border :columns="columns6" :data="data5"></Table>
+        <!-- <Table border :columns="columns6" :data="data5"></Table> -->
         <br><br><br><br><br>
-        <Table border :columns="columns7"  height="240" :data="data7"></Table>
+        <!-- <Table border :columns="columns7"  height="240" :data="data7"></Table>
+        <br><br><br><br><br> -->
+        <Table border :columns="columns8"  :data="data7" height="200"></Table>
         <br><br><br><br><br>
     </div>
 </template>
@@ -117,7 +119,7 @@
                         key: 'gender',
                         align: 'center',
                         width: 200,
-                        //fixed: 'right'
+                        fixed: 'right'
                     }
                 ],
                 columns2: [
@@ -393,6 +395,34 @@
                         date: '2016-10-04'
                     }
                 ],
+                
+                columns8: [
+                    {
+                        title: 'Date',
+                        key: 'date',
+                        sortable: true,
+                        minWidth:100,
+                        maxWidth:200,
+                    },
+                    {
+                        title: 'Name',
+                        key: 'name',
+                        minWidth:100,
+                        maxWidth:200,
+                    },
+                    {
+                        title: 'Age',
+                        key: 'age',
+                        minWidth:100,
+                        maxWidth:200,
+                    },
+                    {
+                        title: 'Address',
+                        key: 'address',
+                        minWidth:200,
+                        maxWidth:300,
+                    }
+                ],
             }
         },
         mounted () {
diff --git a/src/components/table/table.vue b/src/components/table/table.vue
index f679020..1255070 100644
--- a/src/components/table/table.vue
+++ b/src/components/table/table.vue
@@ -375,60 +375,116 @@
                     });
                     this.$nextTick(() => {
                         let columnsWidth = {};
-                        let autoWidthIndex = -1;
-                        if (allWidth) autoWidthIndex = this.cloneColumns.findIndex(cell => !cell.width);//todo 这行可能有问题
-
-                        if (this.data.length) {
-                            const $tr = this.$refs.tbody.$el.querySelectorAll('tbody tr');
-                            if ($tr.length === 0) return;
-                            const $td = $tr[0].children;
-                            for (let i = 0; i < $td.length; i++) {    // can not use forEach in Firefox
-                                const column = this.cloneColumns[i];
-
-                                let width = parseInt(getStyle($td[i], 'width'));
-                                if (i === autoWidthIndex) {
-                                    width = parseInt(getStyle($td[i], 'width')) - 1;
+
+                        let hasWidthColumns = [];
+                        let noWidthColumns = [];
+                        let minWidthColumns = [];
+                        let maxWidthColumns = [];
+                        this.cloneColumns.forEach((col) => {
+                            if (col.width) {
+                                hasWidthColumns.push(col);
+                            }
+                            else{
+                                noWidthColumns.push(col);
+                                if(col.minWidth){
+                                    minWidthColumns.push(col);
                                 }
-                                if (column.width) width = column.width;
+                                if(col.maxWidth){
+                                    maxWidthColumns.push(col);
+                                }
+                            }
+                        });
 
-                                this.cloneColumns[i]._width = width;
+                        minWidthColumns.sort((a,b)=>a.minWidth > b.minWidth);
+                        maxWidthColumns.sort((a,b)=>a.maxWidth < b.maxWidth);
 
-                                columnsWidth[column._index] = {
-                                    width: width
-                                };
+                        let unUsableWidth = hasWidthColumns.map(cell => cell.width).reduce((a, b) => a + b, 0);
+                        let usableWidth = this.tableWidth - unUsableWidth - (this.showVerticalScrollBar?this.scrollBarWidth:0);
+                        let usableLength = noWidthColumns.length;
+                        let columnWidth = parseInt(usableWidth / usableLength);
+
+                        for (let i = 0; i < maxWidthColumns.length; i++) {
+                            if(columnWidth > maxWidthColumns[i].maxWidth){
+                                usableWidth -= maxWidthColumns[i].maxWidth;
+                                usableLength--;
+                                columnWidth = parseInt(usableWidth / usableLength);
                             }
-                            this.columnsWidth = columnsWidth;
-                            this.$nextTick(()=>{
-                                this.fixedHeader();
-                                if (this.$refs.tbody) {
-                                    let bodyContentEl = this.$refs.tbody.$el;
-                                    let bodyEl = bodyContentEl.parentElement;
-                                    let bodyContentHeight = bodyContentEl.offsetHeight;
-                                    let bodyContentWidth = bodyContentEl.offsetWidth;
-                                    let bodyWidth = bodyEl.offsetWidth;
-                                    let bodyHeight = bodyEl.offsetHeight;
-                                    let scrollBarWidth = 0;
-                                    if (bodyWidth < bodyContentWidth + (bodyHeight<bodyContentHeight?this.scrollBarWidth : 0)) {
-                                        scrollBarWidth = this.scrollBarWidth;
-                                    }
-                                    
-                                    this.showVerticalScrollBar = this.bodyHeight? bodyHeight - scrollBarWidth < bodyContentHeight : false;
-                                    this.showHorizontalScrollBar = bodyWidth  < bodyContentWidth + (this.showVerticalScrollBar?this.scrollBarWidth:0);
-                                    
-                                    if(this.showVerticalScrollBar){
-                                        bodyEl.classList.add(this.prefixCls +'-overflowY');
-                                    }else{
-                                        bodyEl.classList.remove(this.prefixCls +'-overflowY');
-                                    }
-                                    if(this.showHorizontalScrollBar){
-                                        bodyEl.classList.add(this.prefixCls +'-overflowX');
-                                    }else{
-                                        bodyEl.classList.remove(this.prefixCls +'-overflowX');
-                                    }
+                        }
+
+                        for (let i = 0; i < minWidthColumns.length; i++) {
+                            if(columnWidth < minWidthColumns[i].minWidth){
+                                usableWidth -= minWidthColumns[i].minWidth;
+                                usableLength--;
+                                columnWidth = parseInt(usableWidth / usableLength);
+                            }
+                        }
 
+                        if (usableLength===0){
+                            columnWidth = 0;
+                        }
+                        
+                        for (let i = 0; i < this.cloneColumns.length; i++) {
+                            const column = this.cloneColumns[i];
+                            let width = columnWidth;
+                            if(column.width){
+                                width = column.width;
+                            }
+                            else{
+                                if (column.minWidth > width){
+                                    width = column.minWidth;
+                                }
+                                else if (column.maxWidth < width){
+                                    width = column.maxWidth;
+                                }
+                                else{
+                                    if (usableLength > 1) {
+                                        usableLength--;
+                                        usableWidth -= width;
+                                        columnWidth = parseInt(usableWidth / usableLength);
+                                    }
                                 }
-                            });
+                            }
+
+
+                            this.cloneColumns[i]._width = width;
+
+                            columnsWidth[column._index] = {
+                                width: width
+                            };
+
                         }
+                        this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0);
+                        this.columnsWidth = columnsWidth;
+                        this.$nextTick(()=>{
+                            this.fixedHeader();
+                            if (this.$refs.tbody) {
+                                let bodyContentEl = this.$refs.tbody.$el;
+                                let bodyEl = bodyContentEl.parentElement;
+                                let bodyContentHeight = bodyContentEl.offsetHeight;
+                                let bodyContentWidth = bodyContentEl.offsetWidth;
+                                let bodyWidth = bodyEl.offsetWidth;
+                                let bodyHeight = bodyEl.offsetHeight;
+                                let scrollBarWidth = 0;
+                                if (bodyWidth < bodyContentWidth + (bodyHeight<bodyContentHeight?this.scrollBarWidth : 0)) {
+                                    scrollBarWidth = this.scrollBarWidth;
+                                }
+                                
+                                this.showVerticalScrollBar = this.bodyHeight? bodyHeight - scrollBarWidth < bodyContentHeight : false;
+                                this.showHorizontalScrollBar = bodyWidth  < bodyContentWidth + (this.showVerticalScrollBar?this.scrollBarWidth:0);
+                                
+                                if(this.showVerticalScrollBar){
+                                    bodyEl.classList.add(this.prefixCls +'-overflowY');
+                                }else{
+                                    bodyEl.classList.remove(this.prefixCls +'-overflowY');
+                                }
+                                if(this.showHorizontalScrollBar){
+                                    bodyEl.classList.add(this.prefixCls +'-overflowX');
+                                }else{
+                                    bodyEl.classList.remove(this.prefixCls +'-overflowX');
+                                }
+                                this.tableWidth = this.cloneColumns.map(cell => cell._width).reduce((a, b) => a + b, 0) + (this.showVerticalScrollBar?this.scrollBarWidth:0);
+                            }
+                        });
                     });
                     // get table real height,for fixed when set height prop,but height < table's height,show scrollBarWidth
                     this.bodyRealHeight = parseInt(getStyle(this.$refs.tbody.$el, 'height'));
--
libgit2 0.21.4