diff --git a/src/pages/03_customer-management/form.ts b/src/pages/03_customer-management/form.ts
index bd159bb8..781e3cbf 100644
--- a/src/pages/03_customer-management/form.ts
+++ b/src/pages/03_customer-management/form.ts
@@ -17,35 +17,35 @@ export const useCustomerForm = defineStore('form-customer', () => {
     taxNo: '',
     registeredBranchId: branchStore.currentMyBranch?.id || '',
     customerBranch: [
-      {
-        code: '',
-        branchNo: 1,
-        address: '',
-        addressEN: '',
-        provinceId: '',
-        districtId: '',
-        subDistrictId: '',
-        zipCode: '',
-        email: '',
-        telephoneNo: '',
-        name: '',
-        status: 'CREATED',
-        taxNo: '',
-        nameEN: '',
-        legalPersonNo: '',
-        registerName: '',
-        registerDate: new Date(),
-        authorizedCapital: '',
-        employmentOffice: '',
-        bussinessType: '',
-        bussinessTypeEN: '',
-        jobPosition: '',
-        jobPositionEN: '',
-        jobDescription: '',
-        saleEmployee: '',
-        payDate: new Date(),
-        wageRate: 0,
-      },
+      // {
+      //   code: '',
+      //   branchNo: 1,
+      //   address: '',
+      //   addressEN: '',
+      //   provinceId: '',
+      //   districtId: '',
+      //   subDistrictId: '',
+      //   zipCode: '',
+      //   email: '',
+      //   telephoneNo: '',
+      //   name: '',
+      //   status: 'CREATED',
+      //   taxNo: '',
+      //   nameEN: '',
+      //   legalPersonNo: '',
+      //   registerName: '',
+      //   registerDate: new Date(),
+      //   authorizedCapital: '',
+      //   employmentOffice: '',
+      //   bussinessType: '',
+      //   bussinessTypeEN: '',
+      //   jobPosition: '',
+      //   jobPositionEN: '',
+      //   jobDescription: '',
+      //   saleEmployee: '',
+      //   payDate: new Date(),
+      //   wageRate: 0,
+      // },
     ],
     image: null,
   };
@@ -55,13 +55,19 @@ export const useCustomerForm = defineStore('form-customer', () => {
   const state = ref<{
     dialogType: 'info' | 'create' | 'edit';
     dialogOpen: boolean;
+    dialogModal: boolean;
     branchIndex: number;
-    customerType: 'CORP' | "PERS"
+    customerType: 'CORP' | 'PERS';
+    saveMode: 'customer' | 'branch';
+    editId?: string;
   }>({
     dialogType: 'info',
     dialogOpen: false,
+    dialogModal: false,
     branchIndex: 0,
-    customerType: "CORP"
+    customerType: 'CORP',
+    saveMode: 'customer',
+    editId: '',
   });
 
   function isFormDataDifferent() {
@@ -123,7 +129,21 @@ export const useCustomerForm = defineStore('form-customer', () => {
     currentFormData.value = structuredClone(resetCustomerData);
   }
 
-  // TODO: Submit function
+  async function submitForm() {
+    if (state.value.dialogType === 'edit' && !state.value.editId) {
+      throw new Error('Form mode is set to edit but no ID is provided.');
+    }
+    if (state.value.dialogType === 'edit') {
+      return submitEdit();
+    }
+    return submitCreate();
+  }
+
+  async function submitCreate() {
+    customerStore.create(currentFormData.value);
+  }
+
+  async function submitEdit() {}
 
   return {
     state,
@@ -131,6 +151,7 @@ export const useCustomerForm = defineStore('form-customer', () => {
     isFormDataDifferent,
     resetFormData,
     assignFormData,
+    submitForm,
   };
 });
 
@@ -138,6 +159,7 @@ export const useEmployeeForm = defineStore('form-employee', () => {
   return {};
 });
 
-export const useCustomerBranchForm = defineStore('form-customer-branch', () => {
-
-})
+export const useCustomerBranchForm = defineStore(
+  'form-customer-branch',
+  () => {},
+);