From 12c17dfd06422c35fc05a0a29b06fbe49ff8bc58 Mon Sep 17 00:00:00 2001
From: Net <93821485+somnetsak123@users.noreply.github.com>
Date: Wed, 3 Jul 2024 14:13:22 +0700
Subject: [PATCH] =?UTF-8?q?feat:=20=E0=B9=80=E0=B8=9E=E0=B8=B4=E0=B9=88?=
 =?UTF-8?q?=E0=B8=A1=20=E0=B8=A3=E0=B8=B9=E0=B8=9B?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/01_branch-management/MainPage.vue   | 22 ++++++++++++++-----
 src/pages/03_customer-management/MainPage.vue |  4 ++--
 src/pages/04_product-service/MainPage.vue     | 14 ++++++++----
 3 files changed, 29 insertions(+), 11 deletions(-)

diff --git a/src/pages/01_branch-management/MainPage.vue b/src/pages/01_branch-management/MainPage.vue
index 61a35296..e8a54d61 100644
--- a/src/pages/01_branch-management/MainPage.vue
+++ b/src/pages/01_branch-management/MainPage.vue
@@ -99,8 +99,18 @@ async function calculateStats() {
 
   if (_stats) {
     stats.value = [
-      { count: _stats.hq, label: 'branchHQLabel', color: 'pink' },
-      { count: _stats.br, label: 'branchLabel', color: 'purple' },
+      {
+        icon: 'mdi-home',
+        count: _stats.hq,
+        label: 'branchHQLabel',
+        color: 'pink',
+      },
+      {
+        icon: 'mdi-office-building',
+        count: _stats.br,
+        label: 'branchLabel',
+        color: 'purple',
+      },
     ];
   }
 }
@@ -140,9 +150,9 @@ const fieldSelectedBranch = ref<{
   value: 'branchHQLabel',
 });
 
-const stats = ref<{ count: number; label: string; color: 'pink' | 'purple' }[]>(
-  [],
-);
+const stats = ref<
+  { icon: string; count: number; label: string; color: 'pink' | 'purple' }[]
+>([]);
 
 const defaultFormData = {
   headOfficeId: null,
@@ -379,11 +389,13 @@ async function onSubmit() {
   if (_stats) {
     stats.value = [
       {
+        icon: 'mdi-home',
         count: _stats.hq,
         label: 'branchHQLabel',
         color: 'pink',
       },
       {
+        icon: 'mdi-domain',
         count: _stats.br,
         label: 'branchLabel',
         color: 'purple',
diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 592e5dce..01b761a0 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -1299,7 +1299,7 @@ watch([inputSearch, currentStatus], async () => {
     <q-fab-action
       v-if="selectorLabel === 'EMPLOYER' || !selectorLabel"
       id="add-customer-legal-entity"
-      style="color: white; background-color: hsla(var(--purple-11-hsl))"
+      style="color: white; background-color: hsla(var(--violet-11-hsl))"
       @click="triggerCreate('CORP')"
       padding="xs"
       icon="mdi-office-building"
@@ -1314,7 +1314,7 @@ watch([inputSearch, currentStatus], async () => {
       external-label
       label-position="left"
       @click="triggerCreate('PERS')"
-      style="color: white; background-color: hsla(var(--teal-9-hsl))"
+      style="color: white; background-color: hsla(var(--teal-10-hsl))"
       padding="xs"
       icon="mdi-account-plus"
     ></q-fab-action>
diff --git a/src/pages/04_product-service/MainPage.vue b/src/pages/04_product-service/MainPage.vue
index ece57877..6ab97a91 100644
--- a/src/pages/04_product-service/MainPage.vue
+++ b/src/pages/04_product-service/MainPage.vue
@@ -93,15 +93,21 @@ const { workNameItems } = storeToRefs(productServiceStore);
 
 const stat = ref<
   {
+    icon: string;
     count: number;
     label: string;
     color: 'pink' | 'purple' | 'green' | 'orange';
   }[]
 >([
-  { count: 0, label: 'productAndService', color: 'pink' },
-  { count: 0, label: 'productAndServiceType', color: 'purple' },
-  { count: 0, label: 'service', color: 'orange' },
-  { count: 0, label: 'product', color: 'green' },
+  { icon: 'mdi-folder', count: 0, label: 'productAndService', color: 'pink' },
+  {
+    icon: 'mdi-folder',
+    count: 0,
+    label: 'productAndServiceType',
+    color: 'purple',
+  },
+  { icon: 'mdi-folder', count: 0, label: 'service', color: 'orange' },
+  { icon: 'mdi-folder', count: 0, label: 'product', color: 'green' },
 ]);
 
 const { t } = useI18n();