59 lines
1.3 KiB
TypeScript
59 lines
1.3 KiB
TypeScript
import { ref } from 'vue'
|
|
|
|
interface ToastMessage {
|
|
id: number
|
|
message: string
|
|
type: 'success' | 'error' | 'info' | 'warning'
|
|
duration: number
|
|
}
|
|
|
|
const toasts = ref<ToastMessage[]>([])
|
|
let toastId = 0
|
|
|
|
export const useToast = () => {
|
|
const showToast = (
|
|
message: string,
|
|
type: 'success' | 'error' | 'info' | 'warning' = 'info',
|
|
duration = 3000
|
|
) => {
|
|
const id = ++toastId
|
|
const toast: ToastMessage = {
|
|
id,
|
|
message,
|
|
type,
|
|
duration
|
|
}
|
|
|
|
toasts.value.push(toast)
|
|
|
|
// 自动移除toast
|
|
setTimeout(() => {
|
|
removeToast(id)
|
|
}, duration)
|
|
|
|
return id
|
|
}
|
|
|
|
const removeToast = (id: number) => {
|
|
const index = toasts.value.findIndex((toast) => toast.id === id)
|
|
if (index > -1) {
|
|
toasts.value.splice(index, 1)
|
|
}
|
|
}
|
|
|
|
const success = (message: string, duration?: number) => showToast(message, 'success', duration)
|
|
const error = (message: string, duration?: number) => showToast(message, 'error', duration)
|
|
const info = (message: string, duration?: number) => showToast(message, 'info', duration)
|
|
const warning = (message: string, duration?: number) => showToast(message, 'warning', duration)
|
|
|
|
return {
|
|
toasts,
|
|
showToast,
|
|
removeToast,
|
|
success,
|
|
error,
|
|
info,
|
|
warning
|
|
}
|
|
}
|