Testing Alpha

resources/assets/js/notifications/vuexy/vuexy-notify.js

@@ -0,0 +1,94 @@
+export const VuexyNotifyService = {
+    flash({ message, type = 'info', target = 'body', delay = 3000 }) {
+        const event = new CustomEvent('vuexy:notify', {
+            detail: { type, message, target, delay }
+        });
+
+        window.dispatchEvent(event);
+    },
+
+    success(message, target = 'body', delay = 3000) {
+        this.flash({ type: 'success', message, target, delay });
+    },
+
+    error(message, target = 'body', delay = 3000) {
+        this.flash({ type: 'error', message, target, delay });
+    },
+
+    info(message, target = 'body', delay = 3000) {
+        this.flash({ type: 'info', message, target, delay });
+    },
+
+    warning(message, target = 'body', delay = 3000) {
+        this.flash({ type: 'warning', message, target, delay });
+    },
+
+    fromLocalStorage() {
+        const data = localStorage.getItem('vuexy_notification');
+
+        if (data) {
+            try {
+                this.flash(JSON.parse(data));
+
+                localStorage.removeItem('vuexy_notification');
+
+            } catch (e) {
+                console.error('❌ Error parseando notificación de storage', e);
+            }
+        }
+    },
+
+    fromSession() {
+        if (window.vuexySessionNotification) {
+            this.flash(window.vuexySessionNotification);
+            window.vuexySessionNotification = null;
+        }
+    },
+
+    dispatch(eventName, payload = {}) {
+        const event = new CustomEvent(eventName, { detail: payload });
+
+        window.dispatchEvent(event);
+    }
+};
+
+document.addEventListener('DOMContentLoaded', function () {
+    window.addEventListener('vuexy:notify', function (event) {
+        // Si viene como array, tomar el primer objeto
+        const detail = Array.isArray(event.detail) ? event.detail[0] : event.detail;
+        const { type, message, target, delay } = detail || {};
+
+        const defaultTarget = 'body .notification-container';
+
+        let realTarget = target == 'body' ? defaultTarget : target;
+
+        let targetElement = document.querySelector(realTarget);
+
+        if (!targetElement) {
+            console.warn('⚠️ Target para notificación no encontrado:', realTarget, ', usando ', defaultTarget);
+
+            targetElement = document.querySelector(defaultTarget);
+        }
+
+        if(!targetElement) {
+            console.error('🛑 Target por defecto no encontrado:', defaultTarget);
+            return;
+        }
+
+        const alert = document.createElement('div');
+
+        alert.className = `alert alert-${type} alert-dismissible fade show mt-2`;
+        alert.setAttribute('role', 'alert');
+        alert.innerHTML = `
+            ${message}
+            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
+        `.trim();
+
+        targetElement.appendChild(alert);
+
+        setTimeout(() => {
+            alert.remove();
+        }, delay || 6000);
+    });
+});
+