diff --git a/ui/src/components/ui/NavBar.vue b/ui/src/components/ui/NavBar.vue
index 464b314..2ca7806 100644
--- a/ui/src/components/ui/NavBar.vue
+++ b/ui/src/components/ui/NavBar.vue
@@ -3,6 +3,7 @@ import { ref, watch, computed, onMounted } from 'vue'
import { useRoute } from 'vue-router'
import { useUi } from '@/stores/useUi'
import { useRealtimeStore } from '@/stores/useRealtime'
+import { moduleInfo } from '@/constants/moduleInfo'
const ui = useUi()
const realtime = useRealtimeStore()
@@ -10,10 +11,10 @@ const realtime = useRealtimeStore()
// enlaces de la app
const links = [
{ to: '/', label: 'Chat', icon: '💬' },
- { to: '/empleados', label: 'Empleados', icon: '👥' },
- { to: '/tareas', label: 'Tareas', icon: '📋' },
- { to: '/planillas', label: 'Planillas', icon: '📂' },
- { to: '/asistencias', label: 'Asistencias', icon: '⏰' },
+ { to: '/empleados', label: 'Empleados', icon: moduleInfo.Cliente.icon },
+ { to: '/tareas', label: 'Tareas', icon: moduleInfo.TareaRealizada.icon },
+ { to: '/planillas', label: 'Planillas', icon: moduleInfo.Planilla.icon },
+ { to: '/asistencias', label: 'Asistencias', icon: moduleInfo.Asistencia.icon },
{ to: '/feed', label: 'Feed', icon: '📰' },
{ to: '/config', label: 'Config', icon: '⚙️' },
]
diff --git a/ui/src/components/ui/SnackbarContainer.vue b/ui/src/components/ui/SnackbarContainer.vue
index bbda834..be3b66c 100644
--- a/ui/src/components/ui/SnackbarContainer.vue
+++ b/ui/src/components/ui/SnackbarContainer.vue
@@ -6,7 +6,13 @@
:key="snack.id"
:class="['snackbar-item', typeClass(snack.type)]"
>
- {{ snack.text }}
+
+
+ {{ snack.icon }}
+ {{ snack.header }}
+
+
{{ snack.text }}
+
diff --git a/ui/src/constants/moduleInfo.js b/ui/src/constants/moduleInfo.js
new file mode 100644
index 0000000..5d8aa30
--- /dev/null
+++ b/ui/src/constants/moduleInfo.js
@@ -0,0 +1,6 @@
+export const moduleInfo = {
+ Cliente: { label: 'Empleados', icon: '👥' },
+ TareaRealizada: { label: 'Tareas', icon: '📋' },
+ Planilla: { label: 'Planillas', icon: '📂' },
+ Asistencia: { label: 'Asistencias', icon: '⏰' }
+}
diff --git a/ui/src/stores/useRealtime.js b/ui/src/stores/useRealtime.js
index 6e8a312..9992412 100644
--- a/ui/src/stores/useRealtime.js
+++ b/ui/src/stores/useRealtime.js
@@ -4,6 +4,7 @@ import { useEmpleadosStore } from './useEmpleados'
import { useTareasStore } from './useTareas'
import { useAsistenciasStore } from './useAsistencias'
import { useSnackbarStore } from './useSnackbar'
+import { moduleInfo } from '@/constants/moduleInfo'
export const useRealtimeStore = defineStore('realtime', {
state: () => ({
@@ -61,7 +62,13 @@ export const useRealtimeStore = defineStore('realtime', {
const message = `${payload.operation} ${payload.table}${idPart ? ' #' + idPart : ''}`;
const type = payload.operation === 'DELETE' ? 'error' :
payload.operation === 'INSERT' ? 'success' : 'info';
- snackbar.push({ text: message, type });
+ const info = moduleInfo[payload.table] || {};
+ snackbar.push({
+ text: message,
+ type,
+ icon: info.icon,
+ header: info.label
+ });
// mark badge for module and operation
if (this.badges[payload.table]) {
diff --git a/ui/src/stores/useSnackbar.js b/ui/src/stores/useSnackbar.js
index 0898b06..1689eb6 100644
--- a/ui/src/stores/useSnackbar.js
+++ b/ui/src/stores/useSnackbar.js
@@ -6,9 +6,9 @@ export const useSnackbarStore = defineStore('snackbar', {
maxSnacks: 5
}),
actions: {
- push({ text, type = 'info', duration = 6000 }) {
+ push({ text, type = 'info', icon = '', header = '', duration = 6000 }) {
const id = crypto.randomUUID ? crypto.randomUUID() : Date.now().toString(36) + Math.random().toString(36).slice(2)
- const snack = { id, text, type }
+ const snack = { id, text, type, icon, header }
if (this.snacks.length >= this.maxSnacks) {
this.snacks.shift()
}