add new event and attendance table with automatic now timestamp

src/vueLib/tables/attendees/AttendeesTable.ts

@@ -0,0 +1,77 @@
+import { appApi } from 'src/boot/axios';
+import { ref, computed } from 'vue';
+import type { Attendees } from 'src/vueLib/models/attendee';
+import { useNotify } from 'src/vueLib/general/useNotify';
+import { i18n } from 'boot/lang';
+import type { Events } from 'src/vueLib/models/event';
+
+export function useAttendeesTable() {
+  const attendees = ref<Attendees>([]);
+
+  const pagination = ref({
+    sortBy: 'firstName',
+    descending: false,
+    page: 1,
+    rowsPerPage: 20,
+  });
+
+  const columns = computed(() => [
+    {
+      name: 'firstName',
+      align: 'left' as const,
+      label: i18n.global.t('prename'),
+      field: 'firstName',
+      sortable: true,
+    },
+    {
+      name: 'lastName',
+      align: 'left' as const,
+      label: i18n.global.t('lastName'),
+      field: 'lastName',
+      sortable: true,
+    },
+    { name: 'option', align: 'center' as const, label: '', field: 'option', icon: 'option' },
+  ]);
+
+  const { NotifyResponse } = useNotify();
+
+  const loading = ref(false);
+
+  //updates Attendees list from database
+  async function updateAttendees() {
+    loading.value = true;
+
+    let events: Events | undefined;
+
+    await appApi
+      .get('events')
+      .then((resp) => {
+        if (resp.data === null) {
+          attendees.value = [];
+          return;
+        }
+        events = resp.data as Events;
+      })
+
+      .catch((err) => {
+        NotifyResponse(err, 'error');
+      })
+      .finally(() => {
+        loading.value = false;
+      });
+
+    if (!events || events.length === 0 || !events[0]?.attendees || events[0].attendees === null) {
+      attendees.value = [];
+      return;
+    }
+    attendees.value = events[0].attendees ?? [];
+  }
+
+  return {
+    attendees,
+    pagination,
+    columns,
+    loading,
+    updateAttendees,
+  };
+}