เพิ่ม ประวัติการลาติดตามคู่สมรสย่อย

This commit is contained in:
AnandaTon 2023-11-08 17:36:46 +07:00
parent 89810f47ba
commit 906c0ba3ce
2 changed files with 97 additions and 15 deletions

View file

@ -27,7 +27,10 @@ const formData = reactive<FormData>({
spousePosition: "", //
spouseLevel: "", //
dutyCountry: "", //
followHistory: "", //
followHistoryCountry: "", //
followHistoryTime: "",
followHistoryStart: null,
followHistoryEnd: null,
leaveDetail: "", //
file: [], //
})
@ -43,7 +46,10 @@ 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 followHistoryRef = 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 FormRef: FormRef = {
@ -56,7 +62,10 @@ const FormRef: FormRef = {
spousePosition: spousePositionRef, //
spouseLevel: spouseLevelRef, //
dutyCountry: dutyCountryRef, //
followHistory: followHistoryRef, //
followHistoryCountry: followHistoryCountryRef, //
followHistoryEnd: followHistoryEndRef, //
followHistoryTime: followHistoryTimeRef, //
followHistoryStart: followHistoryStartRef, //
leaveDetail: leaveDetailRef, //
leaveContactLocation: leaveContactLocationRef, //
file: fileRef,
@ -277,17 +286,84 @@ function onValidate() {
:rules="[val => !!val || `${'ปฏิบัติราชการ ณ ประเทศ'}`]"
/>
</div>
<div class="col-12 row q-pa-sm q-col-gutter-sm">
<div class="col-md-12 col-sm-12">ประวการลาตดตามคสมรสครงสดทาย</div>
<q-input
class="col-md-9 col-sm-12"
dense
outlined
ref="followHistoryRef"
for="followHistoryRef"
v-model="formData.followHistory"
label="ประวัติการลาติดตามคู่สมรสครั้งสุดท้าย"
readonly
/>
<q-input class="col-md-4 col-sm-12" dense outlined ref="followHistoryRef" for="followHistoryRef" v-model="formData.followHistoryCountry" label="ประเทศ" readonly />
<q-input class="col-md-4 col-sm-12" dense outlined ref="followHistoryRef" for="followHistoryRef" v-model="formData.followHistoryTime" label="เป็นเวลา" readonly />
<datepicker
class="col-md-2 col-sm-12"
menu-class-name="modalfix"
v-model="formData.followHistoryStart"
:locale="'th'"
autoApply
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="followHistoryStartRef"
for="followHistoryStartRef"
hide-bottom-space
:readonly="!edit"
class="full-width datepicker"
:model-value="formData.followHistoryStart != null ? date2Thai(formData.followHistoryStart) : 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-md-2 col-sm-12"
menu-class-name="modalfix"
v-model="formData.followHistoryEnd"
:locale="'th'"
autoApply
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="followHistoryEndRef"
for="followHistoryEndRef"
hide-bottom-space
:readonly="!edit"
class="full-width datepicker"
:model-value="formData.followHistoryEnd != null ? date2Thai(formData.followHistoryEnd) : 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>
</div>
<q-input
type="textarea"

View file

@ -8,7 +8,10 @@ interface FormData {
spousePosition: string //ตำแหน่งคู่สมรส
spouseLevel: string //ระดับคู่สมรส
dutyCountry: string //ไปปฏิบัติราชการ ณ ประเทศ
followHistory: string //ประวัติการลาติดตามคู่สมรส
followHistoryCountry: string //ประวัติการลาติดตามคู่สมรสประเทศ
followHistoryTime: string //ประวัติการลาติดตามคู่สมรสประเทศ
followHistoryStart: Date | null //ประวัติการลาติดตามคู่สมรสประเทศ
followHistoryEnd: Date | null //ประวัติการลาติดตามคู่สมรสประเทศ
leaveDetail: string //รายละเอียดการลา
file: File[] | null //เอกสารปะกอบ
}
@ -23,7 +26,10 @@ interface FormRef {
spousePosition: object | null //ตำแหน่งคู่สมรส
spouseLevel: object | null //ระดับคู่สมรส
dutyCountry: object | null //ไปปฏิบัติราชการ ณ ประเทศ
followHistory: object | null //ประวัติการลาติดตามคู่สมรส
followHistoryCountry: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
followHistoryTime: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
followHistoryStart: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
followHistoryEnd: object | null //ประวัติการลาติดตามคู่สมรสประเทศ
leaveDetail: object | null //รายละเอียดการลา
leaveContactLocation: object | null //สถานที่ติดต่อขณะลา
file: object | null //เอกสารปะกอบ