From 686ad6c07040fa816b695aefe402fc8dd7f6c7b6 Mon Sep 17 00:00:00 2001
From: puriphatt <puriphat@frappet.com>
Date: Tue, 20 Aug 2024 10:57:28 +0700
Subject: [PATCH] fix(04): icon outline

---
 src/pages/04_product-service/MainPage.vue | 38 ++++++++++++++---------
 1 file changed, 23 insertions(+), 15 deletions(-)

diff --git a/src/pages/04_product-service/MainPage.vue b/src/pages/04_product-service/MainPage.vue
index 087915b4..9290814e 100644
--- a/src/pages/04_product-service/MainPage.vue
+++ b/src/pages/04_product-service/MainPage.vue
@@ -113,28 +113,28 @@ const stat = ref<
   }[]
 >([
   {
-    icon: 'mdi-folder',
+    icon: 'mdi-folder-outline',
     count: 0,
     label: 'productAndService',
     mode: 'group',
     color: 'pink',
   },
   {
-    icon: 'mdi-folder-table',
+    icon: 'mdi-folder-table-outline',
     count: 0,
     label: 'productAndServiceType',
     mode: 'type',
     color: 'purple',
   },
   {
-    icon: 'mdi-server-network',
+    icon: 'mdi-server-outline',
     count: 0,
     label: 'productService.service.title',
     mode: 'service',
     color: 'orange',
   },
   {
-    icon: 'mdi-shopping',
+    icon: 'mdi-shopping-outline',
     count: 0,
     label: 'product',
     mode: 'product',
@@ -1392,7 +1392,7 @@ watch(
       id="btn-add-product-group"
       style="color: white; background-color: hsla(var(--pink-6-hsl))"
       padding="xs"
-      icon="mdi-folder-multiple-plus"
+      icon="mdi-folder-multiple-plus-outline"
       :label="$t('productAndService')"
       external-label
       label-position="left"
@@ -1411,7 +1411,7 @@ watch(
       label-position="left"
       style="color: white; background-color: hsla(var(--purple-11-hsl))"
       padding="xs"
-      icon="mdi-folder-multiple-plus"
+      icon="mdi-folder-multiple-plus-outline"
       @click="
         () => {
           clearFormGroup();
@@ -1426,7 +1426,7 @@ watch(
       label-position="left"
       style="color: white; background-color: hsla(var(--green-11-hsl))"
       padding="xs"
-      icon="mdi-folder-multiple-plus"
+      icon="mdi-folder-multiple-plus-outline"
       @click="
         async () => {
           productTab = 1;
@@ -1443,7 +1443,7 @@ watch(
       label-position="left"
       style="color: white; background-color: hsla(var(--orange-6-hsl))"
       padding="xs"
-      icon="mdi-folder-multiple-plus"
+      icon="mdi-server-plus-outline"
       @click="
         async () => {
           serviceTab = 1;
@@ -2176,8 +2176,8 @@ watch(
                                   style="scale: 0.8"
                                   :name="
                                     productMode === 'group'
-                                      ? 'mdi-folder'
-                                      : 'mdi-folder-table'
+                                      ? 'mdi-folder-outline'
+                                      : 'mdi-folder-table-outline'
                                   "
                                 />
                               </div>
@@ -2985,8 +2985,8 @@ watch(
                                         size="sm"
                                         :name="
                                           productAndServiceTab === 'product'
-                                            ? 'mdi-shopping'
-                                            : 'mdi-server-network'
+                                            ? 'mdi-shopping-outline'
+                                            : 'mdi-server-outline'
                                         "
                                         style="top: 10%"
                                         :style="`color: var(--${productAndServiceTab === 'product' ? 'teal-10' : 'orange-5'})`"
@@ -3473,7 +3473,11 @@ watch(
         useToggle
         :img="`/images/product-service-${productMode}-avatar-add${productMode === 'type' ? ($q.dark.isActive ? '-d' : '-l') : ''}.png`"
         :toggleTitle="$t('formDialogTitleUseStatus')"
-        :icon="productMode === 'group' ? 'mdi-folder-plus' : 'mdi-folder-table'"
+        :icon="
+          productMode === 'group'
+            ? 'mdi-folder-plus-outline'
+            : 'mdi-folder-table-outline'
+        "
         :title="formDataGroup.name"
         :caption="formDataGroup.code"
         :menu="[
@@ -3603,7 +3607,11 @@ watch(
           hideFade
           :useToggle="actionDisplay"
           :readonly="!isEdit"
-          :icon="editByTree === 'group' ? 'mdi-folder' : 'mdi-folder-table'"
+          :icon="
+            editByTree === 'group'
+              ? 'mdi-folder-outline'
+              : 'mdi-folder-table-outline'
+          "
           :fallbackCover="`/images/product-service-${editByTree}-banner.png`"
           v-model:toggle-status="currentStatusGroupType"
           :color="`hsla(var(${
@@ -4020,7 +4028,7 @@ watch(
         :active="formDataProduct.status !== 'INACTIVE'"
         :title="formDataProduct.name"
         :caption="formDataProduct.code"
-        icon="mdi-shopping"
+        icon="mdi-shopping-outline"
         fallbackImg="/images/product-avatar.png"
         color="var(--teal-10)"
         :readonly="!infoProductEdit"