Files
Inventory_frontend/app/composables/useToast.js
2025-09-26 11:29:47 +02:00

67 lines
1.3 KiB
JavaScript

import { ref } from 'vue'
const toasts = ref([])
let nextId = 1
export function useToast () {
const showToast = (message, type = 'info', duration = 5000) => {
const id = nextId++
const toast = {
id,
message,
type,
visible: true
}
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 = 7000) => {
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
}
}