107 lines
2.4 KiB
JavaScript
107 lines
2.4 KiB
JavaScript
import { createApp } from 'vue'
|
|
import ErrorModal from '../components/Toast.vue'
|
|
|
|
class ErrorModalManager {
|
|
constructor() {
|
|
this.instances = []
|
|
}
|
|
|
|
// 显示错误弹框
|
|
show(message, options = {}) {
|
|
const container = document.createElement('div')
|
|
document.body.appendChild(container)
|
|
|
|
const app = createApp(ErrorModal, {
|
|
message,
|
|
...options,
|
|
onConfirm: () => {
|
|
if (options.onConfirm) {
|
|
options.onConfirm()
|
|
}
|
|
this.cleanup(app, container)
|
|
},
|
|
onClose: () => {
|
|
if (options.onClose) {
|
|
options.onClose()
|
|
}
|
|
this.cleanup(app, container)
|
|
}
|
|
})
|
|
|
|
const instance = app.mount(container)
|
|
this.instances.push(app)
|
|
|
|
return {
|
|
close: () => instance.close(),
|
|
instance
|
|
}
|
|
}
|
|
|
|
// 清理DOM和实例
|
|
cleanup(app, container) {
|
|
setTimeout(() => {
|
|
if (container && container.parentNode) {
|
|
container.parentNode.removeChild(container)
|
|
}
|
|
app.unmount()
|
|
|
|
// 从实例列表中移除
|
|
const index = this.instances.indexOf(app)
|
|
if (index > -1) {
|
|
this.instances.splice(index, 1)
|
|
}
|
|
}, 100)
|
|
}
|
|
|
|
// 关闭所有弹框
|
|
closeAll() {
|
|
this.instances.forEach(app => {
|
|
const instance = app._instance
|
|
if (instance && instance.exposed && instance.exposed.close) {
|
|
instance.exposed.close()
|
|
}
|
|
})
|
|
this.instances = []
|
|
}
|
|
}
|
|
|
|
// 创建全局实例
|
|
export const errorModal = new ErrorModalManager()
|
|
|
|
// 快捷方法 - 替代alert
|
|
export const showError = (message, title = 'Error') => {
|
|
return errorModal.show(message, { title })
|
|
}
|
|
|
|
// 错误处理的专用方法
|
|
export const handleError = (error) => {
|
|
let message = 'An unknown error occurred'
|
|
let title = 'Error'
|
|
|
|
if (error.errorCode === 1083) {
|
|
title = 'Service Unavailable'
|
|
message = 'Exchange function is not available'
|
|
} else if (error.message && error.message.includes('HTTP Error: 406')) {
|
|
title = 'Request Not Acceptable'
|
|
message = 'Something went wrong, please retry.'
|
|
} else if (error.message) {
|
|
message = error.message
|
|
}
|
|
|
|
return errorModal.show(message, { title })
|
|
}
|
|
|
|
// 确认对话框
|
|
export const showConfirm = (message, title = 'Confirm') => {
|
|
return new Promise((resolve) => {
|
|
errorModal.show(message, {
|
|
title,
|
|
confirmText: 'Confirm',
|
|
onConfirm: () => resolve(true),
|
|
onClose: () => resolve(false)
|
|
})
|
|
})
|
|
}
|
|
|
|
export default errorModal
|