From 2f7660b4cfc4b6ba0573e8cc519f9709c5ea6851 Mon Sep 17 00:00:00 2001
From: Rijn <bxbian951122@gmail.com>
Date: Fri, 13 Jan 2017 01:53:34 -0600
Subject: [PATCH] fade table body when there is no data

---
 src/components/table/table.vue | 29 +++++++++++++++--------------
 test/routers/table.vue         | 13 +++++++++++--
 2 files changed, 26 insertions(+), 16 deletions(-)

diff --git a/src/components/table/table.vue b/src/components/table/table.vue
index 73072b0..f351933 100644
--- a/src/components/table/table.vue
+++ b/src/components/table/table.vue
@@ -11,7 +11,8 @@
                     :columns-width="columnsWidth"
                     :data="rebuildData"></table-head>
             </div>
-            <div :class="[prefixCls + '-body']" :style="bodyStyle" v-el:body @scroll="handleBodyScroll">
+            <div :class="[prefixCls + '-body']" :style="bodyStyle" v-el:body @scroll="handleBodyScroll"
+                v-show="!((!!noDataText && (!data || data.length === 0)) || (!!noFilteredDataText && (!rebuildData || rebuildData.length === 0)))">
                 <table-body
                     v-ref:tbody
                     :prefix-cls="prefixCls"
@@ -21,6 +22,19 @@
                     :columns-width="columnsWidth"
                     :obj-data="objData"></table-body>
             </div>
+            <div
+                :class="[prefixCls + '-tip']"
+                v-else>
+                <table cellspacing="0" cellpadding="0" border="0">
+                    <tbody>
+                        <tr>
+                            <td :style="{ 'height': bodyStyle.height }">
+                              {{{!data || data.length === 0 ? noDataText : noFilteredDataText}}}
+                            </td>
+                        </tr>
+                    </tbody>
+                </table>
+            </div>
             <div :class="[prefixCls + '-fixed']" :style="fixedTableStyle" v-if="isLeftFixed">
                 <div :class="[prefixCls + '-fixed-header']" v-if="showHeader">
                     <table-head
@@ -65,19 +79,6 @@
                         :obj-data="objData"></table-body>
                 </div>
             </div>
-            <div
-                :class="[prefixCls + '-tip']"
-                v-show="(!!noDataText && (!data || data.length === 0)) || (!!noFilteredDataText && (!rebuildData || rebuildData.length === 0))">
-                <table cellspacing="0" cellpadding="0" border="0">
-                    <tbody>
-                        <tr>
-                            <td>
-                              {{{!data || data.length === 0 ? noDataText : noFilteredDataText}}}
-                            </td>
-                        </tr>
-                    </tbody>
-                </table>
-            </div>
             <div :class="[prefixCls + '-footer']" v-if="showSlotFooter" v-el:footer><slot name="footer"></slot></div>
         </div>
     </div>
diff --git a/test/routers/table.vue b/test/routers/table.vue
index a8ff37b..d6d4244 100644
--- a/test/routers/table.vue
+++ b/test/routers/table.vue
@@ -2,7 +2,15 @@
     <!--<i-select :model.sync="model1" style="width:200px">-->
         <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
     <!--</i-select>-->
-    <i-table border :content="self" :columns="columns7" :data="data6"></i-table>
+    <i-button @click="data7 = data6">Dispatch</i-button>
+    <br/>
+    <i-table border :content="self" :columns="columns7" :data="data7"></i-table>
+    <br/>
+    <i-table border :content="self" :columns="columns7" :data="data7" size="small"></i-table>
+    <br/>
+    <i-table border :content="self" :columns="columns7" :data="data7" size="large"></i-table>
+    <br/>
+    <i-table border :content="self" :columns="columns7" :data="data7" height="600"></i-table>
 </template>
 <script>
     export default {
@@ -86,7 +94,8 @@
                         age: 26,
                         address: '深圳市南山区深南大道'
                     }
-                ]
+                ],
+                data7: []
             }
         },
         methods: {
--
libgit2 0.21.4