From 43e718a9b90e0c9940b63d826a3064389a9ab939 Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Thu, 4 Apr 2024 18:08:37 +0700
Subject: [PATCH] feat: Personnel => i18n

---
 .../01_branch-management/BtnAddComponet.vue       |  2 +-
 src/components/SelectorList.vue                   |  2 +-
 src/i18n/en-US/personnel-main-page.ts             |  8 ++++++++
 src/i18n/th-th/personnel-main-page.ts             |  8 ++++++++
 src/pages/02_personnel-management/MainPage.vue    | 15 ++++++++-------
 5 files changed, 26 insertions(+), 9 deletions(-)

diff --git a/src/components/01_branch-management/BtnAddComponet.vue b/src/components/01_branch-management/BtnAddComponet.vue
index 1a864b1b..d5f289e2 100644
--- a/src/components/01_branch-management/BtnAddComponet.vue
+++ b/src/components/01_branch-management/BtnAddComponet.vue
@@ -16,7 +16,7 @@ defineProps<{
         round
       />
     </div>
-    <div class="row q-mt-sm color-text">{{ label }}</div>
+    <div v-if="label" class="row q-mt-sm color-text">{{ $t(label) }}</div>
   </div>
 </template>
 
diff --git a/src/components/SelectorList.vue b/src/components/SelectorList.vue
index 8752cf36..fcc26258 100644
--- a/src/components/SelectorList.vue
+++ b/src/components/SelectorList.vue
@@ -27,7 +27,7 @@ defineProps<{
         "
         @click="selector = v.label"
       >
-        <q-item-section>{{ v.label }}</q-item-section>
+        <q-item-section>{{ $t(v.label) }}</q-item-section>
         <div class="dot text-weight-bold">1</div>
       </q-item>
     </q-list>
diff --git a/src/i18n/en-US/personnel-main-page.ts b/src/i18n/en-US/personnel-main-page.ts
index 82c76a9a..17b40da7 100644
--- a/src/i18n/en-US/personnel-main-page.ts
+++ b/src/i18n/en-US/personnel-main-page.ts
@@ -2,4 +2,12 @@ export default {
   personnelManagement: 'Personnel Management',
   personnelTooltipTitle: 'No personnel yet?',
   personnelTooltipCaption: 'Click + to add a personnel',
+  personnelAdd: 'Add personnel',
+
+  personnelSelector1: 'Employee',
+  personnelSelector2: 'Courier',
+  personnelSelector3: 'Agent',
+  personnelSelector4: 'Agency',
+
+  personnelStatTitle: 'Summary of data'
 };
diff --git a/src/i18n/th-th/personnel-main-page.ts b/src/i18n/th-th/personnel-main-page.ts
index bb4a4a9a..246be1ea 100644
--- a/src/i18n/th-th/personnel-main-page.ts
+++ b/src/i18n/th-th/personnel-main-page.ts
@@ -2,4 +2,12 @@ export default {
   personnelManagement: 'จัดการบุคลากร',
   personnelTooltipTitle: 'ยังไม่มีข้อมูลบุคลากร',
   personnelTooltipCaption: 'คลิก + เพื่อเพิ่มบุคลากร',
+  personnelAdd: 'เพิ่มข้อมูลบุคลากร',
+
+  personnelSelector1: 'พนักงาน',
+  personnelSelector2: 'พนักงานส่งเอกสาร',
+  personnelSelector3: 'ตัวแทน',
+  personnelSelector4: 'เอเจนซี่',
+
+  personnelStatTitle: 'สรุปจำนวนข้อมูล',
 };
diff --git a/src/pages/02_personnel-management/MainPage.vue b/src/pages/02_personnel-management/MainPage.vue
index 037b727f..f4fade9b 100644
--- a/src/pages/02_personnel-management/MainPage.vue
+++ b/src/pages/02_personnel-management/MainPage.vue
@@ -102,19 +102,19 @@ const branchStat = ref<
 
 const selectorList = [
   {
-    label: 'พนักงาน',
+    label: 'personnelSelector1',
     count: 0,
   },
   {
-    label: 'พนักงานส่งเอกสาร',
+    label: 'personnelSelector2',
     count: 0,
   },
   {
-    label: 'ตัวแทน',
+    label: 'personnelSelector3',
     count: 0,
   },
   {
-    label: 'เอเจนซี่',
+    label: 'personnelSelector4',
     count: 0,
   },
 ] satisfies InstanceType<typeof SelectorList>['$props']['list'];
@@ -137,7 +137,7 @@ const selectorList = [
       <!-- stat -->
       <AppBox bordered class="column full-width" style="overflow-x: auto">
         <span class="text-weight-bold text-subtitle1">
-          สรุปจำนวนข้อมูล{{ selectorLabel }}
+          {{ $t('personnelStatTitle') + selectorLabel }}
         </span>
         <div class="row q-pt-lg">
           <stat-card-componet :branch="branchStat" class="no-wrap" />
@@ -147,7 +147,8 @@ const selectorList = [
 
     <!-- main -->
     <AppBox bordered style="width: 100%; height: 580px; overflow-y: auto">
-      <PersonCard :list="person" class="q-mb-md" />
+      <!-- <PersonCard :list="person" class="q-mb-md" /> -->
+
       <div class="column" style="height: 100%">
         <div class="col-1 self-end">
           <div class="row">
@@ -161,7 +162,7 @@ const selectorList = [
 
         <div class="col self-center" style="display: flex; align-items: center">
           <btn-add-componet
-            :label="'เพิ่มข้อมูลบุคลากร'"
+            :label="'personnelAdd'"
             @trigger="
               () => {
                 console.log('test');