1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
'use strict';
Object.defineProperty(exports, "__esModule", {
value: true
});
var _defineProperty2 = require('babel-runtime/helpers/defineProperty');
var _defineProperty3 = _interopRequireDefault(_defineProperty2);
var _vueTypes = require('../_util/vue-types');
var _vueTypes2 = _interopRequireDefault(_vueTypes);
var _propsUtil = require('../_util/props-util');
var _BaseMixin = require('../_util/BaseMixin');
var _BaseMixin2 = _interopRequireDefault(_BaseMixin);
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { 'default': obj }; }
function noop() {}
exports['default'] = {
mixins: [_BaseMixin2['default']],
props: {
duration: _vueTypes2['default'].number.def(1.5),
closable: _vueTypes2['default'].bool,
prefixCls: _vueTypes2['default'].string,
update: _vueTypes2['default'].bool,
closeIcon: _vueTypes2['default'].any
},
watch: {
duration: function duration() {
this.restartCloseTimer();
}
},
mounted: function mounted() {
this.startCloseTimer();
},
updated: function updated() {
if (this.update) {
this.restartCloseTimer();
}
},
beforeDestroy: function beforeDestroy() {
this.clearCloseTimer();
this.willDestroy = true; // beforeDestroy调用后依然会触发onMouseleave事件
},
methods: {
close: function close() {
this.clearCloseTimer();
this.__emit('close');
},
startCloseTimer: function startCloseTimer() {
var _this = this;
this.clearCloseTimer();
if (!this.willDestroy && this.duration) {
this.closeTimer = setTimeout(function () {
_this.close();
}, this.duration * 1000);
}
},
clearCloseTimer: function clearCloseTimer() {
if (this.closeTimer) {
clearTimeout(this.closeTimer);
this.closeTimer = null;
}
},
restartCloseTimer: function restartCloseTimer() {
this.clearCloseTimer();
this.startCloseTimer();
}
},
render: function render() {
var _className;
var h = arguments[0];
var prefixCls = this.prefixCls,
closable = this.closable,
clearCloseTimer = this.clearCloseTimer,
startCloseTimer = this.startCloseTimer,
$slots = this.$slots,
close = this.close,
$listeners = this.$listeners;
var componentClass = prefixCls + '-notice';
var className = (_className = {}, (0, _defineProperty3['default'])(_className, '' + componentClass, 1), (0, _defineProperty3['default'])(_className, componentClass + '-closable', closable), _className);
var style = (0, _propsUtil.getStyle)(this);
var closeIcon = (0, _propsUtil.getComponentFromProp)(this, 'closeIcon');
return h(
'div',
{
'class': className,
style: style || { right: '50%' },
on: {
'mouseenter': clearCloseTimer,
'mouseleave': startCloseTimer,
'click': $listeners.click || noop
}
},
[h(
'div',
{ 'class': componentClass + '-content' },
[$slots['default']]
), closable ? h(
'a',
{
attrs: { tabIndex: '0' },
on: {
'click': close
},
'class': componentClass + '-close' },
[closeIcon || h('span', { 'class': componentClass + '-close-x' })]
) : null]
);
}
};