diff --git a/src/pages/04_product-service/MainPage.vue b/src/pages/04_product-service/MainPage.vue
index 417c0e85..a9767fa8 100644
--- a/src/pages/04_product-service/MainPage.vue
+++ b/src/pages/04_product-service/MainPage.vue
@@ -972,6 +972,7 @@ function assignFormDataProduct(data: ProductList) {
     code: data.code,
     image: undefined,
     registeredBranchId: data.registeredBranchId,
+    status: data.status,
   };
 
   formDataProduct.value = { ...prevProduct.value };
@@ -3642,7 +3643,7 @@ watch(
       }
     "
   >
-    <div class="full-width full-height">
+    <div class="full-width full-height q-pa-lg">
       <div class="row items-center">
         <q-space />
         <q-input
@@ -3665,7 +3666,7 @@ watch(
       <div>
         <AppBox
           no-padding
-          class="row q-mt-sm q-col-gutter-sm"
+          class="row q-mt-md q-col-gutter-sm"
           style="background: none"
         >
           <div
@@ -3877,10 +3878,9 @@ watch(
   >
     <div class="q-mx-lg q-mt-lg">
       <ProfileBanner
-        active
         hideFade
         useToggle
-        hideActive
+        :active="formDataProduct.status !== 'INACTIVE'"
         icon="mdi-shopping"
         fallbackImg="/images/product-avatar.png"
         color="var(--teal-10)"
@@ -3958,6 +3958,7 @@ watch(
           v-model:name="formDataProduct.name"
           v-model:code="formDataProduct.code"
           v-model:process="formDataProduct.process"
+          disableCode
           dense
           separator
         />
@@ -4189,22 +4190,22 @@ watch(
 
   <!-- manage work name -->
   <DialogForm
-    no-address
-    no-app-box
-    no-footer
+    hideFooter
     height="65vh"
     width="65%"
     v-model:modal="manageWorkNameDialog"
     :title="$t('manage')"
     :close="triggerConfirmCloseWork"
   >
-    <WorkNameManagement
-      ref="workNameRef"
-      v-model:nameList="workNameItems"
-      @delete="confirmDeleteWork"
-      @edit="editWork"
-      @add="createWork"
-    />
+    <div class="q-pa-lg full-height">
+      <WorkNameManagement
+        ref="workNameRef"
+        v-model:nameList="workNameItems"
+        @delete="confirmDeleteWork"
+        @edit="editWork"
+        @add="createWork"
+      />
+    </div>
   </DialogForm>
 
   <!-- edit service -->
@@ -4318,6 +4319,7 @@ watch(
           :readonly="!infoServiceEdit"
           dense
           service
+          disableCode
           v-model:options-branch="branchOption"
           v-model:registered-branch-id="
             formDataProductService.registeredBranchId