Fix: Corregir integración del widget de chat
All checks were successful
build-and-deploy / build-and-deploy (push) Successful in 1m3s
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:
@@ -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(() => {
|
||||
const createWidget = () => {
|
||||
// Verificar que el custom element esté registrado
|
||||
if (!customElements.get('chat-widget')) {
|
||||
// Reintentar en 100ms si aún no está listo
|
||||
setTimeout(createWidget, 100)
|
||||
return
|
||||
}
|
||||
|
||||
export default defineNuxtPlugin(() => {
|
||||
const initWidget = () => {
|
||||
if (window.AgentsChatWidget) {
|
||||
window.AgentsChatWidget.init({
|
||||
serverUrl: 'https://gamdias.nucleoriofrio.com',
|
||||
agentSlug: 'whatsapp-agent',
|
||||
appId: 'whatsapp-app',
|
||||
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') {
|
||||
setTimeout(initWidget, 100)
|
||||
setTimeout(createWidget, 100)
|
||||
} else {
|
||||
window.addEventListener('load', () => setTimeout(initWidget, 100))
|
||||
window.addEventListener('load', () => setTimeout(createWidget, 100))
|
||||
}
|
||||
})
|
||||
|
||||
Reference in New Issue
Block a user