From eb7d853788db6c50f5200841e37adc8de0ecf3a6 Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Tue, 27 Aug 2024 17:53:51 +0700
Subject: [PATCH] fix(03): namePrefix & fallback customer img

---
 src/pages/03_customer-management/MainPage.vue             | 4 +++-
 .../components/employer/EmployerFormBasicInfo.vue         | 8 +++++---
 2 files changed, 8 insertions(+), 4 deletions(-)

diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 909d468d..61b0e67d 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -123,7 +123,6 @@ async function init() {
       router.push('/customer-management');
     }
   }
-
   flowStore.rotate();
 }
 onMounted(init);
@@ -845,6 +844,7 @@ const emptyCreateDialog = ref(false);
             >
               <q-tab
                 name="employer"
+                class="text-capitalize"
                 id="tab-employer"
                 @click="
                   () => {
@@ -867,6 +867,7 @@ const emptyCreateDialog = ref(false);
               <q-tab
                 name="employee"
                 id="tab-employee"
+                class="text-capitalize"
                 @click="
                   () => {
                     currentPageEmployee = 1;
@@ -1627,6 +1628,7 @@ const emptyCreateDialog = ref(false);
           customerFormState.customerImageUrl ||
           `/images/customer-${customerFormData.customerType}-avartar.png`
         "
+        :fallbackImg="`/images/customer-${customerFormData.customerType}-avartar.png`"
         color="hsla(var(--pink-6-hsl)/1)"
         bg-color="hsla(var(--pink-6-hsl)/0.15)"
         @view="customerFormState.imageDialog = true"
diff --git a/src/pages/03_customer-management/components/employer/EmployerFormBasicInfo.vue b/src/pages/03_customer-management/components/employer/EmployerFormBasicInfo.vue
index face0557..a59d6ad8 100644
--- a/src/pages/03_customer-management/components/employer/EmployerFormBasicInfo.vue
+++ b/src/pages/03_customer-management/components/employer/EmployerFormBasicInfo.vue
@@ -1,5 +1,5 @@
 <script lang="ts" setup>
-import { ref, watch } from 'vue';
+import { ref, watch, capitalize } from 'vue';
 import { QSelect } from 'quasar';
 import { selectFilterOptionRefMod } from 'stores/utils';
 import { getRole } from 'src/services/keycloak';
@@ -311,13 +311,15 @@ function formatCode(input: string | undefined, type: 'code' | 'number') {
         dense
         outlined
         :disable="!readonly"
-        :readonly="readonly"
+        readonly
         hide-bottom-space
         class="col-12 col-md-2"
         :label="$t('customer.form.prefixName')"
         for="input-prefix-name"
         :model-value="
-          namePrefix ? $t(`customer.form.prefix.${namePrefix}`) : '-'
+          readonly
+            ? capitalize(namePrefix || '') || '-'
+            : capitalize(namePrefix || '')
         "
       />