diff --git a/src/pages/02_personnel-management/MainPage.vue b/src/pages/02_personnel-management/MainPage.vue
index 6b219cbf..08a0a957 100644
--- a/src/pages/02_personnel-management/MainPage.vue
+++ b/src/pages/02_personnel-management/MainPage.vue
@@ -604,6 +604,7 @@ watch(
           <q-menu class="bordered">
             <q-list v-close-popup dense>
               <q-item
+                id="btn-filter-all"
                 clickable
                 class="flex items-center"
                 :class="{ 'app-text-info': statusFilter === 'all' }"
@@ -612,6 +613,7 @@ watch(
                 {{ $t('all') }}
               </q-item>
               <q-item
+                id="btn-filter-active"
                 clickable
                 class="flex items-center"
                 :class="{
@@ -622,6 +624,7 @@ watch(
                 {{ $t('statusACTIVE') }}
               </q-item>
               <q-item
+                id="btn-filter-inactive"
                 clickable
                 class="flex items-center"
                 :class="{
@@ -635,6 +638,7 @@ watch(
           </q-menu>
         </q-btn>
         <q-input
+          for="input-search"
           style="width: 250px"
           outlined
           dense
diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 9fc24ba1..9edf6b9f 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -1319,6 +1319,7 @@ watch(currentStatus, async () => {
           </div>
 
           <q-input
+            for="input-search"
             outlined
             dense
             style="width: 250px"
@@ -1333,6 +1334,7 @@ watch(currentStatus, async () => {
           />
 
           <q-btn
+            id="btn-status"
             icon="mdi-tune-vertical-variant"
             size="sm"
             :color="$q.dark.isActive ? 'dark' : 'white'"
@@ -1343,6 +1345,7 @@ watch(currentStatus, async () => {
             <q-menu class="bordered">
               <q-list v-close-popup dense>
                 <q-item
+                  id="btn-status-all"
                   clickable
                   class="flex items-center"
                   @click="currentStatus = 'All'"
@@ -1350,6 +1353,7 @@ watch(currentStatus, async () => {
                   {{ $t('all') }}
                 </q-item>
                 <q-item
+                  id="btn-status-active"
                   clickable
                   class="flex items-center"
                   @click="currentStatus = 'ACTIVE'"
@@ -1357,6 +1361,7 @@ watch(currentStatus, async () => {
                   {{ $t('statusACTIVE') }}
                 </q-item>
                 <q-item
+                  id="btn-status-inactive"
                   clickable
                   class="flex items-center"
                   @click="currentStatus = 'INACTIVE'"