ByteCenter/public/js/configuracion/configuracionValidator.js

document.addEventListener("DOMContentLoaded", () => {

    if (serverErrors.length > 0) mostrarErrores(serverErrors);
    if (serverSuccess.length > 0) mostrarSuccess(serverSuccess);

    const form = document.getElementById("form-config-empresa");
    if (!form) return;

    // Funciones utilitarias

    function isEmpty(value) {
        return !value || value.trim() === '';
    }

    function isValidNombre(value) {
        return /^[A-Za-zÁÉÍÓÚáéíóú0-9\s.\-]{2,100}$/.test(value);
    }

    function isValidTexto(value) {
        return /^[A-Za-zÁÉÍÓÚáéíóúñÑ\s]{2,100}$/.test(value);
    }

    function isValidEmail(value) {
        return /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(value);
    }

    function isValidTelefono(value) {
        return /^[0-9]{10}$/.test(value);
    }

    function isValidCP(value) {
        return /^[0-9]{4}$/.test(value);
    }

    function isValidCuit(value) {
        return /^\d{10,11}$/.test(value);
    }

    // Submit

    form.addEventListener("submit", (e) => {

        let errores = [];

        const nombre = form.querySelector("input[name='nombre']");
        const direccion = form.querySelector("input[name='direccion']");
        const ciudad = form.querySelector("input[name='ciudad']");
        const codigo_postal = form.querySelector("input[name='codigo_postal']");
        const provincia = form.querySelector("input[name='provincia']");
        const telefono = form.querySelector("input[name='telefono']");
        const email = form.querySelector("input[name='email']");
        const cuit = form.querySelector("input[name='cuit']");
        const iva = form.querySelector("input[name='iva']");
        const cargo = form.querySelector("input[name='cargo_cancelacion_servicio']");
        const email_emisor = form.querySelector("input[name='email_emisor']");

        const apM = form.querySelector("input[name='hora_apertura_maniana']");
        const ciM = form.querySelector("input[name='hora_cierre_maniana']");
        const apT = form.querySelector("input[name='hora_apertura_tarde']");
        const ciT = form.querySelector("input[name='hora_cierre_tarde']");

        // Limpiar estados previos

        form.querySelectorAll(".is-invalid").forEach(el =>
            el.classList.remove("is-invalid")
        );

        // NOMBRE

        if (nombre) {
            if (isEmpty(nombre.value)) {
                errores.push("El nombre es obligatorio.");
                nombre.classList.add("is-invalid");
            } else if (!isValidNombre(nombre.value)) {
                errores.push("El nombre contiene caracteres inválidos.");
                nombre.classList.add("is-invalid");
            } else if (nombre.value.length < 2) {
                errores.push("El nombre debe tener al menos 2 caracteres.");
                nombre.classList.add("is-invalid");
            } else if (nombre.value.length > 50) {
                errores.push("El nombre no puede superar los 50 caracteres.");
                nombre.classList.add("is-invalid");
            }
        }

        // DIRECCIÓN

        if (direccion) {
            if (isEmpty(direccion.value)) {
                errores.push("La dirección es obligatoria.");
                direccion.classList.add("is-invalid");
            } else if (direccion.value.length < 3) {
                errores.push("La dirección debe tener al menos 3 caracteres.");
                direccion.classList.add("is-invalid");
            } else if (direccion.value.length > 100) {
                errores.push("La dirección no puede superar los 100 caracteres.");
                direccion.classList.add("is-invalid");
            }
        }

        // CIUDAD

        if (ciudad) {
            if (isEmpty(ciudad.value)) {
                errores.push("La ciudad es obligatoria.");
                ciudad.classList.add("is-invalid");
            } else if (!isValidTexto(ciudad.value)) {
                errores.push("La ciudad solo puede contener letras y espacios.");
                ciudad.classList.add("is-invalid");
            }
        }

        // CÓDIGO POSTAL

        if (codigo_postal) {
            if (isEmpty(codigo_postal.value)) {
                errores.push("El código postal es obligatorio.");
                codigo_postal.classList.add("is-invalid");
            } else if (!isValidCP(codigo_postal.value)) {
                errores.push("El código postal debe tener 4 dígitos.");
                codigo_postal.classList.add("is-invalid");
            }
        }

        // PROVINCIA

        if (provincia) {
            if (isEmpty(provincia.value)) {
                errores.push("La provincia es obligatoria.");
                provincia.classList.add("is-invalid");
            } else if (!isValidTexto(provincia.value)) {
                errores.push("La provincia contiene caracteres inválidos.");
                provincia.classList.add("is-invalid");
            }
        }

        // TELÉFONO

        if (telefono) {
            if (isEmpty(telefono.value)) {
                errores.push("El teléfono es obligatorio.");
                telefono.classList.add("is-invalid");
            } else if (!isValidTelefono(telefono.value)) {
                errores.push("El teléfono debe tener 10 dígitos.");
                telefono.classList.add("is-invalid");
            }
        }

        // EMAIL

        if (email) {
            if (isEmpty(email.value)) {
                errores.push("El email es obligatorio.");
                email.classList.add("is-invalid");
            } else if (!isValidEmail(email.value)) {
                errores.push("El email no tiene un formato válido.");
                email.classList.add("is-invalid");
            } else if (email.value.length > 100) {
                errores.push("El email no puede superar los 100 caracteres.");
                email.classList.add("is-invalid");
            }
        }

        // CUIT

        if (cuit) {
            if (!isValidCuit(cuit.value)) {
                errores.push("CUIT inválido.");
                cuit.classList.add("is-invalid");
            }
        }

        // IVA

        if (iva) {
            if (iva.value && isNaN(iva.value)) {
                errores.push("El IVA debe ser numérico.");
                iva.classList.add("is-invalid");
            }
        }

        // CARGO CANCELACIÓN

        if (cargo) {
            if (cargo.value && isNaN(cargo.value)) {
                errores.push("El cargo por cancelación debe ser numérico.");
                cargo.classList.add("is-invalid");
            }
        }

        // EMAIL EMISOR

        if (email_emisor) {
            if (isEmpty(email_emisor.value)) {
                errores.push("El email emisor es obligatorio.");
                email_emisor.classList.add("is-invalid");
            } else if (!isValidEmail(email_emisor.value)) {
                errores.push("El email emisor no tiene un formato válido.");
                email_emisor.classList.add("is-invalid");
            } else if (email_emisor.value.length > 100) {
                errores.push("El email emisor no puede superar los 100 caracteres.");
                email_emisor.classList.add("is-invalid");
            }
        }

        // HORARIOS

        if (apM && ciM) {
            if (apM.value && ciM.value && apM.value >= ciM.value) {
                errores.push("El horario de apertura de la mañana debe ser menor al de cierre.");
                apM.classList.add("is-invalid");
                ciM.classList.add("is-invalid");
            }
        }

        if (apT && ciT) {
            if (apT.value && ciT.value && apT.value >= ciT.value) {
                errores.push("El horario de apertura de la tarde debe ser menor al de cierre.");
                apT.classList.add("is-invalid");
                ciT.classList.add("is-invalid");
            }
        }

        // Resultado

        if (errores.length > 0) {
            e.preventDefault();
            mostrarErrores(errores);
        }
    });

    // FUNCIÓN PARA MOSTRAR ERRORES

    function mostrarErrores(errores) {

        // Buscar si hay un toast previo

        const viejo = document.getElementById("toastErrores");

        // Si existe, se elimina (evita duplicados)

        if (viejo) viejo.remove();

        // Crea el contenedor del toast

        const toast = document.createElement("div");

        // Se le asigna ID para identificarlo

        toast.id = "toastErrores";

        // Clases de estilo (Bootstrap + CSS)

        toast.className = "toast-flotante alert alert-danger";

        // Inserta el contenido dinámico (lista de errores)

        toast.innerHTML = `
            <strong>Se encontraron errores:</strong>
            <ul class="mb-0 mt-2">
                ${errores.map(e => `<li>${e}</li>`).join("")} <!-- convierte array a <li> -->
            </ul>
        `;

        // Agrega el toast al body (lo hace visible)

        document.body.appendChild(toast);

        // Auto-cierre
        
        setTimeout(() => {

            // Agrega clase para animación de salida (CSS)

            toast.classList.add("toast-out");

            // Elimina el elemento después de la animación

            setTimeout(() => {
                toast.remove(); // Elimina el DOM
            }, 350);

        }, 5000); // Visible durante 5 segundos
    }
    });

    // FUNCIÓN PARA MOSTRAR SUCCESS

    function mostrarSuccess(mensajes) {

        // Elimina toast previo de éxito si existe

        const viejo = document.getElementById("toastSuccess");
        if (viejo) viejo.remove();

        // Crea el contenedor del toast

        const toast = document.createElement("div");

        // Se le asigna ID único

        toast.id = "toastSuccess";

        // Estilo

        toast.className = "toast-flotante alert alert-success";

        // Inserta mensajes dinámicos

        toast.innerHTML = `
            <strong>Mensajes de éxito:</strong>
            <ul class="mb-0 mt-2">
                ${mensajes.map(m => `<li>${m}</li>`).join("")}
            </ul>
        `;

        // Agrega al DOM

        document.body.appendChild(toast);

        // Auto-cierre a los 5 segundos

        setTimeout(() => {

            // Animación de salida

            toast.classList.add("toast-out");

            // Eliminación final

            setTimeout(() => {
                toast.remove();
            }, 350);

        }, 5000);
    }