[React]Exportar a Excel

[React]exportToExcel.txt

Para exportar a excel:

//Esta es la funcion para el boton exportar.
onClickExport(){
    //console.log("asd export");
    var data = this.state.interruptions;

    var exportResults = [];
    for (var i = 0; i < data.length; i++) {
      exportResults.push(translator(data[i]));
    }
    console.log(exportResults);
    var d = new Date();
    d = d.getDate() + "/" + (d.getMonth() +1) + "/" + d.getFullYear()+ ', '+d.getHours()+':'+d.getMinutes()+':'+d.getSeconds();

    exportToExcel(exportResults, "Interrupciones " + d , true);
  }
  
  //La función que exporta realmente:
  function exportToExcel(JSONData, ReportTitle, ShowLabel) {
    //If JSONData is not an object then JSON.parse will parse the JSON string in an Object
    var arrData = typeof JSONData != 'object' ? JSON.parse(JSONData) : JSONData;

    var CSV = '';
    //Set Report title in first row or line

    CSV += ReportTitle + '\r\n\n';

    //This condition will generate the Label/Header
    if (ShowLabel) {
        var row = "";

        //This loop will extract the label from 1st index of on array
        for (var index in arrData[0]) {

            //Now convert each value to string and comma-seprated
            row += index + ',';
        }

        row = row.slice(0, -1);

        //append Label row with line break
        CSV += row + '\r\n';
    }

    //1st loop is to extract each row
    for (var i = 0; i < arrData.length; i++) {
        var row = "";

        //2nd loop will extract each column and convert it in string comma-seprated
        for (var index in arrData[i]) {
            row += '"' + arrData[i][index] + '",';
        }

        row.slice(0, row.length - 1);

        //add a line break after each row
        CSV += row + '\r\n';
    }

    if (CSV == '') {
        alert("No hay datos para exportar");
        return;
    }

    //Generate a file name
    var fileName = "Reporte_";
    //this will remove the blank-spaces from the title and replace it with an underscore
    fileName += ReportTitle.replace(/ /g,"_");

    //Initialize file format you want csv or xls
    var uri = 'data:text/csv;charset=utf-8,' + escape(CSV);

    // Now the little tricky part.
    // you can use either>> window.open(uri);
    // but this will not work in some browsers
    // or you will not get the correct file extension

    //this trick will generate a temp <a /> tag
    var link = document.createElement("a");
    link.href = uri;

    //set the visibility hidden so it will not effect on your web-layout
    link.style = "visibility:hidden";
    link.download = fileName + ".csv";

    //this part will append the anchor tag and remove it after automatic click
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
}


export default exportToExcel;

Hola que tal ? Soy algo nuevo en react. Por casualidad conoces alguna herramienta para generar reportes en Reactjs ? que genere Excel y Pdf y ademas pueda hacer mis reportes en modo de diseño y llamarlos desde la aplicacion ? Si sabes de algo te lo agradezco! Saludos.

No, a menos que lo programes tu mismo. Saludos Enviado desde Correo<https://go.microsoft.com/fwlink/?LinkId=550986> para Windows 10

…

________________________________ De: Robinson Loreto <[email protected]> Enviado: Thursday, April 9, 2020 7:32:43 PM Para: darklilium <[email protected]> Cc: Evelyn Hernández <[email protected]>; Author <[email protected]> Asunto: Re: darklilium/[React]exportToExcel.txt @loretoruiz commented on this gist.

________________________________ Hola que tal ? Soy algo nuevo en react. Por casualidad conoces alguna herramienta para generar reportes en Reactjs ? que genere Excel y Pdf y ademas pueda hacer mis reportes en modo de diseño y llamarlos desde la aplicacion ? Si sabes de algo te lo agradezco! Saludos. — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub<https://gist.github.com/ce75a76beab65155f862#gistcomment-3248114>, or unsubscribe<https://github.com/notifications/unsubscribe-auth/ACA5A66TRIJSVZW6OWMHOULRLZSKXANCNFSM4MFD6IQQ>.

Entiendo. Si porque estoy viendo que tambien puedes generar esos archivos en el Backend (en este caso en Nodejs) pero no se si es buena practica, o es mejor generarlo en el cliente. En mi caso mi idea es traerme unos datos json con axios o request y generar un simple listado de excel. pero las herramientas que he visto no me convencen mucho porq traen un boton de descargar el archivo de una vez. y ejecutan el query o el llamado a la api al cargar la pagina, se relentiza todo .