add quarter to table and quarter filter

HKN-UCSD · May 25, 2024 · 4465913 · 4465913
1 parent 933bec1
commit 4465913
Showing 1 changed file with 26 additions and 2 deletions.
diff --git a/frontend/src/Pages/Outreach.svelte b/frontend/src/Pages/Outreach.svelte
@@ -42,7 +42,8 @@
         {"value": 'email', "title": "Email"},
         {"value": 'hours', "title": "Hours"},
         {"value": 'car', "title": 'Car'},
-        {"value": 'outreach_course', "title": "Class"}
+        {"value": 'outreach_course', "title": "Class"},
+        {"value": 'quarter', "title": "Quarter"}
     ]
 
 
@@ -57,6 +58,7 @@
         'Yes',
         'No'
     ]
+    let quarters = []
 
 
     const sortBy = (header) => {
@@ -95,6 +97,7 @@
 
     let class_option;
     let car_option;
+    let quarter_option;
 
     let csv_data;
     let outreachDataPerPage;
@@ -149,16 +152,24 @@
         filteredData = outreachData.filter((outreachStudent) => {
             return (class_option == "all" || outreachStudent.outreach_course == class_option)
                 && (car_option == "all" || outreachStudent.car == car_option)
+                && (quarter_option == "all" || outreachStudent.quarter == quarter_option)
                 && ((outreachStudent.preferred_name.toLowerCase() + " " + outreachStudent.last_name.toLowerCase()).includes(searchText.toLowerCase())
                     || outreachStudent.email.toLowerCase().includes(searchText.toLowerCase()));
         })
 
     }
     onMount(async () => {
         outreachData = await getOutreach();
+
+        quarters = outreachData.map((outreachStudent) => {
+            return outreachStudent.quarter;
+        })
+        quarters = [...new Set(quarters)];
+
+
     })
     $: {
-        car_option, class_option, searchText;
+        car_option, class_option, searchText, quarter_option;
         if (outreachData) filter();
         }
 </script>
@@ -193,6 +204,17 @@
                             </form>
                         </div>
 
+                        <div>
+                            <form>
+                                <select bind:value={quarter_option} name="quarters">
+                                    <option value="all">Filter by Quarter</option>
+                                    {#each quarters as quarter}
+                                        <option value={quarter}>{quarter}</option>
+                                    {/each}
+                                </select>
+                            </form>
+                        </div>
+
 
 
                         <SearchBar bind:searchText />
@@ -242,6 +264,8 @@
                                     <td style="text-align: center">
                                         {outreachStudent.outreach_course}
                                     </td>
+                                    <td style="text-align: center">
+                                        {outreachStudent.quarter}
                                 </tr>
                             {/if}
                         {/each}