From 4fa1188063b35897353f62403436b0fb03ce12a3 Mon Sep 17 00:00:00 2001
From: Methapon2001 <61303214+Methapon2001@users.noreply.github.com>
Date: Mon, 8 Jul 2024 11:21:00 +0700
Subject: [PATCH] chore: format code

---
 src/boot/components.ts                        |   2 +-
 src/components/home/PersonCard.vue            |  24 +--
 src/i18n/en-US/employer-dialog.ts             |   2 +-
 src/i18n/th-th/employer-dialog.ts             |   3 +-
 src/pages/01_branch-management/MainPage.vue   |   2 +-
 src/pages/03_customer-management/MainPage.vue | 187 ++++++++----------
 6 files changed, 98 insertions(+), 122 deletions(-)

diff --git a/src/boot/components.ts b/src/boot/components.ts
index 9bd627c0..0e028326 100644
--- a/src/boot/components.ts
+++ b/src/boot/components.ts
@@ -1,6 +1,6 @@
 import { boot } from 'quasar/wrappers';
 import VueDatePicker from '@vuepic/vue-datepicker';
-import '@vuepic/vue-datepicker/dist/main.css'
+import '@vuepic/vue-datepicker/dist/main.css';
 import GlobalDialog from 'components/GlobalDialog.vue';
 import GlobalLoading from 'components/GlobalLoading.vue';
 
diff --git a/src/components/home/PersonCard.vue b/src/components/home/PersonCard.vue
index 11bfdb25..16172e58 100644
--- a/src/components/home/PersonCard.vue
+++ b/src/components/home/PersonCard.vue
@@ -68,7 +68,7 @@ defineEmits<{
         />
 
         <q-btn
-        :key="data.code"
+          :key="data.code"
           flat
           round
           padding="xs"
@@ -154,17 +154,14 @@ defineEmits<{
         </q-btn>
       </div>
 
-     
       <!-- profile -->
-    
+
       <AppCircle
         bordered
         class="avatar"
         style="border: 2px solid var(--border-color); overflow: visible"
         @click="$emit('editProfile')"
       >
-
-       
         <q-img
           :src="data.img ?? '/no-profile.png'"
           style="
@@ -174,15 +171,14 @@ defineEmits<{
             border-radius: 50%;
           "
         >
-   <template #error>
-          <div
-            style="background: none"
-            class="full-width full-height items-center justify-center flex"
-          >
-            <q-img src="/no-profile.png" width="5rem" />
-          </div>
-        </template>
-
+          <template #error>
+            <div
+              style="background: none"
+              class="full-width full-height items-center justify-center flex"
+            >
+              <q-img src="/no-profile.png" width="5rem" />
+            </div>
+          </template>
         </q-img>
         <div class="avatar__status"></div>
       </AppCircle>
diff --git a/src/i18n/en-US/employer-dialog.ts b/src/i18n/en-US/employer-dialog.ts
index 31d08d86..3a618ea9 100644
--- a/src/i18n/en-US/employer-dialog.ts
+++ b/src/i18n/en-US/employer-dialog.ts
@@ -7,5 +7,5 @@ export default {
 
   companyOwnerName: 'Company Owner Name',
 
-  corporation:'Corporation'
+  corporation: 'Corporation',
 };
diff --git a/src/i18n/th-th/employer-dialog.ts b/src/i18n/th-th/employer-dialog.ts
index e2f28c78..927d9eaa 100644
--- a/src/i18n/th-th/employer-dialog.ts
+++ b/src/i18n/th-th/employer-dialog.ts
@@ -7,6 +7,5 @@ export default {
 
   companyOwnerName: 'ชื่อเจ้าของบริษัท',
 
-  corporation:'ชื่อ บริษัท/นิติบุคคล'
-
+  corporation: 'ชื่อ บริษัท/นิติบุคคล',
 };
diff --git a/src/pages/01_branch-management/MainPage.vue b/src/pages/01_branch-management/MainPage.vue
index d6cb0228..50a547dc 100644
--- a/src/pages/01_branch-management/MainPage.vue
+++ b/src/pages/01_branch-management/MainPage.vue
@@ -913,7 +913,7 @@ watch(locale, () => {
                     <q-table
                       flat
                       bordered
-                       :rows-per-page-options="[0]"
+                      :rows-per-page-options="[0]"
                       :rows="
                         treeData
                           .flatMap((v) => [v, ...v.branch])
diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 4dd04358..ec1d819c 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -68,7 +68,6 @@ const useMyBranch = useMyBranchStore();
 
 const { fetchListOptionBranch } = useMyBranch;
 
-
 const columns = [
   {
     name: 'customerName',
@@ -91,7 +90,6 @@ const columns = [
     field: 'personName',
   },
 
- 
   {
     name: 'telephoneNo',
     align: 'left',
@@ -99,7 +97,7 @@ const columns = [
     field: 'branch[0].telephoneNo',
   },
 
-   {
+  {
     name: 'branchEmail',
     align: 'left',
     label: 'formDialogInputEmail',
@@ -107,7 +105,6 @@ const columns = [
   },
 ] satisfies QTableProps['columns'];
 
-
 const {
   create,
   getStatsCustomer,
@@ -171,57 +168,46 @@ const fieldSelectedCustomer = ref<{ label: string; value: string }>({
   value: 'all',
 });
 
-
-
-
-
 const fieldDisplay = ref<
- {
-   label: string;
-   value: string;
+  {
+    label: string;
+    value: string;
   }[]
 >([
+  {
+    label: t('corporation'),
+    value: 'customerName',
+  },
 
-{
-  label: t('corporation'),
-  value: 'customerName',
-},
+  {
+    label: t('type'),
+    value: 'customerType',
+  },
 
-{
-  label: t('type'),
-  value: 'customerType',
-},
+  {
+    label: t('name'),
+    value: 'personName',
+  },
 
-{
-  label: t('name'),
-  value: 'personName',
-},
+  {
+    label: t('telephone'),
+    value: 'telephoneNo',
+  },
 
-{
-  label: t('telephone'),
-  value: 'telephoneNo',
-},
-
-{
-  label: t('formDialogInputEmail'),
-  value: 'branchEmail',
-},
-
- 
+  {
+    label: t('formDialogInputEmail'),
+    value: 'branchEmail',
+  },
 ]);
 const fieldSelected = ref<
   (
-   | 'customerName'
+    | 'customerName'
     | 'customerType'
     | 'personName'
     | 'telephoneNo'
     | 'branchEmail'
   )[]
->([  'customerName',
-  'customerType',
-  'personName',
-  'telephoneNo',
-  'branchEmail']);
+>(['customerName', 'customerType', 'personName', 'telephoneNo', 'branchEmail']);
 
 const splitterModel = ref(15);
 const modeView = ref(true);
@@ -865,8 +851,6 @@ async function toggleStatusEmployee(id: string, status: boolean) {
 }
 
 async function toggleStatusCustomer(id: string, status: boolean) {
- 
-  
   await editById(id, { status: !status ? 'ACTIVE' : 'INACTIVE' });
 
   await fetchListCustomer();
@@ -1551,7 +1535,7 @@ watch([inputSearch, currentStatus], async () => {
                 ></q-select>
 
                 <q-select
-                v-if="modeView === false"
+                  v-if="modeView === false"
                   id="select-field"
                   for="select-field"
                   :options="fieldDisplay"
@@ -1779,9 +1763,7 @@ watch([inputSearch, currentStatus], async () => {
                             }
                           "
                         >
-                          <q-td
-                          v-if="fieldSelected.includes('customerName')"
-                          >
+                          <q-td v-if="fieldSelected.includes('customerName')">
                             <div class="row items-center">
                               <div
                                 :class="{
@@ -1799,17 +1781,18 @@ watch([inputSearch, currentStatus], async () => {
                                 "
                               >
                                 <div class="branch-card__icon">
-                                   <q-avatar size="md">
-                                      <q-img  :src="props.row.imageUrl ?? '/no-profile.png'">
-
+                                  <q-avatar size="md">
+                                    <q-img
+                                      :src="
+                                        props.row.imageUrl ?? '/no-profile.png'
+                                      "
+                                    >
                                       <template #error>
-                                        <q-img  src="/no-profile.png"/>
+                                        <q-img src="/no-profile.png" />
                                       </template>
-                                      
-                                      </q-img>
+                                    </q-img>
                                   </q-avatar>
-                                  
-                               
+
                                   <!-- <q-icon
                                     size="md"
                                     style="scale: 0.8"
@@ -1818,38 +1801,37 @@ watch([inputSearch, currentStatus], async () => {
                                 </div>
                               </div>
                               <div class="col">
-                                <div class="col">{{ props.row.customerName || '-'   }}</div>
+                                <div class="col">
+                                  {{ props.row.customerName || '-' }}
+                                </div>
                                 <div class="col app-text-muted">
-                                  {{ props.row.customerNameEN || '-'    }}
+                                  {{ props.row.customerNameEN || '-' }}
                                 </div>
                               </div>
                             </div>
                           </q-td>
-                          <q-td
-                           v-if="fieldSelected.includes('customerType')"
-                          >
-
+                          <q-td v-if="fieldSelected.includes('customerType')">
                             <span
                               class="tags"
-         
-                              :class="{ [`tags__${props.row.customerType === 'CORP'? 'purple' : 'green'}`]: true }"
-                             >
-                                      {{props.row.customerType === 'CORP' ? $t('customerLegalEntity') : $t('customerNaturalPerson')}}
-                             </span>
-
-                           
+                              :class="{
+                                [`tags__${props.row.customerType === 'CORP' ? 'purple' : 'green'}`]: true,
+                              }"
+                            >
+                              {{
+                                props.row.customerType === 'CORP'
+                                  ? $t('customerLegalEntity')
+                                  : $t('customerNaturalPerson')
+                              }}
+                            </span>
                           </q-td>
-                          <q-td  v-if="fieldSelected.includes('personName')">
-                          {{ props.row.personName }}
+                          <q-td v-if="fieldSelected.includes('personName')">
+                            {{ props.row.personName }}
                           </q-td>
                           <q-td v-if="fieldSelected.includes('telephoneNo')">
-                          {{ props.row.branch[0].telephoneNo || '-' }}
+                            {{ props.row.branch[0].telephoneNo || '-' }}
                           </q-td>
-                          <q-td
-                          v-if="fieldSelected.includes('branchEmail')"
-                          >
-                           
-                           {{ props.row.branch[0].email || '-' }}
+                          <q-td v-if="fieldSelected.includes('branchEmail')">
+                            {{ props.row.branch[0].email || '-' }}
                           </q-td>
                           <q-td>
                             <q-btn
@@ -1880,7 +1862,7 @@ watch([inputSearch, currentStatus], async () => {
                               @click.stop
                               :key="props.row.id"
                             >
-                              <q-menu class="bordered" >
+                              <q-menu class="bordered">
                                 <q-list v-close-popup>
                                   <q-item
                                     :id="`view-detail-btn-${props.row.name}-view`"
@@ -2009,7 +1991,6 @@ watch([inputSearch, currentStatus], async () => {
                                             }
                                           "
                                           :model-value="
-                                           
                                             props.row.status !== 'INACTIVE'
                                           "
                                         />
@@ -2026,7 +2007,7 @@ watch([inputSearch, currentStatus], async () => {
                       <template v-slot:item="props">
                         <div class="col-3">
                           <PersonCard
-                          :field-selected="fieldSelected"
+                            :field-selected="fieldSelected"
                             history
                             :data="{
                               code: props.row.code,
@@ -2050,39 +2031,39 @@ watch([inputSearch, currentStatus], async () => {
                             }"
                             @history="openHistory(props.row.id)"
                             @update-card="
-                            ()=>{
-                                           if (!listCustomer) return;
+                              () => {
+                                if (!listCustomer) return;
 
-                          customerType = props.row.customerType
-                          const { branch, ...payload } = props.row
-                          currentCustomer = payload
+                                customerType = props.row.customerType;
+                                const { branch, ...payload } = props.row;
+                                currentCustomer = payload;
 
-                          currentCustomerId = props.row.id
+                                currentCustomerId = props.row.id;
 
-                          assignFormData(props.row.id)
- 
+                                assignFormData(props.row.id);
 
-                          infoDrawerEdit = true
-                          openDialogInputForm('INFO', props.row.id)
-                       
-                            }
+                                infoDrawerEdit = true;
+                                openDialogInputForm('INFO', props.row.id);
+                              }
                             "
-                            @enter-card="()=>{
-                                   currentCustomerName = props.row.customerName;
-                          customerType = props.row.customerType;
-                          currentCustomerUrlImage = props.row.imageUrl;
-                          currentCustomerId = props.row.id;
+                            @enter-card="
+                              () => {
+                                currentCustomerName = props.row.customerName;
+                                customerType = props.row.customerType;
+                                currentCustomerUrlImage = props.row.imageUrl;
+                                currentCustomerId = props.row.id;
 
-                          const { branch, ...payload } = props.row;
-                          currentCustomer = payload;
-                          isMainPage = false;
-                            }"
+                                const { branch, ...payload } = props.row;
+                                currentCustomer = payload;
+                                isMainPage = false;
+                              }
+                            "
                             @delete-card="deleteCustomerById(props.row.id)"
                             @toggle-status="
-                               toggleStatusCustomer(
-                            props.row.id,
-                            props.row.status === 'ACTIVE' ? true : false,
-                          );
+                              toggleStatusCustomer(
+                                props.row.id,
+                                props.row.status === 'ACTIVE' ? true : false,
+                              )
                             "
                           />
                         </div>