diff --git a/src/pages/02_personnel-management/MainPage.vue b/src/pages/02_personnel-management/MainPage.vue
index ed128345..9a230993 100644
--- a/src/pages/02_personnel-management/MainPage.vue
+++ b/src/pages/02_personnel-management/MainPage.vue
@@ -637,7 +637,8 @@ async function assignFormData(idEdit: string) {
   }
 }
 
-async function fetchImageList(id: string, selectedName: string) {
+async function fetchImageList(id: string, selectedName?: string) {
+  if (!selectedName) return;
   const res = await userStore.fetchImageListById(id);
   imageList.value = {
     selectedImage: selectedName,
@@ -662,6 +663,16 @@ async function fetchUserList() {
   });
 }
 
+function noPersonnel() {
+  const number =
+    typeStats.value &&
+    Object.entries(typeStats.value).reduce(
+      (acc, [key, value]) => acc + value,
+      0,
+    );
+  return number === 0;
+}
+
 onMounted(async () => {
   navigatorStore.current.title = 'personnel.title';
   navigatorStore.current.path = [{ text: 'personnel.caption', i18n: true }];
@@ -1392,7 +1403,9 @@ watch(
         </template>
 
         <div
-          v-if="userData && userData.total === 0 && !inputSearch"
+          v-if="
+            userData && userData.total === 0 && !inputSearch && noPersonnel()
+          "
           class="full-height column"
         >
           <div class="flex justify-end">
@@ -1413,7 +1426,10 @@ watch(
         </div>
 
         <div
-          v-if="userData?.total === 0 && !!inputSearch"
+          v-if="
+            (userData?.total === 0 && !!inputSearch) ||
+            (userData?.total === 0 && !!statusFilter)
+          "
           class="row col full-width items-center justify-center"
           style="min-height: 250px"
         >
@@ -1985,7 +2001,7 @@ watch(
         const res = await userStore.addImageList(
           v,
           currentUser?.id,
-          Date.now(),
+          Date.now().toString(),
         );
         await fetchImageList(currentUser?.id, res);
       }