From 2fd669b5735eddf2bd4126898692b5d67c380797 Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Tue, 24 Sep 2024 11:23:16 +0700
Subject: [PATCH] fix: address

---
 src/components/form/AddressForm.vue           | 20 +++++++------------
 src/pages/01_branch-management/MainPage.vue   |  8 +++++---
 src/pages/03_customer-management/MainPage.vue |  2 +-
 3 files changed, 13 insertions(+), 17 deletions(-)

diff --git a/src/components/form/AddressForm.vue b/src/components/form/AddressForm.vue
index 99035a7f..573b904b 100644
--- a/src/components/form/AddressForm.vue
+++ b/src/components/form/AddressForm.vue
@@ -67,37 +67,31 @@ const addrOptions = reactive<{
 const { t } = useI18n();
 
 const fullAddress = computed(() => {
-  const addressParts = [address.value];
+  const addressParts = [`${address.value},`];
   const province = provinceOptions.value.find((v) => v.id === provinceId.value);
   const district = districtOptions.value.find((v) => v.id === districtId.value);
   const sDistrict = subDistrictOptions.value.find(
     (v) => v.id === subDistrictId.value,
   );
 
-  if (moo.value) addressParts.push(`${t('form.moo')} ${moo.value}`);
-  if (soi.value) addressParts.push(`${t('form.soi')} ${soi.value}`);
-  if (street.value) addressParts.push(`${t('form.road')} ${street.value}`);
+  if (moo.value) addressParts.push(`${t('form.moo')} ${moo.value},`);
+  if (soi.value) addressParts.push(`${t('form.soi')} ${soi.value},`);
+  if (street.value) addressParts.push(`${t('form.road')} ${street.value},`);
 
   if (subDistrictId.value && sDistrict) {
     addressParts.push(
-      typeof sDistrict.name === 'string'
-        ? `${t('form.subDistrict')} ${sDistrict.name}`
-        : '',
+      typeof sDistrict.name === 'string' ? `${sDistrict.name},` : '',
     );
   }
 
   if (districtId.value && district)
     addressParts.push(
-      typeof district.name === 'string'
-        ? `${t('form.district')} ${district.name}`
-        : '',
+      typeof district.name === 'string' ? `${district.name},` : '',
     );
 
   if (provinceId.value && province) {
     addressParts.push(
-      typeof province.name === 'string'
-        ? `${t('form.province')} ${province.name}`
-        : '',
+      typeof province.name === 'string' ? `${province.name}` : '',
     );
     sDistrict &&
       addressParts.push(
diff --git a/src/pages/01_branch-management/MainPage.vue b/src/pages/01_branch-management/MainPage.vue
index d3eea57e..21fa061f 100644
--- a/src/pages/01_branch-management/MainPage.vue
+++ b/src/pages/01_branch-management/MainPage.vue
@@ -1472,7 +1472,7 @@ watch(currentHq, () => {
                             locale === 'eng'
                               ? `${props.row.addressEN}, ${props.row.mooEN && `${$t('form.moo')} ${props.row.mooEN},`} ${props.row.soiEN && `${$t('form.soi')} ${props.row.soiEN},`} ${props.row.moo && `${props.row.streetEN} Rd,`} ${props.row.subDistrict.nameEN}, ${props.row.district.nameEN}, ${props.row.province.nameEN} ${props.row.subDistrict.zipCode}` ||
                                 '-'
-                              : `${props.row.address} ${props.row.moo && `${$t('form.moo')} ${props.row.moo}`} ${props.row.soi && `${$t('form.soi')} ${props.row.soi}`} ${props.row.street && `${$t('form.road')} ${props.row.street}`} ${$t('form.subDistrict')} ${props.row.subDistrict.name} ${$t('form.district')} ${props.row.district.name} ${$t('form.province')} ${props.row.province.name} ${props.row.subDistrict.zipCode}` ||
+                              : `${props.row.address} ${props.row.moo && `${$t('form.moo')} ${props.row.moo},`} ${props.row.soi && `${$t('form.soi')} ${props.row.soi},`} ${props.row.street && `${$t('form.road')} ${props.row.street},`} ${props.row.subDistrict.name}, ${props.row.district.name}, ${props.row.province.name} ${props.row.subDistrict.zipCode}` ||
                                 '-'
                           }}
                         </q-td>
@@ -1586,8 +1586,10 @@ watch(currentHq, () => {
                             contactName: props.row.contactName || '-',
                             branchLabelAddress:
                               $i18n.locale === 'eng'
-                                ? `${props.row.addressEN} ${props.row.mooEN && `Moo ${props.row.mooEN}`} ${props.row.soiEN && `Soi ${props.row.soiEN}`} ${props.row.streetEN && `${props.row.streetEN} Street`} ${props.row.subDistrict.nameEN} ${props.row.district.nameEN} ${props.row.province.nameEN} ${props.row.subDistrict.zipCode}`
-                                : `${props.row.address} ${props.row.moo && `หมู่ ${props.row.moo}`} ${props.row.soi && `ซอย ${props.row.soi}`} ${props.row.street && `ถนน ${props.row.street}`} ต.${props.row.subDistrict.name} อ.${props.row.district.name} จ.${props.row.province.name} ${props.row.subDistrict.zipCode}`,
+                                ? `${props.row.addressEN}, ${props.row.mooEN && `${$t('form.moo')} ${props.row.mooEN},`} ${props.row.soiEN && `${$t('form.soi')} ${props.row.soiEN},`} ${props.row.moo && `${props.row.streetEN} Rd,`} ${props.row.subDistrict.nameEN}, ${props.row.district.nameEN}, ${props.row.province.nameEN} ${props.row.subDistrict.zipCode}` ||
+                                  '-'
+                                : `${props.row.address} ${props.row.moo && `${$t('form.moo')} ${props.row.moo},`} ${props.row.soi && `${$t('form.soi')} ${props.row.soi},`} ${props.row.street && `${$t('form.road')} ${props.row.street},`} ${props.row.subDistrict.name}, ${props.row.district.name}, ${props.row.province.name} ${props.row.subDistrict.zipCode}` ||
+                                  '-',
                             branchImgUrl: `/branch/${props.row.id}/branch`,
                           }"
                           :field-selected="fieldSelected"
diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 434b40ae..8718091a 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -1275,7 +1275,7 @@ const emptyCreateDialog = ref(false);
                             locale === 'eng'
                               ? `${props.row.branch[0].addressEN}, ${props.row.branch[0].mooEN && `${$t('form.moo')} ${props.row.branch[0].mooEN},`} ${props.row.branch[0].soiEN && `${$t('form.soi')} ${props.row.branch[0].soiEN},`} ${props.row.branch[0].moo && `${props.row.branch[0].streetEN} Rd,`} ${props.row.branch[0].subDistrict.nameEN}, ${props.row.branch[0].district.nameEN}, ${props.row.branch[0].province.nameEN} ${props.row.branch[0].subDistrict.zipCode}` ||
                                 '-'
-                              : `${props.row.branch[0].address} ${props.row.branch[0].moo && `${$t('form.moo')} ${props.row.branch[0].moo}`} ${props.row.branch[0].soi && `${$t('form.soi')} ${props.row.branch[0].soi}`} ${props.row.branch[0].street && `${$t('form.road')} ${props.row.branch[0].street}`} ${$t('form.subDistrict')} ${props.row.branch[0].subDistrict.name} ${$t('form.district')} ${props.row.branch[0].district.name} ${$t('form.province')} ${props.row.branch[0].province.name} ${props.row.branch[0].subDistrict.zipCode}` ||
+                              : `${props.row.branch[0].address}, ${props.row.branch[0].moo && `${$t('form.moo')} ${props.row.branch[0].moo},`} ${props.row.branch[0].soi && `${$t('form.soi')} ${props.row.branch[0].soi},`} ${props.row.branch[0].street && `${$t('form.road')} ${props.row.branch[0].street},`} ${props.row.branch[0].subDistrict.name}, ${props.row.branch[0].district.name}, ${props.row.branch[0].province.name} ${props.row.branch[0].subDistrict.zipCode}` ||
                                 '-'
                           }}
                         </q-td>