update the master branch to the latest

2019-08-27 09:42:40 +08:00 · 2019-08-27 09:42:40 +08:00 · 23a0ba9831
commit 23a0ba9831
parent 67d534df27
611 changed files with 122648 additions and 0 deletions
--- a/src/components/tooltip/tooltip.vue
+++ b/src/components/tooltip/tooltip.vue
@ -0,0 +1,140 @@
+<template>
+    <div :class="[prefixCls]" @mouseenter="handleShowPopper" @mouseleave="handleClosePopper">
+        <div :class="[prefixCls + '-rel']" ref="reference">
+            <slot></slot>
+        </div>
+        <transition name="fade">
+            <div
+                :class="[prefixCls + '-popper', prefixCls + '-' + theme]"
+                :style="dropStyles"
+                ref="popper"
+                v-show="!disabled && (visible || always)"
+                @mouseenter="handleShowPopper"
+                @mouseleave="handleClosePopper"
+                :data-transfer="transfer"
+                v-transfer-dom>
+                <div :class="[prefixCls + '-content']">
+                    <div :class="[prefixCls + '-arrow']"></div>
+                    <div :class="innerClasses" :style="innerStyles"><slot name="content">{{ content }}</slot></div>
+                </div>
+            </div>
+        </transition>
+    </div>
+</template>
+<script>
+    import Popper from '../base/popper';
+    import TransferDom from '../../directives/transfer-dom';
+    import { oneOf } from '../../utils/assist';
+    import { transferIndex, transferIncrease } from '../../utils/transfer-queue';
+
+    const prefixCls = 'ivu-tooltip';
+
+    export default {
+        name: 'Tooltip',
+        directives: { TransferDom },
+        mixins: [Popper],
+        props: {
+            placement: {
+                validator (value) {
+                    return oneOf(value, ['top', 'top-start', 'top-end', 'bottom', 'bottom-start', 'bottom-end', 'left', 'left-start', 'left-end', 'right', 'right-start', 'right-end']);
+                },
+                default: 'bottom'
+            },
+            content: {
+                type: [String, Number],
+                default: ''
+            },
+            delay: {
+                type: Number,
+                default: 100
+            },
+            disabled: {
+                type: Boolean,
+                default: false
+            },
+            controlled: {    // under this prop,Tooltip will not close when mouseleave
+                type: Boolean,
+                default: false
+            },
+            always: {
+                type: Boolean,
+                default: false
+            },
+            transfer: {
+                type: Boolean,
+                default () {
+                    return !this.$IVIEW || this.$IVIEW.transfer === '' ? false : this.$IVIEW.transfer;
+                }
+            },
+            theme: {
+                validator (value) {
+                    return oneOf(value, ['dark', 'light']);
+                },
+                default: 'dark'
+            },
+            maxWidth: {
+                type: [String, Number]
+            }
+        },
+        data () {
+            return {
+                prefixCls: prefixCls,
+                tIndex: this.handleGetIndex()
+            };
+        },
+        computed: {
+            innerStyles () {
+                const styles = {};
+                if (this.maxWidth) styles['max-width'] = `${this.maxWidth}px`;
+                return styles;
+            },
+            innerClasses () {
+                return [
+                    `${prefixCls}-inner`,
+                    {
+                        [`${prefixCls}-inner-with-width`]: !!this.maxWidth
+                    }
+                ];
+            },
+            dropStyles () {
+                let styles = {};
+                if (this.transfer) styles['z-index'] = 1060 + this.tIndex;
+
+                return styles;
+            }
+        },
+        watch: {
+            content () {
+                this.updatePopper();
+            }
+        },
+        methods: {
+            handleShowPopper() {
+                if (this.timeout) clearTimeout(this.timeout);
+                this.timeout = setTimeout(() => {
+                    this.visible = true;
+                }, this.delay);
+                this.tIndex = this.handleGetIndex();
+            },
+            handleClosePopper() {
+                if (this.timeout) {
+                    clearTimeout(this.timeout);
+                    if (!this.controlled) {
+                        this.timeout = setTimeout(() => {
+                            this.visible = false;
+                        }, 100);
+                    }
+                }
+            },
+            handleGetIndex () {
+                transferIncrease();
+                return transferIndex;
+            },
+        },
+        mounted () {
+            if (this.always) {
+                this.updatePopper();
+            }
+        }
+    };
+</script>