From c56fec6a7aa0d090ed98cde50d15341361a6f4c4 Mon Sep 17 00:00:00 2001
From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" <nicey2t1096@gmail.com>
Date: Wed, 19 Nov 2025 15:58:03 +0700
Subject: [PATCH] fix:validate

---
 src/modules/01_exam/components/ExamForm.vue   | 301 +++++++------
 .../01_exam/components/Form/Address.vue       | 398 +++++++++---------
 .../01_exam/components/Form/Career.vue        | 119 +++---
 .../01_exam/components/Form/Contact.vue       | 171 ++++----
 .../01_exam/components/Form/Education.vue     | 327 +++++++-------
 .../01_exam/components/Form/Information.vue   |   5 +-
 .../01_exam/components/Form/Occupation.vue    | 241 ++++++-----
 .../01_exam/components/Form/Profile.vue       |   3 +
 src/modules/01_exam/interface/index/Main.ts   |   2 +-
 9 files changed, 772 insertions(+), 795 deletions(-)

diff --git a/src/modules/01_exam/components/ExamForm.vue b/src/modules/01_exam/components/ExamForm.vue
index fc7df58..db02e7e 100644
--- a/src/modules/01_exam/components/ExamForm.vue
+++ b/src/modules/01_exam/components/ExamForm.vue
@@ -1,25 +1,26 @@
 <!-- step กรอกข้อมูล -->
 <template>
   <div>
-    <Profile
-      :status="status"
-      :isStatusRegister="isStatusRegister"
-      v-model:formInformation="formInformation"
-      v-model:formAddress="formAddress"
-      v-model:formOccupation="formOccupation"
-      v-model:formEducation="formEducation"
-      v-model:formContact="formContact"
-    />
-    <!-- v-model:formFamily="formFamily" -->
-    <div v-html="editorConfirm"></div>
-    <div class="text-center q-pt-sm">
-      <q-checkbox
-        v-model="acceptTermOfUse"
-        :disable="!isStatusRegister || statusEdit"
-        label="ข้าพเจ้าขอให้คำรับรองและแสดงความยินยอมตามเงื่อนไขทุกประการ"
+    <q-form greedy @submit.prevent @validation-success="onSubmitForm">
+      <Profile
+        :status="status"
+        :isStatusRegister="isStatusRegister"
+        v-model:formInformation="formInformation"
+        v-model:formAddress="formAddress"
+        v-model:formOccupation="formOccupation"
+        v-model:formEducation="formEducation"
+        v-model:formContact="formContact"
       />
-    </div>
-    <!-- <div>
+      <!-- v-model:formFamily="formFamily" -->
+      <div v-html="editorConfirm"></div>
+      <div class="text-center q-pt-sm">
+        <q-checkbox
+          v-model="acceptTermOfUse"
+          :disable="!isStatusRegister || statusEdit"
+          label="ข้าพเจ้าขอให้คำรับรองและแสดงความยินยอมตามเงื่อนไขทุกประการ"
+        />
+      </div>
+      <!-- <div>
       1. ข้าพเจ้าขอให้คำรับรองว่า
       ข้อความดังกล่าวข้างต้นนี้เป็นจริงทุกประการและข้าพเจ้ามีคุณสมบัติทั่วไปและ ไม่มีลักษณะต้องห้าม
       ตามมาตรา 43 แห่งพระราชบัญญัติระเบียบข้าราชการกรุงเทพมหานครและบุคลากร-กรุงเทพมหานคร พ.ศ. 2554
@@ -47,28 +48,34 @@
       มาตรา 137
     </div> -->
 
-    <div class="row justify-center q-pa-md">
-      <q-btn
-        color="blue"
-        class="q-ml-md"
-        label="บันทึกข้อมูล"
-        outline
-        icon="mdi-content-save"
-        @click="clickSave"
-        v-if="isStatusRegister"
-        :disable="!acceptTermOfUse || statusEdit"
-      />
-      <q-btn
-        color="primary"
-        class="q-ml-md"
-        icon="mdi-check"
-        label="ส่งใบสมัคร"
-        @click="status === 'checkRegister' && !stepPayment ? (secondDialog = true) : dialogOpen()"
-        v-if="isStatusRegister"
-        :disable="!acceptTermOfUse || statusEdit"
-      />
-    </div>
+      <div class="row justify-center q-pa-md">
+        <!-- @click="clickSave" -->
+        <q-btn
+          color="blue"
+          class="q-ml-md"
+          label="บันทึกข้อมูล"
+          outline
+          icon="mdi-content-save"
+          type="submit"
+          v-if="isStatusRegister"
+          :disable="!acceptTermOfUse || statusEdit"
+          @click="saveType = 'save'"
+        />
+        <!-- @click="status === 'checkRegister' && !stepPayment ? (secondDialog = true) : dialogOpen()" -->
+        <q-btn
+          color="primary"
+          class="q-ml-md"
+          icon="mdi-check"
+          label="ส่งใบสมัคร"
+          type="submit"
+          v-if="isStatusRegister"
+          :disable="!acceptTermOfUse || statusEdit"
+          @click="saveType = 'confirm'"
+        />
+      </div>
+    </q-form>
   </div>
+
   <q-dialog v-model="dialog" persistent>
     <q-card>
       <q-card-section class="row items-center q-pa-sm">
@@ -221,6 +228,28 @@ onMounted(async () => {
   await fetchStatus()
 })
 
+const saveType = ref<string>('')
+
+function onSubmitForm() {
+  if (defaultInformation.value.profileImg == null || defaultInformation.value.profileImg == '') {
+    notifyError($q, 'กรุณาอัพโหลดรูปถ่าย')
+    return
+  }
+  if (!defaultCareer.value) {
+    notifyError($q, 'กรุณากรอกข้อมูลประวัติการทำงาน')
+    return
+  }
+  if (saveType.value === 'save') {
+    clickSave()
+  } else if (saveType.value === 'confirm') {
+    if (props.status === 'checkRegister' && !props.stepPayment) {
+      secondDialog.value = true
+    } else {
+      dialogOpen()
+    }
+  }
+}
+
 const dialogClose = () => {
   dialog.value = false
 }
@@ -234,12 +263,6 @@ const okModalConfirm = () => {
     modalError($q, 'ไม่สามารถสมัครสอบได้', 'มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล')
   } else {
     saveAuto.value = true
-    // modalConfirm(
-    //   $q,
-    //   'ยืนยันการสมัครสอบ?',
-    //   'เมื่อยืนยันการสมัครสอบแล้วจะไม่สามารถแก้ไขข้อมูลได้',
-    //   saveData
-    // )
     saveData()
   }
 }
@@ -248,10 +271,10 @@ const fetchStatus = async () => {
   loaderPage(true)
   await http
     .get(config.API.candidateCard(examId.value, positionId.value))
-    .then((res) => {
+    .then(() => {
       acceptTermOfUse.value = true
     })
-    .catch((e) => {
+    .catch(() => {
       acceptTermOfUse.value = false
     })
     .finally(() => {
@@ -279,119 +302,76 @@ const clickSave = async () => {
 
 const saveData = async () => {
   if (saveAuto.value == true) {
-    if (defaultInformation.value.profileImg == null || defaultInformation.value.profileImg == '') {
-      notifyError($q, 'กรุณาอัพโหลดรูปถ่าย')
-      return
-    }
-    await formInformation.value.validate().then(async (suc: boolean) => {
-      if (suc) {
-        await formAddress.value.validate().then(async (suc: boolean) => {
-          if (suc) {
-            await formEducation.value.validate().then(async (suc: boolean) => {
-              if (suc) {
-                await formOccupation.value.validate().then(async (suc: boolean) => {
-                  if (suc) {
-                    if (defaultCareer.value == true) {
-                      await formContact.value.validate().then(async (suc: boolean) => {
-                        if (suc) {
-                          loaderPage(true)
-                          await http
-                            .post(config.API.candidateId(examId.value, positionId.value), {
-                              // prefixId: defaultInformation.value.prefixId,
-                              prefixName: defaultInformation.value.prefix,
-                              lastName: defaultInformation.value.lastname,
-                              dateOfBirth:
-                                defaultInformation.value.birthDate == null
-                                  ? null
-                                  : dateToISO(defaultInformation.value.birthDate),
-                              citizenId: defaultInformation.value.cardid,
-                              firstName: defaultInformation.value.firstname,
-                              // religionId: defaultInformation.value.religionId,
-                              religionName: defaultInformation.value.religionName,
-                              nationality: defaultInformation.value.nationality,
-                              email: defaultInformation.value.email,
-                              mobilePhone: defaultInformation.value.phone,
-                              telephone: defaultInformation.value.tel,
-                              knowledge: defaultInformation.value.knowledge,
-                              occupationOrg: defaultOccupation.value.org,
-                              occupationPile: defaultOccupation.value.pile,
-                              occupationGroup: defaultOccupation.value.group,
-                              occupationSalary: defaultOccupation.value.salary,
-                              occupationPosition: defaultOccupation.value.position,
-                              occupationPositionType: defaultOccupation.value.positionType,
-                              occupationTelephone: defaultOccupation.value.tel,
-                              registAddress: defaultAddress.value.address,
-                              currentAddress: defaultAddress.value.addressC,
-                              registProvinceId: defaultAddress.value.provinceId,
-                              currentProvinceId: defaultAddress.value.provinceIdC,
-                              registDistrictId: defaultAddress.value.districtId,
-                              currentDistrictId: defaultAddress.value.districtIdC,
-                              registSubDistrictId: defaultAddress.value.subdistrictId,
-                              currentSubDistrictId: defaultAddress.value.subdistrictIdC,
-                              registZipCode: defaultAddress.value.code,
-                              currentZipCode: defaultAddress.value.codeC,
-                              registSame:
-                                defaultAddress.value.same == '1'
-                                  ? true
-                                  : defaultAddress.value.same == '0'
-                                  ? false
-                                  : null,
-                              educationLevelExamId: defaultEducation.value.educationLevelExamId,
-                              educationName: defaultEducation.value.educationName,
-                              educationMajor: defaultEducation.value.educationMajor,
-                              educationLocation: defaultEducation.value.educationLocation,
-                              educationType: defaultEducation.value.educationType,
-                              educationEndDate:
-                                defaultEducation.value.educationEndDate == null
-                                  ? null
-                                  : dateToISO(defaultEducation.value.educationEndDate),
-                              educationScores: defaultEducation.value.educationScores,
-                              educationLevelHighId: defaultEducation.value.educationLevelHighId,
+    loaderPage(true)
+    await http
+      .post(config.API.candidateId(examId.value, positionId.value), {
+        // prefixId: defaultInformation.value.prefixId,
+        prefixName: defaultInformation.value.prefix,
+        lastName: defaultInformation.value.lastname,
+        dateOfBirth:
+          defaultInformation.value.birthDate == null
+            ? null
+            : dateToISO(defaultInformation.value.birthDate),
+        citizenId: defaultInformation.value.cardid,
+        firstName: defaultInformation.value.firstname,
+        // religionId: defaultInformation.value.religionId,
+        religionName: defaultInformation.value.religionName,
+        nationality: defaultInformation.value.nationality,
+        email: defaultInformation.value.email,
+        mobilePhone: defaultInformation.value.phone,
+        telephone: defaultInformation.value.tel,
+        knowledge: defaultInformation.value.knowledge,
+        occupationOrg: defaultOccupation.value.org,
+        occupationPile: defaultOccupation.value.pile,
+        occupationGroup: defaultOccupation.value.group,
+        occupationSalary: defaultOccupation.value.salary,
+        occupationPosition: defaultOccupation.value.position,
+        occupationPositionType: defaultOccupation.value.positionType,
+        occupationTelephone: defaultOccupation.value.tel,
+        registAddress: defaultAddress.value.address,
+        currentAddress: defaultAddress.value.addressC,
+        registProvinceId: defaultAddress.value.provinceId,
+        currentProvinceId: defaultAddress.value.provinceIdC,
+        registDistrictId: defaultAddress.value.districtId,
+        currentDistrictId: defaultAddress.value.districtIdC,
+        registSubDistrictId: defaultAddress.value.subdistrictId,
+        currentSubDistrictId: defaultAddress.value.subdistrictIdC,
+        registZipCode: defaultAddress.value.code,
+        currentZipCode: defaultAddress.value.codeC,
+        registSame:
+          defaultAddress.value.same == '1' ? true : defaultAddress.value.same == '0' ? false : null,
+        educationLevelExamId: defaultEducation.value.educationLevelExamId,
+        educationName: defaultEducation.value.educationName,
+        educationMajor: defaultEducation.value.educationMajor,
+        educationLocation: defaultEducation.value.educationLocation,
+        educationType: defaultEducation.value.educationType,
+        educationEndDate:
+          defaultEducation.value.educationEndDate == null
+            ? null
+            : dateToISO(defaultEducation.value.educationEndDate),
+        educationScores: defaultEducation.value.educationScores,
+        educationLevelHighId: defaultEducation.value.educationLevelHighId,
 
-                              // contactprefixId: defaultContact.value.contactprefixId,
-                              contactprefixName: defaultContact.value.contactprefixName,
-                              contactfirstname: defaultContact.value.contactfirstname,
-                              contactlastname: defaultContact.value.contactlastname,
-                              contactrelations: defaultContact.value.contactrelations,
-                              contacttel: defaultContact.value.contacttel
-                            })
-                            .then(async () => {
-                              if (!props.stepPayment) {
-                                dialog.value = false
-                                secondDialog.value = true
-                              }
-                              success($q, 'บันทึกข้อมูลส่วนตัวสำเร็จ')
-                              await saveForm()
-                              await props.fetchStep()
-                            })
-                            .catch((e) => {
-                              messageError($q, e)
-                              loaderPage(false)
-                            })
-                            .finally(async () => {})
-                        } else {
-                          notifyError($q, 'กรุณากรอกข้อมูลให้ครบถ้วน')
-                        }
-                      })
-                    } else {
-                      notifyError($q, 'กรุณากรอกข้อมูลประวัติการทำงาน')
-                    }
-                  } else {
-                    notifyError($q, 'กรุณากรอกข้อมูลให้ครบถ้วน')
-                  }
-                })
-              } else {
-                notifyError($q, 'กรุณากรอกข้อมูลให้ครบถ้วน')
-              }
-            })
-          } else {
-            notifyError($q, 'กรุณากรอกข้อมูลให้ครบถ้วน')
-          }
-        })
-      } else {
-        notifyError($q, 'กรุณากรอกข้อมูลให้ครบถ้วน')
-      }
-    })
+        // contactprefixId: defaultContact.value.contactprefixId,
+        contactprefixName: defaultContact.value.contactprefixName,
+        contactfirstname: defaultContact.value.contactfirstname,
+        contactlastname: defaultContact.value.contactlastname,
+        contactrelations: defaultContact.value.contactrelations,
+        contacttel: defaultContact.value.contacttel
+      })
+      .then(async () => {
+        if (!props.stepPayment) {
+          dialog.value = false
+          secondDialog.value = true
+        }
+        success($q, 'บันทึกข้อมูลส่วนตัวสำเร็จ')
+        await saveForm()
+        await props.fetchStep()
+      })
+      .catch((e) => {
+        messageError($q, e)
+        loaderPage(false)
+      })
   } else {
     loaderPage(true)
     await http
@@ -458,12 +438,13 @@ const saveData = async () => {
         messageError($q, e)
         loaderPage(false)
       })
-      .finally(async () => {})
   }
 }
 
 async function onSubmit() {
   try {
+    saveAuto.value = false
+    await saveData()
     await http.post(config.API.registerConfirm(examId.value, positionId.value))
     await props.fetchStep()
     // do something
diff --git a/src/modules/01_exam/components/Form/Address.vue b/src/modules/01_exam/components/Form/Address.vue
index 1af5591..6e41a4b 100644
--- a/src/modules/01_exam/components/Form/Address.vue
+++ b/src/modules/01_exam/components/Form/Address.vue
@@ -8,207 +8,202 @@
     :editOnly="false"
     :editData="false"
   />
-  <q-form ref="myform">
-    <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
-      <div class="col-xs-12">
-        <q-input
-          :class="getClass(isStatusRegister)"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          type="textarea"
-          autogrow
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          v-model="defaultAddress.address"
-          :rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ตามทะเบียนบ้าน'}`]"
-          :label="`${'ที่อยู่ตามทะเบียนบ้าน'}`"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-select
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          :rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          v-model="defaultAddress.provinceId"
-          emit-value
-          map-options
-          option-label="name"
-          :options="provinceOptions"
-          option-value="id"
-          :label="`${'จังหวัด'}`"
-          @update:model-value="(value) => selectProvince(value, '1')"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-select
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          :rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          v-model="defaultAddress.districtId"
-          emit-value
-          map-options
-          option-label="name"
-          :options="districtOptions"
-          option-value="id"
-          :label="`${'เขต / อำเภอ'}`"
-          @update:model-value="(value) => selectDistrict(value, '1')"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-select
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          :rules="[(val) => !!val || `${'กรุณาเลือก แขวง / ตำบล'}`]"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          v-model="defaultAddress.subdistrictId"
-          emit-value
-          map-options
-          option-label="name"
-          :options="subdistrictOptions"
-          option-value="id"
-          :label="`${'แขวง / ตำบล'}`"
-          @update:model-value="(value) => selectSubDistrict(value, '1')"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-input
-          :class="getClass(isStatusRegister)"
-          dense
-          lazy-rules
-          :readonly="!(status == 'rejectRegister')"
-          :borderless="!isStatusRegister"
-          :outlined="isStatusRegister"
-          v-model="defaultAddress.code"
-          bottom-slots
-          :label="`${'รหัสไปรษณีย์'}`"
-        />
-      </div>
-      <div class="col-xs-12 q-gutter-sm items-center flex q-mb-sm row">
-        <div class="text-bold" v-if="$q.screen.gt.xs">
-          ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน
-        </div>
-        <div class="text-bold col-12 q-pt-sm" v-else>
-          ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน
-        </div>
-        <q-radio
-          v-model="defaultAddress.same"
-          checked-icon="task_alt"
-          unchecked-icon="panorama_fish_eye"
-          val="1"
-          label="ใช่"
-          dense
-          :disable="!isStatusRegister"
-        />
-        <q-radio
-          v-model="defaultAddress.same"
-          checked-icon="task_alt"
-          unchecked-icon="panorama_fish_eye"
-          val="0"
-          label="ไม่"
-          dense
-          :disable="!isStatusRegister"
-        />
-      </div>
 
-      <div class="col-xs-12" v-if="defaultAddress.same == '0'">
-        <q-input
-          :class="getClass(isStatusRegister)"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          type="textarea"
-          autogrow
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          v-model="defaultAddress.addressC"
-          :rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ปัจจุบัน'}`]"
-          :label="`${'ที่อยู่ปัจจุบัน'}`"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
-        <q-select
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          :rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          v-model="defaultAddress.provinceIdC"
-          emit-value
-          map-options
-          option-label="name"
-          :options="provinceOptions"
-          option-value="id"
-          :label="`${'จังหวัด'}`"
-          @update:model-value="(value) => selectProvince(value, '2')"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
-        <q-select
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          :rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          v-model="defaultAddress.districtIdC"
-          emit-value
-          map-options
-          option-label="name"
-          :options="districtCOptions"
-          option-value="id"
-          :label="`${'เขต / อำเภอ'}`"
-          @update:model-value="(value) => selectDistrict(value, '2')"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
-        <q-select
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          :rules="[(val) => !!val || `${'กรุณาเลือก แขวง / ตำบล'}`]"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          v-model="defaultAddress.subdistrictIdC"
-          emit-value
-          map-options
-          option-label="name"
-          :options="subdistrictCOptions"
-          option-value="id"
-          :label="`${'แขวง / ตำบล'}`"
-          @update:model-value="(value) => selectSubDistrict(value, '2')"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
-        <q-input
-          :class="getClass(isStatusRegister)"
-          dense
-          lazy-rules
-          bottom-slots
-          :readonly="!(status == 'rejectRegister')"
-          :borderless="!isStatusRegister"
-          :outlined="isStatusRegister"
-          v-model="defaultAddress.codeC"
-          :label="`${'รหัสไปรษณีย์'}`"
-        />
-      </div>
+  <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
+    <div class="col-xs-12">
+      <q-input
+        :class="getClass(isStatusRegister)"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        type="textarea"
+        autogrow
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        v-model="defaultAddress.address"
+        :rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ตามทะเบียนบ้าน'}`]"
+        :label="`${'ที่อยู่ตามทะเบียนบ้าน'}`"
+      />
     </div>
-  </q-form>
+    <div class="col-xs-12 col-sm-3 col-md-3">
+      <q-select
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        :rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        v-model="defaultAddress.provinceId"
+        emit-value
+        map-options
+        option-label="name"
+        :options="provinceOptions"
+        option-value="id"
+        :label="`${'จังหวัด'}`"
+        @update:model-value="(value) => selectProvince(value, '1')"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3">
+      <q-select
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        :rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        v-model="defaultAddress.districtId"
+        emit-value
+        map-options
+        option-label="name"
+        :options="districtOptions"
+        option-value="id"
+        :label="`${'เขต / อำเภอ'}`"
+        @update:model-value="(value) => selectDistrict(value, '1')"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3">
+      <q-select
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        :rules="[(val) => !!val || `${'กรุณาเลือก แขวง / ตำบล'}`]"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        v-model="defaultAddress.subdistrictId"
+        emit-value
+        map-options
+        option-label="name"
+        :options="subdistrictOptions"
+        option-value="id"
+        :label="`${'แขวง / ตำบล'}`"
+        @update:model-value="(value) => selectSubDistrict(value, '1')"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3">
+      <q-input
+        :class="getClass(isStatusRegister)"
+        dense
+        lazy-rules
+        :readonly="!(status == 'rejectRegister')"
+        :borderless="!isStatusRegister"
+        :outlined="isStatusRegister"
+        v-model="defaultAddress.code"
+        bottom-slots
+        :label="`${'รหัสไปรษณีย์'}`"
+      />
+    </div>
+    <div class="col-xs-12 q-gutter-sm items-center flex q-mb-sm row">
+      <div class="text-bold" v-if="$q.screen.gt.xs">ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน</div>
+      <div class="text-bold col-12 q-pt-sm" v-else>ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน</div>
+      <q-radio
+        v-model="defaultAddress.same"
+        checked-icon="task_alt"
+        unchecked-icon="panorama_fish_eye"
+        val="1"
+        label="ใช่"
+        dense
+        :disable="!isStatusRegister"
+      />
+      <q-radio
+        v-model="defaultAddress.same"
+        checked-icon="task_alt"
+        unchecked-icon="panorama_fish_eye"
+        val="0"
+        label="ไม่"
+        dense
+        :disable="!isStatusRegister"
+      />
+    </div>
+
+    <div class="col-xs-12" v-if="defaultAddress.same == '0'">
+      <q-input
+        :class="getClass(isStatusRegister)"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        type="textarea"
+        autogrow
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        v-model="defaultAddress.addressC"
+        :rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ปัจจุบัน'}`]"
+        :label="`${'ที่อยู่ปัจจุบัน'}`"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
+      <q-select
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        :rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        v-model="defaultAddress.provinceIdC"
+        emit-value
+        map-options
+        option-label="name"
+        :options="provinceOptions"
+        option-value="id"
+        :label="`${'จังหวัด'}`"
+        @update:model-value="(value) => selectProvince(value, '2')"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
+      <q-select
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        :rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        v-model="defaultAddress.districtIdC"
+        emit-value
+        map-options
+        option-label="name"
+        :options="districtCOptions"
+        option-value="id"
+        :label="`${'เขต / อำเภอ'}`"
+        @update:model-value="(value) => selectDistrict(value, '2')"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
+      <q-select
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        :rules="[(val) => !!val || `${'กรุณาเลือก แขวง / ตำบล'}`]"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        v-model="defaultAddress.subdistrictIdC"
+        emit-value
+        map-options
+        option-label="name"
+        :options="subdistrictCOptions"
+        option-value="id"
+        :label="`${'แขวง / ตำบล'}`"
+        @update:model-value="(value) => selectSubDistrict(value, '2')"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
+      <q-input
+        :class="getClass(isStatusRegister)"
+        dense
+        lazy-rules
+        bottom-slots
+        :readonly="!(status == 'rejectRegister')"
+        :borderless="!isStatusRegister"
+        :outlined="isStatusRegister"
+        v-model="defaultAddress.codeC"
+        :label="`${'รหัสไปรษณีย์'}`"
+      />
+    </div>
+  </div>
 </template>
 <script setup lang="ts">
 import { ref, onMounted, watch } from 'vue'
@@ -317,7 +312,7 @@ const selectProvince = async (e: string, name: string) => {
     defaultAddress.value.subdistrictIdC = ''
     defaultAddress.value.codeC = null
   }
-  myform.value.resetValidation()
+
   await fetchDistrict(e, name)
 }
 
@@ -329,7 +324,7 @@ const selectDistrict = async (e: string, name: string) => {
     defaultAddress.value.subdistrictIdC = ''
     defaultAddress.value.codeC = null
   }
-  myform.value.resetValidation()
+
   await fetchSubDistrict(e, name)
 }
 
@@ -351,6 +346,7 @@ const fetchDistrict = async (id: string, position: string) => {
     .get(config.API.listDistrict(id))
     .then((res) => {
       const data = res.data.result.districts
+
       let option: DataOption[] = []
       data.map((r: DataOption) => {
         option.push({ id: r.id.toString(), name: r.name.toString() })
diff --git a/src/modules/01_exam/components/Form/Career.vue b/src/modules/01_exam/components/Form/Career.vue
index dbc7551..12ba7d1 100644
--- a/src/modules/01_exam/components/Form/Career.vue
+++ b/src/modules/01_exam/components/Form/Career.vue
@@ -1,67 +1,66 @@
 <!-- tab ประวัติการทำงาน -->
 <template>
-  <q-form ref="myForm">
-    <Table
-      :rows="rows"
-      :columns="columns"
-      :filter="filter"
-      :visible-columns="visibleColumns"
-      v-model:inputfilter="filter"
-      v-model:inputvisible="visibleColumns"
-      v-model:editvisible="edit"
-      :add="clickAdd"
-      :edit="clickEdit"
-      :addData="false"
-      :bottom="true"
-      :editBtn="false"
-      :boss="isStatusRegister"
-      :editData="isStatusRegister"
-      name="ประวัติการทำงาน (ตั้งแต่เริ่มปฏิบัติงานกับกรุงเทพมหานคร - ปัจจุบัน)"
-      icon="mdi-briefcase"
-      :is-showfilter="false"
-    >
-      <template #columns="props">
-        <q-tr :props="props">
-          <q-td
-            v-for="col in props.cols"
-            :key="col.name"
-            :props="props"
-            @click="selectData(props)"
-            class="cursor-pointer"
-          >
-            <div v-if="col.name == 'startDate' || col.name == 'endDate'">
-              {{ date2Thai(col.value) }}
-            </div>
-            <div v-else>
-              {{ col.value }}
-            </div>
-          </q-td>
-          <q-td auto-width v-if="status == 'register' || status == 'rejectRegister'">
-            <q-btn
-              color="red"
-              flat
-              dense
-              round
-              size="14px"
-              icon="mdi-trash-can-outline"
-              @click="checkDelete(props.row)"
-            />
-          </q-td>
-        </q-tr>
-      </template>
-      <template #bottom="props">
-        <div style="width: 63.5% !important" />
-
-        <div :props="props" class="row" style="width: 33% !important; padding-left: 20px">
-          <div class="text-weight-medium text-subtitle2 q-py-sm row col-12 justify-between">
-            <div>รวมระยะเวลา :</div>
-
-            <div>{{ total }}</div>
+  <Table
+    :rows="rows"
+    :columns="columns"
+    :filter="filter"
+    :visible-columns="visibleColumns"
+    v-model:inputfilter="filter"
+    v-model:inputvisible="visibleColumns"
+    v-model:editvisible="edit"
+    :add="clickAdd"
+    :edit="clickEdit"
+    :addData="false"
+    :bottom="true"
+    :editBtn="false"
+    :boss="isStatusRegister"
+    :editData="isStatusRegister"
+    name="ประวัติการทำงาน (ตั้งแต่เริ่มปฏิบัติงานกับกรุงเทพมหานคร - ปัจจุบัน)"
+    icon="mdi-briefcase"
+    :is-showfilter="false"
+  >
+    <template #columns="props">
+      <q-tr :props="props">
+        <q-td
+          v-for="col in props.cols"
+          :key="col.name"
+          :props="props"
+          @click="selectData(props)"
+          class="cursor-pointer"
+        >
+          <div v-if="col.name == 'startDate' || col.name == 'endDate'">
+            {{ date2Thai(col.value) }}
           </div>
+          <div v-else>
+            {{ col.value }}
+          </div>
+        </q-td>
+        <q-td auto-width v-if="status == 'register' || status == 'rejectRegister'">
+          <q-btn
+            color="red"
+            flat
+            dense
+            round
+            size="14px"
+            icon="mdi-trash-can-outline"
+            @click="checkDelete(props.row)"
+          />
+        </q-td>
+      </q-tr>
+    </template>
+    <template #bottom="props">
+      <div style="width: 63.5% !important" />
+
+      <div :props="props" class="row" style="width: 33% !important; padding-left: 20px">
+        <div class="text-weight-medium text-subtitle2 q-py-sm row col-12 justify-between">
+          <div>รวมระยะเวลา :</div>
+
+          <div>{{ total }}</div>
         </div>
-      </template>
-    </Table>
-  </q-form>
+      </div>
+    </template>
+  </Table>
+
   <q-dialog v-model="modal" persistent>
     <q-card style="width: 600px">
       <q-form ref="myForm">
diff --git a/src/modules/01_exam/components/Form/Contact.vue b/src/modules/01_exam/components/Form/Contact.vue
index 5faf65e..9d8836e 100644
--- a/src/modules/01_exam/components/Form/Contact.vue
+++ b/src/modules/01_exam/components/Form/Contact.vue
@@ -8,10 +8,10 @@
     :editOnly="false"
     :editData="false"
   />
-  <q-form ref="myform">
-    <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
-      <div class="col-xs-12 col-sm-3 col-md-2">
-        <!-- <q-select
+
+  <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
+    <div class="col-xs-12 col-sm-3 col-md-2">
+      <!-- <q-select
 					   :class="getClass(isStatusRegister)"
 					 :readonly="!isStatusRegister"
 					:borderless="!isStatusRegister"
@@ -27,89 +27,88 @@
 					option-value="id"
 					:label="`${'คำนำหน้า'}`"
 				/> -->
-        <q-select
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          :rules="[(val) => !!val || `${'กรุณากรอก คำนำหน้า'}`]"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          v-model="defaultContact.contactprefixName"
-          :label="`${'คำนำหน้า'}`"
-          :options="filteredPrefixOptions"
-          use-input
-          fill-input
-          input-debounce="0"
-          @filter="filterPrefix"
-          @input-value="setModel"
-          hide-selected
-          hide-dropdown-icon
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-input
-          :class="getClass(isStatusRegister)"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          v-model="defaultContact.contactfirstname"
-          :rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
-          :label="`${'ชื่อ'}`"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-3">
-        <q-input
-          :class="getClass(isStatusRegister)"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          v-model="defaultContact.contactlastname"
-          :rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
-          :label="`${'นามสกุล'}`"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-4">
-        <q-input
-          :class="getClass(isStatusRegister)"
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          v-model="defaultContact.contactrelations"
-          :rules="[(val) => !!val || `${'กรุณากรอกความสัมพันธ์'}`]"
-          :label="`${'เกี่ยวข้องเป็น'}`"
-        />
-      </div>
-      <div class="col-xs-12 col-sm-3 col-md-4">
-        <q-input
-          :outlined="isStatusRegister"
-          dense
-          lazy-rules
-          :class="getClass(isStatusRegister)"
-          :readonly="!isStatusRegister"
-          :borderless="!isStatusRegister"
-          v-model="defaultContact.contacttel"
-          :label="`${'โทรศัพท์'}`"
-          :rules="[
-            (val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
-            (val) =>
-              (val.length >= 9 && val.length <= 10 && val.startsWith('0')) ||
-              'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง'
-          ]"
-          type="tel"
-          mask="##########"
-          maxlength="10"
-          :counter="isStatusRegister ? true : false"
-        />
-      </div>
+      <q-select
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        :rules="[(val) => !!val || `${'กรุณากรอก คำนำหน้า'}`]"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        v-model="defaultContact.contactprefixName"
+        :label="`${'คำนำหน้า'}`"
+        :options="filteredPrefixOptions"
+        use-input
+        fill-input
+        input-debounce="0"
+        @filter="filterPrefix"
+        @input-value="setModel"
+        hide-selected
+        hide-dropdown-icon
+      />
     </div>
-  </q-form>
+    <div class="col-xs-12 col-sm-3 col-md-3">
+      <q-input
+        :class="getClass(isStatusRegister)"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        v-model="defaultContact.contactfirstname"
+        :rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
+        :label="`${'ชื่อ'}`"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-3">
+      <q-input
+        :class="getClass(isStatusRegister)"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        v-model="defaultContact.contactlastname"
+        :rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
+        :label="`${'นามสกุล'}`"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-4">
+      <q-input
+        :class="getClass(isStatusRegister)"
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        v-model="defaultContact.contactrelations"
+        :rules="[(val) => !!val || `${'กรุณากรอกความสัมพันธ์'}`]"
+        :label="`${'เกี่ยวข้องเป็น'}`"
+      />
+    </div>
+    <div class="col-xs-12 col-sm-3 col-md-4">
+      <q-input
+        :outlined="isStatusRegister"
+        dense
+        lazy-rules
+        :class="getClass(isStatusRegister)"
+        :readonly="!isStatusRegister"
+        :borderless="!isStatusRegister"
+        v-model="defaultContact.contacttel"
+        :label="`${'โทรศัพท์'}`"
+        :rules="[
+          (val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
+          (val) =>
+            (val.length >= 9 && val.length <= 10 && val.startsWith('0')) ||
+            'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง'
+        ]"
+        type="tel"
+        mask="##########"
+        maxlength="10"
+        :counter="isStatusRegister ? true : false"
+      />
+    </div>
+  </div>
 </template>
 <script setup lang="ts">
 import { ref, onMounted, watch, PropType } from 'vue'
diff --git a/src/modules/01_exam/components/Form/Education.vue b/src/modules/01_exam/components/Form/Education.vue
index 0d50a2c..e2cc8ab 100644
--- a/src/modules/01_exam/components/Form/Education.vue
+++ b/src/modules/01_exam/components/Form/Education.vue
@@ -8,172 +8,171 @@
     :editOnly="false"
     :editData="false"
   />
-  <q-form ref="myform">
-    <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
-      <div class="col-12 row q-col-gutter-sm">
-        <div class="col-xs-12 col-sm-3">
-          <q-select
-            :class="getClass(isStatusRegister)"
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            emit-value
-            map-options
-            option-label="name"
-            option-value="id"
-            :options="educationLevelOptions"
-            v-model="defaultEducation.educationLevelExamId"
-            :rules="[(val) => !!val || `${'กรุณาเลือก วุฒิที่ใช้สมัครสอบ'}`]"
-            :label="`${'วุฒิที่ใช้สมัครสอบ'}`"
-            @update:model-value="(value) => checkInputName()"
-          />
-        </div>
-        <div class="col-xs-12 col-sm-3" v-if="showEducationName">
-          <q-input
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            autogrow
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultEducation.educationName"
-            :rules="[(val) => !!val || `${'กรุณากรอก ชื่อปริญญา'}`]"
-            :label="`${'ชื่อปริญญา'}`"
-          />
-        </div>
-        <div class="col-xs-12 col-sm-3">
-          <q-input
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            autogrow
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultEducation.educationMajor"
-            :rules="[(val) => !!val || `${'กรุณากรอก สาขาวิชา/วิชาเอก'}`]"
-            :label="`${'สาขาวิชา/วิชาเอก'}`"
-          />
-        </div>
-        <div class="col-xs-12 col-sm-3">
-          <q-input
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            autogrow
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultEducation.educationLocation"
-            :rules="[(val) => !!val || `${'กรุณากรอก ชื่อสถานศึกษา'}`]"
-            :label="`${'ชื่อสถานศึกษา'}`"
-          />
-        </div>
-        <div class="col-xs-12 col-sm-3">
-          <q-select
-            :class="getClass(isStatusRegister)"
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            emit-value
-            map-options
-            option-label="name"
-            option-value="id"
-            :options="educationTypeOptions"
-            v-model="defaultEducation.educationType"
-            :rules="[(val) => !!val || `${'กรุณาเลือก ประเภทสถานศึกษา'}`]"
-            :label="`${'ประเภทสถานศึกษา'}`"
-          />
-        </div>
-        <div class="col-xs-12 col-sm-3">
-          <datepicker
-            :readonly="!isStatusRegister"
-            v-model="defaultEducation.educationEndDate"
-            :locale="'th'"
-            autoApply
-            :enableTimePicker="false"
-            week-start="0"
-            :max-date="dateCondition"
-            :disabled="!isStatusRegister"
-          >
-            <template #year="{ year }">
-              {{ year + 543 }}
-            </template>
-            <template #year-overlay-value="{ value }">
-              {{ parseInt(value + 543) }}
-            </template>
-            <template #trigger>
-              <q-input
-                :class="getClass(isStatusRegister)"
-                :outlined="isStatusRegister"
-                dense
-                lazy-rules
-                :readonly="!isStatusRegister"
-                :borderless="!isStatusRegister"
-                :model-value="
-                  defaultEducation.educationEndDate == null
-                    ? null
-                    : date2Thai(defaultEducation.educationEndDate)
-                "
-                :rules="[(val) => !!val || `${'กรุณาเลือกวันที่สำเร็จการศึกษา'}`]"
-                :label="`${'วันที่สำเร็จการศึกษา'}`"
-              >
-                <template v-slot:prepend>
-                  <q-icon
-                    name="event"
-                    class="cursor-pointer"
-                    :style="
-                      status == 'register' || status == 'rejectRegister'
-                        ? 'color: var(--q-primary)'
-                        : 'color: var(--q-grey)'
-                    "
-                  >
-                  </q-icon>
-                </template>
-              </q-input>
-            </template>
-          </datepicker>
-        </div>
-        <div class="col-xs-12 col-sm-3">
-          <q-input
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            dense
-            lazy-rules
-            type="number"
-            v-model="defaultEducation.educationScores"
-            :rules="[(val) => !!val || `${'กรุณากรอก คะแนนเฉลี่ยสะสม'}`]"
-            :label="`${'คะแนนเฉลี่ยสะสม'}`"
-          />
-        </div>
-        <div class="col-xs-12 col-sm-3">
-          <q-select
-            :class="getClass(isStatusRegister)"
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            emit-value
-            map-options
-            option-label="name"
-            option-value="id"
-            :options="educationLevelHigherOptions"
-            v-model="defaultEducation.educationLevelHighId"
-            :rules="[(val) => !!val || `${'กรุณาเลือก วุฒิการศึกษาสูงสุด'}`]"
-            :label="`${'วุฒิการศึกษาสูงสุด'}`"
-          />
-        </div>
+
+  <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
+    <div class="col-12 row q-col-gutter-sm">
+      <div class="col-xs-12 col-sm-3">
+        <q-select
+          :class="getClass(isStatusRegister)"
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          emit-value
+          map-options
+          option-label="name"
+          option-value="id"
+          :options="educationLevelOptions"
+          v-model="defaultEducation.educationLevelExamId"
+          :rules="[(val) => !!val || `${'กรุณาเลือก วุฒิที่ใช้สมัครสอบ'}`]"
+          :label="`${'วุฒิที่ใช้สมัครสอบ'}`"
+          @update:model-value="(value) => checkInputName()"
+        />
+      </div>
+      <div class="col-xs-12 col-sm-3" v-if="showEducationName">
+        <q-input
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          autogrow
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultEducation.educationName"
+          :rules="[(val) => !!val || `${'กรุณากรอก ชื่อปริญญา'}`]"
+          :label="`${'ชื่อปริญญา'}`"
+        />
+      </div>
+      <div class="col-xs-12 col-sm-3">
+        <q-input
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          autogrow
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultEducation.educationMajor"
+          :rules="[(val) => !!val || `${'กรุณากรอก สาขาวิชา/วิชาเอก'}`]"
+          :label="`${'สาขาวิชา/วิชาเอก'}`"
+        />
+      </div>
+      <div class="col-xs-12 col-sm-3">
+        <q-input
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          autogrow
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultEducation.educationLocation"
+          :rules="[(val) => !!val || `${'กรุณากรอก ชื่อสถานศึกษา'}`]"
+          :label="`${'ชื่อสถานศึกษา'}`"
+        />
+      </div>
+      <div class="col-xs-12 col-sm-3">
+        <q-select
+          :class="getClass(isStatusRegister)"
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          emit-value
+          map-options
+          option-label="name"
+          option-value="id"
+          :options="educationTypeOptions"
+          v-model="defaultEducation.educationType"
+          :rules="[(val) => !!val || `${'กรุณาเลือก ประเภทสถานศึกษา'}`]"
+          :label="`${'ประเภทสถานศึกษา'}`"
+        />
+      </div>
+      <div class="col-xs-12 col-sm-3">
+        <datepicker
+          :readonly="!isStatusRegister"
+          v-model="defaultEducation.educationEndDate"
+          :locale="'th'"
+          autoApply
+          :enableTimePicker="false"
+          week-start="0"
+          :max-date="dateCondition"
+          :disabled="!isStatusRegister"
+        >
+          <template #year="{ year }">
+            {{ year + 543 }}
+          </template>
+          <template #year-overlay-value="{ value }">
+            {{ parseInt(value + 543) }}
+          </template>
+          <template #trigger>
+            <q-input
+              :class="getClass(isStatusRegister)"
+              :outlined="isStatusRegister"
+              dense
+              lazy-rules
+              :readonly="!isStatusRegister"
+              :borderless="!isStatusRegister"
+              :model-value="
+                defaultEducation.educationEndDate == null
+                  ? null
+                  : date2Thai(defaultEducation.educationEndDate)
+              "
+              :rules="[(val) => !!val || `${'กรุณาเลือกวันที่สำเร็จการศึกษา'}`]"
+              :label="`${'วันที่สำเร็จการศึกษา'}`"
+            >
+              <template v-slot:prepend>
+                <q-icon
+                  name="event"
+                  class="cursor-pointer"
+                  :style="
+                    status == 'register' || status == 'rejectRegister'
+                      ? 'color: var(--q-primary)'
+                      : 'color: var(--q-grey)'
+                  "
+                >
+                </q-icon>
+              </template>
+            </q-input>
+          </template>
+        </datepicker>
+      </div>
+      <div class="col-xs-12 col-sm-3">
+        <q-input
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          dense
+          lazy-rules
+          type="number"
+          v-model="defaultEducation.educationScores"
+          :rules="[(val) => !!val || `${'กรุณากรอก คะแนนเฉลี่ยสะสม'}`]"
+          :label="`${'คะแนนเฉลี่ยสะสม'}`"
+        />
+      </div>
+      <div class="col-xs-12 col-sm-3">
+        <q-select
+          :class="getClass(isStatusRegister)"
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          emit-value
+          map-options
+          option-label="name"
+          option-value="id"
+          :options="educationLevelHigherOptions"
+          v-model="defaultEducation.educationLevelHighId"
+          :rules="[(val) => !!val || `${'กรุณาเลือก วุฒิการศึกษาสูงสุด'}`]"
+          :label="`${'วุฒิการศึกษาสูงสุด'}`"
+        />
       </div>
     </div>
-  </q-form>
+  </div>
 </template>
 <script setup lang="ts">
 import { ref, onMounted, watch, PropType, computed } from 'vue'
diff --git a/src/modules/01_exam/components/Form/Information.vue b/src/modules/01_exam/components/Form/Information.vue
index fcc8fad..9912fd0 100644
--- a/src/modules/01_exam/components/Form/Information.vue
+++ b/src/modules/01_exam/components/Form/Information.vue
@@ -1,6 +1,6 @@
 <!-- card ข้อมูลส่วนตัว -->
 <template>
-  <q-form ref="myform" class="col-12 row justify-center">
+  <div class="col-12 row justify-center">
     <div class="row col-xs-12 col-sm-12 col-md-9 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
       <div class="col-12">
         <HeaderTop
@@ -12,6 +12,7 @@
           :editData="false"
         />
       </div>
+
       <div class="col-xs-12 col-sm-3 col-md-4">
         <q-field
           :outlined="isStatusRegister"
@@ -352,7 +353,7 @@
         type="textarea"
       />
     </div> -->
-  </q-form>
+  </div>
 
   <!--  dialog กรอกเลขบัตร -->
   <q-dialog v-model="idModel">
diff --git a/src/modules/01_exam/components/Form/Occupation.vue b/src/modules/01_exam/components/Form/Occupation.vue
index 08e9300..b3877fa 100644
--- a/src/modules/01_exam/components/Form/Occupation.vue
+++ b/src/modules/01_exam/components/Form/Occupation.vue
@@ -8,131 +8,130 @@
     :editOnly="false"
     :editData="false"
   />
-  <q-form ref="myform">
-    <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
-      <div class="col-12">
-        <q-radio
-          v-model="defaultOccupation.positionType"
-          label="ลูกจ้างประจำ"
-          color="teal"
-          val="prem"
-          :disable="!isStatusRegister"
-        />
-        <q-radio
-          v-model="defaultOccupation.positionType"
-          label="ลูกจ้างชั่วคราว"
-          color="teal"
-          val="temp"
-          :disable="!isStatusRegister"
-        />
-        <q-radio
-          v-model="defaultOccupation.positionType"
-          label="ผู้ปฏิบัติงานอื่นในกรุงเทพมหานคร"
-          color="teal"
-          val="other"
-          :disable="!isStatusRegister"
+
+  <div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
+    <div class="col-12">
+      <q-radio
+        v-model="defaultOccupation.positionType"
+        label="ลูกจ้างประจำ"
+        color="teal"
+        val="prem"
+        :disable="!isStatusRegister"
+      />
+      <q-radio
+        v-model="defaultOccupation.positionType"
+        label="ลูกจ้างชั่วคราว"
+        color="teal"
+        val="temp"
+        :disable="!isStatusRegister"
+      />
+      <q-radio
+        v-model="defaultOccupation.positionType"
+        label="ผู้ปฏิบัติงานอื่นในกรุงเทพมหานคร"
+        color="teal"
+        val="other"
+        :disable="!isStatusRegister"
+      />
+    </div>
+    <div class="col-12 row">
+      <div class="col-3">
+        <q-input
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          autogrow
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultOccupation.position"
+          :rules="[(val) => !!val || `${'กรุณากรอก ชื่อตำแหน่ง'}`]"
+          :label="`${'ชื่อตำแหน่ง'}`"
         />
       </div>
-      <div class="col-12 row">
-        <div class="col-3">
-          <q-input
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            autogrow
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultOccupation.position"
-            :rules="[(val) => !!val || `${'กรุณากรอก ชื่อตำแหน่ง'}`]"
-            :label="`${'ชื่อตำแหน่ง'}`"
-          />
-        </div>
-        <div class="col-3">
-          <CurrencyInput
-            class="q-pl-sm"
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            :options="{
-              currency: 'THB'
-            }"
-            lazy-rules
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultOccupation.salary"
-            :rules="[(val:number| undefined) => !!val || `${'กรุณากรอก เงินเดือน'}`]"
-            :label="`${'เงินเดือน'}`"
-          />
-        </div>
-      </div>
-      <div class="col-12 row">
-        <div class="col-3">
-          <q-input
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            autogrow
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultOccupation.group"
-            :rules="[(val) => !!val || `${'กรุณากรอก กลุ่ม/ฝ่าย'}`]"
-            :label="`${'กลุ่ม/ฝ่าย'}`"
-          />
-        </div>
-        <div class="col-3">
-          <q-input
-            class="q-pl-sm"
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            autogrow
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultOccupation.pile"
-            :rules="[(val) => !!val || `${'กรุณากรอก กอง'}`]"
-            :label="`${'กอง'}`"
-          />
-        </div>
-        <div class="col-3">
-          <q-input
-            class="q-pl-sm"
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            autogrow
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultOccupation.org"
-            :rules="[(val) => !!val || `${'กรุณากรอก สังกัด'}`]"
-            :label="`${'สังกัด'}`"
-          />
-        </div>
-        <div class="col-3">
-          <q-input
-            class="q-pl-sm"
-            :class="getClass(isStatusRegister)"
-            :outlined="isStatusRegister"
-            dense
-            lazy-rules
-            :readonly="!isStatusRegister"
-            :borderless="!isStatusRegister"
-            v-model="defaultOccupation.tel"
-            :rules="[(val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์']"
-            :label="`${'เบอร์โทรที่ทำงาน'}`"
-            maxlength="20"
-          />
-          <!-- :counter="isStatusRegister ? true : false" -->
-          <!-- (val) =>
-                (val.length >= 9 && val.length <= 10 && val.startsWith('0')) ||
-                'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง' -->
-          <!-- type="tel" mask="##########" autogrow -->
-        </div>
+      <div class="col-3">
+        <CurrencyInput
+          class="q-pl-sm"
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          :options="{
+            currency: 'THB'
+          }"
+          lazy-rules
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultOccupation.salary"
+          :rules="[(val:number| undefined) => !!val || `${'กรุณากรอก เงินเดือน'}`]"
+          :label="`${'เงินเดือน'}`"
+        />
       </div>
     </div>
-  </q-form>
+    <div class="col-12 row">
+      <div class="col-3">
+        <q-input
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          autogrow
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultOccupation.group"
+          :rules="[(val) => !!val || `${'กรุณากรอก กลุ่ม/ฝ่าย'}`]"
+          :label="`${'กลุ่ม/ฝ่าย'}`"
+        />
+      </div>
+      <div class="col-3">
+        <q-input
+          class="q-pl-sm"
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          autogrow
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultOccupation.pile"
+          :rules="[(val) => !!val || `${'กรุณากรอก กอง'}`]"
+          :label="`${'กอง'}`"
+        />
+      </div>
+      <div class="col-3">
+        <q-input
+          class="q-pl-sm"
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          autogrow
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultOccupation.org"
+          :rules="[(val) => !!val || `${'กรุณากรอก สังกัด'}`]"
+          :label="`${'สังกัด'}`"
+        />
+      </div>
+      <div class="col-3">
+        <q-input
+          class="q-pl-sm"
+          :class="getClass(isStatusRegister)"
+          :outlined="isStatusRegister"
+          dense
+          lazy-rules
+          :readonly="!isStatusRegister"
+          :borderless="!isStatusRegister"
+          v-model="defaultOccupation.tel"
+          :rules="[(val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์']"
+          :label="`${'เบอร์โทรที่ทำงาน'}`"
+          maxlength="20"
+        />
+        <!-- :counter="isStatusRegister ? true : false" -->
+        <!-- (val) =>
+                (val.length >= 9 && val.length <= 10 && val.startsWith('0')) ||
+                'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง' -->
+        <!-- type="tel" mask="##########" autogrow -->
+      </div>
+    </div>
+  </div>
 </template>
 <script setup lang="ts">
 import { ref, onMounted, watch } from 'vue'
diff --git a/src/modules/01_exam/components/Form/Profile.vue b/src/modules/01_exam/components/Form/Profile.vue
index a22b623..16aa14a 100644
--- a/src/modules/01_exam/components/Form/Profile.vue
+++ b/src/modules/01_exam/components/Form/Profile.vue
@@ -1,5 +1,6 @@
 <!-- tab ข้อมูลส่วนบุคคล -->
 <template>
+  <!-- <q-form greedy @submit.prevent @validation-success="onSubmitForm"> -->
   <div class="q-px-sm">
     <Information
       :prefixOptions="prefixOptions"
@@ -62,6 +63,8 @@
   </div>
 
   <q-separator class="q-my-lg bg-gray" size="5px" />
+
+  <!-- </q-form> -->
   <!-- <div class="q-px-sm">
     <Document :status="status" />
   </div> -->
diff --git a/src/modules/01_exam/interface/index/Main.ts b/src/modules/01_exam/interface/index/Main.ts
index fbf9b6a..00bb39d 100644
--- a/src/modules/01_exam/interface/index/Main.ts
+++ b/src/modules/01_exam/interface/index/Main.ts
@@ -161,7 +161,7 @@ const defaultInformation = ref<Information>({
   birthDate: null,
   genderId: null,
   bloodId: null,
-  nationality: 'ไทย',
+  nationality: '',
   ethnicity: null,
   religionId: null,
   tel: null,