后台统一状态提示:共享 toast 模块(ToastStack 挂后台布局与登录页),登录成功/失败、文章/标签/作品/文件/评论/设置操作全部有反馈,替换掉原生 alert;编辑器局部 toast 并入共享实现
This commit is contained in:
1 parent
f7a2e83727
commit
c84a383e5c
11 files changed
+96
-45
No files matched your search
@@ -0,0 +1,47 @@
|
||||
import { reactive } from 'vue'
|
||||
|
||||
// 后台共享的轻提示:所有视图的操作反馈(成功/失败/进度)从这里发,
|
||||
// ToastStack.vue 负责渲染(挂在 AdminLayout 与 LoginView)。
|
||||
// EditorView 的上传/转存也走它——原先那套局部实现已并入。
|
||||
export const toasts = reactive([])
|
||||
let seq = 0
|
||||
|
||||
export function toast(text, type = 'info', ttl = 2600) {
|
||||
const id = ++seq
|
||||
toasts.push({ id, text, type })
|
||||
setTimeout(() => {
|
||||
const i = toasts.findIndex((t) => t.id === id)
|
||||
if (i >= 0) toasts.splice(i, 1)
|
||||
}, ttl)
|
||||
return id
|
||||
}
|
||||
|
||||
export function toastOk(text) {
|
||||
return toast(text, 'ok', 2200)
|
||||
}
|
||||
|
||||
export function toastErr(text) {
|
||||
return toast(text, 'err', 4200)
|
||||
}
|
||||
|
||||
// 更新一条已存在的 toast(上传进度用)
|
||||
export function toastUpdate(id, text, type = 'info') {
|
||||
const t = toasts.find((x) => x.id === id)
|
||||
if (t) {
|
||||
t.text = text
|
||||
t.type = type
|
||||
}
|
||||
}
|
||||
|
||||
// 标记成功并很快消失(进度条收尾)
|
||||
export function toastDone(id, text) {
|
||||
toastUpdate(id, text, 'ok')
|
||||
const idx = toasts.findIndex((t) => t.id === id)
|
||||
if (idx >= 0) {
|
||||
const t = toasts[idx]
|
||||
setTimeout(() => {
|
||||
const i = toasts.indexOf(t)
|
||||
if (i >= 0) toasts.splice(i, 1)
|
||||
}, 1600)
|
||||
}
|
||||
}
|
||||
Reference in new issue
Block a user