refactor code
This commit is contained in:
Kittapath
parent
d2c352de17
commit
92fc21033d
50 changed files with 652 additions and 2170 deletions
|
|
@ -1,18 +1,10 @@
|
|||
import env from '../index'
|
||||
const prefix = `${env.API_URI}/metadata/prefix/`
|
||||
const religion = `${env.API_URI}/metadata/religion/`
|
||||
const relationship = `${env.API_URI}/metadata/relationship/`
|
||||
const educationLevel = `${env.API_URI}/metadata/education-level/`
|
||||
const province = `${env.API_URI}/metadata/province/`
|
||||
const person = `${env.API_URI}/metadata/main/`
|
||||
const district = `${env.API_URI}/metadata/district/`
|
||||
const subDistrict = `${env.API_URI}/metadata/sub-district/`
|
||||
|
||||
export default {
|
||||
prefix,
|
||||
religion,
|
||||
relationship,
|
||||
educationLevel,
|
||||
province,
|
||||
person: `${person}person`,
|
||||
listDistrict: (id: string) => `${district}${id}`,
|
||||
listSubDistrict: (id: string) => `${subDistrict}${id}`
|
||||
}
|
||||
|
|
|
|||
|
|
@ -3,16 +3,11 @@ import { ref } from 'vue'
|
|||
|
||||
const env = ref<string>(process.env.NODE_ENV || 'development')
|
||||
export const apiUrlConfig = import.meta.env.VITE_API_URI_CONFIG
|
||||
console.log(apiUrlConfig)
|
||||
// if (process.env.VUE_APP_TEST) {
|
||||
// env = "test";
|
||||
// }
|
||||
|
||||
const config = ref<any>({
|
||||
development: {
|
||||
// API_URI: 'https://localhost:7007/api/v1',
|
||||
API_URI: apiUrlConfig,
|
||||
// API_METADATA_URI: 'https://bma-ehr.frappet.synology.me/api/v1/metadata',
|
||||
MEET_URI: 'meet.frappet.com'
|
||||
},
|
||||
test: {
|
||||
|
|
@ -22,19 +17,16 @@ const config = ref<any>({
|
|||
production: {
|
||||
// API_URI: "https://localhost:5010",
|
||||
API_URI: apiUrlConfig,
|
||||
// API_METADATA_URI: 'https://bma-ehr.frappet.synology.me/api/v1/metadata',
|
||||
MEET_URI: 'meet.frappet.com'
|
||||
}
|
||||
})
|
||||
|
||||
const API_URI = ref<string>(config.value[env.value].API_URI)
|
||||
// const API_METADATA_URI = ref<string>(config.value[env.value].API_METADATA_URI)
|
||||
const MEET_URI = ref<string>(config.value[env.value].MEET_URI)
|
||||
|
||||
export default {
|
||||
env: env.value,
|
||||
config: config.value,
|
||||
API_URI: API_URI.value,
|
||||
// API_METADATA_URI: API_METADATA_URI.value,
|
||||
MEET_URI: MEET_URI.value
|
||||
}
|
||||
|
|
|
|||
62
src/components/CustomDialog.vue
Normal file
62
src/components/CustomDialog.vue
Normal file
|
|
@ -0,0 +1,62 @@
|
|||
<template>
|
||||
<q-dialog ref="dialogRef" @hide="onDialogHide" persistent>
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row">
|
||||
<div class="q-pr-md">
|
||||
<q-avatar :icon="icon" size="lg" font-size="25px" color="blue-1" :text-color="color" />
|
||||
</div>
|
||||
<div class="col text-dark">
|
||||
<span class="text-bold">{{ title }}</span>
|
||||
<br />
|
||||
<span>{{ message }}</span>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal" v-if="onlycancel">
|
||||
<q-btn label="ตกลง" flat color="grey-8" @click="onDialogCancel" />
|
||||
</q-card-actions>
|
||||
<q-card-actions align="right" class="bg-white text-teal" v-else>
|
||||
<q-btn label="ยกเลิก" flat color="grey-8" @click="onDialogCancel" />
|
||||
<q-btn :label="textOk" :color="color" @click="onOKClick" />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { useDialogPluginComponent } from 'quasar'
|
||||
|
||||
const props = defineProps({
|
||||
color: {
|
||||
type: String,
|
||||
default: 'primary'
|
||||
},
|
||||
textOk: {
|
||||
type: String,
|
||||
default: 'ตกลง'
|
||||
},
|
||||
title: {
|
||||
type: String,
|
||||
default: 'หัวข้อ?'
|
||||
},
|
||||
message: {
|
||||
type: String,
|
||||
default: 'ข้อความ'
|
||||
},
|
||||
icon: {
|
||||
type: String,
|
||||
default: 'question_mark'
|
||||
},
|
||||
onlycancel: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
})
|
||||
|
||||
defineEmits([...useDialogPluginComponent.emits])
|
||||
|
||||
const { dialogRef, onDialogHide, onDialogOK, onDialogCancel } = useDialogPluginComponent()
|
||||
function onOKClick() {
|
||||
onDialogOK()
|
||||
}
|
||||
</script>
|
||||
|
|
@ -32,18 +32,6 @@
|
|||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<div v-else>
|
||||
<!-- <q-btn
|
||||
flat
|
||||
round
|
||||
:disabled="!editvisible"
|
||||
:outline="!editvisible"
|
||||
:color="!editvisible ? 'grey-7' : 'red'"
|
||||
@click="cancel()"
|
||||
icon="mdi-undo"
|
||||
v-if="modalEdit == true"
|
||||
>
|
||||
<q-tooltip>ยกเลิก</q-tooltip>
|
||||
</q-btn> -->
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
|
|
@ -59,8 +47,6 @@
|
|||
</q-card-actions>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
editvisible: Boolean,
|
||||
next: Boolean,
|
||||
|
|
@ -78,10 +64,6 @@ const props = defineProps({
|
|||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
cancel: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
edit: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
|
|
@ -100,9 +82,6 @@ const emit = defineEmits(['update:editvisible', 'update:next', 'update:previous'
|
|||
const updateEdit = (value: Boolean) => {
|
||||
emit('update:editvisible', value)
|
||||
}
|
||||
const cancel = async () => {
|
||||
props.cancel()
|
||||
}
|
||||
const edit = async () => {
|
||||
updateEdit(!props.editvisible)
|
||||
props.edit()
|
||||
|
|
@ -110,12 +89,6 @@ const edit = async () => {
|
|||
const checkSave = () => {
|
||||
props.validate()
|
||||
props.save()
|
||||
// if (myForm.value !== null) {
|
||||
// myForm.value.validate().then((success) => {
|
||||
// if (success) {
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
}
|
||||
|
||||
const clickNext = async () => {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,6 @@
|
|||
<div class="text-bold">{{ tittle }}</div>
|
||||
</div>
|
||||
<q-space />
|
||||
<!-- <div class="row col-1"> -->
|
||||
<q-btn
|
||||
icon="close"
|
||||
unelevated
|
||||
|
|
@ -13,20 +12,17 @@
|
|||
@click="close"
|
||||
style="color: #ff8080; background-color: #ffdede"
|
||||
/>
|
||||
<!-- </div> -->
|
||||
</q-card-section>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from "vue";
|
||||
|
||||
const props = defineProps({
|
||||
tittle: String,
|
||||
close: {
|
||||
type: Function,
|
||||
default: () => console.log("not function"),
|
||||
},
|
||||
});
|
||||
default: () => console.log('not function')
|
||||
}
|
||||
})
|
||||
const close = async () => {
|
||||
props.close();
|
||||
};
|
||||
props.close()
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,86 +0,0 @@
|
|||
<template>
|
||||
<q-dialog :model-value="modal" persistent>
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row items-center">
|
||||
<div class="q-pr-md">
|
||||
<q-avatar
|
||||
icon="mdi-alert-circle-outline"
|
||||
font-size="25px"
|
||||
size="lg"
|
||||
color="primary-1"
|
||||
text-color="primary"
|
||||
/>
|
||||
</div>
|
||||
<div class="col text-dark">
|
||||
<span class="text-bold">{{ tittle }}</span>
|
||||
<br />
|
||||
<span>{{ detail }}</span>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="ยกเลิก" color="primary" @click="cancel" />
|
||||
<q-btn label="ตกลง" color="primary" @click="ok" />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
modal: Boolean,
|
||||
tittle: String,
|
||||
detail: String,
|
||||
ok: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
cancel: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:modal'])
|
||||
|
||||
const cancel = () => {
|
||||
emit('update:modal', false)
|
||||
props.cancel()
|
||||
}
|
||||
const ok = () => {
|
||||
emit('update:modal', false)
|
||||
props.ok()
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.icon-color {
|
||||
color: #4154b3;
|
||||
}
|
||||
.custom-header-table {
|
||||
max-height: 64vh;
|
||||
.q-table tr:nth-child(odd) td {
|
||||
background: white;
|
||||
}
|
||||
.q-table tr:nth-child(even) td {
|
||||
background: #f6f6f6ae;
|
||||
}
|
||||
|
||||
.q-table thead tr {
|
||||
background: #ecebeb;
|
||||
}
|
||||
|
||||
.q-table thead tr th {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
}
|
||||
/* this will be the loading indicator */
|
||||
.q-table thead tr:last-child th {
|
||||
/* height of all previous header rows */
|
||||
top: 48px;
|
||||
}
|
||||
.q-table thead tr:first-child th {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,86 +0,0 @@
|
|||
<template>
|
||||
<q-dialog :model-value="modal" persistent>
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row items-center">
|
||||
<div class="q-pr-md">
|
||||
<q-avatar
|
||||
icon="mdi-alert-circle-outline"
|
||||
font-size="25px"
|
||||
size="lg"
|
||||
color="primary-1"
|
||||
text-color="primary"
|
||||
/>
|
||||
</div>
|
||||
<div class="col text-dark">
|
||||
<span class="text-bold">{{ tittle }}</span>
|
||||
<br />
|
||||
<span>{{ detail }}</span>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="ยกเลิก" color="primary" @click="cancel" />
|
||||
<q-btn label="ตกลง" color="primary" @click="ok" />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
modal: Boolean,
|
||||
tittle: String,
|
||||
detail: String,
|
||||
ok: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
cancel: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:modal'])
|
||||
|
||||
const cancel = () => {
|
||||
emit('update:modal', false)
|
||||
props.cancel()
|
||||
}
|
||||
const ok = () => {
|
||||
emit('update:modal', false)
|
||||
props.ok()
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.icon-color {
|
||||
color: #4154b3;
|
||||
}
|
||||
.custom-header-table {
|
||||
max-height: 64vh;
|
||||
.q-table tr:nth-child(odd) td {
|
||||
background: white;
|
||||
}
|
||||
.q-table tr:nth-child(even) td {
|
||||
background: #f6f6f6ae;
|
||||
}
|
||||
|
||||
.q-table thead tr {
|
||||
background: #ecebeb;
|
||||
}
|
||||
|
||||
.q-table thead tr th {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
}
|
||||
/* this will be the loading indicator */
|
||||
.q-table thead tr:last-child th {
|
||||
/* height of all previous header rows */
|
||||
top: 48px;
|
||||
}
|
||||
.q-table thead tr:first-child th {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,79 +0,0 @@
|
|||
<template>
|
||||
<q-dialog :model-value="modal" persistent @update:model-value="updateClose">
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row items-center">
|
||||
<div class="q-pr-md">
|
||||
<q-avatar
|
||||
icon="mdi-alert-circle-outline"
|
||||
font-size="25px"
|
||||
size="lg"
|
||||
color="red-1"
|
||||
text-color="red"
|
||||
/>
|
||||
</div>
|
||||
<div class="col text-dark">
|
||||
<span class="text-bold text-red">{{ tittle }}</span>
|
||||
<br />
|
||||
<span>{{ detail }}</span>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="ตกลง" color="primary" @click="updateClose" v-close-popup />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
modal: Boolean,
|
||||
tittle: String,
|
||||
detail: String,
|
||||
close: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:modal', 'update:tittle', 'update:detail'])
|
||||
|
||||
const updateClose = () => {
|
||||
emit('update:modal', false)
|
||||
emit('update:tittle', '')
|
||||
emit('update:detail', '')
|
||||
props.close()
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.icon-color {
|
||||
color: #4154b3;
|
||||
}
|
||||
.custom-header-table {
|
||||
max-height: 64vh;
|
||||
.q-table tr:nth-child(odd) td {
|
||||
background: white;
|
||||
}
|
||||
.q-table tr:nth-child(even) td {
|
||||
background: #f6f6f6ae;
|
||||
}
|
||||
|
||||
.q-table thead tr {
|
||||
background: #ecebeb;
|
||||
}
|
||||
|
||||
.q-table thead tr th {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
}
|
||||
/* this will be the loading indicator */
|
||||
.q-table thead tr:last-child th {
|
||||
/* height of all previous header rows */
|
||||
top: 48px;
|
||||
}
|
||||
.q-table thead tr:first-child th {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -12,12 +12,6 @@
|
|||
:editOnly="false"
|
||||
:editData="editData"
|
||||
/>
|
||||
<!-- v-if="nameHeader" -->
|
||||
<!-- <div class="q-pl-sm">
|
||||
<q-btn size="12px" flat round color="add" @click="add" icon="mdi-plus" v-if="addData">
|
||||
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
</div> -->
|
||||
<q-space />
|
||||
<div class="items-center q-col-gutter-x-sm" style="display: flex">
|
||||
<!-- ค้นหาข้อความใน table -->
|
||||
|
|
@ -90,15 +84,6 @@ import { ref, useAttrs, watch } from 'vue'
|
|||
import HeaderTop from '@/components/top.vue'
|
||||
import type { Pagination } from '@/modules/01_exam/interface/index/Main'
|
||||
|
||||
const attrs = ref<any>(useAttrs())
|
||||
const table = ref<any>(null)
|
||||
const filterRef = ref<any>(null)
|
||||
const editBtn = ref<boolean>(true)
|
||||
const initialPagination = ref<Pagination>({
|
||||
// descending: false,
|
||||
rowsPerPage: 0
|
||||
})
|
||||
|
||||
const props = defineProps({
|
||||
inputfilter: String,
|
||||
name: String,
|
||||
|
|
@ -135,13 +120,18 @@ const props = defineProps({
|
|||
|
||||
const emit = defineEmits(['update:inputfilter', 'update:inputvisible', 'update:editvisible'])
|
||||
|
||||
const attrs = ref<any>(useAttrs())
|
||||
const table = ref<any>(null)
|
||||
const filterRef = ref<any>(null)
|
||||
const editBtn = ref<boolean>(true)
|
||||
const initialPagination = ref<Pagination>({
|
||||
rowsPerPage: 0
|
||||
})
|
||||
|
||||
watch(props, (count: any, prevCount: any) => {
|
||||
editBtn.value = props.editvisible
|
||||
})
|
||||
|
||||
const updateEdit = (value: Boolean) => {
|
||||
emit('update:editvisible', value)
|
||||
}
|
||||
const updateInput = (value: string | number | null) => {
|
||||
emit('update:inputfilter', value)
|
||||
}
|
||||
|
|
@ -154,27 +144,14 @@ const paginationLabel = (start: string, end: string, total: string) => {
|
|||
}
|
||||
|
||||
const clickAdd = () => {
|
||||
// props.validate();
|
||||
props.add()
|
||||
}
|
||||
|
||||
const clickEdit = () => {
|
||||
// props.validate();
|
||||
props.edit()
|
||||
}
|
||||
|
||||
const clickCancel = () => {
|
||||
// props.validate();
|
||||
props.cancel()
|
||||
}
|
||||
|
||||
const edit = async () => {
|
||||
updateEdit(!props.editvisible)
|
||||
props.edit()
|
||||
}
|
||||
|
||||
const cancel = async () => {
|
||||
updateEdit(!props.editvisible)
|
||||
props.cancel()
|
||||
}
|
||||
|
||||
|
|
@ -183,10 +160,6 @@ const resetFilter = () => {
|
|||
emit('update:inputfilter', '')
|
||||
filterRef.value.focus()
|
||||
}
|
||||
|
||||
const add = () => {
|
||||
props.add()
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.icon-color {
|
||||
|
|
|
|||
|
|
@ -1,457 +0,0 @@
|
|||
<template>
|
||||
<div class="q-px-md q-pb-md">
|
||||
<!-- header บน table มี ค้นหา แสดงคอลัมน์ ปุ่มแก้ไข เพิ่ม เผยแพร่ข้อมูล ยกเลิก (status nornmalData false) -->
|
||||
<div class="col-12 row q-py-sm" v-if="nornmalData == false">
|
||||
<q-btn
|
||||
v-if="!editvisible == true && publicNoBtn == false"
|
||||
flat
|
||||
round
|
||||
:disabled="editvisible == true"
|
||||
:color="editvisible == true ? 'grey-7' : 'primary'"
|
||||
@click="edit"
|
||||
icon="mdi-pencil-outline"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- ยกเลิก แสดงเมื่อ กดปุ่มแก้ไข -->
|
||||
<q-btn
|
||||
v-else
|
||||
flat
|
||||
round
|
||||
:disabled="editvisible == false"
|
||||
:outline="editvisible == false"
|
||||
:color="editvisible == false ? 'grey-7' : 'red'"
|
||||
@click="cancel()"
|
||||
icon="mdi-undo"
|
||||
>
|
||||
<q-tooltip>ยกเลิก</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- <q-separator vertical /> -->
|
||||
<div class="q-px-sm">
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
:disabled="editvisible == false"
|
||||
:color="editvisible == false ? 'grey-7' : 'add'"
|
||||
@click="add"
|
||||
icon="mdi-plus"
|
||||
>
|
||||
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
|
||||
<!-- บันทึกร่าง แสดงเมื่อ กดปุ่มแก้ไข ข้อมูลมีการเป็นแปลงหรือ ยังไม่เผยแพร่ข้อมูล -->
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
:disabled="!(editvisible == true && updateData == true)"
|
||||
:color="!(editvisible == true && updateData == true) ? 'grey-7' : 'public'"
|
||||
@click="checkSave"
|
||||
v-if="saveNoDraft == false"
|
||||
icon="mdi-content-save-outline"
|
||||
>
|
||||
<q-tooltip>บันทึกร่าง</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- ลบบันทึกร่าง แสดงเมื่อ บันทึกร่างแล้ว -->
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
:disabled="publicData == true"
|
||||
:color="publicData == true ? 'grey-7' : 'deep-orange'"
|
||||
@click="DeleteModal"
|
||||
icon="mdi-file-remove-outline"
|
||||
v-if="publicNoBtn == false"
|
||||
>
|
||||
<q-tooltip>ลบบันทึกร่าง</q-tooltip>
|
||||
</q-btn>
|
||||
</div>
|
||||
|
||||
<!-- เผยแพร่ -->
|
||||
<q-btn
|
||||
flat
|
||||
round
|
||||
:disabled="!(publicData == false || updateData == true)"
|
||||
:color="!(publicData == false || updateData == true) ? 'grey-7' : 'public'"
|
||||
@click="publishModal"
|
||||
icon="mdi-cloud-upload-outline"
|
||||
v-if="publicNoBtn == false"
|
||||
>
|
||||
<q-tooltip>เผยแพร่</q-tooltip>
|
||||
</q-btn>
|
||||
<div class="items-center" style="display: flex">
|
||||
<div
|
||||
class="row items-center"
|
||||
style="display: flex"
|
||||
v-if="publicData == false && publicNoBtn == false"
|
||||
>
|
||||
<div class="text-public text-body2 text-weight-medium q-px-sm">ข้อมูลยังไม่เผยแพร่</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<q-space />
|
||||
<div class="items-center" style="display: flex">
|
||||
<!-- ข้อความสถานะเผยแพร่ โดยใช้ parameter publicData เป็นตัวกำหนดข้อความ -->
|
||||
<!-- <div class="row items-center" style="display: flex" v-if="publicData == true">
|
||||
<q-icon cener size="20px" name="label_important" class="icon-color" />
|
||||
<div class="text-size">ข้อมูลเผยแพร่แล้ว</div>
|
||||
</div> -->
|
||||
<div
|
||||
class="row items-center"
|
||||
style="display: flex"
|
||||
v-if="publicData == false && publicNoBtn == false"
|
||||
>
|
||||
<!-- <q-icon cener size="20px" name="label_important" color="amber" />
|
||||
<div class="text-grey-7 text-body2 text-weight-medium q-px-sm">
|
||||
ข้อมูลยังไม่เผยแพร่
|
||||
</div> -->
|
||||
</div>
|
||||
<!-- ค้นหาข้อความใน table -->
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
:model-value="inputfilter"
|
||||
ref="filterRef"
|
||||
@update:model-value="updateInput"
|
||||
outlined
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
style="max-width: 200px"
|
||||
class="q-ml-sm"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="inputfilter == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="inputfilter !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="resetFilter"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<!-- แสดงคอลัมน์ใน table -->
|
||||
<q-select
|
||||
:model-value="inputvisible"
|
||||
@update:model-value="updateVisible"
|
||||
:display-value="$q.lang.table.columns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
:options="attrs.columns"
|
||||
options-dense
|
||||
option-value="name"
|
||||
map-options
|
||||
emit-value
|
||||
style="min-width: 150px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<!-- header บน table มี ค้นหา แสดงคอลัมน์ (status nornmalData true) -->
|
||||
<div class="col-12 row q-py-sm" v-if="nornmalData == true">
|
||||
<q-space />
|
||||
<div class="items-center" style="display: flex">
|
||||
<!-- ค้นหาข้อความใน table -->
|
||||
<q-input
|
||||
standout
|
||||
dense
|
||||
:model-value="inputfilter"
|
||||
ref="filterRef"
|
||||
@update:model-value="updateInput"
|
||||
outlined
|
||||
debounce="300"
|
||||
placeholder="ค้นหา"
|
||||
style="max-width: 200px"
|
||||
class="q-ml-sm"
|
||||
>
|
||||
<template v-slot:append>
|
||||
<q-icon v-if="inputfilter == ''" name="search" />
|
||||
<q-icon
|
||||
v-if="inputfilter !== ''"
|
||||
name="clear"
|
||||
class="cursor-pointer"
|
||||
@click="resetFilter"
|
||||
/>
|
||||
</template>
|
||||
</q-input>
|
||||
<!-- แสดงคอลัมน์ใน table -->
|
||||
<q-select
|
||||
:model-value="inputvisible"
|
||||
@update:model-value="updateVisible"
|
||||
:display-value="$q.lang.table.columns"
|
||||
multiple
|
||||
outlined
|
||||
dense
|
||||
:options="attrs.columns"
|
||||
options-dense
|
||||
option-value="name"
|
||||
map-options
|
||||
emit-value
|
||||
style="min-width: 150px"
|
||||
class="gt-xs q-ml-sm"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
<q-table
|
||||
ref="table"
|
||||
flat
|
||||
bordered
|
||||
class="custom-header-table"
|
||||
v-bind="attrs"
|
||||
virtual-scroll
|
||||
:virtual-scroll-sticky-size-start="48"
|
||||
dense
|
||||
:pagination-label="paginationLabel"
|
||||
:pagination="initialPagination"
|
||||
:rows-per-page-options="paging == true ? [25, 50, 100, 500] : []"
|
||||
>
|
||||
<!-- :pagination="initialPagination" -->
|
||||
<!-- :rows-per-page-options="[0]" -->
|
||||
<template v-slot:header="props">
|
||||
<q-tr :props="props">
|
||||
<q-th auto-width v-if="boss == true" />
|
||||
<q-th v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<span class="text-weight-medium">{{ col.label }}</span>
|
||||
</q-th>
|
||||
<q-th
|
||||
auto-width
|
||||
v-if="editvisible == true || nextPageVisible == true || history == true"
|
||||
/>
|
||||
</q-tr>
|
||||
</template>
|
||||
<!-- สำหรับเรียกใช้ template ตัวข้างนอก -->
|
||||
<template #body="props">
|
||||
<slot v-bind="props" name="columns"></slot>
|
||||
</template>
|
||||
</q-table>
|
||||
</div>
|
||||
<!-- ข้อมูลการเผยแพร่ข้อมูล -->
|
||||
<q-dialog v-model="modalPublish" persistent>
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row">
|
||||
<div class="q-pr-md">
|
||||
<q-avatar icon="public" size="lg" font-size="25px" color="blue-1" text-color="public" />
|
||||
</div>
|
||||
<div class="col text-dark">
|
||||
<span class="text-bold">ต้องการเผยแพร่ข้อมูลนี้หรือไม่?</span>
|
||||
<br />
|
||||
<span>ข้อมูลที่กำลังถูกเผยแพร่นี้จะมีผลใช้งานทันที</span>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="ยกเลิก" flat color="grey-8" v-close-popup />
|
||||
<q-btn label="เผยแพร่" color="public" @click="publish()" v-close-popup />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
|
||||
<!-- ข้อมูลการลบเผยแพร่ข้อมูล -->
|
||||
<q-dialog v-model="modalDelete" persistent>
|
||||
<q-card class="q-pa-sm">
|
||||
<q-card-section class="row">
|
||||
<div class="q-pr-md">
|
||||
<q-avatar
|
||||
icon="mdi-file-remove-outline"
|
||||
size="lg"
|
||||
font-size="25px"
|
||||
color="red-1"
|
||||
text-color="deep-orange"
|
||||
/>
|
||||
</div>
|
||||
<div class="col text-dark">
|
||||
<span class="text-bold">ต้องการลบข้อมูลบันทึกร่างนี้หรือไม่?</span>
|
||||
<br />
|
||||
<span>ข้อมูลบันทึกร่างที่กำลังถูกลบนี้จะมีผลใช้งานทันที</span>
|
||||
</div>
|
||||
</q-card-section>
|
||||
|
||||
<q-card-actions align="right" class="bg-white text-teal">
|
||||
<q-btn label="ยกเลิก" flat color="grey-8" v-close-popup />
|
||||
<q-btn label="ลบบันทึก" color="red" @click="deleted()" v-close-popup />
|
||||
</q-card-actions>
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, useAttrs } from 'vue'
|
||||
|
||||
const attrs = ref<any>(useAttrs())
|
||||
const table = ref<any>(null)
|
||||
const filterRef = ref<any>(null)
|
||||
const modalPublish = ref<boolean>(false)
|
||||
const modalDelete = ref<boolean>(false)
|
||||
const props = defineProps({
|
||||
inputfilter: String,
|
||||
inputvisible: Array,
|
||||
editvisible: Boolean,
|
||||
boss: {
|
||||
type: Boolean,
|
||||
defualt: false
|
||||
},
|
||||
saveNoDraft: {
|
||||
type: Boolean,
|
||||
defualt: false
|
||||
},
|
||||
history: {
|
||||
type: Boolean,
|
||||
defualt: false
|
||||
},
|
||||
paging: {
|
||||
type: Boolean,
|
||||
defualt: false
|
||||
},
|
||||
nornmalData: {
|
||||
type: Boolean,
|
||||
defualt: false
|
||||
},
|
||||
nextPageVisible: {
|
||||
type: Boolean,
|
||||
defualt: false
|
||||
},
|
||||
publicData: {
|
||||
type: Boolean,
|
||||
defualt: true,
|
||||
required: false
|
||||
},
|
||||
updateData: {
|
||||
type: Boolean,
|
||||
defualt: true,
|
||||
required: false
|
||||
},
|
||||
publicNoBtn: {
|
||||
type: Boolean,
|
||||
defualt: false
|
||||
},
|
||||
add: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
edit: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
save: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
deleted: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
cancel: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
publish: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
validate: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
}
|
||||
})
|
||||
const initialPagination = ref<any>({
|
||||
// descending: false,
|
||||
rowsPerPage: props.paging == true ? 25 : 0
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:inputfilter', 'update:inputvisible', 'update:editvisible'])
|
||||
|
||||
const updateEdit = (value: any) => {
|
||||
emit('update:editvisible', value)
|
||||
}
|
||||
const updateInput = (value: any) => {
|
||||
emit('update:inputfilter', value)
|
||||
}
|
||||
const updateVisible = (value: any) => {
|
||||
emit('update:inputvisible', value)
|
||||
}
|
||||
|
||||
const paginationLabel = (start: string, end: string, total: string) => {
|
||||
if (props.paging == true) return ' ' + start + ' ใน ' + end + ' จากจำนวน ' + total + ' รายการ'
|
||||
else return start + '-' + end + ' ใน ' + total
|
||||
}
|
||||
|
||||
const checkSave = () => {
|
||||
props.validate()
|
||||
props.save()
|
||||
// if (myForm.value !== null) {
|
||||
// myForm.value.validate().then((success) => {
|
||||
// if (success) {
|
||||
// }
|
||||
// });
|
||||
// }
|
||||
}
|
||||
|
||||
const publishModal = () => {
|
||||
props.validate()
|
||||
const filter = attrs.value.rows.filter((r: any) => r.name == '')
|
||||
|
||||
if (filter.length == 0 || attrs.value.rows.length == 0) {
|
||||
modalPublish.value = true
|
||||
}
|
||||
}
|
||||
|
||||
const DeleteModal = () => {
|
||||
modalDelete.value = true
|
||||
}
|
||||
|
||||
const edit = async () => {
|
||||
updateEdit(!props.editvisible)
|
||||
props.edit()
|
||||
}
|
||||
|
||||
const add = async () => {
|
||||
// if (myForm.value !== null) {
|
||||
// myForm.value.validate();
|
||||
// }
|
||||
props.validate()
|
||||
props.add()
|
||||
await table.value.lastPage()
|
||||
await table.value.scrollTo(attrs.value.rows.length - 1)
|
||||
}
|
||||
|
||||
const deleted = async () => {
|
||||
if (props.publicNoBtn === false) {
|
||||
updateEdit(false)
|
||||
}
|
||||
props.deleted()
|
||||
}
|
||||
|
||||
const resetFilter = () => {
|
||||
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
|
||||
emit('update:inputfilter', '')
|
||||
filterRef.value.focus()
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.icon-color {
|
||||
color: #4154b3;
|
||||
}
|
||||
.custom-header-table {
|
||||
max-height: 64vh;
|
||||
.q-table tr:nth-child(odd) td {
|
||||
background: white;
|
||||
}
|
||||
.q-table tr:nth-child(even) td {
|
||||
background: #f6f6f6ae;
|
||||
}
|
||||
|
||||
.q-table thead tr {
|
||||
background: #ecebeb;
|
||||
}
|
||||
|
||||
.q-table thead tr th {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
}
|
||||
/* this will be the loading indicator */
|
||||
.q-table thead tr:last-child th {
|
||||
/* height of all previous header rows */
|
||||
top: 48px;
|
||||
}
|
||||
.q-table thead tr:first-child th {
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,86 +0,0 @@
|
|||
<script setup lang="ts">
|
||||
import WelcomeItem from './WelcomeItem.vue'
|
||||
import DocumentationIcon from './icons/IconDocumentation.vue'
|
||||
import ToolingIcon from './icons/IconTooling.vue'
|
||||
import EcosystemIcon from './icons/IconEcosystem.vue'
|
||||
import CommunityIcon from './icons/IconCommunity.vue'
|
||||
import SupportIcon from './icons/IconSupport.vue'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<WelcomeItem>
|
||||
<template #icon>
|
||||
<DocumentationIcon />
|
||||
</template>
|
||||
<template #heading>Documentation</template>
|
||||
|
||||
Vue’s
|
||||
<a href="https://vuejs.org/" target="_blank" rel="noopener">official documentation</a>
|
||||
provides you with all information you need to get started.
|
||||
</WelcomeItem>
|
||||
|
||||
<WelcomeItem>
|
||||
<template #icon>
|
||||
<ToolingIcon />
|
||||
</template>
|
||||
<template #heading>Tooling</template>
|
||||
|
||||
This project is served and bundled with
|
||||
<a href="https://vitejs.dev/guide/features.html" target="_blank" rel="noopener">Vite</a>. The
|
||||
recommended IDE setup is
|
||||
<a href="https://code.visualstudio.com/" target="_blank" rel="noopener">VSCode</a> +
|
||||
<a href="https://github.com/johnsoncodehk/volar" target="_blank" rel="noopener">Volar</a>. If
|
||||
you need to test your components and web pages, check out
|
||||
<a href="https://www.cypress.io/" target="_blank" rel="noopener">Cypress</a> and
|
||||
<a href="https://on.cypress.io/component" target="_blank">Cypress Component Testing</a>.
|
||||
|
||||
<br />
|
||||
|
||||
More instructions are available in <code>README.md</code>.
|
||||
</WelcomeItem>
|
||||
|
||||
<WelcomeItem>
|
||||
<template #icon>
|
||||
<EcosystemIcon />
|
||||
</template>
|
||||
<template #heading>Ecosystem</template>
|
||||
|
||||
Get official tools and libraries for your project:
|
||||
<a href="https://pinia.vuejs.org/" target="_blank" rel="noopener">Pinia</a>,
|
||||
<a href="https://router.vuejs.org/" target="_blank" rel="noopener">Vue Router</a>,
|
||||
<a href="https://test-utils.vuejs.org/" target="_blank" rel="noopener">Vue Test Utils</a>, and
|
||||
<a href="https://github.com/vuejs/devtools" target="_blank" rel="noopener">Vue Dev Tools</a>. If
|
||||
you need more resources, we suggest paying
|
||||
<a href="https://github.com/vuejs/awesome-vue" target="_blank" rel="noopener">Awesome Vue</a>
|
||||
a visit.
|
||||
</WelcomeItem>
|
||||
|
||||
<WelcomeItem>
|
||||
<template #icon>
|
||||
<CommunityIcon />
|
||||
</template>
|
||||
<template #heading>Community</template>
|
||||
|
||||
Got stuck? Ask your question on
|
||||
<a href="https://chat.vuejs.org" target="_blank" rel="noopener">Vue Land</a>, our official
|
||||
Discord server, or
|
||||
<a href="https://stackoverflow.com/questions/tagged/vue.js" target="_blank" rel="noopener"
|
||||
>StackOverflow</a
|
||||
>. You should also subscribe to
|
||||
<a href="https://news.vuejs.org" target="_blank" rel="noopener">our mailing list</a> and follow
|
||||
the official
|
||||
<a href="https://twitter.com/vuejs" target="_blank" rel="noopener">@vuejs</a>
|
||||
twitter account for latest news in the Vue world.
|
||||
</WelcomeItem>
|
||||
|
||||
<WelcomeItem>
|
||||
<template #icon>
|
||||
<SupportIcon />
|
||||
</template>
|
||||
<template #heading>Support Vue</template>
|
||||
|
||||
As an independent project, Vue relies on community backing for its sustainability. You can help
|
||||
us by
|
||||
<a href="https://vuejs.org/sponsor/" target="_blank" rel="noopener">becoming a sponsor</a>.
|
||||
</WelcomeItem>
|
||||
</template>
|
||||
|
|
@ -1,86 +0,0 @@
|
|||
<template>
|
||||
<div class="item">
|
||||
<i>
|
||||
<slot name="icon"></slot>
|
||||
</i>
|
||||
<div class="details">
|
||||
<h3>
|
||||
<slot name="heading"></slot>
|
||||
</h3>
|
||||
<slot></slot>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style scoped>
|
||||
.item {
|
||||
margin-top: 2rem;
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.details {
|
||||
flex: 1;
|
||||
margin-left: 1rem;
|
||||
}
|
||||
|
||||
i {
|
||||
display: flex;
|
||||
place-items: center;
|
||||
place-content: center;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
|
||||
color: var(--color-text);
|
||||
}
|
||||
|
||||
h3 {
|
||||
font-size: 1.2rem;
|
||||
font-weight: 500;
|
||||
margin-bottom: 0.4rem;
|
||||
color: var(--color-heading);
|
||||
}
|
||||
|
||||
@media (min-width: 1024px) {
|
||||
.item {
|
||||
margin-top: 0;
|
||||
padding: 0.4rem 0 1rem calc(var(--section-gap) / 2);
|
||||
}
|
||||
|
||||
i {
|
||||
top: calc(50% - 25px);
|
||||
left: -26px;
|
||||
position: absolute;
|
||||
border: 1px solid var(--color-border);
|
||||
background: var(--color-background);
|
||||
border-radius: 8px;
|
||||
width: 50px;
|
||||
height: 50px;
|
||||
}
|
||||
|
||||
.item:before {
|
||||
content: ' ';
|
||||
border-left: 1px solid var(--color-border);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: calc(50% + 25px);
|
||||
height: calc(50% - 25px);
|
||||
}
|
||||
|
||||
.item:after {
|
||||
content: ' ';
|
||||
border-left: 1px solid var(--color-border);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: calc(50% + 25px);
|
||||
height: calc(50% - 25px);
|
||||
}
|
||||
|
||||
.item:first-of-type:before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.item:last-of-type:after {
|
||||
display: none;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -8,18 +8,6 @@
|
|||
</div>
|
||||
<div v-if="editData == true">
|
||||
<div class="q-gutter-sm q-mx-sm" v-if="addData == true">
|
||||
<!-- <q-btn
|
||||
size="12px"
|
||||
v-if="!edit"
|
||||
flat
|
||||
round
|
||||
:disabled="disable"
|
||||
:color="edit ? 'grey-7' : 'primary'"
|
||||
@click="ClickEdit"
|
||||
icon="mdi-pencil-outline"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn> -->
|
||||
<q-btn
|
||||
size="15px"
|
||||
flat
|
||||
|
|
@ -31,31 +19,8 @@
|
|||
>
|
||||
<q-tooltip>บันทึกข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- <q-btn
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
v-if="edit"
|
||||
:color="!edit ? 'grey-7' : 'red'"
|
||||
@click="ClickCancel"
|
||||
icon="mdi-undo"
|
||||
>
|
||||
<q-tooltip>ยกเลิก</q-tooltip>
|
||||
</q-btn> -->
|
||||
</div>
|
||||
<div class="q-pl-sm" v-else>
|
||||
<!-- <q-btn
|
||||
size="12px"
|
||||
v-if="!edit"
|
||||
flat
|
||||
round
|
||||
:disabled="disable"
|
||||
:color="edit ? 'grey-7' : 'primary'"
|
||||
@click="ClickEdit"
|
||||
icon="mdi-pencil-outline"
|
||||
>
|
||||
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
|
||||
</q-btn> -->
|
||||
<q-btn
|
||||
size="12px"
|
||||
flat
|
||||
|
|
@ -67,17 +32,6 @@
|
|||
>
|
||||
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- <q-btn
|
||||
size="12px"
|
||||
flat
|
||||
round
|
||||
v-if="edit"
|
||||
:color="!edit ? 'grey-7' : 'red'"
|
||||
@click="ClickCancel"
|
||||
icon="mdi-undo"
|
||||
>
|
||||
<q-tooltip>ยกเลิก</q-tooltip>
|
||||
</q-btn> -->
|
||||
</div>
|
||||
</div>
|
||||
<q-space />
|
||||
|
|
@ -122,43 +76,11 @@ const props = defineProps({
|
|||
save: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
deleted: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
cancel: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
editBtn: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
changeBtn: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update:edit'])
|
||||
|
||||
const updateEdit = (value: any) => {
|
||||
emit('update:edit', value)
|
||||
}
|
||||
|
||||
const ClickEdit = () => {
|
||||
updateEdit(!props.edit)
|
||||
props.editBtn()
|
||||
props.changeBtn()
|
||||
}
|
||||
|
||||
const ClickCancel = () => {
|
||||
updateEdit(!props.edit)
|
||||
props.cancel()
|
||||
props.changeBtn()
|
||||
}
|
||||
|
||||
const save = () => {
|
||||
props.save()
|
||||
}
|
||||
|
|
|
|||
|
|
@ -21,52 +21,4 @@ interface optionType {
|
|||
color: string
|
||||
}
|
||||
|
||||
const menuList = readonly<menuType[]>([
|
||||
{
|
||||
key: 1,
|
||||
icon: 'mdi-home-variant-outline',
|
||||
activeIcon: 'mdi-home-variant',
|
||||
label: 'หน้าแรก',
|
||||
path: 'dashboard'
|
||||
},
|
||||
{
|
||||
key: 2,
|
||||
icon: 'o_person',
|
||||
activeIcon: 'person',
|
||||
label: 'รายการสอบทั้งหมด',
|
||||
path: 'exam'
|
||||
}
|
||||
])
|
||||
|
||||
const options = readonly<optionType[]>([
|
||||
{
|
||||
icon: 'mdi-account-cog',
|
||||
label: 'ผู้ดูแลระบบ',
|
||||
value: 'op1',
|
||||
color: 'primary'
|
||||
},
|
||||
{
|
||||
icon: 'mdi-account-group',
|
||||
label: 'เจ้าหน้าที่',
|
||||
value: 'op2',
|
||||
color: 'blue'
|
||||
},
|
||||
{
|
||||
icon: 'mdi-account-circle',
|
||||
label: 'บุคคล',
|
||||
value: 'op3',
|
||||
color: 'indigo'
|
||||
}
|
||||
])
|
||||
|
||||
const notiList = readonly<notiType[]>([
|
||||
{
|
||||
id: 1,
|
||||
sender: 'ท',
|
||||
body: 'ขอแก้ไขข้อมูลรายการสอบทั้งหมด',
|
||||
timereceive: '13/12/2565'
|
||||
}
|
||||
])
|
||||
|
||||
export { menuList, options, notiList }
|
||||
export type { menuType, notiType, optionType }
|
||||
|
|
|
|||
|
|
@ -36,14 +36,6 @@ app.use(
|
|||
// quasarUserOptions
|
||||
)
|
||||
|
||||
app.component(
|
||||
'data-table',
|
||||
defineAsyncComponent(() => import('./components/TableView.vue'))
|
||||
)
|
||||
app.component(
|
||||
'notifyError',
|
||||
defineAsyncComponent(() => import('./components/NotifyError.vue'))
|
||||
)
|
||||
app.component(
|
||||
'datepicker',
|
||||
defineAsyncComponent(() => import('@vuepic/vue-datepicker'))
|
||||
|
|
|
|||
|
|
@ -48,12 +48,12 @@
|
|||
จะใช้วิธีการที่ชอบด้วยกฏหมายและเป็นธรรมในการเก็บรวบรวมข้อมูลส่วนบุคคลอย่างจำกัดเพียงเท่าที่จำเป็นภายใต้วัตถุประสงค์การทำงานของกรุงเทพมหานครฯ
|
||||
เพื่อใช้เป็นข้อมูลประกอบการพิจารณาคัดเลือกตามตำแหน่งที่ผู้ให้ข้อมูลประสงค์จะสมัครรับการคัดเลือกโดยกรุงเทพมหานครฯ
|
||||
จะเก็บรวบรวมข้อมูลส่วนบุคคลของท่าน ดังนี้
|
||||
<ul style="list-style-type: circle;">
|
||||
<li>ชื่อ-นามสกุล เพื่อติดต่อกับทางกรุงเทพมหานครฯ</li>
|
||||
<li>อีเมล์ เพื่อใช้ในการติดต่อกับกรุงเทพมหานครฯ</li>
|
||||
<li>เบอร์โทร เพื่อใช้สมัครงานกับทางกรุงเทพมหานครฯ</li>
|
||||
<li>ที่อยู่ เพื่อใช้สมัครงานกับทางกรุงเทพมหานครฯ</li>
|
||||
<li>ประวัติการทำงาน, ประวัติการศึกษา, ประวัติการฝึกอบรม ตามข้อมูลข้างต้น</li>
|
||||
<ul style="list-style-type: circle">
|
||||
<li>ชื่อ-นามสกุล เพื่อติดต่อกับทางกรุงเทพมหานครฯ</li>
|
||||
<li>อีเมล์ เพื่อใช้ในการติดต่อกับกรุงเทพมหานครฯ</li>
|
||||
<li>เบอร์โทร เพื่อใช้สมัครงานกับทางกรุงเทพมหานครฯ</li>
|
||||
<li>ที่อยู่ เพื่อใช้สมัครงานกับทางกรุงเทพมหานครฯ</li>
|
||||
<li>ประวัติการทำงาน, ประวัติการศึกษา, ประวัติการฝึกอบรม ตามข้อมูลข้างต้น</li>
|
||||
</ul>
|
||||
ท้้งนี้ข้อมูลส่วนบุคคลดังกล่าวเป็นข้อมูลที่จำเป็นสำหรับการทำงานของกรุงเทพมหานครฯ
|
||||
หากไม่มีข้อมูลดังกล่าว อาจส่งผลต่อกระบวนการพิจารณาคุณสมบัติของผู้สมัคร
|
||||
|
|
@ -80,7 +80,13 @@
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<q-card-actions align="right" class="bg-white text-teal justify-center">
|
||||
<q-btn label="ยอมรับ" style="width: 150px;" :color="!acceptTermOfUse ? 'grey':'primary'" @click="ok" :disable="!acceptTermOfUse" />
|
||||
<q-btn
|
||||
label="ยอมรับ"
|
||||
style="width: 150px"
|
||||
:color="!acceptTermOfUse ? 'grey' : 'primary'"
|
||||
@click="ok"
|
||||
:disable="!acceptTermOfUse"
|
||||
/>
|
||||
</q-card-actions>
|
||||
</template>
|
||||
|
||||
|
|
@ -88,10 +94,6 @@
|
|||
import { ref } from 'vue'
|
||||
import keycloak from '@/plugins/keycloak'
|
||||
const props = defineProps({
|
||||
close: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
ok: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
|
|
@ -20,17 +20,11 @@
|
|||
<div class="">เลขประจำตัวสอบ :</div>
|
||||
<div class="text-black text-bold q-pl-sm">{{ examNumber }}</div>
|
||||
</div>
|
||||
<!-- <div class="q-pt-xs row">
|
||||
<div class="">เวลาสอบ :</div>
|
||||
<div class="text-black q-pl-sm">{{ examTime }}</div>
|
||||
</div> -->
|
||||
<div class="q-pt-xs row">
|
||||
<div class="">เลขที่นั่งสอบ :</div>
|
||||
<div class="text-black text-bold q-pl-sm">{{ examSeat }}</div>
|
||||
</div>
|
||||
<div class="q-pt-xs row">
|
||||
<!-- <div class="">คะแนน</div>
|
||||
<div class="text-black text-bold q-pl-sm">{{ point }}</div> -->
|
||||
<div class="col-12 text-weight-bold">ผลการสอบ</div>
|
||||
<div class="row items-center q-gutter-y-sm col-12">
|
||||
<div class="col-xs-4 col-sm-5 text-weight-medium text-grey-7">ประเภท</div>
|
||||
|
|
@ -81,14 +75,6 @@
|
|||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div class="q-pt-xs row">
|
||||
<div class="">ห้องสอบ :</div>
|
||||
<div class="text-black q-pl-sm">{{ examRoom }}</div>
|
||||
</div>
|
||||
<div class="q-pt-xs row">
|
||||
<div class="">เลขที่นั่ง :</div>
|
||||
<div class="text-black q-pl-sm">{{ seatNumber }}</div>
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
<q-card-section class="col-4 flex flex-center">
|
||||
|
|
@ -114,15 +100,19 @@
|
|||
import { onMounted, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useQuasar } from 'quasar'
|
||||
|
||||
const $q = useQuasar()
|
||||
const route = useRoute()
|
||||
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
|
||||
const { dateThaiRange, modalDelete, modalConfirm, dateToISO, success, date2Thai } = mixin
|
||||
const { date2Thai, messageError } = mixin
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
const loader = ref<boolean>(false)
|
||||
const fullName = ref<string>('')
|
||||
const examNumber = ref<string>('')
|
||||
const citizenId = ref<string>('')
|
||||
|
|
@ -143,7 +133,7 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchStatus = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateCard(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -180,25 +170,16 @@ const fetchStatus = async () => {
|
|||
score_expired.value = new Date(data.announcementDate)
|
||||
number.value = data.number
|
||||
})
|
||||
.catch(() => {
|
||||
// acceptTermOfUse.value = false
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const download = () => {
|
||||
window.print()
|
||||
// var printContent = document.getElementById('print')
|
||||
// var WinPrint = window.open()
|
||||
// if (WinPrint != null && printContent != null) {
|
||||
// WinPrint.document.write(printContent.innerHTML)
|
||||
// // WinPrint.document.close()
|
||||
// // WinPrint.focus()
|
||||
// // WinPrint.print()
|
||||
// // WinPrint.close()
|
||||
// }
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -20,8 +20,8 @@
|
|||
</template>
|
||||
<script setup lang="ts">
|
||||
import type { PropType } from 'vue'
|
||||
import type { ExamCard } from '../interface/index/Main'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import type { ExamCard } from '../interface/index/Main'
|
||||
|
||||
const mixin = useCounterMixin()
|
||||
const { date2Thai } = mixin
|
||||
|
|
|
|||
|
|
@ -9,7 +9,6 @@
|
|||
เปิดรับสมัครวันที่ {{ date2Thai(exam.startDate) }} - {{ date2Thai(exam.endDate) }}
|
||||
</div>
|
||||
<div class="text-subtitle2 q-py-sm">ค่าธรรมเนียมการสมัคร {{ exam.fee }} บาท</div>
|
||||
<!-- <div v-html="exam.htmlBody.html"></div> -->
|
||||
</q-card-section>
|
||||
|
||||
<div class="text-subtitle1 text-center text-primary">เอกสารเกี่ยวกับการสอบนี้</div>
|
||||
|
|
@ -28,13 +27,6 @@
|
|||
</p>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <template v-slot:body-cell-name="props">
|
||||
<q-td :props="props">
|
||||
<div>
|
||||
<a href="https://quasar.dev/vue-components/table#QTable-API" />
|
||||
</div>
|
||||
</q-td>
|
||||
</template> -->
|
||||
</q-card>
|
||||
<div class="col-12">
|
||||
<div class="text-h6 q-py-sm">ข้อควรระวัง</div>
|
||||
|
|
@ -67,15 +59,12 @@ const props = defineProps({
|
|||
fetchStep: {
|
||||
type: Function,
|
||||
default: () => console.log('not function')
|
||||
},
|
||||
step: {
|
||||
type: Number,
|
||||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const mixin = useCounterMixin()
|
||||
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
|
||||
const { date2Thai } = mixin
|
||||
|
||||
const exam = ref<any>({
|
||||
contentItemId: null,
|
||||
displayText: 'การสอบภาค ข.พิเศษ สำหรับผู้สอบผ่านของ่วนราชการแล้ว',
|
||||
|
|
@ -94,8 +83,8 @@ const exam = ref<any>({
|
|||
]
|
||||
})
|
||||
|
||||
const applyCandidate = () => {
|
||||
props.fetchStep()
|
||||
const applyCandidate = async () => {
|
||||
await props.fetchStep()
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -88,6 +88,9 @@ import { onMounted, ref } from 'vue'
|
|||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useQuasar } from 'quasar'
|
||||
import ExamCard from '@/modules/01_exam/components/ExamCard.vue'
|
||||
|
||||
const props = defineProps({
|
||||
|
|
@ -101,10 +104,14 @@ const props = defineProps({
|
|||
}
|
||||
})
|
||||
|
||||
const $q = useQuasar()
|
||||
const route = useRoute()
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const mixin = useCounterMixin()
|
||||
const { messageError } = mixin
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
const loader = ref<boolean>(false)
|
||||
const fullName = ref<string>('')
|
||||
const examNumber = ref<string>('')
|
||||
const citizenId = ref<string>('')
|
||||
|
|
@ -117,7 +124,6 @@ const scoreSumFull = ref<number | null>(null)
|
|||
const scoreSum = ref<number | null>(null)
|
||||
const examResultinscore = ref<string>('')
|
||||
const avatar = ref<string>('')
|
||||
|
||||
const dialog = ref<boolean>(false)
|
||||
const rating = ref<number>(5)
|
||||
const text = ref<string>('')
|
||||
|
|
@ -127,7 +133,7 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchStatus = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateCard(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -153,27 +159,27 @@ const fetchStatus = async () => {
|
|||
avatar.value = data.avatar
|
||||
if (data.reviewPoint == null) dialog.value = true
|
||||
})
|
||||
.catch(() => {
|
||||
// acceptTermOfUse.value = false
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const sendRating = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.put(config.API.candidateReview(examId.value, positionId.value), {
|
||||
reviewPoint: rating.value, //คะแนน
|
||||
review: text.value //ข้อความ
|
||||
})
|
||||
.then((res) => {})
|
||||
.catch(() => {
|
||||
// acceptTermOfUse.value = false
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
dialog.value = false
|
||||
})
|
||||
}
|
||||
|
|
@ -188,10 +194,6 @@ const getClass = (val: string) => {
|
|||
size: A4;
|
||||
margin: 0;
|
||||
}
|
||||
/* #print {
|
||||
display: none;
|
||||
visibility: none;
|
||||
} */
|
||||
|
||||
@media print {
|
||||
@page {
|
||||
|
|
|
|||
|
|
@ -44,9 +44,9 @@
|
|||
import { onMounted, ref } from 'vue'
|
||||
import { useQuasar } from 'quasar'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import Profile from '@/modules/01_exam/components/Form/Profile.vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import {
|
||||
defaultInformation,
|
||||
|
|
@ -54,6 +54,7 @@ import {
|
|||
defaultAddress,
|
||||
defaultFamily
|
||||
} from '@/modules/01_exam/interface/index/Main'
|
||||
import Profile from '@/modules/01_exam/components/Form/Profile.vue'
|
||||
|
||||
const props = defineProps({
|
||||
fetchStep: {
|
||||
|
|
@ -68,8 +69,9 @@ const props = defineProps({
|
|||
|
||||
const $q = useQuasar()
|
||||
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
|
||||
const { modalConfirm, modalError, success, dateToISO } = mixin
|
||||
const loader = ref<boolean>(false)
|
||||
const { modalConfirm, modalError, success, dateToISO, messageError } = mixin
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const statusEdit = ref<boolean>(false)
|
||||
const acceptTermOfUse = ref<boolean>(false)
|
||||
const route = useRoute()
|
||||
|
|
@ -82,9 +84,6 @@ const formOccupation = ref<any>({})
|
|||
const saveAuto = ref<boolean>(false)
|
||||
|
||||
onMounted(async () => {
|
||||
// if (props.status !== 'register') {
|
||||
// acceptTermOfUse.value = true
|
||||
// }
|
||||
await fetchStatus()
|
||||
})
|
||||
|
||||
|
|
@ -103,31 +102,30 @@ const okModalConfirm = () => {
|
|||
}
|
||||
|
||||
const fetchStatus = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateCard(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
acceptTermOfUse.value = true
|
||||
})
|
||||
.catch(() => {
|
||||
.catch((e) => {
|
||||
acceptTermOfUse.value = false
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const saveForm = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateRegister(examId.value, positionId.value))
|
||||
.then(() => {
|
||||
// success($q, 'สมัครสอบสำเร็จสำเร็จ')
|
||||
.then(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
await props.fetchStep()
|
||||
loader.value = false
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -156,7 +154,7 @@ const saveData = async () => {
|
|||
type.value = defaultOccupation.value.employee
|
||||
if (defaultOccupation.value.status == 'other')
|
||||
type.value = defaultOccupation.value.other
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.post(config.API.candidateId(examId.value, positionId.value), {
|
||||
prefixId: defaultInformation.value.prefixId,
|
||||
|
|
@ -227,14 +225,10 @@ const saveData = async () => {
|
|||
success($q, 'บันทึกข้อมูลส่วนตัวสำเร็จ')
|
||||
if (saveAuto.value) await saveForm()
|
||||
})
|
||||
.catch(() => {
|
||||
// modalError.value = true
|
||||
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
|
||||
// modalErrorDetail.value = e.response.data.message
|
||||
// statusCode.value = e.response.data.status
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
await props.fetchStep()
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -83,21 +83,6 @@
|
|||
accept="image/*"
|
||||
@change="uploadImage"
|
||||
/>
|
||||
<!-- <q-file
|
||||
id="file-upload"
|
||||
v-model="filePayment"
|
||||
dense
|
||||
label="อัพโหลดหลักฐานชำระเงิน"
|
||||
outlined
|
||||
use-chips
|
||||
multiple
|
||||
class="q-pl-sm"
|
||||
v-if="status == 'payment' || status == 'rejectPayment'"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -169,7 +154,6 @@
|
|||
</div>
|
||||
<div class="col-xs-12 col-sm-5">
|
||||
<label for="file-upload" class="col-12 row">
|
||||
<!-- :src="img" -->
|
||||
<q-img
|
||||
src="@/assets/ex_slip.jpeg"
|
||||
fit="contain"
|
||||
|
|
@ -196,21 +180,6 @@
|
|||
accept="image/*"
|
||||
@change="uploadImage"
|
||||
/>
|
||||
<!-- <q-file
|
||||
id="file-upload"
|
||||
v-model="filePayment"
|
||||
dense
|
||||
label="อัพโหลดหลักฐานชำระเงิน"
|
||||
outlined
|
||||
use-chips
|
||||
multiple
|
||||
class="q-pl-sm"
|
||||
v-if="status == 'payment' || status == 'rejectPayment'"
|
||||
>
|
||||
<template v-slot:prepend>
|
||||
<q-icon name="attach_file" />
|
||||
</template>
|
||||
</q-file> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -230,11 +199,11 @@
|
|||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref } from 'vue'
|
||||
import { useQuasar } from 'quasar'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
|
@ -252,10 +221,11 @@ const props = defineProps({
|
|||
|
||||
const $q = useQuasar()
|
||||
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
|
||||
const { success, modalError } = mixin
|
||||
const { success, modalError, messageError } = mixin
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const rejectMessage = ref<string>('')
|
||||
const img = ref<string>('')
|
||||
const loader = ref<boolean>(false)
|
||||
const route = useRoute()
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
|
|
@ -269,7 +239,7 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchPaymentExam = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.periodExamPayment(examId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -277,14 +247,16 @@ const fetchPaymentExam = async () => {
|
|||
bank.value = data.bankExam
|
||||
fee.value = data.fee
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const fetchData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidatePayment(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -292,9 +264,11 @@ const fetchData = async () => {
|
|||
img.value = data.paymentImg
|
||||
rejectMessage.value = data.rejectDetail
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -302,17 +276,18 @@ const clickPayment = async () => {
|
|||
if (img.value != null || img.value != '') {
|
||||
const formData = new FormData()
|
||||
formData.append('', filePayment.value[0])
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.post(config.API.candidatePayment(examId.value, positionId.value))
|
||||
.then(() => {
|
||||
success($q, 'ส่งหลักฐานชำระเงินสำเร็จ')
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
props.fetchStep()
|
||||
filePayment.value = []
|
||||
await props.fetchStep()
|
||||
})
|
||||
} else {
|
||||
modalError($q, 'ไม่สามารถยืนยันการชำระเงินได้', 'กรุณาอัปโหลดเอกสารหลักฐานชำระเงิน')
|
||||
|
|
@ -324,16 +299,17 @@ const uploadImage = async (file: any) => {
|
|||
if (input.length > 0) {
|
||||
const formData = new FormData()
|
||||
formData.append('', input[0])
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.put(config.API.candidatePayment(examId.value, positionId.value), formData)
|
||||
.then(() => {
|
||||
success($q, 'ส่งหลักฐานชำระเงินสำเร็จ')
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
props.fetchStep()
|
||||
await props.fetchStep()
|
||||
await fetchData()
|
||||
file = []
|
||||
})
|
||||
|
|
@ -343,15 +319,19 @@ const uploadImage = async (file: any) => {
|
|||
}
|
||||
|
||||
const downloadBillPayment = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateBill(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
window.open(data)
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(async () => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
:editOnly="false"
|
||||
:editData="false"
|
||||
/>
|
||||
<!-- :changeBtn="changeBtn" -->
|
||||
<q-form ref="myform">
|
||||
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
|
||||
<div class="col-xs-12">
|
||||
|
|
@ -25,7 +24,6 @@
|
|||
:rules="[(val) => !!val || `${'กรุณากรอก ที่อยู่ตามทะเบียนบ้าน'}`]"
|
||||
:label="`${'ที่อยู่ตามทะเบียนบ้าน'}`"
|
||||
/>
|
||||
<!-- :filled="(status == 'register' || status == 'rejectRegister')" -->
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||
<q-select
|
||||
|
|
@ -215,10 +213,13 @@ import { ref, onMounted, watch } from 'vue'
|
|||
import type { PropType } from 'vue'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useQuasar } from 'quasar'
|
||||
import type { Address, DataOption } from '@/modules/01_exam/interface/index/Main'
|
||||
import { defaultAddress, changeData } from '@/modules/01_exam/interface/index/Main'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
const props = defineProps({
|
||||
provinceOptions: {
|
||||
|
|
@ -234,20 +235,23 @@ const props = defineProps({
|
|||
required: true
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
const $q = useQuasar()
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const mixin = useCounterMixin()
|
||||
const { messageError } = mixin
|
||||
const route = useRoute()
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
const edit = ref<boolean>(true)
|
||||
const myform = ref<any>({})
|
||||
const loader = ref<boolean>(false)
|
||||
const districtOptions = ref<DataOption[]>([])
|
||||
const districtCOptions = ref<DataOption[]>([])
|
||||
const subdistrictOptions = ref<DataOption[]>([])
|
||||
const subdistrictCOptions = ref<DataOption[]>([])
|
||||
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
watch(myform, async (count: any, prevCount: any) => {
|
||||
emit('update:form', count)
|
||||
})
|
||||
|
|
@ -269,31 +273,35 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchData = async () => {
|
||||
// loader.value = true;
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateAddress(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
defaultAddress.value.address = data.registAddress
|
||||
defaultAddress.value.addressC = data.currentAddress
|
||||
defaultAddress.value.provinceId = data.registProvinceId
|
||||
defaultAddress.value.provinceIdC = data.currentProvinceId
|
||||
defaultAddress.value.districtId = data.registDistrictId
|
||||
defaultAddress.value.districtIdC = data.currentDistrictId
|
||||
defaultAddress.value.subdistrictId = data.registSubDistrictId
|
||||
defaultAddress.value.subdistrictIdC = data.currentSubDistrictId
|
||||
defaultAddress.value.code = data.registZipCode
|
||||
defaultAddress.value.codeC = data.currentZipCode
|
||||
defaultAddress.value.same =
|
||||
data.registSame == true ? '1' : data.registSame == false ? '0' : null
|
||||
if (data != null) {
|
||||
defaultAddress.value.address = data.registAddress
|
||||
defaultAddress.value.addressC = data.currentAddress
|
||||
defaultAddress.value.provinceId = data.registProvinceId
|
||||
defaultAddress.value.provinceIdC = data.currentProvinceId
|
||||
defaultAddress.value.districtId = data.registDistrictId
|
||||
defaultAddress.value.districtIdC = data.currentDistrictId
|
||||
defaultAddress.value.subdistrictId = data.registSubDistrictId
|
||||
defaultAddress.value.subdistrictIdC = data.currentSubDistrictId
|
||||
defaultAddress.value.code = data.registZipCode
|
||||
defaultAddress.value.codeC = data.currentZipCode
|
||||
defaultAddress.value.same =
|
||||
data.registSame == true ? '1' : data.registSame == false ? '0' : null
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
// loader.value = false;
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const selectProvince = (e: string, name: string) => {
|
||||
const selectProvince = async (e: string, name: string) => {
|
||||
if (name == '1') {
|
||||
defaultAddress.value.districtId = ''
|
||||
defaultAddress.value.subdistrictId = ''
|
||||
|
|
@ -304,10 +312,10 @@ const selectProvince = (e: string, name: string) => {
|
|||
defaultAddress.value.codeC = null
|
||||
}
|
||||
myform.value.resetValidation()
|
||||
fetchDistrict(e, name)
|
||||
await fetchDistrict(e, name)
|
||||
}
|
||||
|
||||
const selectDistrict = (e: string, name: string) => {
|
||||
const selectDistrict = async (e: string, name: string) => {
|
||||
if (name == '1') {
|
||||
defaultAddress.value.subdistrictId = ''
|
||||
defaultAddress.value.code = null
|
||||
|
|
@ -316,7 +324,7 @@ const selectDistrict = (e: string, name: string) => {
|
|||
defaultAddress.value.codeC = null
|
||||
}
|
||||
myform.value.resetValidation()
|
||||
fetchSubDistrict(e, name)
|
||||
await fetchSubDistrict(e, name)
|
||||
}
|
||||
|
||||
const selectSubDistrict = (e: string, name: string) => {
|
||||
|
|
@ -332,7 +340,7 @@ const selectSubDistrict = (e: string, name: string) => {
|
|||
}
|
||||
|
||||
const fetchDistrict = async (id: string, position: string) => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.listDistrict(id))
|
||||
.then((res) => {
|
||||
|
|
@ -347,14 +355,16 @@ const fetchDistrict = async (id: string, position: string) => {
|
|||
districtCOptions.value = option
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const fetchSubDistrict = async (id: string, position: string) => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.listSubDistrict(id))
|
||||
.then((res) => {
|
||||
|
|
@ -373,9 +383,11 @@ const fetchSubDistrict = async (id: string, position: string) => {
|
|||
subdistrictCOptions.value = option
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -11,7 +11,6 @@
|
|||
v-model:editvisible="edit"
|
||||
:add="clickAdd"
|
||||
:edit="clickEdit"
|
||||
:cancel="clickCancel"
|
||||
:addData="false"
|
||||
:editData="status == 'register' || status == 'rejectRegister'"
|
||||
name="ประวัติการทำงาน/ฝึกงาน"
|
||||
|
|
@ -51,7 +50,6 @@
|
|||
</template>
|
||||
</Table>
|
||||
</q-form>
|
||||
<!-- popup Edit window-->
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="width: 600px">
|
||||
<q-form ref="myForm">
|
||||
|
|
@ -165,7 +163,6 @@
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<DialogFooter
|
||||
:cancel="clickCancel"
|
||||
:edit="clickEdit"
|
||||
:save="clickSave"
|
||||
:validate="validateData"
|
||||
|
|
@ -185,9 +182,11 @@
|
|||
import { onMounted, ref, watch } from 'vue'
|
||||
import { useQuasar } from 'quasar'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useExamDataStore } from '@/modules/01_exam/store'
|
||||
import { useRoute } from 'vue-router'
|
||||
import type {
|
||||
RequestItemsObject,
|
||||
Columns,
|
||||
|
|
@ -197,7 +196,6 @@ import type { ResponseObject } from '@/modules/01_exam/interface/response/Career
|
|||
import Table from '@/components/Table.vue'
|
||||
import DialogHeader from '@/components/DialogHeader.vue'
|
||||
import DialogFooter from '@/components/DialogFooter.vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
const props = defineProps({
|
||||
status: {
|
||||
|
|
@ -208,10 +206,11 @@ const props = defineProps({
|
|||
|
||||
const $q = useQuasar()
|
||||
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
|
||||
const { dateThaiRange, modalDelete, modalConfirm, dateToISO, success } = mixin
|
||||
const { dateThaiRange, modalDelete, modalConfirm, dateToISO, success, messageError } = mixin
|
||||
const store = useExamDataStore()
|
||||
const { examData, changeExamColumns } = store
|
||||
const loader = ref<boolean>(false)
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const id = ref<string>('')
|
||||
const location = ref<string>()
|
||||
const position = ref<string>()
|
||||
|
|
@ -297,7 +296,7 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateCareer(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -311,16 +310,18 @@ const fetchData = async () => {
|
|||
})
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
// messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* กดดูข้อมูลก่อนหน้า
|
||||
*/
|
||||
const clickPrevious = () => {
|
||||
const clickPrevious = async () => {
|
||||
rowIndex.value -= 1
|
||||
const row = rows.value[rowIndex.value]
|
||||
location.value = row.location
|
||||
|
|
@ -329,13 +330,13 @@ const clickPrevious = () => {
|
|||
duration.value = row.duration
|
||||
reason.value = row.reason
|
||||
id.value = row.id
|
||||
checkRowPage()
|
||||
await checkRowPage()
|
||||
}
|
||||
|
||||
/**
|
||||
* กดดูข้อมูลต่อไป
|
||||
*/
|
||||
const clickNext = () => {
|
||||
const clickNext = async () => {
|
||||
rowIndex.value += 1
|
||||
const row = rows.value[rowIndex.value]
|
||||
location.value = row.location
|
||||
|
|
@ -344,7 +345,7 @@ const clickNext = () => {
|
|||
duration.value = row.duration
|
||||
reason.value = row.reason
|
||||
id.value = row.id
|
||||
checkRowPage()
|
||||
await checkRowPage()
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -366,7 +367,6 @@ const checkRowPage = () => {
|
|||
* กดปุ่มแก้ไขใน dialog
|
||||
*/
|
||||
const clickEdit = () => {
|
||||
// edit.value = true
|
||||
next.value = false
|
||||
previous.value = false
|
||||
}
|
||||
|
|
@ -374,8 +374,8 @@ const clickEdit = () => {
|
|||
/**
|
||||
* กดปุ่มเพิ่มด้านบน table
|
||||
*/
|
||||
const clickAdd = () => {
|
||||
addRow()
|
||||
const clickAdd = async () => {
|
||||
await addRow()
|
||||
}
|
||||
|
||||
const checkDelete = (row: RequestItemsObject) => {
|
||||
|
|
@ -388,26 +388,20 @@ const checkDelete = (row: RequestItemsObject) => {
|
|||
*/
|
||||
const clickDeleteRow = async () => {
|
||||
if (rawItem.value != null) {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.delete(config.API.candidateCareer(rawItem.value.id, ''))
|
||||
.then(() => {
|
||||
success($q, 'ลบข้อมูลสำเร็จ')
|
||||
})
|
||||
.catch(() => {
|
||||
// modalError.value = true
|
||||
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
|
||||
// modalErrorDetail.value = e.response.data.message
|
||||
// statusCode.value = e.response.data.status
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
await fetchData()
|
||||
// edit.value = false
|
||||
})
|
||||
} else {
|
||||
await fetchData()
|
||||
// edit.value = false
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -417,15 +411,11 @@ const clickDeleteRow = async () => {
|
|||
const clickSave = async () => {
|
||||
myForm.value.validate().then(async (result: boolean) => {
|
||||
if (result) {
|
||||
// if (store.consend == true) {
|
||||
if (modalEdit.value) {
|
||||
await editData()
|
||||
} else {
|
||||
await saveData()
|
||||
}
|
||||
// } else {
|
||||
// modalConsend.value = true
|
||||
// }
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
@ -434,7 +424,7 @@ const clickSave = async () => {
|
|||
* บันทึกเพิ่มข้อมูล
|
||||
*/
|
||||
const saveData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.post(config.API.candidateCareer(examId.value, positionId.value), {
|
||||
name: location.value,
|
||||
|
|
@ -447,15 +437,10 @@ const saveData = async () => {
|
|||
.then(() => {
|
||||
success($q, 'บันทึกข้อมูลสำเร็จ')
|
||||
})
|
||||
.catch(() => {
|
||||
// modalError.value = true
|
||||
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
|
||||
// modalErrorDetail.value = e.response.data.message
|
||||
// statusCode.value = e.response.data.status
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
// edit.value = false
|
||||
modal.value = false
|
||||
await fetchData()
|
||||
})
|
||||
|
|
@ -465,7 +450,7 @@ const saveData = async () => {
|
|||
* บันทึกแก้ไขข้อมูล
|
||||
*/
|
||||
const editData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.put(config.API.candidateCareer(id.value, ''), {
|
||||
name: location.value,
|
||||
|
|
@ -478,15 +463,10 @@ const editData = async () => {
|
|||
.then(() => {
|
||||
success($q, 'บันทึกข้อมูลสำเร็จ')
|
||||
})
|
||||
.catch(() => {
|
||||
// modalError.value = true
|
||||
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
|
||||
// modalErrorDetail.value = e.response.data.message
|
||||
// statusCode.value = e.response.data.status
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
// edit.value = false
|
||||
modal.value = false
|
||||
await fetchData()
|
||||
})
|
||||
|
|
@ -527,12 +507,8 @@ const selectData = (props: DataProps) => {
|
|||
duration.value = props.row.duration
|
||||
reason.value = props.row.reason
|
||||
id.value = props.row.id
|
||||
// if (edit.value == true) {
|
||||
next.value = false
|
||||
previous.value = false
|
||||
// } else {
|
||||
// checkRowPage()
|
||||
// }
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -548,13 +524,6 @@ const addRow = () => {
|
|||
reason.value = ''
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันปุ่มยกเลิกการแก้ไขข้อมูล
|
||||
*/
|
||||
const clickCancel = async () => {
|
||||
// edit.value = false
|
||||
}
|
||||
|
||||
/**
|
||||
* เช็คว่ามีการแก้ไขข้อมูล
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -81,18 +81,6 @@
|
|||
<q-uploader-add-trigger />
|
||||
<q-tooltip>เลือกไฟล์</q-tooltip>
|
||||
</q-btn>
|
||||
<!-- <q-btn
|
||||
v-if="scope.canUpload"
|
||||
icon="cloud_upload"
|
||||
label="อัพโหลดไฟล์"
|
||||
@click="scope.upload"
|
||||
round
|
||||
dense
|
||||
flat
|
||||
>
|
||||
<q-tooltip>อัพโหลดไฟล์</q-tooltip>
|
||||
</q-btn> -->
|
||||
|
||||
<q-btn v-if="scope.isUploading" icon="clear" @click="scope.abort" round dense flat>
|
||||
<q-tooltip>ยกเลิกการอัปโหลด</q-tooltip>
|
||||
</q-btn>
|
||||
|
|
@ -142,12 +130,15 @@
|
|||
</q-card>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from 'vue'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
import { onMounted, ref } from 'vue'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useQuasar } from 'quasar'
|
||||
import type { UploadType } from '@/modules/01_exam/interface/index/Main'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
|
||||
const props = defineProps({
|
||||
status: {
|
||||
|
|
@ -155,16 +146,21 @@ const props = defineProps({
|
|||
required: true
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['update:loader'])
|
||||
|
||||
const $q = useQuasar()
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const mixin = useCounterMixin()
|
||||
const { messageError } = mixin
|
||||
const route = useRoute()
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
const uploader = ref<any>()
|
||||
const loader = ref<boolean>(false)
|
||||
const edit = ref<boolean>(props.status == 'register' || props.status == 'rejectRegister')
|
||||
const name = ref<string>('')
|
||||
const files = ref<UploadType[]>([])
|
||||
const file = ref<File[]>([])
|
||||
const emit = defineEmits(['update:loader'])
|
||||
|
||||
onMounted(async () => {
|
||||
await getData()
|
||||
|
|
@ -176,21 +172,25 @@ const fileAdd = async (val: any) => {
|
|||
}
|
||||
|
||||
const getData = async () => {
|
||||
loader.value = true
|
||||
name.value = ''
|
||||
uploader.value.reset()
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateUpload(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
files.value = data
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
// messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const deleteData = async (id: string) => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
const params = {
|
||||
documentId: id
|
||||
}
|
||||
|
|
@ -198,35 +198,30 @@ const deleteData = async (id: string) => {
|
|||
.delete(config.API.candidateUpload(examId.value, positionId.value), {
|
||||
params
|
||||
})
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
.then((res) => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
await getData()
|
||||
})
|
||||
}
|
||||
|
||||
const uploadData = async () => {
|
||||
console.log('asdasd')
|
||||
const blob = file.value.slice(0, file.value[0].size)
|
||||
const newFile = new File(blob, name.value, {
|
||||
type: file.value[0].type
|
||||
})
|
||||
const formData = new FormData()
|
||||
formData.append('', newFile)
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.put(config.API.candidateUpload(examId.value, positionId.value), formData)
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
.then((res) => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
name.value = ''
|
||||
uploader.value.reset()
|
||||
await getData()
|
||||
})
|
||||
}
|
||||
|
|
|
|||
|
|
@ -11,7 +11,6 @@
|
|||
v-model:editvisible="edit"
|
||||
:add="clickAdd"
|
||||
:edit="clickEdit"
|
||||
:cancel="clickCancel"
|
||||
:addData="false"
|
||||
:editData="status == 'register' || status == 'rejectRegister'"
|
||||
name="ประวัติการศีกษา"
|
||||
|
|
@ -48,7 +47,6 @@
|
|||
</template>
|
||||
</Table>
|
||||
</q-form>
|
||||
<!-- popup Edit window-->
|
||||
<q-dialog v-model="modal" persistent>
|
||||
<q-card style="width: 600px">
|
||||
<q-form ref="myForm">
|
||||
|
|
@ -166,7 +164,6 @@
|
|||
</q-card-section>
|
||||
<q-separator />
|
||||
<DialogFooter
|
||||
:cancel="clickCancel"
|
||||
:edit="clickEdit"
|
||||
:save="clickSave"
|
||||
:validate="validateData"
|
||||
|
|
@ -184,11 +181,14 @@
|
|||
</template>
|
||||
<script setup lang="ts">
|
||||
import { onMounted, ref, watch } from 'vue'
|
||||
import type { PropType } from 'vue'
|
||||
import { useQuasar } from 'quasar'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useExamDataStore } from '@/modules/01_exam/store'
|
||||
import { useRoute } from 'vue-router'
|
||||
import type {
|
||||
RequestItemsObject,
|
||||
Columns,
|
||||
|
|
@ -199,9 +199,12 @@ import type { ResponseObject } from '@/modules/01_exam/interface/response/Educat
|
|||
import Table from '@/components/Table.vue'
|
||||
import DialogHeader from '@/components/DialogHeader.vue'
|
||||
import DialogFooter from '@/components/DialogFooter.vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
const props = defineProps({
|
||||
educationLevelOptions: {
|
||||
type: Array as PropType<DataOption[]>,
|
||||
required: true
|
||||
},
|
||||
status: {
|
||||
type: String,
|
||||
required: true
|
||||
|
|
@ -210,14 +213,14 @@ const props = defineProps({
|
|||
|
||||
const $q = useQuasar()
|
||||
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
|
||||
const { dateThaiRange, modalDelete, modalConfirm, dateToISO, success } = mixin
|
||||
const { dateThaiRange, modalDelete, modalConfirm, dateToISO, success, messageError } = mixin
|
||||
const store = useExamDataStore()
|
||||
const { examData, changeExamColumns } = store
|
||||
const loader = ref<boolean>(false)
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const id = ref<string>('')
|
||||
const educationLevel = ref<string>()
|
||||
const educationLevelId = ref<string>()
|
||||
const educationLevelOptions = ref<DataOption[]>([])
|
||||
const major = ref<string>()
|
||||
const scores = ref<number | null>()
|
||||
const name = ref<string>()
|
||||
|
|
@ -298,11 +301,10 @@ watch(visibleColumns, async (count: String[], prevCount: String[]) => {
|
|||
|
||||
onMounted(async () => {
|
||||
await fetchData()
|
||||
await fetcheducationLevel()
|
||||
})
|
||||
|
||||
const fetchData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateEducation(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -317,34 +319,18 @@ const fetchData = async () => {
|
|||
})
|
||||
})
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
.catch((e) => {
|
||||
// messageError($q, e)
|
||||
})
|
||||
}
|
||||
|
||||
const fetcheducationLevel = async () => {
|
||||
loader.value = true
|
||||
await http
|
||||
.get(config.API.educationLevel)
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
let option: DataOption[] = []
|
||||
data.map((r: DataOption) => {
|
||||
option.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
})
|
||||
educationLevelOptions.value = option
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* กดดูข้อมูลก่อนหน้า
|
||||
*/
|
||||
const clickPrevious = () => {
|
||||
const clickPrevious = async () => {
|
||||
rowIndex.value -= 1
|
||||
const row = rows.value[rowIndex.value]
|
||||
educationLevel.value = row.educationLevel
|
||||
|
|
@ -354,13 +340,13 @@ const clickPrevious = () => {
|
|||
name.value = row.name
|
||||
duration.value = row.duration
|
||||
id.value = row.id
|
||||
checkRowPage()
|
||||
await checkRowPage()
|
||||
}
|
||||
|
||||
/**
|
||||
* กดดูข้อมูลต่อไป
|
||||
*/
|
||||
const clickNext = () => {
|
||||
const clickNext = async () => {
|
||||
rowIndex.value += 1
|
||||
const row = rows.value[rowIndex.value]
|
||||
educationLevel.value = row.educationLevel
|
||||
|
|
@ -370,7 +356,7 @@ const clickNext = () => {
|
|||
name.value = row.name
|
||||
duration.value = row.duration
|
||||
id.value = row.id
|
||||
checkRowPage()
|
||||
await checkRowPage()
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -392,7 +378,6 @@ const checkRowPage = () => {
|
|||
* กดปุ่มแก้ไขใน dialog
|
||||
*/
|
||||
const clickEdit = () => {
|
||||
// edit.value = true
|
||||
next.value = false
|
||||
previous.value = false
|
||||
}
|
||||
|
|
@ -400,8 +385,8 @@ const clickEdit = () => {
|
|||
/**
|
||||
* กดปุ่มเพิ่มด้านบน table
|
||||
*/
|
||||
const clickAdd = () => {
|
||||
addRow()
|
||||
const clickAdd = async () => {
|
||||
await addRow()
|
||||
}
|
||||
|
||||
const checkDelete = (row: RequestItemsObject) => {
|
||||
|
|
@ -414,26 +399,20 @@ const checkDelete = (row: RequestItemsObject) => {
|
|||
*/
|
||||
const clickDeleteRow = async () => {
|
||||
if (rawItem.value != null) {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.delete(config.API.candidateEducation(rawItem.value.id, ''))
|
||||
.then(() => {
|
||||
success($q, 'ลบข้อมูลสำเร็จ')
|
||||
})
|
||||
.catch(() => {
|
||||
// modalError.value = true
|
||||
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
|
||||
// modalErrorDetail.value = e.response.data.message
|
||||
// statusCode.value = e.response.data.status
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
await fetchData()
|
||||
// edit.value = false
|
||||
})
|
||||
} else {
|
||||
await fetchData()
|
||||
// edit.value = false
|
||||
}
|
||||
}
|
||||
|
||||
|
|
@ -443,15 +422,11 @@ const clickDeleteRow = async () => {
|
|||
const clickSave = async () => {
|
||||
myForm.value.validate().then(async (result: boolean) => {
|
||||
if (result) {
|
||||
// if (store.consend == true) {
|
||||
if (modalEdit.value) {
|
||||
await editData()
|
||||
} else {
|
||||
await saveData()
|
||||
}
|
||||
// } else {
|
||||
// modalConsend.value = true
|
||||
// }
|
||||
}
|
||||
})
|
||||
}
|
||||
|
|
@ -460,7 +435,7 @@ const clickSave = async () => {
|
|||
* บันทึกเพิ่มข้อมูล
|
||||
*/
|
||||
const saveData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.post(config.API.candidateEducation(examId.value, positionId.value), {
|
||||
educationLevelId: educationLevelId.value,
|
||||
|
|
@ -473,15 +448,10 @@ const saveData = async () => {
|
|||
.then(() => {
|
||||
success($q, 'บันทึกข้อมูลสำเร็จ')
|
||||
})
|
||||
.catch(() => {
|
||||
// modalError.value = true
|
||||
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
|
||||
// modalErrorDetail.value = e.response.data.message
|
||||
// statusCode.value = e.response.data.status
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
// edit.value = false
|
||||
modal.value = false
|
||||
await fetchData()
|
||||
})
|
||||
|
|
@ -491,7 +461,7 @@ const saveData = async () => {
|
|||
* บันทึกแก้ไขข้อมูล
|
||||
*/
|
||||
const editData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.put(config.API.candidateEducation(id.value, ''), {
|
||||
educationLevelId: educationLevelId.value,
|
||||
|
|
@ -504,15 +474,10 @@ const editData = async () => {
|
|||
.then(() => {
|
||||
success($q, 'บันทึกข้อมูลสำเร็จ')
|
||||
})
|
||||
.catch(() => {
|
||||
// modalError.value = true
|
||||
// modalErrorTittle.value = 'ไม่สามารถบันทึกข้อมูลร่างได้'
|
||||
// modalErrorDetail.value = e.response.data.message
|
||||
// statusCode.value = e.response.data.status
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
// edit.value = false
|
||||
modal.value = false
|
||||
await fetchData()
|
||||
})
|
||||
|
|
@ -554,12 +519,8 @@ const selectData = (props: DataProps) => {
|
|||
name.value = props.row.name
|
||||
duration.value = props.row.duration
|
||||
id.value = props.row.id
|
||||
// if (edit.value == true) {
|
||||
next.value = false
|
||||
previous.value = false
|
||||
// } else {
|
||||
// checkRowPage()
|
||||
// }
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -576,13 +537,6 @@ const addRow = () => {
|
|||
duration.value = [new Date(), new Date()]
|
||||
}
|
||||
|
||||
/**
|
||||
* ฟังก์ชันปุ่มยกเลิกการแก้ไขข้อมูล
|
||||
*/
|
||||
const clickCancel = async () => {
|
||||
// edit.value = false
|
||||
}
|
||||
|
||||
/**
|
||||
* เช็คว่ามีการแก้ไขข้อมูล
|
||||
*/
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
:editOnly="false"
|
||||
:editData="false"
|
||||
/>
|
||||
<!-- :changeBtn="changeBtn" -->
|
||||
<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="col-xs-12 q-gutter-sm items-center flex q-my-sm">
|
||||
|
|
@ -35,11 +34,11 @@
|
|||
<div class="col-xs-12 col-sm-2 col-md-2" v-if="defaultFamily.same == '1'">
|
||||
<q-select
|
||||
hide-bottom-space
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือก คำนำหน้า'}`]"
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="defaultFamily.prefixIdC"
|
||||
|
|
@ -54,9 +53,9 @@
|
|||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3" v-if="defaultFamily.same == '1'">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
|
|
@ -68,9 +67,9 @@
|
|||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3" v-if="defaultFamily.same == '1'">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
|
|
@ -82,29 +81,27 @@
|
|||
</div>
|
||||
<div class="col-xs-12 col-sm-2 col-md-2" v-if="defaultFamily.same == '1'">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultFamily.occupationC"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก อาชีพ'}`]"
|
||||
:label="`${'อาชีพ'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-2 col-md-2" v-if="defaultFamily.same == '1'">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultFamily.nationalityC"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
|
||||
:label="`${'สัญชาติ'}`"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -113,11 +110,11 @@
|
|||
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||
<q-select
|
||||
hide-bottom-space
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือก คำนำหน้า'}`]"
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="defaultFamily.prefixIdM"
|
||||
|
|
@ -132,9 +129,9 @@
|
|||
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
|
|
@ -146,9 +143,9 @@
|
|||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
|
|
@ -160,29 +157,27 @@
|
|||
</div>
|
||||
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultFamily.occupationM"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก อาชีพ'}`]"
|
||||
:label="`${'อาชีพ'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultFamily.nationalityM"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
|
||||
:label="`${'สัญชาติ'}`"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -191,11 +186,11 @@
|
|||
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||
<q-select
|
||||
hide-bottom-space
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
:rules="[(val) => !!val || `${'กรุณาเลือก คำนำหน้า'}`]"
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
v-model="defaultFamily.prefixIdF"
|
||||
|
|
@ -209,9 +204,9 @@
|
|||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
|
|
@ -223,9 +218,9 @@
|
|||
</div>
|
||||
<div class="col-xs-6 col-sm-3 col-md-3">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
|
|
@ -237,29 +232,27 @@
|
|||
</div>
|
||||
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultFamily.occupationF"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก อาชีพ'}`]"
|
||||
:label="`${'อาชีพ'}`"
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||
<q-input
|
||||
:class="getClass((status == 'register' || status == 'rejectRegister'))"
|
||||
:class="getClass(status == 'register' || status == 'rejectRegister')"
|
||||
hide-bottom-space
|
||||
:outlined="(status == 'register' || status == 'rejectRegister')"
|
||||
:outlined="status == 'register' || status == 'rejectRegister'"
|
||||
dense
|
||||
lazy-rules
|
||||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultFamily.nationalityF"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
|
||||
:label="`${'สัญชาติ'}`"
|
||||
/>
|
||||
</div>
|
||||
|
|
@ -271,10 +264,13 @@ import { onMounted, ref, watch } from 'vue'
|
|||
import type { PropType } from 'vue'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useQuasar } from 'quasar'
|
||||
import type { Family, DataOption } from '@/modules/01_exam/interface/index/Main'
|
||||
import { defaultFamily, changeData } from '@/modules/01_exam/interface/index/Main'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
const props = defineProps({
|
||||
prefixOptions: {
|
||||
|
|
@ -290,15 +286,18 @@ const props = defineProps({
|
|||
required: true
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
const $q = useQuasar()
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const mixin = useCounterMixin()
|
||||
const { messageError } = mixin
|
||||
const edit = ref<boolean>(true)
|
||||
const myform = ref<any>({})
|
||||
const route = useRoute()
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
const loader = ref<boolean>(false)
|
||||
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
watch(myform, async (count: any, prevCount: any) => {
|
||||
emit('update:form', count)
|
||||
|
|
@ -313,43 +312,38 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateFamily(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
defaultFamily.value.prefixIdC = data.marryPrefixId
|
||||
defaultFamily.value.firstnameC = data.marryFirstName
|
||||
defaultFamily.value.lastnameC = data.marryLastName
|
||||
defaultFamily.value.occupationC = data.marryOccupation
|
||||
defaultFamily.value.nationalityC = data.marryNationality
|
||||
defaultFamily.value.prefixIdM = data.fatherPrefixId
|
||||
defaultFamily.value.firstnameM = data.fatherFirstName
|
||||
defaultFamily.value.lastnameM = data.fatherLastName
|
||||
defaultFamily.value.occupationM = data.fatherOccupation
|
||||
defaultFamily.value.nationalityM = data.fatherNationality
|
||||
defaultFamily.value.prefixIdF = data.motherPrefixId
|
||||
defaultFamily.value.firstnameF = data.motherFirstName
|
||||
defaultFamily.value.lastnameF = data.motherLastName
|
||||
defaultFamily.value.occupationF = data.motherOccupation
|
||||
defaultFamily.value.nationalityF = data.motherNationality
|
||||
defaultFamily.value.same = data.marry == true ? '1' : data.marry == false ? '0' : null
|
||||
if (data != null) {
|
||||
defaultFamily.value.prefixIdC = data.marryPrefixId
|
||||
defaultFamily.value.firstnameC = data.marryFirstName
|
||||
defaultFamily.value.lastnameC = data.marryLastName
|
||||
defaultFamily.value.occupationC = data.marryOccupation
|
||||
defaultFamily.value.nationalityC = data.marryNationality
|
||||
defaultFamily.value.prefixIdM = data.fatherPrefixId
|
||||
defaultFamily.value.firstnameM = data.fatherFirstName
|
||||
defaultFamily.value.lastnameM = data.fatherLastName
|
||||
defaultFamily.value.occupationM = data.fatherOccupation
|
||||
defaultFamily.value.nationalityM = data.fatherNationality
|
||||
defaultFamily.value.prefixIdF = data.motherPrefixId
|
||||
defaultFamily.value.firstnameF = data.motherFirstName
|
||||
defaultFamily.value.lastnameF = data.motherLastName
|
||||
defaultFamily.value.occupationF = data.motherOccupation
|
||||
defaultFamily.value.nationalityF = data.motherNationality
|
||||
defaultFamily.value.same = data.marry == true ? '1' : data.marry == false ? '0' : null
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const selectRadio = (e: boolean) => {
|
||||
if (!e) {
|
||||
defaultFamily.value.prefixIdC = ''
|
||||
defaultFamily.value.firstnameC = ''
|
||||
defaultFamily.value.lastnameC = ''
|
||||
defaultFamily.value.occupationC = ''
|
||||
}
|
||||
}
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
return {
|
||||
'full-width inputgreen cursor-pointer': val,
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
:editOnly="false"
|
||||
:editData="false"
|
||||
/>
|
||||
<!-- :changeBtn="changeBtn" -->
|
||||
<q-form ref="myform" class="col-12 row q-col-gutter-x-sm justify-center q-col-gutter-sm">
|
||||
<div class="row col-xs-12 col-sm-12 col-md-10 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
|
||||
<div class="col-xs-12 col-sm-2 col-md-2">
|
||||
|
|
@ -347,15 +346,16 @@
|
|||
<script setup lang="ts">
|
||||
import { ref, onMounted, watch } from 'vue'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import type { PropType } from 'vue'
|
||||
import type { Information, DataOption } from '@/modules/01_exam/interface/index/Main'
|
||||
import { defaultInformation, changeData } from '@/modules/01_exam/interface/index/Main'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import keycloak from '@/plugins/keycloak'
|
||||
import { useQuasar } from 'quasar'
|
||||
import type { Information, DataOption } from '@/modules/01_exam/interface/index/Main'
|
||||
import { defaultInformation, changeData } from '@/modules/01_exam/interface/index/Main'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
|
||||
const props = defineProps({
|
||||
prefixOptions: {
|
||||
|
|
@ -379,24 +379,21 @@ const props = defineProps({
|
|||
required: true
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
const $q = useQuasar()
|
||||
const mixin = useCounterMixin()
|
||||
const { date2Thai, calAge, modalError, success } = mixin
|
||||
const { date2Thai, calAge, success, messageError } = mixin
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const districtOptions = ref<DataOption[]>([])
|
||||
const route = useRoute()
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
const edit = ref<boolean>(true)
|
||||
const myform = ref<any>({})
|
||||
const disabledPic = ref<boolean>(false)
|
||||
const fileData = ref<File | null>()
|
||||
const loader = ref<boolean>(false)
|
||||
const img = ref<string>('')
|
||||
const fileProfile = ref<File[]>([])
|
||||
const fileDataUpload = ref<File>()
|
||||
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
watch(myform, async (count: any, prevCount: any) => {
|
||||
emit('update:form', count)
|
||||
|
|
@ -414,7 +411,7 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateInformation(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -445,21 +442,23 @@ const fetchData = async () => {
|
|||
keycloak.tokenParsed == null ? '' : keycloak.tokenParsed.family_name
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const fetchImgData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateProfile(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
img.value = data
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
.catch((e) => {
|
||||
// messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -468,16 +467,16 @@ const uploadImage = async (e: any) => {
|
|||
if (input.length > 0) {
|
||||
const formData = new FormData()
|
||||
formData.append('', input[0])
|
||||
// loaderPage(true);
|
||||
loaderPage(true)
|
||||
await http
|
||||
.put(config.API.candidateProfile(examId.value, positionId.value), formData)
|
||||
.then((res) => {
|
||||
success($q, 'อัพโหลดรูปสำเร็จ')
|
||||
})
|
||||
.catch((e) => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(async () => {
|
||||
loader.value = false
|
||||
// await fetchData()
|
||||
await fetchImgData()
|
||||
fileProfile.value = []
|
||||
})
|
||||
|
|
@ -485,14 +484,14 @@ const uploadImage = async (e: any) => {
|
|||
}
|
||||
}
|
||||
|
||||
const selectProvince = (val: string) => {
|
||||
const selectProvince = async (val: string) => {
|
||||
defaultInformation.value.districtId = ''
|
||||
myform.value.resetValidation()
|
||||
fetchDistrict(val)
|
||||
await fetchDistrict(val)
|
||||
}
|
||||
|
||||
const fetchDistrict = async (id: string) => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.listDistrict(id))
|
||||
.then((res) => {
|
||||
|
|
@ -503,14 +502,12 @@ const fetchDistrict = async (id: string) => {
|
|||
})
|
||||
districtOptions.value = option
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const savePic = () => {
|
||||
disabledPic.value = false
|
||||
}
|
||||
|
||||
const getClass = (val: boolean) => {
|
||||
|
|
|
|||
|
|
@ -8,7 +8,6 @@
|
|||
:editOnly="false"
|
||||
:editData="false"
|
||||
/>
|
||||
<!-- :changeBtn="changeBtn" -->
|
||||
<q-form ref="myform">
|
||||
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-xs">
|
||||
<div class="col-12 row q-pb-lg">
|
||||
|
|
@ -22,7 +21,7 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.official"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
:disable="
|
||||
defaultOccupation.status !== 'official' ||
|
||||
!(status == 'register' || status == 'rejectRegister')
|
||||
|
|
@ -52,7 +51,7 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.personnel"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
:disable="
|
||||
defaultOccupation.status !== 'personnel' ||
|
||||
!(status == 'register' || status == 'rejectRegister')
|
||||
|
|
@ -82,7 +81,7 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.officialsOther"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
:disable="
|
||||
defaultOccupation.status !== 'officialsOther' ||
|
||||
!(status == 'register' || status == 'rejectRegister')
|
||||
|
|
@ -112,7 +111,7 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.employee"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
:disable="
|
||||
defaultOccupation.status !== 'employee' ||
|
||||
!(status == 'register' || status == 'rejectRegister')
|
||||
|
|
@ -153,7 +152,7 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.other"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอกตำแหน่ง'}`]"
|
||||
:disable="
|
||||
defaultOccupation.status !== 'other' ||
|
||||
!(status == 'register' || status == 'rejectRegister')
|
||||
|
|
@ -185,8 +184,8 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.company"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก สำนัก/บริษัท'}`]"
|
||||
:label="`${'สำนัก/บริษัท'}`"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||
|
|
@ -200,8 +199,8 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.department"
|
||||
:rules="[(val) => !!val || `${'กรุณากรอก กอง/ฝ่าย'}`]"
|
||||
:label="`${'กอง/ฝ่าย'}`"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||
|
|
@ -216,12 +215,12 @@
|
|||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.email"
|
||||
:rules="[
|
||||
(val) => !!val || 'กรุณากรอก E-mail address',
|
||||
(val) =>
|
||||
/^([a-zA-Z0-9._%-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,})$/.test(val) ||
|
||||
'E-mail address ไม่ถูกต้อง'
|
||||
]"
|
||||
:label="`${'E-mail address'}`"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
<div class="col-xs-12 col-sm-3 col-md-3">
|
||||
|
|
@ -238,11 +237,9 @@
|
|||
:readonly="!(status == 'register' || status == 'rejectRegister')"
|
||||
:borderless="!(status == 'register' || status == 'rejectRegister')"
|
||||
v-model="defaultOccupation.tel"
|
||||
:rules="[
|
||||
(val) => !!val || `${'กรุณากรอก โทรศัพท์'}`,
|
||||
(val) => /^[0-9]*$/.test(val) || 'กรุณากรอก โทรศัพท์ให้ถูกต้อง'
|
||||
]"
|
||||
:rules="[(val) => /^[0-9]*$/.test(val) || 'กรุณากรอก โทรศัพท์ให้ถูกต้อง']"
|
||||
:label="`${'โทรศัพท์'}`"
|
||||
hide-bottom-space
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -252,10 +249,13 @@
|
|||
import { ref, onMounted, watch } from 'vue'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useQuasar } from 'quasar'
|
||||
import type { Occupation } from '@/modules/01_exam/interface/index/Main'
|
||||
import { defaultOccupation, changeData } from '@/modules/01_exam/interface/index/Main'
|
||||
import HeaderTop from '@/components/top.vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
|
||||
const props = defineProps({
|
||||
status: {
|
||||
|
|
@ -267,16 +267,19 @@ const props = defineProps({
|
|||
required: true
|
||||
}
|
||||
})
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
const $q = useQuasar()
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const mixin = useCounterMixin()
|
||||
const { messageError } = mixin
|
||||
const edit = ref<boolean>(true)
|
||||
const myform = ref<any>({})
|
||||
const loader = ref<boolean>(false)
|
||||
const route = useRoute()
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
|
||||
const emit = defineEmits(['update:form'])
|
||||
|
||||
watch(myform, async (count: any, prevCount: any) => {
|
||||
emit('update:form', count)
|
||||
})
|
||||
|
|
@ -290,30 +293,34 @@ onMounted(async () => {
|
|||
})
|
||||
|
||||
const fetchData = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateOccupation(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
defaultOccupation.value.status = data.occupationType
|
||||
defaultOccupation.value.company = data.occupationCompany
|
||||
defaultOccupation.value.department = data.occupationDepartment
|
||||
defaultOccupation.value.email = data.occupationEmail
|
||||
defaultOccupation.value.tel = data.occupationTelephone
|
||||
defaultOccupation.value.official =
|
||||
data.occupationType == 'official' ? data.occupationPosition : null
|
||||
defaultOccupation.value.personnel =
|
||||
data.occupationType == 'personnel' ? data.occupationPosition : null
|
||||
defaultOccupation.value.officialsOther =
|
||||
data.occupationType == 'officialsOther' ? data.occupationPosition : null
|
||||
defaultOccupation.value.employee =
|
||||
data.occupationType == 'employee' ? data.occupationPosition : null
|
||||
defaultOccupation.value.other =
|
||||
data.occupationType == 'other' ? data.occupationPosition : null
|
||||
if (data != null) {
|
||||
defaultOccupation.value.status = data.occupationType
|
||||
defaultOccupation.value.company = data.occupationCompany
|
||||
defaultOccupation.value.department = data.occupationDepartment
|
||||
defaultOccupation.value.email = data.occupationEmail
|
||||
defaultOccupation.value.tel = data.occupationTelephone
|
||||
defaultOccupation.value.official =
|
||||
data.occupationType == 'official' ? data.occupationPosition : null
|
||||
defaultOccupation.value.personnel =
|
||||
data.occupationType == 'personnel' ? data.occupationPosition : null
|
||||
defaultOccupation.value.officialsOther =
|
||||
data.occupationType == 'officialsOther' ? data.occupationPosition : null
|
||||
defaultOccupation.value.employee =
|
||||
data.occupationType == 'employee' ? data.occupationPosition : null
|
||||
defaultOccupation.value.other =
|
||||
data.occupationType == 'other' ? data.occupationPosition : null
|
||||
}
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.catch(() => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -27,7 +27,7 @@
|
|||
|
||||
<q-separator class="q-my-lg bg-gray" size="5px" />
|
||||
<div class="q-px-sm">
|
||||
<Education :status="status" />
|
||||
<Education :educationLevelOptions="educationLevelOptions" :status="status" />
|
||||
</div>
|
||||
|
||||
<q-separator class="q-my-lg bg-gray" size="5px" />
|
||||
|
|
@ -44,6 +44,9 @@
|
|||
import { ref, onMounted, watch } from 'vue'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useQuasar } from 'quasar'
|
||||
import type { DataOption } from '@/modules/01_exam/interface/index/Main'
|
||||
import Information from '@/modules/01_exam/components/Form/Information.vue'
|
||||
import Address from '@/modules/01_exam/components/Form/Address.vue'
|
||||
|
|
@ -75,16 +78,6 @@ const props = defineProps({
|
|||
required: true
|
||||
}
|
||||
})
|
||||
|
||||
const loader = ref<boolean>(true)
|
||||
const prefixOptions = ref<DataOption[]>([])
|
||||
const relationshipOptions = ref<DataOption[]>([])
|
||||
const provinceOptions = ref<DataOption[]>([])
|
||||
const formInformation = ref<any>({})
|
||||
const formAddress = ref<any>({})
|
||||
const formFamily = ref<any>({})
|
||||
const formOccupation = ref<any>({})
|
||||
|
||||
const emit = defineEmits([
|
||||
'update:formInformation',
|
||||
'update:formAddress',
|
||||
|
|
@ -92,6 +85,20 @@ const emit = defineEmits([
|
|||
'update:formOccupation'
|
||||
])
|
||||
|
||||
const $q = useQuasar()
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const mixin = useCounterMixin()
|
||||
const { messageError } = mixin
|
||||
const prefixOptions = ref<DataOption[]>([])
|
||||
const relationshipOptions = ref<DataOption[]>([])
|
||||
const provinceOptions = ref<DataOption[]>([])
|
||||
const educationLevelOptions = ref<DataOption[]>([])
|
||||
const formInformation = ref<any>({})
|
||||
const formAddress = ref<any>({})
|
||||
const formFamily = ref<any>({})
|
||||
const formOccupation = ref<any>({})
|
||||
|
||||
watch(formInformation, async (count: Object, prevCount: Object) => {
|
||||
emit('update:formInformation', count)
|
||||
})
|
||||
|
|
@ -108,63 +115,45 @@ watch(formOccupation, async (count: Object, prevCount: Object) => {
|
|||
emit('update:formOccupation', count)
|
||||
})
|
||||
|
||||
onMounted(() => {
|
||||
fetchPrefix()
|
||||
fetchRelationship()
|
||||
fetchProvince()
|
||||
onMounted(async () => {
|
||||
await fetchPerson()
|
||||
})
|
||||
|
||||
const fetchPrefix = async () => {
|
||||
loader.value = true
|
||||
const fetchPerson = async () => {
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.prefix)
|
||||
.get(config.API.person)
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
let option: DataOption[] = []
|
||||
data.map((r: any) => {
|
||||
option.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
let optionPrefix: DataOption[] = []
|
||||
data.prefixs.map((r: any) => {
|
||||
optionPrefix.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
})
|
||||
prefixOptions.value = option
|
||||
})
|
||||
.catch((e) => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
})
|
||||
}
|
||||
prefixOptions.value = optionPrefix
|
||||
|
||||
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: any) => {
|
||||
option.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
let optionRelationship: DataOption[] = []
|
||||
data.relationships.map((r: any) => {
|
||||
optionRelationship.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
})
|
||||
relationshipOptions.value = option
|
||||
})
|
||||
.catch((e) => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
})
|
||||
}
|
||||
relationshipOptions.value = optionRelationship
|
||||
|
||||
const fetchProvince = async () => {
|
||||
loader.value = true
|
||||
await http
|
||||
.get(config.API.province)
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
let option: DataOption[] = []
|
||||
data.map((r: any) => {
|
||||
option.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
let optionProvince: DataOption[] = []
|
||||
data.provinces.map((r: any) => {
|
||||
optionProvince.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
})
|
||||
provinceOptions.value = option
|
||||
provinceOptions.value = optionProvince
|
||||
|
||||
let optionEducationLevel: DataOption[] = []
|
||||
data.educationLevels.map((r: any) => {
|
||||
optionEducationLevel.push({ id: r.id.toString(), name: r.name.toString() })
|
||||
})
|
||||
educationLevelOptions.value = optionEducationLevel
|
||||
})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.catch((e) => {})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,16 +1,6 @@
|
|||
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/:id/:positionId',
|
||||
name: 'examDetail',
|
||||
|
|
|
|||
|
|
@ -61,7 +61,7 @@
|
|||
</q-stepper>
|
||||
<q-dialog :model-value="modalConsend" persistent>
|
||||
<q-card :style="$q.screen.gt.xs ? 'min-width: 55vw' : 'min-width: 80vw'">
|
||||
<Conference :ok="consendOk" :close="consenClose" />
|
||||
<Consendform :ok="consendOk" />
|
||||
</q-card>
|
||||
</q-dialog>
|
||||
</template>
|
||||
|
|
@ -70,6 +70,7 @@
|
|||
import { onMounted, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useQuasar } from 'quasar'
|
||||
import { useExamDataStore } from '@/modules/01_exam/store'
|
||||
import http from '@/plugins/http'
|
||||
|
|
@ -77,12 +78,14 @@ import config from '@/app.config'
|
|||
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 Conference from '@/modules/01_exam/components/Conference.vue'
|
||||
import Consendform from '@/modules/01_exam/components/Consendform.vue'
|
||||
|
||||
const $q = useQuasar()
|
||||
const store = useExamDataStore()
|
||||
const storeExam = useExamDataStore()
|
||||
const mixin = useCounterMixin()
|
||||
const { modalError } = mixin
|
||||
const { modalError, messageError } = mixin
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const step = ref<number>(1)
|
||||
const stepRaw = ref<number>(1)
|
||||
const tittle = ref<string>('')
|
||||
|
|
@ -90,7 +93,6 @@ const position = ref<string>('')
|
|||
const route = useRoute()
|
||||
const examId = ref<string>(route.params.id.toString())
|
||||
const positionId = ref<string>(route.params.positionId.toString())
|
||||
const loader = ref<boolean>(false)
|
||||
const status = ref<string>('register')
|
||||
const modalConsend = ref<boolean>(false)
|
||||
const stepPayment = ref<boolean>(true)
|
||||
|
|
@ -99,19 +101,17 @@ const round = ref<number | null>(null)
|
|||
const yearly = ref<number | null>(null)
|
||||
|
||||
onMounted(async () => {
|
||||
// stepRaw.value = 3
|
||||
// step.value = 3
|
||||
await fetchPeriodExam()
|
||||
await candidateCheck()
|
||||
})
|
||||
|
||||
const candidateCheck = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateCheckCreate(examId.value, positionId.value))
|
||||
.then(async (res) => {
|
||||
const data = res.data.result
|
||||
store.consend = data.consend
|
||||
storeExam.consend = data.consend
|
||||
const positionExam = data.positionExam
|
||||
stepPayment.value = data.payment
|
||||
if (
|
||||
|
|
@ -128,7 +128,7 @@ const candidateCheck = async () => {
|
|||
closeWindow
|
||||
)
|
||||
} else {
|
||||
if (store.consend == true) {
|
||||
if (storeExam.consend == true) {
|
||||
await fetchStep()
|
||||
} else {
|
||||
modalConsend.value = true
|
||||
|
|
@ -137,20 +137,20 @@ const candidateCheck = async () => {
|
|||
}
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
const closeWindow = async () => {
|
||||
// window.close()
|
||||
// window.closed = true
|
||||
// console.log(window)
|
||||
}
|
||||
|
||||
const fetchStep = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateStatus(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -194,15 +194,17 @@ const fetchStep = async () => {
|
|||
step.value = 4
|
||||
}
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
store.changeStatus(status.value)
|
||||
loaderPage(false)
|
||||
storeExam.changeStatus(status.value)
|
||||
})
|
||||
}
|
||||
|
||||
const fetchPeriodExam = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.periodExamPosition(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
|
|
@ -212,9 +214,11 @@ const fetchPeriodExam = async () => {
|
|||
yearly.value = data.year
|
||||
position.value = data.posiiton == null ? '' : 'ตำแหน่ง: ' + data.posiiton.positionName
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -224,8 +228,6 @@ const consenClose = () => {
|
|||
|
||||
const consendOk = () => {
|
||||
modalConsend.value = false
|
||||
// store.consend = true
|
||||
// saveData()
|
||||
}
|
||||
</script>
|
||||
<style>
|
||||
|
|
|
|||
|
|
@ -1,235 +0,0 @@
|
|||
<!-- page:main page รายการสอบทั้งหมด -->
|
||||
<template>
|
||||
<q-toolbar class="q-py-sm q-px-md bg-grey-2">
|
||||
<q-toolbar-title class="toptitle text-dark col-12 row items-center"
|
||||
>รายการสอบทั้งหมด</q-toolbar-title
|
||||
>
|
||||
</q-toolbar>
|
||||
|
||||
<div class="q-pa-md q-gutter-md">
|
||||
<CardExam v-for="row in ExamData" :key="row.id" :items="row" @click="next(row.id)" />
|
||||
<!-- <data-table
|
||||
style="height: 80vh"
|
||||
:rows="rows"
|
||||
:columns="columns"
|
||||
:filter="filter"
|
||||
:visible-columns="visibleColumns"
|
||||
v-model:inputfilter="filter"
|
||||
v-model:inputvisible="visibleColumns"
|
||||
:pagination="initialPagination"
|
||||
:nornmalData="true"
|
||||
:paging="true"
|
||||
>
|
||||
<template #columns="props">
|
||||
<q-tr :props="props" @click="next(props.row.id)" class="cursor-pointer">
|
||||
<q-td v-for="col in props.cols" :key="col.name" :props="props">
|
||||
<div v-if="col.name == 'no'" class="table_ellipsis">
|
||||
{{ props.rowIndex + 1 }}
|
||||
</div>
|
||||
<div v-else-if="col.name == 'fullname'">
|
||||
<div class="row col-12 items-center">
|
||||
<img
|
||||
:src="props.row.avatar"
|
||||
class="q-mr-sm col-4"
|
||||
style="width: 28px; height: 28px; border-radius: 50%"
|
||||
/>
|
||||
<div class="col-4">
|
||||
<div class="text-weight-medium">
|
||||
{{ props.row.fullname }}
|
||||
</div>
|
||||
<div class="text-weight-light">
|
||||
{{ props.row.citizenId }}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-else class="table_ellipsis">
|
||||
{{ col.value }}
|
||||
</div>
|
||||
</q-td>
|
||||
</q-tr>
|
||||
</template>
|
||||
</data-table> -->
|
||||
</div>
|
||||
</template>
|
||||
<script setup lang="ts">
|
||||
import { ref, watch } from 'vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
import { useExamDataStore } from '@/modules/01_exam/store'
|
||||
import type { RequestItemsObject, Columns } from '@/modules/01_exam/interface/request/Main'
|
||||
import type { ResponseObject } from '@/modules/01_exam/interface/response/Main'
|
||||
import type { Pagination, ExamCard } from '@/modules/01_exam/interface/index/Main'
|
||||
import { defaultCard } from '@/modules/01_exam/interface/index/Main'
|
||||
import CardExam from '../components/ExamCrad.vue'
|
||||
|
||||
const router = useRouter()
|
||||
const store = useExamDataStore()
|
||||
const { examData, changeExamColumns } = store
|
||||
const filter = ref<string>('') //search data table
|
||||
const initialPagination = ref<Pagination>({
|
||||
rowsPerPage: 0
|
||||
})
|
||||
|
||||
const ExamData = ref<ExamCard[]>(defaultCard)
|
||||
const visibleColumns = ref<String[]>([])
|
||||
examData.main.columns.length == 0
|
||||
? (visibleColumns.value = [
|
||||
'no',
|
||||
'fullname',
|
||||
'position',
|
||||
'line',
|
||||
'linePosition',
|
||||
'level',
|
||||
'positionFormalManage',
|
||||
'positionManage',
|
||||
'numberPosition',
|
||||
'government'
|
||||
])
|
||||
: (visibleColumns.value = examData.main.columns)
|
||||
const columns = ref<Columns>([
|
||||
{
|
||||
name: 'no',
|
||||
align: 'left',
|
||||
label: 'ลำดับ',
|
||||
sortable: true,
|
||||
field: 'no',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'fullname',
|
||||
align: 'left',
|
||||
label: 'ชื่อ-สกุล',
|
||||
sortable: true,
|
||||
field: 'fullname',
|
||||
headerStyle: 'font-size: 14px; min-width: 200px',
|
||||
style: 'font-size: 14px; '
|
||||
},
|
||||
{
|
||||
name: 'position',
|
||||
align: 'left',
|
||||
label: 'ตำแหน่ง',
|
||||
sortable: true,
|
||||
field: 'position',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'line',
|
||||
align: 'left',
|
||||
label: 'สายงาน',
|
||||
sortable: true,
|
||||
field: 'line',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'linePosition',
|
||||
align: 'left',
|
||||
label: 'ตำแหน่งในสายงาน',
|
||||
sortable: true,
|
||||
field: 'linePosition',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'level',
|
||||
align: 'left',
|
||||
label: 'ระดับ',
|
||||
sortable: true,
|
||||
field: 'level',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'positionFormalManage',
|
||||
align: 'left',
|
||||
label: 'ตำแหน่งทางการบริหาร',
|
||||
sortable: true,
|
||||
field: 'positionFormalManage',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'positionManage',
|
||||
align: 'left',
|
||||
label: 'ตำแหน่งการบริหาร',
|
||||
sortable: true,
|
||||
field: 'positionManage',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'numberPosition',
|
||||
align: 'left',
|
||||
label: 'เลขที่ตำแหน่ง',
|
||||
sortable: true,
|
||||
field: 'numberPosition',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
},
|
||||
{
|
||||
name: 'government',
|
||||
align: 'left',
|
||||
label: 'หน่วยงาน/ส่วนราชการ',
|
||||
sortable: true,
|
||||
field: 'government',
|
||||
headerStyle: 'font-size: 14px',
|
||||
style: 'font-size: 14px'
|
||||
}
|
||||
])
|
||||
const rows = ref<RequestItemsObject[]>([
|
||||
{
|
||||
id: 1,
|
||||
fullname: 'นางสาวณัฐกา ชมสิน',
|
||||
avatar: 'https://cdn.quasar.dev/img/boy-avatar.png',
|
||||
citizenId: '4016500103241',
|
||||
position: 'นักจัดการงานทั่วไป',
|
||||
line: 'จัดการทั่วไป',
|
||||
linePosition: 'ทั่วไป ',
|
||||
level: 'ต้น',
|
||||
positionFormalManage: 'นักจัดการทั่วไป',
|
||||
positionManage: 'นักจัดการทั่วไป',
|
||||
numberPosition: 'กทข.1',
|
||||
government: 'กองบริหารทั่วไป'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
fullname: 'นางสาวรัชภรณ์ ภักดี',
|
||||
avatar: 'https://cdn.quasar.dev/img/boy-avatar.png',
|
||||
citizenId: '4016500092355',
|
||||
position: 'นักจัดการงานทั่วไป',
|
||||
line: 'จัดการทั่วไป',
|
||||
linePosition: 'ทั่วไป ',
|
||||
level: 'ต้น',
|
||||
positionFormalManage: 'นักจัดการทั่วไป',
|
||||
positionManage: 'นักจัดการทั่วไป',
|
||||
numberPosition: 'กทข.1',
|
||||
government: 'กองบริหารทั่วไป'
|
||||
},
|
||||
{
|
||||
id: 3,
|
||||
fullname: 'นางสาวภาพรรณ ลออ',
|
||||
avatar: 'https://cdn.quasar.dev/img/boy-avatar.png',
|
||||
citizenId: '4016500086436',
|
||||
position: 'นักจัดการงานทั่วไป',
|
||||
line: 'จัดการทั่วไป',
|
||||
linePosition: 'ทั่วไป ',
|
||||
level: 'ต้น',
|
||||
positionFormalManage: 'นักจัดการทั่วไป',
|
||||
positionManage: 'นักจัดการทั่วไป',
|
||||
numberPosition: 'กทข.1',
|
||||
government: 'กองบริหารทั่วไป'
|
||||
}
|
||||
])
|
||||
|
||||
watch(visibleColumns, async (count: String[], prevCount: String[]) => {
|
||||
await changeExamColumns('main', count)
|
||||
})
|
||||
|
||||
const next = (id: string) => {
|
||||
router.push(`/exam/${id}`)
|
||||
}
|
||||
</script>
|
||||
|
||||
<style></style>
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
interface Pagination {
|
||||
rowsPerPage: number
|
||||
}
|
||||
|
||||
interface DataOption {
|
||||
id: string
|
||||
name: string
|
||||
}
|
||||
|
||||
export type { Pagination, DataOption }
|
||||
|
|
@ -1,28 +0,0 @@
|
|||
interface DataProps {
|
||||
row: RequestItemsObject
|
||||
rowIndex: number
|
||||
}
|
||||
|
||||
//ข้อมูล
|
||||
interface RequestItemsObject {
|
||||
id: string
|
||||
name: string
|
||||
certiNumber: string
|
||||
start: Date
|
||||
end: Date
|
||||
}
|
||||
|
||||
//columns
|
||||
interface Columns {
|
||||
[index: number]: {
|
||||
name: String
|
||||
align: String
|
||||
label: String
|
||||
sortable: Boolean
|
||||
field: String
|
||||
headerStyle: String
|
||||
style: String
|
||||
}
|
||||
}
|
||||
|
||||
export type { RequestItemsObject, Columns, DataProps }
|
||||
|
|
@ -1,11 +0,0 @@
|
|||
//ข้อมูล
|
||||
interface ResponseObject {
|
||||
id: string
|
||||
date: Date
|
||||
status: string
|
||||
level: string
|
||||
refNo: string
|
||||
refDate: Date
|
||||
}
|
||||
|
||||
export type { ResponseObject }
|
||||
|
|
@ -1,13 +0,0 @@
|
|||
const Meta = () => import('@/modules/02_meta/views/Meta02View.vue')
|
||||
|
||||
export default [
|
||||
{
|
||||
path: '/meta02',
|
||||
name: 'meta02',
|
||||
component: Meta,
|
||||
meta: {
|
||||
Auth: true
|
||||
// Key: [7]
|
||||
}
|
||||
}
|
||||
]
|
||||
|
|
@ -1,10 +0,0 @@
|
|||
import { ref, computed } from 'vue'
|
||||
import { defineStore } from 'pinia'
|
||||
|
||||
export const useMetaStore = defineStore('meta', () => {
|
||||
const meta = ref<string>('')
|
||||
|
||||
return {
|
||||
meta
|
||||
}
|
||||
})
|
||||
|
|
@ -1,15 +0,0 @@
|
|||
<template>
|
||||
<div class="about">
|
||||
<h1>This is an about META02</h1>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
@media (min-width: 1024px) {
|
||||
.about {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,25 +1,21 @@
|
|||
import axios from "axios"
|
||||
import config from "process"
|
||||
// import { dotnetPath } from "../path/axiosPath";
|
||||
// import { getToken } from "@baloise/vue-keycloak";
|
||||
import keycloak from "../plugins/keycloak"
|
||||
import axios from 'axios'
|
||||
import keycloak from '../plugins/keycloak'
|
||||
|
||||
const axiosInstance = axios.create({
|
||||
withCredentials: false,
|
||||
withCredentials: false
|
||||
})
|
||||
|
||||
// axiosInstance.defaults.baseURL = dotnetPath;
|
||||
axiosInstance.interceptors.request.use(
|
||||
async (config) => {
|
||||
const token = await keycloak.token
|
||||
config.headers = {
|
||||
Authorization: `Bearer ${token}`,
|
||||
}
|
||||
return config
|
||||
},
|
||||
(error) => {
|
||||
Promise.reject(error)
|
||||
async (config) => {
|
||||
const token = await keycloak.token
|
||||
config.headers = {
|
||||
Authorization: `Bearer ${token}`
|
||||
}
|
||||
return config
|
||||
},
|
||||
(error) => {
|
||||
Promise.reject(error)
|
||||
}
|
||||
)
|
||||
|
||||
export default axiosInstance
|
||||
|
|
|
|||
|
|
@ -1,45 +1,42 @@
|
|||
import Axios, { type AxiosRequestConfig, type AxiosResponse } from "axios";
|
||||
import keycloak from "./keycloak";
|
||||
import Axios, { type AxiosRequestConfig, type AxiosResponse } from 'axios'
|
||||
import keycloak from './keycloak'
|
||||
|
||||
const http = Axios.create({
|
||||
timeout: 1000000000, // เพิ่มค่า timeout
|
||||
headers: {
|
||||
"X-Requested-With": "XMLHttpRequest",
|
||||
},
|
||||
});
|
||||
'X-Requested-With': 'XMLHttpRequest'
|
||||
}
|
||||
})
|
||||
|
||||
http.interceptors.request.use(
|
||||
async function (config: AxiosRequestConfig<any>) {
|
||||
await keycloak.updateToken(1);
|
||||
config.headers = config.headers ?? {};
|
||||
const token = keycloak.token;
|
||||
// const token = localStorage.getItem("access_token")
|
||||
// const token =
|
||||
// "eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICIxU2VKV2dVRFVlNXZwNS13Q1ZHaG9lT2l4bDJTTkdKemthLU5ZN211NXZJIn0.eyJleHAiOjE2NzI0MTI1NDksImlhdCI6MTY3MjM3NjU0OSwiYXV0aF90aW1lIjoxNjcyMzc2NTQ5LCJqdGkiOiI1MTVhY2IwNC1jODQ3LTQzM2YtYjUxOC03ODUzMzJhY2ZjNWYiLCJpc3MiOiJodHRwczovL2tleWNsb2FrLmZyYXBwZXQuc3lub2xvZ3kubWUvYXV0aC9yZWFsbXMvYm1hLWVociIsImF1ZCI6ImFjY291bnQiLCJzdWIiOiJlZmM5YjRlMC1mZGU2LTQ1NDQtYmU1OS1lMTA0MjEwMjUzZjAiLCJ0eXAiOiJCZWFyZXIiLCJhenAiOiJibWEtZWhyIiwibm9uY2UiOiI3NjMyMGI3ZS0xZTMxLTQ5ODYtYWIzOC1iOTUyYjFlODY3OGYiLCJzZXNzaW9uX3N0YXRlIjoiMDZlNTBkZjktNzAyNi00ZGIwLTkxMjgtMWY3Y2FiYTRkNDEyIiwiYWNyIjoiMSIsImFsbG93ZWQtb3JpZ2lucyI6WyJodHRwczovL2xvY2FsaG9zdDo3MDA2Il0sInJlYWxtX2FjY2VzcyI6eyJyb2xlcyI6WyJkZWZhdWx0LXJvbGVzLWJtYS1laHIiLCJvZmZsaW5lX2FjY2VzcyIsImFkbWluIiwidW1hX2F1dGhvcml6YXRpb24iXX0sInJlc291cmNlX2FjY2VzcyI6eyJhY2NvdW50Ijp7InJvbGVzIjpbIm1hbmFnZS1hY2NvdW50IiwibWFuYWdlLWFjY291bnQtbGlua3MiLCJ2aWV3LXByb2ZpbGUiXX19LCJzY29wZSI6Im9wZW5pZCBlbWFpbCBwcm9maWxlIiwic2lkIjoiMDZlNTBkZjktNzAyNi00ZGIwLTkxMjgtMWY3Y2FiYTRkNDEyIiwiZW1haWxfdmVyaWZpZWQiOnRydWUsInJvbGUiOlsiZGVmYXVsdC1yb2xlcy1ibWEtZWhyIiwib2ZmbGluZV9hY2Nlc3MiLCJhZG1pbiIsInVtYV9hdXRob3JpemF0aW9uIl0sIm5hbWUiOiJTeXN0ZW0gQWRtaW5pc3RyYXRvciIsInByZWZlcnJlZF91c2VybmFtZSI6ImFkbWluIiwiZ2l2ZW5fbmFtZSI6IlN5c3RlbSIsImZhbWlseV9uYW1lIjoiQWRtaW5pc3RyYXRvciIsImVtYWlsIjoiYWRtaW5AbG9jYWxob3N0In0.xmfJ3pzI-jLYsaiFXyjTW7gfAEpvUmMVsp9BsB1CfRCVOKiGBbuZhnQY8W-1SWVAx1NjJ55L-zMHPK6hk1dRPLbEse3DlIBZw04W9j8m-Wz3eqdHf_UCjmrXb8qAwkeq0Iaxq9mVfJJeQWeKhFBi-Ff8ek4hCXTYDICXS8ny_BaC5WkyrefHQ2xBqQjwRyoxsg4IoVMjXYNb8L9A-4BNlRfs928SqgFYCRlF5h6zw_rC0XoLrGTmqeacBdpey-r3j2g_lTqWy8mQg2T9s65IDqW3kFPOsr0SVO88sjlFbN9Et0L57RmiqORk_RwzbWg-_Yb6dOuolXsnjBOhOoTzkA";
|
||||
if (token) config.headers.Authorization = `Bearer ${token}`;
|
||||
return config;
|
||||
await keycloak.updateToken(1)
|
||||
config.headers = config.headers ?? {}
|
||||
const token = keycloak.token
|
||||
if (token) config.headers.Authorization = `Bearer ${token}`
|
||||
return config
|
||||
},
|
||||
function (error: any) {
|
||||
return Promise.reject(error);
|
||||
return Promise.reject(error)
|
||||
}
|
||||
);
|
||||
)
|
||||
|
||||
http.interceptors.response.use(
|
||||
function (response: AxiosResponse<any, any>) {
|
||||
return response;
|
||||
return response
|
||||
},
|
||||
function (error: any) {
|
||||
if (typeof error !== undefined) {
|
||||
// eslint-disable-next-line no-prototype-builtins
|
||||
if (error.hasOwnProperty("response")) {
|
||||
if (error.hasOwnProperty('response')) {
|
||||
if (error.response.status === 401 || error.response.status === 403) {
|
||||
// Store.commit("SET_ERROR_MESSAGE", error.response.data.message);
|
||||
// Store.commit("REMOVE_ACCESS_TOKEN")
|
||||
}
|
||||
}
|
||||
}
|
||||
return Promise.reject(error);
|
||||
return Promise.reject(error)
|
||||
}
|
||||
);
|
||||
)
|
||||
|
||||
export default http;
|
||||
export default http
|
||||
|
|
|
|||
|
|
@ -2,18 +2,13 @@
|
|||
* front connect to keycloak
|
||||
*/
|
||||
import Keycloak from 'keycloak-js'
|
||||
// import config from "../app.config";
|
||||
// import http from "../shared/http";
|
||||
// import router from "../router";
|
||||
|
||||
//option keycloak ที่จะ connect
|
||||
const initOptions = {
|
||||
// url: "https://keycloak.frappet.synology.me/auth/",
|
||||
realm: 'bma-ehr',
|
||||
clientId: 'bma-ehr-vue3',
|
||||
url: 'https://identity.frappet.com/'
|
||||
// realm: 'bma-ehr-exam',
|
||||
// clientId: 'bma-ehr-exam-vue3'
|
||||
} //option keycloak ที่จะ connect
|
||||
}
|
||||
|
||||
const keycloak = Keycloak(initOptions)
|
||||
|
||||
|
|
|
|||
|
|
@ -1,7 +1,5 @@
|
|||
import { createRouter, createWebHistory } from 'vue-router'
|
||||
import HomeView from '../views/HomeView.vue'
|
||||
import Exam from '@/modules/01_exam/router'
|
||||
import Meta02 from '@/modules/02_meta/router'
|
||||
|
||||
import keycloak from '@/plugins/keycloak'
|
||||
|
||||
|
|
@ -13,57 +11,16 @@ const router = createRouter({
|
|||
routes: [
|
||||
{
|
||||
path: '/exam/:id',
|
||||
// name: 'home',
|
||||
component: MainLayout,
|
||||
children: [
|
||||
// {
|
||||
// path: '/',
|
||||
// name: 'dashboard',
|
||||
// component: HomeView,
|
||||
// meta: {
|
||||
// Auth: true,
|
||||
// Key: [7]
|
||||
// }
|
||||
// },
|
||||
...Exam
|
||||
// ...Meta02
|
||||
]
|
||||
children: [...Exam]
|
||||
},
|
||||
/**
|
||||
* 404 Not Found
|
||||
* ref: https://router.vuejs.org/guide/essentials/dynamic-matching.html#catch-all-404-not-found-route
|
||||
*/
|
||||
// {
|
||||
// // path: "/:catchAll(.*)*", // TODO: ใช้ pathMatch แทนตามในเอกสารแนะนำ คงไว้เผื่อจำเป็น
|
||||
// path: "/:pathMatch(.*)*",
|
||||
// component: Error404NotFound,
|
||||
// },
|
||||
{
|
||||
// path: "/:catchAll(.*)*", // TODO: ใช้ pathMatch แทนตามในเอกสารแนะนำ คงไว้เผื่อจำเป็น
|
||||
path: '/:pathMatch(.*)*',
|
||||
component: Error404NotFound
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
// const router = createRouter({
|
||||
// history: createWebHistory(import.meta.env.BASE_URL),
|
||||
// routes: [
|
||||
// {
|
||||
// path: '/',
|
||||
// name: 'home',
|
||||
// component: HomeView
|
||||
// },
|
||||
// {
|
||||
// path: '/about',
|
||||
// name: 'about',
|
||||
// // route level code-splitting
|
||||
// // this generates a separate chunk (About.[hash].js) for this route
|
||||
// // which is lazy-loaded when the route is visited.
|
||||
// component: () => import('../views/AboutView.vue')
|
||||
// }
|
||||
// ]
|
||||
// })
|
||||
router.beforeEach((to, from, next) => {
|
||||
if (to.meta.Auth) {
|
||||
if (!keycloak.authenticated) {
|
||||
|
|
@ -72,13 +29,11 @@ router.beforeEach((to, from, next) => {
|
|||
locale: 'th'
|
||||
})
|
||||
} else {
|
||||
// keycloak.updateToken(60);
|
||||
next()
|
||||
}
|
||||
} else {
|
||||
next()
|
||||
}
|
||||
// next()
|
||||
})
|
||||
|
||||
export default router
|
||||
|
|
|
|||
19
src/stores/data.ts
Normal file
19
src/stores/data.ts
Normal file
|
|
@ -0,0 +1,19 @@
|
|||
import { ref } from 'vue'
|
||||
import { defineStore } from 'pinia'
|
||||
|
||||
export const useDataStore = defineStore('data', () => {
|
||||
// ref() คือการประกาศ state เหมือน vuex
|
||||
const loader = ref<boolean>(false)
|
||||
|
||||
/**
|
||||
* active tab หน้า รายละเอียดทะเบียนประวัติ
|
||||
* @param val boolean false = close , true = open
|
||||
*/
|
||||
const loaderPage = (val: boolean) => {
|
||||
loader.value = val
|
||||
}
|
||||
return {
|
||||
loader,
|
||||
loaderPage
|
||||
}
|
||||
})
|
||||
|
|
@ -2,6 +2,7 @@ import { ref, computed } from 'vue'
|
|||
import { defineStore } from 'pinia'
|
||||
import moment from 'moment'
|
||||
import type { DataDateMonthObject } from '@/modules/01_exam/interface/index/Main'
|
||||
import CustomComponent from '@/components/CustomDialog.vue'
|
||||
|
||||
export const useCounterMixin = defineStore('mixin', () => {
|
||||
/**
|
||||
|
|
@ -230,6 +231,74 @@ export const useCounterMixin = defineStore('mixin', () => {
|
|||
}
|
||||
}
|
||||
|
||||
const messageError = (q: any, e: any = '') => {
|
||||
if (e.response !== undefined) {
|
||||
if (e.response.data.status !== undefined) {
|
||||
q.dialog({
|
||||
component: CustomComponent,
|
||||
componentProps: {
|
||||
title: `พบข้อผิดพลาด`,
|
||||
message: `${e.response.data.message}`,
|
||||
icon: 'warning',
|
||||
color: 'red',
|
||||
onlycancel: true
|
||||
}
|
||||
})
|
||||
} else {
|
||||
q.dialog({
|
||||
component: CustomComponent,
|
||||
componentProps: {
|
||||
title: `พบข้อผิดพลาด`,
|
||||
message: `ข้อมูลผิดพลาดทำให้เกิดการไม่ตอบสนองต่อการเรียกใช้งานดูเว็บไซต์`,
|
||||
icon: 'warning',
|
||||
color: 'red',
|
||||
onlycancel: true
|
||||
}
|
||||
})
|
||||
}
|
||||
} else {
|
||||
q.dialog({
|
||||
component: CustomComponent,
|
||||
componentProps: {
|
||||
title: `พบข้อผิดพลาด`,
|
||||
message: `ข้อมูลผิดพลาดทำให้เกิดการไม่ตอบสนองต่อการเรียกใช้งานดูเว็บไซต์`,
|
||||
icon: 'warning',
|
||||
color: 'red',
|
||||
onlycancel: true
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
|
||||
const dialogMessage = (
|
||||
// ไม่เอาใส่ undefined
|
||||
q: any,
|
||||
title: string,
|
||||
message: string,
|
||||
icon: string,
|
||||
textOk: string,
|
||||
color: string,
|
||||
ok?: Function,
|
||||
cancel?: Function
|
||||
) => {
|
||||
q.dialog({
|
||||
component: CustomComponent,
|
||||
componentProps: {
|
||||
title: title,
|
||||
message: message,
|
||||
icon: icon,
|
||||
color: color,
|
||||
textOk: textOk
|
||||
}
|
||||
})
|
||||
.onOk(() => {
|
||||
if (ok != undefined) ok()
|
||||
})
|
||||
.onCancel(() => {
|
||||
if (cancel != undefined) cancel()
|
||||
})
|
||||
}
|
||||
|
||||
function modalDelete(q: any, title: string, message: string, ok: Function, cancel?: Function) {
|
||||
q.dialog({
|
||||
title: `<span class="text-red">${title}</span>`,
|
||||
|
|
@ -442,6 +511,7 @@ export const useCounterMixin = defineStore('mixin', () => {
|
|||
modalDelete,
|
||||
modalConfirm,
|
||||
modalError,
|
||||
statusCandidate
|
||||
statusCandidate,
|
||||
messageError
|
||||
}
|
||||
})
|
||||
|
|
|
|||
|
|
@ -1,15 +0,0 @@
|
|||
<template>
|
||||
<div class="about">
|
||||
<h1>This is an about page</h1>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
@media (min-width: 1024px) {
|
||||
.about {
|
||||
min-height: 100vh;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -11,7 +11,6 @@ export default defineComponent({
|
|||
<div>
|
||||
<div class="text-h1">ไม่พบหน้าที่ต้องการ</div>
|
||||
<div class="text-h2">(404 Not Found)</div>
|
||||
<!-- <q-btn class="q-mt-xl" color="white" text-color="blue" unelevated to="/" label="กลับไปหน้าหลัก" no-caps /> -->
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -1,9 +0,0 @@
|
|||
<script setup lang="ts">
|
||||
import TheWelcome from '../components/TheWelcome.vue'
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<main>
|
||||
<TheWelcome />
|
||||
</main>
|
||||
</template>
|
||||
|
|
@ -1,11 +1,11 @@
|
|||
<script setup lang="ts">
|
||||
import { useQuasar } from 'quasar'
|
||||
import { onMounted, ref } from 'vue'
|
||||
// import keycloak from '@/plugins/keycloak'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { menuList, options, notiList } from '../interface/main/index'
|
||||
import { useExamDataStore } from '@/modules/01_exam/store'
|
||||
import { useDataStore } from '@/stores/data'
|
||||
import { useCounterMixin } from '@/stores/mixin'
|
||||
import { storeToRefs } from 'pinia'
|
||||
import keycloak from '@/plugins/keycloak'
|
||||
import http from '@/plugins/http'
|
||||
import config from '@/app.config'
|
||||
|
|
@ -13,14 +13,12 @@ import config from '@/app.config'
|
|||
const route = useRoute()
|
||||
const $q = useQuasar()
|
||||
const mixin = useCounterMixin() //เรียกฟังก์ชันกลาง
|
||||
const { statusCandidate } = mixin
|
||||
const store = useExamDataStore()
|
||||
const miniState = ref<boolean>(false)
|
||||
const active = ref<number>(0)
|
||||
const drawerL = ref<boolean>(false)
|
||||
const fullname = ref<string>('')
|
||||
const notiTrigger = ref<boolean>(false)
|
||||
const loader = ref<boolean>(false)
|
||||
const { statusCandidate, messageError } = mixin
|
||||
const storeExam = useExamDataStore()
|
||||
const store = useDataStore()
|
||||
const { loader } = storeToRefs(store)
|
||||
const dataStore = useDataStore()
|
||||
const { loaderPage } = dataStore
|
||||
const status = ref<string>('register')
|
||||
const examId = ref<string>('')
|
||||
const positionId = ref<string>('')
|
||||
|
|
@ -31,26 +29,6 @@ onMounted(async () => {
|
|||
await fetchStatus()
|
||||
})
|
||||
|
||||
const toggleBtnLeft = () => {
|
||||
if (window.innerWidth < 1024) {
|
||||
drawerL.value = !drawerL.value
|
||||
} else {
|
||||
miniState.value = !miniState.value
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* ตรวจสอบ path นั้นๆ ว่ายังอยู่ที่ path นั้น แม้จะเป็น path ที่มี child แท็ปก็ยังจะ active อยู่เช่น
|
||||
* ปกติ path จะ active เมื่อ path นั้นมีค่า ตรงตัวมันเช่น /main
|
||||
* แต่จะไม่ active เมื่อ path นั้น มี child path /main/อื่นๆ
|
||||
* @param path string
|
||||
*/
|
||||
const activeMenu = (path: string) => {
|
||||
if (path == 'dashboard' && route.fullPath == '/') return true
|
||||
const bool = route.fullPath.includes(path)
|
||||
return bool
|
||||
}
|
||||
|
||||
/**
|
||||
* logout keycloak
|
||||
* confirm ก่อนออกจากระบบ
|
||||
|
|
@ -68,16 +46,18 @@ const doLogout = () => {
|
|||
}
|
||||
|
||||
const fetchStatus = async () => {
|
||||
loader.value = true
|
||||
loaderPage(true)
|
||||
await http
|
||||
.get(config.API.candidateStatus(examId.value, positionId.value))
|
||||
.then((res) => {
|
||||
const data = res.data.result
|
||||
status.value = data
|
||||
})
|
||||
.catch(() => {})
|
||||
.catch((e) => {
|
||||
// messageError($q, e)
|
||||
})
|
||||
.finally(() => {
|
||||
loader.value = false
|
||||
loaderPage(false)
|
||||
})
|
||||
}
|
||||
|
||||
|
|
@ -107,19 +87,10 @@ const getFontColor = (val: string) => {
|
|||
return '-'
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* ดิงชื่อผู้ใช้งานจาก keycloak
|
||||
*/
|
||||
// if (keycloak.tokenParsed != null) {
|
||||
// fullname.value = keycloak.tokenParsed.name
|
||||
// }
|
||||
</script>
|
||||
|
||||
<!-- โครงเว็บ -->
|
||||
<template>
|
||||
<!-- แบบเก่า design แรก -->
|
||||
<!-- <q-layout view="lHh Lpr lff"> -->
|
||||
<!-- ปรับให้กับหน้า รายละเอียดรายการสอบทั้งหมด -->
|
||||
<q-layout view="lHh LpR lff" class="bgColor text-dark">
|
||||
<!-- header -->
|
||||
|
|
@ -137,11 +108,8 @@ const getFontColor = (val: string) => {
|
|||
</div>
|
||||
</q-toolbar-title>
|
||||
<q-space />
|
||||
<!-- <q-badge flat color="blue" class="q-mr-md text-bold">
|
||||
{{ statusCandidate(status) }}
|
||||
</q-badge> -->
|
||||
<div class="q-mr-md text-bold" :class="getFontColor(store.status)">
|
||||
{{ statusCandidate(store.status) }}
|
||||
<div class="q-mr-md text-bold" :class="getFontColor(storeExam.status)">
|
||||
{{ statusCandidate(storeExam.status) }}
|
||||
</div>
|
||||
<q-btn
|
||||
v-if="$q.screen.gt.xs"
|
||||
|
|
@ -169,14 +137,12 @@ const getFontColor = (val: string) => {
|
|||
<router-view :key="$route.fullPath" />
|
||||
</q-page>
|
||||
</q-page-container>
|
||||
<full-loader :visibility="loader" />
|
||||
</q-layout>
|
||||
</template>
|
||||
|
||||
<style>
|
||||
.bgColor {
|
||||
/* background-image: url("../assets/bg.png");
|
||||
background-size: cover;
|
||||
background-size: 100%; */
|
||||
background: #f6f9fa;
|
||||
}
|
||||
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue