From 467a86234483b2571a518a30cab8a63b7b10ea5e Mon Sep 17 00:00:00 2001
From: Net <thanaphon@frappet.com>
Date: Wed, 24 Jul 2024 11:34:45 +0700
Subject: [PATCH] refactor: set layout btn add

---
 src/pages/03_customer-management/MainPage.vue | 93 +++++++++++--------
 1 file changed, 52 insertions(+), 41 deletions(-)

diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index b363d247..8aad0666 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -1190,8 +1190,6 @@ async function assignFormData(customerId: string, branch?: CustomerBranch) {
   });
 
   cloneData();
-
-  console.log(formData.value);
 }
 
 function cloneData() {
@@ -1566,39 +1564,58 @@ watch(
 
 <template>
   <ButtonAddComponent style="z-index: 999">
-    <q-fab-action
-      v-if="selectorLabel === 'EMPLOYER' || !selectorLabel"
-      id="add-customer-legal-entity"
-      style="color: white; background-color: hsla(var(--violet-11-hsl))"
-      @click="triggerCreate('CORP')"
-      padding="xs"
-      icon="mdi-office-building"
-      :label="$t('add') + ' ' + $t('customerLegalEntity')"
-      external-label
-      label-position="left"
-    />
-    <q-fab-action
-      v-if="selectorLabel === 'EMPLOYER' || !selectorLabel"
-      id="add-customer-natural-person"
-      :label="$t('add') + ' ' + $t('customerNaturalPerson')"
-      external-label
-      label-position="left"
-      @click="triggerCreate('PERS')"
-      style="color: white; background-color: hsla(var(--teal-10-hsl))"
-      padding="xs"
-      icon="mdi-account-plus"
-    ></q-fab-action>
-    <q-fab-action
-      v-if="selectorLabel === 'EMPLOYEE' || !selectorLabel"
-      :label="$t('add') + ' ' + $t('EMPLOYEE')"
-      external-label
-      id="add-employee"
-      label-position="left"
-      @click="openDialogCustomerType()"
-      color="primary"
-      padding="xs"
-      icon="mdi-account-plus"
-    ></q-fab-action>
+    <div v-if="isMainPage">
+      <q-fab-action
+        v-if="selectorLabel === 'EMPLOYER' || !selectorLabel"
+        id="add-customer-legal-entity"
+        style="color: white; background-color: hsla(var(--violet-11-hsl))"
+        @click="triggerCreate('CORP')"
+        padding="xs"
+        icon="mdi-office-building"
+        :label="$t('add') + ' ' + $t('customerLegalEntity')"
+        external-label
+        label-position="left"
+      />
+      <q-fab-action
+        v-if="selectorLabel === 'EMPLOYER' || !selectorLabel"
+        id="add-customer-natural-person"
+        :label="$t('add') + ' ' + $t('customerNaturalPerson')"
+        external-label
+        label-position="left"
+        @click="triggerCreate('PERS')"
+        style="color: white; background-color: hsla(var(--teal-10-hsl))"
+        padding="xs"
+        icon="mdi-account-plus"
+      />
+      <q-fab-action
+        v-if="selectorLabel === 'EMPLOYEE' || !selectorLabel"
+        :label="$t('add') + ' ' + $t('EMPLOYEE')"
+        external-label
+        id="add-employee"
+        label-position="left"
+        @click="openDialogCustomerType()"
+        color="primary"
+        padding="xs"
+        icon="mdi-account-plus"
+      />
+    </div>
+    <div v-else>
+      <q-fab-action
+        id="add-branch"
+        :style="`color: white; background-color: ${customerType === 'CORP' ? 'hsla(var(--violet-11-hsl))' : 'hsla(var(--pink-6-hsl))'}`"
+        @click="
+          () => {
+            indexTab = 0;
+            dialogInputCustomerBranchForm = true;
+          }
+        "
+        padding="xs"
+        icon="mdi-office-building"
+        :label="$t('formDialogTitleCreateSubBranch')"
+        external-label
+        label-position="left"
+      />
+    </div>
   </ButtonAddComponent>
 
   <div class="column full-height no-wrap">
@@ -2830,12 +2847,6 @@ watch(
             clearForm();
           }
         "
-        @dialog="
-          () => {
-            indexTab = 0;
-            dialogInputCustomerBranchForm = true;
-          }
-        "
         @viewDetail="
           async (v, i) => {
             currentBranchId = v.id;