diff --git a/src/components/03_customer-management/BasicInformation.vue b/src/components/03_customer-management/BasicInformation.vue
new file mode 100644
index 00000000..2cb8d614
--- /dev/null
+++ b/src/components/03_customer-management/BasicInformation.vue
@@ -0,0 +1,49 @@
+<script setup lang="ts">
+import { ref } from 'vue';
+const thaiName = ref<string>('');
+const EngName = ref<string>('');
+
+defineProps<{
+  title?: string;
+  dense?: boolean;
+  outlined?: boolean;
+  readonly?: boolean;
+  separator?: boolean;
+}>();
+</script>
+
+<template>
+  <div class="col-3 app-text-muted">
+    • {{ $t(`formDialogTitleInformation`) }}
+  </div>
+  <div class="col-9 row q-col-gutter-md">
+    <q-input
+      :dense="dense"
+      :outlined="!readonly"
+      :readonly="readonly"
+      :borderless="readonly"
+      hide-bottom-space
+      class="col-6"
+      :label="$t('corporationThaiName')"
+      v-model="thaiName"
+    />
+    <q-input
+      :dense="dense"
+      :outlined="!readonly"
+      :readonly="readonly"
+      :borderless="readonly"
+      hide-bottom-space
+      class="col-6"
+      :label="$t('corporationEnglishName')"
+      v-model="EngName"
+    />
+  </div>
+
+  <q-separator
+    v-if="separator"
+    class="col-12 q-mt-xl q-mb-md"
+    style="padding-block: 0.5px"
+  />
+</template>
+
+<style scoped></style>
diff --git a/src/i18n/en-US/employer-dialog.ts b/src/i18n/en-US/employer-dialog.ts
new file mode 100644
index 00000000..fb9f1833
--- /dev/null
+++ b/src/i18n/en-US/employer-dialog.ts
@@ -0,0 +1,4 @@
+export default {
+  corporationThaiName: 'Corporation ThaiName',
+  corporationEnglishName: 'Corporation EnglishName',
+};
diff --git a/src/i18n/en-US/index.ts b/src/i18n/en-US/index.ts
index c5824eeb..3e16333d 100644
--- a/src/i18n/en-US/index.ts
+++ b/src/i18n/en-US/index.ts
@@ -7,7 +7,7 @@ import user from './user';
 import formDialog from './form-dialog';
 import status from './status';
 import customerMainPage from './customer-main-page';
-
+import employerDialog from './employer-dialog';
 export default {
   ok: 'Confirm',
   agree: 'Agree',
@@ -42,4 +42,5 @@ export default {
   ...personnelMainPage,
   ...formDialog,
   ...customerMainPage,
+  ...employerDialog,
 };
diff --git a/src/i18n/th-th/employer-dialog.ts b/src/i18n/th-th/employer-dialog.ts
new file mode 100644
index 00000000..513fc130
--- /dev/null
+++ b/src/i18n/th-th/employer-dialog.ts
@@ -0,0 +1,4 @@
+export default {
+  corporationThaiName: 'ชื่อ บริษัท/นิติบุคคล ภาษาไทย',
+  corporationEnglishName: 'ชื่อ บริษัท/นิติบุคคล ภาษาอังกฤษ',
+};
diff --git a/src/i18n/th-th/index.ts b/src/i18n/th-th/index.ts
index a03b28ef..74d6f0c8 100644
--- a/src/i18n/th-th/index.ts
+++ b/src/i18n/th-th/index.ts
@@ -7,7 +7,7 @@ import branch from './branch';
 import user from './user';
 import formDialog from './form-dialog';
 import status from './status';
-
+import employerDialog from './employer-dialog';
 export default {
   ok: 'ยืนยัน',
   agree: 'ตกลง',
@@ -42,4 +42,5 @@ export default {
   ...personnelMainPage,
   ...formDialog,
   ...customerMainPage,
+  ...employerDialog,
 };
diff --git a/src/pages/03_customer-management/MainPage.vue b/src/pages/03_customer-management/MainPage.vue
index d68ae359..4119ff57 100644
--- a/src/pages/03_customer-management/MainPage.vue
+++ b/src/pages/03_customer-management/MainPage.vue
@@ -9,6 +9,7 @@ import AppBox from 'components/app/AppBox.vue';
 import ItemCard from 'src/components/ItemCard.vue';
 import FormDialog from 'src/components/FormDialog.vue';
 import ProfileUpload from 'src/components/ProfileUpload.vue';
+import BasicInformation from 'src/components/03_customer-management/BasicInformation.vue';
 
 const statusToggle = ref<boolean>(false);
 const profileSubmit = ref<boolean>(false);
@@ -192,7 +193,9 @@ function openDialogInputForm() {
       />
     </template>
 
-    <template #information>asdasdsa</template>
+    <template #information>
+      <BasicInformation dense outlined separator />
+    </template>
   </FormDialog>
 </template>