diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index 79095e9a..1058e088 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -473,7 +473,8 @@ function createCustomerForm(customerType: 'CORP' | 'PERS') {
 }
 
 function createEmployeeForm() {
-  employeeFormStore.resetFormDataEmployee();
+  employeeFormStore.resetFormDataEmployee(true);
+  employeeFormState.value.dialogType = 'create';
   employeeFormState.value.dialogModal = true;
 }
 
@@ -1947,11 +1948,24 @@ watch(
     :undo="() => employeeFormUndo(false)"
     :submit="
       async () => {
-        await employeeFormStore.submitPersonal();
+        if (employeeFormState.currentTab === 'personalInfo') {
+          await employeeFormStore.submitPersonal();
+        }
+        if (employeeFormState.currentTab === 'healthCheck') {
+          await employeeFormStore.submitHealthCheck();
+        }
+        {
+          if (employeeFormState.currentTab === 'workHistory') {
+            console.log('ทำงาน');
+
+            await employeeFormStore.submitWorkHistory();
+          }
+        }
         await fetchListEmployee();
       }
     "
-    :close="
+    :close="() => {}"
+    :show="
       () => {
         employeeFormStore.resetFormDataEmployee(true);
       }
@@ -1967,7 +1981,6 @@ watch(
     "
   >
     <div class="q-mx-lg q-mt-lg">
-      {{ employeeFormState.statusSavePersonal }}
       <ProfileBanner
         active
         useToggle
@@ -2186,6 +2199,19 @@ watch(
           v-model:insuranceCompanyOption="
             optionStore.globalOption.insurancePlace
           "
+          @save="
+            (index) => {
+              employeeFormState.currentIndex = index;
+            }
+          "
+          @edit="
+            (index) => {
+              if (currentFromDataEmployee.employeeCheckup?.[index].statusSave) {
+                currentFromDataEmployee.employeeCheckup[index].statusSave =
+                  false;
+              }
+            }
+          "
         />
         <FormEmployeeWorkHistory
           v-if="employeeFormState.currentTab === 'workHistory'"
@@ -2197,6 +2223,18 @@ watch(
           v-model:position-name-option="optionStore.globalOption.position"
           v-model:job-type-option="optionStore.globalOption.businessType"
           v-model:workplace-option="optionStore.globalOption.area"
+          @save="
+            (index) => {
+              employeeFormState.currentIndex = index;
+            }
+          "
+          @edit="
+            (index) => {
+              if (currentFromDataEmployee.employeeWork?.[index].statusSave) {
+                currentFromDataEmployee.employeeWork[index].statusSave = false;
+              }
+            }
+          "
         />
         <FormEmployeeOther
           v-if="employeeFormState.currentTab === 'other'"
@@ -2266,7 +2304,7 @@ watch(
     </template>
   </ImageUploadDialog>
 
-  <!-- นายจ้างนิติ -->
+  <!-- ลูกจ้าง -->
   <DrawerInfo
     v-model:drawer-open="employeeFormState.drawerModal"
     :is-edit="employeeFormState.isEmployeeEdit"
@@ -2287,10 +2325,22 @@ watch(
     "
     :submit="
       async () => {
-        await employeeFormStore.submitPersonal();
+        if (employeeFormState.currentTab === 'personalInfo') {
+          await employeeFormStore.submitPersonal();
+        }
+        if (employeeFormState.currentTab === 'healthCheck') {
+          await employeeFormStore.submitHealthCheck();
+        }
+        await fetchListEmployee();
+
         employeeFormState.isEmployeeEdit = false;
       }
     "
+    :close="
+      () => {
+        employeeFormStore.resetFormDataEmployee(true);
+      }
+    "
   >
     <div class="full-height full-width column">
       <div class="q-mx-lg q-mt-lg">
@@ -2472,6 +2522,21 @@ watch(
             v-model:insuranceCompanyOption="
               optionStore.globalOption.insurancePlace
             "
+            @save="
+              (index) => {
+                employeeFormState.currentIndex = index;
+              }
+            "
+            @edit="
+              (index) => {
+                if (
+                  currentFromDataEmployee.employeeCheckup?.[index].statusSave
+                ) {
+                  currentFromDataEmployee.employeeCheckup[index].statusSave =
+                    false;
+                }
+              }
+            "
           />
           <FormEmployeeWorkHistory
             v-if="employeeFormState.currentTab === 'workHistory'"
diff --git a/src/pages/03_customer-management/form.ts b/src/pages/03_customer-management/form.ts
index c3ea5e05..f9d2a317 100644
--- a/src/pages/03_customer-management/form.ts
+++ b/src/pages/03_customer-management/form.ts
@@ -238,6 +238,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
     drawerModal: boolean;
     currentEmployeeCode: string;
     currentEmployee: Employee | null;
+    currentIndex: number;
     profileUrl: string;
     isEmployeeEdit: boolean;
     profileSubmit: boolean;
@@ -265,6 +266,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
         }
       | undefined;
   }>({
+    currentIndex: 0,
     statusSavePersonal: false,
     drawerModal: false,
     imageDialog: false,
@@ -385,6 +387,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
 
   function resetFormDataEmployee(clean = false) {
     if (clean) {
+      state.value.currentTab = 'personalInfo';
       state.value.formDataEmployeeOwner = undefined;
       resetEmployeeData = structuredClone(defaultFormData);
       state.value.statusSavePersonal = false;
@@ -393,6 +396,77 @@ export const useEmployeeForm = defineStore('form-employee', () => {
     currentFromDataEmployee.value = structuredClone(resetEmployeeData);
   }
 
+  async function submitWorkHistory() {
+    if (!currentFromDataEmployee.value.employeeWork) return;
+
+    if (
+      !currentFromDataEmployee.value.employeeWork[state.value.currentIndex].id
+    ) {
+      const res = await employeeStore.createEmployeeWork(
+        currentFromDataEmployee.value?.id || '',
+        currentFromDataEmployee.value.employeeWork[state.value.currentIndex],
+      );
+      if (res) {
+        currentFromDataEmployee.value.employeeWork[
+          state.value.currentIndex
+        ].id = res.id;
+        currentFromDataEmployee.value.employeeWork[
+          state.value.currentIndex
+        ].statusSave = true;
+      }
+    } else {
+      const res = await employeeStore.editByIdEmployeeWork(
+        currentFromDataEmployee.value?.id || '',
+        currentFromDataEmployee.value.employeeWork[state.value.currentIndex],
+      );
+
+      if (res) {
+        currentFromDataEmployee.value.employeeWork[
+          state.value.currentIndex
+        ].statusSave = true;
+      }
+    }
+
+    await assignFormDataEmployee(currentFromDataEmployee.value.id);
+  }
+
+  async function submitHealthCheck() {
+    if (!currentFromDataEmployee.value.employeeCheckup) return;
+
+    if (
+      !currentFromDataEmployee.value.employeeCheckup[state.value.currentIndex]
+        .id
+    ) {
+      const res = await employeeStore.createEmployeeCheckup(
+        state.value.currentEmployee?.id || '',
+        currentFromDataEmployee.value.employeeCheckup[state.value.currentIndex],
+      );
+
+      if (res) {
+        currentFromDataEmployee.value.employeeCheckup[
+          state.value.currentIndex
+        ].id = res.id;
+
+        currentFromDataEmployee.value.employeeCheckup[
+          state.value.currentIndex
+        ].statusSave = true;
+      }
+    } else {
+      const res = await employeeStore.editByIdEmployeeCheckup(
+        state.value.currentEmployee?.id || '',
+        currentFromDataEmployee.value.employeeCheckup[state.value.currentIndex],
+      );
+
+      if (res) {
+        currentFromDataEmployee.value.employeeCheckup[
+          state.value.currentIndex
+        ].statusSave = true;
+      }
+    }
+
+    await assignFormDataEmployee(currentFromDataEmployee.value.id);
+  }
+
   async function submitPersonal() {
     if (state.value.dialogType === 'create') {
       const res = await employeeStore.create({
@@ -403,8 +477,10 @@ export const useEmployeeForm = defineStore('form-employee', () => {
         employeeCheckup: [],
         employeeOtherInfo: undefined,
       });
+
       if (res) {
         await assignFormDataEmployee(res.id);
+        currentFromDataEmployee.value.id = res.id;
         state.value.statusSavePersonal = true;
       }
     }
@@ -462,9 +538,20 @@ export const useEmployeeForm = defineStore('form-employee', () => {
         provinceId: province?.id,
         districtId: district?.id,
         subDistrictId: subDistrict?.id,
-        employeeCheckup: structuredClone(playlond.employeeCheckup),
-        employeeOtherInfo: structuredClone(playlond.employeeOtherInfo),
-        employeeWork: structuredClone(playlond.employeeWork),
+        employeeCheckup: structuredClone(
+          playlond.employeeCheckup?.length === 0
+            ? defaultFormData.employeeCheckup
+            : playlond.employeeCheckup?.map((item) => ({
+                ...item,
+                statusSave: true,
+              })),
+        ),
+        employeeOtherInfo: structuredClone(playlond.employeeOtherInfo || {}),
+        employeeWork: structuredClone(
+          playlond.employeeWork?.length === 0
+            ? defaultFormData.employeeWork
+            : playlond.employeeWork,
+        ),
         image: null,
       };
 
@@ -518,7 +605,9 @@ export const useEmployeeForm = defineStore('form-employee', () => {
     currentFromDataEmployee,
     resetEmployeeData,
 
+    submitWorkHistory,
     submitPersonal,
+    submitHealthCheck,
 
     resetFormDataEmployee,
     assignFormDataEmployee,
diff --git a/src/stores/employee/index.ts b/src/stores/employee/index.ts
index a4d2c44b..06d24d94 100644
--- a/src/stores/employee/index.ts
+++ b/src/stores/employee/index.ts
@@ -82,7 +82,7 @@ const useEmployeeStore = defineStore('api-employee', () => {
       transactionId?: string;
     },
   ) {
-    const { code, image, ...payload } = data;
+    const { id, code, image, ...payload } = data;
     const res = await api.post<
       Employee & { profileImageUrl: string; profileImageUploadUrl: string }
     >('/employee', payload, {
@@ -196,9 +196,9 @@ const useEmployeeStore = defineStore('api-employee', () => {
       transactionId?: string;
     },
   ) {
-    const { ...payload } = data;
+    const { id, statusSave, ...payload } = data;
     const res = await api.put<EmployeeCheckupCreate>(
-      `/employee/${employeeId}/checkup}`,
+      `/employee/${employeeId}/checkup/${id}`,
       { ...payload },
       {
         headers: {
@@ -269,7 +269,7 @@ const useEmployeeStore = defineStore('api-employee', () => {
   }
 
   async function editById(
-    id: string,
+    employeeId: string,
     data: Partial<EmployeeCreate>,
     flow?: {
       sessionId?: string;
@@ -277,10 +277,10 @@ const useEmployeeStore = defineStore('api-employee', () => {
       transactionId?: string;
     },
   ) {
-    const { code, image, ...payload } = data;
+    const { id, code, image, ...payload } = data;
     const res = await api.put<
       Employee & { imageUrl: string; profileImageUploadUrl: string }
-    >(`/employee/${id}`, payload, {
+    >(`/employee/${employeeId}`, payload, {
       headers: {
         'X-Session-Id': flow?.sessionId,
         'X-Rtid': flow?.refTransactionId || flowStore.rtid,
diff --git a/src/stores/employee/types.ts b/src/stores/employee/types.ts
index 2193fe5b..c9864991 100644
--- a/src/stores/employee/types.ts
+++ b/src/stores/employee/types.ts
@@ -57,6 +57,7 @@ export type Employee = {
 };
 
 export type EmployeeCreate = {
+  id?: string;
   code: string;
   image: File | null;
   customerBranchId: string;