Commit 73dc2dedfe33817ed18775c330c881fc6d588b4b

Authored by Aresn
Committed by GitHub
2 parents 8bca1070 2f7660b4

Merge pull request #200 from rijn/194

Fade table body when there is no data
Showing 2 changed files with 26 additions and 16 deletions   Show diff stats
src/components/table/table.vue
@@ -11,7 +11,8 @@ @@ -11,7 +11,8 @@
11 :columns-width="columnsWidth" 11 :columns-width="columnsWidth"
12 :data="rebuildData"></table-head> 12 :data="rebuildData"></table-head>
13 </div> 13 </div>
14 - <div :class="[prefixCls + '-body']" :style="bodyStyle" v-el:body @scroll="handleBodyScroll"> 14 + <div :class="[prefixCls + '-body']" :style="bodyStyle" v-el:body @scroll="handleBodyScroll"
  15 + v-show="!((!!noDataText && (!data || data.length === 0)) || (!!noFilteredDataText && (!rebuildData || rebuildData.length === 0)))">
15 <table-body 16 <table-body
16 v-ref:tbody 17 v-ref:tbody
17 :prefix-cls="prefixCls" 18 :prefix-cls="prefixCls"
@@ -21,6 +22,19 @@ @@ -21,6 +22,19 @@
21 :columns-width="columnsWidth" 22 :columns-width="columnsWidth"
22 :obj-data="objData"></table-body> 23 :obj-data="objData"></table-body>
23 </div> 24 </div>
  25 + <div
  26 + :class="[prefixCls + '-tip']"
  27 + v-else>
  28 + <table cellspacing="0" cellpadding="0" border="0">
  29 + <tbody>
  30 + <tr>
  31 + <td :style="{ 'height': bodyStyle.height }">
  32 + {{{!data || data.length === 0 ? noDataText : noFilteredDataText}}}
  33 + </td>
  34 + </tr>
  35 + </tbody>
  36 + </table>
  37 + </div>
24 <div :class="[prefixCls + '-fixed']" :style="fixedTableStyle" v-if="isLeftFixed"> 38 <div :class="[prefixCls + '-fixed']" :style="fixedTableStyle" v-if="isLeftFixed">
25 <div :class="[prefixCls + '-fixed-header']" v-if="showHeader"> 39 <div :class="[prefixCls + '-fixed-header']" v-if="showHeader">
26 <table-head 40 <table-head
@@ -65,19 +79,6 @@ @@ -65,19 +79,6 @@
65 :obj-data="objData"></table-body> 79 :obj-data="objData"></table-body>
66 </div> 80 </div>
67 </div> 81 </div>
68 - <div  
69 - :class="[prefixCls + '-tip']"  
70 - v-show="(!!noDataText && (!data || data.length === 0)) || (!!noFilteredDataText && (!rebuildData || rebuildData.length === 0))">  
71 - <table cellspacing="0" cellpadding="0" border="0">  
72 - <tbody>  
73 - <tr>  
74 - <td>  
75 - {{{!data || data.length === 0 ? noDataText : noFilteredDataText}}}  
76 - </td>  
77 - </tr>  
78 - </tbody>  
79 - </table>  
80 - </div>  
81 <div :class="[prefixCls + '-footer']" v-if="showSlotFooter" v-el:footer><slot name="footer"></slot></div> 82 <div :class="[prefixCls + '-footer']" v-if="showSlotFooter" v-el:footer><slot name="footer"></slot></div>
82 </div> 83 </div>
83 </div> 84 </div>
test/routers/table.vue
@@ -2,7 +2,15 @@ @@ -2,7 +2,15 @@
2 <!--<i-select :model.sync="model1" style="width:200px">--> 2 <!--<i-select :model.sync="model1" style="width:200px">-->
3 <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>--> 3 <!--<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>-->
4 <!--</i-select>--> 4 <!--</i-select>-->
5 - <i-table border :content="self" :columns="columns7" :data="data6"></i-table> 5 + <i-button @click="data7 = data6">Dispatch</i-button>
  6 + <br/>
  7 + <i-table border :content="self" :columns="columns7" :data="data7"></i-table>
  8 + <br/>
  9 + <i-table border :content="self" :columns="columns7" :data="data7" size="small"></i-table>
  10 + <br/>
  11 + <i-table border :content="self" :columns="columns7" :data="data7" size="large"></i-table>
  12 + <br/>
  13 + <i-table border :content="self" :columns="columns7" :data="data7" height="600"></i-table>
6 </template> 14 </template>
7 <script> 15 <script>
8 export default { 16 export default {
@@ -86,7 +94,8 @@ @@ -86,7 +94,8 @@
86 age: 26, 94 age: 26,
87 address: '深圳市南山区深南大道' 95 address: '深圳市南山区深南大道'
88 } 96 }
89 - ] 97 + ],
  98 + data7: []
90 } 99 }
91 }, 100 },
92 methods: { 101 methods: {