add new group table and filter for member table

src/vueLib/tables/members/MembersTable.ts

@@ -5,10 +5,19 @@ import { useNotify } from 'src/vueLib/general/useNotify';
 import { i18n } from 'boot/lang';
 import { useResponsibleTable } from '../responsible/ResponsibleTable';
 import { appName } from 'src/vueLib/models/settings';
+import { useGroupTable } from '../group/GroupTable';
 
 export function useMemberTable() {
-  const members = ref<Members>([]);
+  const allMembers = ref<Members>([]);
+  const filteredMembers = ref<Members>([]);
+  const filterList = ref<
+    {
+      field: keyof Member;
+      keys: string[];
+    }[]
+  >();
   const { responsibles, updateResponsibles } = useResponsibleTable();
+  const { groups, updateGroups } = useGroupTable();
 
   const pagination = ref({
     sortBy: 'firstName',
@@ -202,20 +211,20 @@ export function useMemberTable() {
     loading.value = true;
 
     await updateResponsibles().catch((err) => NotifyResponse(err, 'error'));
-
-    appApi
+    await updateGroups().catch((err) => NotifyResponse(err, 'error'));
+    await appApi
       .get('members')
       .then((resp) => {
         if (resp.data === null) {
-          members.value = [];
+          allMembers.value = [];
           return;
         }
-        members.value = resp.data as Members;
-        if (members.value === null) {
-          members.value = [];
+        allMembers.value = resp.data as Members;
+        if (allMembers.value === null) {
+          allMembers.value = [];
           return;
         }
-        members.value.forEach((member) => {
+        allMembers.value.forEach((member) => {
           if (!responsibles.value.some((r) => r.id === member.responsiblePerson?.id)) {
             delete member.responsiblePerson;
           }
@@ -233,7 +242,7 @@ export function useMemberTable() {
         loading.value = false;
         //filter same members out so list is shorter
         if (filter) {
-          members.value = members.value.filter(
+          filteredMembers.value = allMembers.value.filter(
             (m1) =>
               !filter.some((m2) => {
                 if (filterbyName) {
@@ -243,9 +252,45 @@ export function useMemberTable() {
               }),
           );
         }
+
+        //second filter
+        const list = filterList.value ?? [];
+        if (filterList.value && filterList.value.length > 0) {
+          filteredMembers.value = allMembers.value.filter((member) =>
+            list.every((filterItem) => {
+              const keys = filterItem.keys ?? [];
+              if (keys.includes('null')) return true;
+              if (keys.length === 0) return true;
+
+              const value = member[filterItem.field];
+
+              if (value === undefined || value === null) {
+                return keys.includes('None');
+              }
+              if (typeof value === 'number') {
+                return keys.includes(value.toString());
+              }
+              if (typeof value === 'string') {
+                return keys.includes(value);
+              }
+              return false;
+            }),
+          );
+          return;
+        }
+        filteredMembers.value = allMembers.value;
       });
   }
 
+  function setNewFilter(field: string, ...keys: string[]) {
+    filterList.value = [
+      {
+        field: field as keyof Member,
+        keys: keys.flat().map((k) => String(k)),
+      },
+    ];
+  }
+
   function disableColumns(...columns: string[]) {
     columns.forEach((col) => {
       if (col in enabledColumns.value) {
@@ -265,7 +310,7 @@ export function useMemberTable() {
     const header = exportableColumns.map((col) => col.field).join(comma);
 
     // Build CSV rows
-    const data = members.value.map((member) =>
+    const data = allMembers.value.map((member) =>
       exportableColumns
         .map((col) => {
           const value = member[col.field];
@@ -296,13 +341,16 @@ export function useMemberTable() {
   }
 
   return {
-    members,
+    allMembers,
+    filteredMembers,
     responsibles,
+    groups,
     pagination,
     columns,
     loading,
     getRowClass,
     updateMembers,
+    setNewFilter,
     isXDaysBeforeAnnualDate,
     disableColumns,
     exportCsv,