x-control-panel/web-ui/vue-app/src/stores/notification.ts

47 lines
1.2 KiB
TypeScript

import { defineStore } from 'pinia'
import { ref } from 'vue'
interface Notification {
id: string
message: string
color: string
timeout: number
}
export const useNotificationStore = defineStore('notification', () => {
const notifications = ref<Notification[]>([])
const showNotification = (message: string, color: string = 'info', timeout: number = 3000) => {
const id = Date.now().toString()
notifications.value.push({ id, message, color, timeout })
if (timeout > 0) {
setTimeout(() => {
removeNotification(id)
}, timeout)
}
}
const removeNotification = (id: string) => {
const index = notifications.value.findIndex((n) => n.id === id)
if (index > -1) {
notifications.value.splice(index, 1)
}
}
const showSuccess = (message: string) => showNotification(message, 'success')
const showError = (message: string) => showNotification(message, 'error')
const showWarning = (message: string) => showNotification(message, 'warning')
const showInfo = (message: string) => showNotification(message, 'info')
return {
notifications,
showNotification,
removeNotification,
showSuccess,
showError,
showWarning,
showInfo
}
})