206 lines
3.3 KiB
JavaScript
206 lines
3.3 KiB
JavaScript
import Vue from 'vue'
|
|
import {t} from '../_locale'
|
|
import Dialog from './dialog'
|
|
|
|
/* istanbul ignore next */
|
|
const noop = function() {}
|
|
|
|
// all active instances
|
|
const instances = []
|
|
|
|
/**
|
|
* Dialog factory
|
|
*
|
|
* @param {Object} props
|
|
* @return {Dialog}
|
|
*/
|
|
const generate = function({
|
|
title = '',
|
|
icon = '',
|
|
iconSvg = false,
|
|
content = '',
|
|
closable = false,
|
|
transition = 'md-bounce',
|
|
btns = [],
|
|
onShow = noop,
|
|
onHide = noop,
|
|
}) {
|
|
const DialogConstructor = Vue.extend(Dialog)
|
|
const vm = new DialogConstructor({
|
|
propsData: {
|
|
value: false,
|
|
title,
|
|
icon,
|
|
iconSvg,
|
|
content,
|
|
closable,
|
|
btns,
|
|
transition,
|
|
preventScroll: true,
|
|
},
|
|
}).$mount()
|
|
|
|
instances.push(vm)
|
|
|
|
vm.$on('input', val => {
|
|
/* istanbul ignore else */
|
|
if (!val) {
|
|
vm.value = false
|
|
}
|
|
})
|
|
vm.$on('hide', () => {
|
|
const index = instances.indexOf(vm)
|
|
/* istanbul ignore else */
|
|
if (index >= 0) {
|
|
instances.splice(index, 1)
|
|
}
|
|
vm.$destroy()
|
|
onHide()
|
|
})
|
|
vm.$on('show', () => {
|
|
onShow()
|
|
})
|
|
|
|
vm.value = true
|
|
|
|
return vm
|
|
}
|
|
|
|
/**
|
|
* Dynamically create a confirm dialog
|
|
*
|
|
* @param {Object} props
|
|
* @return {Dialog}
|
|
*/
|
|
Dialog.confirm = ({
|
|
title = '',
|
|
icon = '',
|
|
iconSvg = false,
|
|
content = '',
|
|
cancelText = t('md.dialog.cancel'),
|
|
cancelWarning = false,
|
|
confirmText = t('md.dialog.confirm'),
|
|
confirmWarning = false,
|
|
closable = false,
|
|
transition,
|
|
onConfirm = noop,
|
|
onCancel = noop,
|
|
onShow = noop,
|
|
onHide = noop,
|
|
}) => {
|
|
const vm = generate({
|
|
title,
|
|
icon,
|
|
iconSvg,
|
|
content,
|
|
closable,
|
|
transition,
|
|
onShow,
|
|
onHide,
|
|
btns: [
|
|
{
|
|
text: cancelText,
|
|
warning: cancelWarning,
|
|
handler: /* istanbul ignore next */ () => {
|
|
if (onCancel() !== false) {
|
|
vm.close()
|
|
}
|
|
},
|
|
},
|
|
{
|
|
text: confirmText,
|
|
warning: confirmWarning,
|
|
handler: /* istanbul ignore next */ () => {
|
|
if (onConfirm() !== false) {
|
|
vm.close()
|
|
}
|
|
},
|
|
},
|
|
],
|
|
})
|
|
|
|
return vm
|
|
}
|
|
|
|
/**
|
|
* Dynamically create a alert dialog
|
|
*
|
|
* @param {Object} props
|
|
* @return {Dialog}
|
|
*/
|
|
Dialog.alert = ({
|
|
title = '',
|
|
icon = '',
|
|
iconSvg = false,
|
|
content = '',
|
|
confirmText = t('md.dialog.confirm'),
|
|
closable = false,
|
|
warning = false,
|
|
transition,
|
|
onConfirm = noop,
|
|
onShow = noop,
|
|
onHide = noop,
|
|
}) => {
|
|
const vm = generate({
|
|
title,
|
|
icon,
|
|
iconSvg,
|
|
content,
|
|
closable,
|
|
transition,
|
|
onShow,
|
|
onHide,
|
|
btns: [
|
|
{
|
|
text: confirmText,
|
|
warning,
|
|
handler: /* istanbul ignore next */ () => {
|
|
if (onConfirm() !== false) {
|
|
vm.close()
|
|
}
|
|
},
|
|
},
|
|
],
|
|
})
|
|
|
|
return vm
|
|
}
|
|
|
|
/**
|
|
* Dynamically create a succeed dialog
|
|
*
|
|
* @param {Object} props
|
|
* @return {Dialog}
|
|
*/
|
|
Dialog.succeed = props => {
|
|
props.icon = 'success-color'
|
|
props.iconSvg = true
|
|
return Dialog.confirm(props)
|
|
}
|
|
|
|
/**
|
|
* Dynamically create a failed dialog
|
|
*
|
|
* @param {Object} props
|
|
* @return {Dialog}
|
|
*/
|
|
Dialog.failed = props => {
|
|
props.icon = 'warn-color'
|
|
props.iconSvg = true
|
|
return Dialog.confirm(props)
|
|
}
|
|
|
|
/**
|
|
* Close all actived static dialogs
|
|
*
|
|
* @static
|
|
* @return void
|
|
*/
|
|
Dialog.closeAll = () => {
|
|
instances.forEach(instance => {
|
|
instance.close()
|
|
})
|
|
}
|
|
|
|
export default Dialog
|