แก้ไขชื่อตัวแปรให้สอดคล้องกัน

2023-11-23 10:19:35 +07:00 · 2023-11-23 10:19:35 +07:00 · 5a44fc64a4
commit 5a44fc64a4
parent 7a688d8abc
7 changed files with 168 additions and 177 deletions
--- a/src/modules/05_leave/componenst/Forms/06_OrdinationForm.vue
+++ b/src/modules/05_leave/componenst/Forms/06_OrdinationForm.vue
@ -29,9 +29,9 @@ const writeatRef = ref<object | null>(null)
 const birthdayRef = ref<object | null>(null)
 const governmentRef = ref<object | null>(null)
 const totalLeaveRef = ref<object | null>(null)
-const dateLeaveEndRef = ref<object | null>(null)
+const endLeaveDateRef = ref<object | null>(null)
 const dateOrdinationRef = ref<object | null>(null)
-const dateLeaveStartRef = 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)
@ -42,8 +42,8 @@ const formData = reactive<any>({
 	writeat: "",
 	government: new Date(),
 	birthday: new Date(),
-	dateLeaveStart: null,
-	dateLeaveEnd: null,
+	startLeaveDate: null,
+	endLeaveDate: null,
 	totalLeave: new Date(),
 	dateOrdination: new Date(),
 	measureLocationName: "",
@ -60,8 +60,8 @@ const formRef: FormRef06 = {
 	writeat: writeatRef,
 	government: governmentRef,
 	birthday: birthdayRef,
-	dateLeaveStart: dateLeaveStartRef,
-	dateLeaveEnd: dateLeaveEndRef,
+	startLeaveDate: startLeaveDateRef,
+	endLeaveDate: endLeaveDateRef,
 	totalLeave: totalLeaveRef,
 	dateOrdination: dateOrdinationRef,
 	measureLocationName: measureLocationNameRef,
@ -71,10 +71,10 @@ const formRef: FormRef06 = {
 	addressBuddhist: addressBuddhistRef,
 }

-// Watch for changes in dateLeaveEnd and update leaveTotal accordingly
-watch(formData.dateLeaveEnd, async () => {
-	if (formData.dateLeaveStart !== undefined && formData.dateLeaveEnd !== undefined) {
-		const newLeaveTotal = calculateDurationYmd(formData.dateLeaveStart, formData.dateLeaveEnd)
+// 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)
 		formData.leaveTotal = newLeaveTotal
 		console.log(newLeaveTotal)
 	}
@ -86,7 +86,7 @@ watch(formData.dateLeaveEnd, async () => {
 * function อัพเดทค่า LeaveTotal
 */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.dateLeaveStart, formData.dateLeaveEnd)
+	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
@ -144,7 +144,7 @@ function onSubmit() {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>

-				<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateLeaveStart" :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.startLeaveDate" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
 					<template #year="{ year }">
 						{{ year + 543 }}
 					</template>
@ -156,10 +156,10 @@ function onSubmit() {
 							outlined
 							bg-color="white"
 							dense
-							ref="dateLeaveStartRef"
+							ref="startLeaveDateRef"
 							hide-bottom-space
 							class="full-width datepicker"
-							:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
+							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@ -173,14 +173,14 @@ function onSubmit() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.dateLeaveEnd"
+					v-model="formData.endLeaveDate"
 					:locale="'th'"
 					autoApply
 					borderless
 					@update:model-value="updateLeaveTotal"
-					:readonly="!formData.dateLeaveStart"
+					:readonly="!formData.startLeaveDate"
 					:enableTimePicker="false"
-					:min-date="formData.dateLeaveStart ? new Date(formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
 					week-start="0"
 				>
 					<template #year="{ year }">
@ -193,13 +193,13 @@ function onSubmit() {
 						<q-input
 							outlined
 							dense
-							ref="dateLeaveEndRef"
+							ref="endLeaveDateRef"
 							bg-color="white"
 							hide-bottom-space
 							class="full-width datepicker"
-							:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
+							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
-							:readonly="!formData.dateLeaveStart"
+							:readonly="!formData.startLeaveDate"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
 							<template v-slot:prepend>
--- a/src/modules/05_leave/componenst/Forms/07_HajjForm.vue
+++ b/src/modules/05_leave/componenst/Forms/07_HajjForm.vue
@ -14,8 +14,8 @@ const files = ref<any>(null)
 /** ตัวแปร ref สำหรับแสดง validate */
 const writeatRef = ref<object | null>(null)
 const governmentRef = ref<object | null>(null)
-const dateLeaveStartRef = ref<object | null>(null)
-const dateLeaveEndRef = ref<object | null>(null)
+const startLeaveDateRef = ref<object | null>(null)
+const endLeaveDateRef = ref<object | null>(null)

 /** รับ props มาจากหน้าหลัก */
 const props = defineProps({
@ -33,8 +33,8 @@ const props = defineProps({
 const formData = reactive<any>({
 	writeat: "",
 	government: new Date(),
-	dateLeaveStart: null,
-	dateLeaveEnd: null,
+	startLeaveDate: null,
+	endLeaveDate: null,
 	totalLeave: new Date(),
 	monk: "never",
 	file: null,
@ -44,8 +44,8 @@ const formData = reactive<any>({
 const formRef: FormRef07 = {
 	writeat: writeatRef,
 	government: governmentRef,
-	dateLeaveStart: dateLeaveStartRef,
-	dateLeaveEnd: dateLeaveEndRef,
+	startLeaveDate: startLeaveDateRef,
+	endLeaveDate: endLeaveDateRef,
 }

 /** ฟังก์ชั่นตรวจสอบความถูกต้องก่อน บันทึก */
@ -68,7 +68,7 @@ function onValidate() {
 * function อัพเดทค่า LeaveTotal
 */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.dateLeaveStart, formData.dateLeaveEnd)
+	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
@ -110,7 +110,7 @@ function onSubmit() {
 				<div class="full-width">
 					<div class="q-col-gutter-sm row">
 						<datepicker
-							v-model="formData.dateLeaveStart"
+							v-model="formData.startLeaveDate"
 							class="col-12 col-md-4 col-sm-6"
 							menu-class-name="modalfix"
 							autoApply
@ -127,7 +127,7 @@ function onSubmit() {
 							</template>
 							<template #trigger>
 								<q-input
-									ref="dateLeaveStartRef"
+									ref="startLeaveDateRef"
 									bg-color="white"
 									class="full-width datepicker"
 									outlined
@ -135,7 +135,7 @@ function onSubmit() {
 									hide-bottom-space
 									:label="`${'ลาตั้งแต่วันที่'}`"
 									:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
-									:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
+									:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
 								>
 									<template v-slot:prepend>
 										<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
@ -145,7 +145,7 @@ function onSubmit() {
 						</datepicker>

 						<datepicker
-							v-model="formData.dateLeaveEnd"
+							v-model="formData.endLeaveDate"
 							class="col-12 col-md-4 col-sm-6"
 							menu-class-name="modalfix"
 							autoApply
@ -154,8 +154,8 @@ function onSubmit() {
 							:enableTimePicker="false"
 							:locale="'th'"
 							@update:model-value="updateLeaveTotal"
-							:readonly="!formData.dateLeaveStart"
-							:min-date="formData.dateLeaveStart ? new Date(formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000) : null"
+							:readonly="!formData.startLeaveDate"
+							:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
 						>
 							<template #year="{ year }">
 								{{ year + 543 }}
@ -165,15 +165,15 @@ function onSubmit() {
 							</template>
 							<template #trigger>
 								<q-input
-									ref="dateLeaveEndRef"
+									ref="endLeaveDateRef"
 									class="full-width datepicker"
 									bg-color="white"
 									outlined
 									dense
-									:readonly="!formData.dateLeaveStart"
+									:readonly="!formData.startLeaveDate"
 									hide-bottom-space
 									:label="`${'ลาถึงวันที่'}`"
-									:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
+									:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
 									:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 								>
 									<template v-slot:prepend>
--- a/src/modules/05_leave/componenst/Forms/08_MilitaryForm.vue
+++ b/src/modules/05_leave/componenst/Forms/08_MilitaryForm.vue
@ -12,8 +12,8 @@ const edit = ref<boolean>(true)
 const files = ref<any>(null)

 /** ตัวแปร ref สำหรับแสดง validate */
-const dateLeaveStartRef = ref<object | null>(null)
-const dateLeaveEndRef = ref<object | null>(null)
+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)
@ -35,8 +35,8 @@ const props = defineProps({

 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
-	dateLeaveStart: null,
-	dateLeaveEnd: null,
+	startLeaveDate: null,
+	endLeaveDate: null,
 	totalLeave: 1,
 	file: null,
 	writeat: "",
@ -50,8 +50,8 @@ const formData = reactive<any>({

 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const formRef: FormRef08 = {
-	dateLeaveStart: dateLeaveStartRef,
-	dateLeaveEnd: dateLeaveEndRef,
+	startLeaveDate: startLeaveDateRef,
+	endLeaveDate: endLeaveDateRef,
 	writeat: writeatRef,
 	received: receivedRef,
 	at: atRef,
@ -81,7 +81,7 @@ function onValidate() {
 * function อัพเดทค่า LeaveTotal
 */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.dateLeaveStart, formData.dateLeaveEnd)
+	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
@ -120,7 +120,7 @@ function onSubmit() {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>

-				<datepicker class="col-12 col-md-4 col-sm-6" menu-class-name="modalfix" v-model="formData.dateLeaveStart" :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.startLeaveDate" :locale="'th'" autoApply borderless :enableTimePicker="false" week-start="0">
 					<template #year="{ year }">
 						{{ year + 543 }}
 					</template>
@ -132,10 +132,10 @@ function onSubmit() {
 							outlined
 							bg-color="white"
 							dense
-							ref="dateLeaveStartRef"
+							ref="startLeaveDateRef"
 							hide-bottom-space
 							class="full-width datepicker"
-							:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
+							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@ -149,15 +149,15 @@ function onSubmit() {
 				<datepicker
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
-					v-model="formData.dateLeaveEnd"
+					v-model="formData.endLeaveDate"
 					:locale="'th'"
 					autoApply
 					borderless
 					:enableTimePicker="false"
 					week-start="0"
 					@update:model-value="updateLeaveTotal"
-					:readonly="!formData.dateLeaveStart"
-					:min-date="formData.dateLeaveStart ? new Date(formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000) : null"
+					:readonly="!formData.startLeaveDate"
+					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@ -169,12 +169,12 @@ function onSubmit() {
 						<q-input
 							outlined
 							dense
-							ref="dateLeaveEndRef"
+							ref="endLeaveDateRef"
 							bg-color="white"
 							hide-bottom-space
-							:readonly="!formData.dateLeaveStart"
+							:readonly="!formData.startLeaveDate"
 							class="full-width datepicker"
-							:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
+							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
--- a/src/modules/05_leave/componenst/Forms/09_StudyForm.vue
+++ b/src/modules/05_leave/componenst/Forms/09_StudyForm.vue
@ -12,8 +12,8 @@ const edit = ref<boolean>(true)
 const files = ref<any>(null)

 /** ตัวแปร ref สำหรับแสดง validate */
-const dateLeaveStartRef = ref<object | null>(null)
-const dateLeaveEndRef = ref<object | null>(null)
+const startLeaveDateRef = ref<object | null>(null)
+const endLeaveDateRef = ref<object | null>(null)
 const birthdayRef = ref<object | null>(null)
 const dateGovernmentRef = ref<object | null>(null)
 const salaryRef = ref<object | null>(null)
@ -41,8 +41,8 @@ const props = defineProps({
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
 	writeat: "",
-	dateLeaveStart: null,
-	dateLeaveEnd: null,
+	startLeaveDate: null,
+	endLeaveDate: null,
 	birthday: new Date(),
 	dateGovernment: new Date(),
 	salary: 10000,
@ -60,8 +60,8 @@ const formData = reactive<any>({

 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const formRef: FormRef09 = {
-	dateLeaveStart: dateLeaveStartRef,
-	dateLeaveEnd: dateLeaveEndRef,
+	startLeaveDate: startLeaveDateRef,
+	endLeaveDate: endLeaveDateRef,
 	birthday: birthdayRef,
 	dateGovernment: dateGovernmentRef,
 	salary: salaryRef,
@ -96,7 +96,7 @@ function onValidate() {
 * function อัพเดทค่า LeaveTotal
 */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.dateLeaveStart, formData.dateLeaveEnd)
+	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
@ -142,7 +142,7 @@ const formattedSalary = computed(() => {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>

-				<datepicker v-model="formData.dateLeaveStart" 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.startLeaveDate" 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 +151,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="dateLeaveStartRef"
+							ref="startLeaveDateRef"
 							class="full-width datepicker"
 							bg-color="white"
 							outlined
@ -159,7 +159,7 @@ const formattedSalary = computed(() => {
 							lazy-rules
 							hide-bottom-space
 							:label="`${'ลาตั้งแต่วันที่'}`"
-							:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
+							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
 							<template v-slot:prepend>
@ -170,7 +170,7 @@ const formattedSalary = computed(() => {
 				</datepicker>

 				<datepicker
-					v-model="formData.dateLeaveEnd"
+					v-model="formData.endLeaveDate"
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
 					autoApply
@ -178,9 +178,9 @@ const formattedSalary = computed(() => {
 					week-start="0"
 					:locale="'th'"
 					@update:model-value="updateLeaveTotal"
-					:readonly="!formData.dateLeaveStart"
+					:readonly="!formData.startLeaveDate"
 					:enableTimePicker="false"
-					:min-date="formData.dateLeaveStart ? new Date(formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@ -190,7 +190,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="dateLeaveEndRef"
+							ref="endLeaveDateRef"
 							class="full-width datepicker"
 							outlined
 							dense
@ -198,8 +198,8 @@ const formattedSalary = computed(() => {
 							bg-color="white"
 							hide-bottom-space
 							:label="`${'ลาถึงวันที่'}`"
-							:readonly="!formData.dateLeaveStart"
-							:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
+							:readonly="!formData.startLeaveDate"
+							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
 							<template v-slot:prepend>
--- a/src/modules/05_leave/componenst/Forms/10_TrainForm.vue
+++ b/src/modules/05_leave/componenst/Forms/10_TrainForm.vue
@ -25,8 +25,8 @@ const props = defineProps({
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
 	writeat: "",
-	dateLeaveStart: null,
-	dateLeaveEnd: null,
+	startLeaveDate: null,
+	endLeaveDate: null,
 	birthday: new Date(),
 	dateGovernment: new Date(),
 	salary: 10000,
@ -42,8 +42,8 @@ const formData = reactive<any>({
 })

 /** ตัวแปร ref สำหรับแสดง validate */
-const dateLeaveStartRef = ref<object | null>(null)
-const dateLeaveEndRef = ref<object | null>(null)
+const startLeaveDateRef = ref<object | null>(null)
+const endLeaveDateRef = ref<object | null>(null)
 const birthdayRef = ref<object | null>(null)
 const dateGovernmentRef = ref<object | null>(null)
 const telRef = ref<object | null>(null)
@ -56,8 +56,8 @@ const writeatRef = ref<object | null>(null)

 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const formRef: FormRef10 = {
-	dateLeaveStart: dateLeaveStartRef,
-	dateLeaveEnd: dateLeaveEndRef,
+	startLeaveDate: startLeaveDateRef,
+	endLeaveDate: endLeaveDateRef,
 	birthday: birthdayRef,
 	dateGovernment: dateGovernmentRef,
 	tel: telRef,
@ -91,7 +91,7 @@ function onValidate() {
 * function อัพเดทค่า LeaveTotal
 */
 function updateLeaveTotal() {
-	const newLeaveTotal = calculateDurationYmd(formData.dateLeaveStart, formData.dateLeaveEnd)
+	const newLeaveTotal = calculateDurationYmd(formData.startLeaveDate, formData.endLeaveDate)
 	formData.leaveTotal = newLeaveTotal
 	console.log("test")
 }
@ -136,7 +136,7 @@ const formattedSalary = computed(() => {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>

-				<datepicker v-model="formData.dateLeaveStart" 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.startLeaveDate" 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 +145,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="dateLeaveStartRef"
+							ref="startLeaveDateRef"
 							class="full-width datepicker"
 							bg-color="white"
 							outlined
@ -153,7 +153,7 @@ const formattedSalary = computed(() => {
 							lazy-rules
 							hide-bottom-space
 							:label="`${'ลาตั้งแต่วันที่'}`"
-							:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
+							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
 							<template v-slot:prepend>
@ -164,17 +164,17 @@ const formattedSalary = computed(() => {
 				</datepicker>

 				<datepicker
-					v-model="formData.dateLeaveEnd"
+					v-model="formData.endLeaveDate"
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
 					autoApply
 					borderless
 					@update:model-value="updateLeaveTotal"
 					week-start="0"
-					:readonly="!formData.dateLeaveStart"
+					:readonly="!formData.startLeaveDate"
 					:locale="'th'"
 					:enableTimePicker="false"
-					:min-date="formData.dateLeaveStart ? new Date(formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@ -184,7 +184,7 @@ const formattedSalary = computed(() => {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="dateLeaveEndRef"
+							ref="endLeaveDateRef"
 							class="full-width datepicker"
 							outlined
 							dense
@ -192,8 +192,8 @@ const formattedSalary = computed(() => {
 							bg-color="white"
 							hide-bottom-space
 							:label="`${'ลาถึงวันที่'}`"
-							:readonly="!formData.dateLeaveStart"
-							:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
+							:readonly="!formData.startLeaveDate"
+							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
 							<template v-slot:prepend>
--- a/src/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue
+++ b/src/modules/05_leave/componenst/Forms/13_RehabilitationForm.vue
@ -14,8 +14,8 @@ const files = ref<any>(null)
 const filesUpload = ref<any>(null)

 /** ตัวแปร ref สำหรับแสดง validate */
-const dateLeaveStartRef = ref<object | null>(null)
-const dateLeaveEndRef = ref<object | null>(null)
+const startLeaveDateRef = ref<object | null>(null)
+const endLeaveDateRef = ref<object | null>(null)
 const writeatRef = ref<object | null>(null)

 /** รับ props มาจากหน้าหลัก */
@ -33,16 +33,16 @@ const props = defineProps({
 /** ข้อมูล v-model ของฟอร์ม */
 const formData = reactive<any>({
 	writeat: "",
-	dateLeaveStart: null,
-	dateLeaveEnd: null,
+	startLeaveDate: null,
+	endLeaveDate: null,
 	file: "",
 	info: "",
 })

 /** maping ref เข้าตัวแปรเพื่อเตรียมตรวจสอบ */
 const formRef: FormRef13 = {
-	dateLeaveStart: dateLeaveStartRef,
-	dateLeaveEnd: dateLeaveEndRef,
+	startLeaveDate: startLeaveDateRef,
+	endLeaveDate: endLeaveDateRef,
 	writeat: writeatRef,
 }

@ -117,7 +117,7 @@ function upLoadFile() {
 					:rules="[val => !!val || `${'เขียนที่'}`]"
 				/>

-				<datepicker v-model="formData.dateLeaveStart" 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.startLeaveDate" 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 +126,14 @@ function upLoadFile() {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="dateLeaveStartRef"
+							ref="startLeaveDateRef"
 							class="full-width datepicker"
 							bg-color="white"
 							outlined
 							dense
 							lazy-rules
 							hide-bottom-space
-							:model-value="formData.dateLeaveStart != null ? date2Thai(formData.dateLeaveStart) : null"
+							:model-value="formData.startLeaveDate != null ? date2Thai(formData.startLeaveDate) : null"
 							:label="`${'ลาตั้งแต่วันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาตั้งแต่วันที่'}`]"
 						>
@ -145,16 +145,16 @@ function upLoadFile() {
 				</datepicker>

 				<datepicker
-					v-model="formData.dateLeaveEnd"
+					v-model="formData.endLeaveDate"
 					class="col-12 col-md-4 col-sm-6"
 					menu-class-name="modalfix"
 					autoApply
 					borderless
 					week-start="0"
 					:locale="'th'"
-					:readonly="!formData.dateLeaveStart"
+					:readonly="!formData.startLeaveDate"
 					:enableTimePicker="false"
-					:min-date="formData.dateLeaveStart ? new Date(formData.dateLeaveStart.getTime() + 24 * 60 * 60 * 1000) : null"
+					:min-date="formData.startLeaveDate ? new Date(formData.startLeaveDate.getTime() + 24 * 60 * 60 * 1000) : null"
 				>
 					<template #year="{ year }">
 						{{ year + 543 }}
@ -164,15 +164,15 @@ function upLoadFile() {
 					</template>
 					<template #trigger>
 						<q-input
-							ref="dateLeaveEndRef"
+							ref="endLeaveDateRef"
 							class="full-width datepicker"
 							outlined
 							dense
 							lazy-rules
 							bg-color="white"
 							hide-bottom-space
-							:readonly="!formData.dateLeaveStart"
-							:model-value="formData.dateLeaveEnd != null ? date2Thai(formData.dateLeaveEnd) : null"
+							:readonly="!formData.startLeaveDate"
+							:model-value="formData.endLeaveDate != null ? date2Thai(formData.endLeaveDate) : null"
 							:label="`${'ลาถึงวันที่'}`"
 							:rules="[val => !!val || `${'กรุณาเลือกลาถึงวันที่'}`]"
 						>
@ -214,7 +214,7 @@ function upLoadFile() {
 			</div>
 		</q-card>

-		<div v-if="formData.writeat && formData.dateLeaveStart && formData.dateLeaveEnd" class="q-mt-md">
+		<div v-if="formData.writeat && formData.startLeaveDate && formData.endLeaveDate" 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>
--- a/src/modules/05_leave/interface/request/AddAbsence.ts
+++ b/src/modules/05_leave/interface/request/AddAbsence.ts
@ -1,91 +1,82 @@
 interface FormData {
-    dateStart: Date
-    subject: string
-    who: string
-    requestName: string
-    position: string
-    level: string
-    ocRequest: string
-    leaveReceived: string
-    leaveUse: string
-    leaveRemaining: string
-
+	dateStart: Date
+	subject: string
+	who: string
+	requestName: string
+	position: string
+	level: string
+	ocRequest: string
+	leaveReceived: string
+	leaveUse: string
+	leaveRemaining: string
 }
 interface FormRef06 {
-    writeat: object | null;
-    government: object | null;
-    birthday: object | null;
-    dateLeaveStart: object | null;
-    dateLeaveEnd: object | null;
-    totalLeave: object | null;
-    dateOrdination: object | null;
-    measureLocationName: object | null;
-    tel: object | null;
-    addressMeasure: object | null;
-    buddhistLocationName: object | null;
-    addressBuddhist: object | null;
-    [key: string]: any;
+	writeat: object | null
+	government: object | null
+	birthday: object | null
+	startLeaveDate: object | null
+	endLeaveDate: object | null
+	totalLeave: object | null
+	dateOrdination: object | null
+	measureLocationName: object | null
+	tel: object | null
+	addressMeasure: object | null
+	buddhistLocationName: object | null
+	addressBuddhist: object | null
+	[key: string]: any
 }
 interface FormRef07 {
-    writeat: object | null
-    government: object | null
-    dateLeaveStart: object | null
-    dateLeaveEnd: object | null
-    [key: string]: any;
+	writeat: object | null
+	government: object | null
+	startLeaveDate: object | null
+	endLeaveDate: object | null
+	[key: string]: any
 }
 interface FormRef08 {
-    dateLeaveStart: object | null
-    dateLeaveEnd: object | null
-    writeat: object | null
-    received: object | null
-    at: object | null
-    dateAt: object | null
-    admitted: object | null
-    atPlace: object | null
-    [key: string]: any;
+	startLeaveDate: object | null
+	endLeaveDate: object | null
+	writeat: object | null
+	received: object | null
+	at: object | null
+	dateAt: object | null
+	admitted: object | null
+	atPlace: object | null
+	[key: string]: any
 }
 interface FormRef09 {
-    dateLeaveStart: object | null
-    dateLeaveEnd: 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
-    [key: string]: any;
+	startLeaveDate: object | null
+	endLeaveDate: 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
+	[key: string]: any
 }
 interface FormRef10 {
-    dateLeaveStart: object | null
-    dateLeaveEnd: 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
-    [key: string]: any;
+	startLeaveDate: object | null
+	endLeaveDate: 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
+	[key: string]: any
 }
 interface FormRef13 {
-    dateLeaveStart: object | null
-    dateLeaveEnd: object | null
-    writeat: object | null
-    [key: string]: any;
+	startLeaveDate: object | null
+	endLeaveDate: object | null
+	writeat: object | null
+	[key: string]: any
 }
-export type {
-    FormData,
-    FormRef06,
-    FormRef07,
-    FormRef08,
-    FormRef09,
-    FormRef10,
-    FormRef13,
-}
+export type { FormData, FormRef06, FormRef07, FormRef08, FormRef09, FormRef10, FormRef13 }