import Vue from 'vue'
|
// 导入组件
|
import UploadFile from './Box.vue'
|
// 使用基础 Vue 构造器，创建一个“子类”
|
const UploadFileConstructor = Vue.extend(UploadFile)
|
|
let uploadFileInstance = null
|
/**
|
* 初始化右键菜单实例
|
* @param {string} params 上传文件组件参数
|
* @param {object} uploadWay 上传方式 0-文件上传 1-文件夹上传 2-粘贴图片或拖拽上传
|
* @param {} serviceEl 组件实例
|
* @param {} callType 是否组件本身
|
*/
|
const initInstanceUploadFile = (params, uploadWay, serviceEl, callType) => {
|
uploadFileInstance = new UploadFileConstructor({
|
el: document.createElement('div'),
|
data() {
|
return {
|
params,
|
uploadWay,
|
serviceEl,
|
callType
|
}
|
}
|
})
|
}
|
/**
|
* 右键菜单 Promise 函数
|
* @returns {Promise} 抛出确认和取消回调函数
|
*/
|
const showUploadFileBox = (obj) => {
|
console.log("showUploadFileBox",obj);
|
console.log("uploadFileInstance",uploadFileInstance);
|
// 非首次调用服务时，在 DOM 中移除上个实例
|
if (uploadFileInstance !== null) {
|
let { params, uploadWay, serviceEl, callType } = obj
|
uploadFileInstance.params = params
|
uploadFileInstance.uploadWay = uploadWay
|
uploadFileInstance.serviceEl = serviceEl
|
uploadFileInstance.callType = callType
|
uploadFileInstance.handlePrepareUpload() // 上传组件开始预处理
|
} else {
|
let { params, uploadWay, serviceEl, callType } = obj
|
return new Promise((reslove) => {
|
initInstanceUploadFile(params, uploadWay, serviceEl, callType)
|
uploadFileInstance.callback = (res) => {
|
reslove(res)
|
// 服务取消时卸载 DOM
|
if (res === 'cancel' && uploadFileInstance !== null) {
|
document.body.removeChild(uploadFileInstance.$el)
|
uploadFileInstance = null
|
}
|
}
|
document.body.appendChild(uploadFileInstance.$el) // 挂载 DOM
|
Vue.nextTick(() => {
|
uploadFileInstance.handlePrepareUpload() // 上传组件开始预处理
|
})
|
})
|
}
|
}
|
|
export default showUploadFileBox
|
