| commit | author | age | ||
| 9bcb19 | 1 | import Modal from 'ant-design-vue/es/modal' |
| I | 2 | export default (Vue) => { |
| 3 | function dialog (component, componentProps, modalProps) { | |
| 4 | const _vm = this | |
| 5 | modalProps = modalProps || {} | |
| 6 | if (!_vm || !_vm._isVue) { | |
| 7 | return | |
| 8 | } | |
| 9 | let dialogDiv = document.querySelector('body>div[type=dialog]') | |
| 10 | if (!dialogDiv) { | |
| 11 | dialogDiv = document.createElement('div') | |
| 12 | dialogDiv.setAttribute('type', 'dialog') | |
| 13 | document.body.appendChild(dialogDiv) | |
| 14 | } | |
| 15 | ||
| 16 | const handle = function (checkFunction, afterHandel) { | |
| 17 | if (checkFunction instanceof Function) { | |
| 18 | const res = checkFunction() | |
| 19 | if (res instanceof Promise) { | |
| 20 | res.then(c => { | |
| 21 | c && afterHandel() | |
| 22 | }) | |
| 23 | } else { | |
| 24 | res && afterHandel() | |
| 25 | } | |
| 26 | } else { | |
| 27 | // checkFunction && afterHandel() | |
| 28 | checkFunction || afterHandel() | |
| 29 | } | |
| 30 | } | |
| 31 | ||
| 32 | const dialogInstance = new Vue({ | |
| 33 | data () { | |
| 34 | return { | |
| 35 | visible: true | |
| 36 | } | |
| 37 | }, | |
| 38 | router: _vm.$router, | |
| 39 | store: _vm.$store, | |
| 40 | mounted () { | |
| 41 | this.$on('close', (v) => { | |
| 42 | this.handleClose() | |
| 43 | }) | |
| 44 | }, | |
| 45 | methods: { | |
| 46 | handleClose () { | |
| 47 | handle(this.$refs._component.onCancel, () => { | |
| 48 | this.visible = false | |
| 49 | this.$refs._component.$emit('close') | |
| 50 | this.$refs._component.$emit('cancel') | |
| 51 | dialogInstance.$destroy() | |
| 52 | }) | |
| 53 | }, | |
| 54 | handleOk () { | |
| 55 | handle(this.$refs._component.onOK || this.$refs._component.onOk, () => { | |
| 56 | this.visible = false | |
| 57 | this.$refs._component.$emit('close') | |
| 58 | this.$refs._component.$emit('ok') | |
| 59 | dialogInstance.$destroy() | |
| 60 | }) | |
| 61 | } | |
| 62 | }, | |
| 63 | render: function (h) { | |
| 64 | const that = this | |
| 65 | const modalModel = modalProps && modalProps.model | |
| 66 | if (modalModel) { | |
| 67 | delete modalProps.model | |
| 68 | } | |
| 69 | const ModalProps = Object.assign({}, modalModel && { model: modalModel } || {}, { | |
| 70 | attrs: Object.assign({}, { | |
| 71 | ...(modalProps.attrs || modalProps) | |
| 72 | }, { | |
| 73 | visible: this.visible | |
| 74 | }), | |
| 75 | on: Object.assign({}, { | |
| 76 | ...(modalProps.on || modalProps) | |
| 77 | }, { | |
| 78 | ok: () => { | |
| 79 | that.handleOk() | |
| 80 | }, | |
| 81 | cancel: () => { | |
| 82 | that.handleClose() | |
| 83 | } | |
| 84 | }) | |
| 85 | }) | |
| 86 | ||
| 87 | const componentModel = componentProps && componentProps.model | |
| 88 | if (componentModel) { | |
| 89 | delete componentProps.model | |
| 90 | } | |
| 91 | const ComponentProps = Object.assign({}, componentModel && { model: componentModel } || {}, { | |
| 92 | ref: '_component', | |
| 93 | attrs: Object.assign({}, { | |
| 94 | ...((componentProps && componentProps.attrs) || componentProps) | |
| 95 | }), | |
| 96 | on: Object.assign({}, { | |
| 97 | ...((componentProps && componentProps.on) || componentProps) | |
| 98 | }) | |
| 99 | }) | |
| 100 | ||
| 101 | return h(Modal, ModalProps, [h(component, ComponentProps)]) | |
| 102 | } | |
| 103 | }).$mount(dialogDiv) | |
| 104 | } | |
| 105 | ||
| 106 | Object.defineProperty(Vue.prototype, '$dialog', { | |
| 107 | get: () => { | |
| 108 | return function () { | |
| 109 | dialog.apply(this, arguments) | |
| 110 | } | |
| 111 | } | |
| 112 | }) | |
| 113 | } | |
