From e81d5c7f14f18e56cdbfe379410e6611044b6e9a Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Wed, 28 Aug 2024 14:13:22 +0700
Subject: [PATCH] chore: clean

---
 .../FormEmployeeVisa.vue                      |  2 +-
 src/pages/03_customer-management/MainPage.vue | 26 ++++++++++---------
 src/pages/03_customer-management/form.ts      |  1 +
 3 files changed, 16 insertions(+), 13 deletions(-)

diff --git a/src/components/03_customer-management/FormEmployeeVisa.vue b/src/components/03_customer-management/FormEmployeeVisa.vue
index fadbc9db..d63c33f8 100644
--- a/src/components/03_customer-management/FormEmployeeVisa.vue
+++ b/src/components/03_customer-management/FormEmployeeVisa.vue
@@ -97,7 +97,7 @@ watch(
       />
       {{ $t(`${title}`) }}
     </div>
-    <div class="col-12 row q-col-gutter-md">
+    <div class="col-12 row q-col-gutter-sm">
       <q-select
         outlined
         clearable
diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 012b7393..72c3a829 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -1961,9 +1961,12 @@ const emptyCreateDialog = ref(false);
         useToggle
         color="white"
         icon="mdi-account-plus-outline"
-        bgColor="linear-gradient(135deg, rgba(43,137,223,1) 0%, rgba(230,51,81,1) 100%)"
+        :bg-color="
+          employeeFormState.profileUrl
+            ? 'white'
+            : 'linear-gradient(135deg, rgba(43,137,223,1) 0%, rgba(230,51,81,1) 100%)'
+        "
         v-model:current-tab="employeeFormState.currentTab"
-        v-model:cover-url="employeeFormState.profileUrl"
         v-model:toggle-status="currentFromDataEmployee.status"
         fallbackCover="/images/employee-banner.png"
         :img="employeeFormState.profileUrl || `/images/employee-avatar.png`"
@@ -1992,10 +1995,7 @@ const emptyCreateDialog = ref(false);
         "
         :menu="formMenuIconEmployee"
         :toggleTitle="$t('status.title')"
-        :hideFade="
-          employeeFormState.profileUrl === '' ||
-          employeeFormState.profileUrl === undefined
-        "
+        hideFade
         @view="employeeFormState.imageDialog = true"
         @edit="dialogEmployeeImageUpload && dialogEmployeeImageUpload.browse()"
         @update:toggle-status="
@@ -2778,6 +2778,8 @@ const emptyCreateDialog = ref(false);
     <div class="column full-height">
       <div class="q-px-lg q-pt-lg surface-2">
         <ProfileBanner
+          hideFade
+          :readonly="!employeeFormState.isEmployeeEdit"
           @view="employeeFormState.imageDialog = true"
           @edit="
             dialogEmployeeImageUpload && dialogEmployeeImageUpload.browse()
@@ -2792,10 +2794,13 @@ const emptyCreateDialog = ref(false);
           use-toggle
           color="white"
           icon="mdi-account-outline"
-          bg-color="linear-gradient(135deg, rgba(43,137,223,1) 0%, rgba(230,51,81,1) 100%)"
+          :bg-color="
+            employeeFormState.profileUrl
+              ? 'white'
+              : 'linear-gradient(135deg, rgba(43,137,223,1) 0%, rgba(230,51,81,1) 100%)'
+          "
           v-model:current-tab="employeeFormState.currentTab"
           v-model:toggle-status="currentFromDataEmployee.status"
-          v-model:cover-url="employeeFormState.profileUrl"
           fallback-cover="/images/employee-banner.png"
           :title="
             employeeFormState.currentEmployee
@@ -2806,6 +2811,7 @@ const emptyCreateDialog = ref(false);
           "
           :caption="currentFromDataEmployee.code"
           :img="employeeFormState.profileUrl || '/images/employee-avatar.png'"
+          :fallbackImg="'/images/employee-avatar.png'"
           :tabs-list="[
             {
               name: 'personalInfo',
@@ -2823,10 +2829,6 @@ const emptyCreateDialog = ref(false);
           ]"
           :menu="formMenuIconEmployee"
           :toggle-title="$t('status.title')"
-          :hide-fade="
-            employeeFormState.profileUrl === '' ||
-            employeeFormState.profileUrl === undefined
-          "
         />
       </div>
       <div
diff --git a/src/pages/03_customer-management/form.ts b/src/pages/03_customer-management/form.ts
index 8f7cde27..8781bb05 100644
--- a/src/pages/03_customer-management/form.ts
+++ b/src/pages/03_customer-management/form.ts
@@ -597,6 +597,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
       state.value.formDataEmployeeOwner = undefined;
       resetEmployeeData = structuredClone(defaultFormData);
       state.value.statusSavePersonal = false;
+      state.value.profileUrl = '';
     }
     currentFromDataEmployee.value = structuredClone(resetEmployeeData);
   }