From 548eac43fe9a510649fc85e86e9279ebaa969ad4 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E6=A2=81=E7=81=8F?= <admin@aresn.com>
Date: Wed, 19 Jul 2017 13:58:20 +0800
Subject: [PATCH] fixed #1387 and update v-transfer-dom

Modal add transfer prop
---
 examples/routers/modal.vue           |   1 +
 examples/routers/poptip.vue          |   2 +-
 examples/routers/table.vue           | 254 +++++++++++++++++----------
 src/components/dropdown/dropdown.vue |   3 +-
 src/components/modal/modal.vue       |   6 +-
 src/components/poptip/poptip.vue     |   3 +-
 src/components/table/table.vue       |  12 +-
 src/components/tooltip/tooltip.vue   |   3 +-
 src/directives/transfer-dom.js       |  12 +-
 src/styles/components/table.less     |  10 ++
 10 files changed, 205 insertions(+), 101 deletions(-)

diff --git a/examples/routers/modal.vue b/examples/routers/modal.vue
index 0ff08dda..258552be 100644
--- a/examples/routers/modal.vue
+++ b/examples/routers/modal.vue
@@ -6,6 +6,7 @@
                 width="70"
                 title="普通的Modal对话框标题"
                 @on-ok="ok"
+                :transfer="true"
                 @on-cancel="cancel">
             <div>
                 <Form :model="formItem" :label-width="80">
diff --git a/examples/routers/poptip.vue b/examples/routers/poptip.vue
index b363a0b3..f5d4e3f7 100644
--- a/examples/routers/poptip.vue
+++ b/examples/routers/poptip.vue
@@ -1,6 +1,6 @@
 <template>
     <div>
-        <Poptip trigger="hover" transfer title="提示标题" content="提示内容">
+        <Poptip trigger="hover" title="提示标题" content="提示内容">
             <Button>hover 激活</Button>
         </Poptip>
         <Poptip title="提示标题" content="提示内容">
diff --git a/examples/routers/table.vue b/examples/routers/table.vue
index 2203ed77..bb3a20e7 100644
--- a/examples/routers/table.vue
+++ b/examples/routers/table.vue
@@ -1,114 +1,192 @@
+<!--<template>-->
+    <!--<div>-->
+        <!--<Table-->
+                <!--width="500"-->
+                <!--border-->
+                <!--highlight-row-->
+                <!--:columns="columns2"-->
+                <!--@on-selection-change="change2"-->
+                <!--:data="data3"></Table>-->
+        <!--<Button @click="addData">添加数据</Button>-->
+    <!--</div>-->
+<!--</template>-->
+<!--<script>-->
+    <!--import test from '../components/test.vue';-->
+    <!--export default {-->
+        <!--data () {-->
+            <!--return {-->
+                <!--columns2: [-->
+<!--//                    {-->
+<!--//                        type: 'selection',-->
+<!--//                        width: 60,-->
+<!--//                        align: 'center'-->
+<!--//                    },-->
+                    <!--{-->
+                        <!--title: '姓名',-->
+                        <!--key: 'name',-->
+                        <!--width: 100,-->
+<!--//                        sortable: true,-->
+                        <!--fixed: 'right',-->
+                        <!--render: (h, params) => {-->
+                            <!--return h('div', [-->
+                                <!--h('Button', {-->
+                                    <!--props: {-->
+                                        <!--type: 'primary',-->
+                                        <!--size: 'small'-->
+                                    <!--},-->
+                                    <!--on: {-->
+                                        <!--click: this.edit-->
+                                    <!--},-->
+                                <!--}, '修改')-->
+                            <!--]);-->
+                        <!--}-->
+                    <!--},-->
+                    <!--{-->
+                        <!--title: '年龄',-->
+                        <!--key: 'age',-->
+                        <!--sortable: true,-->
+<!--//                        width: 100-->
+                    <!--},-->
+                    <!--{-->
+                        <!--title: '省份',-->
+                        <!--key: 'province',-->
+                        <!--sortable: true,-->
+<!--//                        fixed: 'right',-->
+<!--//                        width: 100-->
+                    <!--},-->
+<!--//                    {-->
+<!--//                        title: '市区',-->
+<!--//                        key: 'city',-->
+<!--//                        width: 100-->
+<!--//                    },-->
+<!--//                    {-->
+<!--//                        title: '地址',-->
+<!--//                        key: 'address',-->
+<!--//                        width: 200-->
+<!--//                    },-->
+<!--//                    {-->
+<!--//                        title: '邮编',-->
+<!--//                        key: 'zip',-->
+<!--//                        width: 100-->
+<!--//                    },-->
+<!--//                    {-->
+<!--//                        title: '操作',-->
+<!--//                        key: 'action',-->
+<!--//                        fixed: 'right',-->
+<!--//                        width: 120,-->
+<!--//                        render: (h, params) => {-->
+<!--//                            return h(test);-->
+<!--//                        }-->
+<!--//                    }-->
+                <!--],-->
+                <!--data3: [-->
+<!--//                    {-->
+<!--//                        name: '王小明',-->
+<!--//                        age: 18,-->
+<!--//                        address: '北京市朝阳区芍药居',-->
+<!--//                        province: '北京市',-->
+<!--//                        city: '朝阳区',-->
+<!--//                        zip: 100000-->
+<!--//                    },-->
+<!--//                    {-->
+<!--//                        name: '张小刚',-->
+<!--//                        age: 25,-->
+<!--//                        address: '北京市海淀区西二旗',-->
+<!--//                        province: '北京市',-->
+<!--//                        city: '海淀区',-->
+<!--//                        zip: 100000-->
+<!--//                    },-->
+<!--//                    {-->
+<!--//                        name: '李小红',-->
+<!--//                        age: 30,-->
+<!--//                        address: '上海市浦东新区世纪大道',-->
+<!--//                        province: '上海市',-->
+<!--//                        city: '浦东新区',-->
+<!--//                        zip: 100000-->
+<!--//                    },-->
+<!--//                    {-->
+<!--//                        name: '周小伟',-->
+<!--//                        age: 26,-->
+<!--//                        address: '深圳市南山区深南大道',-->
+<!--//                        province: '广东',-->
+<!--//                        city: '南山区',-->
+<!--//                        zip: 100000-->
+<!--//                    }-->
+                <!--]-->
+            <!--}-->
+        <!--},-->
+        <!--methods: {-->
+            <!--change1 (d, l) {-->
+<!--//                console.log(d)-->
+<!--//                console.log(l)-->
+            <!--},-->
+            <!--change2 (d, l) {-->
+                <!--console.log(d);-->
+                <!--console.log(l);-->
+            <!--},-->
+            <!--addData () {-->
+                <!--this.data3.push({-->
+                    <!--name: '周小伟',-->
+                    <!--age: 26,-->
+                    <!--address: '深圳市南山区深南大道',-->
+                    <!--province: '广东',-->
+                    <!--city: '南山区',-->
+                    <!--zip: 100000-->
+                <!--})-->
+            <!--}-->
+        <!--}-->
+    <!--}-->
+<!--</script>-->
+
 <template>
-    <Table
-            width="550"
-            border
-            highlight-row
-            :columns="columns2"
-            @on-selection-change="change2"
-            :data="data3"></Table>
+    <div>
+        <i-table :data="dtData" :height="400" :columns="dtCols" border highlight-row></i-table>
+        <Button type="ghost" @click="addData"> add data</Button>
+    </div>
 </template>
 <script>
-    import test from '../components/test.vue';
     export default {
-        data () {
-            return {
-                columns2: [
+        data(){
+            return{
+                dtData:[],
+                dtCols:[
                     {
                         type: 'selection',
                         width: 60,
                         align: 'center'
                     },
                     {
-                        title: '姓名',
+                        title: '分类名称',
                         key: 'name',
-                        width: 100,
-                        sortable: true,
-//                        fixed: 'left',
-//                        renderHeader: (h, params) => {
-//                            return h('Tag', params.index)
-//                        }
-                    },
-                    {
-                        title: '年龄',
-                        key: 'age',
-                        sortable: true,
-                        width: 100
-                    },
-                    {
-                        title: '省份',
-                        key: 'province',
-                        width: 100
-                    },
-                    {
-                        title: '市区',
-                        key: 'city',
-                        width: 100
-                    },
-                    {
-                        title: '地址',
-                        key: 'address',
-                        width: 200
-                    },
-                    {
-                        title: '邮编',
-                        key: 'zip',
-                        width: 100
+                        sortable: true
                     },
                     {
                         title: '操作',
-                        key: 'action',
                         fixed: 'right',
                         width: 120,
                         render: (h, params) => {
-                            return h(test);
+                            return h('div', [
+                                h('Button', {
+                                    props: {
+                                        type: 'primary',
+                                        size: 'small'
+                                    },
+                                    on: {
+                                        click: this.edit
+                                    },
+                                }, '修改')
+                            ]);
                         }
                     }
-                ],
-                data3: [
-                    {
-                        name: '王小明',
-                        age: 18,
-                        address: '北京市朝阳区芍药居',
-                        province: '北京市',
-                        city: '朝阳区',
-                        zip: 100000
-                    },
-                    {
-                        name: '张小刚',
-                        age: 25,
-                        address: '北京市海淀区西二旗',
-                        province: '北京市',
-                        city: '海淀区',
-                        zip: 100000
-                    },
-                    {
-                        name: '李小红',
-                        age: 30,
-                        address: '上海市浦东新区世纪大道',
-                        province: '上海市',
-                        city: '浦东新区',
-                        zip: 100000
-                    },
-                    {
-                        name: '周小伟',
-                        age: 26,
-                        address: '深圳市南山区深南大道',
-                        province: '广东',
-                        city: '南山区',
-                        zip: 100000
-                    }
                 ]
             }
         },
         methods: {
-            change1 (d, l) {
-//                console.log(d)
-//                console.log(l)
-            },
-            change2 (d, l) {
-                console.log(d);
-                console.log(l);
+            addData () {
+                this.dtData.push({
+                    name: '发送到附件是'
+                })
             }
         }
     }
-</script>
+</script>
\ No newline at end of file
diff --git a/src/components/dropdown/dropdown.vue b/src/components/dropdown/dropdown.vue
index 9bb22f22..3a0e051d 100644
--- a/src/components/dropdown/dropdown.vue
+++ b/src/components/dropdown/dropdown.vue
@@ -12,7 +12,8 @@
                 ref="drop"
                 @mouseenter.native="handleMouseenter"
                 @mouseleave.native="handleMouseleave"
-                v-transfer-dom:forbidden="transfer"><slot name="list"></slot></Drop>
+                :data-transfer="transfer"
+                v-transfer-dom><slot name="list"></slot></Drop>
         </transition>
     </div>
 </template>
diff --git a/src/components/modal/modal.vue b/src/components/modal/modal.vue
index 037a9f04..db4ae39e 100644
--- a/src/components/modal/modal.vue
+++ b/src/components/modal/modal.vue
@@ -1,5 +1,5 @@
 <template>
-    <div v-transfer-dom>
+    <div v-transfer-dom :data-transfer="transfer">
         <transition :name="transitionNames[1]">
             <div :class="maskClasses" v-show="visible" @click="mask"></div>
         </transition>
@@ -91,6 +91,10 @@
                 default () {
                     return ['ease', 'fade'];
                 }
+            },
+            transfer: {
+                type: Boolean,
+                default: true
             }
         },
         data () {
diff --git a/src/components/poptip/poptip.vue b/src/components/poptip/poptip.vue
index 6bc00019..829ae9c0 100644
--- a/src/components/poptip/poptip.vue
+++ b/src/components/poptip/poptip.vue
@@ -20,7 +20,8 @@
                 v-show="visible"
                 @mouseenter="handleMouseenter"
                 @mouseleave="handleMouseleave"
-                v-transfer-dom:forbidden="transfer">
+                :data-transfer="transfer"
+                v-transfer-dom>
                 <div :class="[prefixCls + '-content']">
                     <div :class="[prefixCls + '-arrow']"></div>
                     <div :class="[prefixCls + '-inner']" v-if="confirm">
diff --git a/src/components/table/table.vue b/src/components/table/table.vue
index 40259411..e0d2d12a 100644
--- a/src/components/table/table.vue
+++ b/src/components/table/table.vue
@@ -37,7 +37,7 @@
                 </table>
             </div>
             <div :class="[prefixCls + '-fixed']" :style="fixedTableStyle" v-if="isLeftFixed">
-                <div :class="[prefixCls + '-fixed-header']" v-if="showHeader">
+                <div :class="fixedHeaderClasses" v-if="showHeader">
                     <table-head
                         fixed="left"
                         :prefix-cls="prefixCls"
@@ -59,7 +59,7 @@
                 </div>
             </div>
             <div :class="[prefixCls + '-fixed-right']" :style="fixedRightTableStyle" v-if="isRightFixed">
-                <div :class="[prefixCls + '-fixed-header']" v-if="showHeader">
+                <div :class="fixedHeaderClasses" v-if="showHeader">
                     <table-head
                         fixed="right"
                         :prefix-cls="prefixCls"
@@ -216,6 +216,14 @@
                     }
                 ];
             },
+            fixedHeaderClasses () {
+                return [
+                    `${prefixCls}-fixed-header`,
+                    {
+                        [`${prefixCls}-fixed-header-with-empty`]: !this.rebuildData.length
+                    }
+                ];
+            },
             styles () {
                 let style = {};
                 if (this.height) {
diff --git a/src/components/tooltip/tooltip.vue b/src/components/tooltip/tooltip.vue
index a5a214f8..0353f325 100644
--- a/src/components/tooltip/tooltip.vue
+++ b/src/components/tooltip/tooltip.vue
@@ -10,7 +10,8 @@
                 v-show="!disabled && (visible || always)"
                 @mouseenter="handleShowPopper"
                 @mouseleave="handleClosePopper"
-                v-transfer-dom:forbidden="transfer">
+                :data-transfer="transfer"
+                v-transfer-dom>
                 <div :class="[prefixCls + '-content']">
                     <div :class="[prefixCls + '-arrow']"></div>
                     <div :class="[prefixCls + '-inner']"><slot name="content">{{ content }}</slot></div>
diff --git a/src/directives/transfer-dom.js b/src/directives/transfer-dom.js
index a4163b9c..a7e2c4dd 100644
--- a/src/directives/transfer-dom.js
+++ b/src/directives/transfer-dom.js
@@ -15,8 +15,8 @@ function getTarget (node) {
 }
 
 const directive = {
-    inserted (el, { value, arg }, vnode) {
-        if (arg.forbidden) return false;
+    inserted (el, { value }, vnode) {
+        if (el.dataset.transfer !== 'true') return false;
         el.className = el.className ? el.className + ' v-transfer-dom' : 'v-transfer-dom';
         const parentNode = el.parentNode;
         if (!parentNode) return;
@@ -37,8 +37,8 @@ const directive = {
             }
         }
     },
-    componentUpdated (el, { value, arg }) {
-        if (arg.forbidden) return false;
+    componentUpdated (el, { value }) {
+        if (el.dataset.transfer !== 'true') return false;
         // need to make sure children are done updating (vs. `update`)
         const ref$1 = el.__transferDomData;
         if (!ref$1) return;
@@ -62,8 +62,8 @@ const directive = {
             getTarget(value).appendChild(el);
         }
     },
-    unbind (el, { arg } ) {
-        if (arg.forbidden) return false;
+    unbind (el) {
+        if (el.dataset.transfer !== 'true') return false;
         el.className = el.className.replace('v-transfer-dom', '');
         const ref$1 = el.__transferDomData;
         if (!ref$1) return;
diff --git a/src/styles/components/table.less b/src/styles/components/table.less
index 556ac2e9..def15b6b 100644
--- a/src/styles/components/table.less
+++ b/src/styles/components/table.less
@@ -268,6 +268,16 @@
     }
     &-fixed-header{
         overflow: hidden;
+        &-with-empty{
+            .@{table-prefix-cls}-hidden{
+                .@{table-prefix-cls}-sort{
+                    display: none;
+                }
+                .@{table-prefix-cls}-cell span{
+                    display: none;
+                }
+            }
+        }
     }
     &-fixed-body{
         overflow: hidden;