EVOLUTION-MANAGER

Edit File: editar-noticia.js

var textareaco = document.getElementById("myTextareacont");
var contador = document.getElementById("charcontador");

var contenedor_imagenes = [];
var sorts = [];

const noticias = window.appData.noticias;
const imagenes = window.appData.imagenes;
var noti_datos = [], imagenes_datos = [], img_eliminadas = [], identificador, docu_eliminar = false;

noticias.forEach(item => {
    noti_datos.push(item.id_informativo, item.titulo, item.contenido, item.nombre_archivo);
    identificador = item.id_informativo;
});

imagenes.forEach(item => {
    imagenes_datos.push([item.id_info_imagenes, item.nombre_archivo, item.orden]);
});

var maxLengthcon = 10000;

new Sortable(documentos_cargados_imagenes, {
    handle: '.vista-archivos',
    animation: 150,
    ghostClass: 'background-class',
    store: {
        set: function (sortable) {
            sorts = sortable.toArray();
        }
    }
});

function inicializarQuill(editorId, editorAreaId, contenidoInicial) {
    var editor = new Quill(editorId, {
        theme: 'snow'
    });
    var quillEditor = document.getElementById(editorAreaId);

editor.on('text-change', function () {
        quillEditor.value = editor.root.innerHTML;
    });

if (contenidoInicial) {
        // console.log(`Contenido inicial para ${editorId}:`, contenidoInicial);
        editor.clipboard.dangerouslyPasteHTML(contenidoInicial);
        //editor.root.innerHTML = contenidoInicial;
    } else {
        console.log(`Contenido inicial para ${editorId} está vacío o indefinido.`);
    }

quillEditor.addEventListener('input', function () {
        editor.root.innerHTML = quillEditor.value;
    });
}

if (document.getElementById('quill-editor-area')) {
    inicializarQuill('#quill-editor', 'quill-editor-area', noti_datos[1]);
}

if (document.getElementById('quill-editor-area-contenido')) {
    inicializarQuill('#quill-editor-contenido', 'quill-editor-area-contenido', noti_datos[2]);
}

function limitarCaracteres() {
    var campo = document.getElementById("editor");
    var contador = document.getElementById("charCount");
    var maxCaracteres = 250; // Cambia este valor al máximo de caracteres permitidos

var texto = campo.textContent;

if (texto.length > maxCaracteres) {
        //campo.textContent = texto.substring(0, maxCaracteres);
        //texto = campo.textContent; // Actualizar texto después de truncarlo

}

contador.textContent = + (maxCaracteres - texto.length);
    console.log(texto.length);
}

var input = document.getElementById("cargar");
var show_archivos = document.getElementById("documentos-cargados");

input.addEventListener("change", (e) => {

const fileshow = (filename, filetype) => {

let container = document.createElement('div');
        container.className = 'mostrar-archivos';

let leftdiv = document.createElement('div');
        leftdiv.className = 'left';

let filespan = document.createElement('span');
        filespan.className = 'tipo-archivo';
        filespan.textContent = filetype;

let fileh3 = document.createElement('h3');
        fileh3.textContent = filename;

leftdiv.appendChild(filespan);
        leftdiv.appendChild(fileh3);

let rightdiv = document.createElement('div');
        rightdiv.className = 'right';
        rightdiv.id = 'borrar';

let filespan2 = document.createElement('span');
        filespan2.innerHTML = '&#215;';

rightdiv.appendChild(filespan2);
        container.appendChild(leftdiv);
        container.appendChild(rightdiv);

show_archivos.innerHTML = '';
        show_archivos.appendChild(container);

docu_eliminar = false;

// var borrar = document.getElementById("borrar")
        // borrar.addEventListener("click", () => {
        //     show_archivos.innerHTML = `<h3 class="subidos-exito">Documentos subidos</h3>`;
        //     e.target.value = "";
        //     docu_eliminar = true;
        // });

}

if (e.target.files[0]) {
        let filename = e.target.files[0].name;
        let filetype = e.target.value.split(".").pop();
        //
        const file = input.files[0];
        const reader = new FileReader();
        reader.readAsArrayBuffer(file);
        var porcentaje;

const progressBar = document.getElementById('progressBar');
        progressBar.classList.add('progressBarshow');

reader.onprogress = (e) => {
            porcentaje = Math.round((e.loaded / e.total) * 100);
            progressBar.style.width = porcentaje + '%';
            progressBar.innerHTML = porcentaje + "%"
        }

reader.onload = (e) => {
            progressBar.classList.remove('progressBarshow');
            progressBar.style.width = '0%';
            fileshow(filename, filetype);
        }
    } else {
        show_archivos.innerHTML = `<h3 class="subidos-exito">Documentos subidos</h3>`;
        input.value = "";
    }
});

var borrar = document.getElementById("borrar")
borrar.addEventListener("click", () => {
    show_archivos.innerHTML = `<h3 class="subidos-exito">Documentos subidos</h3>`;
    document.getElementById("cargar").value = "";
    docu_eliminar = true;
});

const input_imagenes = document.getElementById("cargar-imagenes");
const show_archivos_imagenes = document.getElementById("documentos_cargados_imagenes");

input_imagenes.addEventListener("change", (e) => {
    if (e.target.files[0]) {
        let filename = e.target.files[0].name;
        let filetype = e.target.value.split(".").pop();

if (contenedor_imagenes.length > 0) {
            if (comprobar_imagenes(filename)) {
                mensaje_de_alerta("error", "Ya existe una imagen con el mismo nombre");
            } else {
                if (contenedor_imagenes.length == 10) {
                    input_imagenes.value = "";
                    mensaje_de_alerta("error", "Solo puede subir un máximo de 10 imagenes");
                } else {
                    contenedor_imagenes.push(e.target.files[0]);

const file = input_imagenes.files[0];
                    const reader = new FileReader();
                    reader.readAsArrayBuffer(file);
                    var porcentaje;

const progressBar = document.getElementById('progressBar-imagenes');
                    progressBar.classList.add('progressBarshow');

reader.onprogress = (e) => {
                        porcentaje = Math.round((e.loaded / e.total) * 100);
                        progressBar.style.width = porcentaje + '%';
                        progressBar.innerHTML = porcentaje + "%"
                    }

reader.onload = (e) => {
                        progressBar.classList.remove('progressBarshow');
                        progressBar.style.width = '0%';
                        fileshow_imagenes(filename, filetype);
                    }
                }
            }
        } else {
            contenedor_imagenes.push(e.target.files[0]);

const file = input_imagenes.files[0];
            const reader = new FileReader();
            reader.readAsArrayBuffer(file);
            var porcentaje;

const progressBar = document.getElementById('progressBar-imagenes');
            progressBar.classList.add('progressBarshow');

reader.onprogress = (e) => {
                porcentaje = Math.round((e.loaded / e.total) * 100);
                progressBar.style.width = porcentaje + '%';
                progressBar.innerHTML = porcentaje + "%"
            }

reader.onload = (e) => {
                progressBar.classList.remove('progressBarshow');
                progressBar.style.width = '0%';
                fileshow_imagenes(filename, filetype);
            }
        }
    } else {
        input_imagenes.value = "";
    }
});

function comprobar_imagenes(nombre) {
    for (var z = 0; z < contenedor_imagenes.length; z++) {
        if (contenedor_imagenes[z].name == nombre)
            return true;
    }
    return false;
}

const fileshow_imagenes = (filename, filetype) => {
    const show = document.createElement("div");
    show.classList.add("mostrar-archivos");
    show.id = filename;
    show.setAttribute('data-id', filename);

const left = document.createElement("div");
    left.classList.add("left");

const span = document.createElement("span");
    span.classList.add("tipo-archivo");
    span.innerHTML = filetype;
    left.append(span);

const titulo = document.createElement("h3");
    titulo.innerHTML = filename;
    left.append(titulo);
    show.append(left);

const right = document.createElement("div");
    right.setAttribute('onclick', 'borrar_archivo("' + filename + '")');
    right.classList.add("right");
    show.append(right);

const equis = document.createElement("span");
    equis.innerHTML = "&#215;";
    right.append(equis);

show_archivos_imagenes.append(show);
}

document.getElementById("crear-noticia").addEventListener("submit", (event) => {
    event.preventDefault();

var titulo = document.getElementById("quill-editor-area").value;
    var contenido = document.getElementById("quill-editor-area-contenido").value;
    var fecha = document.getElementById("fecha-noticia").value;
    if (fecha != "") {
        var fecha_separada = new Date(fecha);
        var anio = fecha_separada.getFullYear();
        var mes = new Intl.DateTimeFormat('es-ES', { month: 'long' }).format(fecha_separada);
    }
    var archivo = $('#cargar')[0].files[0];

if (titulo.length < 1 || contenido.length < 1 || fecha == "" || anio == "" || mes == "" || docu_eliminar) {
        mensaje_de_alerta("error", "Complete todos los campos");
    } else {

const loadingModal = document.getElementById('loadingModal');
        loadingModal.style.display = 'block';

var contenedorPadre = document.getElementById('documentos_cargados_imagenes');
        var hijos = contenedorPadre.getElementsByClassName('mostrar-archivos');

$.ajaxSetup({
            headers: {
                "X-CSRF-TOKEN": $('meta[name="csrf-token"]').attr('content')
            }
        });

var formData = new FormData();
        formData.append('_method', 'PUT');
        formData.append('titulo', titulo);
        formData.append('contenido', contenido);
        formData.append('fecha', fecha);
        formData.append('anio', anio);
        formData.append('mes', mes);
        if (archivo)
            formData.append('documento', archivo);

for (var x = 0; x < contenedor_imagenes.length; x++) {
            formData.append('imagenes[]', contenedor_imagenes[x]);
            if (sorts.length > 1){
                for (var i = 0; i < sorts.length; i++){
                    if (sorts[i] == contenedor_imagenes[x].name){
                        formData.append('orden[]', i);
                        break;
                    }
                }
            }else{
                for (var i = 0; i < hijos.length; i++) {
                    if (contenedor_imagenes[x].name == hijos[i].id) {
                        formData.append('orden[]', 1 + i);
                        break;
                    }
                }
            }
        }

if (img_eliminadas.length){
            for (var x = 0; x < img_eliminadas.length; x++){
                formData.append('eliminar_img[]', img_eliminadas[x][0]);
            }
        }

for (var i = 0; i < hijos.length; i++) {
            for (var x = 0; x < imagenes_datos.length; x++) {
                if (imagenes_datos[x][1] == hijos[i].id) {
                    formData.append('imagen_nuevoorden[]', imagenes_datos[x][0]);
                    formData.append('orden_total[]', 1 + i);
                    break;
                }
            }
        }

$.ajax({
            url: "/administrador/crud-boletin/editar-noticia/"+ identificador,
            method: "POST",
            enctype: "multipart/form-data",
            data: formData,
            processData: false,
            contentType: false,
            success: function (response) {
                if (response.success) {
                    loadingModal.style.display = 'none';
                    mensaje_de_alerta("success", response.message);
                    setTimeout('document.location.reload()',1000);
                } else {
                    loadingModal.style.display = 'none';
                    resetearMensajesError();
                    var errortitulo = "", errorcontenido = "", errorfecha = "", erroranio = "", errormes = "", errordocumento = "", errorimagen = "", errororden = "";
                    if (response.error_validacion) {
                        mensaje_de_alerta("error", "Error de Validación");
                        $.each(response.error_validacion, function (key, value) {
                            if (value[0].includes("titulo"))
                                errortitulo += '<p class="alert alert-danger">' + value[0] + '</p>';
                            if (value[0].includes("contenido"))
                                errorcontenido += '<p class="alert alert-danger">' + value[0] + '</p>';
                            if (value[0].includes("fecha"))
                                errorfecha += '<p class="alert alert-danger">' + value[0] + '</p>';
                            if (value[0].includes("anio"))
                                erroranio += '<p class="alert alert-danger">' + value[0] + '</p>';
                            if (value[0].includes("mes"))
                                errormes += '<p class="alert alert-danger">' + value[0] + '</p>';
                            if (value[0].includes("documento"))
                                errordocumento += '<p class="alert alert-danger">' + value[0] + '</p>';
                            if (value[0].includes("imagenes"))
                                errorimagen += '<p class="alert alert-danger">' + value[0] + '</p>';
                            if (value[0].includes("orden"))
                                errororden += '<p class="alert alert-danger">' + value[0] + '</p>';
                        });
                        if (errortitulo != "")
                            document.getElementById("error-validacion-titulo").innerHTML = errortitulo;
                        if (errorcontenido != "")
                            document.getElementById("error-validacion-contenido").innerHTML = errorcontenido;
                        if (errorfecha != "")
                            document.getElementById("error-validacion-fecha").innerHTML = errorfecha;
                        if (errordocumento != "")
                            document.getElementById("error-validacion-documento").innerHTML = errordocumento;
                        if (errorimagen != "")
                            document.getElementById("error-validacion-imagenes").innerHTML = errorimagen;
                        mensaje_de_alerta("error", "Error de validación, verifique la información que se esta enviando");
                    }
                    if (response.error) {
                        mensaje_de_alerta("error", response.error);
                        console.log(response.error);
                    }
                }
            },
            error: function (xhr) {
                loadingModal.style.display = 'none';
                var message = JSON.parse(xhr.responseText);
                console.log(message.message);
                mensaje_de_alerta("error", message.message);
            }
        });
    }
});

function resetearMensajesError() {
    document.getElementById("error-validacion-titulo").innerHTML = "";
    document.getElementById("error-validacion-contenido").innerHTML = "";
    document.getElementById("error-validacion-fecha").innerHTML = "";
    document.getElementById("error-validacion-documento").innerHTML = "";
    document.getElementById("error-validacion-imagenes").innerHTML = "";
}

function mensaje_de_alerta(icon, title) {
    Swal.fire({
        icon: icon,
        title: title,
        showConfirmButton: true,
    });
}