import $ from 'jquery'
import coerceBoolean from 'src/utils/coerceBoolean.js'
function caculatePosition (trigger, popover, placement) {
    let position = {}
    // 过滤位置
    placement = placement && ~'top,left,right,bottom'.split(',').indexOf(placement) ? placement : 'right';
    switch (placement) {
    case 'top' :
        position.left = trigger.offsetLeft - popover.offsetWidth / 2 + trigger.offsetWidth / 2
        position.top = trigger.offsetTop - popover.offsetHeight
        break
    case 'left':
        position.left = trigger.offsetLeft - popover.offsetWidth
        position.top = trigger.offsetTop + trigger.offsetHeight / 2 - popover.offsetHeight / 2
        break
    case 'right':
        position.left = trigger.offsetLeft + popover.offsetWidth
        position.top = trigger.offsetTop + trigger.offsetHeight / 2 - popover.offsetHeight / 2
        break
    case 'bottom':
        position.left = trigger.offsetLeft - popover.offsetWidth / 2 + trigger.offsetWidth / 2
        position.top = trigger.offsetTop + trigger.offsetHeight
        break
    default:
        console.warn('Wrong placement prop')
    }
    return position
}

export default {
    props: {
        // 触发类型
        // hover, click, focus
        trigger: {
            type: String
        },

        // 效果
        effect: {
            type: String,
            default: 'fade'
        },

        // 标题名称
        title: {
            type: String
        },

        // 内容
        content: {
            type: String
        },

        // 是否有标题
        header: {
            type: Boolean,
            coerce: coerceBoolean,
            default: true
        },

        // 弹出位置
        placement: {
            type: String,
            default: 'right'
        },
        animate: {
            type: Boolean,
            coerce: coerceBoolean,
            default: true
        }
    },
    data () {
        return {
            position: {
                top: 0,
                left: 0
            },
            show: false,

            //  animate class 'in'
            inShow: false,

            // display block | none
            displayShow: false
        }
    },
    methods: {
        toggle (val) {
            var show = val instanceof Boolean ? val : !this.show;
            if (show) {
                this.displayShow = true;
            }
            this.show = show;
        }
    },
    ready () {
        const trigger = this.$els.trigger
        let events = this.trigger === 'contextmenu' ? 'contextmenu'
      : this.trigger === 'hover' ? ['mouseleave', 'mouseenter']
      : this.trigger === 'focus' ? ['blur', 'focus'] : ['click']
        $(trigger).on(events.join(' '), () => this.toggle())
    },
    beforeDestroy () {
        $(this.$els.trigger).off()
    },
    watch: {
        show (val) {
            if (val) {
                this.position = caculatePosition(this.$els.trigger, this.$els.popover, this.placement);
                this.inShow = true;
            } else {
                $(this.$els.popover).one('transitionend', () => {
                    this.displayShow = false;
                });
                // 先执行过渡动画
                this.inShow = false;
            }
        }
    }
}

@@ -2428,41 +2428,120 @@
     
-const trigger = this.$els.trigger
+// %E5%8F%AA%E4%BC%A0%E5%85%A5%E6%96%87%E6%9C%AC%E7%BB%91%E5%AE%9A %E7%88%B6%E5%85%83%E7%B4%A0%E4%BA%8B%E4%BB%B6%0A        const el = this.$el%0A        this.$els.trigger = el.nodeType === 3 ? el.parentNode : el%0A
 %0A   
@@ -2744,16 +2744,26 @@
       $(
+this.$els.
 trigger)
@@ -2785,20 +2785,35 @@
 (' '), (
+e
 ) =%3E
+ %7B%0A           
  this.to
@@ -2818,16 +2818,27 @@
 toggle()
+;%0A        %7D
 )%0A    %7D,

修复 Bug