tab ที่ผ่านมาแล้วเปลี่ยนเป็นสีเขียว
This commit is contained in:
Kittapath
parent
8266e11d11
commit
3f4a0704d3
16 changed files with 407 additions and 166 deletions
|
|
@ -14,6 +14,7 @@
|
|||
:save="saveData"
|
||||
:history="true"
|
||||
:addData="addData"
|
||||
:cancel="cancelData"
|
||||
/>
|
||||
<q-form ref="myform">
|
||||
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
|
|
@ -224,7 +225,7 @@
|
|||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { ref, onMounted, watch } from 'vue'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
|
||||
import http from '@/plugins/http'
|
||||
|
|
@ -237,7 +238,7 @@ const mixin = useCounterMixin()
|
|||
const { date2Thai, calAge } = mixin
|
||||
|
||||
const edit = ref<boolean>(false)
|
||||
const addData = ref<boolean>(false)
|
||||
const addData = ref<boolean>(true)
|
||||
const addressData = ref<Address>(defaultAddress)
|
||||
const myform = ref<any>()
|
||||
const codep = ref<string>('')
|
||||
|
|
@ -249,17 +250,26 @@ const districtCOptions = ref<DataOption[]>([])
|
|||
const subdistrictOptions = ref<zipCodeOption[]>([])
|
||||
const subdistrictCOptions = ref<zipCodeOption[]>([])
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
'full-width cursor-pointer': !val
|
||||
const props = defineProps({
|
||||
statusEdit: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:statusEdit'])
|
||||
|
||||
watch(edit, (count: boolean, prevCount: boolean) => {
|
||||
if (props.statusEdit == true) {
|
||||
edit.value = false
|
||||
emit('update:statusEdit', count)
|
||||
}
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
fetchProvince()
|
||||
fetchDistrict(addressData.value.provinceId, '1')
|
||||
fetchDistrict(addressData.value.provinceIdC, '2')
|
||||
// fetchProvince()
|
||||
// fetchDistrict(addressData.value.provinceId, '1')
|
||||
// fetchDistrict(addressData.value.provinceIdC, '2')
|
||||
})
|
||||
|
||||
const saveData = async () => {
|
||||
|
|
@ -381,4 +391,13 @@ const fetchSubDistrict = async (id: string, position: string) => {
|
|||
// loader.value = false;
|
||||
})
|
||||
}
|
||||
|
||||
const cancelData = () => {}
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
'full-width cursor-pointer': !val
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<!-- tab เอกสาร -->
|
||||
<template>
|
||||
<Image />
|
||||
<!-- <Image /> -->
|
||||
<OtherFile />
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import Image from './Image.vue'
|
||||
// import Image from './Image.vue'
|
||||
import OtherFile from './OtherFile.vue'
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<q-card class="my-card" style="max-width: 600px; width: 100%" bordered>
|
||||
<q-card-actions class="q-pa-md" :class="getClass(status)">
|
||||
<div v-if="status == false" class="text-black text-bold">
|
||||
เจ้าหน้าที่กำลังตรวจเอกสารชำระเงิน
|
||||
เจ้าหน้าที่กำลังตรวจสถานที่สอบ
|
||||
</div>
|
||||
<div v-else class="text-black text-bold">สมัครสอบสำเร็จ</div>
|
||||
<q-space />
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
icon="mdi-account-group"
|
||||
:save="saveData"
|
||||
:addData="addData"
|
||||
:cancel="cancelData"
|
||||
/>
|
||||
<q-form ref="myform" class="col-12">
|
||||
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
|
|
@ -269,7 +270,7 @@
|
|||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import { ref, watch } from 'vue'
|
||||
import type { PropType } from 'vue'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import type { Family, DataOption } from '@/modules/01_exam/interface/index/Main'
|
||||
|
|
@ -280,7 +281,7 @@ const mixin = useCounterMixin()
|
|||
const { date2Thai, calAge } = mixin
|
||||
|
||||
const edit = ref<boolean>(false)
|
||||
const addData = ref<boolean>(false)
|
||||
const addData = ref<boolean>(true)
|
||||
const myform = ref<any>()
|
||||
const familyData = ref<Family>(defaultFamily)
|
||||
const statusOptions = ref<DataOption[]>([])
|
||||
|
|
@ -295,15 +296,21 @@ const props = defineProps({
|
|||
prefixOptions: {
|
||||
type: Array as PropType<DataOption[]>,
|
||||
required: true
|
||||
},
|
||||
statusEdit: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
'full-width cursor-pointer': !val
|
||||
const emit = defineEmits(['update:statusEdit'])
|
||||
|
||||
watch(edit, (count: boolean, prevCount: boolean) => {
|
||||
if (props.statusEdit == true) {
|
||||
edit.value = false
|
||||
emit('update:statusEdit', count)
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const saveData = async () => {
|
||||
await myform.value.validate().then(async (success: boolean) => {
|
||||
|
|
@ -321,4 +328,13 @@ const selectRadio = (e: boolean, i: any) => {
|
|||
familyData.value.occupationC = ''
|
||||
}
|
||||
}
|
||||
|
||||
const cancelData = () => {}
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
'full-width cursor-pointer': !val
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,45 +0,0 @@
|
|||
<!-- card รูปถ่าย -->
|
||||
<template>
|
||||
<q-card flat bordered class="col-12 row q-px-lg q-py-md">
|
||||
<HeaderTop
|
||||
v-model:edit="edit"
|
||||
header="รูปถ่าย"
|
||||
icon="mdi-image-area"
|
||||
:history="false"
|
||||
:addData="addData"
|
||||
/>
|
||||
<div class="row col-12 q-gutter-sm q-pt-sm">
|
||||
<q-img
|
||||
class="items-center"
|
||||
src="https://picsum.photos/500/300"
|
||||
style="max-width: 150px; height: 150px"
|
||||
fit="contain"
|
||||
>
|
||||
</q-img>
|
||||
<q-uploader
|
||||
v-show="edit"
|
||||
color="blue"
|
||||
type="file"
|
||||
flat
|
||||
auto-upload
|
||||
:factory="fileUpload"
|
||||
class="full-width"
|
||||
accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
|
||||
bordered
|
||||
/>
|
||||
</div>
|
||||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref } from 'vue'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
|
||||
const edit = ref<boolean>(false)
|
||||
const addData = ref<boolean>(false)
|
||||
const fileUpload = async (file: any) => {
|
||||
return {
|
||||
url: 'http://localhost:4444/upload',
|
||||
method: 'POST'
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
@ -7,9 +7,10 @@
|
|||
icon="mdi-account"
|
||||
:save="saveData"
|
||||
:addData="addData"
|
||||
:cancel="cancelData"
|
||||
/>
|
||||
<q-form ref="myform" class="col-12">
|
||||
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-sm">
|
||||
<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="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-select
|
||||
hide-bottom-space
|
||||
|
|
@ -295,11 +296,34 @@
|
|||
/>
|
||||
</div>
|
||||
</div>
|
||||
<div class="row col-2 justify-center q-pt-md">
|
||||
<div class="containerimage row justify-center">
|
||||
<q-file
|
||||
borderless
|
||||
v-model="fileData"
|
||||
stack-label
|
||||
:readonly="!edit"
|
||||
@update:model-value="pickFile"
|
||||
>
|
||||
<q-img src="@/assets/avatar_user.jpg" class="col-12">
|
||||
<div class="overlay" v-if="edit">
|
||||
<q-icon name="mdi-camera" />
|
||||
<br />อัปเดต
|
||||
</div>
|
||||
</q-img>
|
||||
</q-file>
|
||||
</div>
|
||||
<div class="col-12 text-center" v-show="disabledPic">
|
||||
<q-btn outline dense color="black" icon="mdi-content-save-outline" @click="savePic">
|
||||
<q-tooltip content-class="bg-grey-2 text-black">บันทึกรูป</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
</div>
|
||||
</q-form>
|
||||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { ref, onMounted, watch } from 'vue'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import type { PropType } from 'vue'
|
||||
import type { Information, DataOption } from '@/modules/01_exam/interface/index/Main'
|
||||
|
|
@ -307,16 +331,19 @@ import { defaultInformation } from '@/modules/01_exam/interface/index/Main'
|
|||
import HeaderTop from '@/components/top.vue'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import type { file } from '@babel/types'
|
||||
|
||||
const mixin = useCounterMixin()
|
||||
const { date2Thai, calAge } = mixin
|
||||
|
||||
const edit = ref<boolean>(false)
|
||||
const addData = ref<boolean>(false)
|
||||
const addData = ref<boolean>(true)
|
||||
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 fileData = ref<File | null>()
|
||||
const props = defineProps({
|
||||
prefixOptions: {
|
||||
type: Array as PropType<DataOption[]>,
|
||||
|
|
@ -341,12 +368,25 @@ const props = defineProps({
|
|||
provinceOptions: {
|
||||
type: Array as PropType<DataOption[]>,
|
||||
required: true
|
||||
},
|
||||
statusEdit: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:statusEdit'])
|
||||
|
||||
watch(edit, (count: boolean, prevCount: boolean) => {
|
||||
if (props.statusEdit == true) {
|
||||
edit.value = false
|
||||
emit('update:statusEdit', count)
|
||||
}
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
// console.log(props);
|
||||
fetchProvince()
|
||||
// fetchProvince()
|
||||
})
|
||||
|
||||
const saveData = async () => {
|
||||
|
|
@ -376,6 +416,21 @@ const fetchProvince = async () => {
|
|||
})
|
||||
}
|
||||
|
||||
const savePic = () => {
|
||||
disabledPic.value = false
|
||||
}
|
||||
|
||||
const onFilePicked = () => {}
|
||||
|
||||
const pickFile = () => {
|
||||
disabledPic.value = true
|
||||
}
|
||||
|
||||
const cancelData = () => {
|
||||
fileData.value = null
|
||||
disabledPic.value = false
|
||||
}
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
|
|
@ -383,3 +438,40 @@ const getClass = (val: boolean) => {
|
|||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.containerimage {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.q-img {
|
||||
display: block;
|
||||
width: 160px;
|
||||
height: 170px;
|
||||
padding: 1%;
|
||||
border-radius: 3px;
|
||||
border: solid 2px rgba(168, 168, 168, 0.055) !important;
|
||||
box-shadow: 0 2px 3px 0 rgba(0, 0, 0, 0.048), 0 3px 6px 0 rgba(0, 0, 0, 0.19);
|
||||
}
|
||||
|
||||
.overlay {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
background: rgb(0, 0, 0);
|
||||
background: rgba(0, 0, 0, 0.7);
|
||||
color: #f1f1f1;
|
||||
transition: 0.5s ease;
|
||||
width: 160px;
|
||||
height: 70px;
|
||||
opacity: 0;
|
||||
color: white;
|
||||
text-align: center;
|
||||
cursor: pointer;
|
||||
padding: 5% 0 5% 0;
|
||||
}
|
||||
|
||||
.containerimage:hover .overlay {
|
||||
opacity: 1;
|
||||
}
|
||||
</style>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
icon="mdi-briefcase"
|
||||
:save="saveData"
|
||||
:addData="addData"
|
||||
:cancel="cancelData"
|
||||
/>
|
||||
<q-form ref="myform">
|
||||
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
|
||||
|
|
@ -33,7 +34,7 @@
|
|||
label="ข้าราชการกรุงเทพมหานคร ตำแหน่ง"
|
||||
dense
|
||||
:disable="!edit"
|
||||
size="xs"
|
||||
size="md"
|
||||
style="font-size: 14px; color: black"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -60,7 +61,7 @@
|
|||
label="บุคลากรกรุงเทพมหานคร ตำแหน่ง"
|
||||
dense
|
||||
:disable="!edit"
|
||||
size="xs"
|
||||
size="md"
|
||||
style="font-size: 14px; color: black"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -87,7 +88,7 @@
|
|||
label="ข้าราชการประเภทอื่น ตำแหน่ง"
|
||||
dense
|
||||
:disable="!edit"
|
||||
size="xs"
|
||||
size="md"
|
||||
style="font-size: 14px; color: black"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -114,7 +115,7 @@
|
|||
label="ลูกจ้าง/พนักงานราชการของส่วนราชการอื่น ตำแหน่ง"
|
||||
dense
|
||||
:disable="!edit"
|
||||
size="xs"
|
||||
size="md"
|
||||
style="font-size: 14px; color: black"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -127,7 +128,7 @@
|
|||
label="กำลังศึกษาต่อ"
|
||||
dense
|
||||
:disable="!edit"
|
||||
size="xs"
|
||||
size="md"
|
||||
style="font-size: 14px; color: black"
|
||||
/>
|
||||
<q-input
|
||||
|
|
@ -152,7 +153,7 @@
|
|||
label="อื่นๆ"
|
||||
dense
|
||||
:disable="!edit"
|
||||
size="xs"
|
||||
size="md"
|
||||
style="font-size: 14px; color: black"
|
||||
/>
|
||||
</template>
|
||||
|
|
@ -227,7 +228,7 @@
|
|||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
import { ref, onMounted, watch } from 'vue'
|
||||
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
|
|
@ -236,16 +237,25 @@ import { defaultOccupation } from '@/modules/01_exam/interface/index/Main'
|
|||
import HeaderTop from '@/components/top.vue'
|
||||
|
||||
const edit = ref<boolean>(false)
|
||||
const addData = ref<boolean>(false)
|
||||
const addData = ref<boolean>(true)
|
||||
const occupationData = ref<Occupation>(defaultOccupation)
|
||||
const myform = ref<any>()
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
'full-width cursor-pointer': !val
|
||||
const props = defineProps({
|
||||
statusEdit: {
|
||||
type: Boolean,
|
||||
required: true
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:statusEdit'])
|
||||
|
||||
watch(edit, (count: boolean, prevCount: boolean) => {
|
||||
if (props.statusEdit == true) {
|
||||
edit.value = false
|
||||
emit('update:statusEdit', count)
|
||||
}
|
||||
})
|
||||
|
||||
onMounted(() => {})
|
||||
|
||||
|
|
@ -256,4 +266,13 @@ const saveData = async () => {
|
|||
}
|
||||
})
|
||||
}
|
||||
|
||||
const cancelData = () => {}
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
'full-width cursor-pointer': !val
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
icon="mdi-file-document"
|
||||
:history="false"
|
||||
:addData="addData"
|
||||
:cancel="cancelData"
|
||||
/>
|
||||
<div class="row col-12 q-gutter-sm q-pt-sm">
|
||||
<q-card bordered flat class="full-width">
|
||||
|
|
@ -63,7 +64,7 @@ import { ref } from 'vue'
|
|||
import HeaderTop from '@/components/top.vue'
|
||||
|
||||
const edit = ref<boolean>(false)
|
||||
const addData = ref<boolean>(false)
|
||||
const addData = ref<boolean>(true)
|
||||
const files = ref<any>([
|
||||
{
|
||||
key: 1,
|
||||
|
|
@ -84,4 +85,6 @@ const fileUpload = async (file: any) => {
|
|||
method: 'POST'
|
||||
}
|
||||
}
|
||||
|
||||
const cancelData = () => {}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,5 +1,6 @@
|
|||
<!-- tab ข้อมูลส่วนบุคคล -->
|
||||
<template>
|
||||
<!-- xxxxxxxx{{ statusEdit }}xxxxxxxx{{ statusEditx }} -->
|
||||
<Information
|
||||
:prefixOptions="prefixOptions"
|
||||
:genderOptions="genderOptions"
|
||||
|
|
@ -7,10 +8,18 @@
|
|||
:statusOptions="statusOptions"
|
||||
:religionOptions="religionOptions"
|
||||
:provinceOptions="provinceOptions"
|
||||
v-model:statusEdit="statusEdit"
|
||||
/>
|
||||
<Address v-model:statusEdit="statusEdit" />
|
||||
<Family :prefixOptions="prefixOptions" v-model:statusEdit="statusEdit" />
|
||||
<Occupation v-model:statusEdit="statusEdit" />
|
||||
<notifyConfirm
|
||||
:modal="modalNoEdit"
|
||||
:modalTittle="modalNoEditTittle"
|
||||
:modalDetail="modalNoEditDetail"
|
||||
:ok="closeModalNoEdit"
|
||||
:cancel="closeModalCancel"
|
||||
/>
|
||||
<Address />
|
||||
<Family :prefixOptions="prefixOptions" />
|
||||
<Occupation />
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, onMounted } from 'vue'
|
||||
|
|
@ -19,14 +28,30 @@ import Information from './Information.vue'
|
|||
import Address from './Address.vue'
|
||||
import Family from './Family.vue'
|
||||
import Occupation from './Occupation.vue'
|
||||
import NotifyConfirm from '@/components/NotifyConfirm.vue'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
|
||||
const loader = ref<boolean>(true)
|
||||
const statusEdit = ref<boolean>(false)
|
||||
const statusEditx = ref<boolean>(false)
|
||||
const modalNoEdit = ref<boolean>(false)
|
||||
const modalNoEditTittle = ref<string>('ยืนยันการเปลี่ยนแท็ปใช่หรือไม่?')
|
||||
const modalNoEditDetail = ref<string>(
|
||||
'ยังมีข้อมูลที่ยังไม่ถูกบันทึก ถ้าตกลงเปลี่ยนแท็ปข้อมูลที่ยังไม่ถูกบันทึกจะหาย'
|
||||
)
|
||||
|
||||
const prefixOptions = ref<DataOption[]>([])
|
||||
const bloodOptions = ref<DataOption[]>([])
|
||||
const genderOptions = ref<DataOption[]>([])
|
||||
const statusOptions = ref<DataOption[]>([])
|
||||
const religionOptions = ref<DataOption[]>([])
|
||||
const provinceOptions = ref<DataOption[]>([])
|
||||
|
||||
const closeModalNoEdit = () => {
|
||||
modalNoEdit.value = false
|
||||
}
|
||||
const closeModalCancel = () => {
|
||||
modalNoEdit.value = false
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -2,15 +2,15 @@ const Main = () => import('@/modules/01_exam/views/ExamMain.vue')
|
|||
const Detail = () => import('@/modules/01_exam/views/ExamDetail.vue')
|
||||
|
||||
export default [
|
||||
{
|
||||
path: '/exam',
|
||||
name: 'exam',
|
||||
component: Main,
|
||||
meta: {
|
||||
Auth: true
|
||||
// Key: [7]
|
||||
}
|
||||
},
|
||||
// {
|
||||
// path: '/exam',
|
||||
// name: 'exam',
|
||||
// component: Main,
|
||||
// meta: {
|
||||
// Auth: true
|
||||
// // Key: [7]
|
||||
// }
|
||||
// },
|
||||
{
|
||||
path: '/exam/:id',
|
||||
name: 'examDetail',
|
||||
|
|
|
|||
|
|
@ -1,10 +1,9 @@
|
|||
<!-- page:detail page รายการสอบทั้งหมด -->
|
||||
<template>
|
||||
<q-toolbar class="q-py-sm q-px-md bg-grey-2">
|
||||
<q-btn icon="chevron_left" color="grey" flat dense>
|
||||
<q-tooltip>กลับ</q-tooltip>
|
||||
</q-btn>
|
||||
<q-toolbar-title class="toptitle text-dark col-12 row items-center">สมัครสอบ</q-toolbar-title>
|
||||
<q-toolbar-title class="toptitle text-dark col-12 row items-center">{{
|
||||
tittle
|
||||
}}</q-toolbar-title>
|
||||
</q-toolbar>
|
||||
<q-card flat class="">
|
||||
<div class="justify-center">
|
||||
|
|
@ -16,21 +15,34 @@
|
|||
color="primary"
|
||||
animated
|
||||
>
|
||||
<q-step :name="1" title="อ่านคำชี้แจง" icon="edit" done-color="positive">
|
||||
<q-step :done="step > 1" :name="1" title="อ่านคำชี้แจง" icon="edit" done-color="positive">
|
||||
<ExamDetail />
|
||||
</q-step>
|
||||
<q-step :name="2" title="กรอกข้อมูล" icon="edit" done-color="positive">
|
||||
<q-step :done="step > 2" :name="2" title="กรอกข้อมูล" icon="edit" done-color="positive">
|
||||
<ExamForm />
|
||||
</q-step>
|
||||
<q-step :name="3" title="ชำระค่าธรรมเนียมการสอบ" icon="edit" done-color="positive">
|
||||
<q-step
|
||||
:done="step > 3"
|
||||
:name="3"
|
||||
title="ชำระค่าธรรมเนียมการสอบ"
|
||||
icon="edit"
|
||||
done-color="positive"
|
||||
>
|
||||
<ExamPayment />
|
||||
</q-step>
|
||||
<q-step :name="4" title="สำเร็จ" icon="edit" done-color="positive">
|
||||
<q-step :done="step > 4" :name="4" title="สำเร็จ" icon="edit" done-color="positive">
|
||||
<ExamFinished />
|
||||
</q-step>
|
||||
</q-stepper>
|
||||
</div>
|
||||
</q-card>
|
||||
<notifyConfirm
|
||||
:modal="modalConfirm"
|
||||
:modalTittle="modalConfirmTittle"
|
||||
:modalDetail="modalConfirmDetail"
|
||||
:ok="closeModalConfirm"
|
||||
:cancel="closeModalCancel"
|
||||
/>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
|
|
@ -39,6 +51,7 @@ import ExamDetail from '@/modules/01_exam/components/ExamDetail.vue'
|
|||
import ExamForm from '@/modules/01_exam/components/ExamForm.vue'
|
||||
import ExamPayment from '@/modules/01_exam/components/ExamPayment.vue'
|
||||
import ExamFinished from '@/modules/01_exam/components/ExamFinished.vue'
|
||||
import NotifyConfirm from '@/components/NotifyConfirm.vue'
|
||||
|
||||
const examId = ref<string>('zxc')
|
||||
const step = ref<number>(1)
|
||||
|
|
@ -46,6 +59,12 @@ const stepRaw = ref<number>(1)
|
|||
const examPost = ref<any>()
|
||||
const test = ref<any>()
|
||||
const loading = ref<boolean>(false)
|
||||
const tittle = ref<string>('การสอบภาค ข. พิเศษ สำหรับผู้สอบผ่านของส่วนราชการแล้ว')
|
||||
const modalConfirm = ref<boolean>(true)
|
||||
const modalConfirmTittle = ref<string>('ยืนยันการเปลี่ยนแท็ปใช่หรือไม่?')
|
||||
const modalConfirmDetail = ref<string>(
|
||||
'ยังมีข้อมูลที่ยังไม่ถูกบันทึก ถ้าตกลงเปลี่ยนแท็ปข้อมูลที่ยังไม่ถูกบันทึกจะหาย'
|
||||
)
|
||||
|
||||
onMounted(() => {
|
||||
loadCandidate()
|
||||
|
|
@ -84,4 +103,11 @@ const fetchExams = () => {
|
|||
// .catch((err) => console.log(err))
|
||||
// .finally(() => (this.loading = false))
|
||||
}
|
||||
|
||||
const closeModalConfirm = () => {
|
||||
modalConfirm.value = false
|
||||
}
|
||||
const closeModalCancel = () => {
|
||||
modalConfirm.value = false
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue