💠 Pricelist Hub

Pricelist Hub es el centro de control estético y funcional del chatbot AI integrado en el ecosistema Pricelist. A través de este panel, el administrador puede personalizar: • colores, textos y mensajes; • botones y barra de herramientas; • comportamiento visual de la ventana de chat y de los modos de voz.

🧩 Secciones del panel

1️⃣ General
Gestiona dimensiones y posicionamiento del chatbot.
• Ancho de escritorio / Altura de escritorio → dimensiones del chatbot en la versión de escritorio. Ej. 600px – 400px
• Ancho de tablet / Altura de tablet → dimensiones del chatbot en la versión de tablet. Ej. 100% – 100%
• Posición del chatbot → posición del chatbot en la página.

2️⃣ Botón del Chatbot
Gestiona dimensiones, color, imagen y redondeo del botón de apertura del chatbot.
• Ancho / Altura → dimensiones del botón para abrir el chatbot. Ej. 60px – 60px
• Color de fondo → color de fondo del botón
• URL de la imagen → URL de la imagen a utilizar como fondo del botón
• Color del borde → color del borde del botón
• Grosor del borde → grosor del borde del botón
• Redondeo de esquinas → redondeo a aplicar al borde del botón. Ej. 10px

3️⃣ Encabezado
Controla la parte superior de la ventana del chatbot (barra de título y botón de cierre).
Campos configurables:
• Color de fondo del encabezado → color principal de la barra superior.
• Color del texto del encabezado → color del título.
• Texto del encabezado → texto mostrado en el título (ej. “Devcore AI”).
• Color de fondo del inicio de sesión / texto de inicio de sesión → paleta de la pantalla de autenticación del usuario.
• Color del botón de cierre → color del icono “X”.

4️⃣ Barra de herramientas del Hub
Gestiona los botones rápidos en la barra superior del chatbot, hub de acceso a los módulos secundarios.
Botones configurables:
• Fondo de la barra de herramientas → color de fondo general de la barra.
• 📖 Botón Pricelist → abre la lista de precios en línea.
• 📝 Botón Prev → abre la sección de Presupuestos.
• 👁️ Botón Vision → activa el modo Vision para la generación de imágenes (Leonardo AI).
• 📦 Botón DeepSpace → accede al configurador 3D paramétrico.
Cada botón puede tener un color personalizado para distinguir las funciones.

5️⃣ Ventana de chat
Gestiona los mensajes y los colores del área de conversación.
Campos configurables:
• Mensaje de bienvenida → texto inicial mostrado al usuario.
• Fondo de respuesta de AI → color de fondo de los mensajes del bot.
• Fondo del mensaje del usuario → color de los mensajes enviados por el usuario.
• Color del texto de AI / Color del texto del usuario → color de los textos en el chat.

6️⃣ Entrada de Pie de Página
Configura la barra inferior para el envío de mensajes.
Campos configurables:
• Color del texto de entrada → color del texto escrito.
• Color de fondo de entrada → color del campo de escritura.
• Botón de envío → color del botón “Enviar“.
• Botón de micrófono → color del botón de activación del modo de voz.

7️⃣ Modo de Voz (Superposición)
Controla el aspecto del modo de voz durante la escucha y respuesta.
Campos configurables:
• Diámetro del círculo → tamaño del círculo de voz (px).
• Color del círculo en escucha / en respuesta → colores animados durante la grabación y respuesta.
• Color del texto transcrito → color del texto dictado mostrado en tiempo real.
• Color de las instrucciones móviles → color del mensaje guía.
• Texto de instrucción móvil → mensaje personalizado (ej. “Toca el círculo para hablar”).