fix: แก้สร้าง สาขา ไม่ได้

src/pages/03_customer-management/MainPage.vue

@@ -4,7 +4,7 @@ import { computed, ref, watch, toRaw } from 'vue';
 import useCustomerStore from 'src/stores/customer';
 import useEmployeeStore from 'src/stores/employee';
 import useOptionStore from 'src/stores/options';
-import useBranchStore from 'src/stores/branch';
+import useMyBranchStore from 'src/stores/my-branch';
 
 import { Status } from 'src/stores/types';
 
@@ -63,9 +63,9 @@ import useFlowStore from 'src/stores/flow';
 const { t, locale } = useI18n();
 const utilsStore = useUtilsStore();
 const userCustomer = useCustomerStore();
-const userBranch = useBranchStore();
+const useMyBranch = useMyBranchStore();
 
-const { fetchList: fetchListBranch } = userBranch;
+const { fetchListOptionBranch } = useMyBranch;
 
 const {
   create,
@@ -242,7 +242,7 @@ const formDataEmployee = ref<EmployeeCreate>({
   },
 });
 
-const allBranch = ref<{ id: string; name: string }[]>();
+const branchOption = ref<{ id: string; name: string }[]>();
 const indexTab = ref<number>(0);
 const statusToggle = ref<boolean>(false);
 const profileSubmit = ref<boolean>(false);
@@ -390,7 +390,7 @@ const employeeHistory = ref<EmployeeHistory[]>();
 
 async function triggerCreate(type: CustomerType) {
   customerType.value = type;
-  await fetchListOfBranch();
+  await fetchListOfOptionBranch();
   openDialogInputForm();
   dialogCustomerType.value = false;
 }
@@ -413,7 +413,7 @@ async function openDialogInputForm(
   if (action === 'INFO') {
     if (!id) return;
     if (selectorLabel.value === 'EMPLOYER') {
-      await fetchListOfBranch();
+      await fetchListOfOptionBranch();
       infoDrawer.value = true;
     }
     if (selectorLabel.value === 'EMPLOYEE') {
@@ -448,7 +448,7 @@ async function openDialogInputForm(
     }
   } else {
     if (selectorLabel.value === 'EMPLOYER') {
-      await fetchListOfBranch();
+      await fetchListOfOptionBranch();
       dialogInputForm.value = true;
     }
     if (selectorLabel.value === 'EMPLOYEE') {
@@ -711,12 +711,10 @@ async function onSubmitCustomerBranch() {
   flowStore.rotate();
 }
 
-async function fetchListOfBranch() {
-  const res = await fetchListBranch({ pageSize: 999 });
+async function fetchListOfOptionBranch() {
+  const res = await fetchListOptionBranch({ pageSize: 999 });
 
-  if (res) allBranch.value = res.result;
-
-  console.log(allBranch.value);
+  if (res) branchOption.value = res.result;
 }
 
 async function fetchListCustomer() {
@@ -1354,44 +1352,42 @@ watch([inputSearch, currentStatus], async () => {
             }}
           </div>
 
-          <div class="scroll">
-            <div class="q-mx-md" style="display: inline-block">
-              <StatCardComponent
-                v-if="customerStats && selectorLabel === 'EMPLOYER'"
-                labelI18n
-                :branch="
-                  customerStats.map((v) => ({
-                    count:
-                      v.name === 'CORP'
-                        ? statsCustomerType?.CORP ?? 0
-                        : statsCustomerType?.PERS ?? 0,
-                    label:
-                      v.name === 'CORP'
-                        ? 'customerLegalEntity'
-                        : 'customerNaturalPerson',
-                    color: v.name === 'CORP' ? 'purple' : 'green',
-                  }))
-                "
-                :dark="$q.dark.isActive"
-                nowrap
-                class="q-mb-md"
-              />
+          <div class="q-px-md scroll">
+            <StatCardComponent
+              v-if="customerStats && selectorLabel === 'EMPLOYER'"
+              labelI18n
+              :branch="
+                customerStats.map((v) => ({
+                  count:
+                    v.name === 'CORP'
+                      ? statsCustomerType?.CORP ?? 0
+                      : statsCustomerType?.PERS ?? 0,
+                  label:
+                    v.name === 'CORP'
+                      ? 'customerLegalEntity'
+                      : 'customerNaturalPerson',
+                  color: v.name === 'CORP' ? 'purple' : 'green',
+                }))
+              "
+              :dark="$q.dark.isActive"
+              nowrap
+              class="q-mb-md"
+            />
 
-              <StatCardComponent
-                v-if="customerStats && selectorLabel === 'EMPLOYEE'"
-                labelI18n
-                :branch="[
-                  {
-                    label: 'EMPLOYEE',
-                    count: statsEmployee,
-                    color: 'pink',
-                  },
-                ]"
-                :dark="$q.dark.isActive"
-                nowrap
-                class="q-mb-md"
-              />
-            </div>
+            <StatCardComponent
+              v-if="customerStats && selectorLabel === 'EMPLOYEE'"
+              labelI18n
+              :branch="[
+                {
+                  label: 'EMPLOYEE',
+                  count: statsEmployee,
+                  color: 'pink',
+                },
+              ]"
+              :dark="$q.dark.isActive"
+              nowrap
+              class="q-mb-md"
+            />
           </div>
         </div>
       </div>
@@ -1841,7 +1837,7 @@ watch([inputSearch, currentStatus], async () => {
         outlined
         separator
         :type-customer="customerType"
-        :options-branch="allBranch"
+        :options-branch="branchOption"
         v-model:registered-branch-id="formData.registeredBranchId"
         v-model:customer-name="formData.customerName"
         v-model:customer-name-en="formData.customerNameEN"
@@ -2326,6 +2322,7 @@ watch([inputSearch, currentStatus], async () => {
                 indexTab !== undefined && formData.customerBranch?.[indexTab]
               "
               :type-customer="customerType"
+              v-model:branch-no="formData.customerBranch[indexTab].branchNo"
               v-model:tax-no="formData.customerBranch[indexTab].taxNo"
               v-model:customer-name="formData.customerBranch[indexTab].name"
               v-model:customer-english-name="
@@ -2440,7 +2437,7 @@ watch([inputSearch, currentStatus], async () => {
             separator
             :readonly="!infoDrawerEdit"
             :type-customer="customerType"
-            :options-branch="allBranch"
+            :options-branch="branchOption"
             v-model:registered-branch-id="formData.registeredBranchId"
             v-model:customer-name="formData.customerName"
             v-model:customer-name-en="formData.customerNameEN"
@@ -2743,6 +2740,8 @@ watch([inputSearch, currentStatus], async () => {
                 <AboutComponent
                   v-if="formData.customerBranch?.[0]"
                   :type-customer="customerType"
+                  v-model:branch-code="formData.customerBranch[indexTab].code"
+                  v-model:branch-no="formData.customerBranch[indexTab].branchNo"
                   v-model:customer-name="formData.customerBranch[indexTab].name"
                   v-model:customer-english-name="
                     formData.customerBranch[indexTab].nameEN