You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
39 lines
1007 B
39 lines
1007 B
4 years ago
|
import Alert from './Alert'
|
||
|
|
||
|
const AlertMixin = {
|
||
|
install(Vue) {
|
||
|
Vue.mixin({
|
||
|
methods: {
|
||
|
$alert(message, duration = 2000) {
|
||
|
let Constructor= Vue.extend(Alert)
|
||
|
let alert = new Constructor()
|
||
|
alert.$slots.default = message
|
||
|
alert.$props.alert = this.$page.alert
|
||
|
alert.$mount()
|
||
|
document.body.appendChild(alert.$el)
|
||
|
|
||
|
const appendHeight = alert.$el.offsetHeight + 16
|
||
|
this.$page.alert.top += appendHeight
|
||
|
|
||
|
setTimeout(() => {
|
||
|
this.$page.alert.top -= appendHeight
|
||
|
this.triggerRemoveAlert(appendHeight)
|
||
|
setTimeout(() => {
|
||
|
alert.$destroy()
|
||
|
alert.$el.remove()
|
||
|
}, 100)
|
||
|
}, duration)
|
||
|
},
|
||
|
triggerRemoveAlert(height) {
|
||
|
const event = new CustomEvent('alert_remove', {
|
||
|
detail: {height}
|
||
|
})
|
||
|
window.dispatchEvent(event)
|
||
|
}
|
||
|
}
|
||
|
})
|
||
|
}
|
||
|
}
|
||
|
|
||
|
export default AlertMixin
|