diff --git a/src/pages/04_product-service/MainPage.vue b/src/pages/04_product-service/MainPage.vue
index b0efa94d..b3e1b35e 100644
--- a/src/pages/04_product-service/MainPage.vue
+++ b/src/pages/04_product-service/MainPage.vue
@@ -13,6 +13,7 @@ import useProductServiceStore from 'src/stores/product-service';
 import {
   ProductGroup,
   ProductGroupCreate,
+  ProductGroupUpdate,
 } from 'src/stores/product-service/types';
 
 const productServiceStore = useProductServiceStore();
@@ -21,6 +22,7 @@ const {
   fetchStatsProductGroup,
   fetchListProductService,
   createProductService,
+  editProductService,
   deleteProductService,
 } = productServiceStore;
 
@@ -71,6 +73,8 @@ const dialogTotalProduct = ref<boolean>(false);
 const productMode = ref<'group' | 'type' | 'service' | 'product'>('group');
 const productGroup = ref<ProductGroup[]>();
 
+const previousValue = ref();
+
 const formData = ref<ProductGroupCreate>({
   remark: '',
   detail: '',
@@ -120,6 +124,29 @@ async function deleteProductById() {
   });
 }
 
+function undoProductGroup() {
+  console.log('dasd');
+
+  formData.value = {
+    remark: previousValue.value.remark,
+    detail: previousValue.value.detail,
+    name: previousValue.value.name,
+    code: previousValue.value.code,
+  };
+  isEdit.value = false;
+}
+
+function assignFormData(data: ProductGroup) {
+  previousValue.value = data;
+
+  formData.value = {
+    remark: data.remark,
+    detail: data.detail,
+    name: data.name,
+    code: data.code,
+  };
+}
+
 function clearForm() {
   formData.value = {
     remark: '',
@@ -132,7 +159,11 @@ function clearForm() {
 }
 
 async function submitGroup() {
-  await createProductService(formData.value);
+  if (drawerInfo.value) {
+    await editProductService(currentId.value, formData.value);
+  } else {
+    await createProductService(formData.value);
+  }
 
   await fetchListGroups();
   clearForm();
@@ -285,6 +316,7 @@ onMounted(async () => {
             color="var(--pink-6)"
             @view-detail="
               () => {
+                assignFormData(v);
                 currentId = v.id;
                 drawerInfo = true;
               }
@@ -343,7 +375,7 @@ onMounted(async () => {
     ref="formDialogRef"
     v-model:drawerOpen="drawerInfo"
     :title="'test'"
-    :undo="() => (isEdit = false)"
+    :undo="() => undoProductGroup()"
     :isEdit="isEdit"
     :editData="() => (isEdit = true)"
     :submit="() => (isType ? submitType() : submitGroup())"
diff --git a/src/stores/product-service/index.ts b/src/stores/product-service/index.ts
index eff3e092..3fbe29bf 100644
--- a/src/stores/product-service/index.ts
+++ b/src/stores/product-service/index.ts
@@ -74,12 +74,11 @@ const useProductServiceStore = defineStore('api-product-service', () => {
     return false;
   }
 
-  async function editProductService(
-    groupId: string,
-    opts: { data: ProductGroupUpdate },
-  ) {
+  async function editProductService(groupId: string, data: ProductGroupUpdate) {
+    const { code, ...payload } = data;
+
     const res = await api.put<ProductGroupUpdate>(`/product-group/${groupId}`, {
-      ...opts.data,
+      ...payload,
     });
 
     if (!res) return false;