This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2025-11-19 11:55:43 +07:00
parent a0e3e88e7e
commit fced27b6f5
9 changed files with 201 additions and 35 deletions

View file

@ -60,6 +60,7 @@ const fetchData = async () => {
const data = res.data.result;
if (data != null) {
defaultContact.value.contactPrefixId = data.contactPrefixId;
defaultContact.value.contactPrefixName = data.contactPrefix;
defaultContact.value.contactFirstname = data.contactFirstname;
defaultContact.value.contactLastname = data.contactLastname;
defaultContact.value.contactRelations = data.contactRelations;
@ -78,6 +79,25 @@ const getClass = (val: boolean) => {
"full-width cursor-pointer": !val,
};
};
const filteredPrefixOptions = ref<string[]>([]);
const filterPrefix = (val: string, update: (fn: () => void) => void) => {
update(() => {
if (val === "") {
filteredPrefixOptions.value = [];
} else {
const needle = val.toLowerCase();
filteredPrefixOptions.value = props.prefixOptions
.filter((v) => v.name.toLowerCase().indexOf(needle) > -1)
.map((v) => v.name);
}
});
};
const setModel = (val: string) => {
defaultContact.value.contactPrefixName = val;
};
</script>
<template>
@ -92,7 +112,7 @@ const getClass = (val: boolean) => {
<q-form ref="myform">
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
<div class="col-xs-12 col-sm-3 col-md-2">
<q-select
<!-- <q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
@ -107,6 +127,25 @@ const getClass = (val: boolean) => {
:options="prefixOptions"
option-value="id"
:label="`${'คำนำหน้า'}`"
/> -->
<q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้า'}`]"
:outlined="status == 'checkRegister' || status == 'payment'"
dense
lazy-rules
v-model="defaultContact.contactPrefixName"
:label="`${'คำนำหน้า'}`"
:options="filteredPrefixOptions"
use-input
fill-input
input-debounce="0"
@filter="filterPrefix"
@input-value="setModel"
hide-selected
hide-dropdown-icon
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
@ -165,8 +204,8 @@ const getClass = (val: boolean) => {
v-model="defaultContact.contactTel"
:label="`${'โทรศัพท์'}`"
:rules="[
(val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
(val) =>
(val: string) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
(val: string) =>
(val.length >= 9 && val.length <= 10 && val.startsWith('0')) ||
'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง',
]"

View file

@ -67,6 +67,7 @@ async function fetchData() {
.get(config.API.candidateInformation(candidateId.value))
.then((res) => {
const data = res.data.result;
defaultInformation.value.prefix = data.prefix;
defaultInformation.value.prefixId = data.prefixId;
defaultInformation.value.lastname = data.lastName;
defaultInformation.value.provinceId = data.citizenProvinceId;
@ -78,6 +79,7 @@ async function fetchData() {
defaultInformation.value.cardid = data.citizenId;
defaultInformation.value.firstname = data.firstName;
defaultInformation.value.religionId = data.religionId;
defaultInformation.value.religionName = data.religion;
defaultInformation.value.nationality = data.nationality;
defaultInformation.value.email = data.email;
defaultInformation.value.phone = data.mobilePhone;
@ -164,6 +166,44 @@ function getClass(val: boolean) {
};
}
const filteredPrefixOptions = ref<string[]>([]);
const filterPrefix = (val: string, update: (fn: () => void) => void) => {
update(() => {
if (val === "") {
filteredPrefixOptions.value = [];
} else {
const needle = val.toLowerCase();
filteredPrefixOptions.value = props.prefixOptions
.filter((v) => v.name.toLowerCase().indexOf(needle) > -1)
.map((v) => v.name);
}
});
};
const setModel = (val: string) => {
defaultInformation.value.prefix = val;
};
const filteredReligionOptions = ref<string[]>([]);
const filterReligion = (val: string, update: (fn: () => void) => void) => {
update(() => {
if (val === "") {
filteredReligionOptions.value = [];
} else {
const needle = val.toLowerCase();
filteredReligionOptions.value = props.religionOptions
.filter((v) => v.name.toLowerCase().indexOf(needle) > -1)
.map((v) => v.name);
}
});
};
const setModelReligionId = (val: string) => {
defaultInformation.value.religionName = val;
};
watch(myform, async (count: any) => {
emit("update:form", count);
});
@ -222,7 +262,7 @@ onMounted(async () => {
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2">
<q-select
<!-- <q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
@ -237,6 +277,25 @@ onMounted(async () => {
:options="prefixOptions"
option-value="id"
:label="`${'คำนำหน้าชื่อ'}`"
/> -->
<q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
:rules="[(val:string) => !!val || `${'กรุณากรอก คำนำหน้าชื่อ'}`]"
:outlined="status == 'checkRegister' || status == 'payment'"
dense
lazy-rules
v-model="defaultInformation.prefix"
:label="`${'คำนำหน้า'}`"
:options="filteredPrefixOptions"
use-input
fill-input
input-debounce="0"
@filter="filterPrefix"
@input-value="setModel"
hide-selected
hide-dropdown-icon
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
@ -280,7 +339,7 @@ onMounted(async () => {
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
<!-- <q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
@ -295,6 +354,25 @@ onMounted(async () => {
:options="religionOptions"
option-value="id"
:label="`${'ศาสนา'}`"
/> -->
<q-select
:class="getClass(status == 'checkRegister' || status == 'payment')"
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
:rules="[(val:string) => !!val || `${'กรุณากรอก ศาสนา'}`]"
:outlined="status == 'checkRegister' || status == 'payment'"
dense
lazy-rules
v-model="defaultInformation.religionName"
:label="`${'ศาสนา'}`"
:options="filteredReligionOptions"
use-input
fill-input
input-debounce="0"
@filter="filterReligion"
@input-value="setModelReligionId"
hide-selected
hide-dropdown-icon
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">

View file

@ -191,25 +191,24 @@ onMounted(async () => {
:class="getClass(status == 'checkRegister' || status == 'payment')"
:outlined="status == 'checkRegister' || status == 'payment'"
dense
:counter="
status == 'checkRegister' || status == 'payment' ? true : false
"
maxlength="10"
lazy-rules
type="tel"
mask="##########"
autogrow
:readonly="!(status == 'checkRegister' || status == 'payment')"
:borderless="!(status == 'checkRegister' || status == 'payment')"
v-model="defaultOccupation.tel"
:rules="[
(val) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์',
(val) =>
(val.length >= 9 && val.length <= 10 && val.startsWith('0')) ||
'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง',
]"
:rules="[(val:string) => !!val || '* กรุณากรอกข้อมูลหมายเลขโทรศัพท์']"
:label="`${'เบอร์โทรที่ทำงาน'}`"
maxlength="20"
/>
<!-- (val) => (val.length >= 9 && val.length <= 10 && val.startsWith('0'))
|| 'กรุณากรอกข้อมูลหมายเลขโทรศัพท์ให้ถูกต้อง', -->
<!-- :counter="
status == 'checkRegister' || status == 'payment' ? true : false
" -->
<!-- maxlength="10" -->
<!-- type="tel" -->
<!-- mask="##########" -->
</div>
</div>
</div>

View file

@ -27,6 +27,7 @@ const selected = ref<string[]>([]);
const { messageError, showLoader, hideLoader } = mixin;
const dateFilter = ref<[Date, Date]>([new Date(), new Date()]); //
const isFee = defineModel<boolean>("isFee");
const props = defineProps({
inputfilter: String,
inputvisible: Array,
@ -393,6 +394,20 @@ async function clickCandidateList() {
});
}
async function onCheckShowExaminfo() {
try {
showLoader();
await http.post(config.API.checkShowExaminfo, {
examId: examId.value,
});
await props.fetchData();
} catch (error) {
messageError($q, error);
} finally {
hideLoader();
}
}
// Pagination - page & change page & get new data
const currentPage = ref<number>(1);
watch(
@ -461,7 +476,7 @@ watch(
</div>
</div>
</q-card>
<div class="col-12 row q-py-sm items-center q-col-gutter-sm">
<div class="col-xs-12 col-sm-3" v-show="!statusPayment">
<q-select
@ -479,7 +494,7 @@ watch(
v-if="optionsFilter != undefined && optionsFilter.length > 0"
/>
</div>
<div>
<div v-if="isFee">
<q-btn
v-if="checkPermission($route)?.attrIsUpdate"
size="md"
@ -495,6 +510,21 @@ watch(
<q-tooltip>ตรวจสอบขอม/ไดบใบสมครแล</q-tooltip>
</q-btn>
</div>
<div>
<q-btn
v-if="checkPermission($route)?.attrIsUpdate"
size="md"
icon="mdi-eye-check"
round
flat
color="info"
@click="onCheckShowExaminfo"
>
<q-tooltip
>เปดใหดาวนโหลดใบสมคร แสดงสถานทสอบ และเลขประจำตวสอบ</q-tooltip
>
</q-btn>
</div>
<div>
<q-btn icon="mdi-download" round color="green-6" flat>
<q-tooltip>ดาวนโหลดไฟล</q-tooltip>
@ -623,7 +653,10 @@ watch(
</template>
<template v-slot:header="props">
<q-tr :props="props">
<q-th auto-width v-if="checkPermission($route)?.attrIsUpdate">
<q-th
auto-width
v-if="checkPermission($route)?.attrIsUpdate && isFee"
>
<q-checkbox v-model="props.selected" />
</q-th>
<q-th auto-width v-if="boss == true" />