Export to XLS table reports

src/app/reports/run-report/table-and-sms/table-and-sms.component.html

@@ -2,15 +2,19 @@
 
   <div *ngIf="!hideOutput && !toBeExportedToRepo">
 
-    <div class="m-b-10" *ngIf="dataObject.report.type === 'Table'" fxLayoutAlign="end">
+    <div class="m-b-10" *ngIf="dataObject.report.type === 'Table'" fxLayoutGap="25px" fxLayoutAlign="end">
       <button mat-raised-button color="primary" (click)="exportFile()" [disabled]="notExistsReportData"
         matToolTip="{{'labels.text.Export the data to CSV file' | translate}}">
         {{'labels.buttons.Export CSV' | translate}}
       </button>
+      <button mat-raised-button color="primary" (click)="exportToXLS()" [disabled]="notExistsReportData"
+        matToolTip="{{'labels.text.Export the data to XLS file' | translate}}">
+        {{'labels.buttons.Export XLS' | translate}}
+      </button>
     </div>
 
     <div class="table-output" [hidden]="notExistsReportData">
-      <table mat-table [dataSource]="dataSource">
+      <table id="report-table" mat-table [dataSource]="dataSource">
         <div *ngFor="let column of displayedColumns index as i">
           <ng-container [matColumnDef]="column">
             <th mat-header-cell *matHeaderCellDef>{{column}}</th>

src/app/reports/run-report/table-and-sms/table-and-sms.component.ts

@@ -2,7 +2,7 @@
 import { Component, Input, ViewChild, OnChanges } from '@angular/core';
 import { MatPaginator } from '@angular/material/paginator';
 import { MatTableDataSource } from '@angular/material/table';
-import { DecimalPipe, NumberSymbol, getLocaleNumberSymbol } from '@angular/common';
+import { DecimalPipe } from '@angular/common';
 
 /** Custom Servies */
 import { ReportsService } from '../../reports.service';
@@ -14,6 +14,8 @@ import { FormDialogComponent } from 'app/shared/form-dialog/form-dialog.componen
 import { environment } from 'environments/environment';
 import { ProgressBarService } from 'app/core/progress-bar/progress-bar.service';
 
+import * as XLSX from 'xlsx';
+
 /**
  * Table and SMS Component
  */
@@ -135,6 +137,21 @@ export class TableAndSmsComponent implements OnChanges {
     });
   }
 
+  exportToXLS(): void {
+    const fileName = `${this.dataObject.report.name}.xlsx`;
+    const data = this.csvData.map((object: any) => {
+      const row = {};
+      for (let i = 0; i < this.displayedColumns.length; i++) {
+        row[this.displayedColumns[i]] = object.row[i];
+      }
+      return row;
+    });
+    const ws: XLSX.WorkSheet = XLSX.utils.json_to_sheet(data, {header: this.displayedColumns});
+    const wb: XLSX.WorkBook = XLSX.utils.book_new();
+    XLSX.utils.book_append_sheet(wb, ws, 'Report');
+    XLSX.writeFile(wb, fileName);
+  }
+
   /**
    * Generates the CSV file dynamically for run report data.
    */