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" />

View file

@ -44,6 +44,8 @@ interface Information {
statusId: string | null;
knowledge: string | null;
profileImg: string | null;
prefixName: string | null;
religionName: string | null;
}
interface Family {
@ -80,6 +82,7 @@ interface Occupation {
interface Contact {
contactPrefixId: string | null;
contactPrefixName: string | null;
contactFirstname: string | null;
contactLastname: string | null;
contactRelations: string | null;
@ -208,6 +211,8 @@ const defaultInformation = ref<Information>({
provinceId: null,
statusId: null,
profileImg: null,
religionName: null,
prefixName: null,
});
const defaultFamily = ref<Family>({
@ -248,6 +253,7 @@ const defaultContact = ref<Contact>({
contactLastname: null,
contactRelations: null,
contactTel: null,
contactPrefixName: null,
});
const defaultEducation = ref<Education>({

View file

@ -171,7 +171,7 @@ async function clickSave() {
showLoader();
await http
.post(config.API.candidateId(candidateId.value), {
prefixId: defaultInformation.value.prefixId,
// prefixId: defaultInformation.value.prefixId,
lastName: defaultInformation.value.lastname,
dateOfBirth:
defaultInformation.value.birthDate == null
@ -181,7 +181,7 @@ async function clickSave() {
),
citizenId: defaultInformation.value.cardid,
firstName: defaultInformation.value.firstname,
religionId: defaultInformation.value.religionId,
// religionId: defaultInformation.value.religionId,
nationality: defaultInformation.value.nationality,
email: defaultInformation.value.email,
mobilePhone: defaultInformation.value.phone,
@ -236,8 +236,8 @@ async function clickSave() {
defaultEducation.value.educationScores,
educationLevelHighId:
defaultEducation.value.educationLevelHighId,
contactPrefixId:
defaultContact.value.contactPrefixId,
// contactPrefixId:
// defaultContact.value.contactPrefixId,
contactFirstname:
defaultContact.value.contactFirstname,
contactLastname:
@ -245,6 +245,12 @@ async function clickSave() {
contactRelations:
defaultContact.value.contactRelations,
contactTel: defaultContact.value.contactTel,
contactPrefixName:
defaultContact.value.contactPrefixName,
prefixName: defaultInformation.value.prefix,
religionName:
defaultInformation.value.religionName,
})
.then(async () => {
success($q, "บันทึกข้อมูลส่วนตัวสำเร็จ");

View file

@ -1302,13 +1302,10 @@ onMounted(async () => {
/>
</q-td>
<q-td
key="highDegree"
:props="props"
class="q-col-gutter-sm"
>
<q-td key="highDegree" :props="props" class="q-col-gutter-sm">
<div class="col-12">
<q-radio
dense
v-model="props.row.highDegree"
label="ประเภททั่วไป"
color="teal"
@ -1324,6 +1321,7 @@ onMounted(async () => {
</div>
<div class="col-12">
<q-radio
dense
v-model="props.row.highDegree"
label="ประเภทวิชาการ"
color="teal"
@ -1405,13 +1403,10 @@ onMounted(async () => {
</template>
</selector>
</q-td>
<q-td
key="educational"
:props="props"
class="q-col-gutter-sm"
>
<q-td key="educational" :props="props" class="q-col-gutter-sm">
<div class="col-12">
<q-radio
dense
v-model="props.row.educationLevel"
label="วุฒิปริญญาตรี"
color="teal"
@ -1421,6 +1416,7 @@ onMounted(async () => {
</div>
<div class="col-12">
<q-radio
dense
v-model="props.row.educationLevel"
label="ต่ำกว่าปริญญาตรี"
color="teal"

View file

@ -32,6 +32,7 @@ const yearly = ref<number | null>(null);
const examId = ref<string>(route.params.examId.toString());
const visible = ref<boolean>(false); // card
const dataNum = ref<DataNumObject[]>([]); //
const isFee = ref<boolean>(false);
const rows = ref<any[]>([]);
const visibleColumns = ref<String[]>([
"no",
@ -279,6 +280,7 @@ async function fetchData(loading: boolean = true) {
position: `${r.positionName}${r.positionLevelName}`,
positionLevel: r.positionLevelName,
check: false,
isShowExamInfo: r.isShowExamInfo,
});
});
}
@ -303,6 +305,7 @@ async function fetchPeriodExam() {
yearly.value = data.year;
statusPayment.value = data.status;
setSeat.value = data.setSeat;
isFee.value = data.fee === 0 ? false : true;
})
.catch((e) => {
messageError($q, e);
@ -489,10 +492,14 @@ onMounted(async () => {
:page="page"
@update:change-page="changePage"
:max-page="maxPage"
:is-fee="isFee"
>
<template #columns="props">
<q-tr :props="props" class="cursor-pointer">
<q-td auto-width v-if="checkPermission($route)?.attrIsUpdate">
<q-td
auto-width
v-if="checkPermission($route)?.attrIsUpdate && isFee"
>
<q-checkbox v-model="props.selected" />
</q-td>
<q-td