From 2993f4eec375236a6abc3ae2bb91ac28c09d1f49 Mon Sep 17 00:00:00 2001
From: 梁灏 <admin@aresn.com>
Date: Thu, 26 Oct 2017 11:26:05 +0800
Subject: [PATCH] update Tab

---
 examples/routers/table.vue   | 296 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++----------------------------------------------------
 src/components/tabs/tabs.vue |   1 +
 2 files changed, 245 insertions(+), 52 deletions(-)

diff --git a/examples/routers/table.vue b/examples/routers/table.vue
index e5cd87b..ed57bce 100644
--- a/examples/routers/table.vue
+++ b/examples/routers/table.vue
@@ -413,97 +413,289 @@
 <!--</script>-->
 
 <template>
-    <Table border :columns="columns6" :data="data5" @on-filter-change="cc"></Table>
+    <div>
+        <Table :columns="columns8" :data="data7" size="small" ref="table"></Table>
+        <br>
+        <Button type="primary" size="large" @click="exportData(1)"><Icon type="ios-download-outline"></Icon> 导出原始数据</Button>
+        <Button type="primary" size="large" @click="exportData(2)"><Icon type="ios-download-outline"></Icon> 导出排序和过滤后的数据</Button>
+        <Button type="primary" size="large" @click="exportData(3)"><Icon type="ios-download-outline"></Icon> 导出自定义数据</Button>
+    </div>
 </template>
 <script>
     export default {
         data () {
             return {
-                columns6: [
+                columns8: [
                     {
-                        title: '日期',
-                        key: 'date'
+                        "title": "名称",
+                        "key": "name",
+                        "fixed": "left",
+                        "width": 200
                     },
                     {
-                        title: '姓名',
-                        key: 'name'
-                    },
-                    {
-                        title: '年龄',
-                        key: 'age',
+                        "title": "展示",
+                        "key": "show",
+                        "width": 150,
+                        "sortable": true,
                         filters: [
                             {
-                                label: '大于25岁',
+                                label: '大于4000',
                                 value: 1
                             },
                             {
-                                label: '小于25岁',
+                                label: '小于4000',
                                 value: 2
                             }
                         ],
                         filterMultiple: false,
                         filterMethod (value, row) {
                             if (value === 1) {
-                                return row.age > 25;
+                                return row.show > 4000;
                             } else if (value === 2) {
-                                return row.age < 25;
+                                return row.show < 4000;
                             }
                         }
                     },
                     {
-                        title: '地址',
-                        key: 'address',
-                        filters: [
-                            {
-                                label: '北京',
-                                value: '北京'
-                            },
-                            {
-                                label: '上海',
-                                value: '上海'
-                            },
-                            {
-                                label: '深圳',
-                                value: '深圳'
-                            }
-                        ],
-                        filterMethod (value, row) {
-                            return row.address.indexOf(value) > -1;
-                        }
+                        "title": "唤醒",
+                        "key": "weak",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "登录",
+                        "key": "signin",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "点击",
+                        "key": "click",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "激活",
+                        "key": "active",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "7日留存",
+                        "key": "day7",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "30日留存",
+                        "key": "day30",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "次日留存",
+                        "key": "tomorrow",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "日活跃",
+                        "key": "day",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "周活跃",
+                        "key": "week",
+                        "width": 150,
+                        "sortable": true
+                    },
+                    {
+                        "title": "月活跃",
+                        "key": "month",
+                        "width": 150,
+                        "sortable": true
                     }
                 ],
-                data5: [
+                data7: [
+                    {
+                        "name": "推广名称1",
+                        "fav": 0,
+                        "show": 7302,
+                        "weak": 5627,
+                        "signin": 1563,
+                        "click": 4254,
+                        "active": 1438,
+                        "day7": 274,
+                        "day30": 285,
+                        "tomorrow": 1727,
+                        "day": 558,
+                        "week": 4440,
+                        "month": 5610
+                    },
+                    {
+                        "name": "推广名称2",
+                        "fav": 0,
+                        "show": 4720,
+                        "weak": 4086,
+                        "signin": 3792,
+                        "click": 8690,
+                        "active": 8470,
+                        "day7": 8172,
+                        "day30": 5197,
+                        "tomorrow": 1684,
+                        "day": 2593,
+                        "week": 2507,
+                        "month": 1537
+                    },
+                    {
+                        "name": "推广名称3",
+                        "fav": 0,
+                        "show": 7181,
+                        "weak": 8007,
+                        "signin": 8477,
+                        "click": 1879,
+                        "active": 16,
+                        "day7": 2249,
+                        "day30": 3450,
+                        "tomorrow": 377,
+                        "day": 1561,
+                        "week": 3219,
+                        "month": 1588
+                    },
                     {
-                        name: '王小明',
-                        age: 18,
-                        address: '北京市朝阳区芍药居',
-                        date: '2016-10-03'
+                        "name": "推广名称4",
+                        "fav": 0,
+                        "show": 9911,
+                        "weak": 8976,
+                        "signin": 8807,
+                        "click": 8050,
+                        "active": 7668,
+                        "day7": 1547,
+                        "day30": 2357,
+                        "tomorrow": 7278,
+                        "day": 5309,
+                        "week": 1655,
+                        "month": 9043
                     },
                     {
-                        name: '张小刚',
-                        age: 25,
-                        address: '北京市海淀区西二旗',
-                        date: '2016-10-01'
+                        "name": "推广名称5",
+                        "fav": 0,
+                        "show": 934,
+                        "weak": 1394,
+                        "signin": 6463,
+                        "click": 5278,
+                        "active": 9256,
+                        "day7": 209,
+                        "day30": 3563,
+                        "tomorrow": 8285,
+                        "day": 1230,
+                        "week": 4840,
+                        "month": 9908
                     },
                     {
-                        name: '李小红',
-                        age: 30,
-                        address: '上海市浦东新区世纪大道',
-                        date: '2016-10-02'
+                        "name": "推广名称6",
+                        "fav": 0,
+                        "show": 6856,
+                        "weak": 1608,
+                        "signin": 457,
+                        "click": 4949,
+                        "active": 2909,
+                        "day7": 4525,
+                        "day30": 6171,
+                        "tomorrow": 1920,
+                        "day": 1966,
+                        "week": 904,
+                        "month": 6851
                     },
                     {
-                        name: '周小伟',
-                        age: 26,
-                        address: '深圳市南山区深南大道',
-                        date: '2016-10-04'
+                        "name": "推广名称7",
+                        "fav": 0,
+                        "show": 5107,
+                        "weak": 6407,
+                        "signin": 4166,
+                        "click": 7970,
+                        "active": 1002,
+                        "day7": 8701,
+                        "day30": 9040,
+                        "tomorrow": 7632,
+                        "day": 4061,
+                        "week": 4359,
+                        "month": 3676
+                    },
+                    {
+                        "name": "推广名称8",
+                        "fav": 0,
+                        "show": 862,
+                        "weak": 6520,
+                        "signin": 6696,
+                        "click": 3209,
+                        "active": 6801,
+                        "day7": 6364,
+                        "day30": 6850,
+                        "tomorrow": 9408,
+                        "day": 2481,
+                        "week": 1479,
+                        "month": 2346
+                    },
+                    {
+                        "name": "推广名称9",
+                        "fav": 0,
+                        "show": 567,
+                        "weak": 5859,
+                        "signin": 128,
+                        "click": 6593,
+                        "active": 1971,
+                        "day7": 7596,
+                        "day30": 3546,
+                        "tomorrow": 6641,
+                        "day": 1611,
+                        "week": 5534,
+                        "month": 3190
+                    },
+                    {
+                        "name": "推广名称10",
+                        "fav": 0,
+                        "show": 3651,
+                        "weak": 1819,
+                        "signin": 4595,
+                        "click": 7499,
+                        "active": 7405,
+                        "day7": 8710,
+                        "day30": 5518,
+                        "tomorrow": 428,
+                        "day": 9768,
+                        "week": 2864,
+                        "month": 5811
                     }
                 ]
             }
         },
         methods: {
-            cc (dd) {
-                console.log(dd);
+            exportData (type) {
+                if (type === 1) {
+                    this.$refs.table.exportCsv({
+                        filename: '原始数据',
+                        separator: ';',
+                        quoted: true,
+                        callback (data) {
+                            console.log(data);
+                        }
+                    });
+                } else if (type === 2) {
+                    this.$refs.table.exportCsv({
+                        filename: '排序和过滤后的数据',
+                        original: false
+                    });
+                } else if (type === 3) {
+                    this.$refs.table.exportCsv({
+                        filename: '自定义数据',
+                        columns: this.columns8.filter((col, index) => index < 4),
+                        data: this.data7.filter((data, index) => index < 4)
+                    });
+                }
             }
         }
     }
 </script>
+
diff --git a/src/components/tabs/tabs.vue b/src/components/tabs/tabs.vue
index ff0a044..d99b906 100644
--- a/src/components/tabs/tabs.vue
+++ b/src/components/tabs/tabs.vue
@@ -155,6 +155,7 @@
             updateBar () {
                 this.$nextTick(() => {
                     const index = this.navList.findIndex((nav) => nav.name === this.activeKey);
+                    if (!this.$refs.nav) return;  // 页面销毁时，这里会报错，为了解决 #2100
                     const prevTabs = this.$refs.nav.querySelectorAll(`.${prefixCls}-tab`);
                     const tab = prevTabs[index];
                     this.barWidth = tab ? parseFloat(tab.offsetWidth) : 0;
--
libgit2 0.21.4