diff --git a/src/pages/02_personnel-management/MainPage.vue b/src/pages/02_personnel-management/MainPage.vue
index 489470b3..685c5b28 100644
--- a/src/pages/02_personnel-management/MainPage.vue
+++ b/src/pages/02_personnel-management/MainPage.vue
@@ -1719,6 +1719,12 @@ watch(
         :caption="`${formData.firstNameEN} ${formData.lastNameEN}`"
         @view="imageDialog = true"
         @edit="refImageUpload && refImageUpload.browse()"
+        @update:toggle-status="
+          () => {
+            formData.status =
+              formData.status === 'CREATED' ? 'INACTIVE' : 'CREATED';
+          }
+        "
       />
     </div>
     <!-- <template #prepend>
@@ -1925,8 +1931,8 @@ watch(
 }
 
 .status-inactive {
-  --_branch-status-color: var(--red-4-hsl);
-  --_branch-badge-bg: var(--red-4-hsl);
+  --_branch-status-color: var(--stone-5-hsl);
+  --_branch-badge-bg: var(--stone-5-hsl);
   filter: grayscale(0.5);
   opacity: 0.5;
 }