feat: เพิ่ม รูป

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',

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>

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();