From 192e2cb849440a4259d8bb1089c4edbe57e7648d Mon Sep 17 00:00:00 2001
From: 梁灏 <admin@aresn.com>
Date: Fri, 25 Nov 2016 17:01:27 +0800
Subject: [PATCH] update Table

---
 src/components/table/table.vue   | 26 ++++++++++++++++++--------
 src/styles/components/table.less |  8 +++-----
 2 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/src/components/table/table.vue b/src/components/table/table.vue
index efc7b05..a1bb4d0 100644
--- a/src/components/table/table.vue
+++ b/src/components/table/table.vue
@@ -1,7 +1,7 @@
 <template>
     <div :class="classes" :style="styles">
         <div :class="[prefixCls + '-title']" v-if="showSlotHeader" v-el:title><slot name="header"></slot></div>
-        <div :class="[prefixCls + '-header']" v-if="showHeader" v-el:header>
+        <div :class="[prefixCls + '-header']" v-if="showHeader" v-el:header @mousewheel="handleMouseWheel">
             <table cellspacing="0" cellpadding="0" border="0" :style="tableStyle">
                 <colgroup>
                     <col v-for="column in cloneColumns" :width="setCellWidth(column, $index)">
@@ -13,7 +13,7 @@
                     :columns="cloneColumns"></thead>
             </table>
         </div>
-        <div :class="[prefixCls + '-body']" :style="bodyStyle">
+        <div :class="[prefixCls + '-body']" :style="bodyStyle" @scroll="handleBodyScroll">
             <table cellspacing="0" cellpadding="0" border="0" :style="tableStyle" v-el:tbody>
                 <colgroup>
                     <col v-for="column in cloneColumns" :width="setCellWidth(column, $index)">
@@ -168,15 +168,17 @@
                     }
                     this.$nextTick(() => {
                         this.columnsWidth = [];
-                        let autoWidthIndex = -1
+                        let autoWidthIndex = -1;
                         if (allWidth) autoWidthIndex = this.cloneColumns.findIndex(cell => !cell.width);
-                        this.$els.tbody.querySelectorAll('tbody tr')[0].querySelectorAll('td').forEach((cell, index) => {
-                            if (index === autoWidthIndex) {
-                                this.columnsWidth.push(parseInt(getStyle(cell, 'width')) - 1);
+
+                        const $td = this.$els.tbody.querySelectorAll('tbody tr')[0].querySelectorAll('td');
+                        for (let i = 0; i < $td.length; i++) {    // can not use forEach in Firefox
+                            if (i === autoWidthIndex) {
+                                this.columnsWidth.push(parseInt(getStyle($td[i], 'width')) - 1);
                             } else {
-                                this.columnsWidth.push(parseInt(getStyle(cell, 'width')));
+                                this.columnsWidth.push(parseInt(getStyle($td[i], 'width')));
                             }
-                        });
+                        }
                     });
                 });
             },
@@ -269,6 +271,14 @@
                 this.rightFixedColumns = right;
                 this.centerColumns = center;
                 this.cloneColumns = left.concat(center).concat(right);
+            },
+            handleBodyScroll (event) {
+                this.$els.header.scrollLeft = event.target.scrollLeft;
+
+                // todo 固定时上下滚动，固定的表头也滚动 scrollTop
+            },
+            handleMouseWheel () {
+                console.log(111)
             }
         },
         compiled () {
diff --git a/src/styles/components/table.less b/src/styles/components/table.less
index 30f0c83..ba86218 100644
--- a/src/styles/components/table.less
+++ b/src/styles/components/table.less
@@ -58,16 +58,14 @@
         border-bottom: none;
     }
 
+    &-header{
+        overflow: hidden;
+    }
     &-body{
-        //overflow-x: hidden;
-        //overflow-y: auto;
         overflow: auto;
         position: relative;
     }
 
-    &-with-fixed-top{
-        border-bottom: 1px solid @border-color-base;
-    }
     &-with-fixed-top&-with-footer{
         .@{table-prefix-cls}-footer{
             border-top: 1px solid @border-color-base;
--
libgit2 0.21.4