50 lines
1.0 KiB
TypeScript
Executable File
50 lines
1.0 KiB
TypeScript
Executable File
import type { NotificationsState, NotificationConfig } from '../interfaces';
|
|
import { reactive, readonly } from 'vue';
|
|
import { v4 as uuidv4 } from 'uuid';
|
|
|
|
const state = reactive<NotificationsState>({
|
|
notifications: [],
|
|
});
|
|
|
|
const actions = {
|
|
removeNotification(id: string) {
|
|
state.notifications = state.notifications.filter(notification => notification.id !== id);
|
|
},
|
|
dispatchNotification({
|
|
title,
|
|
content,
|
|
type,
|
|
autoClose = true,
|
|
duration = 3000,
|
|
}: NotificationConfig) {
|
|
const id = uuidv4();
|
|
const notifications = [{
|
|
id,
|
|
title,
|
|
content,
|
|
type,
|
|
}, ...state.notifications];
|
|
state.notifications = notifications;
|
|
|
|
if (autoClose) {
|
|
setTimeout(() => {
|
|
actions.removeNotification(id);
|
|
}, duration);
|
|
}
|
|
}
|
|
}
|
|
|
|
const getters = {
|
|
getNotifications() {
|
|
return [...state.notifications].slice(0,4);
|
|
},
|
|
getNotificationsCount() {
|
|
return state.notifications.length;
|
|
}
|
|
}
|
|
|
|
export default {
|
|
state: readonly(state),
|
|
actions,
|
|
getters,
|
|
} |