feat(弹窗组件): 引入翻译文本

This commit is contained in:
hzj 2025-10-29 20:26:48 +08:00
parent 96370018f8
commit 5cad3cad1d

View File

@ -1,5 +1,7 @@
// src/utils/toast.js
import { createApp } from 'vue'
import ErrorModal from '../components/Toast.vue'
import i18n from '@/locales/i18n'
class ErrorModalManager {
constructor() {
@ -25,15 +27,18 @@ class ErrorModalManager {
options.onClose()
}
this.cleanup(app, container)
}
},
})
// 注入 i18n 实例以支持多语言
app.use(i18n)
const instance = app.mount(container)
this.instances.push(app)
return {
close: () => instance.close(),
instance
instance,
}
}
@ -55,7 +60,7 @@ class ErrorModalManager {
// 关闭所有弹框
closeAll() {
this.instances.forEach(app => {
this.instances.forEach((app) => {
const instance = app._instance
if (instance && instance.exposed && instance.exposed.close) {
instance.exposed.close()
@ -69,55 +74,63 @@ class ErrorModalManager {
export const errorModal = new ErrorModalManager()
// 快捷方法 - 替代alert
export const showError = (message, title = 'Error') => {
return errorModal.show(message, { title, type: 'error' })
export const showError = (message, title = null) => {
// 如果没有提供标题,则使用国际化文本
const finalTitle = title || i18n.global.t('error')
return errorModal.show(message, { title: finalTitle, type: 'error' })
}
// 信息提示
export const showInfo = (message, title = 'Info') => {
return errorModal.show(message, { title, type: 'info' })
export const showInfo = (message, title = null) => {
const finalTitle = title || i18n.global.t('information')
return errorModal.show(message, { title: finalTitle, type: 'info' })
}
// 成功提示
export const showSuccess = (message, title = 'Success') => {
return errorModal.show(message, { title, type: 'success' })
export const showSuccess = (message, title = null) => {
const finalTitle = title || i18n.global.t('success')
return errorModal.show(message, { title: finalTitle, type: 'success' })
}
// 警告提示
export const showWarning = (message, title = 'Warning') => {
return errorModal.show(message, { title, type: 'warning' })
export const showWarning = (message, title = null) => {
const finalTitle = title || i18n.global.t('warning')
return errorModal.show(message, { title: finalTitle, type: 'warning' })
}
// 通用提示方法
export const showToast = (message, options = {}) => {
const defaultOptions = {
title: 'Notice',
title: i18n.global.t('information'),
type: 'info',
duration: 3000, // 自动关闭时间
...options
...options,
}
return errorModal.show(message, defaultOptions)
}
// 错误处理的专用方法
export const handleError = (error) => {
let message = 'An unknown error occurred'
let title = 'Error'
let message = i18n.global.t('unknown_error') || 'An unknown error occurred'
let title = i18n.global.t('error') || 'Error'
if (error.errorCode === 1083) {
title = 'Service Unavailable'
message = 'Exchange function is not available'
title = i18n.global.t('service_unavailable') || 'Service Unavailable'
message = i18n.global.t('exchange_not_available') || 'Exchange function is not available'
} else if (error.errorCode === 6010) {
title = 'Team Not Found'
message = 'The team does not exist or has been disbanded'
title = i18n.global.t('team_not_found') || 'Team Not Found'
message = i18n.global.t('team_not_exist') || 'The team does not exist or has been disbanded'
} else if (error.message && error.message.includes('HTTP Error: 406')) {
title = 'Request Not Acceptable'
message = 'Something went wrong, please retry.'
title = i18n.global.t('request_not_acceptable') || 'Request Not Acceptable'
message = i18n.global.t('something_went_wrong') || 'Something went wrong, please retry.'
} else if (error.errorMsg) {
// 优先使用 errorMsg
message = error.errorMsg
if (error.errorCodeName) {
title = error.errorCodeName.replace(/_/g, ' ').toLowerCase().replace(/\b\w/g, l => l.toUpperCase())
title = error.errorCodeName
.replace(/_/g, ' ')
.toLowerCase()
.replace(/\b\w/g, (l) => l.toUpperCase())
}
} else if (error.message) {
message = error.message
@ -127,13 +140,14 @@ export const handleError = (error) => {
}
// 确认对话框
export const showConfirm = (message, title = 'Confirm') => {
export const showConfirm = (message, title = null) => {
const finalTitle = title || i18n.global.t('confirm')
return new Promise((resolve) => {
errorModal.show(message, {
title,
confirmText: 'Confirm',
title: finalTitle,
confirmText: i18n.global.t('ok') || 'Confirm',
onConfirm: () => resolve(true),
onClose: () => resolve(false)
onClose: () => resolve(false),
})
})
}