72 lines
1.4 KiB
JavaScript
72 lines
1.4 KiB
JavaScript
import { ref } from 'vue'
|
|
|
|
const toasts = ref([])
|
|
const MAX_TOASTS = 3
|
|
let nextId = 1
|
|
|
|
export function useToast () {
|
|
const showToast = (message, type = 'info', duration = 3500) => {
|
|
const id = nextId++
|
|
const toast = {
|
|
id,
|
|
message,
|
|
type,
|
|
visible: true
|
|
}
|
|
|
|
if (toasts.value.length >= MAX_TOASTS) {
|
|
toasts.value.shift()
|
|
}
|
|
|
|
toasts.value.push(toast)
|
|
|
|
// Auto-remove after duration
|
|
setTimeout(() => {
|
|
removeToast(id)
|
|
}, duration)
|
|
|
|
return id
|
|
}
|
|
|
|
const showSuccess = (message, duration = 5000) => {
|
|
return showToast(message, 'success', duration)
|
|
}
|
|
|
|
const showError = (message, duration = 5000) => {
|
|
return showToast(message, 'error', duration)
|
|
}
|
|
|
|
const showWarning = (message, duration = 6000) => {
|
|
return showToast(message, 'warning', duration)
|
|
}
|
|
|
|
const showInfo = (message, duration = 5000) => {
|
|
return showToast(message, 'info', duration)
|
|
}
|
|
|
|
const removeToast = (id) => {
|
|
const index = toasts.value.findIndex(toast => toast.id === id)
|
|
if (index !== -1) {
|
|
toasts.value[index].visible = false
|
|
setTimeout(() => {
|
|
toasts.value.splice(index, 1)
|
|
}, 300) // Animation duration
|
|
}
|
|
}
|
|
|
|
const clearAll = () => {
|
|
toasts.value = []
|
|
}
|
|
|
|
return {
|
|
toasts,
|
|
showToast,
|
|
showSuccess,
|
|
showError,
|
|
showWarning,
|
|
showInfo,
|
|
removeToast,
|
|
clearAll
|
|
}
|
|
}
|