Fix: Corregir integración del widget de chat
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m3s

- Usar nombre correcto del web component: chat-widget (no agents-chat-widget)
- Usar atributos correctos: api-url, agent-id, user-id (no server-url, agent-slug, external-user-id)
- Insertar widget dinámicamente en el DOM con posición flotante
This commit is contained in:
2025-12-10 12:39:20 -06:00
parent e7cf999da2
commit f6ed5a1032

View File

@@ -1,37 +1,45 @@
declare global {
interface Window {
AgentsChatWidget?: {
init: (config: {
serverUrl: string
agentSlug: string
appId: string
externalUserId?: string
position?: 'bottom-right' | 'bottom-left'
theme?: 'dark' | 'light'
primaryColor?: string
}) => void
}
}
}
export default defineNuxtPlugin(() => { export default defineNuxtPlugin(() => {
const initWidget = () => { const createWidget = () => {
if (window.AgentsChatWidget) { // Verificar que el custom element esté registrado
window.AgentsChatWidget.init({ if (!customElements.get('chat-widget')) {
serverUrl: 'https://gamdias.nucleoriofrio.com', // Reintentar en 100ms si aún no está listo
agentSlug: 'whatsapp-agent', setTimeout(createWidget, 100)
appId: 'whatsapp-app', return
externalUserId: 'whatsapp-user',
position: 'bottom-right',
theme: 'dark',
primaryColor: '#25D366'
})
} }
// Verificar que no exista ya
if (document.querySelector('chat-widget')) {
return
}
// Crear el widget flotante
const widget = document.createElement('chat-widget')
widget.setAttribute('api-url', 'https://gamdias.nucleoriofrio.com')
widget.setAttribute('agent-id', 'whatsapp-agent')
widget.setAttribute('app-id', 'whatsapp-app')
widget.setAttribute('user-id', 'whatsapp-user')
widget.setAttribute('title', 'Asistente WhatsApp')
// Estilo flotante en esquina inferior derecha
widget.style.cssText = `
position: fixed;
bottom: 20px;
right: 20px;
z-index: 9999;
width: 400px;
height: 600px;
max-height: 80vh;
box-shadow: 0 4px 24px rgba(0, 0, 0, 0.3);
border-radius: 12px;
overflow: hidden;
`
document.body.appendChild(widget)
} }
if (document.readyState === 'complete') { if (document.readyState === 'complete') {
setTimeout(initWidget, 100) setTimeout(createWidget, 100)
} else { } else {
window.addEventListener('load', () => setTimeout(initWidget, 100)) window.addEventListener('load', () => setTimeout(createWidget, 100))
} }
}) })