Labs download button to get CSV output of assignments

3 files changed, 25 insertions, 8 deletions

diff --git a/src/components/FileUploads.svelte b/src/components/FileUploads.svelte
index a6b4b4d..14b0be3 100644
--- a/src/components/FileUploads.svelte
+++ b/src/components/FileUploads.svelte
@@ -14,8 +14,8 @@
   let ptSchedules: FileList | null;
   let labSchedule: FileList | null;
   let dbFile: FileList | null;
-  let snackbar : Snackbar;
-  let snackbarText : Snackbar;
+  let snackbar: Snackbar;
+  let snackbarText;
 
   $: {
     if (ptSchedules?.length) {
diff --git a/src/components/Labs.svelte b/src/components/Labs.svelte
index 465b87a..9f6e781 100644
--- a/src/components/Labs.svelte
+++ b/src/components/Labs.svelte
@@ -2,7 +2,6 @@
   import { labStore, ptStore } from "../stores";
   import type Lab from "../models/Lab";
   import Icon from "./helpers/Icon.svelte";
-  var csvwriter = require("csvwriter");
 
   let selected_lab: Lab | undefined;
 
@@ -26,8 +25,26 @@
 
   function download() {
     // prepare data in CSV format
-    let data: [""];
-    
+    let cols = headers.slice(1, -1);
+    let csv = cols.join(",") + "\n";
+    labsAndPts.forEach((row) => {
+      let l = row.lab;
+      csv += `${l.course},${l.section},${l.time},${l.location},${
+        row.pt?.name ?? "UNASSIGNED"
+      }\n`;
+    });
+    console.log(csv);
+
+    const blob = new Blob([csv], { type: "text/csv" });
+    const anchor = document.createElement("a");
+    const url = window.URL.createObjectURL(blob);
+    anchor.href = url;
+    anchor.download = "lab-assignments.csv";
+    anchor.style.display = "none";
+    document.body.appendChild(anchor);
+    anchor.click();
+    document.body.removeChild(anchor);
+    window.URL.revokeObjectURL(url);
   }
 </script>
 
@@ -40,8 +57,8 @@
           {#if i == 0}
             <th>
               {labs.length}
-              <Icon name="info" class="h-4 w-4" handleClick={download} /></th
-            >
+              <Icon name="download" class="h-4 w-4" handleClick={download} />
+            </th>
           {:else}
             <th>{header}</th>
           {/if}
diff --git a/src/components/helpers/Icon.svelte b/src/components/helpers/Icon.svelte
index 5224421..42e6151 100644
--- a/src/components/helpers/Icon.svelte
+++ b/src/components/helpers/Icon.svelte
@@ -25,7 +25,7 @@
     {
       name: "download",
       box: 24,
-      path: `<path stroke-linecap="round" stroke-linejoin="round" d="M12 10v6m0 0l-3-3m3 3l3-3M3 17V7a2 2 0 012-2h6l2 2h6a2 2 0 012 2v8a2 2 0 01-2 2H5a2 2 0 01-2-2z" `,
+      path: `<path stroke-linecap="round" stroke-linejoin="round" d="M7 16a4 4 0 01-.88-7.903A5 5 0 1115.9 6L16 6a5 5 0 011 9.9M9 19l3 3m0 0l3-3m-3 3V10" />`,
     },
   ];
   let displayIcon = icons.find((e) => e.name === name);