From 1e15dcc8565dc5def040f8c3054faa3f5ae1e798 Mon Sep 17 00:00:00 2001
From: Thanaphon Frappet <thanaphon@frappet.com>
Date: Thu, 21 Nov 2024 09:48:46 +0700
Subject: [PATCH] refactor: add id

---
 .../03_customer-management/BranchCardCustomer.vue          | 2 ++
 src/components/03_customer-management/TableEmpoloyee.vue   | 3 ++-
 src/pages/03_customer-management/BranchPage.vue            | 7 +++++--
 3 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/components/03_customer-management/BranchCardCustomer.vue b/src/components/03_customer-management/BranchCardCustomer.vue
index 5ffa6139..85cd55d0 100644
--- a/src/components/03_customer-management/BranchCardCustomer.vue
+++ b/src/components/03_customer-management/BranchCardCustomer.vue
@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 defineProps<{
+  prefixId?: string;
   inactive?: boolean;
   color?: 'none' | 'pers' | 'corp';
   data: {
@@ -52,6 +53,7 @@ defineProps<{
 
       <div class="branch-card__action">
         <q-btn
+          :id="`${prefixId}-btn-view-detail`"
           icon="mdi-eye-outline"
           size="sm"
           dense
diff --git a/src/components/03_customer-management/TableEmpoloyee.vue b/src/components/03_customer-management/TableEmpoloyee.vue
index 993fcd5d..4c11f4ed 100644
--- a/src/components/03_customer-management/TableEmpoloyee.vue
+++ b/src/components/03_customer-management/TableEmpoloyee.vue
@@ -21,6 +21,7 @@ const prop = withDefaults(
     fieldSelected?: string[];
     inTable?: boolean;
     addButton?: boolean;
+    prefixId?: string;
   }>(),
   {
     gridView: false,
@@ -74,7 +75,7 @@ defineEmits<{
           </span>
           <span v-if="col.label === '' && !!addButton">
             <AddButton
-              id="btn-add-employee"
+              :id="`${prefixId || 'default'}-btn-add-employee`"
               icon-only
               @click.stop="() => $emit('add')"
             />
diff --git a/src/pages/03_customer-management/BranchPage.vue b/src/pages/03_customer-management/BranchPage.vue
index e964e085..c42f28c9 100644
--- a/src/pages/03_customer-management/BranchPage.vue
+++ b/src/pages/03_customer-management/BranchPage.vue
@@ -516,6 +516,7 @@ watch(
               <q-btn
                 dense
                 flat
+                :id="`btn-show-employee-${currentCustomerName}`"
                 @click.stop="
                   async () => {
                     currentBranchEmployee = props.row.id;
@@ -551,7 +552,7 @@ watch(
               </q-btn>
               <q-btn
                 icon="mdi-eye-outline"
-                :id="`btn-eye-${props.row.customerName}`"
+                :id="`btn-eye-${currentCustomerName}`"
                 size="sm"
                 dense
                 round
@@ -570,6 +571,7 @@ watch(
             <q-td colspan="100%" style="padding: 16px">
               <div class="text-center">
                 <TableEmpoloyee
+                  :prefix-id="props.row.registerName || props.row.firstName"
                   add-button
                   in-table
                   :list-employee="listEmployee"
@@ -607,6 +609,7 @@ watch(
         <template #item="props">
           <div class="col-12 col-md-6">
             <BranchCardCustomer
+              :prefix-id="props.row.registerName || props.row.firstName"
               class="surface-1"
               :inactive="props.row.status === 'INACTIVE'"
               :color="customerType === 'CORP' ? 'corp' : 'pers'"
@@ -775,7 +778,7 @@ watch(
             </div>
           </div>
           <EmployerFormAbout
-            prefixId="dialog"
+            prefix-id="dialog"
             :readonly="customerBranchFormState.dialogType === 'info'"
             class="q-mb-xl"
             :index="