¿Que es esta pantalla?
Parametros globales de esta instalacion del ERPv4. Lo que se configura aqui afecta a todos los usuarios y se aplica de forma inmediata. Hoy esta operativa la seccion Branding (logos y favicon). Las demas secciones se iran activando en proximas iteraciones.
Branding - los tres slots
Personalizan la identidad visual de la instalacion. Cada slot tiene proporcion fija y aparece en un sitio concreto:
- Logo de Login: Cuadrado (1:1), 400×400 px. Se muestra grande sobre el formulario de acceso (
/admin/login). Si se deja vacio, aparece el nombre comercial de la instalacion como texto. - Logo de Header: Horizontal (4:1), 240×60 px. Esquina superior izquierda del panel de administracion, junto al menu lateral. Si se deja vacio, aparece el nombre comercial como texto.
- Favicon: Cuadrado (1:1), 64×64 px. Es el icono que aparece en la pestana del navegador y en favoritos. Si se deja vacio, se usa el favicon por defecto del template.
Formatos admitidos
El sistema acepta PNG, JPEG, WebP y SVG. Tamano maximo del archivo: 5 MB.
- SVG (recomendado): Vectorial. Mejor opcion para logos: nitidez perfecta en cualquier resolucion (Retina, 4K, impresiones). NO pasa por el recortador: se guarda tal cual (sanitizado contra inyeccion de scripts).
- PNG: Raster con transparencia. Recomendable cuando el logo tiene fondo transparente. El recortador devuelve PNG por defecto.
- JPEG: Raster sin transparencia (fondo blanco). Util para fotografias incrustadas o logos sin transparencia.
- WebP: Raster moderno mas ligero. Soportado pero no se genera automaticamente (el contenedor Docker actual no tiene WebP en GD).
Como funciona el recortador
Al pulsar Cambiar se abre un editor interactivo basado en Cropper.js. La proporcion esta bloqueada segun el slot — no se puede recortar un logo de header en cuadrado, ni un favicon en formato libre.
- Arrastrar: Mover la imagen dentro de la caja de recorte.
- Rueda raton: Zoom in / zoom out.
- Lupas (+/-): Zoom manual con botones, util en pantallas tactiles.
- Rotar: Giro de 90° a izquierda o derecha.
- Restablecer: Volver al encuadre inicial del recortador.
- Recortar y subir: Confirma el recorte y sube el resultado al servidor. La imagen vieja del slot se reemplaza.
- Cancelar: Cierra el modal sin guardar nada.
Zonas transparentes en el recorte
La caja de recorte puede salir fuera de los bordes de la imagen original. Esas zonas quedan transparentes en el PNG resultante. Es util para centrar un logo apaisado sobre un slot mas cuadrado sin perder pixeles del logo. El cuadriculado del preview indica precisamente la zona transparente.
Fallback automatico
Si un slot esta vacio (nunca se subio o se elimino), el sistema aplica el siguiente comportamiento sin intervencion:
- Logo Login / Header: Se muestra el
nombre_comercial de la instalacion como texto. Si la instalacion todavia no esta inicializada, cae al APP_NAME del entorno. - Favicon: Se usa el favicon por defecto del template Phoenix.
Eliminar un logo
El boton Eliminar (visible solo si el slot tiene logo) borra el archivo del servidor y vacia la clave en core_settings. La pantalla vuelve al estado "Sin logo" y los renderizados (login, header, favicon) caen al fallback de texto/Phoenix automaticamente en la siguiente recarga.
Permisos y auditoria
El recurso sistema.settings tiene las cinco acciones globales (ver, crear, editar, borrar, exportar). Para acceder a esta pantalla y modificar branding, el rol debe tener sistema.settings.ver + sistema.settings.editar. El super_admin (ambito SISTEMA) opera por encima de los permisos.
Cada cambio queda registrado en el log de auditoria (/admin/auditoria) con el evento sistema.settings.editar y el detalle (slot, MIME, bytes, clave modificada).
Seguridad del SVG
Los SVG son XML y pueden contener codigo malicioso (scripts, event handlers, referencias externas, XXE). El backend los sanitiza antes de guardarlos: elimina <script>, <foreignObject>, <iframe>, atributos onclick/onload/..., hrefs externos y DOCTYPE/ENTITY. Solo se conserva la geometria pura del logo (path, circle, rect, fill, stroke, etc.).
Donde se almacena
Las rutas se guardan en core_settings con las claves branding.logo_login, branding.logo_header y branding.favicon. Los archivos viven en public_html/uploads/branding/ con nombres deterministas (logo-login.png, logo-header.png, favicon.png) y cache-busting por mtime en la URL para forzar refresco tras cada cambio.