Added Export Excel function for Stats table.

frontend/package.json

@@ -25,6 +25,7 @@
     "googleapis": "^113.0.0",
     "rxjs": "~7.8.0",
     "tslib": "^2.3.0",
+    "xlsx": "^0.18.5",
     "zone.js": "~0.12.0"
   },
   "devDependencies": {

frontend/src/app/components/stats.component.html

@@ -98,6 +98,10 @@ <h2>Stats</h2>
           </tr>
         </tbody>
       </table>
+      <br>
+      <button mat-raised-button color="basic" (click)="toExcel()">
+        Export Excel
+      </button>
     </div>
   </div>
 </div>

frontend/src/app/components/stats.component.ts

@@ -1,9 +1,10 @@
 import { Component, OnInit } from '@angular/core';
-import { Observable } from 'rxjs';
+import { Observable, map } from 'rxjs';
 import { GoogleData, PlayerSQL, Stats, UserData } from '../models';
 import { StatsService } from '../stats.service';
 import { UserService } from '../user.service';
 import { Router } from '@angular/router';
+import { writeFile } from 'xlsx';
 
 @Component({
   selector: 'app-stats',
@@ -60,4 +61,46 @@ export class StatsComponent implements OnInit {
       }
     );
   }
+
+  toExcel() {
+    if (!this.stats) {
+      console.log('No stats available');
+      return;
+    }
+    // create the excel format
+    const columns = [
+      { header: 'Goals', key: 'goals' },
+      { header: 'Assists', key: 'assists' },
+      { header: 'Yellow Cards', key: 'yellowCards' },
+      { header: 'Red Cards', key: 'redCards' },
+      { header: 'Clean Sheets', key: 'cleanSheets' },
+      { header: 'Conceded Goals', key: 'concededGoals' },
+    ];
+
+    this.stats
+      .pipe(
+        map((stats) =>
+          stats.map((s) => ({
+            goals: s.goals,
+            assists: s.assists,
+            yellowCards: s.yellowCards,
+            redCards: s.redCards,
+            cleanSheets: s.cleanSheets,
+            concededGoals: s.concededGoals,
+          }))
+        )
+      )
+      .subscribe((statsArr) => {
+        console.log('Stats:', statsArr);
+        const excelsheet = { columns, rows: statsArr };
+        const excelbook = {
+          Sheets: { data: excelsheet },
+          SheetNames: ['STATS'],
+        };
+
+        const fileName = 'stats.xlsx';
+        writeFile(excelbook, fileName);
+        console.log('Successfully exported excel file');
+      });
+  }
 }