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

ต่อapiคนสมัครกรอกข้อมูลสมัครสอบ

Browse source
This commit is contained in:
Kittapath 2023-03-25 01:07:18 +07:00
parent f74972e5ec
commit b7a91fa326
16 changed files with 567 additions and 522 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -11,5 +11,6 @@ export default {
candidateCheckCreate: (examId: string) => `${candidate}check/${examId}`, candidateCheckCreate: (examId: string) => `${candidate}check/${examId}`,
candidateRegister: (examId: string) => `${candidate}register/${examId}`, candidateRegister: (examId: string) => `${candidate}register/${examId}`,
candidatePayment: (examId: string) => `${candidate}payment/${examId}`, candidatePayment: (examId: string) => `${candidate}payment/${examId}`,
candidateStatus: (examId: string) => `${candidate}status/${examId}`,
candidate candidate
} }

14
src/modules/01_exam/components/ExamFinished.vue
View file

@ -3,7 +3,7 @@
<div class="q-pa-md row items-center justify-center"> <div class="q-pa-md row items-center justify-center">
<q-card style="max-width: 40%; width: 100%" bordered> <q-card style="max-width: 40%; width: 100%" bordered>
<q-card-actions class="q-pa-md" :class="getClass(status)"> <q-card-actions class="q-pa-md" :class="getClass(status)">
<div v-if="status == false" class="text-black text-bold"> <div v-if="status != 'done'" class="text-black text-bold">
เจ้าหน้าที่กำลังตรวจสถานที่สอบ เจ้าหน้าที่กำลังตรวจสถานที่สอบ
</div> </div>
<div v-else class="text-black text-bold">สมัครสอบสำเร็จ</div> <div v-else class="text-black text-bold">สมัครสอบสำเร็จ</div>
@ -75,8 +75,8 @@ const props = defineProps({
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
@ -89,14 +89,10 @@ const examLocation = ref<string>('ศูนย์สอบ 01 กรุงเท
const floor = ref<string>('4') const floor = ref<string>('4')
const examRoom = ref<string>('CB-706') const examRoom = ref<string>('CB-706')
const seatNumber = ref<string>('75') const seatNumber = ref<string>('75')
const status = ref<boolean>(true)
const download = () => {} const download = () => {}
const testChangeStatus = () => { const getClass = (val: string) => {
status.value = true return val == 'done' ? 'bg-green-4' : 'bg-yellow-3'
}
const getClass = (val: boolean) => {
return val == true ? 'bg-green-4' : 'bg-yellow-3'
} }
</script> </script>

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

@ -13,22 +13,22 @@
> >
<!-- ข้อมูลส่วนบุคคล --> <!-- ข้อมูลส่วนบุคคล -->
<q-tab-panel name="profile"> <q-tab-panel name="profile">
<Profile :loader="loader" v-model:statusEdit="statusEdit" :step="step" /> <Profile :loader="loader" v-model:statusEdit="statusEdit" :status="status" />
</q-tab-panel> </q-tab-panel>
<!-- ประวัติการศีกษา --> <!-- ประวัติการศีกษา -->
<q-tab-panel name="education" <q-tab-panel name="education"
><Education :loader="loader" v-model:statusEdit="statusEdit" :step="step" ><Education :loader="loader" v-model:statusEdit="statusEdit" :status="status"
/></q-tab-panel> /></q-tab-panel>
<!-- ประวัติการทำงาน/ฝึกงาน --> <!-- ประวัติการทำงาน/ฝึกงาน -->
<q-tab-panel name="career" <q-tab-panel name="career"
><Career :loader="loader" v-model:statusEdit="statusEdit" :step="step" ><Career :loader="loader" v-model:statusEdit="statusEdit" :status="status"
/></q-tab-panel> /></q-tab-panel>
<!-- ไฟล์ --> <!-- ไฟล์ -->
<q-tab-panel name="document"> <q-tab-panel name="document">
<Document :loader="loader" v-model:statusEdit="statusEdit" :step="step" /> <Document :loader="loader" v-model:statusEdit="statusEdit" :status="status" />
</q-tab-panel> </q-tab-panel>
</q-tab-panels> </q-tab-panels>
</template> </template>
@ -45,7 +45,7 @@
<div> <div>
<q-checkbox <q-checkbox
v-model="acceptTermOfUse" v-model="acceptTermOfUse"
:disable="step !== 2 || statusEdit" :disable="(status !== 'register' && status !== 'rejectRegister') || statusEdit"
v-if="tab == 'document'" v-if="tab == 'document'"
label="ข้าพเจ้ารับรองว่า ข้าพเจ้ามีคุณสมบัติครบถ้วนตามประกาศรับสมัคร ข้อความข้างต้นตรงตามความจริงทุกประการ" label="ข้าพเจ้ารับรองว่า ข้าพเจ้ามีคุณสมบัติครบถ้วนตามประกาศรับสมัคร ข้อความข้างต้นตรงตามความจริงทุกประการ"
/> />
@ -57,7 +57,10 @@
class="q-ml-md" class="q-ml-md"
label="กลับ" label="กลับ"
@click="clickPreview(tab)" @click="clickPreview(tab)"
v-if="step === 2 && (tab == 'education' || tab == 'career' || tab == 'document')" v-if="
(status === 'register' || status === 'rejectRegister') &&
(tab == 'education' || tab == 'career' || tab == 'document')
"
icon="mdi-chevron-left" icon="mdi-chevron-left"
:disable="statusEdit" :disable="statusEdit"
/> />
@ -66,7 +69,10 @@
class="q-ml-md" class="q-ml-md"
label="ต่อไป" label="ต่อไป"
@click="clickNext(tab)" @click="clickNext(tab)"
v-if="step === 2 && (tab == 'profile' || tab == 'education' || tab == 'career')" v-if="
(status === 'register' || status === 'rejectRegister') &&
(tab == 'profile' || tab == 'education' || tab == 'career')
"
icon-right="mdi-chevron-right" icon-right="mdi-chevron-right"
:disable="statusEdit" :disable="statusEdit"
/> />
@ -75,7 +81,7 @@
class="q-ml-md" class="q-ml-md"
label="สมัครสอบ" label="สมัครสอบ"
@click="okModalConfirm" @click="okModalConfirm"
v-if="step === 2 && tab == 'document'" v-if="(status === 'register' || status === 'rejectRegister') && tab == 'document'"
:disable="!acceptTermOfUse || statusEdit" :disable="!acceptTermOfUse || statusEdit"
/> />
</div> </div>
@ -84,22 +90,22 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref, watch } from 'vue' import { onMounted, ref, watch } from 'vue'
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 { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin' import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http' import http from '@/plugins/http'
import config from '@/app.config' 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'
const props = defineProps({ const props = defineProps({
fetchStep: { fetchStep: {
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
@ -115,7 +121,7 @@ const acceptTermOfUse = ref<boolean>(false)
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331') const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
onMounted(async () => { onMounted(async () => {
if (props.step > 2) { if (props.status !== 'register') {
acceptTermOfUse.value = true acceptTermOfUse.value = true
} }
}) })

47
src/modules/01_exam/components/ExamPayment.vue
View file

@ -6,7 +6,7 @@
<div class="text-bold col-12" :class="getFontColor(status)"> <div class="text-bold col-12" :class="getFontColor(status)">
{{ message(status) }} {{ message(status) }}
</div> </div>
<div class="col-12" v-if="status === 'rejected'" :class="getFontColor(status)"> <div class="col-12" v-if="status === 'rejectPayment'" :class="getFontColor(status)">
<li>{{ rejectMessage }}</li> <li>{{ rejectMessage }}</li>
</div> </div>
</q-card-actions> </q-card-actions>
@ -18,15 +18,17 @@
</div> </div>
</div> </div>
<div class="q-pa-md text-center col-12"> <div class="q-pa-md text-center col-12">
<q-btn color="primary" @click="clickPayment" label="ส่งหลักฐานการชำระเงิน" /> <q-btn
v-if="status == 'payment' || status == 'rejectPayment'"
color="primary"
@click="clickPayment"
label="ส่งหลักฐานการชำระเงิน"
/>
</div> </div>
<div class="text-black text-center q-pb-lg col-12"> <div class="text-black text-center q-pb-lg col-12">
***ถ้าต้องการเเก้ไขหลักฐานการโอนเงินกรุณาอัปโหลดซ้ำ*** ***ถ้าต้องการเเก้ไขหลักฐานการโอนเงินกรุณาอัปโหลดซ้ำ***
</div> </div>
</div> </div>
<q-btn color="negative" @click="setStatus('rejected')">Re</q-btn>
<q-btn color="positive" @click="setStatus('success')">Su</q-btn>
<q-btn color="positive" @click="setStatus('next')">Ne</q-btn>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
@ -41,8 +43,8 @@ const props = defineProps({
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
@ -50,7 +52,6 @@ const props = defineProps({
const $q = useQuasar() const $q = useQuasar()
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
const { success } = mixin const { success } = mixin
const status = ref<string>('')
const rejectMessage = ref<string>('กรุณาจ่ายเงินให้ครบตามจำนวน') const rejectMessage = ref<string>('กรุณาจ่ายเงินให้ครบตามจำนวน')
const img = ref<string>('https://cdn-icons-png.flaticon.com/512/2496/2496846.png') const img = ref<string>('https://cdn-icons-png.flaticon.com/512/2496/2496846.png')
const fileData = ref<any>() const fileData = ref<any>()
@ -65,11 +66,6 @@ const uploadImg = (file: any) => {
'https://www.bangkokbank.com/-/media/feature/page-content/bbl-corporate/image-carousel-slides/digital-banking/bualuang-mbanking/how-to-use/payment/others/7_en.png' 'https://www.bangkokbank.com/-/media/feature/page-content/bbl-corporate/image-carousel-slides/digital-banking/bualuang-mbanking/how-to-use/payment/others/7_en.png'
} }
const setStatus = async (val: string) => {
status.value = val
if (val == 'next') props.fetchStep()
}
const clickPayment = async () => { const clickPayment = async () => {
loader.value = true loader.value = true
await http await http
@ -82,16 +78,17 @@ const clickPayment = async () => {
loader.value = false loader.value = false
props.fetchStep() props.fetchStep()
}) })
status.value = 'processing'
} }
const getClass = (val: string) => { const getClass = (val: string) => {
switch (val) { switch (val) {
case 'processing': case 'checkPayment':
return 'bg-yellow-3' return 'bg-yellow-3'
case 'rejected': case 'rejectPayment':
return 'bg-red-2' return 'bg-red-2'
case 'success': case 'checkSeat':
return 'bg-light-green-3'
case 'done':
return 'bg-light-green-3' return 'bg-light-green-3'
default: default:
return 'bg-light-blue-1' return 'bg-light-blue-1'
@ -99,11 +96,13 @@ const getClass = (val: string) => {
} }
const message = (val: string) => { const message = (val: string) => {
switch (val) { switch (val) {
case 'processing': case 'checkPayment':
return 'รอการตรวจสอบ' return 'รอการตรวจสอบ'
case 'rejected': case 'rejectPayment':
return 'หลักฐานการชำระเงินผิดพลาด' return 'หลักฐานการชำระเงินผิดพลาด'
case 'success': case 'checkSeat':
return 'ตรวจสอบเเล้ว'
case 'done':
return 'ตรวจสอบเเล้ว' return 'ตรวจสอบเเล้ว'
default: default:
return 'รออัปโหลดหลักฐานชำระเงิน' return 'รออัปโหลดหลักฐานชำระเงิน'
@ -111,11 +110,13 @@ const message = (val: string) => {
} }
const getFontColor = (val: string) => { const getFontColor = (val: string) => {
switch (val) { switch (val) {
case 'processing': case 'checkPayment':
return 'text-orange' return 'text-orange'
case 'rejected': case 'rejectPayment':
return 'text-red-12' return 'text-red-12'
case 'success': case 'checkSeat':
return 'text-green'
case 'done':
return 'text-green' return 'text-green'
default: default:
return 'text-blue' return 'text-blue'

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

@ -14,7 +14,7 @@
:edit="clickEdit" :edit="clickEdit"
:cancel="clickCancel" :cancel="clickCancel"
:addData="false" :addData="false"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
name="ประวัติการทำงาน/ฝึกงาน" name="ประวัติการทำงาน/ฝึกงาน"
icon="mdi-briefcase" icon="mdi-briefcase"
> >
@ -168,7 +168,7 @@
:validate="validateData" :validate="validateData"
:clickNext="clickNext" :clickNext="clickNext"
:clickPrevious="clickPrevious" :clickPrevious="clickPrevious"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
v-model:editvisible="edit" v-model:editvisible="edit"
v-model:next="next" v-model:next="next"
v-model:previous="previous" v-model:previous="previous"
@ -185,21 +185,21 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref, watch } from 'vue' import { onMounted, ref, watch } from 'vue'
import Table from '@/components/Table.vue'
import DialogHeader from '@/components/DialogHeader.vue'
import DialogFooter from '@/components/DialogFooter.vue'
import { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin' import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
import { useExamDataStore } from '@/modules/01_exam/store'
import type { import type {
RequestItemsObject, RequestItemsObject,
Columns, Columns,
DataProps DataProps
} from '@/modules/01_exam/interface/request/Career' } from '@/modules/01_exam/interface/request/Career'
import type { ResponseObject } from '@/modules/01_exam/interface/response/Career' import type { ResponseObject } from '@/modules/01_exam/interface/response/Career'
import http from '@/plugins/http' import Table from '@/components/Table.vue'
import config from '@/app.config' import DialogHeader from '@/components/DialogHeader.vue'
import DialogFooter from '@/components/DialogFooter.vue'
import Conference from '@/modules/01_exam/components/Conference.vue' import Conference from '@/modules/01_exam/components/Conference.vue'
import { useExamDataStore } from '@/modules/01_exam/store'
const props = defineProps({ const props = defineProps({
loader: { loader: {
@ -207,8 +207,8 @@ const props = defineProps({
type: Boolean, type: Boolean,
required: true required: true
}, },
step: { status: {
type: Number, type: String,
required: true required: true
}, },
statusEdit: { statusEdit: {
@ -242,13 +242,11 @@ const statusCode = ref<number>()
const checkValidate = ref<boolean>(false) //validate data ผ่านหรือไม่ const checkValidate = ref<boolean>(false) //validate data ผ่านหรือไม่
const modalConsend = ref<boolean>(false) const modalConsend = ref<boolean>(false)
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331') const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const rows = ref<RequestItemsObject[]>([])
const filter = ref<string>('') //search data table
const emit = defineEmits(['update:loader', 'update:statusEdit']) const emit = defineEmits(['update:loader', 'update:statusEdit'])
const rows = ref<RequestItemsObject[]>([])
const filter = ref<string>('') //search data table
const visibleColumns = ref<String[]>([]) const visibleColumns = ref<String[]>([])
examData.career.columns.length == 0 examData.career.columns.length == 0
@ -326,7 +324,7 @@ const fetchData = async () => {
.then((res) => { .then((res) => {
const data = res.data.result const data = res.data.result
rows.value = [] rows.value = []
data.map((r: any) => { data.map((r: ResponseObject) => {
rows.value.push({ rows.value.push({
...r, ...r,
location: r.name, location: r.name,
@ -334,7 +332,7 @@ const fetchData = async () => {
}) })
}) })
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
loader.value = false loader.value = false
}) })
@ -344,7 +342,6 @@ const fetchData = async () => {
* กดดูข้อมูลก่อนหน้า * กดดูข้อมูลก่อนหน้า
*/ */
const clickPrevious = () => { const clickPrevious = () => {
// edit.value = false
rowIndex.value -= 1 rowIndex.value -= 1
const row = rows.value[rowIndex.value] const row = rows.value[rowIndex.value]
location.value = row.location location.value = row.location
@ -360,7 +357,6 @@ const clickPrevious = () => {
* กดดูข้อมูลต่อไป * กดดูข้อมูลต่อไป
*/ */
const clickNext = () => { const clickNext = () => {
// edit.value = false
rowIndex.value += 1 rowIndex.value += 1
const row = rows.value[rowIndex.value] const row = rows.value[rowIndex.value]
location.value = row.location location.value = row.location
@ -419,13 +415,14 @@ const clickDeleteRow = async () => {
.then(() => { .then(() => {
success($q, 'ลบข้อมูลสำเร็จ') success($q, 'ลบข้อมูลสำเร็จ')
}) })
.catch((e) => { .catch(() => {
// modalError.value = true // modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้' // modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message // modalErrorDetail.value = e.response.data.message
statusCode.value = e.response.data.status // statusCode.value = e.response.data.status
}) })
.finally(async () => { .finally(async () => {
loader.value = false
await fetchData() await fetchData()
edit.value = false edit.value = false
}) })
@ -458,8 +455,6 @@ const clickSave = async () => {
* บันทึกเพิ่มข้อมูล * บันทึกเพิ่มข้อมูล
*/ */
const saveData = async () => { const saveData = async () => {
edit.value = false
modal.value = false
loader.value = true loader.value = true
await http await http
.post(config.API.candidateCareer(candidateId.value), { .post(config.API.candidateCareer(candidateId.value), {
@ -470,16 +465,18 @@ const saveData = async () => {
durationEnd: dateToISO(new Date(duration.value[1])), durationEnd: dateToISO(new Date(duration.value[1])),
reason: reason.value reason: reason.value
}) })
.then((res) => { .then(() => {
success($q, 'บันทึกข้อมูลสำเร็จ') success($q, 'บันทึกข้อมูลสำเร็จ')
}) })
.catch((e) => { .catch(() => {
// modalError.value = true // modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้' // modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message // modalErrorDetail.value = e.response.data.message
statusCode.value = e.response.data.status // statusCode.value = e.response.data.status
}) })
.finally(async () => { .finally(async () => {
loader.value = false
edit.value = false
modal.value = false modal.value = false
await fetchData() await fetchData()
}) })
@ -489,8 +486,6 @@ const saveData = async () => {
* บันทึกแก้ไขข้อมูล * บันทึกแก้ไขข้อมูล
*/ */
const editData = async () => { const editData = async () => {
edit.value = false
modal.value = false
loader.value = true loader.value = true
await http await http
.put(config.API.candidateCareer(id.value), { .put(config.API.candidateCareer(id.value), {
@ -501,17 +496,19 @@ const editData = async () => {
durationEnd: dateToISO(new Date(duration.value[1])), durationEnd: dateToISO(new Date(duration.value[1])),
reason: reason.value reason: reason.value
}) })
.then((res) => { .then(() => {
success($q, 'บันทึกข้อมูลสำเร็จ') success($q, 'บันทึกข้อมูลสำเร็จ')
}) })
.catch((e) => { .catch(() => {
// modalError.value = true // modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้' // modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message // modalErrorDetail.value = e.response.data.message
statusCode.value = e.response.data.status // statusCode.value = e.response.data.status
}) })
.finally(async () => { .finally(async () => {
loader.value = false
edit.value = false edit.value = false
modal.value = false
await fetchData() await fetchData()
}) })
} }
@ -565,7 +562,6 @@ const selectData = (props: DataProps) => {
const addRow = () => { const addRow = () => {
modalEdit.value = false modalEdit.value = false
modal.value = true modal.value = true
// edit.value = true
location.value = '' location.value = ''
position.value = '' position.value = ''
salary.value = null salary.value = null

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

@ -9,7 +9,7 @@
:addData="true" :addData="true"
:editOnly="true" :editOnly="true"
:cancel="cancelData" :cancel="cancelData"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
/> />
</div> </div>
<div class="col-12"> <div class="col-12">
@ -94,8 +94,8 @@ const props = defineProps({
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })

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

@ -14,7 +14,7 @@
:edit="clickEdit" :edit="clickEdit"
:cancel="clickCancel" :cancel="clickCancel"
:addData="false" :addData="false"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
name="ประวัติการศีกษา" name="ประวัติการศีกษา"
icon="mdi-school" icon="mdi-school"
> >
@ -169,7 +169,7 @@
:validate="validateData" :validate="validateData"
:clickNext="clickNext" :clickNext="clickNext"
:clickPrevious="clickPrevious" :clickPrevious="clickPrevious"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
v-model:editvisible="edit" v-model:editvisible="edit"
v-model:next="next" v-model:next="next"
v-model:previous="previous" v-model:previous="previous"
@ -186,22 +186,22 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref, watch } from 'vue' import { onMounted, ref, watch } from 'vue'
import Table from '@/components/Table.vue'
import DialogHeader from '@/components/DialogHeader.vue'
import DialogFooter from '@/components/DialogFooter.vue'
import { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin' import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
import { useExamDataStore } from '@/modules/01_exam/store'
import type { import type {
RequestItemsObject, RequestItemsObject,
Columns, Columns,
DataProps DataProps
} from '@/modules/01_exam/interface/request/Education' } from '@/modules/01_exam/interface/request/Education'
import type { ResponseObject } from '@/modules/01_exam/interface/response/Education'
import type { DataOption } from '@/modules/01_exam/interface/index/Main' import type { DataOption } from '@/modules/01_exam/interface/index/Main'
import http from '@/plugins/http' import type { ResponseObject } from '@/modules/01_exam/interface/response/Education'
import config from '@/app.config' 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 Conference from '@/modules/01_exam/components/Conference.vue'
import { useExamDataStore } from '@/modules/01_exam/store'
const props = defineProps({ const props = defineProps({
loader: { loader: {
@ -209,8 +209,8 @@ const props = defineProps({
type: Boolean, type: Boolean,
required: true required: true
}, },
step: { status: {
type: Number, type: String,
required: true required: true
}, },
statusEdit: { statusEdit: {
@ -247,11 +247,10 @@ const checkValidate = ref<boolean>(false) //validate data ผ่านหรื
const modalConsend = ref<boolean>(false) const modalConsend = ref<boolean>(false)
const rows = ref<RequestItemsObject[]>([]) const rows = ref<RequestItemsObject[]>([])
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331') const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const filter = ref<string>('') //search data table
const emit = defineEmits(['update:loader', 'update:statusEdit']) const emit = defineEmits(['update:loader', 'update:statusEdit'])
const filter = ref<string>('') //search data table
const visibleColumns = ref<String[]>([]) const visibleColumns = ref<String[]>([])
examData.education.columns.length == 0 examData.education.columns.length == 0
@ -322,6 +321,7 @@ onMounted(async () => {
await fetchData() await fetchData()
await fetcheducationLevel() await fetcheducationLevel()
}) })
const fetchData = async () => { const fetchData = async () => {
loader.value = true loader.value = true
await http await http
@ -329,7 +329,7 @@ const fetchData = async () => {
.then((res) => { .then((res) => {
const data = res.data.result const data = res.data.result
rows.value = [] rows.value = []
data.map((r: any) => { data.map((r: ResponseObject) => {
rows.value.push({ rows.value.push({
...r, ...r,
educationLevelId: r.educationLevel.id, educationLevelId: r.educationLevel.id,
@ -338,14 +338,14 @@ const fetchData = async () => {
}) })
}) })
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
loader.value = false loader.value = false
}) })
} }
const fetcheducationLevel = async () => { const fetcheducationLevel = async () => {
// loader.value = true; loader.value = true
await http await http
.get(config.API.educationLevel) .get(config.API.educationLevel)
.then((res) => { .then((res) => {
@ -356,9 +356,9 @@ const fetcheducationLevel = async () => {
}) })
educationLevelOptions.value = option educationLevelOptions.value = option
}) })
.catch((e) => {}) .catch(() => {})
.finally(() => { .finally(() => {
// loader.value = false; loader.value = false
}) })
} }
@ -366,7 +366,6 @@ const fetcheducationLevel = async () => {
* กดดูข้อมูลก่อนหน้า * กดดูข้อมูลก่อนหน้า
*/ */
const clickPrevious = () => { const clickPrevious = () => {
// edit.value = false
rowIndex.value -= 1 rowIndex.value -= 1
const row = rows.value[rowIndex.value] const row = rows.value[rowIndex.value]
educationLevel.value = row.educationLevel educationLevel.value = row.educationLevel
@ -383,7 +382,6 @@ const clickPrevious = () => {
* กดดูข้อมูลต่อไป * กดดูข้อมูลต่อไป
*/ */
const clickNext = () => { const clickNext = () => {
// edit.value = false
rowIndex.value += 1 rowIndex.value += 1
const row = rows.value[rowIndex.value] const row = rows.value[rowIndex.value]
educationLevel.value = row.educationLevel educationLevel.value = row.educationLevel
@ -443,13 +441,14 @@ const clickDeleteRow = async () => {
.then(() => { .then(() => {
success($q, 'ลบข้อมูลสำเร็จ') success($q, 'ลบข้อมูลสำเร็จ')
}) })
.catch((e) => { .catch(() => {
// modalError.value = true // modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้' // modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message // modalErrorDetail.value = e.response.data.message
statusCode.value = e.response.data.status // statusCode.value = e.response.data.status
}) })
.finally(async () => { .finally(async () => {
loader.value = false
await fetchData() await fetchData()
edit.value = false edit.value = false
}) })
@ -492,16 +491,18 @@ const saveData = async () => {
durationStart: dateToISO(new Date(duration.value[0])), durationStart: dateToISO(new Date(duration.value[0])),
durationEnd: dateToISO(new Date(duration.value[1])) durationEnd: dateToISO(new Date(duration.value[1]))
}) })
.then((res) => { .then(() => {
success($q, 'บันทึกข้อมูลร่างสำเร็จ') success($q, 'บันทึกข้อมูลร่างสำเร็จ')
}) })
.catch((e) => { .catch(() => {
// modalError.value = true // modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้' // modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message // modalErrorDetail.value = e.response.data.message
statusCode.value = e.response.data.status // statusCode.value = e.response.data.status
}) })
.finally(async () => { .finally(async () => {
loader.value = false
edit.value = false
modal.value = false modal.value = false
await fetchData() await fetchData()
}) })
@ -521,17 +522,17 @@ const editData = async () => {
durationStart: dateToISO(new Date(duration.value[0])), durationStart: dateToISO(new Date(duration.value[0])),
durationEnd: dateToISO(new Date(duration.value[1])) durationEnd: dateToISO(new Date(duration.value[1]))
}) })
.then((res) => { .then(() => {
success($q, 'บันทึกข้อมูลร่างสำเร็จ') success($q, 'บันทึกข้อมูลร่างสำเร็จ')
}) })
.catch((e) => { .catch(() => {
// modalError.value = true // modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้' // modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message // modalErrorDetail.value = e.response.data.message
statusCode.value = e.response.data.status // statusCode.value = e.response.data.status
}) })
.finally(async () => { .finally(async () => {
edit.value = false loader.value = false
edit.value = false edit.value = false
modal.value = false modal.value = false
await fetchData() await fetchData()
@ -588,7 +589,6 @@ const selectData = (props: DataProps) => {
const addRow = () => { const addRow = () => {
modalEdit.value = false modalEdit.value = false
modal.value = true modal.value = true
// edit.value = true
educationLevel.value = '' educationLevel.value = ''
educationLevelId.value = '' educationLevelId.value = ''
major.value = '' major.value = ''

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

@ -2,35 +2,37 @@
<template> <template>
<Information <Information
:prefixOptions="prefixOptions" :prefixOptions="prefixOptions"
:genderOptions="genderOptions" :relationshipOptions="relationshipOptions"
:bloodOptions="bloodOptions"
:statusOptions="statusOptions"
:religionOptions="religionOptions"
:provinceOptions="provinceOptions" :provinceOptions="provinceOptions"
v-model:statusEdit="statusEdit" v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit" :notiNoEdit="notiNoEdit"
:step="step" :status="status"
/>
<Address
:provinceOptions="provinceOptions"
v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit"
:status="status"
/> />
<Address v-model:statusEdit="statusEdit" :notiNoEdit="notiNoEdit" :step="step" />
<Family <Family
:prefixOptions="prefixOptions" :prefixOptions="prefixOptions"
v-model:statusEdit="statusEdit" v-model:statusEdit="statusEdit"
:notiNoEdit="notiNoEdit" :notiNoEdit="notiNoEdit"
:step="step" :status="status"
/> />
<Occupation v-model:statusEdit="statusEdit" :notiNoEdit="notiNoEdit" :step="step" /> <Occupation v-model:statusEdit="statusEdit" :notiNoEdit="notiNoEdit" :status="status" />
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, watch } from 'vue' import { ref, onMounted, watch } from 'vue'
import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http'
import config from '@/app.config'
import type { DataOption } from '@/modules/01_exam/interface/index/Main' import type { DataOption } from '@/modules/01_exam/interface/index/Main'
import Information from '@/modules/01_exam/components/Form/Profile/Information.vue' import Information from '@/modules/01_exam/components/Form/Profile/Information.vue'
import Address from '@/modules/01_exam/components/Form/Profile/Address.vue' import Address from '@/modules/01_exam/components/Form/Profile/Address.vue'
import Family from '@/modules/01_exam/components/Form/Profile/Family.vue' import Family from '@/modules/01_exam/components/Form/Profile/Family.vue'
import Occupation from '@/modules/01_exam/components/Form/Profile/Occupation.vue' import Occupation from '@/modules/01_exam/components/Form/Profile/Occupation.vue'
import http from '@/plugins/http'
import config from '@/app.config'
import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
const props = defineProps({ const props = defineProps({
loader: { loader: {
@ -42,8 +44,8 @@ const props = defineProps({
type: Boolean, type: Boolean,
required: true required: true
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
@ -54,10 +56,7 @@ const { modalError } = mixin
const loader = ref<boolean>(true) const loader = ref<boolean>(true)
const statusEdit = ref<boolean>(false) const statusEdit = ref<boolean>(false)
const prefixOptions = ref<DataOption[]>([]) const prefixOptions = ref<DataOption[]>([])
const bloodOptions = ref<DataOption[]>([]) const relationshipOptions = ref<DataOption[]>([])
const genderOptions = ref<DataOption[]>([])
const statusOptions = ref<DataOption[]>([])
const religionOptions = ref<DataOption[]>([])
const provinceOptions = ref<DataOption[]>([]) const provinceOptions = ref<DataOption[]>([])
const emit = defineEmits(['update:loader', 'update:statusEdit']) const emit = defineEmits(['update:loader', 'update:statusEdit'])
@ -66,6 +65,68 @@ watch(statusEdit, (count: boolean, prevCount: boolean) => {
emit('update:statusEdit', count) emit('update:statusEdit', count)
}) })
onMounted(() => {
fetchPrefix()
fetchRelationship()
fetchProvince()
})
const fetchPrefix = async () => {
loader.value = true
await http
.get(config.API.prefix)
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
data.map((r: any) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})
prefixOptions.value = option
})
.catch((e) => {})
.finally(() => {
loader.value = false
})
}
const fetchRelationship = async () => {
loader.value = true
await http
.get(config.API.relationship)
.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() })
})
relationshipOptions.value = option
})
.catch((e) => {})
.finally(() => {
loader.value = false
})
}
const fetchProvince = async () => {
loader.value = true
await http
.get(config.API.province)
.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() })
})
provinceOptions.value = option
})
.catch((e) => {})
.finally(() => {
loader.value = false
})
}
const notiNoEdit = () => { const notiNoEdit = () => {
modalError($q, 'ไม่สามารถไม่สามารถแก้ไขข้อมูลได้', 'มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล') modalError($q, 'ไม่สามารถไม่สามารถแก้ไขข้อมูลได้', 'มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล')
} }

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

@ -10,7 +10,7 @@
:editOnly="false" :editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
:disable="statusEdit" :disable="statusEdit"
/> />
<q-form ref="myform"> <q-form ref="myform">
@ -227,35 +227,23 @@
</q-dialog> </q-dialog>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, watch } from 'vue' import { ref, onMounted } from 'vue'
import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin' import { useCounterMixin } from '@/stores/mixin'
import type { PropType } from 'vue'
import http from '@/plugins/http' import http from '@/plugins/http'
import config from '@/app.config' import config from '@/app.config'
import type { Address, DataOption, zipCodeOption } from '@/modules/01_exam/interface/index/Main' 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 } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue' import HeaderTop from '@/components/top.vue'
import Conference from '@/modules/01_exam/components/Conference.vue' import Conference from '@/modules/01_exam/components/Conference.vue'
import { useExamDataStore } from '@/modules/01_exam/store'
const mixin = useCounterMixin()
const store = useExamDataStore()
const { date2Thai, calAge } = mixin
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const edit = ref<boolean>(false)
const addressData = ref<Address>(defaultAddress)
const myform = ref<any>()
const codep = ref<string>('')
const codec = ref<string>('')
const modalConsend = ref<boolean>(false)
const provinceOptions = ref<DataOption[]>([])
const districtOptions = ref<DataOption[]>([])
const districtCOptions = ref<DataOption[]>([])
const subdistrictOptions = ref<zipCodeOption[]>([])
const subdistrictCOptions = ref<zipCodeOption[]>([])
const props = defineProps({ const props = defineProps({
provinceOptions: {
type: Array as PropType<DataOption[]>,
required: true
},
statusEdit: { statusEdit: {
type: Boolean, type: Boolean,
required: true required: true
@ -264,22 +252,37 @@ const props = defineProps({
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
const $q = useQuasar()
const mixin = useCounterMixin()
const store = useExamDataStore()
const { success } = mixin
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const edit = ref<boolean>(false)
const addressData = ref<Address>(defaultAddress)
const myform = ref<any>()
const modalConsend = ref<boolean>(false)
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'])
onMounted(async () => { onMounted(async () => {
await fetchData() await fetchData()
await fetchProvince()
await fetchDistrict(addressData.value.provinceId, '1') await fetchDistrict(addressData.value.provinceId, '1')
await fetchDistrict(addressData.value.provinceIdC, '2') await fetchDistrict(addressData.value.provinceIdC, '2')
await fetchSubDistrict(addressData.value.districtId, '1') await fetchSubDistrict(addressData.value.districtId, '1')
await fetchSubDistrict(addressData.value.districtIdC, '2') await fetchSubDistrict(addressData.value.districtIdC, '2')
}) })
const fetchData = async () => { const fetchData = async () => {
await http await http
.get(config.API.candidateAddress(candidateId.value)) .get(config.API.candidateAddress(candidateId.value))
@ -296,51 +299,78 @@ const fetchData = async () => {
addressData.value.code = data.registZipCode addressData.value.code = data.registZipCode
addressData.value.codeC = data.currentZipCode addressData.value.codeC = data.currentZipCode
addressData.value.same = data.registSame == true ? '1' : '0' addressData.value.same = data.registSame == true ? '1' : '0'
// informaData.value = data
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
// loader.value = false; // loader.value = false;
}) })
} }
const saveData = async () => { const saveData = async () => {
if (store.consend == true) { await myform.value.validate().then(async (suc: boolean) => {
edit.value = false if (suc) {
emit('update:statusEdit', false) if (store.consend == true) {
} else { loader.value = true
modalConsend.value = true await http
} .post(config.API.candidateAddress(candidateId.value), {
} registAddress: addressData.value.address,
currentAddress: addressData.value.addressC,
const changeBtn = async () => { registProvinceId: addressData.value.provinceId,
await myform.value.validate().then(async (success: boolean) => { currentProvinceId: addressData.value.provinceIdC,
if (success) { registDistrictId: addressData.value.districtId,
if (edit.value == true) { currentDistrictId: addressData.value.districtIdC,
if (props.statusEdit === true) { registSubDistrictId: addressData.value.subdistrictId,
edit.value = false currentSubDistrictId: addressData.value.subdistrictIdC,
props.notiNoEdit() registZipCode: addressData.value.code,
} else { currentZipCode: addressData.value.codeC,
emit('update:statusEdit', true) registSame:
} addressData.value.same == '1' ? true : addressData.value.same == '0' ? false : null
})
.then(() => {
success($q, 'บันทึกข้อมูลที่อยู่สำเร็จ')
edit.value = false
emit('update:statusEdit', false)
})
.catch(() => {
// modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message
// statusCode.value = e.response.data.status
})
.finally(async () => {
loader.value = false
await fetchData()
})
} else { } else {
emit('update:statusEdit', false) modalConsend.value = true
} }
} }
}) })
} }
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false
props.notiNoEdit()
} else {
emit('update:statusEdit', true)
}
} else {
emit('update:statusEdit', false)
}
}
const selectProvince = (e: string, name: string) => { const selectProvince = (e: string, name: string) => {
if (name == '1') { if (name == '1') {
addressData.value.districtId = '' addressData.value.districtId = ''
addressData.value.subdistrictId = '' addressData.value.subdistrictId = ''
codep.value = '' addressData.value.code = null
} else { } else {
addressData.value.districtIdC = '' addressData.value.districtIdC = ''
addressData.value.subdistrictIdC = '' addressData.value.subdistrictIdC = ''
codec.value = '' addressData.value.codeC = null
} }
myform.value.resetValidation() myform.value.resetValidation()
fetchDistrict(e, name) fetchDistrict(e, name)
} }
@ -348,59 +378,36 @@ const selectProvince = (e: string, name: string) => {
const selectDistrict = (e: string, name: string) => { const selectDistrict = (e: string, name: string) => {
if (name == '1') { if (name == '1') {
addressData.value.subdistrictId = '' addressData.value.subdistrictId = ''
codep.value = '' addressData.value.code = null
} else { } else {
addressData.value.subdistrictIdC = '' addressData.value.subdistrictIdC = ''
codec.value = '' addressData.value.codeC = null
} }
myform.value.resetValidation() myform.value.resetValidation()
fetchSubDistrict(e, name) fetchSubDistrict(e, name)
} }
const selectSubDistrict = (e: string, name: string) => { const selectSubDistrict = (e: string, name: string) => {
console.log('zxc')
if (name == '1') { if (name == '1') {
const findcode = subdistrictOptions.value.filter((r) => r.id == e) const findcode = subdistrictOptions.value.filter((r) => r.id == e)
const namecode = findcode.length > 0 ? findcode[0].zipCode : '' const namecode = findcode.length > 0 ? findcode[0].zipCode : null
codep.value = namecode addressData.value.code = namecode
} else { } else {
const findcode = subdistrictCOptions.value.filter((r) => r.id == e) const findcode = subdistrictCOptions.value.filter((r) => r.id == e)
const namecode = findcode.length > 0 ? findcode[0].zipCode : '' const namecode = findcode.length > 0 ? findcode[0].zipCode : null
codec.value = namecode addressData.value.codeC = namecode
} }
// myform.value.resetValidation();
// fetchSubDistrict(e, name);
}
const fetchProvince = async () => {
// loader.value = true;
await http
.get(config.API.province)
.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() })
})
provinceOptions.value = option
})
.catch((e: any) => {})
.finally(() => {
// loader.value = false;
})
} }
const fetchDistrict = async (id: string, position: string) => { const fetchDistrict = async (id: string, position: string) => {
// loader.value = true; loader.value = true
await http await http
.get(config.API.listDistrict(id)) .get(config.API.listDistrict(id))
.then((res) => { .then((res) => {
const data = res.data.result const data = res.data.result
let option: DataOption[] = [] let option: DataOption[] = []
// console.log(data); data.map((r: DataOption) => {
data.map((r: any) => {
option.push({ id: r.id.toString(), name: r.name.toString() }) option.push({ id: r.id.toString(), name: r.name.toString() })
}) })
if (position == '1') { if (position == '1') {
@ -409,25 +416,24 @@ const fetchDistrict = async (id: string, position: string) => {
districtCOptions.value = option districtCOptions.value = option
} }
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
// loader.value = false; loader.value = false
}) })
} }
const fetchSubDistrict = async (id: string, position: string) => { const fetchSubDistrict = async (id: string, position: string) => {
// loader.value = true; loader.value = true
await http await http
.get(config.API.listSubDistrict(id)) .get(config.API.listSubDistrict(id))
.then((res) => { .then((res) => {
const data = res.data.result const data = res.data.result
let option: zipCodeOption[] = [] let option: DataOption[] = []
// console.log(res); data.map((r: DataOption) => {
data.map((r: any) => {
option.push({ option.push({
id: r.id.toString(), id: r.id.toString(),
name: r.name.toString(), name: r.name.toString(),
zipCode: r.zipCode.toString() zipCode: r.zipCode != null ? r.zipCode : null
}) })
}) })
if (position == '1') { if (position == '1') {
@ -436,9 +442,9 @@ const fetchSubDistrict = async (id: string, position: string) => {
subdistrictCOptions.value = option subdistrictCOptions.value = option
} }
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
// loader.value = false; loader.value = false
}) })
} }

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

@ -10,7 +10,7 @@
:editOnly="false" :editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
:disable="statusEdit" :disable="statusEdit"
/> />
<q-form ref="myform" class="col-12"> <q-form ref="myform" class="col-12">
@ -52,7 +52,7 @@
emit-value emit-value
map-options map-options
option-label="name" option-label="name"
:options="prefixRelationOptions" :options="prefixOptions"
option-value="id" option-value="id"
:label="`${'คำนำหน้า'}`" :label="`${'คำนำหน้า'}`"
/> />
@ -130,7 +130,7 @@
emit-value emit-value
map-options map-options
option-label="name" option-label="name"
:options="prefixDadOptions" :options="prefixOptions"
option-value="id" option-value="id"
:label="`${'คำนำหน้า'}`" :label="`${'คำนำหน้า'}`"
/> />
@ -208,7 +208,7 @@
emit-value emit-value
map-options map-options
option-label="name" option-label="name"
:options="prefixMomOptions" :options="prefixOptions"
option-value="id" option-value="id"
:label="`${'คำนำหน้า'}`" :label="`${'คำนำหน้า'}`"
/> />
@ -280,37 +280,16 @@
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref, watch } from 'vue' import { onMounted, ref, watch } from 'vue'
import type { PropType } from 'vue'
import { useQuasar } from 'quasar' import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin' 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 type { Family, DataOption } from '@/modules/01_exam/interface/index/Main'
import { defaultFamily } from '@/modules/01_exam/interface/index/Main' import { defaultFamily } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue' import HeaderTop from '@/components/top.vue'
import Conference from '@/modules/01_exam/components/Conference.vue' import Conference from '@/modules/01_exam/components/Conference.vue'
import { useExamDataStore } from '@/modules/01_exam/store'
import http from '@/plugins/http'
import config from '@/app.config'
const $q = useQuasar()
const mixin = useCounterMixin()
const store = useExamDataStore()
const { date2Thai, calAge, success } = mixin
const prefixDadOptions = ref<DataOption[]>([])
const prefixMomOptions = ref<DataOption[]>([])
const prefixRelationOptions = ref<DataOption[]>([])
const edit = ref<boolean>(false)
const myform = ref<any>()
const familyData = ref<Family>(defaultFamily)
const statusOptions = ref<DataOption[]>([])
const modalConsend = ref<boolean>(false)
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const loader = ref<boolean>(false)
// const prefixOptions = ref<any>([
// { id: "1", name: "นาย" },
// { id: "2", name: "นาง" },
// { id: "3", name: "นางสาว" },
// ]);
const props = defineProps({ const props = defineProps({
prefixOptions: { prefixOptions: {
@ -325,20 +304,29 @@ const props = defineProps({
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
const $q = useQuasar()
const mixin = useCounterMixin()
const store = useExamDataStore()
const { success } = mixin
const edit = ref<boolean>(false)
const myform = ref<any>()
const familyData = ref<Family>(defaultFamily)
const modalConsend = ref<boolean>(false)
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const loader = ref<boolean>(false)
const emit = defineEmits(['update:statusEdit']) const emit = defineEmits(['update:statusEdit'])
onMounted(async () => { onMounted(async () => {
await fetchData() await fetchData()
await fetchprefixMom()
await fetchprefixDad()
await fetchprefixRelation()
}) })
const fetchData = async () => { const fetchData = async () => {
loader.value = true loader.value = true
await http await http
@ -362,69 +350,15 @@ const fetchData = async () => {
familyData.value.nationalityF = data.motherNationality familyData.value.nationalityF = data.motherNationality
familyData.value.same = data.marry == true ? '1' : data.marry == false ? '0' : null familyData.value.same = data.marry == true ? '1' : data.marry == false ? '0' : null
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
loader.value = false loader.value = false
}) })
} }
const fetchprefixMom = async () => {
// loader.value = true;
await http
.get(config.API.prefix)
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
data.map((r: DataOption) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})
prefixMomOptions.value = option
})
.catch((e) => {})
.finally(() => {
// loader.value = false;
})
}
const fetchprefixDad = async () => {
// loader.value = true;
await http
.get(config.API.prefix)
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
data.map((r: DataOption) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})
prefixDadOptions.value = option
})
.catch((e) => {})
.finally(() => {
// loader.value = false;
})
}
const fetchprefixRelation = async () => {
// loader.value = true;
await http
.get(config.API.prefix)
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
data.map((r: DataOption) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})
prefixRelationOptions.value = option
})
.catch((e) => {})
.finally(() => {
// loader.value = false;
})
}
const saveData = async () => { const saveData = async () => {
await myform.value.validate().then(async (success: boolean) => { await myform.value.validate().then(async (suc: boolean) => {
if (success) { if (suc) {
if (store.consend == true) { if (store.consend == true) {
loader.value = true loader.value = true
await http await http
@ -446,18 +380,19 @@ const saveData = async () => {
motherNationality: familyData.value.nationalityF, motherNationality: familyData.value.nationalityF,
marry: familyData.value.same == '1' ? true : familyData.value.same == '0' ? false : null marry: familyData.value.same == '1' ? true : familyData.value.same == '0' ? false : null
}) })
.then((res) => { .then(() => {
success($q, 'บันทึกข้อมูลครอบครัวสำเร็จ') success($q, 'บันทึกข้อมูลครอบครัวสำเร็จ')
edit.value = false edit.value = false
emit('update:statusEdit', false) emit('update:statusEdit', false)
}) })
.catch((e) => { .catch(() => {
// modalError.value = true // modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้' // modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message // modalErrorDetail.value = e.response.data.message
// statusCode.value = e.response.data.status // statusCode.value = e.response.data.status
}) })
.finally(async () => { .finally(async () => {
loader.value = false
await fetchData() await fetchData()
}) })
} else { } else {
@ -480,7 +415,7 @@ const changeBtn = async () => {
} }
} }
const selectRadio = (e: boolean, i: any) => { const selectRadio = (e: boolean) => {
if (!e) { if (!e) {
familyData.value.prefixIdC = '' familyData.value.prefixIdC = ''
familyData.value.firstnameC = '' familyData.value.firstnameC = ''

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

@ -10,7 +10,7 @@
:editOnly="false" :editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
:disable="statusEdit" :disable="statusEdit"
/> />
<q-form ref="myform" class="col-12 row"> <q-form ref="myform" class="col-12 row">
@ -25,7 +25,7 @@
:outlined="edit" :outlined="edit"
dense dense
lazy-rules lazy-rules
v-model="informaData.prefix" v-model="informaData.prefixId"
emit-value emit-value
map-options map-options
option-label="name" option-label="name"
@ -358,53 +358,24 @@
</q-dialog> </q-dialog>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, watch } from 'vue' import { ref, onMounted } from 'vue'
import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin' import { useCounterMixin } from '@/stores/mixin'
import type { PropType } from 'vue'
import { Information, DataOption } from '@/modules/01_exam/interface/index/Main'
import { defaultInformation } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue'
import http from '@/plugins/http' import http from '@/plugins/http'
import config from '@/app.config' import config from '@/app.config'
import type { file } from '@babel/types'
import Conference from '@/modules/01_exam/components/Conference.vue'
import { useExamDataStore } from '@/modules/01_exam/store' 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 HeaderTop from '@/components/top.vue'
import Conference from '@/modules/01_exam/components/Conference.vue'
const mixin = useCounterMixin()
const store = useExamDataStore()
const { date2Thai, calAge } = mixin
const prefixOptions = ref<DataOption[]>([])
const relationshipOptions = ref<DataOption[]>([])
const districtOptions = ref<DataOption[]>([])
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const edit = ref<boolean>(false)
const informaData = ref<Information>(defaultInformation)
const provinceOptions = ref<DataOption[]>([])
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 props = defineProps({ const props = defineProps({
prefixOptions: { prefixOptions: {
type: Array as PropType<DataOption[]>, type: Array as PropType<DataOption[]>,
required: true required: true
}, },
genderOptions: { relationshipOptions: {
type: Array as PropType<DataOption[]>,
required: true
},
bloodOptions: {
type: Array as PropType<DataOption[]>,
required: true
},
statusOptions: {
type: Array as PropType<DataOption[]>,
required: true
},
religionOptions: {
type: Array as PropType<DataOption[]>, type: Array as PropType<DataOption[]>,
required: true required: true
}, },
@ -420,32 +391,46 @@ const props = defineProps({
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
const $q = useQuasar()
const mixin = useCounterMixin()
const store = useExamDataStore()
const { date2Thai, calAge, success, dateToISO } = mixin
const districtOptions = ref<DataOption[]>([])
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const edit = ref<boolean>(false)
const informaData = 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'])
onMounted(async () => { onMounted(async () => {
await fetchData() await fetchData()
await fetchprefix()
await fetchrelationship()
await fetchProvince()
await fetchDistrict(informaData.value.provinceId) await fetchDistrict(informaData.value.provinceId)
}) })
const fetchData = async () => { const fetchData = async () => {
loader.value = true
await http await http
.get(config.API.candidateInformation(candidateId.value)) .get(config.API.candidateInformation(candidateId.value))
.then((res) => { .then((res) => {
const data = res.data.result const data = res.data.result
informaData.value.prefix = data.prefixId informaData.value.prefixId = data.prefixId
informaData.value.lastname = data.lastName informaData.value.lastname = data.lastName
informaData.value.provinceId = data.citizenProvinceId informaData.value.provinceId = data.citizenProvinceId
informaData.value.districtId = data.citizenDistrictId informaData.value.districtId = data.citizenDistrictId
informaData.value.birthDate = new Date(data.dateOfBirth) informaData.value.birthDate = new Date(data.dateOfBirth)
informaData.value.cardIdDate = new Date(data.dateOfBirth) informaData.value.cardIdDate = new Date(data.citizenDate)
informaData.value.cardid = data.citizenId informaData.value.cardid = data.citizenId
informaData.value.firstname = data.firstName informaData.value.firstname = data.firstName
informaData.value.relationship = data.relationshipId informaData.value.relationship = data.relationshipId
@ -454,119 +439,94 @@ const fetchData = async () => {
informaData.value.phone = data.mobilePhone informaData.value.phone = data.mobilePhone
informaData.value.tel = data.telephone informaData.value.tel = data.telephone
informaData.value.knowledge = data.knowledge informaData.value.knowledge = data.knowledge
// informaData.value = data
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
// loader.value = false; loader.value = false
}) })
} }
const selectProvince = (e: string) => {
informaData.value.districtId = ''
const selectProvince = (val: string) => {
informaData.value.districtId = ''
myform.value.resetValidation() myform.value.resetValidation()
fetchDistrict(e) fetchDistrict(val)
} }
const saveData = async () => { const saveData = async () => {
if (store.consend == true) { await myform.value.validate().then(async (suc: boolean) => {
edit.value = false if (suc) {
emit('update:statusEdit', false) if (store.consend == true) {
} else { loader.value = true
modalConsend.value = true await http
} .post(config.API.candidateInformation(candidateId.value), {
} prefixId: informaData.value.prefixId,
lastName: informaData.value.lastname,
const changeBtn = async () => { citizenProvinceId: informaData.value.provinceId,
await myform.value.validate().then(async (success: boolean) => { citizenDistrictId: informaData.value.districtId,
if (success) { dateOfBirth: dateToISO(informaData.value.birthDate),
if (edit.value == true) { citizenDate: dateToISO(informaData.value.cardIdDate),
if (props.statusEdit === true) { citizenId: informaData.value.cardid,
edit.value = false firstName: informaData.value.firstname,
props.notiNoEdit() relationshipId: informaData.value.relationship,
} else { nationality: informaData.value.nationality,
emit('update:statusEdit', true) email: informaData.value.email,
} mobilePhone: informaData.value.phone,
telephone: informaData.value.tel,
knowledge: informaData.value.knowledge
})
.then(() => {
success($q, 'บันทึกข้อมูลส่วนตัวสำเร็จ')
edit.value = false
emit('update:statusEdit', false)
})
.catch(() => {
// modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message
// statusCode.value = e.response.data.status
})
.finally(async () => {
loader.value = false
await fetchData()
})
} else { } else {
emit('update:statusEdit', false) modalConsend.value = true
} }
} }
}) })
} }
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false
props.notiNoEdit()
} else {
emit('update:statusEdit', true)
}
} else {
emit('update:statusEdit', false)
}
}
const fetchDistrict = async (id: string) => { const fetchDistrict = async (id: string) => {
// loader.value = true; loader.value = true
await http await http
.get(config.API.listDistrict(id)) .get(config.API.listDistrict(id))
.then((res) => { .then((res) => {
const data = res.data.result const data = res.data.result
let option: DataOption[] = [] let option: DataOption[] = []
// console.log(data); data.map((r: DataOption) => {
data.map((r: any) => {
option.push({ id: r.id.toString(), name: r.name.toString() }) option.push({ id: r.id.toString(), name: r.name.toString() })
}) })
districtOptions.value = option districtOptions.value = option
}) })
.catch((e: any) => {}) .catch(() => {})
.finally(() => { .finally(() => {
// loader.value = false; loader.value = false
}) })
} }
const fetchProvince = async () => {
// loader.value = true;
await http
.get(config.API.province)
.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() })
})
provinceOptions.value = option
})
.catch((e: any) => {})
.finally(() => {
// loader.value = false;
})
}
const fetchprefix = async () => {
// loader.value = true;
await http
.get(config.API.prefix)
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
data.map((r: DataOption) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})
prefixOptions.value = option
})
.catch((e) => {})
.finally(() => {
// loader.value = false;
})
}
const fetchrelationship = async () => {
// loader.value = true;
await http
.get(config.API.relationship)
.then((res) => {
const data = res.data.result
let option: DataOption[] = []
data.map((r: DataOption) => {
option.push({ id: r.id.toString(), name: r.name.toString() })
})
relationshipOptions.value = option
})
.catch((e) => {})
.finally(() => {
// loader.value = false;
})
}
const savePic = () => { const savePic = () => {
disabledPic.value = false disabledPic.value = false
} }

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

@ -10,7 +10,7 @@
:editOnly="false" :editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2" :editData="status == 'register' || status == 'rejectRegister'"
:disable="statusEdit" :disable="statusEdit"
/> />
<q-form ref="myform"> <q-form ref="myform">
@ -237,22 +237,16 @@
</q-dialog> </q-dialog>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, watch } from 'vue' import { ref, onMounted } from 'vue'
import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
import http from '@/plugins/http' import http from '@/plugins/http'
import config from '@/app.config' import config from '@/app.config'
import { useExamDataStore } from '@/modules/01_exam/store'
import type { Occupation } from '@/modules/01_exam/interface/index/Main' import type { Occupation } from '@/modules/01_exam/interface/index/Main'
import { defaultOccupation } from '@/modules/01_exam/interface/index/Main' import { defaultOccupation } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue' import HeaderTop from '@/components/top.vue'
import Conference from '@/modules/01_exam/components/Conference.vue' import Conference from '@/modules/01_exam/components/Conference.vue'
import { useExamDataStore } from '@/modules/01_exam/store'
const store = useExamDataStore()
const edit = ref<boolean>(false)
const occupationData = ref<Occupation>(defaultOccupation)
const myform = ref<any>()
const modalConsend = ref<boolean>(false)
const props = defineProps({ const props = defineProps({
statusEdit: { statusEdit: {
@ -263,42 +257,112 @@ const props = defineProps({
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
}, },
step: { status: {
type: Number, type: String,
required: true required: true
} }
}) })
const $q = useQuasar()
const mixin = useCounterMixin()
const store = useExamDataStore()
const { success } = mixin
const edit = ref<boolean>(false)
const occupationData = ref<Occupation>(defaultOccupation)
const myform = ref<any>()
const modalConsend = ref<boolean>(false)
const loader = ref<boolean>(false)
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const emit = defineEmits(['update:statusEdit']) const emit = defineEmits(['update:statusEdit'])
onMounted(() => {}) onMounted(async () => {
await fetchData()
})
const saveData = async () => { const fetchData = async () => {
if (store.consend == true) { loader.value = true
edit.value = false await http
emit('update:statusEdit', false) .get(config.API.candidateOccupation(candidateId.value))
} else { .then((res) => {
modalConsend.value = true 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 =
data.occupationType == 'official' ? data.occupationPosition : null
occupationData.value.personnel =
data.occupationType == 'personnel' ? data.occupationPosition : null
occupationData.value.officialsOther =
data.occupationType == 'officialsOther' ? data.occupationPosition : null
occupationData.value.employee =
data.occupationType == 'employee' ? data.occupationPosition : null
occupationData.value.other = data.occupationType == 'other' ? data.occupationPosition : null
})
.catch(() => {})
.finally(() => {
loader.value = false
})
} }
const changeBtn = async () => { const saveData = async () => {
await myform.value.validate().then(async (success: boolean) => { await myform.value.validate().then(async (suc: boolean) => {
if (success) { if (suc) {
if (edit.value == true) { if (store.consend == true) {
if (props.statusEdit === true) { const type = ref<string | null>('')
edit.value = false if (occupationData.value.status == 'official') type.value = occupationData.value.official
props.notiNoEdit() if (occupationData.value.status == 'personnel') type.value = occupationData.value.personnel
} else { if (occupationData.value.status == 'officialsOther')
emit('update:statusEdit', true) 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
loader.value = true
await http
.post(config.API.candidateOccupation(candidateId.value), {
occupationType: occupationData.value.status,
occupationCompany: occupationData.value.company,
occupationDepartment: occupationData.value.department,
occupationEmail: occupationData.value.email,
occupationTelephone: occupationData.value.tel,
occupationPosition: type.value
})
.then(() => {
success($q, 'บันทึกข้อมูลอาชีพสำเร็จ')
edit.value = false
emit('update:statusEdit', false)
})
.catch(() => {
// modalError.value = true
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
// modalErrorDetail.value = e.response.data.message
// statusCode.value = e.response.data.status
})
.finally(async () => {
loader.value = false
await fetchData()
})
} else { } else {
emit('update:statusEdit', false) modalConsend.value = true
} }
} }
}) })
} }
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false
props.notiNoEdit()
} else {
emit('update:statusEdit', true)
}
} else {
emit('update:statusEdit', false)
}
}
const consenClose = () => { const consenClose = () => {
modalConsend.value = false modalConsend.value = false
} }

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

@ -77,25 +77,25 @@ interface Address {
provinceId: string provinceId: string
districtId: string districtId: string
subdistrictId: string subdistrictId: string
code: number code?: number | null
addressC: string addressC: string
provinceIdC: string provinceIdC: string
districtIdC: string districtIdC: string
subdistrictIdC: string subdistrictIdC: string
codeC: number codeC?: number | null
same: string same: string
} }
interface DataOption { interface DataOption {
id: string id: string
name: string name: string
zipCode?: string zipCode?: number | null
} }
interface zipCodeOption { interface zipCodeOption {
id: string id: string
name: string name: string
zipCode: string zipCode: string | null
} }
interface ExamCard { interface ExamCard {

5
src/modules/01_exam/interface/response/Career.ts
View file

@ -1,10 +1,11 @@
//ข้อมูล //ข้อมูล
interface ResponseObject { interface ResponseObject {
id: string id: string
location: string name: string
position: string position: string
salary: number | null salary: number | null
duration: [Date, Date] durationStart: Date
durationEnd: Date
reason: string reason: string
} }

9
src/modules/01_exam/interface/response/Education.ts
View file

@ -1,12 +1,15 @@
//ข้อมูล //ข้อมูล
interface ResponseObject { interface ResponseObject {
id: string id: string
qualificationId: string educationLevel: {
qualification: string id: string
name: string
}
major: string major: string
scores: number | null scores: number | null
name: string name: string
duration: [Date, Date] durationStart: Date
durationEnd: Date
} }
export type { ResponseObject } export type { ResponseObject }

91
src/modules/01_exam/views/ExamDetail.vue
View file

@ -31,7 +31,7 @@
stepRaw >= 1 ? (stepRaw == 1 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil' stepRaw >= 1 ? (stepRaw == 1 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'
" "
> >
<ExamDetail :fetchStep="fetchStep" :step="stepRaw" /> <ExamDetail :fetchStep="fetchStep" :status="status" />
</q-step> --> </q-step> -->
<q-step <q-step
:done="step > 2" :done="step > 2"
@ -40,7 +40,7 @@
title="ข้อมูลสมัครสอบ" title="ข้อมูลสมัครสอบ"
:icon="stepRaw >= 2 ? (stepRaw == 2 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'" :icon="stepRaw >= 2 ? (stepRaw == 2 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'"
> >
<ExamForm :fetchStep="fetchStep" :step="stepRaw" /> <ExamForm :fetchStep="fetchStep" :status="status" />
</q-step> </q-step>
<q-step <q-step
:done="step > 3" :done="step > 3"
@ -49,7 +49,7 @@
title="ชำระค่าธรรมเนียมการสอบ" title="ชำระค่าธรรมเนียมการสอบ"
:icon="stepRaw >= 3 ? (stepRaw == 3 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'" :icon="stepRaw >= 3 ? (stepRaw == 3 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'"
> >
<ExamPayment :fetchStep="fetchStep" :step="stepRaw" /> <ExamPayment :fetchStep="fetchStep" :status="status" />
</q-step> </q-step>
<q-step <q-step
:done="step > 4" :done="step > 4"
@ -58,7 +58,7 @@
title="สำเร็จ" title="สำเร็จ"
:icon="stepRaw >= 4 ? 'mdi-check-bold' : 'mdi-pencil'" :icon="stepRaw >= 4 ? 'mdi-check-bold' : 'mdi-pencil'"
> >
<ExamFinished :fetchStep="fetchStep" :step="stepRaw" /> <ExamFinished :fetchStep="fetchStep" :status="status" />
</q-step> </q-step>
</q-stepper> </q-stepper>
</div> </div>
@ -67,38 +67,36 @@
<script setup lang="ts"> <script setup lang="ts">
import { onMounted, ref } from 'vue' import { onMounted, ref } from 'vue'
import ExamDetail from '@/modules/01_exam/components/ExamDetail.vue' import { useQuasar } from 'quasar'
import { useExamDataStore } from '@/modules/01_exam/store'
import keycloak from '@/plugins/keycloak'
import http from '@/plugins/http'
import config from '@/app.config'
import ExamForm from '@/modules/01_exam/components/ExamForm.vue' import ExamForm from '@/modules/01_exam/components/ExamForm.vue'
import ExamPayment from '@/modules/01_exam/components/ExamPayment.vue' import ExamPayment from '@/modules/01_exam/components/ExamPayment.vue'
import ExamFinished from '@/modules/01_exam/components/ExamFinished.vue' import ExamFinished from '@/modules/01_exam/components/ExamFinished.vue'
import keycloak from '@/plugins/keycloak'
import { useQuasar } from 'quasar'
import { useExamDataStore } from '@/modules/01_exam/store'
import http from '@/plugins/http'
import config from '@/app.config'
const $q = useQuasar() const $q = useQuasar()
const store = useExamDataStore() const store = useExamDataStore()
const examId = ref<string>('zxc') const step = ref<number>(1)
const step = ref<number>(2) const stepRaw = ref<number>(1)
const stepRaw = ref<number>(2)
const examPost = ref<any>()
const tittle = ref<string>('การสอบภาค ข. พิเศษ สำหรับผู้สอบผ่านของส่วนราชการแล้ว ทดสอบ') const tittle = ref<string>('การสอบภาค ข. พิเศษ สำหรับผู้สอบผ่านของส่วนราชการแล้ว ทดสอบ')
const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331') const candidateId = ref<string>('2223ba53-2fb2-470b-8dc1-27e5471b0331')
const loader = ref<boolean>(false) const loader = ref<boolean>(false)
const status = ref<string>('')
onMounted(() => { onMounted(async () => {
candidateCheck() await candidateCheck()
fetchExams()
}) })
const candidateCheck = async () => { const candidateCheck = async () => {
loader.value = true loader.value = true
await http await http
.get(config.API.candidateCheckCreate(candidateId.value)) .get(config.API.candidateCheckCreate(candidateId.value))
.then((res) => { .then(async (res) => {
const data = res.data.result const data = res.data.result
store.consend = data store.consend = data
if (store.consend == true) await fetchStep()
}) })
.catch(() => {}) .catch(() => {})
.finally(() => { .finally(() => {
@ -106,26 +104,43 @@ const candidateCheck = async () => {
}) })
} }
const fetchExams = () => { const fetchStep = async () => {
// const headers = { 'Content-Type': 'application/graphql' } loader.value = true
// this.loading = true await http
// this.$http .get(config.API.candidateStatus(candidateId.value))
// .post( .then((res) => {
// this.$config.API.getOrchardPath(), const data = res.data.result
// this.$config.API.getExamPostsForExamDetailQuery(this.$route.params.examId), status.value = data
// { headers } if (data == 'register') {
// ) stepRaw.value = 2
// .then((response) => { step.value = 2
// this.examPost = response.data.data.examPost[0] } else if (data == 'checkRegister') {
// this.test = this.examPost.bag.contentItems stepRaw.value = 3
// }) step.value = 3
// .catch((err) => console.log(err)) } else if (data == 'payment') {
// .finally(() => (this.loading = false)) stepRaw.value = 3
} step.value = 3
} else if (data == 'rejectRegister') {
const fetchStep = () => { stepRaw.value = 2
stepRaw.value += 1 step.value = 2
step.value += 1 } else if (data == 'checkPayment') {
stepRaw.value = 3
step.value = 3
} else if (data == 'rejectPayment') {
stepRaw.value = 3
step.value = 3
} else if (data == 'checkSeat') {
stepRaw.value = 4
step.value = 4
} else if (data == 'done') {
stepRaw.value = 4
step.value = 4
}
})
.catch(() => {})
.finally(() => {
loader.value = false
})
} }
/** /**