refactor(recruiting): add ScoreExpireDate to compete, qualify, and disable period forms
All checks were successful
Build & Deploy on Dev / build (push) Successful in 2m54s
All checks were successful
Build & Deploy on Dev / build (push) Successful in 2m54s
This commit is contained in:
parent
6f878a0e16
commit
d3936e56b2
4 changed files with 208 additions and 20 deletions
|
|
@ -56,6 +56,7 @@ const fileImgDataUpload = ref<File[]>([]);
|
|||
const fileImgs = ref<UploadType[]>([]);
|
||||
const id = ref<string>("");
|
||||
const edit = ref<boolean>(false);
|
||||
const scoreExpireDate = ref<Date | null>(null); //วันหมดอายุบัญชี
|
||||
|
||||
/** กลับไปหน้าหลัก */
|
||||
function clickBack() {
|
||||
|
|
@ -101,6 +102,7 @@ async function fetchData() {
|
|||
|
||||
fileDocs.value = files;
|
||||
fileImgs.value = images;
|
||||
scoreExpireDate.value = data.scoreExpireDate;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
|
|
@ -256,7 +258,11 @@ function sendData() {
|
|||
year: yearly.value,
|
||||
announcementDate:
|
||||
dateAnnounce.value !== null ? convertDateToAPI(dateAnnounce.value) : null,
|
||||
rootDnaId: !edit.value ? dataPositionKeycloak.value.rootDnaId : undefined,
|
||||
scoreExpireDate:
|
||||
scoreExpireDate.value !== null
|
||||
? convertDateToAPI(scoreExpireDate.value)
|
||||
: null,
|
||||
rootDnaId: !edit.value ? dataPositionKeycloak.value.rootDnaId : undefined,
|
||||
};
|
||||
return valueData;
|
||||
}
|
||||
|
|
@ -359,6 +365,13 @@ function dateThaiRange(val: [Date, Date]) {
|
|||
return `${date2Thai(val[0], true)} - ${date2Thai(val[1], true)}`;
|
||||
}
|
||||
}
|
||||
function onUpdateScoreExpireDate(val: Date | null) {
|
||||
if (val) {
|
||||
const newDate = new Date(val);
|
||||
newDate.setFullYear(newDate.getFullYear() + 2);
|
||||
scoreExpireDate.value = newDate;
|
||||
}
|
||||
}
|
||||
|
||||
watch(organizationShortName, (count: DataOption2, prevCount: DataOption2) => {
|
||||
organizationNameOptions.value = [];
|
||||
|
|
@ -455,6 +468,7 @@ onMounted(async () => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-4 col-md-2" v-if="announcementExam">
|
||||
<q-input
|
||||
outlined
|
||||
|
|
@ -470,6 +484,7 @@ onMounted(async () => {
|
|||
input-class="text-right"
|
||||
></q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-4 col-md-3" v-if="announcementExam">
|
||||
<datepicker
|
||||
v-model="dateExam"
|
||||
|
|
@ -505,6 +520,7 @@ onMounted(async () => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||
<datepicker
|
||||
v-model="dateAnnouncement"
|
||||
|
|
@ -547,6 +563,7 @@ onMounted(async () => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<datepicker
|
||||
v-model="dateRegister"
|
||||
|
|
@ -572,6 +589,7 @@ onMounted(async () => {
|
|||
dateRegister != null ? dateThaiRange(dateRegister) : null
|
||||
"
|
||||
:label="`${'วันที่สมัคร'}`"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
@ -585,6 +603,7 @@ onMounted(async () => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div
|
||||
class="col-xs-12 col-sm-3 col-md-3"
|
||||
v-if="announcementExam && isFeeNotZero"
|
||||
|
|
@ -614,6 +633,7 @@ onMounted(async () => {
|
|||
"
|
||||
:label="`${'วันที่ชำระเงิน'}`"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกวันที่ชำระเงิน'}`]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
@ -636,6 +656,7 @@ onMounted(async () => {
|
|||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
@update:model-value="onUpdateScoreExpireDate"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
|
|
@ -653,6 +674,48 @@ onMounted(async () => {
|
|||
"
|
||||
:label="`${'วันประกาศผลสอบ'}`"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกวันประกาศผลสอบ'}`]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<datepicker
|
||||
v-model="scoreExpireDate"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
:model-value="
|
||||
scoreExpireDate != null ? date2Thai(scoreExpireDate) : null
|
||||
"
|
||||
:label="`${'วันหมดอายุบัญชี'}`"
|
||||
clearable
|
||||
@clear="scoreExpireDate = null"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
|
|||
|
|
@ -47,7 +47,7 @@ const positionPathOptions = ref<DataOption2[]>([]);
|
|||
const organizationShortName = ref<DataOption2>({ id: "", name: "" });
|
||||
const organizationName = ref<DataOption2>({ id: "", name: "" });
|
||||
const organizationNameOptions = ref<DataOption2[]>([]);
|
||||
|
||||
const scoreExpireDate = ref<Date | null>(null); //วันหมดอายุบัญชี
|
||||
const fileDocDataUpload = ref<File[]>([]);
|
||||
const fileDocs = ref<UploadType[]>([]);
|
||||
const fileImgDataUpload = ref<File[]>([]);
|
||||
|
|
@ -93,6 +93,7 @@ async function fetchData() {
|
|||
data.announcementDate != null ? new Date(data.announcementDate) : null;
|
||||
fileDocs.value = data.documents;
|
||||
fileImgs.value = data.images;
|
||||
scoreExpireDate.value = data.scoreExpireDate;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
|
|
@ -163,6 +164,10 @@ function sendData() {
|
|||
announcementDate:
|
||||
dateAnnounce.value !== null ? convertDateToAPI(dateAnnounce.value) : null,
|
||||
rootDnaId: !edit.value ? dataPositionKeycloak.value.rootDnaId : undefined,
|
||||
scoreExpireDate:
|
||||
scoreExpireDate.value !== null
|
||||
? convertDateToAPI(scoreExpireDate.value)
|
||||
: null,
|
||||
};
|
||||
return valueData;
|
||||
}
|
||||
|
|
@ -352,6 +357,14 @@ function dateThaiRange(val: [Date, Date] | null) {
|
|||
}
|
||||
}
|
||||
|
||||
function onUpdateScoreExpireDate(val: Date | null) {
|
||||
if (val) {
|
||||
const newDate = new Date(val);
|
||||
newDate.setFullYear(newDate.getFullYear() + 2);
|
||||
scoreExpireDate.value = newDate;
|
||||
}
|
||||
}
|
||||
|
||||
watch(organizationShortName, (count: DataOption2, prevCount: DataOption2) => {
|
||||
organizationNameOptions.value = [];
|
||||
});
|
||||
|
|
@ -390,7 +403,7 @@ onMounted(async () => {
|
|||
<q-form ref="myForm">
|
||||
<q-card-section class="q-pa-md">
|
||||
<div class="col-xs-12 col-sm-8"></div>
|
||||
<div class="col-12 row items-center q-col-gutter-x-sm">
|
||||
<div class="col-12 row q-col-gutter-sm">
|
||||
<div class="col-xs-12 col-sm-6">
|
||||
<q-input
|
||||
outlined
|
||||
|
|
@ -402,8 +415,10 @@ onMounted(async () => {
|
|||
(val:string) =>
|
||||
!!val || `${'กรุณากรอกชื่อรอบคัดเลือก/ชื่อประกาศ'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
></q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-4 col-md-1" v-if="announcementExam">
|
||||
<q-input
|
||||
outlined
|
||||
|
|
@ -413,8 +428,10 @@ onMounted(async () => {
|
|||
dense
|
||||
lazy-rules
|
||||
:rules="[(val:number) => val > 0 || `${'กรุณากรอกรอบการสอบให้ถูกต้อง'}`]"
|
||||
hide-bottom-space
|
||||
></q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-4 col-md-1" v-if="announcementExam">
|
||||
<datepicker
|
||||
v-model="yearly"
|
||||
|
|
@ -435,6 +452,7 @@ onMounted(async () => {
|
|||
:model-value="yearly + 543"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกปีงบประมาณ'}`]"
|
||||
:label="`${'ปีงบประมาณ'}`"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
@ -460,6 +478,7 @@ onMounted(async () => {
|
|||
:rules="[
|
||||
(val:any) => val >= 0 || `${'กรุณากรอกค่าธรรมเนียมให้ถูกต้อง'}`,
|
||||
]"
|
||||
hide-bottom-space
|
||||
></q-input>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
|
|
@ -484,6 +503,7 @@ onMounted(async () => {
|
|||
:model-value="dateExam != null ? date2Thai(dateExam) : null"
|
||||
:label="`${'วันที่สอบ'}`"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกวันที่สอบ'}`]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
@ -517,10 +537,11 @@ onMounted(async () => {
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker"
|
||||
:model-value="dateThaiRange(dateAnnouncement)"
|
||||
:label="`${'วันที่ประกาศ'}`"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกวันที่ประกาศ'}`]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
@ -554,10 +575,11 @@ onMounted(async () => {
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker"
|
||||
:model-value="dateThaiRange(dateRegister)"
|
||||
:label="`${'วันที่สมัคร'}`"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกวันที่สมัคร'}`]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
@ -594,12 +616,13 @@ onMounted(async () => {
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
datePayment != null ? dateThaiRange(datePayment) : null
|
||||
"
|
||||
:label="`${'วันที่ชำระเงิน'}`"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกวันที่ชำระเงิน'}`]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
@ -622,6 +645,7 @@ onMounted(async () => {
|
|||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
@update:model-value="onUpdateScoreExpireDate"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
|
|
@ -633,12 +657,54 @@ onMounted(async () => {
|
|||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
dateAnnounce != null ? date2Thai(dateAnnounce) : null
|
||||
"
|
||||
:label="`${'วันประกาศผลสอบ'}`"
|
||||
:rules="[(val:string) => !!val || `${'กรุณาเลือกวันประกาศผลสอบ'}`]"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<datepicker
|
||||
v-model="scoreExpireDate"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
dense
|
||||
class="full-width datepicker"
|
||||
:model-value="
|
||||
scoreExpireDate != null ? date2Thai(scoreExpireDate) : null
|
||||
"
|
||||
:label="`${'วันหมดอายุบัญชี'}`"
|
||||
clearable
|
||||
@clear="scoreExpireDate = null"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
|
|
|
|||
|
|
@ -93,6 +93,7 @@ const examTypeOptions = [
|
|||
{ name: "แพทย์", id: "docter" },
|
||||
];
|
||||
const category = ref<string>("");
|
||||
const scoreExpireDate = ref<Date | null>(null);
|
||||
|
||||
const fileDocDataUpload = ref<File[]>([]);
|
||||
const fileDocs = ref<UploadType[]>([]);
|
||||
|
|
@ -333,6 +334,7 @@ async function fetchData() {
|
|||
refNo1.value = data.refNo1;
|
||||
reason.value = data.reason;
|
||||
graduationYearLock.value = data.graduationYearLock;
|
||||
scoreExpireDate.value = data.scoreExpireDate;
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e);
|
||||
|
|
@ -506,6 +508,10 @@ function sendData() {
|
|||
refNo1: refNo1.value,
|
||||
reason: reason.value,
|
||||
graduationYearLock: Number(graduationYearLock.value),
|
||||
scoreExpireDate:
|
||||
scoreExpireDate.value != null
|
||||
? convertDateToAPI(scoreExpireDate.value)
|
||||
: null,
|
||||
};
|
||||
return valueData;
|
||||
}
|
||||
|
|
@ -939,6 +945,14 @@ watch(
|
|||
}
|
||||
);
|
||||
|
||||
function onUpdateScoreExpireDate(val: Date | null) {
|
||||
if (val) {
|
||||
const newDate = new Date(val);
|
||||
newDate.setFullYear(newDate.getFullYear() + 2);
|
||||
scoreExpireDate.value = newDate;
|
||||
}
|
||||
}
|
||||
|
||||
onMounted(async () => {
|
||||
hideLoader();
|
||||
if (route.params.id != undefined) {
|
||||
|
|
@ -1242,6 +1256,7 @@ onMounted(async () => {
|
|||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
@update:model-value="onUpdateScoreExpireDate"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
|
|
@ -1275,21 +1290,63 @@ onMounted(async () => {
|
|||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
<div class="row col-12" v-if="announcementExam">
|
||||
<div class="col-xs-12 col-md-2">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="graduationYearLock"
|
||||
label="ล็อกวันที่สำเร็จการศึกษา (ปี)"
|
||||
dense
|
||||
:readonly="checkRoutePermisson"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
|
||||
<div class="col-xs-12 col-sm-3 col-md-3" v-if="announcementExam">
|
||||
<datepicker
|
||||
v-model="scoreExpireDate"
|
||||
:locale="'th'"
|
||||
autoApply
|
||||
:readonly="checkRoutePermisson"
|
||||
borderless
|
||||
:enableTimePicker="false"
|
||||
week-start="0"
|
||||
>
|
||||
<template #year="{ year }">
|
||||
{{ year + 543 }}
|
||||
</template>
|
||||
<template #year-overlay-value="{ value }">
|
||||
{{ parseInt(value + 543) }}
|
||||
</template>
|
||||
<template #trigger>
|
||||
<q-input
|
||||
outlined
|
||||
:readonly="checkRoutePermisson"
|
||||
dense
|
||||
class="full-width datepicker q-mb-md"
|
||||
:model-value="
|
||||
scoreExpireDate != null ? date2Thai(scoreExpireDate) : null
|
||||
"
|
||||
:label="`${'วันหมดอายุบัญชี'}`"
|
||||
clearable
|
||||
@clear="scoreExpireDate = null"
|
||||
hide-bottom-space
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon
|
||||
name="event"
|
||||
class="cursor-pointer"
|
||||
style="color: var(--q-primary)"
|
||||
>
|
||||
</q-icon>
|
||||
</template>
|
||||
</q-input>
|
||||
</template>
|
||||
</datepicker>
|
||||
</div>
|
||||
|
||||
<div class="col-xs-12 col-sm-2 col-md-2" v-if="announcementExam">
|
||||
<q-input
|
||||
outlined
|
||||
v-model="graduationYearLock"
|
||||
label="ล็อกวันที่สำเร็จการศึกษา (ปี)"
|
||||
dense
|
||||
:readonly="checkRoutePermisson"
|
||||
lazy-rules
|
||||
:rules="[
|
||||
(val:string) => !!val || `${'กรุณากรอกล็อกวันที่สำเร็จการศึกษา (ปี)'}`,
|
||||
]"
|
||||
type="number"
|
||||
></q-input>
|
||||
</div>
|
||||
type="number"
|
||||
></q-input>
|
||||
</div>
|
||||
|
||||
<div class="col-12" v-if="announcementExam">
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue