Excel export sheet name and second sheet

[Malte]

I use the `kendo-vue-excel-export` in VUE to generate an Excel export.
Now I have two questions:

1. How to change the sheet name?
2. How to create a second sheet with different data?

My method that I use currently looks like this:

    exportExcel () {
      saveExcel({
        data: this.items,
        fileName: "Geräte",
        columns: [
          { field: 'hostname', title: 'Hostname' },
          { field: 'guid', title: 'Guid' },
          { field: 'ipaddress', title: 'IP' },
          { field: 'domain', title: 'Domain' },
          { field: 'osversion', title: 'OS Version' },
          { field: 'ostype', title: 'OS Type' },
          { field: 'videoid', title: 'Grafikkarte' },
          { field: 'diskid', title: 'Festplatte' },
          { field: 'memory', title: 'Arbeitsspeicher' },
          { field: 'cpuid', title: 'CPU' },
          { field: 'username', title: 'Benutzer' },
          { field: 'location', title: 'Lokation' },
          { field: 'office', title: 'Büro' }
        ]
      });
    },

[Petar]

Hi Malte,

Here is a StackBlitz example demonstrating how the targeted functionality can be achieved. 

To set the fileName of the exported file, you can pass the name to the fileName prop in the below method:

exportExcel() {
  this.customSaveExcel({
    data: products,
    fileName: 'myCustomFile',
    columns: this.columns,
  });
}

To add a second sheet you should at first define it. In the linked example the data property sheet2Data holds the new sheet definition. To add the new definition to the exported file, you have to push it in the options of the exported file. Below is how the desired functionality is implemented in the linked above example:

customSaveExcel: function (exportOptions) {
  const saveFn = (dataURL) => {
    saveAs(dataURL, exportOptions.fileName);
  };

  const options = workbookOptions(exportOptions);
  options.sheets.push(this.sheet2Data);
  const rows = options.sheets[0].rows;

  let altIdx = 0;
  rows.forEach((row) => {
    if (row.type === 'data') {
      if (altIdx % 2 !== 0) {
        row.cells.forEach((cell) => {
          cell.background = '#aabbcc';
        });
      }
      altIdx++;
    }
  });
  toDataURL(options).then(saveFn);
}

I hope the provided solution will help you implement what you need in your application.

Regards,
Petar
Progress Telerik