aboutsummaryrefslogtreecommitdiff
path: root/src/components/PeerTeachers/PeerTeachers.svelte
blob: 7182f2f9c1cfd9e45bd4d26ae9745a01e49a4c2c (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<script lang="ts">
  import { labStore, ptStore } from "../../stores";
  import type PeerTeacher from "../../models/PeerTeacher";

  let selected_pt: PeerTeacher | undefined;

  $: peerTeachers = [...$ptStore.values()].sort((a, b) =>
    a.lastname.toUpperCase() === b.lastname.toUpperCase()
      ? a.firstname.toUpperCase().localeCompare(b.firstname.toUpperCase())
      : a.lastname.toUpperCase().localeCompare(b.lastname.toUpperCase())
  );

  function deletePT(id: number) {
    // if (selected_pt.id != id) return;
    // Unassign all labs assigned to this Peer Teacher
    $ptStore.get(id)?.labs.forEach((lab_id) => {
      const lab = $labStore?.get(lab_id);
      lab.assigned = false;
    });

    // Yeet the Peer Teacher
    ptStore.update((map) => {
      map.delete(id);
      return map;
    });
  }

  let headers = ["", "First", "Last", "UIN", "Email", "Lab Hours", ""];

  $: console.log(headers);
</script>

<div class="overflow-auto h-full">
  <table class="table w-full">
    <!-- head -->
    <thead>
      <tr>
        {#each headers as header, i}
          <th> {i == 0 ? peerTeachers.length : header}</th>
        {/each}
      </tr>
    </thead>
    <tbody>
      {#each peerTeachers as pt, i}
        <tr
          on:click={() => {
            selected_pt = pt;
          }}
          class={selected_pt == pt ? "active" : "hover"}
        >
          <th>{i + 1}</th>
          <th>{pt.firstname}</th>
          <th>{pt.lastname}</th>
          <th>{pt.id}</th>
          <th>{pt.email}</th>
          <th>
            {pt.lab_hours}
          </th>
          <th
            ><button
              on:click={() => deletePT(pt.id)}
              class="btn btn-ghost btn-xs">Delete</button
            ></th
          >
        </tr>
      {/each}
    </tbody>
  </table>
</div>