From a31fd5f40e6ccbbe6bc689a5164cac555ffc467d Mon Sep 17 00:00:00 2001
From: Net <thanaphon@frappet.com>
Date: Wed, 21 Aug 2024 16:18:00 +0700
Subject: [PATCH] refactor: add border

---
 src/pages/03_customer-management/MainPage.vue | 33 ++++++++++++-------
 1 file changed, 21 insertions(+), 12 deletions(-)

diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 6e3051d3..7baef848 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -989,20 +989,29 @@ const emptyCreateDialog = ref(false);
                                 margin-bottom: var(--size-2);
                               "
                             >
-                              <div class="branch-card__icon">
-                                <q-avatar size="md">
-                                  <q-img
-                                    :src="`
+                              <div
+                                :style="`
+                                  border-radius: 50%;
+                                  border-style: solid;
+                                  border-width: 2px;
+                                  border-color: hsl(var(${props.row.customerType === 'CORP' ? '--violet-11-hsl' : '--teal-10-hsl'}));
+                                `"
+                              >
+                                <div class="branch-card__icon">
+                                  <q-avatar size="md">
+                                    <q-img
+                                      :src="`
                                       ${props.row.imageUrl ?? '/images/customer-' + props.row.customerType + '-avartar.png'}
                                     `"
-                                  >
-                                    <template #error>
-                                      <q-img
-                                        src="/images/customer-CORP-avartar.png"
-                                      />
-                                    </template>
-                                  </q-img>
-                                </q-avatar>
+                                    >
+                                      <template #error>
+                                        <q-img
+                                          src="/images/customer-CORP-avartar.png"
+                                        />
+                                      </template>
+                                    </q-img>
+                                  </q-avatar>
+                                </div>
                               </div>
                             </div>
                             <div class="col">