hrms-bangkok/hrms-recruit
7
0
Fork 0
Code Issues Pull requests Projects Releases Packages 1 Wiki Activity Actions

แยกปุ่มอัพโหลด

Browse source
This commit is contained in:
Kittapath 2023-03-30 13:42:08 +07:00
parent ccc5efa421
commit abe8e9186c
11 changed files with 809 additions and 585 deletions
Download patch file Download diff file Expand all files Collapse all files

1
src/api/exam/api.candidate.ts
View file

@ -14,5 +14,6 @@ export default {
candidatePayment: (examId: string) => `${candidate}payment/${examId}`,
candidateStatus: (examId: string) => `${candidate}status/${examId}`,
periodExamId: (examId: string) => `${periodExam}${examId}`,
candidateId: (examId: string) => `${candidate}${examId}`,
candidate
}

233
src/modules/01_exam/components/ExamForm.vue
View file

@ -1,87 +1,32 @@
<!-- step กรอกข้อมูล -->
<template>
<div>
<Profile :loader="loader" v-model:statusEdit="statusEdit" :status="status" />
<!-- <q-splitter v-model="splitterModel" style="height: 450px">
<template v-slot:before>
<q-tab-panels
v-model="tab"
animated
vertical
transition-prev="jump-up"
transition-next="jump-up"
>
ข้อมูลส่วนบุคคล
<q-tab-panel name="profile">
<Profile :loader="loader" v-model:statusEdit="statusEdit" :status="status" />
</q-tab-panel>
ประวัติการศีกษา
<q-tab-panel name="education">
<Education :loader="loader" v-model:statusEdit="statusEdit" :status="status" />
</q-tab-panel>
ประวัติการทำงาน/ฝึกงาน
<q-tab-panel name="career">
<Career :loader="loader" v-model:statusEdit="statusEdit" :status="status" />
</q-tab-panel>
ไฟล์
<q-tab-panel name="document">
<Document :loader="loader" v-model:statusEdit="statusEdit" :status="status" />
</q-tab-panel>
</q-tab-panels>
</template>
<template v-slot:after>
<q-tabs v-model="tab" vertical class="text-teal">
<q-tab name="profile" label="ข้อมูลส่วนบุคคล" :disable="statusEdit" />
<q-tab name="education" label="ประวัติการศีกษา" :disable="statusEdit" />
<q-tab name="career" label="ประวัติการทำงาน/ฝึกงาน" :disable="statusEdit" />
<q-tab name="document" label="อัปโหลดเอกสาร" :disable="statusEdit" />
</q-tabs>
</template>
</q-splitter> -->
<Profile
:loader="loader"
v-model:statusEdit="statusEdit"
:status="status"
:btnSave="btnSave"
v-model:formInformation="formInformation"
v-model:formAddress="formAddress"
v-model:formFamily="formFamily"
v-model:formOccupation="formOccupation"
/>
<div class="text-center q-pt-sm">
<q-checkbox
v-model="acceptTermOfUse"
:disable="(status !== 'register' && status !== 'rejectRegister') || statusEdit"
label="ข้าพเจ้ารับรองว่า ข้าพเจ้ามีคุณสมบัติครบถ้วนตามประกาศรับสมัคร ข้อความข้างต้นตรงตามความจริงทุกประการ"
/>
<!-- v-if="tab == 'document'" -->
</div>
<div class="row justify-center q-pa-md">
<!-- <q-btn
color="primary"
class="q-ml-md"
label="กลับ"
@click="clickPreview(tab)"
v-if="
(status === 'register' || status === 'rejectRegister') &&
(tab == 'education' || tab == 'career' || tab == 'document')
"
icon="mdi-chevron-left"
:disable="statusEdit"
/>
<q-btn
color="primary"
class="q-ml-md"
label="ต่อไป"
@click="clickNext(tab)"
v-if="
(status === 'register' || status === 'rejectRegister') &&
(tab == 'profile' || tab == 'education' || tab == 'career')
"
icon-right="mdi-chevron-right"
:disable="statusEdit"
/> -->
<q-btn
color="blue"
class="q-ml-md"
label="บันทึกข้อมูล"
outline
icon="mdi-content-save"
@click="okModalConfirm"
@click="saveData"
v-if="status === 'register' || status === 'rejectRegister'"
:disable="!acceptTermOfUse || statusEdit"
/>
@ -105,10 +50,13 @@ import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
import Profile from '@/modules/01_exam/components/Form/Profile.vue'
import Education from '@/modules/01_exam/components/Form/Education.vue'
import Career from '@/modules/01_exam/components/Form/Career.vue'
import Document from '@/modules/01_exam/components/Form/Document.vue'
import { useRoute } from 'vue-router'
import {
defaultInformation,
defaultOccupation,
defaultAddress,
defaultFamily
} from '@/modules/01_exam/interface/index/Main'
const props = defineProps({
fetchStep: {
@ -123,14 +71,17 @@ const props = defineProps({
const $q = useQuasar()
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
const { modalConfirm, modalError, success } = mixin
// const tab = ref<string>('profile')
// const splitterModel = ref<number>(90)
const { modalConfirm, modalError, success, dateToISO } = mixin
const loader = ref<boolean>(false)
const statusEdit = ref<boolean>(false)
const acceptTermOfUse = ref<boolean>(false)
const route = useRoute()
const examId = ref<string>(route.params.id.toString())
const btnSave = ref<boolean>(false)
const formInformation = ref<any>({})
const formAddress = ref<any>({})
const formFamily = ref<any>({})
const formOccupation = ref<any>({})
onMounted(async () => {
if (props.status !== 'register') {
@ -166,35 +117,115 @@ const saveForm = async () => {
})
}
// const clickPreview = (val: string) => {
// switch (val) {
// case 'profile':
// return (tab.value = 'profile')
// case 'education':
// return (tab.value = 'profile')
// case 'career':
// return (tab.value = 'education')
// case 'document':
// return (tab.value = 'career')
// default:
// return (tab.value = 'profile')
// }
// }
// const clickNext = (val: string) => {
// switch (val) {
// case 'profile':
// return (tab.value = 'education')
// case 'education':
// return (tab.value = 'career')
// case 'career':
// return (tab.value = 'document')
// case 'document':
// return (tab.value = 'profile')
// default:
// return (tab.value = 'profile')
// }
// }
const saveData = async () => {
await formInformation.value.validate().then(async (suc: boolean) => {
if (suc) {
await formAddress.value.validate().then(async (suc: boolean) => {
if (suc) {
await formFamily.value.validate().then(async (suc: boolean) => {
if (suc) {
await formOccupation.value.validate().then(async (suc: boolean) => {
if (suc) {
const type = ref<string | null>('')
if (defaultOccupation.value.status == 'official')
type.value = defaultOccupation.value.official
if (defaultOccupation.value.status == 'personnel')
type.value = defaultOccupation.value.personnel
if (defaultOccupation.value.status == 'officialsOther')
type.value = defaultOccupation.value.officialsOther
if (defaultOccupation.value.status == 'employee')
type.value = defaultOccupation.value.employee
if (defaultOccupation.value.status == 'other')
type.value = defaultOccupation.value.other
loader.value = true
await http
.post(config.API.candidateId(examId.value), {
prefixId: defaultInformation.value.prefixId,
lastName: defaultInformation.value.lastname,
citizenProvinceId: defaultInformation.value.provinceId,
citizenDistrictId: defaultInformation.value.districtId,
dateOfBirth:
defaultInformation.value.birthDate == null
? null
: dateToISO(defaultInformation.value.birthDate),
citizenDate:
defaultInformation.value.cardIdDate == null
? null
: dateToISO(defaultInformation.value.cardIdDate),
citizenId: defaultInformation.value.cardid,
firstName: defaultInformation.value.firstname,
relationshipId: defaultInformation.value.relationship,
nationality: defaultInformation.value.nationality,
email: defaultInformation.value.email,
mobilePhone: defaultInformation.value.phone,
telephone: defaultInformation.value.tel,
knowledge: defaultInformation.value.knowledge,
occupationType: defaultOccupation.value.status,
occupationCompany: defaultOccupation.value.company,
occupationDepartment: defaultOccupation.value.department,
occupationEmail: defaultOccupation.value.email,
occupationTelephone: defaultOccupation.value.tel,
occupationPosition: type.value,
registAddress: defaultAddress.value.address,
currentAddress: defaultAddress.value.addressC,
registProvinceId: defaultAddress.value.provinceId,
currentProvinceId: defaultAddress.value.provinceIdC,
registDistrictId: defaultAddress.value.districtId,
currentDistrictId: defaultAddress.value.districtIdC,
registSubDistrictId: defaultAddress.value.subdistrictId,
currentSubDistrictId: defaultAddress.value.subdistrictIdC,
registZipCode: defaultAddress.value.code,
currentZipCode: defaultAddress.value.codeC,
registSame:
defaultAddress.value.same == '1'
? true
: defaultAddress.value.same == '0'
? false
: null,
marryPrefixId: defaultFamily.value.prefixIdC,
marryFirstName: defaultFamily.value.firstnameC,
marryLastName: defaultFamily.value.lastnameC,
marryOccupation: defaultFamily.value.occupationC,
marryNationality: defaultFamily.value.nationalityC,
fatherPrefixId: defaultFamily.value.prefixIdM,
fatherFirstName: defaultFamily.value.firstnameM,
fatherLastName: defaultFamily.value.lastnameM,
fatherOccupation: defaultFamily.value.occupationM,
fatherNationality: defaultFamily.value.nationalityM,
motherPrefixId: defaultFamily.value.prefixIdF,
motherFirstName: defaultFamily.value.firstnameF,
motherLastName: defaultFamily.value.lastnameF,
motherOccupation: defaultFamily.value.occupationF,
motherNationality: defaultFamily.value.nationalityF,
marry:
defaultFamily.value.same == '1'
? true
: defaultFamily.value.same == '0'
? false
: null
})
.then(() => {
success($q, 'บันทึกข้อมูลส่วนตัวสำเร็จ')
})
.catch(() => {
// modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message
// statusCode.value = e.response.data.status
})
.finally(async () => {
loader.value = false
await props.fetchStep()
})
}
})
}
})
}
})
}
})
}
</script>
<style lang="scss" scoped></style>

534
src/modules/01_exam/components/Form/Address.vue
View file

@ -1,212 +1,212 @@
<!-- card ข้อมูลที่อยู่ -->
<template>
<HeaderTop
v-model:edit="edit"
header="ข้อมูลที่อยู่"
icon="mdi-map-marker"
:save="saveData"
:addData="true"
:editOnly="false"
:cancel="cancelData"
:editData="status == 'register' || status == 'rejectRegister'"
:disable="statusEdit"
/>
<!-- :changeBtn="changeBtn" -->
<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">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
type="textarea"
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="addressData.address"
:rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ตามทะเบียนบ้าน'}`]"
:label="`${'ที่อยู่ตามทะเบียนบ้าน'}`"
/>
<!-- :filled="(status == 'register' || status == 'rejectRegister')" -->
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="addressData.provinceId"
emit-value
map-options
option-label="name"
:options="provinceOptions"
option-value="id"
:label="`${'จังหวัด'}`"
@update:model-value="(value) => selectProvince(value, '1')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="addressData.districtId"
emit-value
map-options
option-label="name"
:options="districtOptions"
option-value="id"
:label="`${'เขต / อำเภอ'}`"
@update:model-value="(value) => selectDistrict(value, '1')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก ตำบล / แขวง'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="addressData.subdistrictId"
emit-value
map-options
option-label="name"
:options="subdistrictOptions"
option-value="id"
:label="`${'ตำบล / แขวง'}`"
@update:model-value="(value) => selectSubDistrict(value, '1')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
dense
lazy-rules
readonly
borderless
v-model="addressData.code"
:style="!(status == 'register' || status == 'rejectRegister') ? '' : 'padding:0 12px;'"
:label="`${'รหัสไปรษณีย์'}`"
/>
</div>
<div class="col-xs-12 q-gutter-sm items-center flex q-mb-sm">
<label class="text-bold">ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน</label>
<q-radio
v-model="addressData.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="1"
label="ใช่"
dense
:disable="!(status == 'register' || status == 'rejectRegister')"
/>
<q-radio
v-model="addressData.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="0"
label="ไม่"
dense
:disable="!(status == 'register' || status == 'rejectRegister')"
/>
</div>
<div class="col-xs-12" v-if="addressData.same == '0'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
type="textarea"
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="addressData.addressC"
:rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ปัจจุบัน'}`]"
:label="`${'ที่อยู่ปัจจุบัน'}`"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="addressData.provinceIdC"
emit-value
map-options
option-label="name"
:options="provinceOptions"
option-value="id"
:label="`${'จังหวัด'}`"
@update:model-value="(value) => selectProvince(value, '2')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="addressData.districtIdC"
emit-value
map-options
option-label="name"
:options="districtCOptions"
option-value="id"
:label="`${'เขต / อำเภอ'}`"
@update:model-value="(value) => selectDistrict(value, '2')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก ตำบล / แขวง'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="addressData.subdistrictIdC"
emit-value
map-options
option-label="name"
:options="subdistrictCOptions"
option-value="id"
:label="`${'ตำบล / แขวง'}`"
@update:model-value="(value) => selectSubDistrict(value, '2')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
dense
lazy-rules
readonly
borderless
v-model="addressData.codeC"
:style="!(status == 'register' || status == 'rejectRegister') ? '' : 'padding:0 12px;'"
:label="`${'รหัสไปรษณีย์'}`"
/>
</div>
<HeaderTop
v-model:edit="edit"
header="ข้อมูลที่อยู่"
icon="mdi-map-marker"
:save="saveData"
:addData="true"
:editOnly="false"
:cancel="cancelData"
:editData="false"
:disable="statusEdit"
/>
<!-- :changeBtn="changeBtn" -->
<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">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
type="textarea"
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="defaultAddress.address"
:rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ตามทะเบียนบ้าน'}`]"
:label="`${'ที่อยู่ตามทะเบียนบ้าน'}`"
/>
<!-- :filled="(status == 'register' || status == 'rejectRegister')" -->
</div>
</q-form>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="defaultAddress.provinceId"
emit-value
map-options
option-label="name"
:options="provinceOptions"
option-value="id"
:label="`${'จังหวัด'}`"
@update:model-value="(value) => selectProvince(value, '1')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="defaultAddress.districtId"
emit-value
map-options
option-label="name"
:options="districtOptions"
option-value="id"
:label="`${'เขต / อำเภอ'}`"
@update:model-value="(value) => selectDistrict(value, '1')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก ตำบล / แขวง'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="defaultAddress.subdistrictId"
emit-value
map-options
option-label="name"
:options="subdistrictOptions"
option-value="id"
:label="`${'ตำบล / แขวง'}`"
@update:model-value="(value) => selectSubDistrict(value, '1')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
dense
lazy-rules
readonly
borderless
v-model="defaultAddress.code"
:style="!(status == 'register' || status == 'rejectRegister') ? '' : 'padding:0 12px;'"
:label="`${'รหัสไปรษณีย์'}`"
/>
</div>
<div class="col-xs-12 q-gutter-sm items-center flex q-mb-sm">
<label class="text-bold">ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน</label>
<q-radio
v-model="defaultAddress.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="1"
label="ใช่"
dense
:disable="!(status == 'register' || status == 'rejectRegister')"
/>
<q-radio
v-model="defaultAddress.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="0"
label="ไม่"
dense
:disable="!(status == 'register' || status == 'rejectRegister')"
/>
</div>
<div class="col-xs-12" v-if="defaultAddress.same == '0'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
type="textarea"
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="defaultAddress.addressC"
:rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ปัจจุบัน'}`]"
:label="`${'ที่อยู่ปัจจุบัน'}`"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="defaultAddress.provinceIdC"
emit-value
map-options
option-label="name"
:options="provinceOptions"
option-value="id"
:label="`${'จังหวัด'}`"
@update:model-value="(value) => selectProvince(value, '2')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="defaultAddress.districtIdC"
emit-value
map-options
option-label="name"
:options="districtCOptions"
option-value="id"
:label="`${'เขต / อำเภอ'}`"
@update:model-value="(value) => selectDistrict(value, '2')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:rules="[(val) => !!val || `${'กรุณาเลือก ตำบล / แขวง'}`]"
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="defaultAddress.subdistrictIdC"
emit-value
map-options
option-label="name"
:options="subdistrictCOptions"
option-value="id"
:label="`${'ตำบล / แขวง'}`"
@update:model-value="(value) => selectSubDistrict(value, '2')"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultAddress.same == '0'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
dense
lazy-rules
readonly
borderless
v-model="defaultAddress.codeC"
:style="!(status == 'register' || status == 'rejectRegister') ? '' : 'padding:0 12px;'"
:label="`${'รหัสไปรษณีย์'}`"
/>
</div>
</div>
</q-form>
<!-- <q-dialog :model-value="modalConsend" persistent>
<q-card style="min-width: 800px">
<Conference :ok="consendOk" :close="consenClose" />
@ -214,15 +214,15 @@
</q-dialog> -->
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useQuasar } from 'quasar'
import { ref, onMounted, watch } from 'vue'
import { QForm, useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import type { PropType } from 'vue'
import http from '@/plugins/http'
import config from '@/app.config'
import { useExamDataStore } from '@/modules/01_exam/store'
import type { Address, DataOption } from '@/modules/01_exam/interface/index/Main'
import { defaultAddress } from '@/modules/01_exam/interface/index/Main'
import { defaultAddress, changeData } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue'
import { useRoute } from 'vue-router'
@ -244,6 +244,14 @@ const props = defineProps({
status: {
type: String,
required: true
},
btnSave: {
type: Boolean,
required: true
},
form: {
type: Object,
required: true
}
})
@ -254,25 +262,38 @@ const { success } = mixin
const route = useRoute()
const examId = ref<string>(route.params.id.toString())
const edit = ref<boolean>(true)
const addressData = ref<Address>(defaultAddress)
const myform = ref<any>()
// const modalConsend = ref<boolean>(false)
// const defaultAddress = ref<Address>(defaultAddress)
const myform = ref<any>({})
const loader = ref<boolean>(false)
const districtOptions = ref<DataOption[]>([])
const districtCOptions = ref<DataOption[]>([])
const subdistrictOptions = ref<DataOption[]>([])
const subdistrictCOptions = ref<DataOption[]>([])
const emit = defineEmits(['update:statusEdit'])
const emit = defineEmits(['update:statusEdit', 'update:form'])
watch(props, async (count: any, prevCount: any) => {
// if (props.btnSave == true) await saveData()
})
watch(myform, async (count: any, prevCount: any) => {
emit('update:form', count)
})
watch(defaultAddress, async (count: Address, prevCount: Address) => {
await changeData('address', count)
})
onMounted(async () => {
await fetchData()
if (addressData.value.provinceId != null) await fetchDistrict(addressData.value.provinceId, '1')
if (addressData.value.provinceIdC != null) await fetchDistrict(addressData.value.provinceIdC, '2')
if (addressData.value.districtId != null)
await fetchSubDistrict(addressData.value.districtId, '1')
if (addressData.value.districtIdC != null)
await fetchSubDistrict(addressData.value.districtIdC, '2')
if (defaultAddress.value.provinceId != null)
await fetchDistrict(defaultAddress.value.provinceId, '1')
if (defaultAddress.value.provinceIdC != null)
await fetchDistrict(defaultAddress.value.provinceIdC, '2')
if (defaultAddress.value.districtId != null)
await fetchSubDistrict(defaultAddress.value.districtId, '1')
if (defaultAddress.value.districtIdC != null)
await fetchSubDistrict(defaultAddress.value.districtIdC, '2')
})
const fetchData = async () => {
@ -280,17 +301,18 @@ const fetchData = async () => {
.get(config.API.candidateAddress(examId.value))
.then((res) => {
const data = res.data.result
addressData.value.address = data.registAddress
addressData.value.addressC = data.currentAddress
addressData.value.provinceId = data.registProvinceId
addressData.value.provinceIdC = data.currentProvinceId
addressData.value.districtId = data.registDistrictId
addressData.value.districtIdC = data.currentDistrictId
addressData.value.subdistrictId = data.registSubDistrictId
addressData.value.subdistrictIdC = data.currentSubDistrictId
addressData.value.code = data.registZipCode
addressData.value.codeC = data.currentZipCode
addressData.value.same = data.registSame == true ? '1' : data.registSame == false ? '0' : null
defaultAddress.value.address = data.registAddress
defaultAddress.value.addressC = data.currentAddress
defaultAddress.value.provinceId = data.registProvinceId
defaultAddress.value.provinceIdC = data.currentProvinceId
defaultAddress.value.districtId = data.registDistrictId
defaultAddress.value.districtIdC = data.currentDistrictId
defaultAddress.value.subdistrictId = data.registSubDistrictId
defaultAddress.value.subdistrictIdC = data.currentSubDistrictId
defaultAddress.value.code = data.registZipCode
defaultAddress.value.codeC = data.currentZipCode
defaultAddress.value.same =
data.registSame == true ? '1' : data.registSame == false ? '0' : null
})
.catch(() => {})
.finally(() => {
@ -305,21 +327,25 @@ const saveData = async () => {
loader.value = true
await http
.post(config.API.candidateAddress(examId.value), {
registAddress: addressData.value.address,
currentAddress: addressData.value.addressC,
registProvinceId: addressData.value.provinceId,
currentProvinceId: addressData.value.provinceIdC,
registDistrictId: addressData.value.districtId,
currentDistrictId: addressData.value.districtIdC,
registSubDistrictId: addressData.value.subdistrictId,
currentSubDistrictId: addressData.value.subdistrictIdC,
registZipCode: addressData.value.code,
currentZipCode: addressData.value.codeC,
registAddress: defaultAddress.value.address,
currentAddress: defaultAddress.value.addressC,
registProvinceId: defaultAddress.value.provinceId,
currentProvinceId: defaultAddress.value.provinceIdC,
registDistrictId: defaultAddress.value.districtId,
currentDistrictId: defaultAddress.value.districtIdC,
registSubDistrictId: defaultAddress.value.subdistrictId,
currentSubDistrictId: defaultAddress.value.subdistrictIdC,
registZipCode: defaultAddress.value.code,
currentZipCode: defaultAddress.value.codeC,
registSame:
addressData.value.same == '1' ? true : addressData.value.same == '0' ? false : null
defaultAddress.value.same == '1'
? true
: defaultAddress.value.same == '0'
? false
: null
})
.then(() => {
success($q, 'บันทึกข้อมูลที่อยู่สำเร็จ')
// success($q, 'บันทึกข้อมูลที่อยู่สำเร็จ')
// edit.value = false
emit('update:statusEdit', false)
})
@ -355,13 +381,13 @@ const saveData = async () => {
const selectProvince = (e: string, name: string) => {
if (name == '1') {
addressData.value.districtId = ''
addressData.value.subdistrictId = ''
addressData.value.code = null
defaultAddress.value.districtId = ''
defaultAddress.value.subdistrictId = ''
defaultAddress.value.code = null
} else {
addressData.value.districtIdC = ''
addressData.value.subdistrictIdC = ''
addressData.value.codeC = null
defaultAddress.value.districtIdC = ''
defaultAddress.value.subdistrictIdC = ''
defaultAddress.value.codeC = null
}
myform.value.resetValidation()
fetchDistrict(e, name)
@ -369,11 +395,11 @@ const selectProvince = (e: string, name: string) => {
const selectDistrict = (e: string, name: string) => {
if (name == '1') {
addressData.value.subdistrictId = ''
addressData.value.code = null
defaultAddress.value.subdistrictId = ''
defaultAddress.value.code = null
} else {
addressData.value.subdistrictIdC = ''
addressData.value.codeC = null
defaultAddress.value.subdistrictIdC = ''
defaultAddress.value.codeC = null
}
myform.value.resetValidation()
fetchSubDistrict(e, name)
@ -383,11 +409,11 @@ const selectSubDistrict = (e: string, name: string) => {
if (name == '1') {
const findcode = subdistrictOptions.value.filter((r) => r.id == e)
const namecode = findcode.length > 0 ? findcode[0].zipCode : null
addressData.value.code = namecode
defaultAddress.value.code = namecode
} else {
const findcode = subdistrictCOptions.value.filter((r) => r.id == e)
const namecode = findcode.length > 0 ? findcode[0].zipCode : null
addressData.value.codeC = namecode
defaultAddress.value.codeC = namecode
}
}

13
src/modules/01_exam/components/Form/Career.vue
View file

@ -129,7 +129,11 @@
:model-value="dateThaiRange(duration)"
>
<template v-slot:prepend>
<q-icon name="mdi-calendar-outline" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="mdi-calendar-outline"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -192,7 +196,6 @@ import type { ResponseObject } from '@/modules/01_exam/interface/response/Career
import Table from '@/components/Table.vue'
import DialogHeader from '@/components/DialogHeader.vue'
import DialogFooter from '@/components/DialogFooter.vue'
import Conference from '@/modules/01_exam/components/Conference.vue'
import { useRoute } from 'vue-router'
const props = defineProps({
@ -212,6 +215,10 @@ const props = defineProps({
notiNoEdit: {
type: Function,
default: () => console.log('not function')
},
btnSave: {
type: Boolean,
required: true
}
})
@ -236,9 +243,7 @@ const rowIndex = ref<number>(0) //indexข้อมูลเดิมที่
const previous = ref<boolean>() //แสดงปุ่มดูข้อมูลก่อนหน้า
const next = ref<boolean>() //แสดงปุ่มดูข้อมูลต่อไป
const editRow = ref<boolean>(false) //เช็คมีการแก้ไขข้อมูล
const statusCode = ref<number>()
const checkValidate = ref<boolean>(false) //validate data ผ่านหรือไม่
// const modalConsend = ref<boolean>(false)
const route = useRoute()
const examId = ref<string>(route.params.id.toString())
const rows = ref<RequestItemsObject[]>([])

18
src/modules/01_exam/components/Form/Document.vue
View file

@ -50,15 +50,7 @@
<q-btn size="12px" flat dense round color="blue" icon="mdi-download-outline">
<q-tooltip>ดาวน์โหลด</q-tooltip>
</q-btn>
<q-btn
size="12px"
flat
dense
round
color="red"
icon="mdi-delete-outline"
v-if="edit"
>
<q-btn size="12px" flat dense round color="red" icon="mdi-delete-outline" v-if="edit">
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</div>
@ -88,6 +80,10 @@ const props = defineProps({
status: {
type: String,
required: true
},
btnSave: {
type: Boolean,
required: true
}
})
@ -109,6 +105,10 @@ const files = ref<any>([
])
const emit = defineEmits(['update:loader', 'update:statusEdit'])
// watch(props, async (count: any, prevCount: any) => {
// if (props.btnSave == true) await saveData()
// })
watch(edit, (count: boolean, prevCount: boolean) => {
emit('update:statusEdit', count)
})

17
src/modules/01_exam/components/Form/Education.vue
View file

@ -145,7 +145,11 @@
:model-value="dateThaiRange(duration)"
>
<template v-slot:prepend>
<q-icon name="mdi-calendar-outline" class="cursor-pointer" style="color: var(--q-primary)">
<q-icon
name="mdi-calendar-outline"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template>
</q-input>
@ -194,7 +198,6 @@ import type { ResponseObject } from '@/modules/01_exam/interface/response/Educat
import Table from '@/components/Table.vue'
import DialogHeader from '@/components/DialogHeader.vue'
import DialogFooter from '@/components/DialogFooter.vue'
import Conference from '@/modules/01_exam/components/Conference.vue'
import { useRoute } from 'vue-router'
const props = defineProps({
@ -214,6 +217,10 @@ const props = defineProps({
notiNoEdit: {
type: Function,
default: () => console.log('not function')
},
btnSave: {
type: Boolean,
required: true
}
})
@ -240,9 +247,7 @@ const rowIndex = ref<number>(0) //indexข้อมูลเดิมที่
const previous = ref<boolean>() //แสดงปุ่มดูข้อมูลก่อนหน้า
const next = ref<boolean>() //แสดงปุ่มดูข้อมูลต่อไป
const editRow = ref<boolean>(false) //เช็คมีการแก้ไขข้อมูล
const statusCode = ref<number>()
const checkValidate = ref<boolean>(false) //validate data ผ่านหรือไม่
// const modalConsend = ref<boolean>(false)
const rows = ref<RequestItemsObject[]>([])
const route = useRoute()
const examId = ref<string>(route.params.id.toString())
@ -304,6 +309,10 @@ const columns = ref<Columns>([
}
])
// watch(props, async (count: any, prevCount: any) => {
// if (props.btnSave == true) await saveData()
// })
watch(loader, (count: boolean, prevCount: boolean) => {
emit('update:loader', count)
})

153
src/modules/01_exam/components/Form/Family.vue
View file

@ -8,7 +8,7 @@
:addData="true"
:editOnly="false"
:cancel="cancelData"
:editData="status == 'register' || status == 'rejectRegister'"
:editData="false"
:disable="statusEdit"
/>
<!-- :changeBtn="changeBtn" -->
@ -17,7 +17,7 @@
<div class="col-xs-12 q-gutter-sm items-center flex q-mb-sm">
<label class="text-weight-bold">• คู่สมรส</label>
<q-radio
v-model="familyData.same"
v-model="defaultFamily.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="1"
@ -27,7 +27,7 @@
@update:model-value="selectRadio"
/>
<q-radio
v-model="familyData.same"
v-model="defaultFamily.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="0"
@ -37,7 +37,7 @@
@update:model-value="selectRadio"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2" v-if="familyData.same == '1'">
<div class="col-xs-12 col-sm-2 col-md-2" v-if="defaultFamily.same == '1'">
<q-select
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
@ -46,7 +46,7 @@
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="familyData.prefixIdC"
v-model="defaultFamily.prefixIdC"
emit-value
map-options
option-label="name"
@ -56,7 +56,7 @@
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="familyData.same == '1'">
<div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultFamily.same == '1'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
@ -64,12 +64,12 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.firstnameC"
v-model="defaultFamily.firstnameC"
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3" v-if="familyData.same == '1'">
<div class="col-xs-12 col-sm-3 col-md-3" v-if="defaultFamily.same == '1'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
@ -77,12 +77,12 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.lastnameC"
v-model="defaultFamily.lastnameC"
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2" v-if="familyData.same == '1'">
<div class="col-xs-12 col-sm-2 col-md-2" v-if="defaultFamily.same == '1'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
@ -90,12 +90,12 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.occupationC"
v-model="defaultFamily.occupationC"
:rules="[(val) => !!val || `${'กรุณากรอก อาชีพ'}`]"
:label="`${'อาชีพ'}`"
/>
</div>
<div class="col-xs-12 col-sm-2 col-md-2" v-if="familyData.same == '1'">
<div class="col-xs-12 col-sm-2 col-md-2" v-if="defaultFamily.same == '1'">
<q-input
:class="getClass(status == 'register' || status == 'rejectRegister')"
:outlined="status == 'register' || status == 'rejectRegister'"
@ -103,7 +103,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.nationalityC"
v-model="defaultFamily.nationalityC"
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
:label="`${'สัญชาติ'}`"
/>
@ -119,7 +119,7 @@
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="familyData.prefixIdM"
v-model="defaultFamily.prefixIdM"
emit-value
map-options
option-label="name"
@ -137,7 +137,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.firstnameM"
v-model="defaultFamily.firstnameM"
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
@ -150,7 +150,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.lastnameM"
v-model="defaultFamily.lastnameM"
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
@ -163,7 +163,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.occupationM"
v-model="defaultFamily.occupationM"
:rules="[(val) => !!val || `${'กรุณากรอก อาชีพ'}`]"
:label="`${'อาชีพ'}`"
/>
@ -176,7 +176,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.nationalityM"
v-model="defaultFamily.nationalityM"
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
:label="`${'สัญชาติ'}`"
/>
@ -192,7 +192,7 @@
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="familyData.prefixIdF"
v-model="defaultFamily.prefixIdF"
emit-value
map-options
option-label="name"
@ -209,7 +209,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.firstnameF"
v-model="defaultFamily.firstnameF"
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
@ -222,7 +222,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.lastnameF"
v-model="defaultFamily.lastnameF"
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
@ -235,7 +235,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.occupationF"
v-model="defaultFamily.occupationF"
:rules="[(val) => !!val || `${'กรุณากรอก อาชีพ'}`]"
:label="`${'อาชีพ'}`"
/>
@ -248,7 +248,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="familyData.nationalityF"
v-model="defaultFamily.nationalityF"
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
:label="`${'สัญชาติ'}`"
/>
@ -263,16 +263,15 @@
</template>
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue'
import { useQuasar } from 'quasar'
import { QForm, useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import type { PropType } from 'vue'
import http from '@/plugins/http'
import config from '@/app.config'
import { useExamDataStore } from '@/modules/01_exam/store'
import type { Family, DataOption } from '@/modules/01_exam/interface/index/Main'
import { defaultFamily } from '@/modules/01_exam/interface/index/Main'
import { defaultFamily, changeData } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue'
import Conference from '@/modules/01_exam/components/Conference.vue'
import { useRoute } from 'vue-router'
const props = defineProps({
@ -291,6 +290,14 @@ const props = defineProps({
status: {
type: String,
required: true
},
btnSave: {
type: Boolean,
required: true
},
form: {
type: Object,
required: true
}
})
@ -299,14 +306,25 @@ const mixin = useCounterMixin()
const store = useExamDataStore()
const { success } = mixin
const edit = ref<boolean>(true)
const myform = ref<any>()
const familyData = ref<Family>(defaultFamily)
// const modalConsend = ref<boolean>(false)
const myform = ref<any>({})
// const defaultFamily = ref<Family>(defaultFamily)
const route = useRoute()
const examId = ref<string>(route.params.id.toString())
const loader = ref<boolean>(false)
const emit = defineEmits(['update:statusEdit'])
const emit = defineEmits(['update:statusEdit', 'update:form'])
watch(props, async (count: any, prevCount: any) => {
// if (props.btnSave == true) await saveData()
})
watch(myform, async (count: any, prevCount: any) => {
emit('update:form', count)
})
watch(defaultFamily, async (count: Family, prevCount: Family) => {
await changeData('family', count)
})
onMounted(async () => {
await fetchData()
@ -318,22 +336,22 @@ const fetchData = async () => {
.get(config.API.candidateFamily(examId.value))
.then((res) => {
const data = res.data.result
familyData.value.prefixIdC = data.marryPrefixId
familyData.value.firstnameC = data.marryFirstName
familyData.value.lastnameC = data.marryLastName
familyData.value.occupationC = data.marryOccupation
familyData.value.nationalityC = data.marryNationality
familyData.value.prefixIdM = data.fatherPrefixId
familyData.value.firstnameM = data.fatherFirstName
familyData.value.lastnameM = data.fatherLastName
familyData.value.occupationM = data.fatherOccupation
familyData.value.nationalityM = data.fatherNationality
familyData.value.prefixIdF = data.motherPrefixId
familyData.value.firstnameF = data.motherFirstName
familyData.value.lastnameF = data.motherLastName
familyData.value.occupationF = data.motherOccupation
familyData.value.nationalityF = data.motherNationality
familyData.value.same = data.marry == true ? '1' : data.marry == false ? '0' : null
defaultFamily.value.prefixIdC = data.marryPrefixId
defaultFamily.value.firstnameC = data.marryFirstName
defaultFamily.value.lastnameC = data.marryLastName
defaultFamily.value.occupationC = data.marryOccupation
defaultFamily.value.nationalityC = data.marryNationality
defaultFamily.value.prefixIdM = data.fatherPrefixId
defaultFamily.value.firstnameM = data.fatherFirstName
defaultFamily.value.lastnameM = data.fatherLastName
defaultFamily.value.occupationM = data.fatherOccupation
defaultFamily.value.nationalityM = data.fatherNationality
defaultFamily.value.prefixIdF = data.motherPrefixId
defaultFamily.value.firstnameF = data.motherFirstName
defaultFamily.value.lastnameF = data.motherLastName
defaultFamily.value.occupationF = data.motherOccupation
defaultFamily.value.nationalityF = data.motherNationality
defaultFamily.value.same = data.marry == true ? '1' : data.marry == false ? '0' : null
})
.catch(() => {})
.finally(() => {
@ -348,25 +366,26 @@ const saveData = async () => {
loader.value = true
await http
.post(config.API.candidateFamily(examId.value), {
marryPrefixId: familyData.value.prefixIdC,
marryFirstName: familyData.value.firstnameC,
marryLastName: familyData.value.lastnameC,
marryOccupation: familyData.value.occupationC,
marryNationality: familyData.value.nationalityC,
fatherPrefixId: familyData.value.prefixIdM,
fatherFirstName: familyData.value.firstnameM,
fatherLastName: familyData.value.lastnameM,
fatherOccupation: familyData.value.occupationM,
fatherNationality: familyData.value.nationalityM,
motherPrefixId: familyData.value.prefixIdF,
motherFirstName: familyData.value.firstnameF,
motherLastName: familyData.value.lastnameF,
motherOccupation: familyData.value.occupationF,
motherNationality: familyData.value.nationalityF,
marry: familyData.value.same == '1' ? true : familyData.value.same == '0' ? false : null
marryPrefixId: defaultFamily.value.prefixIdC,
marryFirstName: defaultFamily.value.firstnameC,
marryLastName: defaultFamily.value.lastnameC,
marryOccupation: defaultFamily.value.occupationC,
marryNationality: defaultFamily.value.nationalityC,
fatherPrefixId: defaultFamily.value.prefixIdM,
fatherFirstName: defaultFamily.value.firstnameM,
fatherLastName: defaultFamily.value.lastnameM,
fatherOccupation: defaultFamily.value.occupationM,
fatherNationality: defaultFamily.value.nationalityM,
motherPrefixId: defaultFamily.value.prefixIdF,
motherFirstName: defaultFamily.value.firstnameF,
motherLastName: defaultFamily.value.lastnameF,
motherOccupation: defaultFamily.value.occupationF,
motherNationality: defaultFamily.value.nationalityF,
marry:
defaultFamily.value.same == '1' ? true : defaultFamily.value.same == '0' ? false : null
})
.then(() => {
success($q, 'บันทึกข้อมูลครอบครัวสำเร็จ')
// success($q, 'บันทึกข้อมูลครอบครัวสำเร็จ')
// edit.value = false
emit('update:statusEdit', false)
})
@ -402,10 +421,10 @@ const saveData = async () => {
const selectRadio = (e: boolean) => {
if (!e) {
familyData.value.prefixIdC = ''
familyData.value.firstnameC = ''
familyData.value.lastnameC = ''
familyData.value.occupationC = ''
defaultFamily.value.prefixIdC = ''
defaultFamily.value.firstnameC = ''
defaultFamily.value.lastnameC = ''
defaultFamily.value.occupationC = ''
}
}

155
src/modules/01_exam/components/Form/Information.vue
View file

@ -8,7 +8,7 @@
:addData="true"
:editOnly="false"
:cancel="cancelData"
:editData="status == 'register' || status == 'rejectRegister'"
:editData="false"
:disable="statusEdit"
/>
<!-- :changeBtn="changeBtn" -->
@ -23,7 +23,7 @@
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="informaData.prefixId"
v-model="defaultInformation.prefixId"
emit-value
map-options
option-label="name"
@ -40,7 +40,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.firstname"
v-model="defaultInformation.firstname"
:rules="[(val) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
@ -53,7 +53,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.lastname"
v-model="defaultInformation.lastname"
:rules="[(val) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
@ -66,14 +66,14 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.nationality"
v-model="defaultInformation.nationality"
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
:label="`${'สัญชาติ'}`"
/>
</div>
<div class="col-xs-12 col-sm-3 col-md-3">
<datepicker
v-model="informaData.birthDate"
v-model="defaultInformation.birthDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
@ -95,7 +95,11 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:model-value="informaData.birthDate == null ? null : date2Thai(informaData.birthDate)"
:model-value="
defaultInformation.birthDate == null
? null
: date2Thai(defaultInformation.birthDate)
"
:rules="[(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`]"
:label="`${'วัน/เดือน/ปี เกิด'}`"
>
@ -124,7 +128,9 @@
readonly
borderless
:style="!(status == 'register' || status == 'rejectRegister') ? '' : 'padding:0 12px;'"
:model-value="informaData.birthDate == null ? null : calAge(informaData.birthDate)"
:model-value="
defaultInformation.birthDate == null ? null : calAge(defaultInformation.birthDate)
"
:label="`${'อายุ'}`"
/>
</div>
@ -137,7 +143,7 @@
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="informaData.relationship"
v-model="defaultInformation.relationship"
emit-value
map-options
option-label="name"
@ -156,7 +162,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.cardid"
v-model="defaultInformation.cardid"
maxlength="13"
:rules="[
(val) => !!val || `${'กรุณากรอก เลขบัตรประจำตัวประชาชน'}`,
@ -174,7 +180,7 @@
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="informaData.provinceId"
v-model="defaultInformation.provinceId"
emit-value
map-options
option-label="name"
@ -193,7 +199,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.cardid"
v-model="defaultInformation.cardid"
:rules="[(val) => !!val || `${'กรุณากรอก ออกให้ ณ อำเภอ'}`]"
label="ออกให้ ณ อำเภอ"
/> -->
@ -205,7 +211,7 @@
:outlined="status == 'register' || status == 'rejectRegister'"
dense
lazy-rules
v-model="informaData.districtId"
v-model="defaultInformation.districtId"
emit-value
map-options
option-label="name"
@ -217,7 +223,7 @@
<div class="col-xs-12 col-sm-3 col-md-3">
<datepicker
v-model="informaData.cardIdDate"
v-model="defaultInformation.cardIdDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
@ -240,7 +246,9 @@
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
:model-value="
informaData.cardIdDate == null ? null : date2Thai(informaData.cardIdDate)
defaultInformation.cardIdDate == null
? null
: date2Thai(defaultInformation.cardIdDate)
"
:rules="[(val) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี ที่ออกบัตร'}`]"
:label="`${'วัน/เดือน/ปี ที่ออกบัตร'}`"
@ -272,7 +280,7 @@
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.tel"
v-model="defaultInformation.tel"
:rules="[
(val) => !!val || `${'กรุณากรอก โทรศัพท์'}`,
(val) => /^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลโทรศัพท์ให้ถูกต้อง'}`
@ -291,7 +299,7 @@
:class="getClass(status == 'register' || status == 'rejectRegister')"
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.phone"
v-model="defaultInformation.phone"
:rules="[
(val) => !!val || `${'กรุณากรอก โทรศัพท์มือถือ'}`,
(val) => /^[0-9]*$/.test(val) || `${'กรุณากรอกข้อมูลโทรศัพท์มือถือให้ถูกต้อง'}`
@ -307,7 +315,7 @@
lazy-rules
:readonly="true"
:borderless="true"
v-model="informaData.email"
v-model="defaultInformation.email"
label="E-mail address"
/>
</div>
@ -343,7 +351,7 @@
lazy-rules
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="informaData.knowledge"
v-model="defaultInformation.knowledge"
label="ความรู้ความสามารถพิเศษ"
type="textarea"
/>
@ -356,17 +364,16 @@
</q-dialog> -->
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useQuasar } from 'quasar'
import { ref, onMounted, watch } from 'vue'
import { QForm, useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
import { useExamDataStore } from '@/modules/01_exam/store'
import type { PropType } from 'vue'
import type { Information, DataOption } from '@/modules/01_exam/interface/index/Main'
import { defaultInformation } from '@/modules/01_exam/interface/index/Main'
import { defaultInformation, changeData } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue'
import Conference from '@/modules/01_exam/components/Conference.vue'
import { useRoute } from 'vue-router'
import keycloak from '@/plugins/keycloak'
@ -394,6 +401,14 @@ const props = defineProps({
status: {
type: String,
required: true
},
btnSave: {
type: Boolean,
required: true
},
form: {
type: Object,
required: true
}
})
@ -405,19 +420,32 @@ const districtOptions = ref<DataOption[]>([])
const route = useRoute()
const examId = ref<string>(route.params.id.toString())
const edit = ref<boolean>(true)
const informaData = ref<Information>(defaultInformation)
const myform = ref<any>()
// const defaultInformation = ref<Information>(defaultInformation)
const myform = ref<any>({})
const imageUrl = ref<string | null>(null)
const disabledPic = ref<boolean>(false)
// const modalConsend = ref<boolean>(false)
const fileData = ref<File | null>()
const loader = ref<boolean>(false)
const emit = defineEmits(['update:statusEdit'])
const emit = defineEmits(['update:statusEdit', 'update:form'])
watch(props, async (count: any, prevCount: any) => {
// if (props.btnSave == true) await saveData()
})
watch(myform, async (count: any, prevCount: any) => {
emit('update:form', count)
})
watch(defaultInformation, async (count: Information, prevCount: Information) => {
await changeData('information', count)
})
onMounted(async () => {
await fetchData()
if (informaData.value.provinceId != null) await fetchDistrict(informaData.value.provinceId)
if (defaultInformation.value.provinceId != null)
await fetchDistrict(defaultInformation.value.provinceId)
})
const fetchData = async () => {
@ -426,26 +454,29 @@ const fetchData = async () => {
.get(config.API.candidateInformation(examId.value))
.then((res) => {
const data = res.data.result
informaData.value.prefixId = data.prefixId
informaData.value.lastname = data.lastName
informaData.value.provinceId = data.citizenProvinceId
informaData.value.districtId = data.citizenDistrictId
informaData.value.birthDate = data.dateOfBirth == null ? null : new Date(data.dateOfBirth)
informaData.value.cardIdDate = data.citizenDate == null ? null : new Date(data.citizenDate)
informaData.value.cardid = data.citizenId
informaData.value.firstname = data.firstName
informaData.value.relationship = data.relationshipId
informaData.value.nationality = data.nationality
informaData.value.email = data.email
informaData.value.phone = data.mobilePhone
informaData.value.tel = data.telephone
informaData.value.knowledge = data.knowledge
defaultInformation.value.prefixId = data.prefixId
defaultInformation.value.lastname = data.lastName
defaultInformation.value.provinceId = data.citizenProvinceId
defaultInformation.value.districtId = data.citizenDistrictId
defaultInformation.value.birthDate =
data.dateOfBirth == null ? null : new Date(data.dateOfBirth)
defaultInformation.value.cardIdDate =
data.citizenDate == null ? null : new Date(data.citizenDate)
defaultInformation.value.cardid = data.citizenId
defaultInformation.value.firstname = data.firstName
defaultInformation.value.relationship = data.relationshipId
defaultInformation.value.nationality = data.nationality
defaultInformation.value.email = data.email
defaultInformation.value.phone = data.mobilePhone
defaultInformation.value.tel = data.telephone
defaultInformation.value.knowledge = data.knowledge
})
.catch(() => {
informaData.value.email = keycloak.tokenParsed == null ? '' : keycloak.tokenParsed.email
informaData.value.firstname =
defaultInformation.value.email =
keycloak.tokenParsed == null ? '' : keycloak.tokenParsed.email
defaultInformation.value.firstname =
keycloak.tokenParsed == null ? '' : keycloak.tokenParsed.given_name
informaData.value.lastname =
defaultInformation.value.lastname =
keycloak.tokenParsed == null ? '' : keycloak.tokenParsed.family_name
})
.finally(() => {
@ -454,7 +485,7 @@ const fetchData = async () => {
}
const selectProvince = (val: string) => {
informaData.value.districtId = ''
defaultInformation.value.districtId = ''
myform.value.resetValidation()
fetchDistrict(val)
}
@ -466,25 +497,29 @@ const saveData = async () => {
loader.value = true
await http
.post(config.API.candidateInformation(examId.value), {
prefixId: informaData.value.prefixId,
lastName: informaData.value.lastname,
citizenProvinceId: informaData.value.provinceId,
citizenDistrictId: informaData.value.districtId,
prefixId: defaultInformation.value.prefixId,
lastName: defaultInformation.value.lastname,
citizenProvinceId: defaultInformation.value.provinceId,
citizenDistrictId: defaultInformation.value.districtId,
dateOfBirth:
informaData.value.birthDate == null ? null : dateToISO(informaData.value.birthDate),
defaultInformation.value.birthDate == null
? null
: dateToISO(defaultInformation.value.birthDate),
citizenDate:
informaData.value.cardIdDate == null ? null : dateToISO(informaData.value.cardIdDate),
citizenId: informaData.value.cardid,
firstName: informaData.value.firstname,
relationshipId: informaData.value.relationship,
nationality: informaData.value.nationality,
email: informaData.value.email,
mobilePhone: informaData.value.phone,
telephone: informaData.value.tel,
knowledge: informaData.value.knowledge
defaultInformation.value.cardIdDate == null
? null
: dateToISO(defaultInformation.value.cardIdDate),
citizenId: defaultInformation.value.cardid,
firstName: defaultInformation.value.firstname,
relationshipId: defaultInformation.value.relationship,
nationality: defaultInformation.value.nationality,
email: defaultInformation.value.email,
mobilePhone: defaultInformation.value.phone,
telephone: defaultInformation.value.tel,
knowledge: defaultInformation.value.knowledge
})
.then(() => {
success($q, 'บันทึกข้อมูลส่วนตัวสำเร็จ')
// success($q, 'บันทึกข้อมูลส่วนตัวสำเร็จ')
// edit.value = false
emit('update:statusEdit', false)
})

123
src/modules/01_exam/components/Form/Occupation.vue
View file

@ -8,7 +8,7 @@
:addData="true"
:editOnly="false"
:cancel="cancelData"
:editData="status == 'register' || status == 'rejectRegister'"
:editData="false"
:disable="statusEdit"
/>
<!-- :changeBtn="changeBtn" -->
@ -24,16 +24,16 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.official"
v-model="defaultOccupation.official"
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
:disable="
occupationData.status !== 'official' ||
defaultOccupation.status !== 'official' ||
!(status == 'register' || status == 'rejectRegister')
"
>
<template v-slot:before>
<q-radio
v-model="occupationData.status"
v-model="defaultOccupation.status"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="official"
@ -54,16 +54,16 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.personnel"
v-model="defaultOccupation.personnel"
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
:disable="
occupationData.status !== 'personnel' ||
defaultOccupation.status !== 'personnel' ||
!(status == 'register' || status == 'rejectRegister')
"
>
<template v-slot:before>
<q-radio
v-model="occupationData.status"
v-model="defaultOccupation.status"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="personnel"
@ -84,16 +84,16 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.officialsOther"
v-model="defaultOccupation.officialsOther"
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
:disable="
occupationData.status !== 'officialsOther' ||
defaultOccupation.status !== 'officialsOther' ||
!(status == 'register' || status == 'rejectRegister')
"
>
<template v-slot:before>
<q-radio
v-model="occupationData.status"
v-model="defaultOccupation.status"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="officialsOther"
@ -114,16 +114,16 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.employee"
v-model="defaultOccupation.employee"
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
:disable="
occupationData.status !== 'employee' ||
defaultOccupation.status !== 'employee' ||
!(status == 'register' || status == 'rejectRegister')
"
>
<template v-slot:before>
<q-radio
v-model="occupationData.status"
v-model="defaultOccupation.status"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="employee"
@ -136,7 +136,7 @@
</template>
</q-input>
<q-radio
v-model="occupationData.status"
v-model="defaultOccupation.status"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="studying"
@ -155,16 +155,16 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.other"
v-model="defaultOccupation.other"
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
:disable="
occupationData.status !== 'other' ||
defaultOccupation.status !== 'other' ||
!(status == 'register' || status == 'rejectRegister')
"
>
<template v-slot:before>
<q-radio
v-model="occupationData.status"
v-model="defaultOccupation.status"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="other"
@ -187,7 +187,7 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.company"
v-model="defaultOccupation.company"
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
:label="`${'สำนัก/บริษัท'}`"
/>
@ -202,7 +202,7 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.department"
v-model="defaultOccupation.department"
:rules="[(val) => !!val || `${'กรุณากรอก กอง/ฝ่าย'}`]"
:label="`${'กอง/ฝ่าย'}`"
/>
@ -217,7 +217,7 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.email"
v-model="defaultOccupation.email"
:rules="[(val) => !!val || `${'กรุณากรอก E-mail address'}`]"
:label="`${'E-mail address'}`"
/>
@ -234,7 +234,7 @@
autogrow
:readonly="!(status == 'register' || status == 'rejectRegister')"
:borderless="!(status == 'register' || status == 'rejectRegister')"
v-model="occupationData.tel"
v-model="defaultOccupation.tel"
:rules="[
(val) => !!val || `${'กรุณากรอก โทรศัพท์'}`,
(val) => /^[0-9]*$/.test(val) || 'กรุณากรอก โทรศัพท์ให้ถูกต้อง'
@ -251,16 +251,15 @@
</q-dialog> -->
</template>
<script setup lang="ts">
import { ref, onMounted } from 'vue'
import { useQuasar } from 'quasar'
import { ref, onMounted, watch } from 'vue'
import { QForm, useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
import { useExamDataStore } from '@/modules/01_exam/store'
import type { Occupation } from '@/modules/01_exam/interface/index/Main'
import { defaultOccupation } from '@/modules/01_exam/interface/index/Main'
import { defaultOccupation, changeData } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue'
import Conference from '@/modules/01_exam/components/Conference.vue'
import { useRoute } from 'vue-router'
const props = defineProps({
@ -275,6 +274,14 @@ const props = defineProps({
status: {
type: String,
required: true
},
btnSave: {
type: Boolean,
required: true
},
form: {
type: Object,
required: true
}
})
@ -283,14 +290,26 @@ const mixin = useCounterMixin()
const store = useExamDataStore()
const { success } = mixin
const edit = ref<boolean>(true)
const occupationData = ref<Occupation>(defaultOccupation)
const myform = ref<any>()
// const defaultOccupation = ref<Occupation>(defaultOccupation)
const myform = ref<any>({})
// const modalConsend = ref<boolean>(false)
const loader = ref<boolean>(false)
const route = useRoute()
const examId = ref<string>(route.params.id.toString())
const emit = defineEmits(['update:statusEdit'])
const emit = defineEmits(['update:statusEdit', 'update:form'])
watch(props, async (count: any, prevCount: any) => {
// if (props.btnSave == true) await saveData()
})
watch(myform, async (count: any, prevCount: any) => {
emit('update:form', count)
})
watch(defaultOccupation, async (count: Occupation, prevCount: Occupation) => {
await changeData('occupation', count)
})
onMounted(async () => {
await fetchData()
@ -302,20 +321,21 @@ const fetchData = async () => {
.get(config.API.candidateOccupation(examId.value))
.then((res) => {
const data = res.data.result
occupationData.value.status = data.occupationType
occupationData.value.company = data.occupationCompany
occupationData.value.department = data.occupationDepartment
occupationData.value.email = data.occupationEmail
occupationData.value.tel = data.occupationTelephone
occupationData.value.official =
defaultOccupation.value.status = data.occupationType
defaultOccupation.value.company = data.occupationCompany
defaultOccupation.value.department = data.occupationDepartment
defaultOccupation.value.email = data.occupationEmail
defaultOccupation.value.tel = data.occupationTelephone
defaultOccupation.value.official =
data.occupationType == 'official' ? data.occupationPosition : null
occupationData.value.personnel =
defaultOccupation.value.personnel =
data.occupationType == 'personnel' ? data.occupationPosition : null
occupationData.value.officialsOther =
defaultOccupation.value.officialsOther =
data.occupationType == 'officialsOther' ? data.occupationPosition : null
occupationData.value.employee =
defaultOccupation.value.employee =
data.occupationType == 'employee' ? data.occupationPosition : null
occupationData.value.other = data.occupationType == 'other' ? data.occupationPosition : null
defaultOccupation.value.other =
data.occupationType == 'other' ? data.occupationPosition : null
})
.catch(() => {})
.finally(() => {
@ -328,24 +348,27 @@ const saveData = async () => {
if (suc) {
// if (store.consend == true) {
const type = ref<string | null>('')
if (occupationData.value.status == 'official') type.value = occupationData.value.official
if (occupationData.value.status == 'personnel') type.value = occupationData.value.personnel
if (occupationData.value.status == 'officialsOther')
type.value = occupationData.value.officialsOther
if (occupationData.value.status == 'employee') type.value = occupationData.value.employee
if (occupationData.value.status == 'other') type.value = occupationData.value.other
if (defaultOccupation.value.status == 'official')
type.value = defaultOccupation.value.official
if (defaultOccupation.value.status == 'personnel')
type.value = defaultOccupation.value.personnel
if (defaultOccupation.value.status == 'officialsOther')
type.value = defaultOccupation.value.officialsOther
if (defaultOccupation.value.status == 'employee')
type.value = defaultOccupation.value.employee
if (defaultOccupation.value.status == 'other') type.value = defaultOccupation.value.other
loader.value = true
await http
.post(config.API.candidateOccupation(examId.value), {
occupationType: occupationData.value.status,
occupationCompany: occupationData.value.company,
occupationDepartment: occupationData.value.department,
occupationEmail: occupationData.value.email,
occupationTelephone: occupationData.value.tel,
occupationType: defaultOccupation.value.status,
occupationCompany: defaultOccupation.value.company,
occupationDepartment: defaultOccupation.value.department,
occupationEmail: defaultOccupation.value.email,
occupationTelephone: defaultOccupation.value.tel,
occupationPosition: type.value
})
.then(() => {
success($q, 'บันทึกข้อมูลอาชีพสำเร็จ')
// success($q, 'บันทึกข้อมูลอาชีพสำเร็จ')
// edit.value = false
emit('update:statusEdit', false)
})

116
src/modules/01_exam/components/Form/Profile.vue
View file

@ -8,9 +8,11 @@
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
:btnSave="btnSave"
v-model:form="formInformation"
/>
</div>
<q-separator class="q-my-lg bg-gray" size="5px" />
<div class="q-px-sm">
<Address
@ -18,6 +20,8 @@
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
:btnSave="btnSave"
v-model:form="formAddress"
/>
</div>
@ -28,47 +32,58 @@
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
:btnSave="btnSave"
v-model:form="formFamily"
/>
</div>
<q-separator class="q-my-lg bg-gray" size="5px" />
<div class="q-px-sm">
<Occupation v-model:statusEdit="statusEdit" :notiNoEdit="notiNoEdit" :status="status" />
</div>
<q-separator class="q-my-lg bg-gray" size="5px" />
<div class="q-px-sm">
<Education
:loader="loader"
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
/>
<Occupation
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
:btnSave="btnSave"
v-model:form="formOccupation"
/>
</div>
<q-separator class="q-my-lg bg-gray" size="5px" />
<div class="q-px-sm">
<Career
:loader="loader"
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
/>
<Education
:loader="loader"
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
:btnSave="btnSave"
/>
</div>
<q-separator class="q-my-lg bg-gray" size="5px" />
<div class="q-px-sm">
<Document
:loader="loader"
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
/>
<Career
:loader="loader"
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
:btnSave="btnSave"
/>
</div>
<q-separator class="q-my-lg bg-gray" size="5px" />
<div class="q-px-sm">
<Document
:loader="loader"
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
:btnSave="btnSave"
/>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, watch } from 'vue'
import { useQuasar } from 'quasar'
import { QForm, useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
@ -94,6 +109,26 @@ const props = defineProps({
status: {
type: String,
required: true
},
btnSave: {
type: Boolean,
required: true
},
formInformation: {
type: Object,
required: true
},
formAddress: {
type: Object,
required: true
},
formFamily: {
type: Object,
required: true
},
formOccupation: {
type: Object,
required: true
}
})
@ -105,13 +140,40 @@ const statusEdit = ref<boolean>(false)
const prefixOptions = ref<DataOption[]>([])
const relationshipOptions = ref<DataOption[]>([])
const provinceOptions = ref<DataOption[]>([])
const formInformation = ref<any>({})
const formAddress = ref<any>({})
const formFamily = ref<any>({})
const formOccupation = ref<any>({})
const emit = defineEmits(['update:loader', 'update:statusEdit'])
const emit = defineEmits([
'update:loader',
'update:statusEdit',
'update:formInformation',
'update:formAddress',
'update:formFamily',
'update:formOccupation'
])
watch(statusEdit, (count: boolean, prevCount: boolean) => {
emit('update:statusEdit', count)
})
watch(formInformation, async (count: Object, prevCount: Object) => {
emit('update:formInformation', count)
})
watch(formAddress, async (count: Object, prevCount: Object) => {
emit('update:formAddress', count)
})
watch(formFamily, async (count: Object, prevCount: Object) => {
emit('update:formFamily', count)
})
watch(formOccupation, async (count: Object, prevCount: Object) => {
emit('update:formOccupation', count)
})
onMounted(() => {
fetchPrefix()
fetchRelationship()
@ -143,7 +205,6 @@ const fetchRelationship = async () => {
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
// console.log(data);
data.map((r: any) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})
@ -162,7 +223,6 @@ const fetchProvince = async () => {
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
// console.log(data);
data.map((r: any) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})

31
src/modules/01_exam/interface/index/Main.ts
View file

@ -1,3 +1,4 @@
import { ref } from 'vue'
interface Pagination {
rowsPerPage: number
}
@ -201,7 +202,7 @@ const defaultCard: ExamCard[] = [
}
]
const defaultAddress: Address = {
const defaultAddress = ref<Address>({
address: null,
provinceId: null,
districtId: null,
@ -213,9 +214,9 @@ const defaultAddress: Address = {
subdistrictIdC: null,
// codeC: ,
same: '1'
}
})
const defaultInformation: Information = {
const defaultInformation = ref<Information>({
cardid: null,
prefix: null,
prefixId: null,
@ -237,9 +238,9 @@ const defaultInformation: Information = {
districtId: null,
provinceId: null,
statusId: null
}
})
const defaultFamily: Family = {
const defaultFamily = ref<Family>({
prefixC: null,
prefixIdC: null,
firstnameC: null,
@ -259,9 +260,9 @@ const defaultFamily: Family = {
occupationF: null,
nationalityF: null,
same: '0'
}
})
const defaultOccupation: Occupation = {
const defaultOccupation = ref<Occupation>({
status: null,
company: null,
department: null,
@ -272,9 +273,23 @@ const defaultOccupation: Occupation = {
officialsOther: null,
employee: null,
other: null
})
const changeData = (system: String, val: any) => {
if (system == 'information') defaultInformation.value = val
if (system == 'address') defaultAddress.value = val
if (system == 'famliy') defaultFamily.value = val
if (system == 'occupation') defaultOccupation.value = val
}
export { defaultInformation, defaultFamily, defaultAddress, defaultOccupation, defaultCard }
export {
defaultInformation,
defaultFamily,
defaultAddress,
defaultOccupation,
defaultCard,
changeData
}
export type {
Pagination,
DataOption,