From 8982c3da6e8308d167b3a1146b60c1466d98b078 Mon Sep 17 00:00:00 2001
From: AnandaTon <ananda@frappet.com>
Date: Fri, 1 Dec 2023 16:56:43 +0700
Subject: [PATCH] =?UTF-8?q?API=20=E0=B8=AA=E0=B8=A3=E0=B9=89=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=87=E0=B8=84=E0=B8=B3=E0=B8=82=E0=B8=AD=E0=B8=81=E0=B8=B2?=
 =?UTF-8?q?=E0=B8=A3=E0=B8=A5=E0=B8=B2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/api/leave/api.leave.ts                    |  36 +-
 .../05_leave/componenst/Forms/01_SickForm.vue | 106 ++-
 .../05_leave/componenst/Forms/03_Birth.vue    | 602 ++++++++----------
 .../componenst/Forms/04_HelpWifeBirthForm.vue | 126 ++--
 .../componenst/Forms/05_VacationForm.vue      | 124 ++--
 .../componenst/Forms/06_OrdinationForm.vue    | 138 ++--
 .../05_leave/componenst/Forms/07_HajjForm.vue |  76 +--
 .../componenst/Forms/08_MilitaryForm.vue      | 130 ++--
 .../componenst/Forms/09_StudyForm.vue         | 157 +++--
 .../componenst/Forms/10_TrainForm.vue         | 132 ++--
 .../Forms/11_WorkInternationalForm.vue        | 105 ++-
 .../componenst/Forms/12_FollowSpouseForm.vue  | 167 +++--
 .../Forms/13_RehabilitationForm.vue           |  87 +--
 .../05_leave/componenst/Forms/Form.vue        |   4 +-
 .../05_leave/interface/request/AddAbsence.ts  | 103 +--
 .../05_leave/interface/request/BirthForm.ts   |  26 +-
 .../interface/request/FollowSpouseForm.ts     |  38 +-
 .../interface/request/HelpWifeForm.ts         |  34 +-
 .../05_leave/interface/request/SickForm.ts    |  25 +-
 .../interface/request/VacationForm.ts         |  32 +-
 .../request/WorkInternationalForm.ts          |  17 +-
 src/modules/05_leave/views/AddPage.vue        | 386 +++++------
 22 files changed, 1243 insertions(+), 1408 deletions(-)

diff --git a/src/api/leave/api.leave.ts b/src/api/leave/api.leave.ts
index 28a776b..f678737 100644
--- a/src/api/leave/api.leave.ts
+++ b/src/api/leave/api.leave.ts
@@ -1,22 +1,22 @@
-import env from "../index";
+import env from "../index"
 
-const retirementResign = `${env.API_URI}/retirement`;
-const leave = `${env.API_URI}/leave`;
+const retirementResign = `${env.API_URI}/retirement`
+const leave = `${env.API_URI}/leave`
 
 export default {
-  listUser: () => `${retirementResign}/resign/user`,
-  listResign: () => `${retirementResign}/resign`,
-  resingByid: (id: string) => `${retirementResign}/resign/${id}`,
-  questionnaireByid: (id: string) =>
-    `${retirementResign}/resign/questionnaire/${id}`,
-  listquestionnaire: () => `${retirementResign}/resign/questionnaire`,
-  // คำถาม
-  questionList: () => `${retirementResign}/resign/questionnaire/question`,
+	listUser: () => `${retirementResign}/resign/user`,
+	listResign: () => `${retirementResign}/resign`,
+	resingByid: (id: string) => `${retirementResign}/resign/${id}`,
+	questionnaireByid: (id: string) => `${retirementResign}/resign/questionnaire/${id}`,
+	listquestionnaire: () => `${retirementResign}/resign/questionnaire`,
+	// คำถาม
+	questionList: () => `${retirementResign}/resign/questionnaire/question`,
 
-  /**รายการลา */
-  leaveType: () => `${leave}/type`,
-  leaveCalendar: () => `${leave}/user/calendar`,
-  leaveTableList: () => `${leave}/user/table`,
-  leaveCanceById: (id: string) => `${leave}/user/delete/${id}`,
-  leaveStats: () => `${leave}/user/summary`,
-};
+	/**รายการลา */
+	leaveType: () => `${leave}/type`,
+	leaveCalendar: () => `${leave}/user/calendar`,
+	leaveTableList: () => `${leave}/user/table`,
+	leaveCanceById: (id: string) => `${leave}/user/delete/${id}`,
+	leaveStats: () => `${leave}/user/summary`,
+	leaveUser: () => `${leave}/user`,
+}
diff --git a/src/modules/05_leave/componenst/Forms/01_SickForm.vue b/src/modules/05_leave/componenst/Forms/01_SickForm.vue
index b7c0dd4..db4ec26 100644
--- a/src/modules/05_leave/componenst/Forms/01_SickForm.vue
+++ b/src/modules/05_leave/componenst/Forms/01_SickForm.vue
@@ -6,7 +6,7 @@ import { useCounterMixin } from "@/stores/mixin"
 
 const $q = useQuasar()
 const mixin = useCounterMixin()
-const { date2Thai, calculateDurationYmd } = mixin
+const { date2Thai, calculateDurationYmd, dialogConfirm } = mixin
 const edit = ref<boolean>(true)
 
 /** รับ props มาจากหน้าหลัก */
@@ -23,57 +23,54 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	leaveNo: "",
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveWrote: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
 	halfDay: "day",
-	contractTel: "",
 	leaveTotal: "",
 	leaveLast: "",
-	leaveContactTel: "",
-	leaveContactLocation: "",
+	leaveNumber: "",
+	leaveAddress: "",
 	leaveDetail: "",
-	file: [],
+	leaveDocument: [],
 })
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const leaveNoRef = ref<object | null>(null)
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
 const halfDayRef = ref<object | null>(null)
-const contractTelRef = ref<object | null>(null)
 const leaveTotalRef = ref<object | null>(null)
 const leaveLastRef = ref<object | null>(null)
-const leaveContactTelRef = ref<object | null>(null)
-const leaveContactLocationRef = ref<object | null>(null)
+const leaveNumberRef = ref<object | null>(null)
+const leaveAddressRef = ref<object | null>(null)
 const leaveDetailRef = ref<object | null>(null)
-const fileRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const FormRef: FormRef = {
-	leaveNo: leaveNoRef,
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
+	leaveWrote: leaveWroteRef,
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
 	halfDay: halfDayRef,
-	contractTel: contractTelRef,
 	leaveTotal: leaveTotalRef,
-	leaveContactTel: leaveContactTelRef,
-	leaveContactLocation: leaveContactLocationRef,
+	leaveNumber: leaveNumberRef,
+	leaveAddress: leaveAddressRef,
 	leaveDetail: leaveDetailRef,
-	file: fileRef,
+	leaveDocument: leaveDocumentRef,
 }
 
 /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
 watch(props.data, async () => {
 	// console.log("data==>", props.data)
-	formData.leaveNo = props.data.leaveNo
-	formData.startLeaveDate = props.data.startLeaveDate
-	formData.endLeaveDate = props.data.endLeaveDate
+	formData.leaveWrote = props.data.leaveWrote
+	formData.leaveStartDate = props.data.leaveStartDate
+	formData.leaveEndDate = props.data.leaveEndDate
 	formData.contractTel = props.data.contractTel
 	formData.leaveTotal = props.data.leaveTotal
-	formData.leaveContactTel = props.data.leaveContactTel
+	formData.leaveNumber = props.data.leaveNumber
 	formData.leaveDetail = props.data.leaveDetail
-	formData.file = props.data.file
+	formData.leaveDocument = props.data.leaveDocument
 })
 
 /** ส่วนของการประกาศและเลือกไฟล์เอกสารประกอบ */
@@ -85,12 +82,12 @@ async function fileUploadDoc(files: any) {
 }
 
 /**
- * function รีเซทค่า startLeaveDate เเละ endLeaveDate
+ * function รีเซทค่า leaveStartDate เเละ leaveEndDate
  */
 function resetDate() {
 	if (formData.halfDay === "half_day_morning" || formData.halfDay === "half_day_afternoon") {
-		formData.startLeaveDate = null
-		formData.endLeaveDate = null
+		formData.leaveStartDate = null
+		formData.leaveEndDate = null
 	}
 	console.log("testnull")
 }
@@ -108,21 +105,20 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		props.onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
 const isReadOnly = computed(() => {
 	const conditionHalfDay = formData.halfDay === "half_day_morning" || formData.halfDay === "half_day_afternoon"
 	if (conditionHalfDay) {
-		formData.endLeaveDate = formData.startLeaveDate // Set formData.endLeaveDate to null
+		formData.leaveEndDate = formData.leaveStartDate // Set formData.leaveEndDate to null
 		formData.leaveTotal = "0.5 วัน "
 	} else {
 		formData.leaveTotal = null
 	}
 	return conditionHalfDay
 })
-console.log(isReadOnly.value)
 </script>
 
 <!-- ฟอร์มลาป่วย และลากิจส่วนตัว -->
@@ -136,13 +132,13 @@ console.log(isReadOnly.value)
 			<div class="col-12 row q-pa-sm q-col-gutter-sm">
 				<q-input
 					class="col-12 col-sm-12"
-					ref="leaveNoRef"
-					for="leaveNoRef"
+					ref="leaveWroteRef"
+					for="leaveWroteRef"
 					dense
 					hide-bottom-space
 					bg-color="white"
 					outlined
-					v-model="formData.leaveNo"
+					v-model="formData.leaveWrote"
 					label="เขียนที่"
 					:readonly="!edit"
 					:rules="[val => !!val || `${'เขียนที่'}`]"
@@ -158,7 +154,7 @@ console.log(isReadOnly.value)
 						<datepicker
 							class="col-12 col-md-3 col-sm-6"
 							menu-class-name="modalfix"
-							v-model="formData.startLeaveDate"
+							v-model="formData.leaveStartDate"
 							:locale="'th'"
 							autoApply
 							borderless
@@ -176,13 +172,13 @@ console.log(isReadOnly.value)
 								<q-input
 									outlined
 									dense
-									ref="startLeaveDateRef"
-									for="startLeaveDateRef"
+									ref="leaveStartDateRef"
+									for="leaveStartDateRef"
 									hide-bottom-space
 									:readonly="!edit"
 									bg-color="white"
 									class="full-width datepicker"
-									:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+									:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 									:label="`${'ลาตั้งแต่วันที่'}`"
 									:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 								>
@@ -196,14 +192,14 @@ console.log(isReadOnly.value)
 						<datepicker
 							class="col-12 col-md-3 col-sm-6"
 							menu-class-name="modalfix"
-							v-model="formData.endLeaveDate"
+							v-model="formData.leaveEndDate"
 							:locale="'th'"
 							autoApply
 							borderless
 							:enableTimePicker="false"
 							week-start="0"
 							:readonly="isReadOnly"
-							:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+							:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 						>
 							<template #year="{ year }">
 								{{ year + 543 }}
@@ -215,13 +211,13 @@ console.log(isReadOnly.value)
 								<q-input
 									outlined
 									dense
-									ref="endLeaveDateRef"
-									for="endLeaveDateRef"
+									ref="leaveEndDateRef"
+									for="leaveEndDateRef"
 									hide-bottom-space
 									bg-color="white"
 									:readonly="isReadOnly"
 									class="full-width datepicker"
-									:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+									:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 									:label="`${'ลาถึงวันที่'}`"
 									:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 								>
@@ -263,9 +259,9 @@ console.log(isReadOnly.value)
 							class="col-12 col-md-3 col-sm-6"
 							dense
 							outlined
-							ref="leaveContactTelRef"
-							for="leaveContactTelRef"
-							v-model="formData.leaveContactTel"
+							ref="leaveNumberRef"
+							for="leaveNumberRef"
+							v-model="formData.leaveNumber"
 							mask="(###)-###-####"
 							hide-bottom-space
 							bg-color="white"
@@ -279,9 +275,9 @@ console.log(isReadOnly.value)
 							class="col-12 col-md-9 col-sm-6"
 							dense
 							outlined
-							ref="leaveContactLocationRef"
-							for="leaveContactLocationRef"
-							v-model="formData.leaveContactLocation"
+							ref="leaveAddressRef"
+							for="leaveAddressRef"
+							v-model="formData.leaveAddress"
 							label="ที่อยู่ที่ติดต่อได้ระหว่างลา"
 							:readonly="!edit"
 							:rules="[val => !!val || `${'กรุณากรอกที่อยู่ที่ติดต่อได้ระหว่างลา'}`]"
@@ -305,9 +301,9 @@ console.log(isReadOnly.value)
 				<div class="full-width">
 					<div class="q-col-gutter-sm row">
 						<q-file
-							ref="fileRef"
-							for="fileRef"
-							v-model="formData.file"
+							ref="leaveDocumentRef"
+							for="leaveDocumentRef"
+							v-model="formData.leaveDocument"
 							@added="fileUploadDoc"
 							dense
 							label="เอกสารประกอบ"
@@ -330,7 +326,7 @@ console.log(isReadOnly.value)
 					</div>
 					<q-card bordered flat class="full-width">
 						<q-list separator>
-							<q-item v-for="(file, index) in formData.file" :key="index" class="q-my-xs">
+							<q-item v-for="(file, index) in formData.leaveDocument" :key="index" class="q-my-xs">
 								<q-item-section>
 									<q-item-label class="full-width ellipsis">
 										{{ file.name }}
diff --git a/src/modules/05_leave/componenst/Forms/03_Birth.vue b/src/modules/05_leave/componenst/Forms/03_Birth.vue
index da32aca..a76f117 100644
--- a/src/modules/05_leave/componenst/Forms/03_Birth.vue
+++ b/src/modules/05_leave/componenst/Forms/03_Birth.vue
@@ -1,361 +1,313 @@
 <script setup lang="ts">
-import { ref, reactive, watch } from "vue";
-import type {
-  FormData,
-  FormRef,
-} from "@/modules/05_leave/interface/request/BirthForm";
-import { useCounterMixin } from "@/stores/mixin";
+import { ref, reactive, watch } from "vue"
+import type { FormData, FormRef } from "@/modules/05_leave/interface/request/BirthForm"
+import { useCounterMixin } from "@/stores/mixin"
 
-const mixin = useCounterMixin();
-const { date2Thai, calculateDurationYmd } = mixin;
-const edit = ref<boolean>(true);
+const mixin = useCounterMixin()
+const { date2Thai, calculateDurationYmd } = mixin
+const edit = ref<boolean>(true)
 
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
-  data: {
-    type: Object,
-    default: null,
-  },
-  onSubmit: {
-    type: Function,
-    default: () => "",
-  },
-});
+	data: {
+		type: Object,
+		default: null,
+	},
+	onSubmit: {
+		type: Function,
+		default: () => "",
+	},
+})
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-  leaveNo: "",
-  startLeaveDate: null,
-  endLeaveDate: null,
-  contractTel: "",
-  leaveTotal: "",
-  leaveLast: "",
-  leaveContactTel: "",
-  leaveContactLocation: "",
-  leaveDetail: "",
-  file: [],
-});
+	leaveWrote: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
+	leaveTotal: "",
+	leaveLast: "",
+	leaveNumber: "",
+	leaveAddress: "",
+	leaveDetail: "",
+	leaveDocument: [],
+})
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const leaveNoRef = ref<object | null>(null);
-const startLeaveDateRef = ref<object | null>(null);
-const endLeaveDateRef = ref<object | null>(null);
-const contractTelRef = ref<object | null>(null);
-const leaveTotalRef = ref<object | null>(null);
-const leaveContactTelRef = ref<object | null>(null);
-const leaveContactLocationRef = ref<object | null>(null);
-const leaveDetailRef = ref<object | null>(null);
-const fileRef = ref<object | null>(null);
+const leaveWroteRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
+const leaveTotalRef = ref<object | null>(null)
+const leaveNumberRef = ref<object | null>(null)
+const leaveAddressRef = ref<object | null>(null)
+const leaveDetailRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const FormRef: FormRef = {
-  leaveNo: leaveNoRef,
-  startLeaveDate: startLeaveDateRef,
-  endLeaveDate: endLeaveDateRef,
-  contractTel: contractTelRef,
-  leaveTotal: leaveTotalRef,
-  leaveContactTel: leaveContactTelRef,
-  leaveContactLocation: leaveContactLocationRef,
-  leaveDetail: leaveDetailRef,
-  file: fileRef,
-};
+	leaveWrote: leaveWroteRef,
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
+	leaveTotal: leaveTotalRef,
+	leaveNumber: leaveNumberRef,
+	leaveAddress: leaveAddressRef,
+	leaveDetail: leaveDetailRef,
+	leaveDocument: leaveDocumentRef,
+}
 
 /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
 watch(props.data, async () => {
-  // console.log("data==>", props.data)
-  formData.leaveNo = props.data.leaveNo;
-  formData.startLeaveDate = props.data.startLeaveDate;
-  formData.endLeaveDate = props.data.endLeaveDate;
-  formData.contractTel = props.data.contractTel;
-  formData.leaveTotal = props.data.leaveTotal;
-  formData.leaveContactTel = props.data.leaveContactTel;
-  formData.leaveDetail = props.data.leaveDetail;
-  formData.file = props.data.file;
-});
+	// console.log("data==>", props.data)
+	formData.leaveWrote = props.data.leaveWrote
+	formData.leaveStartDate = props.data.leaveStartDate
+	formData.leaveEndDate = props.data.leaveEndDate
+	formData.leaveTotal = props.data.leaveTotal
+	formData.leaveNumber = props.data.leaveNumber
+	formData.leaveDetail = props.data.leaveDetail
+	formData.leaveDocument = props.data.leaveDocument
+})
 
 /** ส่วนของการประกาศและเลือกไฟล์เอกสารประกอบ */
-const fileDocDataUpload = ref<File[]>([]);
+const fileDocDataUpload = ref<File[]>([])
 async function fileUploadDoc(files: any) {
-  files.forEach((file: any) => {
-    fileDocDataUpload.value.push(file);
-  });
+	files.forEach((file: any) => {
+		fileDocDataUpload.value.push(file)
+	})
 }
 
 /** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */
 function onValidate() {
-  const hasError = [];
-  for (const key in FormRef) {
-    if (Object.prototype.hasOwnProperty.call(FormRef, key)) {
-      const property = FormRef[key];
-      if (property.value && typeof property.value.validate === "function") {
-        const isValid = property.value.validate();
-        hasError.push(isValid);
-      }
-    }
-  }
-  if (hasError.every((result) => result === true)) {
-    props.onSubmit();
-  }
+	const hasError = []
+	for (const key in FormRef) {
+		if (Object.prototype.hasOwnProperty.call(FormRef, key)) {
+			const property = FormRef[key]
+			if (property.value && typeof property.value.validate === "function") {
+				const isValid = property.value.validate()
+				hasError.push(isValid)
+			}
+		}
+	}
+	if (hasError.every(result => result === true)) {
+		props.onSubmit(formData)
+	}
 }
 </script>
 
 <!-- ฟอร์มลาคลอดบุตร-->
 <template>
-  <div style="display: flex; align-items: center">
-    <q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
-    <div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
-  </div>
-  <form @submit.prevent.stop="onValidate">
-    <q-card bordered class="q-pa-md bg-grey-1">
-      <div class="col-12 row q-pa-sm q-col-gutter-sm">
-        <q-input
-          class="col-12 col-sm-12"
-          ref="leaveNoRef"
-          for="leaveNoRef"
-          dense
-          outlined
-          v-model="formData.leaveNo"
-          label="เขียนที่"
-          hide-bottom-space
-          bg-color="white"
-          :readonly="!edit"
-          :rules="[(val) => !!val || `${'เขียนที่'}`]"
-        />
+	<div style="display: flex; align-items: center">
+		<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
+		<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
+	</div>
+	<form @submit.prevent.stop="onValidate">
+		<q-card bordered class="q-pa-md bg-grey-1">
+			<div class="col-12 row q-pa-sm q-col-gutter-sm">
+				<q-input
+					class="col-12 col-sm-12"
+					ref="leaveWroteRef"
+					for="leaveWroteRef"
+					dense
+					outlined
+					v-model="formData.leaveWrote"
+					label="เขียนที่"
+					hide-bottom-space
+					bg-color="white"
+					:readonly="!edit"
+					:rules="[val => !!val || `${'เขียนที่'}`]"
+				/>
 
-        <datepicker
-          class="col-12 col-md-3 col-sm-12"
-          menu-class-name="modalfix"
-          v-model="formData.startLeaveDate"
-          :locale="'th'"
-          autoApply
-          hide-bottom-space
-          borderless
-          :enableTimePicker="false"
-          week-start="0"
-          :readonly="!edit"
-        >
-          <template #year="{ year }">
-            {{ year + 543 }}
-          </template>
-          <template #year-overlay-value="{ value }">
-            {{ parseInt(value + 543) }}
-          </template>
-          <template #trigger>
-            <q-input
-              outlined
-              dense
-              ref="startLeaveDateRef"
-              for="startLeaveDateRef"
-              hide-bottom-space
-              bg-color="white"
-              :readonly="!edit"
-              class="full-width datepicker"
-              :model-value="
-                formData.startLeaveDate != null
-                  ? date2Thai(formData.startLeaveDate)
-                  : null
-              "
-              :label="`${'ลาตั้งแต่วันที่'}`"
-              :rules="[(val) => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
-            >
-              <template v-slot:prepend>
-                <q-icon
-                  name="event"
-                  class="cursor-pointer"
-                  style="color: var(--q-primary)"
-                >
-                </q-icon>
-              </template>
-            </q-input>
-          </template>
-        </datepicker>
+				<datepicker
+					class="col-12 col-md-3 col-sm-12"
+					menu-class-name="modalfix"
+					v-model="formData.leaveStartDate"
+					:locale="'th'"
+					autoApply
+					hide-bottom-space
+					borderless
+					:enableTimePicker="false"
+					week-start="0"
+					:readonly="!edit"
+				>
+					<template #year="{ year }">
+						{{ year + 543 }}
+					</template>
+					<template #year-overlay-value="{ value }">
+						{{ parseInt(value + 543) }}
+					</template>
+					<template #trigger>
+						<q-input
+							outlined
+							dense
+							ref="leaveStartDateRef"
+							for="leaveStartDateRef"
+							hide-bottom-space
+							bg-color="white"
+							:readonly="!edit"
+							class="full-width datepicker"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
+							:label="`${'ลาตั้งแต่วันที่'}`"
+							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
+						>
+							<template v-slot:prepend>
+								<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
+							</template>
+						</q-input>
+					</template>
+				</datepicker>
 
-        <datepicker
-          class="col-12 col-md-3 col-sm-12"
-          menu-class-name="modalfix"
-          v-model="formData.endLeaveDate"
-          :locale="'th'"
-          autoApply
-          borderless
-          hide-bottom-space
-          :enableTimePicker="false"
-          week-start="0"
-          :readonly="!formData.startLeaveDate"
-          :min-date="
-            formData.startLeaveDate
-              ? new Date(
-                  formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000
-                )
-              : null
-          "
-        >
-          <template #year="{ year }">
-            {{ year + 543 }}
-          </template>
-          <template #year-overlay-value="{ value }">
-            {{ parseInt(value + 543) }}
-          </template>
-          <template #trigger>
-            <q-input
-              outlined
-              dense
-              ref="endLeaveDateRef"
-              for="endLeaveDateRef"
-              hide-bottom-space
-              bg-color="white"
-              :readonly="!formData.startLeaveDate"
-              class="full-width datepicker"
-              :model-value="
-                formData.endLeaveDate != null
-                  ? date2Thai(formData.endLeaveDate)
-                  : null
-              "
-              :label="`${'ลาถึงวันที่'}`"
-              :rules="[(val) => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
-            >
-              <template v-slot:prepend>
-                <q-icon
-                  name="event"
-                  class="cursor-pointer"
-                  style="color: var(--q-primary)"
-                >
-                </q-icon>
-              </template>
-            </q-input>
-          </template>
-        </datepicker>
-        <q-input
-          class="col-12 col-md-3 col-sm-6"
-          dense
-          outlined
-          ref="leaveTotalRef"
-          for="leaveTotalRef"
-          v-model="formData.leaveTotal"
-          label="จำนวนวันที่ลา"
-          bg-color="white"
-          readonly
-          hide-bottom-space
-        />
-        <q-input
-          class="col-12 col-md-3 col-sm-6"
-          dense
-          outlined
-          ref="leaveLastRef"
-          for="leaveLastRef"
-          v-model="formData.leaveLast"
-          label="ลาครั้งสุดท้ายเมื่อวันที่"
-          readonly
-          hide-bottom-space
-          bg-color="white"
-        />
-        <div class="full-width">
-          <div class="q-col-gutter-sm row">
-            <q-input
-              class="col-12 col-md-3 col-sm-12"
-              dense
-              outlined
-              hide-bottom-space
-              bg-color="white"
-              ref="leaveContactTelRef"
-              for="leaveContactTelRef"
-              v-model="formData.leaveContactTel"
-              mask="(###)-###-####"
-              unmasked-value
-              label="หมายเลขโทรศัพท์ที่ติดต่อได้"
-              :readonly="!edit"
-              :rules="[
-                (val) => !!val || `${'กรุณากรอกหมายเลขโทรศัพท์ที่ติดต่อได้'}`,
-              ]"
-            />
+				<datepicker
+					class="col-12 col-md-3 col-sm-12"
+					menu-class-name="modalfix"
+					v-model="formData.leaveEndDate"
+					:locale="'th'"
+					autoApply
+					borderless
+					hide-bottom-space
+					:enableTimePicker="false"
+					week-start="0"
+					:readonly="!formData.leaveStartDate"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
+				>
+					<template #year="{ year }">
+						{{ year + 543 }}
+					</template>
+					<template #year-overlay-value="{ value }">
+						{{ parseInt(value + 543) }}
+					</template>
+					<template #trigger>
+						<q-input
+							outlined
+							dense
+							ref="leaveEndDateRef"
+							for="leaveEndDateRef"
+							hide-bottom-space
+							bg-color="white"
+							:readonly="!formData.leaveStartDate"
+							class="full-width datepicker"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
+							:label="`${'ลาถึงวันที่'}`"
+							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
+						>
+							<template v-slot:prepend>
+								<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
+							</template>
+						</q-input>
+					</template>
+				</datepicker>
+				<q-input
+					class="col-12 col-md-3 col-sm-6"
+					dense
+					outlined
+					ref="leaveTotalRef"
+					for="leaveTotalRef"
+					v-model="formData.leaveTotal"
+					label="จำนวนวันที่ลา"
+					bg-color="white"
+					readonly
+					hide-bottom-space
+				/>
+				<q-input
+					class="col-12 col-md-3 col-sm-6"
+					dense
+					outlined
+					ref="leaveLastRef"
+					for="leaveLastRef"
+					v-model="formData.leaveLast"
+					label="ลาครั้งสุดท้ายเมื่อวันที่"
+					readonly
+					hide-bottom-space
+					bg-color="white"
+				/>
+				<div class="full-width">
+					<div class="q-col-gutter-sm row">
+						<q-input
+							class="col-12 col-md-3 col-sm-12"
+							dense
+							outlined
+							hide-bottom-space
+							bg-color="white"
+							ref="leaveNumberRef"
+							for="leaveNumberRef"
+							v-model="formData.leaveNumber"
+							mask="(###)-###-####"
+							unmasked-value
+							label="หมายเลขโทรศัพท์ที่ติดต่อได้"
+							:readonly="!edit"
+							:rules="[val => !!val || `${'กรุณากรอกหมายเลขโทรศัพท์ที่ติดต่อได้'}`]"
+						/>
 
-            <q-input
-              class="col-12 col-md-9 col-sm-12"
-              dense
-              outlined
-              hide-bottom-space
-              bg-color="white"
-              ref="leaveContactLocationRef"
-              for="leaveContactLocationRef"
-              v-model="formData.leaveContactLocation"
-              label="ที่อยู่ที่ติดต่อได้ระหว่างลา"
-              :readonly="!edit"
-              :rules="[
-                (val) => !!val || `${'กรุณากรอกที่อยู่ที่ติดต่อได้ระหว่างลา'}`,
-              ]"
-            />
-          </div>
-        </div>
-        <q-input
-          type="textarea"
-          class="col-12 col-md-12 col-sm-12"
-          dense
-          outlined
-          bg-color="white"
-          ref="leaveDetailRef"
-          for="leaveDetailRef"
-          v-model="formData.leaveDetail"
-          label="รายละเอียด"
-          :readonly="!edit"
-        />
+						<q-input
+							class="col-12 col-md-9 col-sm-12"
+							dense
+							outlined
+							hide-bottom-space
+							bg-color="white"
+							ref="leaveAddressRef"
+							for="leaveAddressRef"
+							v-model="formData.leaveAddress"
+							label="ที่อยู่ที่ติดต่อได้ระหว่างลา"
+							:readonly="!edit"
+							:rules="[val => !!val || `${'กรุณากรอกที่อยู่ที่ติดต่อได้ระหว่างลา'}`]"
+						/>
+					</div>
+				</div>
+				<q-input
+					type="textarea"
+					class="col-12 col-md-12 col-sm-12"
+					dense
+					outlined
+					bg-color="white"
+					ref="leaveDetailRef"
+					for="leaveDetailRef"
+					v-model="formData.leaveDetail"
+					label="รายละเอียด"
+					:readonly="!edit"
+				/>
 
-        <q-file
-          ref="fileRef"
-          for="fileRef"
-          hide-bottom-space
-          v-model="formData.file"
-          @added="fileUploadDoc"
-          dense
-          bg-color="white"
-          label="เอกสารประกอบ"
-          outlined
-          use-chips
-          multiple
-          class="q-pl-sm col-12"
-          :rules="[(val) => !!val || `${'กรุณาเลือกไฟล์'}`]"
-        >
-          <template v-slot:prepend>
-            <q-icon name="attach_file" color="primary" />
-          </template>
-        </q-file>
+				<q-file
+					ref="leaveDocumentRef"
+					for="leaveDocumentRef"
+					hide-bottom-space
+					v-model="formData.leaveDocument"
+					@added="fileUploadDoc"
+					dense
+					bg-color="white"
+					label="เอกสารประกอบ"
+					outlined
+					use-chips
+					multiple
+					class="q-pl-sm col-12"
+					:rules="[val => !!val || `${'กรุณาเลือกไฟล์'}`]"
+				>
+					<template v-slot:prepend>
+						<q-icon name="attach_file" color="primary" />
+					</template>
+				</q-file>
 
-        <div class="col-12 row" v-if="!edit">
-          <div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
-            <div class="q-pl-sm text-weight-bold text-dark">
-              เอกสารเพิ่มเติม
-            </div>
-          </div>
-          <q-card bordered flat class="full-width">
-            <q-list separator>
-              <q-item
-                v-for="(file, index) in formData.file"
-                :key="index"
-                class="q-my-xs"
-              >
-                <q-item-section>
-                  <q-item-label class="full-width ellipsis">
-                    {{ file.name }}
-                  </q-item-label>
-                  <q-item-label caption> </q-item-label>
-                </q-item-section>
-              </q-item>
-            </q-list>
-          </q-card>
-        </div>
-      </div>
-    </q-card>
+				<div class="col-12 row" v-if="!edit">
+					<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
+						<div class="q-pl-sm text-weight-bold text-dark">เอกสารเพิ่มเติม</div>
+					</div>
+					<q-card bordered flat class="full-width">
+						<q-list separator>
+							<q-item v-for="(file, index) in formData.leaveDocument" :key="index" class="q-my-xs">
+								<q-item-section>
+									<q-item-label class="full-width ellipsis">
+										{{ file.name }}
+									</q-item-label>
+									<q-item-label caption> </q-item-label>
+								</q-item-section>
+							</q-item>
+						</q-list>
+					</q-card>
+				</div>
+			</div>
+		</q-card>
 
-    <q-separator class="q-mt-sm" />
+		<q-separator class="q-mt-sm" />
 
-    <div class="row col-12 q-pt-md">
-      <q-space />
-      <q-btn
-        id="onSubmit"
-        type="submit"
-        unelevated
-        dense
-        class="q-px-md items-center btnBlue"
-        label="ยื่นใบลา"
-      />
-    </div>
-  </form>
+		<div class="row col-12 q-pt-md">
+			<q-space />
+			<q-btn id="onSubmit" type="submit" unelevated dense class="q-px-md items-center btnBlue" label="ยื่นใบลา" />
+		</div>
+	</form>
 </template>
diff --git a/src/modules/05_leave/componenst/Forms/04_HelpWifeBirthForm.vue b/src/modules/05_leave/componenst/Forms/04_HelpWifeBirthForm.vue
index 75fd7cd..31a36d1 100644
--- a/src/modules/05_leave/componenst/Forms/04_HelpWifeBirthForm.vue
+++ b/src/modules/05_leave/componenst/Forms/04_HelpWifeBirthForm.vue
@@ -21,60 +21,58 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	leaveNo: "",
-	wifeName: "",
-	brithDate: null,
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveWrote: "",
+	wifeDayName: "",
+	wifeDayDateBorn: null,
+	leaveStartDate: null,
+	leaveEndDate: null,
 	contractTel: "",
 	leaveTotal: "",
-	leaveContactTel: "",
-	leaveContactLocation: "",
+	leaveNumber: "",
+	leaveAddress: "",
 	leaveDetail: "",
-	file: [],
+	leaveDocument: [],
 })
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const leaveNoRef = ref<object | null>(null)
-const wifeNameRef = ref<object | null>(null)
-const brithDateRef = ref<object | null>(null)
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
+const wifeDayNameRef = ref<object | null>(null)
+const wifeDayDateBornRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
 const contractTelRef = ref<object | null>(null)
 const leaveTotalRef = ref<object | null>(null)
-const leaveContactTelRef = ref<object | null>(null)
-const leaveContactLocationRef = ref<object | null>(null)
+const leaveNumberRef = ref<object | null>(null)
+const leaveAddressRef = ref<object | null>(null)
 const leaveDetailRef = ref<object | null>(null)
-const fileRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const FormRef: FormRef = {
-	leaveNo: leaveNoRef,
-	wifeName: wifeNameRef,
-	brithDate: brithDateRef,
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
-	contractTel: contractTelRef,
+	leaveWrote: leaveWroteRef,
+	wifeDayName: wifeDayNameRef,
+	wifeDayDateBorn: wifeDayDateBornRef,
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
 	leaveTotal: leaveTotalRef,
-	leaveContactTel: leaveContactTelRef,
-	leaveContactLocation: leaveContactLocationRef,
+	leaveNumber: leaveNumberRef,
+	leaveAddress: leaveAddressRef,
 	leaveDetail: leaveDetailRef,
-	file: fileRef,
+	leaveDocument: leaveDocumentRef,
 }
 
 /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
 watch(props.data, async () => {
 	// console.log("data==>", props.data)
-	formData.leaveNo = props.data.leaveNo
-	formData.wifeName = props.data.wifeName
-	formData.brithDate = props.data.brithDate
-	formData.startLeaveDate = props.data.startLeaveDate
-	formData.endLeaveDate = props.data.endLeaveDate
-	formData.contractTel = props.data.contractTel
+	formData.leaveWrote = props.data.leaveWrote
+	formData.wifeDayName = props.data.wifeDayName
+	formData.wifeDayDateBorn = props.data.wifeDayDateBorn
+	formData.leaveStartDate = props.data.leaveStartDate
+	formData.leaveEndDate = props.data.leaveEndDate
 	formData.leaveTotal = props.data.leaveTotal
-	formData.leaveContactTel = props.data.leaveContactTel
+	formData.leaveNumber = props.data.leaveNumber
 	formData.leaveDetail = props.data.leaveDetail
-	formData.file = props.data.file
+	formData.leaveDocument = props.data.leaveDocument
 })
 
 /** ส่วนของการประกาศและเลือกไฟล์เอกสารประกอบ */
@@ -98,7 +96,7 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		props.onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
@@ -106,7 +104,7 @@ function onValidate() {
  * function อัพเดทค่า LeaveTotal
  */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+	const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
@@ -138,13 +136,13 @@ function updateLeaveTotal() {
 			<div class="col-12 row q-pa-sm q-col-gutter-sm">
 				<q-input
 					class="col-12 col-12 col-sm-12"
-					ref="leaveNoRef"
-					for="leaveNoRef"
+					ref="leaveWroteRef"
+					for="leaveWroteRef"
 					dense
 					outlined
 					hide-bottom-space
 					bg-color="white"
-					v-model="formData.leaveNo"
+					v-model="formData.leaveWrote"
 					label="เขียนที่"
 					:readonly="!edit"
 					:rules="[val => !!val || `${'เขียนที่'}`]"
@@ -152,7 +150,7 @@ function updateLeaveTotal() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-12"
 					menu-class-name="modalfix"
-					v-model="formData.startLeaveDate"
+					v-model="formData.leaveStartDate"
 					:locale="'th'"
 					autoApply
 					hide-bottom-space
@@ -171,13 +169,13 @@ function updateLeaveTotal() {
 						<q-input
 							outlined
 							dense
-							ref="startLeaveDateRef"
-							for="startLeaveDateRef"
+							ref="leaveStartDateRef"
+							for="leaveStartDateRef"
 							hide-bottom-space
 							bg-color="white"
 							:readonly="!edit"
 							class="full-width datepicker"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@@ -191,7 +189,7 @@ function updateLeaveTotal() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-12"
 					menu-class-name="modalfix"
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					:locale="'th'"
 					autoApply
 					borderless
@@ -199,8 +197,8 @@ function updateLeaveTotal() {
 					:enableTimePicker="false"
 					@update:model-value="updateLeaveTotal"
 					week-start="0"
-					:readonly="!formData.startLeaveDate"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:readonly="!formData.leaveStartDate"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -212,13 +210,13 @@ function updateLeaveTotal() {
 						<q-input
 							outlined
 							dense
-							ref="endLeaveDateRef"
-							for="endLeaveDateRef"
+							ref="leaveEndDateRef"
+							for="leaveEndDateRef"
 							hide-bottom-space
 							bg-color="white"
-							:readonly="!formData.startLeaveDate"
+							:readonly="!formData.leaveStartDate"
 							class="full-width datepicker"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
@@ -243,13 +241,13 @@ function updateLeaveTotal() {
 				<div class="col-12 col-md-4 col-sm-12">
 					<q-input
 						class="col-12 col-sm-12"
-						ref="wifeNameRef"
-						for="wifeNameRef"
+						ref="wifeDayNameRef"
+						for="wifeDayNameRef"
 						dense
 						bg-color="white"
 						outlined
 						hide-bottom-space
-						v-model="formData.wifeName"
+						v-model="formData.wifeDayName"
 						label="ชื่อภรรยา"
 						:readonly="!edit"
 						:rules="[val => !!val || `${'ชื่อภรรยา'}`]"
@@ -259,7 +257,7 @@ function updateLeaveTotal() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-12"
 					menu-class-name="modalfix"
-					v-model="formData.brithDate"
+					v-model="formData.wifeDayDateBorn"
 					:locale="'th'"
 					autoApply
 					borderless
@@ -278,13 +276,13 @@ function updateLeaveTotal() {
 						<q-input
 							outlined
 							dense
-							ref="brithDateRef"
-							for="brithDateRef"
+							ref="wifeDayDateBornRef"
+							for="wifeDayDateBornRef"
 							hide-bottom-space
 							bg-color="white"
 							:readonly="!edit"
 							class="full-width datepicker"
-							:model-value="formData.brithDate != null ? date2Thai(formData.brithDate) : null"
+							:model-value="formData.wifeDayDateBorn != null ? date2Thai(formData.wifeDayDateBorn) : null"
 							:label="`${'วันที่คลอด'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกวันที่คลอด'}`]"
 						>
@@ -300,9 +298,9 @@ function updateLeaveTotal() {
 							class="col-12 col-md-3 col-sm-12"
 							dense
 							outlined
-							ref="leaveContactTelRef"
-							for="leaveContactTelRef"
-							v-model="formData.leaveContactTel"
+							ref="leaveNumberRef"
+							for="leaveNumberRef"
+							v-model="formData.leaveNumber"
 							mask="(###)-###-####"
 							unmasked-value
 							hide-bottom-space
@@ -318,9 +316,9 @@ function updateLeaveTotal() {
 							outlined
 							hide-bottom-space
 							bg-color="white"
-							ref="leaveContactLocationRef"
-							for="leaveContactLocationRef"
-							v-model="formData.leaveContactLocation"
+							ref="leaveAddressRef"
+							for="leaveAddressRef"
+							v-model="formData.leaveAddress"
 							label="ที่อยู่ที่ติดต่อได้ระหว่างลา"
 							:readonly="!edit"
 							:rules="[val => !!val || `${'กรุณากรอกที่อยู่ที่ติดต่อได้ระหว่างลา'}`]"
@@ -341,7 +339,7 @@ function updateLeaveTotal() {
 					:readonly="!edit"
 				/>
 
-				<q-file bg-color="white" ref="fileRef" v-model="formData.file" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
+				<q-file bg-color="white" ref="leaveDocumentRef" v-model="formData.leaveDocument" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
 					<template v-slot:prepend>
 						<q-icon name="attach_file" color="primary" />
 					</template>
@@ -353,7 +351,7 @@ function updateLeaveTotal() {
 					</div>
 					<q-card bordered flat class="full-width">
 						<q-list separator>
-							<q-item v-for="(file, index) in formData.file" :key="index" class="q-my-xs">
+							<q-item v-for="(file, index) in formData.leaveDocument" :key="index" class="q-my-xs">
 								<q-item-section>
 									<q-item-label class="full-width ellipsis">
 										{{ file.name }}
diff --git a/src/modules/05_leave/componenst/Forms/05_VacationForm.vue b/src/modules/05_leave/componenst/Forms/05_VacationForm.vue
index 7b7af0c..f63c91c 100644
--- a/src/modules/05_leave/componenst/Forms/05_VacationForm.vue
+++ b/src/modules/05_leave/componenst/Forms/05_VacationForm.vue
@@ -21,63 +21,63 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	leaveNo: "",
+	leaveWrote: "",
 	halfDay: "day",
-	lastYearVacation: "",
-	currentVacation: "",
-	startLeaveDate: null,
-	endLeaveDate: null,
+	restDayOldTotal: "",
+	restDayCurrentTotal: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
 	contractTel: "",
 	leaveTotal: "",
-	leaveContactTel: "",
-	leaveContactLocation: "",
+	leaveNumber: "",
+	leaveAddress: "",
 	leaveDetail: "",
-	file: [],
+	leaveDocument: [],
 })
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const leaveNoRef = ref<object | null>(null)
-const lastYearVacationRef = ref<object | null>(null)
-const currentVacationRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
+const restDayOldTotalRef = ref<object | null>(null)
+const restDayCurrentTotalRef = ref<object | null>(null)
 const halfDayRef = ref<object | null>(null)
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
 const contractTelRef = ref<object | null>(null)
 const leaveTotalRef = ref<object | null>(null)
-const leaveContactTelRef = ref<object | null>(null)
-const leaveContactLocationRef = ref<object | null>(null)
+const leaveNumberRef = ref<object | null>(null)
+const leaveAddressRef = ref<object | null>(null)
 const leaveDetailRef = ref<object | null>(null)
-const fileRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const FormRef: FormRef = {
-	leaveNo: leaveNoRef,
+	leaveWrote: leaveWroteRef,
 	halfDay: halfDayRef,
-	lastYearVacation: lastYearVacationRef,
-	currentVacation: currentVacationRef,
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
+	restDayOldTotal: restDayOldTotalRef,
+	restDayCurrentTotal: restDayCurrentTotalRef,
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
 	contractTel: contractTelRef,
 	leaveTotal: leaveTotalRef,
-	leaveContactTel: leaveContactTelRef,
-	leaveContactLocation: leaveContactLocationRef,
+	leaveNumber: leaveNumberRef,
+	leaveAddress: leaveAddressRef,
 	leaveDetail: leaveDetailRef,
-	file: fileRef,
+	leaveDocument: leaveDocumentRef,
 }
 
 /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
 watch(props.data, async () => {
 	// console.log("data==>", props.data)
-	formData.leaveNo = props.data.leaveNo
-	formData.lastYearVacation = props.data.lastYearVacation
-	formData.currentVacation = props.data.currentVacation
-	formData.startLeaveDate = props.data.startLeaveDate
-	formData.endLeaveDate = props.data.endLeaveDate
+	formData.leaveWrote = props.data.leaveWrote
+	formData.restDayOldTotal = props.data.restDayOldTotal
+	formData.restDayCurrentTotal = props.data.restDayCurrentTotal
+	formData.leaveStartDate = props.data.leaveStartDate
+	formData.leaveEndDate = props.data.leaveEndDate
 	formData.contractTel = props.data.contractTel
 	formData.leaveTotal = props.data.leaveTotal
-	formData.leaveContactTel = props.data.leaveContactTel
+	formData.leaveNumber = props.data.leaveNumber
 	formData.leaveDetail = props.data.leaveDetail
-	formData.file = props.data.file
+	formData.leaveDocument = props.data.leaveDocument
 })
 
 /** ส่วนของการประกาศและเลือกไฟล์เอกสารประกอบ */
@@ -101,17 +101,17 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		props.onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
 /**
- * function รีเซทค่า startLeaveDate เเละ endLeaveDate
+ * function รีเซทค่า leaveStartDate เเละ leaveEndDate
  */
 function resetDate() {
 	if (formData.halfDay === "half_day_morning" || formData.halfDay === "half_day_afternoon") {
-		formData.startLeaveDate = null
-		formData.endLeaveDate = null
+		formData.leaveStartDate = null
+		formData.leaveEndDate = null
 	}
 	console.log("testnull")
 }
@@ -119,7 +119,7 @@ function resetDate() {
 const isReadOnly = computed(() => {
 	const conditionHalfDay = formData.halfDay === "half_day_morning" || formData.halfDay === "half_day_afternoon"
 	if (conditionHalfDay) {
-		formData.endLeaveDate = formData.startLeaveDate // Set formData.endLeaveDate to null
+		formData.leaveEndDate = formData.leaveStartDate // Set formData.leaveEndDate to null
 		formData.leaveTotal = "0.5 วัน "
 	} else {
 		formData.leaveTotal = null
@@ -138,13 +138,13 @@ const isReadOnly = computed(() => {
 			<div class="row q-pa-sm q-col-gutter-sm">
 				<q-input
 					class="col-12 col-sm-12"
-					ref="leaveNoRef"
-					for="leaveNoRef"
+					ref="leaveWroteRef"
+					for="leaveWroteRef"
 					dense
 					hide-bottom-space
 					bg-color="white"
 					outlined
-					v-model="formData.leaveNo"
+					v-model="formData.leaveWrote"
 					label="เขียนที่"
 					:readonly="!edit"
 					:rules="[val => !!val || `${'เขียนที่'}`]"
@@ -156,34 +156,34 @@ const isReadOnly = computed(() => {
 				</div>
 				<q-input
 					class="col-12 col-md-4 col-sm-6"
-					ref="lastYearVacationRef"
-					for="lastYearVacationRef"
+					ref="restDayOldTotalRef"
+					for="restDayOldTotalRef"
 					dense
 					hide-bottom-space
 					bg-color="white"
 					readonly
 					outlined
-					v-model="formData.lastYearVacation"
+					v-model="formData.restDayOldTotal"
 					label="จำนวนวันลาพักผ่อนสะสม จากปีที่ผ่านมา"
 				/>
 
 				<q-input
 					class="col-12 col-md-4 col-sm-6"
-					ref="currentVacationRef"
-					for="currentVacationRef"
+					ref="restDayCurrentTotalRef"
+					for="restDayCurrentTotalRef"
 					dense
 					readonly
 					hide-bottom-space
 					bg-color="white"
 					outlined
-					v-model="formData.currentVacation"
+					v-model="formData.restDayCurrentTotal"
 					label="จำนวนวันลาพักผ่อนประจำปีปัจจุบัน"
 				/>
 
 				<datepicker
 					class="col-12 col-md-3 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.startLeaveDate"
+					v-model="formData.leaveStartDate"
 					:locale="'th'"
 					autoApply
 					hide-bottom-space
@@ -202,13 +202,13 @@ const isReadOnly = computed(() => {
 						<q-input
 							outlined
 							dense
-							ref="startLeaveDateRef"
-							for="startLeaveDateRef"
+							ref="leaveStartDateRef"
+							for="leaveStartDateRef"
 							hide-bottom-space
 							bg-color="white"
 							:readonly="!edit"
 							class="full-width datepicker"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@@ -222,7 +222,7 @@ const isReadOnly = computed(() => {
 				<datepicker
 					class="col-12 col-md-3 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					:locale="'th'"
 					autoApply
 					hide-bottom-space
@@ -230,7 +230,7 @@ const isReadOnly = computed(() => {
 					:enableTimePicker="false"
 					week-start="0"
 					:readonly="isReadOnly"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -242,13 +242,13 @@ const isReadOnly = computed(() => {
 						<q-input
 							outlined
 							dense
-							ref="endLeaveDateRef"
-							for="endLeaveDateRef"
+							ref="leaveEndDateRef"
+							for="leaveEndDateRef"
 							hide-bottom-space
 							bg-color="white"
 							class="full-width datepicker"
 							:readonly="isReadOnly"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
@@ -278,9 +278,9 @@ const isReadOnly = computed(() => {
 							outlined
 							hide-bottom-space
 							bg-color="white"
-							ref="leaveContactTelRef"
-							for="leaveContactTelRef"
-							v-model="formData.leaveContactTel"
+							ref="leaveNumberRef"
+							for="leaveNumberRef"
+							v-model="formData.leaveNumber"
 							mask="(###)-###-####"
 							unmasked-value
 							label="หมายเลขโทรศัพท์ที่ติดต่อได้"
@@ -294,9 +294,9 @@ const isReadOnly = computed(() => {
 							outlined
 							hide-bottom-space
 							bg-color="white"
-							ref="leaveContactLocationRef"
-							for="leaveContactLocationRef"
-							v-model="formData.leaveContactLocation"
+							ref="leaveAddressRef"
+							for="leaveAddressRef"
+							v-model="formData.leaveAddress"
 							label="ที่อยู่ที่ติดต่อได้ระหว่างลา"
 							:readonly="!edit"
 							:rules="[val => !!val || `${'กรุณากรอกที่อยู่ที่ติดต่อได้ระหว่างลา'}`]"
@@ -317,7 +317,7 @@ const isReadOnly = computed(() => {
 					:readonly="!edit"
 				/>
 
-				<q-file ref="fileRef" bg-color="white" v-model="formData.file" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
+				<q-file ref="leaveDocumentRef" bg-color="white" v-model="formData.leaveDocument" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
 					<template v-slot:prepend>
 						<q-icon name="attach_file" color="primary" />
 					</template>
@@ -329,7 +329,7 @@ const isReadOnly = computed(() => {
 					</div>
 					<q-card bordered flat class="full-width">
 						<q-list separator>
-							<q-item v-for="(file, index) in formData.file" :key="index" class="q-my-xs">
+							<q-item v-for="(file, index) in formData.leaveDocument" :key="index" class="q-my-xs">
 								<q-item-section>
 									<q-item-label class="full-width ellipsis">
 										{{ file.name }}
diff --git a/src/modules/05_leave/componenst/Forms/06_OrdinationForm.vue b/src/modules/05_leave/componenst/Forms/06_OrdinationForm.vue
index 60fb7c5..b25c2ea 100644
--- a/src/modules/05_leave/componenst/Forms/06_OrdinationForm.vue
+++ b/src/modules/05_leave/componenst/Forms/06_OrdinationForm.vue
@@ -2,7 +2,7 @@
 import { reactive, ref, watch } from "vue"
 import { useCounterMixin } from "@/stores/mixin"
 import { useQuasar } from "quasar"
-import type { FormRef06 } from "@/modules/05_leave/interface/request/AddAbsence"
+import type { OrdinationForm } from "@/modules/05_leave/interface/request/AddAbsence"
 
 const $q = useQuasar()
 const mixin = useCounterMixin()
@@ -24,57 +24,59 @@ const props = defineProps({
 })
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const telRef = ref<object | null>(null)
-const writeatRef = ref<object | null>(null)
+const ordainDayLocationNumberRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
 const birthdayRef = ref<object | null>(null)
 const governmentRef = ref<object | null>(null)
 const totalLeaveRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
-const dateOrdinationRef = ref<object | null>(null)
-const startLeaveDateRef = ref<object | null>(null)
-const addressMeasureRef = ref<object | null>(null)
-const addressBuddhistRef = ref<object | null>(null)
-const measureLocationNameRef = ref<object | null>(null)
-const buddhistLocationNameRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
+const ordainDayOrdinationRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const ordainDayLocationAddressRef = ref<object | null>(null)
+const ordainDayBuddhistLentAddressRef = ref<object | null>(null)
+const ordainDayLocationNameRef = ref<object | null>(null)
+const ordainDayBuddhistLentNameRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	writeat: "",
+	leaveWrote: "",
 	government: new Date(),
 	birthday: new Date(),
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveStartDate: null,
+	leaveEndDate: null,
 	totalLeave: new Date(),
-	dateOrdination: new Date(),
-	measureLocationName: "",
-	tel: null,
-	addressMeasure: "",
-	buddhistLocationName: "",
-	addressBuddhist: "",
+	ordainDayOrdination: new Date(),
+	ordainDayLocationName: "",
+	ordainDayLocationNumber: null,
+	ordainDayLocationAddress: "",
+	ordainDayBuddhistLentName: "",
+	ordainDayBuddhistLentAddress: "",
 	monk: "never",
-	file: null,
+	leaveDocument: null,
 })
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
-const formRef: FormRef06 = {
-	writeat: writeatRef,
+const formRef: OrdinationForm = {
+	leaveWrote: leaveWroteRef,
 	government: governmentRef,
 	birthday: birthdayRef,
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
 	totalLeave: totalLeaveRef,
-	dateOrdination: dateOrdinationRef,
-	measureLocationName: measureLocationNameRef,
-	tel: telRef,
-	addressMeasure: addressMeasureRef,
-	buddhistLocationName: buddhistLocationNameRef,
-	addressBuddhist: addressBuddhistRef,
+	ordainDayOrdination: ordainDayOrdinationRef,
+	ordainDayLocationName: ordainDayLocationNameRef,
+	ordainDayLocationNumber: ordainDayLocationNumberRef,
+	ordainDayLocationAddress: ordainDayLocationAddressRef,
+	ordainDayBuddhistLentName: ordainDayBuddhistLentNameRef,
+	ordainDayBuddhistLentAddress: ordainDayBuddhistLentAddressRef,
+	leaveDocument: leaveDocumentRef,
 }
 
-// Watch for changes in endLeaveDate and update leaveTotal accordingly
-watch(formData.endLeaveDate, async () => {
-	if (formData.startLeaveDate !== undefined && formData.endLeaveDate !== undefined) {
-		const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+// Watch for changes in leaveEndDate and update leaveTotal accordingly
+watch(formData.leaveEndDate, async () => {
+	if (formData.leaveStartDate !== undefined && formData.leaveEndDate !== undefined) {
+		const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 		formData.leaveTotal = newLeaveTotal
 		console.log(newLeaveTotal)
 	}
@@ -86,7 +88,7 @@ watch(formData.endLeaveDate, async () => {
  * function อัพเดทค่า LeaveTotal
  */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+	const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
@@ -104,23 +106,9 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		onSubmit()
+		props.onSubmit(formData)
 	}
 }
-
-/** ฟังก์ชั่น บันทึก */
-function onSubmit() {
-	dialogConfirm(
-		$q,
-		async () => {
-			console.log(formData)
-			props.onSubmit()
-		},
-		"ยืนยันการยื่นใบลา",
-		"ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
-	)
-	console.log("tese")
-}
 </script>
 
 <!-- ฟอร์ม ลาอุปสมบท -->
@@ -133,18 +121,18 @@ function onSubmit() {
 		<q-card bordered class="q-pa-md bg-grey-1">
 			<div class="row q-pa-sm q-col-gutter-sm">
 				<q-input
-					ref="writeatRef"
+					ref="leaveWroteRef"
 					class="col-12 col-sm-12"
 					dense
 					outlined
 					bg-color="white"
 					hide-bottom-space
-					v-model="formData.writeat"
+					v-model="formData.leaveWrote"
 					label="เขียนที่"
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>
 
-				<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.startLeaveDate" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
+				<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.leaveStartDate" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
 					<template #year="{ year }">
 						{{ year + 543 }}
 					</template>
@@ -156,10 +144,10 @@ function onSubmit() {
 							outlined
 							bg-color="white"
 							dense
-							ref="startLeaveDateRef"
+							ref="leaveStartDateRef"
 							hide-bottom-space
 							class="full-width datepicker"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@@ -173,14 +161,14 @@ function onSubmit() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					:locale="'th'"
 					autoApply
 					borderless
 					@update:model-value="updateLeaveTotal"
-					:readonly="!formData.startLeaveDate"
+					:readonly="!formData.leaveStartDate"
 					:enableTimePicker="false"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 					week-start="0"
 				>
 					<template #year="{ year }">
@@ -193,13 +181,13 @@ function onSubmit() {
 						<q-input
 							outlined
 							dense
-							ref="endLeaveDateRef"
+							ref="leaveEndDateRef"
 							bg-color="white"
 							hide-bottom-space
 							class="full-width datepicker"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
-							:readonly="!formData.startLeaveDate"
+							:readonly="!formData.leaveStartDate"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
 							<template v-slot:prepend>
@@ -308,7 +296,7 @@ function onSubmit() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.dateOrdination"
+					v-model="formData.ordainDayOrdination"
 					:locale="'th'"
 					autoApply
 					full-width
@@ -326,12 +314,12 @@ function onSubmit() {
 					<template #trigger>
 						<q-input
 							outlined
-							ref="dateOrdinationRef"
+							ref="ordainDayOrdinationRef"
 							dense
 							bg-color="white"
 							hide-bottom-space
 							class="full-width datepicker"
-							:model-value="formData.dateOrdination != null ? date2Thai(formData.dateOrdination) : null"
+							:model-value="formData.ordainDayOrdination != null ? date2Thai(formData.ordainDayOrdination) : null"
 							:label="`${'วันอุปสมบท'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกวันอุปสมบท'}`]"
 						>
@@ -346,22 +334,22 @@ function onSubmit() {
 					class="col-12 col-sm-6 col-md-4"
 					dense
 					hide-bottom-space
-					ref="measureLocationNameRef"
+					ref="ordainDayLocationNameRef"
 					bg-color="white"
 					outlined
 					full-width
-					v-model="formData.measureLocationName"
+					v-model="formData.ordainDayLocationName"
 					label="ชื่อวัด"
 					:rules="[val => !!val || `${'กรุณากรอกชื่อวัด'}`]"
 				/>
 
 				<q-input
 					class="col-12 col-sm-6 col-md-4"
-					ref="telRef"
+					ref="ordainDayLocationNumberRef"
 					dense
 					full-width
 					outlined
-					v-model="formData.tel"
+					v-model="formData.ordainDayLocationNumber"
 					bg-color="white"
 					mask="(###)-###-####"
 					unmasked-value
@@ -372,11 +360,11 @@ function onSubmit() {
 				<q-input
 					class="col-12 col-md-12 col-sm-12"
 					dense
-					ref="addressMeasureRef"
+					ref="ordainDayLocationAddressRef"
 					bg-color="white"
 					outlined
 					hide-bottom-space
-					v-model="formData.addressMeasure"
+					v-model="formData.ordainDayLocationAddress"
 					label="ที่อยู่"
 					:rules="[val => !!val || `${'กรุณากรอกที่อยู่'}`]"
 					type="textarea"
@@ -386,11 +374,11 @@ function onSubmit() {
 				<q-input
 					class="col-12 col-sm-6 col-md-4"
 					dense
-					ref="buddhistLocationNameRef"
+					ref="ordainDayBuddhistLentNameRef"
 					bg-color="white"
 					hide-bottom-space
 					outlined
-					v-model="formData.buddhistLocationName"
+					v-model="formData.ordainDayBuddhistLentName"
 					label="ชื่อวัด"
 					:rules="[val => !!val || `${'กรุณากรอกชื่อวัด'}`]"
 				/>
@@ -398,10 +386,10 @@ function onSubmit() {
 				<q-input
 					class="col-12"
 					dense
-					ref="addressBuddhistRef"
+					ref="ordainDayBuddhistLentAddressRef"
 					bg-color="white"
 					outlined
-					v-model="formData.addressBuddhist"
+					v-model="formData.ordainDayBuddhistLentAddress"
 					label="ที่อยู่"
 					:rules="[val => !!val || `${'กรุณากรอกที่อยู่'}`]"
 					type="textarea"
@@ -421,7 +409,7 @@ function onSubmit() {
 				/>
 
 				<div class="col-12 col-sm-6">
-					<q-file ref="fileRef" v-model="formData.file" dense label="เอกสารประกอบ" outlined bg-color="white" multiple>
+					<q-file ref="leaveDocumentRef" v-model="formData.leaveDocument" dense label="เอกสารประกอบ" outlined bg-color="white" multiple>
 						<template v-slot:prepend>
 							<q-icon name="attach_file" color="primary" />
 						</template>
diff --git a/src/modules/05_leave/componenst/Forms/07_HajjForm.vue b/src/modules/05_leave/componenst/Forms/07_HajjForm.vue
index b1c3515..4f0336e 100644
--- a/src/modules/05_leave/componenst/Forms/07_HajjForm.vue
+++ b/src/modules/05_leave/componenst/Forms/07_HajjForm.vue
@@ -2,7 +2,7 @@
 import { reactive, ref } from "vue"
 import { useCounterMixin } from "@/stores/mixin"
 import { useQuasar } from "quasar"
-import type { FormRef07 } from "@/modules/05_leave/interface/request/AddAbsence"
+import type { HajiForm } from "@/modules/05_leave/interface/request/AddAbsence"
 
 const $q = useQuasar()
 const mixin = useCounterMixin()
@@ -12,11 +12,11 @@ const edit = ref<boolean>(true)
 const files = ref<any>(null)
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const writeatRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
 const governmentRef = ref<object | null>(null)
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
-
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
 	data: {
@@ -31,21 +31,22 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	writeat: "",
+	leaveWrote: "",
 	government: new Date(),
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveStartDate: null,
+	leaveEndDate: null,
 	totalLeave: new Date(),
-	monk: "never",
-	file: null,
+	hajjDayStatus: "never",
+	leaveDocument: null,
 })
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
-const formRef: FormRef07 = {
-	writeat: writeatRef,
+const formRef: HajiForm = {
+	leaveWrote: leaveWroteRef,
 	government: governmentRef,
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
+	leaveDocument: leaveDocumentRef,
 }
 
 /** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
@@ -61,30 +62,17 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		onSubmit()
+		props.onSubmit(formData)
 	}
 }
 /**
  * function อัพเดทค่า LeaveTotal
  */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+	const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
-
-/** ฟังก์ชั่น บันทึก */
-function onSubmit() {
-	dialogConfirm(
-		$q,
-		async () => {
-			console.log(formData)
-			props.onSubmit()
-		},
-		"ยืนยันการยื่นใบลา",
-		"ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
-	)
-}
 </script>
 
 <template>
@@ -96,8 +84,8 @@ function onSubmit() {
 		<q-card bordered class="q-pa-md bg-grey-1">
 			<div class="row q-pa-sm q-col-gutter-sm">
 				<q-input
-					v-model="formData.writeat"
-					ref="writeatRef"
+					v-model="formData.leaveWrote"
+					ref="leaveWroteRef"
 					class="col-12 col-sm-12"
 					bg-color="white"
 					dense
@@ -110,7 +98,7 @@ function onSubmit() {
 				<div class="full-width">
 					<div class="q-col-gutter-sm row">
 						<datepicker
-							v-model="formData.startLeaveDate"
+							v-model="formData.leaveStartDate"
 							class="col-12 col-md-4 col-sm-6"
 							menu-class-name="modalfix"
 							autoApply
@@ -127,7 +115,7 @@ function onSubmit() {
 							</template>
 							<template #trigger>
 								<q-input
-									ref="startLeaveDateRef"
+									ref="leaveStartDateRef"
 									bg-color="white"
 									class="full-width datepicker"
 									outlined
@@ -135,7 +123,7 @@ function onSubmit() {
 									hide-bottom-space
 									:label="`${'ลาตั้งแต่วันที่'}`"
 									:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
-									:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+									:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 								>
 									<template v-slot:prepend>
 										<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
@@ -145,7 +133,7 @@ function onSubmit() {
 						</datepicker>
 
 						<datepicker
-							v-model="formData.endLeaveDate"
+							v-model="formData.leaveEndDate"
 							class="col-12 col-md-4 col-sm-6"
 							menu-class-name="modalfix"
 							autoApply
@@ -154,8 +142,8 @@ function onSubmit() {
 							:enableTimePicker="false"
 							:locale="'th'"
 							@update:model-value="updateLeaveTotal"
-							:readonly="!formData.startLeaveDate"
-							:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+							:readonly="!formData.leaveStartDate"
+							:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 						>
 							<template #year="{ year }">
 								{{ year + 543 }}
@@ -165,15 +153,15 @@ function onSubmit() {
 							</template>
 							<template #trigger>
 								<q-input
-									ref="endLeaveDateRef"
+									ref="leaveEndDateRef"
 									class="full-width datepicker"
 									bg-color="white"
 									outlined
 									dense
-									:readonly="!formData.startLeaveDate"
+									:readonly="!formData.leaveStartDate"
 									hide-bottom-space
 									:label="`${'ลาถึงวันที่'}`"
-									:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+									:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 									:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 								>
 									<template v-slot:prepend>
@@ -236,14 +224,14 @@ function onSubmit() {
 
 				<div class="q-pl-sm text-weight-bold text-dark col-12">เคยไปประกอบพิธีฮัจย์ฯหรือไม่</div>
 				<div class="col-12">
-					<q-radio v-model="formData.monk" val="ever" checked-icon="task_alt" label="เคย" />
-					<q-radio v-model="formData.monk" val="never" checked-icon="task_alt" label="ไม่เคยไปประกอบพิธีฮัจย์ฯ" />
+					<q-radio v-model="formData.hajjDayStatus" val="ever" checked-icon="task_alt" label="เคย" />
+					<q-radio v-model="formData.hajjDayStatus" val="never" checked-icon="task_alt" label="ไม่เคยไปประกอบพิธีฮัจย์ฯ" />
 				</div>
 
-				<q-input v-model="formData.info" class="col-12 q-mt-sm" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
+				<q-input v-model="formData.leaveDetail" class="col-12 q-mt-sm" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
 
 				<div class="col-12 col-sm-6">
-					<q-file v-model="formData.file" bg-color="white" label="เอกสารประกอบ" dense outlined multiple hide-bottom-space>
+					<q-file v-model="formData.leaveDocument" bg-color="white" label="เอกสารประกอบ" dense outlined multiple hide-bottom-space>
 						<template v-slot:prepend>
 							<q-icon name="attach_file" color="primary" />
 						</template>
diff --git a/src/modules/05_leave/componenst/Forms/08_MilitaryForm.vue b/src/modules/05_leave/componenst/Forms/08_MilitaryForm.vue
index 5260628..c84261c 100644
--- a/src/modules/05_leave/componenst/Forms/08_MilitaryForm.vue
+++ b/src/modules/05_leave/componenst/Forms/08_MilitaryForm.vue
@@ -2,7 +2,7 @@
 import { reactive, ref } from "vue"
 import { useCounterMixin } from "@/stores/mixin"
 import { useQuasar } from "quasar"
-import type { FormRef08 } from "@/modules/05_leave/interface/request/AddAbsence"
+import type { MilitaryForm } from "@/modules/05_leave/interface/request/AddAbsence"
 
 const $q = useQuasar()
 const mixin = useCounterMixin()
@@ -12,14 +12,15 @@ const edit = ref<boolean>(true)
 const files = ref<any>(null)
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
-const writeatRef = ref<object | null>(null)
-const receivedRef = ref<object | null>(null)
-const atRef = ref<object | null>(null)
-const dateAtRef = ref<object | null>(null)
-const admittedRef = ref<object | null>(null)
-const atPlaceRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
+const absentDaySummonRef = ref<object | null>(null)
+const absentDayLocationRef = ref<object | null>(null)
+const absentDayRegistorDateRef = ref<object | null>(null)
+const absentDayGetInRef = ref<object | null>(null)
+const absentDayAtRef = ref<object | null>(null)
+const leaveDetailRef = ref<object | null>(null)
 
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
@@ -35,29 +36,30 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveStartDate: null,
+	leaveEndDate: null,
 	totalLeave: 1,
-	file: null,
-	writeat: "",
-	received: "",
-	at: "",
-	dateAt: "",
-	admitted: "",
-	atPlace: "",
-	info: "",
+	leaveDocument: null,
+	leaveWrote: "",
+	absentDaySummon: "",
+	absentDayLocation: "",
+	absentDayRegistorDate: "",
+	absentDayGetIn: "",
+	absentDayAt: "",
+	leaveDetail: "",
 })
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
-const formRef: FormRef08 = {
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
-	writeat: writeatRef,
-	received: receivedRef,
-	at: atRef,
-	dateAt: dateAtRef,
-	admitted: admittedRef,
-	atPlace: atPlaceRef,
+const formRef: MilitaryForm = {
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
+	leaveWrote: leaveWroteRef,
+	absentDaySummon: absentDaySummonRef,
+	absentDayLocation: absentDayLocationRef,
+	absentDayRegistorDate: absentDayRegistorDateRef,
+	absentDayGetIn: absentDayGetInRef,
+	absentDayAt: absentDayAtRef,
+	leaveDetail: leaveDetailRef,
 }
 
 /** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
@@ -73,7 +75,7 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
@@ -81,23 +83,10 @@ function onValidate() {
  * function อัพเดทค่า LeaveTotal
  */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+	const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
-
-/** ฟังก์ชั่น บันทึก */
-function onSubmit() {
-	dialogConfirm(
-		$q,
-		async () => {
-			console.log(formData)
-			props.onSubmit()
-		},
-		"ยืนยันการยื่นใบลา",
-		"ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
-	)
-}
 </script>
 
 <template>
@@ -109,18 +98,18 @@ function onSubmit() {
 		<q-card bordered class="q-pa-md bg-grey-1">
 			<div class="row q-pa-sm q-col-gutter-sm">
 				<q-input
-					ref="writeatRef"
+					ref="leaveWroteRef"
 					class="col-12 col-sm-12"
 					dense
 					outlined
 					bg-color="white"
 					hide-bottom-space
-					v-model="formData.writeat"
+					v-model="formData.leaveWrote"
 					label="เขียนที่"
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>
 
-				<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.startLeaveDate" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
+				<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.leaveStartDate" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
 					<template #year="{ year }">
 						{{ year + 543 }}
 					</template>
@@ -132,10 +121,10 @@ function onSubmit() {
 							outlined
 							bg-color="white"
 							dense
-							ref="startLeaveDateRef"
+							ref="leaveStartDateRef"
 							hide-bottom-space
 							class="full-width datepicker"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@@ -149,15 +138,15 @@ function onSubmit() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					:locale="'th'"
 					autoApply
 					borderless
 					:enableTimePicker="false"
 					week-start="0"
 					@update:model-value="updateLeaveTotal"
-					:readonly="!formData.startLeaveDate"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:readonly="!formData.leaveStartDate"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -169,12 +158,12 @@ function onSubmit() {
 						<q-input
 							outlined
 							dense
-							ref="endLeaveDateRef"
+							ref="leaveEndDateRef"
 							bg-color="white"
 							hide-bottom-space
-							:readonly="!formData.startLeaveDate"
+							:readonly="!formData.leaveStartDate"
 							class="full-width datepicker"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
@@ -200,12 +189,12 @@ function onSubmit() {
 				<div class="full-width">
 					<div class="q-col-gutter-sm row">
 						<q-input
-							ref="receivedRef"
+							ref="absentDaySummonRef"
 							class="col-12 col-sm-6 col-md-4"
 							dense
 							bg-color="white"
 							outlined
-							v-model="formData.received"
+							v-model="formData.absentDaySummon"
 							label="ได้รับหมายเรียกของ"
 							hide-bottom-space
 							:rules="[val => !!val || `${'กรุณากรอกได้รับหมายเรียกของ'}`]"
@@ -217,7 +206,7 @@ function onSubmit() {
 							dense
 							bg-color="white"
 							outlined
-							v-model="formData.at"
+							v-model="formData.absentDayLocation"
 							label="ที่"
 							hide-bottom-space
 							:rules="[val => !!val || `${'กรุณากรอกที่'}`]"
@@ -227,7 +216,16 @@ function onSubmit() {
 
 				<div class="full-width">
 					<div class="q-col-gutter-sm row">
-						<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateAt" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
+						<datepicker
+							class="col-12 col-md-4 col-sm-6"
+							menu-class-name="modalfix"
+							v-model="formData.absentDayRegistorDate"
+							:locale="'th'"
+							autoApply
+							borderless
+							:enableTimePicker="false"
+							week-start="0"
+						>
 							<template #year="{ year }">
 								{{ year + 543 }}
 							</template>
@@ -238,11 +236,11 @@ function onSubmit() {
 								<q-input
 									outlined
 									dense
-									ref="dateAtRef"
+									ref="absentDayRegistorDateRef"
 									bg-color="white"
 									hide-bottom-space
 									class="full-width datepicker"
-									:model-value="formData.dateAt != null ? date2Thai(formData.dateAt) : null"
+									:model-value="formData.absentDayRegistorDate != null ? date2Thai(formData.absentDayRegistorDate) : null"
 									:label="`${'ลงวันที่'}`"
 									:rules="[val => !!val || `${'กรุณาเลือกลงวันที่'}`]"
 								>
@@ -257,9 +255,9 @@ function onSubmit() {
 							class="col-12 col-sm-6 col-md-4"
 							dense
 							bg-color="white"
-							ref="admittedRef"
+							ref="absentDayGetInRef"
 							outlined
-							v-model="formData.admitted"
+							v-model="formData.absentDayGetIn"
 							label="ให้เข้ารับการ"
 							hide-bottom-space
 							:rules="[val => !!val || `${'กรุณากรอกให้เข้ารับการ'}`]"
@@ -270,8 +268,8 @@ function onSubmit() {
 							dense
 							bg-color="white"
 							outlined
-							ref="atPlaceRef"
-							v-model="formData.atPlace"
+							ref="absentDayAtRef"
+							v-model="formData.absentDayAt"
 							label="ณ ที่"
 							hide-bottom-space
 							:rules="[val => !!val || `${'กรุณากรอก ณ ที่'}`]"
@@ -279,10 +277,10 @@ function onSubmit() {
 					</div>
 				</div>
 
-				<q-input class="col-12 col-md-12 col-sm-12" dense bg-color="white" outlined v-model="formData.info" type="textarea" label="รายละเอียด" />
+				<q-input class="col-12 col-md-12 col-sm-12" dense bg-color="white" outlined v-model="formData.leaveDetail" type="textarea" label="รายละเอียด" />
 
 				<div class="col-12 col-sm-6">
-					<q-file v-model="formData.file" dense label="เอกสารประกอบ" outlined bg-color="white" multiple hide-bottom-space>
+					<q-file v-model="formData.leaveDocument" dense label="เอกสารประกอบ" outlined bg-color="white" multiple hide-bottom-space>
 						<template v-slot:prepend>
 							<q-icon name="attach_file" color="primary" />
 						</template>
diff --git a/src/modules/05_leave/componenst/Forms/09_StudyForm.vue b/src/modules/05_leave/componenst/Forms/09_StudyForm.vue
index 9a4f48f..d74e0f6 100644
--- a/src/modules/05_leave/componenst/Forms/09_StudyForm.vue
+++ b/src/modules/05_leave/componenst/Forms/09_StudyForm.vue
@@ -2,7 +2,7 @@
 import { reactive, ref, computed } from "vue"
 import { useCounterMixin } from "@/stores/mixin"
 import { useQuasar } from "quasar"
-import type { FormRef09 } from "@/modules/05_leave/interface/request/AddAbsence"
+import type { studyDaySubjectForm } from "@/modules/05_leave/interface/request/AddAbsence"
 
 const $q = useQuasar()
 const mixin = useCounterMixin()
@@ -12,19 +12,19 @@ const edit = ref<boolean>(true)
 const files = ref<any>(null)
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
 const birthdayRef = ref<object | null>(null)
 const dateGovernmentRef = ref<object | null>(null)
-const salaryRef = ref<object | null>(null)
-const telRef = ref<object | null>(null)
-const addressLeaveRef = ref<object | null>(null)
-const capitalRef = ref<object | null>(null)
-const countryRef = ref<object | null>(null)
-const nameEducationRef = ref<object | null>(null)
-const degreeRef = ref<object | null>(null)
-const studyRef = ref<object | null>(null)
-const writeatRef = ref<object | null>(null)
+const leaveSalaryRef = ref<object | null>(null)
+const leaveNumberRef = ref<object | null>(null)
+const leaveAddressRef = ref<object | null>(null)
+const studyDayScholarshipRef = ref<object | null>(null)
+const studyDayCountryRef = ref<object | null>(null)
+const studyDayUniversityNameRef = ref<object | null>(null)
+const studyDayDegreeLevelRef = ref<object | null>(null)
+const studyDaySubjectRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
 
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
@@ -40,39 +40,39 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	writeat: "",
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveWrote: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
 	birthday: new Date(),
 	dateGovernment: new Date(),
-	salary: 10000,
-	salaryText: arabicNumberToText(10000),
-	tel: "",
-	addressLeave: "test",
-	capital: "",
-	country: "",
-	nameEducation: "",
-	degree: "",
-	study: "",
-	file: "",
-	info: "",
+	leaveSalary: 10000,
+	leaveSalaryText: arabicNumberToText(10000),
+	leaveNumber: "",
+	leaveAddress: "test",
+	studyDayScholarship: "",
+	studyDayCountry: "",
+	studyDayUniversityName: "",
+	studyDayDegreeLevel: "",
+	studyDaySubject: "",
+	leaveDocument: "",
+	leaveDetail: "",
 })
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
-const formRef: FormRef09 = {
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
+const formRef: studyDaySubjectForm = {
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
 	birthday: birthdayRef,
 	dateGovernment: dateGovernmentRef,
-	salary: salaryRef,
-	tel: telRef,
-	addressLeave: addressLeaveRef,
-	capital: capitalRef,
-	country: countryRef,
-	nameEducation: nameEducationRef,
-	degree: degreeRef,
-	study: studyRef,
-	writeat: writeatRef,
+	leaveSalary: leaveSalaryRef,
+	leaveNumber: leaveNumberRef,
+	leaveAddress: leaveAddressRef,
+	studyDayScholarship: studyDayScholarshipRef,
+	studyDayCountry: studyDayCountryRef,
+	studyDayUniversityName: studyDayUniversityNameRef,
+	studyDayDegreeLevel: studyDayDegreeLevelRef,
+	studyDaySubject: studyDaySubjectRef,
+	leaveWrote: leaveWroteRef,
 }
 
 /** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
@@ -88,7 +88,7 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
@@ -96,29 +96,16 @@ function onValidate() {
  * function อัพเดทค่า LeaveTotal
  */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+	const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
 
-/** ฟังก์ชั่น บันทึก */
-function onSubmit() {
-	dialogConfirm(
-		$q,
-		async () => {
-			console.log(formData)
-			props.onSubmit()
-		},
-		"ยืนยันการยื่นใบลา",
-		"ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
-	)
-}
-
 /**
  * แปลงตัวเลขเงินเดือน
  */
-const formattedSalary = computed(() => {
-	return formData.salary !== null ? formData.salary.toLocaleString("th-TH") : ""
+const formattedleaveSalary = computed(() => {
+	return formData.leaveSalary !== null ? formData.leaveSalary.toLocaleString("th-TH") : ""
 })
 </script>
 
@@ -131,8 +118,8 @@ const formattedSalary = computed(() => {
 		<q-card bordered class="q-pa-md bg-grey-1">
 			<div class="row q-pa-sm q-col-gutter-sm">
 				<q-input
-					v-model="formData.writeat"
-					ref="writeatRef"
+					v-model="formData.leaveWrote"
+					ref="leaveWroteRef"
 					class="col-12 col-sm-12"
 					bg-color="white"
 					dense
@@ -142,7 +129,7 @@ const formattedSalary = computed(() => {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>
 
-				<datepicker v-model="formData.startLeaveDate" class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" autoApply borderless week-start="0" :enableTimePicker="false" :locale="'th'">
+				<datepicker v-model="formData.leaveStartDate" class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" autoApply borderless week-start="0" :enableTimePicker="false" :locale="'th'">
 					<template #year="{ year }">
 						{{ year + 543 }}
 					</template>
@@ -151,7 +138,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="startLeaveDateRef"
+							ref="leaveStartDateRef"
 							class="full-width datepicker"
 							bg-color="white"
 							outlined
@@ -159,7 +146,7 @@ const formattedSalary = computed(() => {
 							lazy-rules
 							hide-bottom-space
 							:label="`${'ลาตั้งแต่วันที่'}`"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
 							<template v-slot:prepend>
@@ -170,7 +157,7 @@ const formattedSalary = computed(() => {
 				</datepicker>
 
 				<datepicker
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
 					autoApply
@@ -178,9 +165,9 @@ const formattedSalary = computed(() => {
 					week-start="0"
 					:locale="'th'"
 					@update:model-value="updateLeaveTotal"
-					:readonly="!formData.startLeaveDate"
+					:readonly="!formData.leaveStartDate"
 					:enableTimePicker="false"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -190,7 +177,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="endLeaveDateRef"
+							ref="leaveEndDateRef"
 							class="full-width datepicker"
 							outlined
 							dense
@@ -198,8 +185,8 @@ const formattedSalary = computed(() => {
 							bg-color="white"
 							hide-bottom-space
 							:label="`${'ลาถึงวันที่'}`"
-							:readonly="!formData.startLeaveDate"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:readonly="!formData.leaveStartDate"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
 							<template v-slot:prepend>
@@ -298,11 +285,11 @@ const formattedSalary = computed(() => {
 							</template>
 						</datepicker>
 
-						<q-input v-model="formattedSalary" ref="salaryRef" class="col-12 col-sm-6 col-md-3" bg-color="white" dense outlined readonly label="เงินเดือนปัจจุบัน" />
+						<q-input v-model="formattedleaveSalary" ref="leaveSalaryRef" class="col-12 col-sm-6 col-md-3" bg-color="white" dense outlined readonly label="เงินเดือนปัจจุบัน" />
 
 						<q-input
-							v-model="formData.salaryText"
-							ref="salaryRef"
+							v-model="formData.leaveSalaryText"
+							ref="leaveSalaryRef"
 							class="col-12 col-sm-6 col-md-3"
 							bg-color="white"
 							dense
@@ -318,8 +305,8 @@ const formattedSalary = computed(() => {
 				<div class="full-width">
 					<div class="q-col-gutter-sm row">
 						<q-input
-							v-model="formData.nameEducation"
-							ref="nameEducationRef"
+							v-model="formData.studyDayUniversityName"
+							ref="studyDayUniversityNameRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -330,8 +317,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.degree"
-							ref="degreeRef"
+							v-model="formData.studyDayDegreeLevel"
+							ref="studyDayDegreeLevelRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -342,8 +329,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.study"
-							ref="studyRef"
+							v-model="formData.studyDaySubject"
+							ref="studyDaySubjectRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -354,8 +341,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.country"
-							ref="countryRef"
+							v-model="formData.studyDayCountry"
+							ref="studyDayCountryRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -366,8 +353,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.capital"
-							ref="capitalRef"
+							v-model="formData.studyDayScholarship"
+							ref="studyDayScholarshipRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -378,8 +365,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.tel"
-							ref="telRef"
+							v-model="formData.leaveNumber"
+							ref="leaveNumberRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -392,8 +379,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.addressLeave"
-							ref="addressLeaveRef"
+							v-model="formData.leaveAddress"
+							ref="leaveAddressRef"
 							class="col-12"
 							bg-color="white"
 							dense
@@ -405,10 +392,10 @@ const formattedSalary = computed(() => {
 					</div>
 				</div>
 
-				<q-input v-model="formData.info" class="col-12 col-md-12 col-sm-12" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
+				<q-input v-model="formData.leaveDetail" class="col-12 col-md-12 col-sm-12" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
 
 				<div class="col-12 col-sm-6">
-					<q-file v-model="formData.file" bg-color="white" dense outlined multiple label="เอกสารประกอบ">
+					<q-file v-model="formData.leaveDocument" bg-color="white" dense outlined multiple label="เอกสารประกอบ">
 						<template v-slot:prepend>
 							<q-icon name="attach_file" color="primary" />
 						</template>
diff --git a/src/modules/05_leave/componenst/Forms/10_TrainForm.vue b/src/modules/05_leave/componenst/Forms/10_TrainForm.vue
index e64526c..cd1cab9 100644
--- a/src/modules/05_leave/componenst/Forms/10_TrainForm.vue
+++ b/src/modules/05_leave/componenst/Forms/10_TrainForm.vue
@@ -1,7 +1,7 @@
 <script setup lang="ts">
 import { reactive, ref, computed } from "vue"
 import { useCounterMixin } from "@/stores/mixin"
-import type { FormRef10 } from "@/modules/05_leave/interface/request/AddAbsence"
+import type { TrainForm } from "@/modules/05_leave/interface/request/AddAbsence"
 import { useQuasar } from "quasar"
 
 const $q = useQuasar()
@@ -24,49 +24,49 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	writeat: "",
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveWrote: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
 	birthday: new Date(),
 	dateGovernment: new Date(),
-	salary: 10000,
+	leaveSalary: 10000,
 	salaryText: arabicNumberToText(10000),
-	tel: "",
-	addressLeave: "test",
-	capital: "",
-	country: "",
-	course: "",
-	location: "",
-	file: "",
-	info: "",
+	leaveNumber: "",
+	leaveAddress: "test",
+	studyDayScholarship: "",
+	studyDayCountry: "",
+	studyDayTrainingSubject: "",
+	studyDayTrainingName: "",
+	leaveDocument: "",
+	leaveDetail: "",
 })
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
 const birthdayRef = ref<object | null>(null)
 const dateGovernmentRef = ref<object | null>(null)
-const telRef = ref<object | null>(null)
-const addressLeaveRef = ref<object | null>(null)
-const capitalRef = ref<object | null>(null)
-const countryRef = ref<object | null>(null)
-const courseRef = ref<object | null>(null)
-const locationRef = ref<object | null>(null)
-const writeatRef = ref<object | null>(null)
+const leaveNumberRef = ref<object | null>(null)
+const leaveAddressRef = ref<object | null>(null)
+const studyDayScholarshipRef = ref<object | null>(null)
+const studyDayCountryRef = ref<object | null>(null)
+const studyDayTrainingSubjectRef = ref<object | null>(null)
+const studyDayTrainingNameRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
-const formRef: FormRef10 = {
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
+const formRef: TrainForm = {
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
 	birthday: birthdayRef,
 	dateGovernment: dateGovernmentRef,
-	tel: telRef,
-	addressLeave: addressLeaveRef,
-	capital: capitalRef,
-	country: countryRef,
-	course: courseRef,
-	location: locationRef,
-	writeat: writeatRef,
+	leaveNumber: leaveNumberRef,
+	leaveAddress: leaveAddressRef,
+	studyDayScholarship: studyDayScholarshipRef,
+	studyDayCountry: studyDayCountryRef,
+	studyDayTrainingSubject: studyDayTrainingSubjectRef,
+	studyDayTrainingName: studyDayTrainingNameRef,
+	leaveWrote: leaveWroteRef,
 }
 
 /** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
@@ -83,7 +83,7 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
@@ -91,28 +91,16 @@ function onValidate() {
  * function อัพเดทค่า LeaveTotal
  */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+	const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
 
-/** ฟังก์ชั่น บันทึก */
-function onSubmit() {
-	dialogConfirm(
-		$q,
-		async () => {
-			console.log(formData)
-			props.onSubmit()
-		},
-		"ยืนยันการยื่นใบลา",
-		"ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
-	)
-}
 /**
  * แปลงตัวเลขเงินเดือน
  */
 const formattedSalary = computed(() => {
-	return formData.salary !== null ? formData.salary.toLocaleString("th-TH") : ""
+	return formData.leaveSalary !== null ? formData.leaveSalary.toLocaleString("th-TH") : ""
 })
 </script>
 
@@ -125,8 +113,8 @@ const formattedSalary = computed(() => {
 		<q-card bordered class="q-pa-md bg-grey-1">
 			<div class="row q-pa-sm q-col-gutter-sm">
 				<q-input
-					v-model="formData.writeat"
-					ref="writeatRef"
+					v-model="formData.leaveWrote"
+					ref="leaveWroteRef"
 					class="col-12 col-sm-12"
 					bg-color="white"
 					dense
@@ -136,7 +124,7 @@ const formattedSalary = computed(() => {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>
 
-				<datepicker v-model="formData.startLeaveDate" class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" autoApply borderless week-start="0" :enableTimePicker="false" :locale="'th'">
+				<datepicker v-model="formData.leaveStartDate" class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" autoApply borderless week-start="0" :enableTimePicker="false" :locale="'th'">
 					<template #year="{ year }">
 						{{ year + 543 }}
 					</template>
@@ -145,7 +133,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="startLeaveDateRef"
+							ref="leaveStartDateRef"
 							class="full-width datepicker"
 							bg-color="white"
 							outlined
@@ -153,7 +141,7 @@ const formattedSalary = computed(() => {
 							lazy-rules
 							hide-bottom-space
 							:label="`${'ลาตั้งแต่วันที่'}`"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
 							<template v-slot:prepend>
@@ -164,17 +152,17 @@ const formattedSalary = computed(() => {
 				</datepicker>
 
 				<datepicker
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
 					autoApply
 					borderless
 					@update:model-value="updateLeaveTotal"
 					week-start="0"
-					:readonly="!formData.startLeaveDate"
+					:readonly="!formData.leaveStartDate"
 					:locale="'th'"
 					:enableTimePicker="false"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -184,7 +172,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="endLeaveDateRef"
+							ref="leaveEndDateRef"
 							class="full-width datepicker"
 							outlined
 							dense
@@ -192,8 +180,8 @@ const formattedSalary = computed(() => {
 							bg-color="white"
 							hide-bottom-space
 							:label="`${'ลาถึงวันที่'}`"
-							:readonly="!formData.startLeaveDate"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:readonly="!formData.leaveStartDate"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
 							<template v-slot:prepend>
@@ -301,9 +289,9 @@ const formattedSalary = computed(() => {
 				<div class="full-width">
 					<div class="q-col-gutter-sm row">
 						<q-input
-							v-model="formData.course"
+							v-model="formData.studyDayTrainingSubject"
 							class="col-12 col-sm-6 col-md-4"
-							ref="courseRef"
+							ref="studyDayTrainingSubjectRef"
 							bg-color="white"
 							dense
 							outlined
@@ -313,8 +301,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.location"
-							ref="locationRef"
+							v-model="formData.studyDayTrainingName"
+							ref="studyDayTrainingNameRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -325,8 +313,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.country"
-							ref="countryRef"
+							v-model="formData.studyDayCountry"
+							ref="studyDayCountryRef"
 							class="col-12 col-sm-6 col-md-4"
 							dense
 							bg-color="white"
@@ -337,8 +325,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.capital"
-							ref="capitalRef"
+							v-model="formData.studyDayScholarship"
+							ref="studyDayScholarshipRef"
 							class="col-12 col-sm-6 col-md-4"
 							bg-color="white"
 							dense
@@ -349,9 +337,9 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.tel"
+							v-model="formData.leaveNumber"
 							class="col-12 col-sm-6 col-md-4"
-							ref="telRef"
+							ref="leaveNumberRef"
 							dense
 							outlined
 							unmasked-value
@@ -363,8 +351,8 @@ const formattedSalary = computed(() => {
 						/>
 
 						<q-input
-							v-model="formData.addressLeave"
-							ref="addressLeaveRef"
+							v-model="formData.leaveAddress"
+							ref="leaveAddressRef"
 							class="col-12"
 							bg-color="white"
 							dense
@@ -376,10 +364,10 @@ const formattedSalary = computed(() => {
 					</div>
 				</div>
 
-				<q-input v-model="formData.info" class="col-12 col-md-12 col-sm-12" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
+				<q-input v-model="formData.leaveDetail" class="col-12 col-md-12 col-sm-12" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
 
 				<div class="col-12 col-sm-6">
-					<q-file v-model="formData.file" bg-color="white" dense outlined multiple label="เอกสารประกอบ">
+					<q-file v-model="formData.leaveDocument" bg-color="white" dense outlined multiple label="เอกสารประกอบ">
 						<template v-slot:prepend>
 							<q-icon name="attach_file" color="primary" />
 						</template>
diff --git a/src/modules/05_leave/componenst/Forms/11_WorkInternationalForm.vue b/src/modules/05_leave/componenst/Forms/11_WorkInternationalForm.vue
index cce869e..d2626de 100644
--- a/src/modules/05_leave/componenst/Forms/11_WorkInternationalForm.vue
+++ b/src/modules/05_leave/componenst/Forms/11_WorkInternationalForm.vue
@@ -8,7 +8,6 @@ const $q = useQuasar()
 const mixin = useCounterMixin()
 const { date2Thai, dialogConfirm, notifyError } = mixin
 const edit = ref<boolean>(true)
-const filesUpload = ref<any>(null)
 const isSave = ref<boolean>(false)
 
 /** รับ props มาจากหน้าหลัก */
@@ -25,37 +24,39 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<FormData>({
-	leaveNo: "",
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveWrote: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
 	leaveDetail: "",
-	file: [],
+	leaveDocument: [],
+	leaveDraftDocument: [],
 })
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const leaveNoRef = ref<object | null>(null)
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
 const leaveDetailRef = ref<object | null>(null)
-const fileRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const FormRef: FormRef = {
-	leaveNo: leaveNoRef,
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
+	leaveWrote: leaveWroteRef,
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
 	leaveDetail: leaveDetailRef,
-	file: fileRef,
+	leaveDocument: leaveDocumentRef,
 }
 
 /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
 watch(props.data, async () => {
 	// console.log("data==>", props.data)
-	formData.leaveNo = props.data.leaveNo
-	formData.startLeaveDate = props.data.startLeaveDate
-	formData.endLeaveDate = props.data.endLeaveDate
+	formData.leaveWrote = props.data.leaveWrote
+	formData.leaveStartDate = props.data.leaveStartDate
+	formData.leaveEndDate = props.data.leaveEndDate
 	formData.leaveDetail = props.data.leaveDetail
-	formData.file = props.data.file
+	formData.leaveDocument = props.data.leaveDocument
+	formData.leaveDraftDocument = props.data.leaveDraftDocument
 })
 
 /** ส่วนของการประกาศและเลือกไฟล์เอกสารประกอบ */
@@ -79,42 +80,12 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		onSubmit()
+		props.onSubmit(formData)
 	}
 }
-
-/** ฟังก์ชั่น บันทึก */
-function onSubmit() {
-	dialogConfirm($q, async () => {
-		if (filesUpload.value) {
-			console.log(filesUpload.value)
-		} else {
-			notifyError($q, "กรุณาอัปโหลดแบบฟอร์ม")
-			console.log("false")
-		}
-	})
-}
 </script>
 
 <template>
-	<!-- <div>
-    ลาไปปฏิบัติงานในองค์การระหว่างประเทศ
-    <ul>
-      <li>เขียนที่</li>
-      <li>ลาตั้งแต่วันที่</li>
-      <li>ลาถึงวันที่</li>
-      <li>รายละเอียด (ไม่บังคับกรอก)</li>
-      <li>เอกสารประกอบ</li>
-
-      <li>*หลังจากบันทึก แสดงปุ่มดาวน์โหลดแบบฟอร์ม</li>
-      <li>*หลังจากบันทึก แสดง input ให้อัพโหลดเอกสารกลับเข้าระบบ</li>
-    </ul>
-
-    <p>*หมายเหตุ 
-      รายละเอียดฟิลด์ในหัวข้อนี้มีเยอะ หลังจากกดบันทึกแล้วแสดงเอกสาร docx ให้ดาวน์โหลด เพื่อกรอก
-      และเพิ่มให้อัพโหหลดเอกสารกลับเข้ามาในระบบ
-    </p>
-  </div> -->
 	<div style="display: flex; align-items: center">
 		<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
 		<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
@@ -124,13 +95,13 @@ function onSubmit() {
 			<div class="col-12 row q-pa-sm q-col-gutter-sm">
 				<q-input
 					class="col-12 col-sm-12"
-					ref="leaveNoRef"
+					ref="leaveWroteRef"
 					hide-bottom-space
 					bg-color="white"
-					for="leaveNoRef"
+					for="leaveWroteRef"
 					dense
 					outlined
-					v-model="formData.leaveNo"
+					v-model="formData.leaveWrote"
 					label="เขียนที่"
 					:readonly="!edit"
 					:rules="[val => !!val || `${'เขียนที่'}`]"
@@ -139,7 +110,7 @@ function onSubmit() {
 				<datepicker
 					class="col-12 col-md-6 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.startLeaveDate"
+					v-model="formData.leaveStartDate"
 					:locale="'th'"
 					hide-bottom-space
 					autoApply
@@ -158,13 +129,13 @@ function onSubmit() {
 						<q-input
 							outlined
 							dense
-							ref="startLeaveDateRef"
-							for="startLeaveDateRef"
+							ref="leaveStartDateRef"
+							for="leaveStartDateRef"
 							hide-bottom-space
 							bg-color="white"
 							:readonly="!edit"
 							class="full-width datepicker"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@@ -178,15 +149,15 @@ function onSubmit() {
 				<datepicker
 					class="col-12 col-md-6 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					:locale="'th'"
 					autoApply
 					hide-bottom-space
 					borderless
 					:enableTimePicker="false"
 					week-start="0"
-					:readonly="!formData.startLeaveDate"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:readonly="!formData.leaveStartDate"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -198,13 +169,13 @@ function onSubmit() {
 						<q-input
 							outlined
 							dense
-							ref="endLeaveDateRef"
-							for="endLeaveDateRef"
+							ref="leaveEndDateRef"
+							for="leaveEndDateRef"
 							hide-bottom-space
 							bg-color="white"
-							:readonly="!formData.startLeaveDate"
+							:readonly="!formData.leaveStartDate"
 							class="full-width datepicker"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
@@ -241,7 +212,7 @@ function onSubmit() {
 					:readonly="!edit"
 				/>
 
-				<q-file ref="fileRef" bg-color="white" v-model="formData.file" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
+				<q-file ref="fileRef" bg-color="white" v-model="formData.leaveDocument" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
 					<template v-slot:prepend>
 						<q-icon name="attach_file" color="primary" />
 					</template>
@@ -253,7 +224,7 @@ function onSubmit() {
 					</div>
 					<q-card bordered flat class="full-width">
 						<q-list separator>
-							<q-item v-for="(file, index) in formData.file" :key="index" class="q-my-xs">
+							<q-item v-for="(file, index) in formData.leaveDocument" :key="index" class="q-my-xs">
 								<q-item-section>
 									<q-item-label class="full-width ellipsis">
 										{{ file.name }}
@@ -267,7 +238,7 @@ function onSubmit() {
 			</div>
 		</q-card>
 
-		<div v-if="formData.leaveNo && formData.endLeaveDate && formData.startLeaveDate" class="q-mt-md">
+		<div v-if="formData.leaveWrote && formData.leaveEndDate && formData.leaveStartDate" class="q-mt-md">
 			<div style="display: flex; align-items: center">
 				<q-icon name="mdi-numeric-4-circle" size="20px" color="primary" />
 				<div class="q-pl-sm text-weight-bold text-dark">ดาวน์โหลด/อัปโหลดแบบฟอร์ม</div>
@@ -283,7 +254,7 @@ function onSubmit() {
 					<div class="col-10 col-sm-5 col-md-4 q-my-sm">
 						<div class="column q-mx-xs">
 							<div class="q-pl-sm text-weight-bold text-dark text-center">อัปโหลด</div>
-							<q-file v-model="filesUpload" dense label="แบบฟอร์ม" outlined bg-color="white" multiple accept=".pdf">
+							<q-file v-model="formData.leaveDraftDocument" dense label="แบบฟอร์ม" outlined bg-color="white" multiple accept=".pdf">
 								<template v-slot:prepend>
 									<q-icon name="attach_file" color="primary" />
 								</template>
@@ -291,7 +262,7 @@ function onSubmit() {
 						</div>
 					</div>
 					<div class="col-md-1 self-end q-mb-sm">
-						<q-btn v-if="filesUpload" flat round color="primary" icon="mdi-arrow-up-bold" @click="fileUploadDoc"><q-tooltip>อัปโหลด</q-tooltip></q-btn>
+						<q-btn v-if="formData.leaveDraftDocument" flat round color="primary" icon="mdi-arrow-up-bold" @click="fileUploadDoc"><q-tooltip>อัปโหลด</q-tooltip></q-btn>
 					</div>
 				</div>
 			</q-card>
diff --git a/src/modules/05_leave/componenst/Forms/12_FollowSpouseForm.vue b/src/modules/05_leave/componenst/Forms/12_FollowSpouseForm.vue
index 17d59b0..670c3c6 100644
--- a/src/modules/05_leave/componenst/Forms/12_FollowSpouseForm.vue
+++ b/src/modules/05_leave/componenst/Forms/12_FollowSpouseForm.vue
@@ -21,77 +21,77 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	leaveNo: "",
-	startLeaveDate: null,
-	endLeaveDate: null,
+	leaveWrote: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
 	leaveTotal: "", //จำนวนวันลา
 	salaryText: 25000,
-	salary: 25000, //เงินเดือนปัจจุบัน
-	spouseName: "", //ชื่อคู่สมรส
-	spousePosition: "", //ตำแหน่งคู่สมรส
-	spouseLevel: "", //ระดับคู่สมรส
-	dutyCountry: "", //ไปปฏิบัติราชการ ณ ประเทศ
+	leaveSalary: 25000, //เงินเดือนปัจจุบัน
+	coupleDayName: "", //ชื่อคู่สมรส
+	coupleDayPosition: "", //ตำแหน่งคู่สมรส
+	coupleDayLevel: "", //ระดับคู่สมรส
+	coupleDayLevelCountry: "", //ไปปฏิบัติราชการ ณ ประเทศ
 	followHistoryCountry: "", //ประวัติการลาติดตามคู่สมรส
 	followHistoryTime: "",
 	followHistoryStart: null,
 	followHistoryEnd: null,
 	leaveDetail: "ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา ...ปี, ...เดือน, ...วัน", //รายละเอียดการลา
-	file: [], //เอกสารปะกอบ
+	leaveDocument: [], //เอกสารปะกอบ
 })
 
 /** แปลงตัวแปร Salary */
 const formattSalaryText = arabicNumberToText(formData.salaryText)
 const formattSalary = computed(() => {
-	return formData.salary !== null ? formData.salary.toLocaleString("th-TH") : ""
+	return formData.leaveSalary !== null ? formData.leaveSalary.toLocaleString("th-TH") : ""
 })
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const leaveNoRef = ref<object | null>(null)
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
-const salaryRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
+const leaveSalaryRef = ref<object | null>(null)
 const leaveTotalRef = ref<object | null>(null)
-const spouseNameRef = ref<object | null>(null)
-const leaveContactLocationRef = ref<object | null>(null)
+const coupleDayNameRef = ref<object | null>(null)
+const leaveAddressRef = ref<object | null>(null)
 const leaveDetailRef = ref<object | null>(null)
-const spousePositionRef = ref<object | null>(null)
-const spouseLevelRef = ref<object | null>(null)
-const dutyCountryRef = ref<object | null>(null)
+const coupleDayPositionRef = ref<object | null>(null)
+const coupleDayLevelRef = ref<object | null>(null)
+const coupleDayLevelCountryRef = ref<object | null>(null)
 const followHistoryCountryRef = ref<object | null>(null)
 const followHistoryTimeRef = ref<object | null>(null)
 const followHistoryStartRef = ref<object | null>(null)
 const followHistoryEndRef = ref<object | null>(null)
-const fileRef = ref<object | null>(null)
+const leaveDocumentRef = ref<object | null>(null)
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const FormRef: FormRef = {
-	leaveNo: leaveNoRef, //เขียนที่***
-	startLeaveDate: startLeaveDateRef, //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: endLeaveDateRef, //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: leaveWroteRef, //เขียนที่***
+	leaveStartDate: leaveStartDateRef, //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: leaveEndDateRef, //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: leaveTotalRef, //จำนวนวันลา
-	salary: salaryRef, //เงินเดือนปัจจุบัน
-	spouseName: spouseNameRef, //หมายเลขที่ติดต่อขณะลา
-	spousePosition: spousePositionRef, //ตำแหน่งคู่สมรส
-	spouseLevel: spouseLevelRef, //ระดับคู่สมรส
-	dutyCountry: dutyCountryRef, //ไปปฏิบัติราชการ ณ ประเทศ
+	leaveSalary: leaveSalaryRef, //เงินเดือนปัจจุบัน
+	coupleDayName: coupleDayNameRef, //หมายเลขที่ติดต่อขณะลา
+	coupleDayPosition: coupleDayPositionRef, //ตำแหน่งคู่สมรส
+	coupleDayLevel: coupleDayLevelRef, //ระดับคู่สมรส
+	coupleDayLevelCountry: coupleDayLevelCountryRef, //ไปปฏิบัติราชการ ณ ประเทศ
 	followHistoryCountry: followHistoryCountryRef, //ประวัติการลาติดตามคู่สมรส
 	followHistoryEnd: followHistoryEndRef, //ประวัติการลาติดตามคู่สมรส
 	followHistoryTime: followHistoryTimeRef, //ประวัติการลาติดตามคู่สมรส
 	followHistoryStart: followHistoryStartRef, //ประวัติการลาติดตามคู่สมรส
 	leaveDetail: leaveDetailRef, //รายละเอียดการลา
-	leaveContactLocation: leaveContactLocationRef, //สถานที่ติดต่อขณะลา
-	file: fileRef,
+	leaveAddress: leaveAddressRef, //สถานที่ติดต่อขณะลา
+	leaveDocument: leaveDocumentRef,
 }
 
 /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
 watch(props.data, async () => {
 	// console.log("data==>", props.data)
-	formData.leaveNo = props.data.leaveNo
-	formData.startLeaveDate = props.data.startLeaveDate
-	formData.endLeaveDate = props.data.endLeaveDate
+	formData.leaveWrote = props.data.leaveWrote
+	formData.leaveStartDate = props.data.leaveStartDate
+	formData.leaveEndDate = props.data.leaveEndDate
 	formData.leaveTotal = props.data.leaveTotal
 	formData.leaveDetail = props.data.leaveDetail
-	formData.file = props.data.file
+	formData.leaveDocument = props.data.leaveDocument
 })
 
 /** ส่วนของการประกาศและเลือกไฟล์เอกสารประกอบ */
@@ -115,7 +115,7 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		props.onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
@@ -123,35 +123,13 @@ function onValidate() {
  * function อัพเดทค่า LeaveTotal
  */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
+	const newLeaveTotal = calculateDurationYmd(formData.leaveStartDate, formData.leaveEndDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
 </script>
 
 <template>
-	<!-- <div>
-		ลาติดตามคู่สมรส
-		<ul>
-			<li>เขียนที่</li>
-			<li>ลาตั้งแต่วันที่</li>
-			<li>ลาถึงวันที่</li>
-			<li>มีกำหนด กี่ปี กี่เดือน กี่วัน (คำนวนจากทาง frontend Auto)</li>
-			<li>เงินเดือนปัจจุบัน (Auto)</li>
-			<li>เงินเดือนปัจจุบัน (เขียนเป็นคำอ่าน) ใช้ฟังก์ชั่นแปลงเลขเป็นข้อความ</li>
-			<li>ชื่อคู่สมรส</li>
-			<li>ตำแหน่งคู่สมรส</li>
-			<li>ระดับคู่สมรส</li>
-			<li>ไปปฏิบัติราชการ ณ ประเทศ</li>
-			<li>ระดับคู่สมรส</li>
-			<li>
-				ประวัติการลาติดตามคู่สมรสครั้งสุดท้าย ประกอบด้วย ประเทศ, เป็นเวลา กี่ปี กี่เดือน กี่วัน, ตั้งแต่วันที่, ถึงวันที่ (ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา กี่ปี กี่เดือน
-				กี่วัน ข้อมูลมาจาก API (Auto))
-			</li>
-			<li>รายละเอียด (ไม่บังคับกรอก)</li>
-			<li>เอกสารประกอบ</li>
-		</ul>
-	</div> -->
 	<div style="display: flex; align-items: center">
 		<q-icon name="mdi-numeric-3-circle" size="20px" color="primary" />
 		<div class="q-pl-sm text-weight-bold text-dark">กรอกข้อมูล</div>
@@ -161,13 +139,13 @@ function updateLeaveTotal() {
 			<div class="col-12 row q-pa-sm q-col-gutter-sm">
 				<q-input
 					class="col-12 col-sm-12"
-					ref="leaveNoRef"
-					for="leaveNoRef"
+					ref="leaveWroteRef"
+					for="leaveWroteRef"
 					dense
 					hide-bottom-space
 					bg-color="white"
 					outlined
-					v-model="formData.leaveNo"
+					v-model="formData.leaveWrote"
 					label="เขียนที่"
 					:readonly="!edit"
 					:rules="[val => !!val || `${'เขียนที่'}`]"
@@ -175,7 +153,7 @@ function updateLeaveTotal() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-12"
 					menu-class-name="modalfix"
-					v-model="formData.startLeaveDate"
+					v-model="formData.leaveStartDate"
 					:locale="'th'"
 					autoApply
 					hide-bottom-space
@@ -194,13 +172,13 @@ function updateLeaveTotal() {
 						<q-input
 							outlined
 							dense
-							ref="startLeaveDateRef"
-							for="startLeaveDateRef"
+							ref="leaveStartDateRef"
+							for="leaveStartDateRef"
 							hide-bottom-space
 							bg-color="white"
 							:readonly="!edit"
 							class="full-width datepicker"
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@@ -214,7 +192,7 @@ function updateLeaveTotal() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-12"
 					menu-class-name="modalfix"
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					:locale="'th'"
 					autoApply
 					borderless
@@ -222,8 +200,8 @@ function updateLeaveTotal() {
 					:enableTimePicker="false"
 					week-start="0"
 					@update:model-value="updateLeaveTotal"
-					:readonly="!formData.startLeaveDate"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:readonly="!formData.leaveStartDate"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -235,13 +213,13 @@ function updateLeaveTotal() {
 						<q-input
 							outlined
 							dense
-							ref="endLeaveDateRef"
-							for="endLeaveDateRef"
+							ref="leaveEndDateRef"
+							for="leaveEndDateRef"
 							hide-bottom-space
 							bg-color="white"
-							:readonly="!formData.startLeaveDate"
+							:readonly="!formData.leaveStartDate"
 							class="full-width datepicker"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
@@ -264,15 +242,26 @@ function updateLeaveTotal() {
 					hide-bottom-space
 				/>
 				<div class="col-12 col-md-6 col-sm-12">
-					<q-input hide-bottom-space bg-color="white" class="col-12 col-sm-12" ref="salaryRef" for="salaryRef" dense outlined v-model="formattSalary" label="เงินเดือนปัจจุบัน" readonly />
+					<q-input
+						hide-bottom-space
+						bg-color="white"
+						class="col-12 col-sm-12"
+						ref="leaveSalaryRef"
+						for="leaveSalaryRef"
+						dense
+						outlined
+						v-model="formattSalary"
+						label="เงินเดือนปัจจุบัน"
+						readonly
+					/>
 				</div>
 				<div class="col-12 col-md-6 col-sm-12">
 					<q-input
 						hide-bottom-space
 						bg-color="white"
 						class="col-12 col-sm-12"
-						ref="salaryRef"
-						for="salaryRef"
+						ref="leaveSalaryRef"
+						for="leaveSalaryRef"
 						dense
 						outlined
 						v-model="formattSalaryText"
@@ -285,12 +274,12 @@ function updateLeaveTotal() {
 					<q-input
 						class="col-12 col-sm-12"
 						hide-bottom-space
-						ref="spouseNameRef"
-						for="spouseNameRef"
+						ref="coupleDayNameRef"
+						for="coupleDayNameRef"
 						dense
 						bg-color="white"
 						outlined
-						v-model="formData.spouseName"
+						v-model="formData.coupleDayName"
 						label="ชื่อคู่สมรส"
 						:readonly="!edit"
 						:rules="[val => !!val || `${'ชื่อคู่สมรส'}`]"
@@ -300,12 +289,12 @@ function updateLeaveTotal() {
 					<q-input
 						class="col-12 col-sm-12"
 						hide-bottom-space
-						ref="spousePositionRef"
-						for="spousePositionRef"
+						ref="coupleDayPositionRef"
+						for="coupleDayPositionRef"
 						dense
 						outlined
 						bg-color="white"
-						v-model="formData.spousePosition"
+						v-model="formData.coupleDayPosition"
 						label="ตำแหน่งคู่สมรส"
 						:readonly="!edit"
 						:rules="[val => !!val || `${'ตำแหน่งคู่สมรส'}`]"
@@ -314,13 +303,13 @@ function updateLeaveTotal() {
 				<div class="col-md-3 col-sm-12">
 					<q-input
 						class="col-12 col-sm-12"
-						ref="spouseLevelRef"
-						for="spouseLevelRef"
+						ref="coupleDayLevelRef"
+						for="coupleDayLevelRef"
 						dense
 						hide-bottom-space
 						outlined
 						bg-color="white"
-						v-model="formData.spouseLevel"
+						v-model="formData.coupleDayLevel"
 						label="ระดับคู่สมรส"
 						:readonly="!edit"
 						:rules="[val => !!val || `${'ระดับคู่สมรส'}`]"
@@ -329,13 +318,13 @@ function updateLeaveTotal() {
 				<div class="col-md-3 col-sm-12">
 					<q-input
 						class="col-12 col-sm-12"
-						ref="dutyCountryRef"
-						for="dutyCountryRef"
+						ref="coupleDayLevelCountryRef"
+						for="coupleDayLevelCountryRef"
 						hide-bottom-space
 						dense
 						outlined
 						bg-color="white"
-						v-model="formData.dutyCountry"
+						v-model="formData.coupleDayLevelCountry"
 						label="ไปปฏิบัติราชการ ณ ประเทศ"
 						:readonly="!edit"
 						:rules="[val => !!val || `${'ปฏิบัติราชการ ณ ประเทศ'}`]"
@@ -458,7 +447,7 @@ function updateLeaveTotal() {
 					:readonly="!edit"
 				/>
 
-				<q-file ref="fileRef" bg-color="white" v-model="formData.file" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
+				<q-file ref="fileRef" bg-color="white" v-model="formData.leaveDocument" @added="fileUploadDoc" dense label="เอกสารประกอบ" outlined use-chips multiple class="q-pl-sm col-12">
 					<template v-slot:prepend>
 						<q-icon name="attach_file" color="primary" />
 					</template>
@@ -470,7 +459,7 @@ function updateLeaveTotal() {
 					</div>
 					<q-card bordered flat class="full-width">
 						<q-list separator>
-							<q-item v-for="(file, index) in formData.file" :key="index" class="q-my-xs">
+							<q-item v-for="(file, index) in formData.leaveDocument" :key="index" class="q-my-xs">
 								<q-item-section>
 									<q-item-label class="full-width ellipsis">
 										{{ file.name }}
diff --git a/src/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue b/src/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue
index 6aafb59..466283f 100644
--- a/src/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue
+++ b/src/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue
@@ -2,7 +2,7 @@
 import { reactive, ref, computed } from "vue"
 import { useCounterMixin } from "@/stores/mixin"
 import { useQuasar } from "quasar"
-import type { FormRef13 } from "@/modules/05_leave/interface/request/AddAbsence"
+import type { RehabilitationForm } from "@/modules/05_leave/interface/request/AddAbsence"
 
 const $q = useQuasar()
 const mixin = useCounterMixin()
@@ -14,9 +14,9 @@ const files = ref<any>(null)
 const filesUpload = ref<any>(null)
 
 /** ตัวแปร ref สำหรับแสดง validate */
-const startLeaveDateRef = ref<object | null>(null)
-const endLeaveDateRef = ref<object | null>(null)
-const writeatRef = ref<object | null>(null)
+const leaveStartDateRef = ref<object | null>(null)
+const leaveEndDateRef = ref<object | null>(null)
+const leaveWroteRef = ref<object | null>(null)
 
 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
@@ -32,18 +32,19 @@ const props = defineProps({
 
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	writeat: "",
-	startLeaveDate: null,
-	endLeaveDate: null,
-	file: "",
-	info: "",
+	leaveWrote: "",
+	leaveStartDate: null,
+	leaveEndDate: null,
+	leaveDocument: "",
+	leaveDetail: "",
+	leaveDraftDocument: "",
 })
 
 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
-const formRef: FormRef13 = {
-	startLeaveDate: startLeaveDateRef,
-	endLeaveDate: endLeaveDateRef,
-	writeat: writeatRef,
+const formRef: RehabilitationForm = {
+	leaveStartDate: leaveStartDateRef,
+	leaveEndDate: leaveEndDateRef,
+	leaveWrote: leaveWroteRef,
 }
 
 /** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
@@ -59,36 +60,10 @@ function onValidate() {
 		}
 	}
 	if (hasError.every(result => result === true)) {
-		onSubmit()
+		props.onSubmit(formData)
 	}
 }
 
-// /** ฟังก์ชั่น บันทึก */
-// function onSubmit() {
-// 	dialogConfirm(
-// 		$q,
-// 		async () => {
-// 			props.onSubmit()
-// 			console.log(formData)
-// 			isSave.value = true
-// 		},
-// 		"ยืนยันการยื่นใบลา",
-// 		"ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
-// 	)
-// }
-
-/** ฟังก์ชั่น บันทึก */
-function onSubmit() {
-	dialogConfirm($q, async () => {
-		if (filesUpload.value) {
-			console.log(filesUpload.value)
-		} else {
-			notifyError($q, "กรุณาอัปโหลดแบบฟอร์ม")
-			console.log("false")
-		}
-	})
-}
-
 /** ฟังก์ชั่น อัปโหลด
  * consolelog ไว้ก่อน
  */
@@ -106,9 +81,9 @@ function upLoadFile() {
 		<q-card bordered class="q-pa-md bg-grey-1">
 			<div class="row q-pa-sm q-col-gutter-sm">
 				<q-input
-					v-model="formData.writeat"
+					v-model="formData.leaveWrote"
 					class="col-12 col-sm-12"
-					ref="writeatRef"
+					ref="leaveWroteRef"
 					dense
 					outlined
 					bg-color="white"
@@ -117,7 +92,7 @@ function upLoadFile() {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>
 
-				<datepicker v-model="formData.startLeaveDate" class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" autoApply borderless week-start="0" :enableTimePicker="false" :locale="'th'">
+				<datepicker v-model="formData.leaveStartDate" class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" autoApply borderless week-start="0" :enableTimePicker="false" :locale="'th'">
 					<template #year="{ year }">
 						{{ year + 543 }}
 					</template>
@@ -126,14 +101,14 @@ function upLoadFile() {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="startLeaveDateRef"
+							ref="leaveStartDateRef"
 							class="full-width datepicker"
 							bg-color="white"
 							outlined
 							dense
 							lazy-rules
 							hide-bottom-space
-							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
+							:model-value="formData.leaveStartDate != null ? date2Thai(formData.leaveStartDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@@ -145,16 +120,16 @@ function upLoadFile() {
 				</datepicker>
 
 				<datepicker
-					v-model="formData.endLeaveDate"
+					v-model="formData.leaveEndDate"
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
 					autoApply
 					borderless
 					week-start="0"
 					:locale="'th'"
-					:readonly="!formData.startLeaveDate"
+					:readonly="!formData.leaveStartDate"
 					:enableTimePicker="false"
-					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.leaveStartDate ? new Date(formData.leaveStartDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@@ -164,15 +139,15 @@ function upLoadFile() {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="endLeaveDateRef"
+							ref="leaveEndDateRef"
 							class="full-width datepicker"
 							outlined
 							dense
 							lazy-rules
 							bg-color="white"
 							hide-bottom-space
-							:readonly="!formData.startLeaveDate"
-							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
+							:readonly="!formData.leaveStartDate"
+							:model-value="formData.leaveEndDate != null ? date2Thai(formData.leaveEndDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
@@ -183,10 +158,10 @@ function upLoadFile() {
 					</template>
 				</datepicker>
 
-				<q-input v-model="formData.info" class="col-12 col-md-12 col-sm-12" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
+				<q-input v-model="formData.leaveDetail" class="col-12 col-md-12 col-sm-12" bg-color="white" dense outlined type="textarea" label="รายละเอียด" />
 
 				<div class="col-12 col-sm-6">
-					<q-file v-model="formData.file" bg-color="white" dense outlined multiple label="เอกสารประกอบ">
+					<q-file v-model="formData.leaveDocument" bg-color="white" dense outlined multiple label="เอกสารประกอบ">
 						<template v-slot:prepend>
 							<q-icon name="attach_file" color="primary" />
 						</template>
@@ -214,7 +189,7 @@ function upLoadFile() {
 			</div>
 		</q-card>
 
-		<div v-if="formData.writeat && formData.startLeaveDate && formData.endLeaveDate" class="q-mt-md">
+		<div v-if="formData.leaveWrote && formData.leaveStartDate && formData.leaveEndDate" class="q-mt-md">
 			<div style="display: flex; align-items: center">
 				<q-icon name="mdi-numeric-4-circle" size="20px" color="primary" />
 				<div class="q-pl-sm text-weight-bold text-dark">ดาวน์โหลด/อัปโหลดแบบฟอร์ม</div>
@@ -230,7 +205,7 @@ function upLoadFile() {
 					<div class="col-10 col-sm-5 col-md-4 q-my-sm">
 						<div class="column q-mx-xs">
 							<div class="q-pl-sm text-weight-bold text-dark text-center">อัปโหลด</div>
-							<q-file v-model="filesUpload" dense label="แบบฟอร์ม" outlined bg-color="white" multiple accept="application/pdf">
+							<q-file v-model="formData.leaveDraftDocument" dense label="แบบฟอร์ม" outlined bg-color="white" multiple accept="application/pdf">
 								<template v-slot:prepend>
 									<q-icon name="attach_file" color="primary" />
 								</template>
@@ -238,7 +213,7 @@ function upLoadFile() {
 						</div>
 					</div>
 					<div class="col-md-1 self-end q-mb-sm">
-						<q-btn v-if="filesUpload" flat round color="primary" icon="mdi-arrow-up-bold" @click="upLoadFile"><q-tooltip>อัปโหลด</q-tooltip></q-btn>
+						<q-btn v-if="formData.leaveDraftDocument" flat round color="primary" icon="mdi-arrow-up-bold" @click="upLoadFile"><q-tooltip>อัปโหลด</q-tooltip></q-btn>
 					</div>
 				</div>
 			</q-card>
diff --git a/src/modules/05_leave/componenst/Forms/Form.vue b/src/modules/05_leave/componenst/Forms/Form.vue
index 4451f11..d65003c 100644
--- a/src/modules/05_leave/componenst/Forms/Form.vue
+++ b/src/modules/05_leave/componenst/Forms/Form.vue
@@ -28,7 +28,7 @@ const formData = reactive<FormData>({
 	position: "ตำแหน่ง",
 	level: "ระดับ",
 	ocRequest: "สังกัด",
-	leaveReceived: "2",
+	leaveabsentDaySummon: "2",
 	leaveUse: "1",
 	leaveRemaining: "1",
 })
@@ -67,7 +67,7 @@ const formData = reactive<FormData>({
 			<q-input class="col-12 col-sm-3" dense outlined readonly bg-color="white" v-model="formData.position" label="ตำแหน่งผู้ยื่นขอ" />
 			<q-input class="col-12 col-sm-3" dense outlined readonly bg-color="white" v-model="formData.level" label="ระดับผู้ยื่นขอ" />
 			<q-input class="col-12 col-sm-3" dense outlined readonly bg-color="white" v-model="formData.ocRequest" label="สังกัดผู้ยื่นขอ" />
-			<q-input class="col-12 col-sm-4" dense outlined readonly bg-color="white" v-model="formData.leaveReceived" label="จำนวนสิทธิ์การลาที่ได้รับ" />
+			<q-input class="col-12 col-sm-4" dense outlined readonly bg-color="white" v-model="formData.leaveabsentDaySummon" label="จำนวนสิทธิ์การลาที่ได้รับ" />
 			<q-input class="col-12 col-sm-4" dense outlined readonly bg-color="white" v-model="formData.leaveUse" label="จำนวนสิทธิ์การลาที่ใช้ไป" />
 			<q-input class="col-12 col-sm-4" dense outlined readonly bg-color="white" v-model="formData.leaveRemaining" label="จำนวนสิทธิ์การลาคงเหลือ" />
 		</div>
diff --git a/src/modules/05_leave/interface/request/AddAbsence.ts b/src/modules/05_leave/interface/request/AddAbsence.ts
index 565234f..ec20a79 100644
--- a/src/modules/05_leave/interface/request/AddAbsence.ts
+++ b/src/modules/05_leave/interface/request/AddAbsence.ts
@@ -6,77 +6,78 @@ interface FormData {
 	position: string
 	level: string
 	ocRequest: string
-	leaveReceived: string
+	leaveabsentDaySummon: string
 	leaveUse: string
 	leaveRemaining: string
 }
-interface FormRef06 {
-	writeat: object | null
+interface OrdinationForm {
+	leaveWrote: object | null
 	government: object | null
 	birthday: object | null
-	startLeaveDate: object | null
-	endLeaveDate: object | null
+	leaveStartDate: object | null
+	leaveEndDate: object | null
 	totalLeave: object | null
-	dateOrdination: object | null
-	measureLocationName: object | null
-	tel: object | null
-	addressMeasure: object | null
-	buddhistLocationName: object | null
-	addressBuddhist: object | null
+	ordainDayOrdination: object | null
+	ordainDayLocationName: object | null
+	ordainDayLocationNumber: object | null
+	ordainDayLocationAddress: object | null
+	ordainDayBuddhistLentName: object | null
+	ordainDayBuddhistLentAddress: object | null
 	[key: string]: any
 }
-interface FormRef07 {
-	writeat: object | null
+interface HajiForm {
+	leaveWrote: object | null
 	government: object | null
-	startLeaveDate: object | null
-	endLeaveDate: object | null
+	leaveStartDate: object | null
+	leaveEndDate: object | null
 	[key: string]: any
 }
-interface FormRef08 {
-	startLeaveDate: object | null
-	endLeaveDate: object | null
-	writeat: object | null
-	received: object | null
-	at: object | null
-	dateAt: object | null
-	admitted: object | null
-	atPlace: object | null
+interface MilitaryForm {
+	leaveStartDate: object | null
+	leaveEndDate: object | null
+	leaveWrote: object | null
+	absentDaySummon: object | null
+	absentDayLocation: object | null
+	absentDayRegistorDate: object | null
+	absentDayGetIn: object | null
+	absentDayAt: object | null
+	leaveDetail: object | null
 	[key: string]: any
 }
-interface FormRef09 {
-	startLeaveDate: object | null
-	endLeaveDate: object | null
+interface studyDaySubjectForm {
+	leaveStartDate: object | null
+	leaveEndDate: object | null
 	birthday: object | null
 	dateGovernment: object | null
-	salary: object | null
-	tel: object | null
-	addressLeave: object | null
-	capital: object | null
-	country: object | null
-	nameEducation: object | null
-	degree: object | null
-	study: object | null
-	writeat: object | null
+	leaveSalary: object | null
+	leaveNumber: object | null
+	leaveAddress: object | null
+	studyDayScholarship: object | null
+	studyDayCountry: object | null
+	studyDayUniversityName: object | null
+	studyDayDegreeLevel: object | null
+	studyDaySubject: object | null
+	leaveWrote: object | null
 	[key: string]: any
 }
-interface FormRef10 {
-	startLeaveDate: object | null
-	endLeaveDate: object | null
+interface TrainForm {
+	leaveStartDate: object | null
+	leaveEndDate: object | null
 	birthday: object | null
 	dateGovernment: object | null
-	tel: object | null
-	addressLeave: object | null
-	capital: object | null
-	country: object | null
-	course: object | null
-	location: object | null
-	writeat: object | null
+	leaveNumber: object | null
+	leaveAddress: object | null
+	studyDayScholarship: object | null
+	studyDayCountry: object | null
+	studyDayTrainingSubject: object | null
+	studyDayTrainingName: object | null
+	leaveWrote: object | null
 	[key: string]: any
 }
-interface FormRef13 {
-	startLeaveDate: object | null
-	endLeaveDate: object | null
-	writeat: object | null
+interface RehabilitationForm {
+	leaveStartDate: object | null
+	leaveEndDate: object | null
+	leaveWrote: object | null
 	[key: string]: any
 }
-export type { FormData, FormRef06, FormRef07, FormRef08, FormRef09, FormRef10, FormRef13 }
+export type { FormData, OrdinationForm, HajiForm, MilitaryForm, studyDaySubjectForm, TrainForm, RehabilitationForm }
diff --git a/src/modules/05_leave/interface/request/BirthForm.ts b/src/modules/05_leave/interface/request/BirthForm.ts
index 56b9b51..7ec43d6 100644
--- a/src/modules/05_leave/interface/request/BirthForm.ts
+++ b/src/modules/05_leave/interface/request/BirthForm.ts
@@ -1,26 +1,24 @@
 interface FormData {
-	leaveNo: string //เขียนที่***
-	startLeaveDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: string //เขียนที่***
+	leaveStartDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: string //จำนวนวันลา
-	contractTel: string //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: string //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: string //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: string //รายละเอียดการลา
-	leaveContactLocation: string //สถานที่ติดต่อขณะลา
-	file: File[] | null //เอกสารปะกอบ
+	leaveAddress: string //สถานที่ติดต่อขณะลา
+	leaveDocument: File[] | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
 interface FormRef {
-	leaveNo: object | null //เขียนที่***
-	startLeaveDate: object | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: object | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: object | null //เขียนที่***
+	leaveStartDate: object | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: object | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: object | null //จำนวนวันลา
-	contractTel: object | null //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: object | null //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: object | null //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: object | null //รายละเอียดการลา
-	leaveContactLocation: object | null //สถานที่ติดต่อขณะลา
-	file: object | null //เอกสารปะกอบ
+	leaveAddress: object | null //สถานที่ติดต่อขณะลา
+	leaveDocument: object | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
diff --git a/src/modules/05_leave/interface/request/FollowSpouseForm.ts b/src/modules/05_leave/interface/request/FollowSpouseForm.ts
index 1ad8443..a07cb8e 100644
--- a/src/modules/05_leave/interface/request/FollowSpouseForm.ts
+++ b/src/modules/05_leave/interface/request/FollowSpouseForm.ts
@@ -1,39 +1,39 @@
 interface FormData {
-	leaveNo: string //เขียนที่***
-	startLeaveDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: string //เขียนที่***
+	leaveStartDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: string //จำนวนวันลา
-	salary: number //เงินเดือนปัจจุบัน
+	leaveSalary: number //เงินเดือนปัจจุบัน
 	salaryText: number //เงินเดือนคำอ่าน
-	spouseName: string //ชื่อคู่สมรส
-	spousePosition: string //ตำแหน่งคู่สมรส
-	spouseLevel: string //ระดับคู่สมรส
-	dutyCountry: string //ไปปฏิบัติราชการ ณ ประเทศ
+	coupleDayName: string //ชื่อคู่สมรส
+	coupleDayPosition: string //ตำแหน่งคู่สมรส
+	coupleDayLevel: string //ระดับคู่สมรส
+	coupleDayLevelCountry: string //ไปปฏิบัติราชการ ณ ประเทศ
 	followHistoryCountry: string //ประวัติการลาติดตามคู่สมรสประเทศ
 	followHistoryTime: string //ประวัติการลาติดตามคู่สมรสประเทศ
 	followHistoryStart: Date | null //ประวัติการลาติดตามคู่สมรสประเทศ
 	followHistoryEnd: Date | null //ประวัติการลาติดตามคู่สมรสประเทศ
 	leaveDetail: string //รายละเอียดการลา
-	file: File[] | null //เอกสารปะกอบ
+	leaveDocument: File[] | null //เอกสารปะกอบ
 }
 
 interface FormRef {
-	leaveNo: object | null //เขียนที่***
-	startLeaveDate: object | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: object | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: object | null //เขียนที่***
+	leaveStartDate: object | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: object | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: object | null //จำนวนวันลา
-	salary: object | null //เงินเดือนปัจจุบัน
-	spouseName: object | null //หมายเลขที่ติดต่อขณะลา
-	spousePosition: object | null //ตำแหน่งคู่สมรส
-	spouseLevel: object | null //ระดับคู่สมรส
-	dutyCountry: object | null //ไปปฏิบัติราชการ ณ ประเทศ
+	leaveSalary: object | null //เงินเดือนปัจจุบัน
+	coupleDayName: object | null //หมายเลขที่ติดต่อขณะลา
+	coupleDayPosition: object | null //ตำแหน่งคู่สมรส
+	coupleDayLevel: object | null //ระดับคู่สมรส
+	coupleDayLevelCountry: object | null //ไปปฏิบัติราชการ ณ ประเทศ
 	followHistoryCountry: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
 	followHistoryTime: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
 	followHistoryStart: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
 	followHistoryEnd: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
 	leaveDetail: object | null //รายละเอียดการลา
-	leaveContactLocation: object | null //สถานที่ติดต่อขณะลา
-	file: object | null //เอกสารปะกอบ
+	leaveAddress: object | null //สถานที่ติดต่อขณะลา
+	leaveDocument: object | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
diff --git a/src/modules/05_leave/interface/request/HelpWifeForm.ts b/src/modules/05_leave/interface/request/HelpWifeForm.ts
index c0f9282..a9471d5 100644
--- a/src/modules/05_leave/interface/request/HelpWifeForm.ts
+++ b/src/modules/05_leave/interface/request/HelpWifeForm.ts
@@ -1,30 +1,28 @@
 interface FormData {
-	leaveNo: string //เขียนที่***
-	wifeName: string //ชื่อภรรยา
-	brithDate: Date | null //วันที่คลอด
-	startLeaveDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: string //เขียนที่***
+	wifeDayName: string //ชื่อภรรยา
+	wifeDayDateBorn: Date | null //วันที่คลอด
+	leaveStartDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: string //จำนวนวันลา
-	contractTel: string //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: string //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: string //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: string //รายละเอียดการลา
-	leaveContactLocation: string //สถานที่ติดต่อขณะลา
-	file: File[] | null //เอกสารปะกอบ
+	leaveAddress: string //สถานที่ติดต่อขณะลา
+	leaveDocument: File[] | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
 interface FormRef {
-	leaveNo: object | null //เขียนที่***
-	startLeaveDate: object | null //*วัน เดือน ปีเริ่มต้นลา
-	wifeName: object | null //ชื่อภรรยา
-	brithDate: object | null //วันที่คลอด
-	endLeaveDate: object | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: object | null //เขียนที่***
+	leaveStartDate: object | null //*วัน เดือน ปีเริ่มต้นลา
+	wifeDayName: object | null //ชื่อภรรยา
+	wifeDayDateBorn: object | null //วันที่คลอด
+	leaveEndDate: object | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: object | null //จำนวนวันลา
-	contractTel: object | null //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: object | null //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: object | null //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: object | null //รายละเอียดการลา
-	leaveContactLocation: object | null //สถานที่ติดต่อขณะลา
-	file: object | null //เอกสารปะกอบ
+	leaveAddress: object | null //สถานที่ติดต่อขณะลา
+	leaveDocument: object | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
diff --git a/src/modules/05_leave/interface/request/SickForm.ts b/src/modules/05_leave/interface/request/SickForm.ts
index 83b71a9..9701480 100644
--- a/src/modules/05_leave/interface/request/SickForm.ts
+++ b/src/modules/05_leave/interface/request/SickForm.ts
@@ -1,28 +1,27 @@
 interface FormData {
-	leaveNo: string //เขียนที่***
-	startLeaveDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: string //เขียนที่***
+	leaveStartDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
 	halfDay: string
 	leaveTotal: string //จำนวนวันลา
 	contractTel: string //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: string //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: string //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: string //รายละเอียดการลา
-	leaveContactLocation: string //สถานที่ติดต่อขณะลา
-	file: File[] | null //เอกสารปะกอบ
+	leaveAddress: string //สถานที่ติดต่อขณะลา
+	leaveDocument: File[] | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
 interface FormRef {
-	leaveNo: object | null //เขียนที่***
-	startLeaveDate: object | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: object | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: object | null //เขียนที่***
+	leaveStartDate: object | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: object | null //*วัน เดือน ปีสิ้นสุดลา
 	halfDay: object | null
 	leaveTotal: object | null //จำนวนวันลา
-	contractTel: object | null //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: object | null //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: object | null //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: object | null //รายละเอียดการลา
-	leaveContactLocation: object | null //สถานที่ติดต่อขณะลา
-	file: object | null //เอกสารปะกอบ
+	leaveAddress: object | null //สถานที่ติดต่อขณะลา
+	leaveDocument: object | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
diff --git a/src/modules/05_leave/interface/request/VacationForm.ts b/src/modules/05_leave/interface/request/VacationForm.ts
index e114af5..6196e49 100644
--- a/src/modules/05_leave/interface/request/VacationForm.ts
+++ b/src/modules/05_leave/interface/request/VacationForm.ts
@@ -1,32 +1,32 @@
 interface FormData {
-	leaveNo: string //เขียนที่***
+	leaveWrote: string //เขียนที่***
 	halfDay: string
-	lastYearVacation: string //จำนวนวันลาพักผ่อนสะสม จากปีที่ผ่านมา
-	currentVacation: string //จำนวนวันลาพักผ่อนประจำปีปัจจุบัน
-	startLeaveDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
+	restDayOldTotal: string //จำนวนวันลาพักผ่อนสะสม จากปีที่ผ่านมา
+	restDayCurrentTotal: string //จำนวนวันลาพักผ่อนประจำปีปัจจุบัน
+	leaveStartDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: string //จำนวนวันลา
 	contractTel: string //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: string //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: string //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: string //รายละเอียดการลา
-	leaveContactLocation: string //สถานที่ติดต่อขณะลา
-	file: File[] | null //เอกสารปะกอบ
+	leaveAddress: string //สถานที่ติดต่อขณะลา
+	leaveDocument: File[] | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
 interface FormRef {
-	leaveNo: object | null //เขียนที่***
+	leaveWrote: object | null //เขียนที่***
 	halfDay: object | null
-	startLeaveDate: object | null //*วัน เดือน ปีเริ่มต้นลา
-	lastYearVacation: object | null //ชื่อภรรยา
-	currentVacation: object | null //วันที่คลอด
-	endLeaveDate: object | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveStartDate: object | null //*วัน เดือน ปีเริ่มต้นลา
+	restDayOldTotal: object | null //ชื่อภรรยา
+	restDayCurrentTotal: object | null //วันที่คลอด
+	leaveEndDate: object | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveTotal: object | null //จำนวนวันลา
 	contractTel: object | null //หมายเลขโทรศัพท์ที่ติดต่อได้
-	leaveContactTel: object | null //หมายเลขที่ติดต่อขณะลา
+	leaveNumber: object | null //หมายเลขที่ติดต่อขณะลา
 	leaveDetail: object | null //รายละเอียดการลา
-	leaveContactLocation: object | null //สถานที่ติดต่อขณะลา
-	file: object | null //เอกสารปะกอบ
+	leaveAddress: object | null //สถานที่ติดต่อขณะลา
+	leaveDocument: object | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
diff --git a/src/modules/05_leave/interface/request/WorkInternationalForm.ts b/src/modules/05_leave/interface/request/WorkInternationalForm.ts
index 3b7952a..50719fb 100644
--- a/src/modules/05_leave/interface/request/WorkInternationalForm.ts
+++ b/src/modules/05_leave/interface/request/WorkInternationalForm.ts
@@ -1,17 +1,18 @@
 interface FormData {
-	leaveNo: string //เขียนที่***
-	startLeaveDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: string //เขียนที่***
+	leaveStartDate: Date | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: Date | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveDetail: string //รายละเอียดการลา
-	file: File[] | null //เอกสารปะกอบ
+	leaveDocument: File[] | null //เอกสารปะกอบ
+	leaveDraftDocument: File[]
 }
 
 interface FormRef {
-	leaveNo: object | null //เขียนที่***
-	startLeaveDate: object | null //*วัน เดือน ปีเริ่มต้นลา
-	endLeaveDate: object | null //*วัน เดือน ปีสิ้นสุดลา
+	leaveWrote: object | null //เขียนที่***
+	leaveStartDate: object | null //*วัน เดือน ปีเริ่มต้นลา
+	leaveEndDate: object | null //*วัน เดือน ปีสิ้นสุดลา
 	leaveDetail: object | null //รายละเอียดการลา
-	file: object | null //เอกสารปะกอบ
+	leaveDocument: object | null //เอกสารปะกอบ
 	[key: string]: any
 }
 
diff --git a/src/modules/05_leave/views/AddPage.vue b/src/modules/05_leave/views/AddPage.vue
index 0c4dd28..37e5c6f 100644
--- a/src/modules/05_leave/views/AddPage.vue
+++ b/src/modules/05_leave/views/AddPage.vue
@@ -1,206 +1,214 @@
 <script setup lang="ts">
-import { ref, onMounted, computed } from "vue";
-import { useQuasar } from "quasar";
-import { useRouter, useRoute } from "vue-router";
+import { ref, onMounted, computed } from "vue"
+import { useQuasar } from "quasar"
+import { useRouter, useRoute } from "vue-router"
 
-import FormPart2 from "@/modules/05_leave/componenst/Forms/Form.vue";
-import SickForm from "@/modules/05_leave/componenst/Forms/01_SickForm.vue";
-import FormBirth from "@/modules/05_leave/componenst/Forms/03_Birth.vue";
-import HelpWifeBirthForm from "@/modules/05_leave/componenst/Forms/04_HelpWifeBirthForm.vue";
-import VacationForm from "@/modules/05_leave/componenst/Forms/05_VacationForm.vue";
-import OrdinationForm from "@/modules/05_leave/componenst/Forms/06_OrdinationForm.vue";
-import HajjForm from "@/modules/05_leave/componenst/Forms/07_HajjForm.vue";
-import MilitaryForm from "@/modules/05_leave/componenst/Forms/08_MilitaryForm.vue";
-import StudyForm from "@/modules/05_leave/componenst/Forms/09_StudyForm.vue";
-import TrainForm from "@/modules/05_leave/componenst/Forms/10_TrainForm.vue";
-import WorkInternationalForm from "@/modules/05_leave/componenst/Forms/11_WorkInternationalForm.vue";
-import FollowSpouseForm from "@/modules/05_leave/componenst/Forms/12_FollowSpouseForm.vue";
-import RehabilitationForm from "@/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue";
-import { useLeaveStore } from "@/modules/05_leave/store";
-import http from "@/plugins/http";
-import config from "@/app.config";
-import type { QForm } from "quasar";
-import { useCounterMixin } from "@/stores/mixin";
+import FormPart2 from "@/modules/05_leave/componenst/Forms/Form.vue"
+import SickForm from "@/modules/05_leave/componenst/Forms/01_SickForm.vue"
+import FormBirth from "@/modules/05_leave/componenst/Forms/03_Birth.vue"
+import HelpWifeBirthForm from "@/modules/05_leave/componenst/Forms/04_HelpWifeBirthForm.vue"
+import VacationForm from "@/modules/05_leave/componenst/Forms/05_VacationForm.vue"
+import OrdinationForm from "@/modules/05_leave/componenst/Forms/06_OrdinationForm.vue"
+import HajjForm from "@/modules/05_leave/componenst/Forms/07_HajjForm.vue"
+import MilitaryForm from "@/modules/05_leave/componenst/Forms/08_MilitaryForm.vue"
+import StudyForm from "@/modules/05_leave/componenst/Forms/09_StudyForm.vue"
+import TrainForm from "@/modules/05_leave/componenst/Forms/10_TrainForm.vue"
+import WorkInternationalForm from "@/modules/05_leave/componenst/Forms/11_WorkInternationalForm.vue"
+import FollowSpouseForm from "@/modules/05_leave/componenst/Forms/12_FollowSpouseForm.vue"
+import RehabilitationForm from "@/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue"
+import { useLeaveStore } from "@/modules/05_leave/store"
+import http from "@/plugins/http"
+import config from "@/app.config"
+import type { QForm } from "quasar"
+import { useCounterMixin } from "@/stores/mixin"
 
-const dataStore = useLeaveStore();
-const mixin = useCounterMixin();
-const { date2Thai, dialogConfirm } = mixin;
-const router = useRouter();
-const route = useRoute();
-const myform = ref<QForm | null>(null);
-const $q = useQuasar();
+const dataStore = useLeaveStore()
+const mixin = useCounterMixin()
+const { date2Thai, dialogConfirm, success, messageError } = mixin
+const router = useRouter()
+const route = useRoute()
+const myform = ref<QForm | null>(null)
+const $q = useQuasar()
 
-const model = ref<string>("");
-const modelSpecific = ref<string>("");
+const model = ref<string>("")
+const modelSpecific = ref<string>("")
 
 // onMounted(() => {});
 
 const saveAbsence = () => {
-  $q.dialog({
-    title: "ยืนยันการยื่นข้อมูลลาออก",
-    message: "ต้องการยื่นข้อมูลลาออกนี้ใช่หรือไม่?",
-    cancel: {
-      flat: true,
-      color: "negative",
-    },
-    persistent: true,
-  })
-    .onOk(() => {
-      // createFormresign()
-      if (model.value !== "7") {
-        console.log(1);
-      } else if (model.value === "7") {
-        console.log(2);
-      }
-      router.push(`/leave`);
-    })
-    .onCancel(() => {})
-    .onDismiss(() => {});
-};
+	$q.dialog({
+		title: "ยืนยันการยื่นข้อมูลลาออก",
+		message: "ต้องการยื่นข้อมูลลาออกนี้ใช่หรือไม่?",
+		cancel: {
+			flat: true,
+			color: "negative",
+		},
+		persistent: true,
+	})
+		.onOk(() => {
+			// createFormresign()
+			if (model.value !== "7") {
+				console.log(1)
+			} else if (model.value === "7") {
+				console.log(2)
+			}
+			router.push(`/leave`)
+		})
+		.onCancel(() => {})
+		.onDismiss(() => {})
+}
 /** ฟังก์ชั่น บันทึก */
-const onSubmit = async () => {
-  dialogConfirm(
-    $q,
-    async () => {},
-    "ยืนยันการยื่นใบลา",
-    "ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
-  );
+const onSubmit = async (formData: any) => {
+	dialogConfirm(
+		$q,
+		async () => {
+			console.log(formData)
+			saveformdata(formData)
+		},
+		"ยืนยันการยื่นใบลา",
+		"ต้องการยืนยันการยื่นใบลานี้ใช่หรือไม่ ?"
+	)
+	console.log(formData)
+	console.log(formData.leaveWrote)
 
-  console.log("save");
-};
+	console.log("save")
+}
+
+async function saveformdata(formData: any) {
+	await http
+		.post(config.API.leaveUser(), {
+			type: formData.id ?? "",
+			leaveStartDate: formData.leaveStartDate ?? "",
+			leaveEndDate: formData.leaveEndDate ?? "",
+			leaveWrote: formData.leaveWrote ?? "" ?? "", //เขียนที่
+			leaveAddress: formData.leaveAddress ?? "", //สถานที่ติดต่อขณะลา
+			leaveNumber: formData.leaveNumber ?? "", //หมายเลขที่ติดต่อขณะลา
+			leaveDetail: formData.leaveDetail ?? "", //รายละเอียดการลา
+			leaveDocument: formData.leaveDocument ?? "", //อัปโหลดเอกสารประกอบรายละเอียด
+			leaveDraftDocument: formData.leaveDraftDocument ?? "", //อัปโหลดแบบฟอร์มการลา
+			leaveSalaryText: formData.leaveSalaryText ?? "", //เงินเดือนปัจจุบัน (เขียนเป็นคำอ่าน)
+			wifeDayName: formData.wifeDayName ?? "", //ชื่อภรรยา(ลาไปช่วยเหลือภริยาที่คลอดบุตร)
+			wifeDayDateBorn: formData.wifeDayDateBorn ?? "", //วันที่คลอด(ลาไปช่วยเหลือภริยาที่คลอดบุตร)
+			restDayOldTotal: formData.restDayOldTotal ?? "", //จำนวนวันลาพักผ่อนสะสม จากปีที่ผ่านมา(ลาพักผ่อน)(Auto)
+			restDayCurrentTotal: formData.restDayCurrentTotal ?? "", //จำนวนวันลาพักผ่อนประจำปีปัจจุบัน(ลาพักผ่อน)(Auto)
+			ordainDayStatus: formData.ordainDayStatus ?? "", //เคย/ไม่เคยบวช (ให้เลือก) (ลาอุปสมบท)
+			ordainDayLocationName: formData.ordainDayLocationName ?? "", //สถานที่บวช ชื่อวัด(ลาอุปสมบท)
+			ordainDayLocationAddress: formData.ordainDayLocationAddress ?? "", //สถานที่บวช ที่อยู่(ลาอุปสมบท)
+			ordainDayLocationNumber: formData.ordainDayLocationNumber ?? "", //สถานที่บวช หมายเลขโทรศัพท์(ลาอุปสมบท)
+			ordainDayOrdination: formData.ordainDayOrdination ?? "", //สถานที่บวช วันอุปสมบท(ลาอุปสมบท)
+			ordainDayBuddhistLentName: formData.ordainDayBuddhistLentName ?? "", //สถานที่จำพรรษา ชื่อวัด(ลาอุปสมบท)
+			ordainDayBuddhistLentAddress: formData.ordainDayBuddhistLentAddress ?? "", //สถานที่จำพรรษา ที่อยู่(ลาอุปสมบท)
+			hajjDayStatus: formData.hajjDayStatus ?? "", //เคย/ไม่เคยไปประกอบพิธีฮัจย์ (ให้เลือก) (ลาประกอบพิธีฮัจย์)
+			absentDaySummon: formData.absentDaySummon ?? "", //ได้รับหมายเรียกของ (ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล)
+			absentDayLocation: formData.absentDayLocation ?? "", //ที่ (ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล)
+			absentDayRegistorDate: formData.absentDayRegistorDate ?? "", //ลงวันที่ (ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล)
+			absentDayGetIn: formData.absentDayGetIn ?? "", //ให้เข้ารับการ (ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล)
+			absentDayAt: formData.absentDayAt ?? "", //ณ ที่ (ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล)
+			studyDaySubject: formData.studyDaySubject ?? "", //กรณีลาไปศึกษาต่อ ศึกษาวิชา (ลาไปศึกษา ฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน)
+			studyDayDegreeLevel: formData.studyDayDegreeLevel ?? "", //กรณีลาไปศึกษาต่อ ขั้นปริญญา (ลาไปศึกษา ฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน)
+			studyDayUniversityName: formData.studyDayUniversityName ?? "", //กรณีลาไปศึกษาต่อ ชื่อสถานศึกษา (ลาไปศึกษา ฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน)
+			studyDayTrainingSubject: formData.studyDayTrainingSubject ?? "", //กรณีลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน ด้าน/หลักสูตร (ลาไปศึกษา ฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน)
+			studyDayTrainingName: formData.studyDayTrainingName ?? "", //กรณีลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน ณ สถานที่	(ลาไปศึกษา ฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน)
+			studyDayCountry: formData.studyDayCountry ?? "", //ประเทศ (ลาไปศึกษา ฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน)
+			studyDayScholarship: formData.studyDayScholarship ?? "", //ด้วยทุน (ลาไปศึกษา ฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน)
+			coupleDayName: formData.coupleDayName ?? "", //ชื่อคู่สมรส (ลาติดตามคู่สมรส)
+			coupleDayPosition: formData.coupleDayPosition ?? "", //ตำแหน่งคู่สมรส (ลาติดตามคู่สมรส)
+			coupleDayLevel: formData.coupleDayLevel ?? "", //ระดับคู่สมรส (ลาติดตามคู่สมรส)
+			coupleDayLevelCountry: formData.coupleDayLevelCountry ?? "", //ไปปฏิบัติราชการ ณ ประเทศ (ลาติดตามคู่สมรส)
+			coupleDayCountryHistory: formData.coupleDayCountryHistory ?? "", //ประวัติ ประเทศ (ลาติดตามคู่สมรส)
+			coupleDayTotalHistory: formData.coupleDayTotalHistory ?? "", //ประวัติ เป็นเวลา กี่ปี กี่เดือน กี่วัน (ลาติดตามคู่สมรส)
+			coupleDayStartDateHistory: formData.coupleDayStartDateHistory ?? "", //ประวัติ ตั้งแต่วันที่ (ลาติดตามคู่สมรส)
+			coupleDayEndDateHistory: formData.coupleDayEndDateHistory ?? "", //ประวัติ ถึงวันที่ (ลาติดตามคู่สมรส)
+			coupleDaySumTotalHistory: formData.coupleDaySumTotalHistory ?? "", //ประวัติ ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา กี่ปี กี่เดือน กี่วัน (ลาติดตามคู่สมรส)
+			leaveSalary: formData.leaveSalary,
+		})
+		.then((res: any) => {
+			success($q, "บันทึกสำเร็จ")
+			router.push(`/probation/detail`)
+		})
+		.catch((e: any) => {
+			messageError($q, e)
+		})
+}
 </script>
 
 <template>
-  <div class="col-12 row justify-center">
-    <div class="col-xs-12 col-sm-12 col-md-11">
-      <div class="toptitle text-white col-12 row items-center">
-        <q-btn
-          to="/leave"
-          icon="mdi-arrow-left"
-          unelevated
-          round
-          dense
-          flat
-          color="primary"
-          class="q-mr-sm"
-        />
-        <div>ยื่นใบลา</div>
-      </div>
+	<div class="col-12 row justify-center">
+		<div class="col-xs-12 col-sm-12 col-md-11">
+			<div class="toptitle text-white col-12 row items-center">
+				<q-btn to="/leave" icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" />
+				<div>ยื่นใบลา</div>
+			</div>
 
-      <q-form ref="myform" class="col-12">
-        <q-card bordered>
-          <div class="col-12 row q-col-gutter-md q-pa-md">
-            <div class="col-xs-12 col-sm-12">
-              <div style="display: flex; align-items: center">
-                <q-icon
-                  name="mdi-numeric-1-circle"
-                  size="20px"
-                  color="primary"
-                />
-                <div class="q-pl-sm text-weight-bold text-dark">
-                  เลือกประเภทการลา
-                </div>
-              </div>
-              <div class="q-py-sm q-px-lg">
-                <div class="row">
-                  <q-select
-                    dense
-                    class="col-12 col-sm-6 col-md-4"
-                    outlined
-                    v-model="model"
-                    :options="dataStore.options"
-                    option-value="id"
-                    option-label="name"
-                    emit-value
-                    map-options
-                    prefix="ประเภทใบลา :"
-                    @update:model-value="
-                      dataStore.typeConvert(model, null), (modelSpecific = '')
-                    "
-                  />
-                </div>
-                <div class="row q-mt-sm">
-                  <div
-                    class="col-12 col-sm-6 col-md-3"
-                    v-if="model === '6' || model === '8'"
-                  >
-                    <q-select
-                      dense
-                      outlined
-                      v-model="modelSpecific"
-                      :options="
-                        model === '6'
-                          ? dataStore.optionsOrdination
-                          : dataStore.optionsSpecific
-                      "
-                      option-value="id"
-                      option-label="name"
-                      emit-value
-                      map-options
-                      prefix="ประเภทการลา :"
-                      @update:model-value="
-                        dataStore.typeConvert(model, modelSpecific)
-                      "
-                    />
-                  </div>
-                </div>
+			<q-form ref="myform" class="col-12">
+				<q-card bordered>
+					<div class="col-12 row q-col-gutter-md q-pa-md">
+						<div class="col-xs-12 col-sm-12">
+							<div style="display: flex; align-items: center">
+								<q-icon name="mdi-numeric-1-circle" size="20px" color="primary" />
+								<div class="q-pl-sm text-weight-bold text-dark">เลือกประเภทการลา</div>
+							</div>
+							<div class="q-py-sm q-px-lg">
+								<div class="row">
+									<q-select
+										dense
+										class="col-12 col-sm-6 col-md-4"
+										outlined
+										v-model="model"
+										:options="dataStore.options"
+										option-value="id"
+										option-label="name"
+										emit-value
+										map-options
+										prefix="ประเภทใบลา :"
+										@update:model-value="dataStore.typeConvert(model, null), (modelSpecific = '')"
+									/>
+								</div>
+								<div class="row q-mt-sm">
+									<div class="col-12 col-sm-6 col-md-3" v-if="model === '6' || model === '8'">
+										<q-select
+											dense
+											outlined
+											v-model="modelSpecific"
+											:options="model === '6' ? dataStore.optionsOrdination : dataStore.optionsSpecific"
+											option-value="id"
+											option-label="name"
+											emit-value
+											map-options
+											prefix="ประเภทการลา :"
+											@update:model-value="dataStore.typeConvert(model, modelSpecific)"
+										/>
+									</div>
+								</div>
 
-                <!-- v-if (ลาอุปสมบทหรือลาประกอบพิธีฮัจย์ฯ||ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน) -->
-              </div>
+								<!-- v-if (ลาอุปสมบทหรือลาประกอบพิธีฮัจย์ฯ||ลาไปศึกษา ฝึกอบรม ปฎิบัติการวิจัย หรือดูงาน) -->
+							</div>
 
-              <div>
-                <div style="display: flex; align-items: center">
-                  <q-icon
-                    name="mdi-numeric-2-circle"
-                    size="20px"
-                    color="primary"
-                  />
-                  <div class="q-pl-sm text-weight-bold text-dark">
-                    ข้อมูลการลา
-                  </div>
-                </div>
-                <FormPart2 :model="model" />
-              </div>
-            </div>
-            <div v-if="model" class="col-12">
-              <SickForm
-                :on-submit="onSubmit"
-                v-if="model === '1' || model === '2'"
-              />
-              <FormBirth :on-submit="onSubmit" v-if="model === '3'" />
-              <HelpWifeBirthForm :on-submit="onSubmit" v-if="model === '4'" />
-              <VacationForm :on-submit="onSubmit" v-if="model === '5'" />
-              <OrdinationForm
-                :on-submit="onSubmit"
-                v-if="model === '6' && modelSpecific === '0'"
-              />
-              <HajjForm
-                :on-submit="onSubmit"
-                v-if="model === '6' && modelSpecific === '1'"
-              />
-              <MilitaryForm
-                :on-submit="onSubmit"
-                v-if="model === '7'"
-                style="width: 100%"
-              />
-              <StudyForm
-                :on-submit="onSubmit"
-                v-if="model === '8' && modelSpecific === 's0'"
-                style="width: 100%"
-              />
-              <TrainForm
-                :on-submit="onSubmit"
-                v-if="
-                  model === '8' && modelSpecific != 's0' && modelSpecific != ''
-                "
-              />
-              <WorkInternationalForm :on-submit="onSubmit" v-if="model === '9'" />
-              <FollowSpouseForm :on-submit="onSubmit" v-if="model === '10'" />
-              <RehabilitationForm :on-submit="onSubmit" v-if="model === '11'" />
-            </div>
-          </div>
-        </q-card>
-      </q-form>
-    </div>
-  </div>
+							<div>
+								<div style="display: flex; align-items: center">
+									<q-icon name="mdi-numeric-2-circle" size="20px" color="primary" />
+									<div class="q-pl-sm text-weight-bold text-dark">ข้อมูลการลา</div>
+								</div>
+								<FormPart2 :model="model" />
+							</div>
+						</div>
+						<div v-if="model" class="col-12">
+							<SickForm :on-submit="onSubmit" v-if="model === '1' || model === '2'" />
+							<FormBirth :on-submit="onSubmit" v-if="model === '3'" />
+							<HelpWifeBirthForm :on-submit="onSubmit" v-if="model === '4'" />
+							<VacationForm :on-submit="onSubmit" v-if="model === '5'" />
+							<OrdinationForm :on-submit="onSubmit" v-if="model === '6' && modelSpecific === '0'" />
+							<HajjForm :on-submit="onSubmit" v-if="model === '6' && modelSpecific === '1'" />
+							<MilitaryForm :on-submit="onSubmit" v-if="model === '7'" style="width: 100%" />
+							<StudyForm :on-submit="onSubmit" v-if="model === '8' && modelSpecific === 's0'" style="width: 100%" />
+							<TrainForm :on-submit="onSubmit" v-if="model === '8' && modelSpecific != 's0' && modelSpecific != ''" />
+							<WorkInternationalForm :on-submit="onSubmit" v-if="model === '9'" />
+							<FollowSpouseForm :on-submit="onSubmit" v-if="model === '10'" />
+							<RehabilitationForm :on-submit="onSubmit" v-if="model === '11'" />
+						</div>
+					</div>
+				</q-card>
+			</q-form>
+		</div>
+	</div>
 </template>