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

ลบ tab คำชี้แจง

Browse source
This commit is contained in:
Kittapath 2023-03-21 12:06:30 +07:00
parent 302354b3de
commit cc6a672000
13 changed files with 205 additions and 218 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/components/DialogFooter.vue
View file

@ -19,7 +19,7 @@
:color="!next ? 'grey-7' : 'public'" :color="!next ? 'grey-7' : 'public'"
/> />
<q-space /> <q-space />
<div v-if="editBtn"> <div v-if="editData">
<q-btn <q-btn
v-if="!editvisible" v-if="!editvisible"
flat flat
@ -66,7 +66,7 @@ const props = defineProps({
next: Boolean, next: Boolean,
previous: Boolean, previous: Boolean,
modalEdit: Boolean, modalEdit: Boolean,
editBtn: { editData: {
type: Boolean, type: Boolean,
default: true default: true
}, },

41
src/components/NotifyError.vue
View file

@ -1,9 +1,5 @@
<template> <template>
<q-dialog <q-dialog :model-value="modalError" persistent @update:model-value="updateClose">
:model-value="modalError"
persistent
@update:model-value="updateClose"
>
<q-card class="q-pa-sm"> <q-card class="q-pa-sm">
<q-card-section class="row items-center"> <q-card-section class="row items-center">
<div class="q-pr-md"> <div class="q-pr-md">
@ -16,25 +12,20 @@
/> />
</div> </div>
<div class="col text-dark"> <div class="col text-dark">
<span class="text-bold">{{ modalErrorTittle }}</span> <span class="text-bold text-red">{{ modalErrorTittle }}</span>
<br /> <br />
<span>{{ modalErrorDetail }}</span> <span>{{ modalErrorDetail }}</span>
</div> </div>
</q-card-section> </q-card-section>
<q-card-actions align="right" class="bg-white text-teal"> <q-card-actions align="right" class="bg-white text-teal">
<q-btn <q-btn label="ตกลง" color="primary" @click="updateClose" v-close-popup />
label="ตกลง"
color="primary"
@click="updateClose"
v-close-popup
/>
</q-card-actions> </q-card-actions>
</q-card> </q-card>
</q-dialog> </q-dialog>
</template> </template>
<script setup lang="ts"> <script setup lang="ts">
import { ref, useAttrs } from "vue"; import { ref, useAttrs } from 'vue'
const props = defineProps({ const props = defineProps({
modalError: Boolean, modalError: Boolean,
@ -42,22 +33,22 @@ const props = defineProps({
modalErrorDetail: String, modalErrorDetail: String,
close: { close: {
type: Function, type: Function,
default: () => console.log("not function"), default: () => console.log('not function')
}, }
}); })
const emit = defineEmits([ const emit = defineEmits([
"update:modalError", 'update:modalError',
"update:modalErrorTittle", 'update:modalErrorTittle',
"update:modalErrorDetail", 'update:modalErrorDetail'
]); ])
const updateClose = () => { const updateClose = () => {
emit("update:modalError", false); emit('update:modalError', false)
emit("update:modalErrorTittle", ""); emit('update:modalErrorTittle', '')
emit("update:modalErrorDetail", ""); emit('update:modalErrorDetail', '')
props.close(); props.close()
}; }
</script> </script>
<style lang="scss"> <style lang="scss">
.icon-color { .icon-color {

8
src/components/Table.vue
View file

@ -8,8 +8,9 @@
:add="clickAdd" :add="clickAdd"
:editBtn="clickEdit" :editBtn="clickEdit"
:cancel="clickCancel" :cancel="clickCancel"
:history="false"
:addData="false" :addData="false"
:editOnly="false"
:editData="editData"
/> />
<!-- v-if="nameHeader" --> <!-- v-if="nameHeader" -->
<!-- <div class="q-pl-sm"> <!-- <div class="q-pl-sm">
@ -126,6 +127,11 @@ const props = defineProps({
validate: { validate: {
type: Function, type: Function,
default: () => console.log('not function') default: () => console.log('not function')
},
editData: {
type: Boolean,
defualt: true,
required: true
} }
}) })

165
src/components/top.vue
View file

@ -6,81 +6,79 @@
{{ header }} {{ header }}
</div> </div>
</div> </div>
<div class="q-gutter-sm q-mx-sm" v-if="addData == true"> <div v-if="editData == true">
<q-btn <div class="q-gutter-sm q-mx-sm" v-if="addData == true">
size="12px" <q-btn
v-if="!edit" size="12px"
flat v-if="!edit"
round flat
:disabled="edit" round
:color="edit ? 'grey-7' : 'primary'" :disabled="disable"
@click="ClickEdit" :color="edit ? 'grey-7' : 'primary'"
icon="mdi-pencil-outline" @click="ClickEdit"
> icon="mdi-pencil-outline"
<q-tooltip>แก้ไขข้อมูล</q-tooltip> >
</q-btn> <q-tooltip>แก้ไขข้อมูล</q-tooltip>
<q-btn </q-btn>
size="12px" <q-btn
flat size="12px"
round flat
v-if="edit" round
:disabled="!edit" v-if="edit && !editOnly"
:color="!edit ? 'grey-7' : 'public'" :color="!edit ? 'grey-7' : 'public'"
@click="save" @click="save"
icon="mdi-content-save-outline" icon="mdi-content-save-outline"
> >
<q-tooltip>บันทึกข้อมูล</q-tooltip> <q-tooltip>บันทึกข้อมูล</q-tooltip>
</q-btn> </q-btn>
<q-btn <q-btn
size="12px" size="12px"
flat flat
round round
v-if="edit" v-if="edit"
:disabled="!edit" :color="!edit ? 'grey-7' : 'red'"
:color="!edit ? 'grey-7' : 'red'" @click="ClickCancel"
@click="ClickCancel" icon="mdi-undo"
icon="mdi-undo" >
> <q-tooltip>ยกเลิก</q-tooltip>
<q-tooltip>ยกเลิก</q-tooltip> </q-btn>
</q-btn> </div>
</div> <div class="q-pl-sm" v-else>
<div class="q-pl-sm" v-else> <q-btn
<q-btn size="12px"
size="12px" v-if="!edit"
v-if="!edit" flat
flat round
round :disabled="disable"
:disabled="edit" :color="edit ? 'grey-7' : 'primary'"
:color="edit ? 'grey-7' : 'primary'" @click="ClickEdit"
@click="ClickEdit" icon="mdi-pencil-outline"
icon="mdi-pencil-outline" >
> <q-tooltip>แก้ไขข้อมูล</q-tooltip>
<q-tooltip>แก้ไขข้อมูล</q-tooltip> </q-btn>
</q-btn> <q-btn
<q-btn size="12px"
size="12px" flat
flat round
round v-if="edit && !editOnly"
v-if="edit" :color="!edit ? 'grey-7' : 'add'"
:disabled="!edit" @click="add"
:color="!edit ? 'grey-7' : 'add'" icon="mdi-plus"
@click="add" >
icon="mdi-plus" <q-tooltip>เพิ่มข้อมูล</q-tooltip>
> </q-btn>
<q-tooltip>เพิ่มข้อมูล</q-tooltip> <q-btn
</q-btn> size="12px"
<q-btn flat
size="12px" round
flat v-if="edit"
round :color="!edit ? 'grey-7' : 'red'"
v-if="edit" @click="ClickCancel"
:disabled="!edit" icon="mdi-undo"
:color="!edit ? 'grey-7' : 'red'" >
@click="ClickCancel" <q-tooltip>ยกเลิก</q-tooltip>
icon="mdi-undo" </q-btn>
> </div>
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn>
</div> </div>
<q-space /> <q-space />
</div> </div>
@ -104,7 +102,22 @@ const props = defineProps({
}, },
addData: { addData: {
type: Boolean, type: Boolean,
defualt: true defualt: true,
required: true
},
editData: {
type: Boolean,
defualt: true,
required: true
},
editOnly: {
type: Boolean,
defualt: false,
required: true
},
disable: {
type: Boolean,
defualt: false
}, },
add: { add: {
type: Function, type: Function,

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

@ -1,46 +1,51 @@
<!-- step กรอกข้อมูล --> <!-- step กรอกข้อมูล -->
<template> <template>
<div> <div>
<q-tabs <q-splitter v-model="splitterModel" style="height: 500px">
v-model="tab" <template v-slot:before>
dense <q-tab-panels
class="" v-model="tab"
active-color="primary" animated
indicator-color="primary" swipeable
align="justify" vertical
@update:model-value="changeTab" transition-prev="jump-up"
> transition-next="jump-up"
<q-tab name="profile" label="ข้อมูลส่วนบุคคล" /> >
<q-tab name="education" label="ประวัติการศีกษา" /> <!-- ข้อมูลส่วนบุคคล -->
<q-tab name="career" label="ประวัติการทำงาน/ฝึกงาน" /> <q-tab-panel name="profile">
<q-tab name="document" label="เอกสาร" /> <Profile :loader="loader" v-model:statusEdit="statusEdit" :step="step" />
</q-tabs> </q-tab-panel>
<q-tab-panels v-model="tab" animated class="bg-white">
<!-- ข้อมูลส่วนบุคคล -->
<q-tab-panel name="profile">
<Profile :loader="loader" v-model:statusEdit="statusEdit" :step="step" />
</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" :step="step"
/></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" :step="step"
/></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" :step="step" />
</q-tab-panel> </q-tab-panel>
</q-tab-panels> </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>
<div> <div>
<q-checkbox <q-checkbox
v-model="acceptTermOfUse" v-model="acceptTermOfUse"
:disable="step !== 2" :disable="step !== 2 || statusEdit"
v-if="step !== 2 || tab == 'document'" v-if="step !== 2 || tab == 'document'"
label="ข้าพเจ้ารับรองว่า ข้าพเจ้ามีคุณสมบัติครบถ้วนตามประกาศรับสมัคร ข้อความข้างต้นตรงตามความจริงทุกประการ" label="ข้าพเจ้ารับรองว่า ข้าพเจ้ามีคุณสมบัติครบถ้วนตามประกาศรับสมัคร ข้อความข้างต้นตรงตามความจริงทุกประการ"
/> />
@ -54,6 +59,7 @@
@click="clickPreview(tab)" @click="clickPreview(tab)"
v-if="step === 2 && (tab == 'education' || tab == 'career' || tab == 'document')" v-if="step === 2 && (tab == 'education' || tab == 'career' || tab == 'document')"
icon="mdi-chevron-left" icon="mdi-chevron-left"
:disable="statusEdit"
/> />
<q-btn <q-btn
color="primary" color="primary"
@ -62,6 +68,7 @@
@click="clickNext(tab)" @click="clickNext(tab)"
v-if="step === 2 && (tab == 'profile' || tab == 'education' || tab == 'career')" v-if="step === 2 && (tab == 'profile' || tab == 'education' || tab == 'career')"
icon-right="mdi-chevron-right" icon-right="mdi-chevron-right"
:disable="statusEdit"
/> />
<q-btn <q-btn
color="primary" color="primary"
@ -69,7 +76,7 @@
label="สมัครสอบ" label="สมัครสอบ"
@click="okModalComfirm" @click="okModalComfirm"
v-if="step === 2 && tab == 'document'" v-if="step === 2 && tab == 'document'"
:disable="!acceptTermOfUse" :disable="!acceptTermOfUse || statusEdit"
/> />
</div> </div>
</div> </div>
@ -109,6 +116,7 @@ const props = defineProps({
}) })
const tab = ref<string>('profile') const tab = ref<string>('profile')
const splitterModel = ref<number>(90)
const tabRaw = ref<string>('profile') const tabRaw = ref<string>('profile')
const loader = ref<boolean>(false) const loader = ref<boolean>(false)
const statusEdit = ref<boolean>(false) const statusEdit = ref<boolean>(false)

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

@ -13,8 +13,10 @@
:add="clickAdd" :add="clickAdd"
:edit="clickEdit" :edit="clickEdit"
:cancel="clickCancel" :cancel="clickCancel"
:nameHeader="false" :addData="false"
:addData="addData" :editData="step == 2"
name="ประวัติการทำงาน/ฝึกงาน"
icon="mdi-briefcase"
> >
<template #columns="props"> <template #columns="props">
<q-tr :props="props"> <q-tr :props="props">
@ -166,7 +168,7 @@
:validate="validateData" :validate="validateData"
:clickNext="clickNext" :clickNext="clickNext"
:clickPrevious="clickPrevious" :clickPrevious="clickPrevious"
:editBtn="addData" :editData="step == 2"
v-model:editvisible="edit" v-model:editvisible="edit"
v-model:next="next" v-model:next="next"
v-model:previous="previous" v-model:previous="previous"
@ -236,8 +238,6 @@ const rowIndex = ref<number>(0) //indexข้อมูลเดิมที่
const previous = ref<boolean>() //แสดงปุ่มดูข้อมูลก่อนหน้า const previous = ref<boolean>() //แสดงปุ่มดูข้อมูลก่อนหน้า
const next = ref<boolean>() //แสดงปุ่มดูข้อมูลต่อไป const next = ref<boolean>() //แสดงปุ่มดูข้อมูลต่อไป
const editRow = ref<boolean>(false) //เช็คมีการแก้ไขข้อมูล const editRow = ref<boolean>(false) //เช็คมีการแก้ไขข้อมูล
const addData = ref<boolean>(true)
const rawHistory = ref<RequestItemsObject[]>([]) //raw data history
const modalError = ref<boolean>(false) // modal สำหรับแจ้งเตือนerror const modalError = ref<boolean>(false) // modal สำหรับแจ้งเตือนerror
const modalErrorTittle = ref<string>('') // tittle modal error const modalErrorTittle = ref<string>('') // tittle modal error
const modalErrorDetail = ref<string>('') // detail modal error const modalErrorDetail = ref<string>('') // detail modal error
@ -341,10 +341,6 @@ watch(edit, (count: boolean, prevCount: boolean) => {
onMounted(async () => { onMounted(async () => {
// await fetchData() // await fetchData()
rawHistory.value = rows.value
if (props.step !== 2) {
addData.value = false
}
}) })
const fetchData = async () => {} const fetchData = async () => {}
@ -437,6 +433,7 @@ const clickDeleteRow = (row: RequestItemsObject) => {
}) })
.onOk(() => { .onOk(() => {
rows.value = rows.value.filter((val: any) => val.id != row.id) rows.value = rows.value.filter((val: any) => val.id != row.id)
edit.value = false
}) })
.onCancel(() => {}) .onCancel(() => {})
.onDismiss(() => {}) .onDismiss(() => {})

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

@ -1,13 +1,14 @@
<!-- card เอกสารหลักฐาน --> <!-- card อัปโหลดเอกสาร -->
<template> <template>
<q-card flat bordered class="col-12 q-px-lg q-py-md"> <q-card flat bordered class="col-12 q-px-lg q-py-md">
<HeaderTop <HeaderTop
v-model:edit="edit" v-model:edit="edit"
header="เอกสารหลักฐาน(เช่น สำเนาบัตรประชาชน ทะเบียนบ้าน วุฒิการศึกษา)" header="อัปโหลดเอกสาร(เช่น สำเนาบัตรประชาชน ทะเบียนบ้าน วุฒิการศึกษา)"
icon="mdi-file-document" icon="mdi-file-document"
:history="false" :addData="true"
:addData="addData" :editOnly="true"
:cancel="cancelData" :cancel="cancelData"
:editData="step == 2"
/> />
<div class="row col-12 q-gutter-sm q-pt-sm"> <div class="row col-12 q-gutter-sm q-pt-sm">
<q-card bordered flat class="full-width"> <q-card bordered flat class="full-width">
@ -95,7 +96,6 @@ const props = defineProps({
}) })
const edit = ref<boolean>(false) const edit = ref<boolean>(false)
const addData = ref<boolean>(true)
const name = ref<string>('') const name = ref<string>('')
const files = ref<any>([ const files = ref<any>([
{ {
@ -117,11 +117,7 @@ watch(edit, (count: boolean, prevCount: boolean) => {
emit('update:statusEdit', count) emit('update:statusEdit', count)
}) })
onMounted(async () => { onMounted(async () => {})
if (props.step !== 2) {
addData.value = false
}
})
const fileUpload = async (file: any) => { const fileUpload = async (file: any) => {
return { return {

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

@ -13,8 +13,10 @@
:add="clickAdd" :add="clickAdd"
:edit="clickEdit" :edit="clickEdit"
:cancel="clickCancel" :cancel="clickCancel"
:nameHeader="false" :addData="false"
:addData="addData" :editData="step == 2"
name="ประวัติการศีกษา"
icon="mdi-school"
> >
<template #columns="props"> <template #columns="props">
<q-tr :props="props"> <q-tr :props="props">
@ -167,7 +169,7 @@
:validate="validateData" :validate="validateData"
:clickNext="clickNext" :clickNext="clickNext"
:clickPrevious="clickPrevious" :clickPrevious="clickPrevious"
:editBtn="addData" :editData="step == 2"
v-model:editvisible="edit" v-model:editvisible="edit"
v-model:next="next" v-model:next="next"
v-model:previous="previous" v-model:previous="previous"
@ -240,8 +242,6 @@ const rowIndex = ref<number>(0) //indexข้อมูลเดิมที่
const previous = ref<boolean>() //แสดงปุ่มดูข้อมูลก่อนหน้า const previous = ref<boolean>() //แสดงปุ่มดูข้อมูลก่อนหน้า
const next = ref<boolean>() //แสดงปุ่มดูข้อมูลต่อไป const next = ref<boolean>() //แสดงปุ่มดูข้อมูลต่อไป
const editRow = ref<boolean>(false) //เช็คมีการแก้ไขข้อมูล const editRow = ref<boolean>(false) //เช็คมีการแก้ไขข้อมูล
const addData = ref<boolean>(true)
const rawHistory = ref<RequestItemsObject[]>([]) //raw data history
const modalError = ref<boolean>(false) // modal สำหรับแจ้งเตือนerror const modalError = ref<boolean>(false) // modal สำหรับแจ้งเตือนerror
const modalErrorTittle = ref<string>('') // tittle modal error const modalErrorTittle = ref<string>('') // tittle modal error
const modalErrorDetail = ref<string>('') // detail modal error const modalErrorDetail = ref<string>('') // detail modal error
@ -347,10 +347,6 @@ watch(edit, (count: boolean, prevCount: boolean) => {
onMounted(async () => { onMounted(async () => {
// await fetchData() // await fetchData()
// await fetchQualification() // await fetchQualification()
rawHistory.value = rows.value
if (props.step !== 2) {
addData.value = false
}
}) })
const fetchQualification = async () => { const fetchQualification = async () => {
@ -464,6 +460,7 @@ const clickDeleteRow = (row: RequestItemsObject) => {
}) })
.onOk(() => { .onOk(() => {
rows.value = rows.value.filter((val: any) => val.id != row.id) rows.value = rows.value.filter((val: any) => val.id != row.id)
edit.value = false
}) })
.onCancel(() => {}) .onCancel(() => {})
.onDismiss(() => {}) .onDismiss(() => {})

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

@ -1,21 +1,17 @@
<!-- card ข้อมูลที่อยู่ --> <!-- card ข้อมูลที่อยู่ -->
<template> <template>
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md"> <q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md">
<!-- <HeaderTop
v-model:edit="edit"
header="ข้อมูลที่อยู่"
icon="mdi-map-marker"
:save="saveData"
/> -->
<HeaderTop <HeaderTop
v-model:edit="edit" v-model:edit="edit"
header="ข้อมูลที่อยู่" header="ข้อมูลที่อยู่"
icon="mdi-map-marker" icon="mdi-map-marker"
:save="saveData" :save="saveData"
:history="true" :addData="true"
:addData="addData" :editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2"
:disable="statusEdit"
/> />
<q-form ref="myform"> <q-form ref="myform">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"> <div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
@ -239,7 +235,6 @@ const mixin = useCounterMixin()
const { date2Thai, calAge } = mixin const { date2Thai, calAge } = mixin
const edit = ref<boolean>(false) const edit = ref<boolean>(false)
const addData = ref<boolean>(true)
const addressData = ref<Address>(defaultAddress) const addressData = ref<Address>(defaultAddress)
const myform = ref<any>() const myform = ref<any>()
const codep = ref<string>('') const codep = ref<string>('')
@ -269,9 +264,6 @@ const props = defineProps({
const emit = defineEmits(['update:statusEdit']) const emit = defineEmits(['update:statusEdit'])
onMounted(() => { onMounted(() => {
if (props.step !== 2) {
addData.value = false
}
// fetchProvince() // fetchProvince()
// fetchDistrict(addressData.value.provinceId, '1') // fetchDistrict(addressData.value.provinceId, '1')
// fetchDistrict(addressData.value.provinceIdC, '2') // fetchDistrict(addressData.value.provinceIdC, '2')

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

@ -6,9 +6,12 @@
header="ข้อมูลครอบครัว" header="ข้อมูลครอบครัว"
icon="mdi-account-group" icon="mdi-account-group"
:save="saveData" :save="saveData"
:addData="addData" :addData="true"
:editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2"
:disable="statusEdit"
/> />
<q-form ref="myform" class="col-12"> <q-form ref="myform" class="col-12">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"> <div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
@ -282,7 +285,6 @@ const mixin = useCounterMixin()
const { date2Thai, calAge } = mixin const { date2Thai, calAge } = mixin
const edit = ref<boolean>(false) const edit = ref<boolean>(false)
const addData = ref<boolean>(true)
const myform = ref<any>() const myform = ref<any>()
const familyData = ref<Family>(defaultFamily) const familyData = ref<Family>(defaultFamily)
const statusOptions = ref<DataOption[]>([]) const statusOptions = ref<DataOption[]>([])
@ -314,11 +316,7 @@ const props = defineProps({
const emit = defineEmits(['update:statusEdit']) const emit = defineEmits(['update:statusEdit'])
onMounted(() => { onMounted(() => {})
if (props.step !== 2) {
addData.value = false
}
})
const saveData = async () => { const saveData = async () => {
await myform.value.validate().then(async (success: boolean) => { await myform.value.validate().then(async (success: boolean) => {

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

@ -6,9 +6,12 @@
header="ข้อมูลส่วนตัว" header="ข้อมูลส่วนตัว"
icon="mdi-account" icon="mdi-account"
:save="saveData" :save="saveData"
:addData="addData" :addData="true"
:editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2"
:disable="statusEdit"
/> />
<q-form ref="myform" class="col-12 row"> <q-form ref="myform" class="col-12 row">
<div class="row col-10 items-center q-col-gutter-x-sm q-col-gutter-y-sm"> <div class="row col-10 items-center q-col-gutter-x-sm q-col-gutter-y-sm">
@ -303,11 +306,11 @@
borderless borderless
v-model="fileData" v-model="fileData"
stack-label stack-label
:readonly="!edit" :readonly="statusEdit"
@update:model-value="pickFile" @update:model-value="pickFile"
> >
<q-img src="@/assets/avatar_user.jpg" class="col-12"> <q-img src="@/assets/avatar_user.jpg" class="col-12">
<div class="overlay" v-if="edit"> <div class="overlay" v-if="!statusEdit">
<q-icon name="mdi-camera" /> <q-icon name="mdi-camera" />
<br />อัปเดต <br />อัปเดต
</div> </div>
@ -338,7 +341,6 @@ const mixin = useCounterMixin()
const { date2Thai, calAge } = mixin const { date2Thai, calAge } = mixin
const edit = ref<boolean>(false) const edit = ref<boolean>(false)
const addData = ref<boolean>(true)
const informaData = ref<Information>(defaultInformation) const informaData = ref<Information>(defaultInformation)
const provinceOptions = ref<DataOption[]>([]) const provinceOptions = ref<DataOption[]>([])
const myform = ref<any>() const myform = ref<any>()
@ -387,9 +389,6 @@ const props = defineProps({
const emit = defineEmits(['update:statusEdit']) const emit = defineEmits(['update:statusEdit'])
onMounted(() => { onMounted(() => {
if (props.step !== 2) {
addData.value = false
}
// fetchProvince() // fetchProvince()
}) })

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

@ -6,9 +6,12 @@
header="อาชีพ" header="อาชีพ"
icon="mdi-briefcase" icon="mdi-briefcase"
:save="saveData" :save="saveData"
:addData="addData" :addData="true"
:editOnly="false"
:cancel="cancelData" :cancel="cancelData"
:changeBtn="changeBtn" :changeBtn="changeBtn"
:editData="step == 2"
:disable="statusEdit"
/> />
<q-form ref="myform"> <q-form ref="myform">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"> <div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
@ -238,7 +241,6 @@ import { defaultOccupation } from '@/modules/01_exam/interface/index/Main'
import HeaderTop from '@/components/top.vue' import HeaderTop from '@/components/top.vue'
const edit = ref<boolean>(false) const edit = ref<boolean>(false)
const addData = ref<boolean>(true)
const occupationData = ref<Occupation>(defaultOccupation) const occupationData = ref<Occupation>(defaultOccupation)
const myform = ref<any>() const myform = ref<any>()
@ -259,11 +261,7 @@ const props = defineProps({
const emit = defineEmits(['update:statusEdit']) const emit = defineEmits(['update:statusEdit'])
onMounted(() => { onMounted(() => {})
if (props.step !== 2) {
addData.value = false
}
})
const saveData = async () => { const saveData = async () => {
await myform.value.validate().then(async (success: boolean) => { await myform.value.validate().then(async (success: boolean) => {

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

@ -9,10 +9,8 @@
</q-toolbar> </q-toolbar>
<q-card flat class=""> <q-card flat class="">
<div class="justify-center"> <div class="justify-center">
<!-- done-color="deep-orange"
active-color="purple"
inactive-color="secondary" -->
<q-stepper <q-stepper
class="col-2"
v-model="step" v-model="step"
ref="stepper" ref="stepper"
alternative-labels alternative-labels
@ -21,28 +19,26 @@
done-color="positive" done-color="positive"
active-color="blue-7" active-color="blue-7"
inactive-color="positive" inactive-color="positive"
done-icon="check" done-icon="mdi-check-bold"
:active-icon="stepRaw === step && stepRaw != 4 ? 'mdi-pencil-outline' : 'mdi-eye-outline'" :active-icon="stepRaw === step && stepRaw != 4 ? 'mdi-pencil' : 'mdi-eye-outline'"
> >
<q-step <!-- <q-step
:done="step > 1" :done="step > 1"
:disable="stepRaw < 1" :disable="stepRaw < 1"
:name="1" :name="1"
title="อ่านคำชี้แจง" title="อ่านคำชี้แจง"
:icon=" :icon="
stepRaw >= 1 ? (stepRaw == 1 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline' stepRaw >= 1 ? (stepRaw == 1 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'
" "
> >
<ExamDetail :fetchStep="fetchStep" :step="stepRaw" /> <ExamDetail :fetchStep="fetchStep" :step="stepRaw" />
</q-step> </q-step> -->
<q-step <q-step
:done="step > 2" :done="step > 2"
:disable="stepRaw < 2" :disable="stepRaw < 2"
:name="2" :name="2"
title="ข้อมูลสมัครสอบ" title="ข้อมูลสมัครสอบ"
:icon=" :icon="stepRaw >= 2 ? (stepRaw == 2 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'"
stepRaw >= 2 ? (stepRaw == 2 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline'
"
> >
<ExamForm :fetchStep="fetchStep" :step="stepRaw" /> <ExamForm :fetchStep="fetchStep" :step="stepRaw" />
</q-step> </q-step>
@ -51,9 +47,7 @@
:disable="stepRaw < 3" :disable="stepRaw < 3"
:name="3" :name="3"
title="ชำระค่าธรรมเนียมการสอบ" title="ชำระค่าธรรมเนียมการสอบ"
:icon=" :icon="stepRaw >= 3 ? (stepRaw == 3 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'"
stepRaw >= 3 ? (stepRaw == 3 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline'
"
> >
<ExamPayment :fetchStep="fetchStep" :step="stepRaw" /> <ExamPayment :fetchStep="fetchStep" :step="stepRaw" />
</q-step> </q-step>
@ -62,9 +56,7 @@
:disable="stepRaw < 4" :disable="stepRaw < 4"
:name="4" :name="4"
title="สำเร็จ" title="สำเร็จ"
:icon=" :icon="stepRaw >= 4 ? (stepRaw == 4 ? 'mdi-pencil' : 'mdi-check-bold') : 'mdi-pencil'"
stepRaw >= 4 ? (stepRaw == 4 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline'
"
> >
<ExamFinished :fetchStep="fetchStep" :step="stepRaw" /> <ExamFinished :fetchStep="fetchStep" :step="stepRaw" />
</q-step> </q-step>
@ -84,8 +76,8 @@ import { useQuasar } from 'quasar'
const $q = useQuasar() const $q = useQuasar()
const examId = ref<string>('zxc') 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 examPost = ref<any>()
const test = ref<any>() const test = ref<any>()
const loading = ref<boolean>(false) const loading = ref<boolean>(false)