refactor: get contact number and name

src/components/05_quotation/FormAbout.vue

@@ -2,11 +2,18 @@
 import SelectCustomer from '../shared/select/SelectCustomer.vue';
 import SelectBranch from '../shared/select/SelectBranch.vue';
 
+import { CustomerBranch } from 'src/stores/customer';
+import { ref } from 'vue';
+
 const branchId = defineModel<string>('branchId');
 const customerBranchId = defineModel<string>('customerBranchId');
 const agentPrice = defineModel<boolean>('agentPrice');
 const special = defineModel<boolean>('special');
 
+const customerBranchOption = defineModel<CustomerBranch>(
+  'customerBranchOption',
+);
+
 defineProps<{
   outlined?: boolean;
   readonly?: boolean;
@@ -67,10 +74,12 @@ defineEmits<{
         required
         :readonly
       />
+
       <SelectCustomer
         id="about-select-customer-branch-id"
         for="about-select-customer-branch-id"
         v-model:value="customerBranchId"
+        v-model:value-option="customerBranchOption"
         :label="$t('quotation.customer')"
         :creatable-disabled-text="`(${$t('form.error.selectField', {
           field: $t('quotation.branchVirtual'),

src/pages/05_quotation/QuotationForm.vue

@@ -80,6 +80,8 @@ import { RouterLink, useRoute } from 'vue-router';
 import { initLang, initTheme, Lang } from 'src/utils/ui';
 import { convertTemplate } from 'src/utils/string-template';
 
+import { CustomerBranch } from 'src/stores/customer';
+
 type Node = {
   [key: string]: any;
   opened?: boolean;
@@ -94,6 +96,8 @@ type ProductGroupId = string;
 
 const API_BASE_URL = import.meta.env.VITE_API_BASE_URL;
 
+const customerBranchOption = ref<CustomerBranch>();
+
 const employeeStore = useEmployeeStore();
 const route = useRoute();
 const useReceiptStore = useReceipt();
@@ -1067,6 +1071,15 @@ watch(
 
 const productServiceNodes = ref<ProductTree>([]);
 
+watch(customerBranchOption, () => {
+  if (!customerBranchOption.value) return;
+
+  quotationFormData.value.contactName =
+    customerBranchOption.value.contactName || '';
+  quotationFormData.value.contactTel =
+    customerBranchOption.value.contactTel || '';
+});
+
 watch(
   () => productServiceList.value,
   () => {
@@ -1519,6 +1532,7 @@ function covertToNode() {
                       v-model:customer-branch-id="
                         quotationFormData.customerBranchId
                       "
+                      v-model:customer-branch-option="customerBranchOption"
                       :readonly="readonly"
                     />
                   </template>