udpate

src/pages/ChatPage.vue

@@ -26,15 +26,13 @@
           rounded
         />
         <div
-          class="flex row items-start justify-center q-pt-md text-bold"
-          align="center"
+          class="flex row items-start justify-center q-pt-md text-bold text-center"
           >
           {{ chat.name }}
         </div>
         <div
           v-if="chat.description"
-          class="flex row items-start justify-center text-caption"
-          align="center"
+          class="flex row items-start justify-center text-caption text-center"
           >
           {{ chat.description }}
         </div>
@@ -58,13 +56,12 @@
             />
           </q-item-section>
           <q-item-section>
-            <q-item-label lines="1" class="text-bold" v-if="item.section1">
-              <q-badge
-                v-if="item.is_blocked"
-                color="negative"
-                >
-                {{ $t('chat_page__user_blocked') }}
+            <q-item-label lines="1" v-if="getUserStatus(item).status">
+              <q-badge  :color="getUserStatus(item).color">
+                {{ $t(getUserStatus(item).text) }}
               </q-badge>
+            </q-item-label>
+            <q-item-label lines="1" class="text-bold" v-if="item.section1">
               {{item.section1}}
             </q-item-label>
             <q-item-label lines="2" caption v-if="item.section3">
@@ -91,8 +88,9 @@
   import { useChatsStore } from 'stores/chats'
   import { useUsersStore } from 'stores/users'
   import { useCompaniesStore } from 'stores/companies'
-  import { parseIntString } from 'helpers/helpers'
+  import { parseIntString } from 'src/utils/helpers'
   import type { Chat } from 'types/Chat'
+  import type { User } from 'types/User'
   import type { WebApp } from '@twa-dev/types'
   import { useUserSection } from 'composables/useUserSection'
 
@@ -135,8 +133,9 @@
     return arr.map(el => ({
       ...el,
       ...userSection(el),
-      companyName: el.company_id && companiesStore.companyById(el.company_id)
-        ? companiesStore.companyById(el.company_id)?.name 
+      companyName: 
+        (el.company_id && companiesStore.companyById(el.company_id))
+        ? companiesStore.companyById(el.company_id)?.name ?? null
         : null
     }))
   })
@@ -145,4 +144,19 @@
     await router.push({ name: 'user_info', params: { id: route.params.id, userId: id }})
   }
 
+  interface chatUser extends User {
+    section1: string
+    section2_1: string
+    section2_2: string
+    section3: string
+    companyName: string | null
+  }
+
+  function getUserStatus (item: chatUser) {
+    if (item.is_blocked) return { status: 'blocked', text: 'user_block__user_blocked', color: 'negative' }
+    if (item.is_leave) return { status: 'leave', text: 'user_block__user_leave', color: 'primary' }
+    if (!item.is_terms_accepted) return { status: 'pending', text: 'user_block__user_pending', color: 'secondary' }
+    return { status: null, text: '', color: '' }
+  }
+
 </script>