[BI-1369] enable backend sorting for roles column of program users table

Breeding-Insight · Mar 7, 2022 · bbe8355 · bbe8355
1 parent b3cc9a3
commit bbe8355
Show file tree

Hide file tree

Showing 3 changed files with 11 additions and 12 deletions.
diff --git a/src/breeding-insight/service/UserService.ts b/src/breeding-insight/service/UserService.ts
@@ -137,7 +137,6 @@ export class UserService {
 
       UserDAO.getAll(paginationQuery, sort).then((biResponse) => {
 
-        biResponse.result.data = PaginationController.mockSortRecords(biResponse.result.data);
         // Parse our users into the vue users param
         let users = biResponse.result.data.map((user: any) => {
           const role: Role | undefined = this.parseSystemRoles(user.systemRoles);

diff --git a/src/components/program/ProgramUsersTable.vue b/src/components/program/ProgramUsersTable.vue
@@ -131,7 +131,7 @@
       <b-table-column field="data.email" label="Email" sortable v-slot="props" :th-attrs="(column) => ({scope:'col'})">
         {{ props.row.data.email }}
       </b-table-column>
-      <b-table-column :custom-sort="sortRole" label="Role" v-slot="props" :th-attrs="(column) => ({scope:'col'})">
+      <b-table-column field="data.roleName" label="Role" sortable v-slot="props" :th-attrs="(column) => ({scope:'col'})">
         <template v-if="rolesMap.size > 0">
           {{ getRoleName(props.row.data.roleId) }}
         </template>
@@ -263,7 +263,11 @@ export default class ProgramUsersTable extends Vue {
   }
 
   setSort(field: string, order: string) {
-    const fieldMap: any = {'data.email': UserSortField.Email, 'data.name': UserSortField.Name};
+    const fieldMap: any = {
+      'data.email': UserSortField.Email,
+      'data.name': UserSortField.Name,
+      'data.roleName': UserSortField.Roles
+    };
     if (field in fieldMap) {
       this.updateSort(new UserSort(fieldMap[field], Sort.orderAsBI(order)));
       this.getUsers();
@@ -474,14 +478,6 @@ export default class ProgramUsersTable extends Vue {
     return this.rolesMap.get(id)!.name;
   }
 
-  sortRole(a: any, b: any, isAsc: boolean) {
-    if(isAsc) {
-      return this.getRoleName(a.data.roleId)!.localeCompare(this.getRoleName(b.data.roleId)!);
-    } else {
-      return this.getRoleName(b.data.roleId)!.localeCompare(this.getRoleName(a.data.roleId)!);
-    }
-  }
-
 }
 
 </script>
diff --git a/src/store/sorting/getters.ts b/src/store/sorting/getters.ts
@@ -61,7 +61,11 @@ export const getters: GetterTree<SortState, RootState> = {
         return state.programUserSort;
     },
     programUserSortFieldAsBuefy(state: SortState): string {
-        const fieldMap: any = {[UserSortField.Email]: 'data.email', [UserSortField.Name]: 'data.name'};
+        const fieldMap: any = {
+            [UserSortField.Email]: 'data.email',
+            [UserSortField.Name]: 'data.name',
+            [UserSortField.Roles]: 'data.roleName'
+        };
         return fieldMap[state.programUserSort.field];
     },
     programUserSortOrderAsBuefy(state: SortState): string {