From e99d123156141c595e25c333487fe2bf710f7539 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Tim=20Gr=C3=B6ger?= <tim@groeger-clan.de>
Date: Tue, 8 Oct 2024 14:31:43 +0200
Subject: [PATCH] [feat] sort nam eby displaymode setting

---
 src/components/UserSelector.vue | 31 +++++++++++++++++++------------
 src/index.ts                    |  2 ++
 2 files changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/components/UserSelector.vue b/src/components/UserSelector.vue
index 80649b1..eefedd2 100644
--- a/src/components/UserSelector.vue
+++ b/src/components/UserSelector.vue
@@ -1,21 +1,12 @@
 <template>
-  <q-select
-    v-model="selected"
-    filled
-    :label="label"
-    :options="users"
-    option-label="display_name"
-    option-value="userid"
-    map-options
-    use-input
-    input-debounce="0"
-    @filter="filterFn"
-  />
+  <q-select v-model="selected" filled :label="label" :options="users" :option-label="showName" option-value="userid"
+    map-options use-input input-debounce="0" @filter="filterFn" />
 </template>
 
 <script lang="ts">
 import { computed, defineComponent, PropType, onBeforeMount, ref } from 'vue';
 import { useUserStore } from '@flaschengeist/api';
+import { DisplayNameMode } from '../models';
 
 export default defineComponent({
   name: 'UserSelector',
@@ -29,6 +20,7 @@ export default defineComponent({
 
     onBeforeMount(() => {
       void userStore.getUsers(false);
+      void userStore.getDisplayNameModeSetting(true);
     });
 
     const users = computed(() =>
@@ -66,11 +58,26 @@ export default defineComponent({
       get: () => props.modelValue,
       set: (value: FG.User | undefined) => (value ? emit('update:modelValue', value) : undefined),
     });
+    function showName(user: FG.User) {
+      switch (userStore.userSettings.display_name) {
+        case DisplayNameMode.DISPLAYNAME:
+          return user.display_name;
+        case DisplayNameMode.FIRSTNAME:
+          return user.firstname;
+        case DisplayNameMode.LASTNAME:
+          return user.lastname;
+        case DisplayNameMode.FIRSTNAME_LASTNAME:
+          return `${user.firstname} ${user.lastname}`;
+        case DisplayNameMode.LASTNAME_FIRSTNAME:
+          return `${user.lastname}, ${user.firstname}`;
+      }
+    }
 
     return {
       selected,
       users,
       filterFn,
+      showName,
     };
   },
 });
diff --git a/src/index.ts b/src/index.ts
index 414d774..9bb7b23 100644
--- a/src/index.ts
+++ b/src/index.ts
@@ -1,6 +1,7 @@
 import { FG_Plugin } from '@flaschengeist/types';
 import { defineAsyncComponent } from 'vue';
 import routes from './routes';
+import { DisplayNameMode } from './models';
 
 const plugin: FG_Plugin.Plugin = {
   id: 'users',
@@ -27,3 +28,4 @@ const plugin: FG_Plugin.Plugin = {
 };
 
 export default plugin;
+export { DisplayNameMode };