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

เพิม่ปุ่มลบ ประวัติการศึกษา

Browse source
This commit is contained in:
Kittapath 2023-03-20 13:01:27 +07:00
parent e7198525a2
commit 6b78719b59
16 changed files with 432 additions and 147 deletions
Download patch file Download diff file Expand all files Collapse all files

5
.dockerignore Normal file
View file

@ -0,0 +1,5 @@
**/node_modules
**/dist
Dockerfile
docker-compose.yaml

12
Dockerfile Normal file
View file

@ -0,0 +1,12 @@
# docker build . -t docker.frappet.com/demo/fe:latest
FROM node:latest as build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY ./ .
RUN npm run build
FROM nginx as production-stage
RUN mkdir /app
COPY --from=build-stage /app/dist /app
COPY nginx.conf /etc/nginx/nginx.conf

30
nginx.conf Normal file
View file

@ -0,0 +1,30 @@
user nginx;
worker_processes 1;
error_log /var/log/nginx/error.log warn;
pid /var/run/nginx.pid;
events {
worker_connections 1024;
}
http {
include /etc/nginx/mime.types;
default_type application/octet-stream;
log_format main '$remote_addr - $remote_user [$time_local] "$request" '
'$status $body_bytes_sent "$http_referer" '
'"$http_user_agent" "$http_x_forwarded_for"';
access_log /var/log/nginx/access.log main;
sendfile on;
keepalive_timeout 65;
server {
listen 80;
server_name localhost;
location / {
root /app;
index index.html;
try_files $uri $uri/ /index.html;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root /usr/share/nginx/html;
}
}
}

4
src/components/DialogFooter.vue
View file

@ -32,7 +32,7 @@
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
</q-btn>
<div v-else>
<q-btn
<!-- <q-btn
flat
round
:disabled="!editvisible"
@ -43,7 +43,7 @@
v-if="modalEdit == true"
>
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn>
</q-btn> -->
<q-btn
flat
round

30
src/components/Table.vue
View file

@ -5,15 +5,18 @@
v-model:edit="editBtn"
:header="name"
:icon="icon"
:add="checkAdd"
:add="clickAdd"
:editBtn="clickEdit"
:cancel="clickCancel"
:history="false"
v-if="nameHeader"
:addData="false"
/>
<div class="q-pl-sm">
<!-- 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>
</div> -->
<q-space />
<div class="items-center" style="display: flex">
<!-- ค้นหาข้อความใน table -->
@ -75,6 +78,7 @@
<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="editBtn == true" />
</q-tr>
</template>
<template #body="props">
@ -83,7 +87,7 @@
</q-table>
</template>
<script setup lang="ts">
import { ref, useAttrs } from 'vue'
import { ref, useAttrs, watch } from 'vue'
import HeaderTop from '@/components/top.vue'
import type { Pagination } from '@/modules/01_exam/interface/index/Main'
@ -127,6 +131,10 @@ const props = defineProps({
const emit = defineEmits(['update:inputfilter', 'update:inputvisible', 'update:editvisible'])
watch(props, (count: any, prevCount: any) => {
editBtn.value = props.editvisible
})
const updateEdit = (value: Boolean) => {
emit('update:editvisible', value)
}
@ -141,11 +149,21 @@ const paginationLabel = (start: string, end: string, total: string) => {
return start + '-' + end + ' ใน ' + total
}
const checkAdd = () => {
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()

48
src/components/top.vue
View file

@ -1,6 +1,6 @@
<template>
<div class="flex items-center">
<div class="flex items-center">
<div class="flex items-center" v-if="header != ''">
<q-icon :name="icon" size="1.5em" color="grey-5" class="q-mr-md" />
<div class="text-weight-medium text-dark col-12 row items-center text-header">
{{ header }}
@ -45,9 +45,42 @@
</q-btn>
</div>
<div class="q-pl-sm" v-else>
<!-- <q-btn size="12px" flat round color="add" @click="add" icon="mdi-plus">
<q-btn
size="12px"
v-if="!edit"
flat
round
:disabled="edit"
:color="edit ? 'grey-7' : 'primary'"
@click="ClickEdit"
icon="mdi-pencil-outline"
>
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
</q-btn>
<q-btn
size="12px"
flat
round
v-if="edit"
:disabled="!edit"
:color="!edit ? 'grey-7' : 'add'"
@click="add"
icon="mdi-plus"
>
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
</q-btn> -->
</q-btn>
<q-btn
size="12px"
flat
round
v-if="edit"
:disabled="!edit"
:color="!edit ? 'grey-7' : 'red'"
@click="ClickCancel"
icon="mdi-undo"
>
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn>
</div>
<q-space />
</div>
@ -56,12 +89,12 @@
const props = defineProps({
header: {
type: String,
default: 'ข้อความ',
default: '',
required: true
},
icon: {
type: String,
default: 'mdi-help',
default: '',
required: true
},
edit: {
@ -89,6 +122,10 @@ const props = defineProps({
type: Function,
default: () => console.log('not function')
},
editBtn: {
type: Function,
default: () => console.log('not function')
},
changeBtn: {
type: Function,
default: () => console.log('not function')
@ -103,6 +140,7 @@ const updateEdit = (value: any) => {
const ClickEdit = () => {
updateEdit(!props.edit)
props.editBtn()
props.changeBtn()
}

4
src/main.ts
View file

@ -32,8 +32,8 @@ app.use(
}
},
lang: th
},
quasarUserOptions
}
// quasarUserOptions
)
app.component(

2
src/modules/01_exam/components/ExamDetail.vue
View file

@ -54,7 +54,7 @@
</div>
<div class="row justify-center q-pa-md">
<q-btn color="primary" class="q-ml-md" label="สมัครสอบ" @click="applyCandidate" />
<q-btn color="primary" class="q-ml-md" label="ต่อไป" @click="applyCandidate" />
</div>
</div>
</template>

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

@ -18,18 +18,22 @@
<q-tab-panels v-model="tab" animated class="bg-white">
<!-- ข้อมูลส่วนบุคคล -->
<q-tab-panel name="profile">
<Profile :loader="loader" v-model:statusEdit="statusEditProfile" :step="step" />
<Profile :loader="loader" v-model:statusEdit="statusEdit" :step="step" />
</q-tab-panel>
<!-- ประวัติการศีกษา -->
<q-tab-panel name="education"><Education :loader="loader" :step="step" /></q-tab-panel>
<q-tab-panel name="education"
><Education :loader="loader" v-model:statusEdit="statusEdit" :step="step"
/></q-tab-panel>
<!-- ประวัติการทำงาน/ฝึกงาน -->
<q-tab-panel name="career"><Career :loader="loader" :step="step" /></q-tab-panel>
<q-tab-panel name="career"
><Career :loader="loader" v-model:statusEdit="statusEdit" :step="step"
/></q-tab-panel>
<!-- ไฟล์ -->
<q-tab-panel name="document">
<Document :loader="loader" v-model:statusEdit="statusEditDocument" :step="step" />
<Document :loader="loader" v-model:statusEdit="statusEdit" :step="step" />
</q-tab-panel>
</q-tab-panels>
@ -37,17 +41,34 @@
<q-checkbox
v-model="acceptTermOfUse"
:disable="step !== 2"
v-if="step !== 2 || tab == 'document'"
label="ข้าพเจ้ารับรองว่า ข้าพเจ้ามีคุณสมบัติครบถ้วนตามประกาศรับสมัคร ข้อความข้างต้นตรงตามความจริงทุกประการ"
/>
</div>
<div class="row justify-center q-pa-md">
<q-btn
color="primary"
class="q-ml-md"
label="กลับ"
@click="clickPreview(tab)"
v-if="step === 2 && (tab == 'education' || tab == 'career' || tab == 'document')"
icon="mdi-chevron-left"
/>
<q-btn
color="primary"
class="q-ml-md"
label="ต่อไป"
@click="clickNext(tab)"
v-if="step === 2 && (tab == 'profile' || tab == 'education' || tab == 'career')"
icon-right="mdi-chevron-right"
/>
<q-btn
color="primary"
class="q-ml-md"
label="สมัครสอบ"
@click="okModalComfirm"
v-if="step === 2"
v-if="step === 2 && tab == 'document'"
:disable="!acceptTermOfUse"
/>
</div>
@ -90,8 +111,7 @@ const props = defineProps({
const tab = ref<string>('profile')
const tabRaw = ref<string>('profile')
const loader = ref<boolean>(false)
const statusEditProfile = ref<boolean>(false)
const statusEditDocument = ref<boolean>(false)
const statusEdit = ref<boolean>(false)
const acceptTermOfUse = ref<boolean>(false)
const modalComfirm = ref<boolean>(false)
const modalComfirmTittle = ref<string>('ยืนยันการสมัครสอบ?')
@ -107,7 +127,7 @@ onMounted(async () => {
})
const okModalComfirm = () => {
if (statusEditProfile.value == true || statusEditDocument.value == true) {
if (statusEdit.value == true) {
modalNoEditTittle.value = 'ไม่สามารถสมัครสอบได้?'
modalNoEditDetail.value = 'มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล'
modalNoEdit.value = true
@ -128,8 +148,39 @@ const applyCandidate = () => {
props.fetchStep()
}
const clickPreview = (val: string) => {
console.log(val)
switch (val) {
case 'profile':
return (tab.value = 'profile')
case 'education':
return (tab.value = 'profile')
case 'career':
return (tab.value = 'education')
case 'document':
return (tab.value = 'career')
default:
return (tab.value = 'profile')
}
}
const clickNext = (val: string) => {
switch (val) {
case 'profile':
return (tab.value = 'education')
case 'education':
return (tab.value = 'career')
case 'career':
return (tab.value = 'document')
case 'document':
return (tab.value = 'profile')
default:
return (tab.value = 'profile')
}
}
const changeTab = () => {
if (statusEditProfile.value == true || statusEditDocument.value == true) {
if (statusEdit.value == true) {
modalNoEditTittle.value = 'ไม่สามารถเปลี่ยนแท็ปได้?'
modalNoEditDetail.value = 'มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล'
tab.value = tabRaw.value

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

@ -2,14 +2,17 @@
<template>
<q-card flat bordered class="col-12 q-px-lg q-py-md">
<q-form ref="myForm">
<ProfileTable
<Table
:rows="rows"
:columns="columns"
:filter="filter"
:visible-columns="visibleColumns"
v-model:inputfilter="filter"
v-model:inputvisible="visibleColumns"
v-model:editvisible="edit"
:add="clickAdd"
:edit="clickEdit"
:cancel="clickCancel"
:nameHeader="false"
:addData="addData"
>
@ -32,9 +35,20 @@
{{ col.value }}
</div>
</q-td>
<q-td auto-width v-if="edit === true">
<q-btn
color="red"
flat
dense
round
size="14px"
icon="mdi-trash-can-outline"
@click="clickDeleteRow(props.row)"
/>
</q-td>
</q-tr>
</template>
</ProfileTable>
</Table>
</q-form>
</q-card>
<!-- popup Edit window-->
@ -171,7 +185,7 @@
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue'
import { useExamDataStore } from '@/modules/01_exam/store'
import ProfileTable from '@/components/Table.vue'
import Table from '@/components/Table.vue'
import DialogHeader from '@/components/DialogHeader.vue'
import DialogFooter from '@/components/DialogFooter.vue'
import { useQuasar } from 'quasar'
@ -194,6 +208,10 @@ const props = defineProps({
step: {
type: Number,
required: true
},
statusEdit: {
type: Boolean,
required: true
}
})
@ -232,7 +250,7 @@ const closeModalError = () => {
}
}
const emit = defineEmits(['update:loader'])
const emit = defineEmits(['update:loader', 'update:statusEdit'])
const rows = ref<RequestItemsObject[]>([
{
@ -317,6 +335,10 @@ watch(visibleColumns, async (count: String[], prevCount: String[]) => {
await changeExamColumns('career', count)
})
watch(edit, (count: boolean, prevCount: boolean) => {
emit('update:statusEdit', count)
})
onMounted(async () => {
// await fetchData()
rawHistory.value = rows.value
@ -331,7 +353,7 @@ const fetchData = async () => {}
* กดดูข้อมูลก่อนหน้า
*/
const clickPrevious = () => {
edit.value = false
// edit.value = false
rowIndex.value -= 1
const row = rows.value[rowIndex.value]
location.value = row.location
@ -347,7 +369,7 @@ const clickPrevious = () => {
* กดดูข้อมูลต่อไป
*/
const clickNext = () => {
edit.value = false
// edit.value = false
rowIndex.value += 1
const row = rows.value[rowIndex.value]
location.value = row.location
@ -391,6 +413,7 @@ const checkRowPage = () => {
* กดปุ่มแก้ไขใน dialog
*/
const clickEdit = () => {
edit.value = true
next.value = false
previous.value = false
}
@ -402,6 +425,23 @@ const clickAdd = () => {
addRow()
}
/**
* ลบข้อมูลใน table
*/
const clickDeleteRow = (row: RequestItemsObject) => {
$q.dialog({
title: 'ยืนยันการลบข้อมูล',
message: 'หากต้องการลบกดให้กดตกลง',
cancel: true,
persistent: true
})
.onOk(() => {
rows.value = rows.value.filter((val: any) => val.id != row.id)
})
.onCancel(() => {})
.onDismiss(() => {})
}
/**
* กดบันทึกใน dialog
*/
@ -447,7 +487,7 @@ const saveData = async () => {
* บันทึกแก้ไขข้อมูล
*/
const editData = async () => {
edit.value = false
// edit.value = false
editRow.value = false
// loader.value = true;
@ -501,7 +541,7 @@ const clickClose = async () => {
const selectData = (props: DataProps) => {
modalEdit.value = true
modal.value = true
edit.value = false
// edit.value = false
rawItem.value = props.row
rowIndex.value = props.rowIndex
location.value = props.row.location
@ -510,7 +550,12 @@ const selectData = (props: DataProps) => {
duration.value = props.row.duration
reason.value = props.row.reason
id.value = props.row.id
checkRowPage()
if (edit.value == true) {
next.value = false
previous.value = false
} else {
checkRowPage()
}
}
/**
@ -519,7 +564,7 @@ const selectData = (props: DataProps) => {
const addRow = () => {
modalEdit.value = false
modal.value = true
edit.value = true
// edit.value = true
location.value = ''
position.value = ''
salary.value = null
@ -531,22 +576,23 @@ const addRow = () => {
* ฟังก์ชันปุ่มยกเลิกการแก้ไขข้อมูล
*/
const clickCancel = async () => {
if (editRow.value == true) {
$q.dialog({
title: `ข้อมูลมีการแก้ไข`,
message: `ยืนยันการบันทึกข้อมูลใช่หรือไม่?`,
cancel: 'ยกเลิก',
ok: 'ยืนยัน',
persistent: true
}).onOk(async () => {
edit.value = false
checkRowPage()
await getData()
})
} else {
edit.value = false
checkRowPage()
}
// if (editRow.value == true) {
// $q.dialog({
// title: `ข้อมูลมีการแก้ไข`,
// message: `ยืนยันการบันทึกข้อมูลใช่หรือไม่?`,
// cancel: 'ยกเลิก',
// ok: 'ยืนยัน',
// persistent: true
// }).onOk(async () => {
// // edit.value = false
// checkRowPage()
// await getData()
// })
// } else {
// // edit.value = false
// checkRowPage()
// }
edit.value = false
}
/**

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

@ -1,6 +1,6 @@
<!-- card เอกสารหลักฐาน -->
<template>
<q-card flat bordered class="col-12 row q-px-lg q-py-md q-mt-md">
<q-card flat bordered class="col-12 q-px-lg q-py-md">
<HeaderTop
v-model:edit="edit"
header="เอกสารหลักฐาน(เช่น สำเนาบัตรประชาชน ทะเบียนบ้าน วุฒิการศึกษา)"
@ -21,42 +21,52 @@
<q-item-label caption> สถานะ: {{ file.status }} / {{ file.sizeLabel }} </q-item-label>
</q-item-section>
<q-item-section top side>
<div class="row col-12">
<div class="q-gutter-sm">
<q-btn size="12px" flat dense round color="blue" icon="mdi-download-outline">
<q-tooltip>ดาวน์โหลด</q-tooltip>
</q-btn>
<q-btn
class="gt-xs"
size="12px"
flat
dense
round
color="blue"
icon="mdi-download-outline"
/>
<q-btn
class="gt-xs"
size="12px"
flat
dense
round
color="red"
icon="mdi-delete-outline"
v-show="edit"
/>
v-if="edit"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</div>
</q-item-section>
</q-item>
</q-list>
</q-card>
<q-uploader
v-show="edit"
color="blue"
type="file"
flat
auto-upload
:factory="fileUpload"
class="full-width"
accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
bordered
label="[ไฟล์ jpg,png,pdf,csv,doc]"
/>
<div v-if="edit" class="col-12 q-ma-none">
<q-separator class="q-mt-sm" />
<q-input
class="q-my-sm"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="name"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อเอกสาร'}`]"
:label="`${'ชื่อเอกสาร'}`"
/>
<q-uploader
color="blue"
type="file"
flat
auto-upload
:factory="fileUpload"
class="full-width"
accept=".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel"
bordered
label="[ไฟล์ jpg,png,pdf,csv,doc]"
/>
</div>
</div>
</q-card>
</template>
@ -86,6 +96,7 @@ const props = defineProps({
const edit = ref<boolean>(false)
const addData = ref<boolean>(true)
const name = ref<string>('')
const files = ref<any>([
{
key: 1,

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

@ -2,14 +2,17 @@
<template>
<q-card flat bordered class="col-12 q-px-lg q-py-md">
<q-form ref="myForm">
<ProfileTable
<Table
:rows="rows"
:columns="columns"
:filter="filter"
:visible-columns="visibleColumns"
v-model:inputfilter="filter"
v-model:inputvisible="visibleColumns"
v-model:editvisible="edit"
:add="clickAdd"
:edit="clickEdit"
:cancel="clickCancel"
:nameHeader="false"
:addData="addData"
>
@ -29,9 +32,20 @@
{{ col.value }}
</div>
</q-td>
<q-td auto-width v-if="edit === true">
<q-btn
color="red"
flat
dense
round
size="14px"
icon="mdi-trash-can-outline"
@click="clickDeleteRow(props.row)"
/>
</q-td>
</q-tr>
</template>
</ProfileTable>
</Table>
</q-form>
</q-card>
<!-- popup Edit window-->
@ -172,7 +186,7 @@
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue'
import { useExamDataStore } from '@/modules/01_exam/store'
import ProfileTable from '@/components/Table.vue'
import Table from '@/components/Table.vue'
import DialogHeader from '@/components/DialogHeader.vue'
import DialogFooter from '@/components/DialogFooter.vue'
import { useQuasar } from 'quasar'
@ -196,6 +210,10 @@ const props = defineProps({
step: {
type: Number,
required: true
},
statusEdit: {
type: Boolean,
required: true
}
})
@ -235,7 +253,7 @@ const closeModalError = () => {
// fetchData();
}
}
const emit = defineEmits(['update:loader'])
const emit = defineEmits(['update:loader', 'update:statusEdit'])
const rows = ref<RequestItemsObject[]>([
{
@ -322,6 +340,10 @@ watch(visibleColumns, async (count: String[], prevCount: String[]) => {
await changeExamColumns('education', count)
})
watch(edit, (count: boolean, prevCount: boolean) => {
emit('update:statusEdit', count)
})
onMounted(async () => {
// await fetchData()
// await fetchQualification()
@ -355,7 +377,7 @@ const fetchData = async () => {}
* กดดูข้อมูลก่อนหน้า
*/
const clickPrevious = () => {
edit.value = false
// edit.value = false
rowIndex.value -= 1
const row = rows.value[rowIndex.value]
qualification.value = row.qualification
@ -372,7 +394,7 @@ const clickPrevious = () => {
* กดดูข้อมูลต่อไป
*/
const clickNext = () => {
edit.value = false
// edit.value = false
rowIndex.value += 1
const row = rows.value[rowIndex.value]
qualification.value = row.qualification
@ -418,6 +440,7 @@ const checkRowPage = () => {
* กดปุ่มแก้ไขใน dialog
*/
const clickEdit = () => {
edit.value = true
next.value = false
previous.value = false
}
@ -429,6 +452,23 @@ const clickAdd = () => {
addRow()
}
/**
* ลบข้อมูลใน table
*/
const clickDeleteRow = (row: RequestItemsObject) => {
$q.dialog({
title: 'ยืนยันการลบข้อมูล',
message: 'หากต้องการลบกดให้กดตกลง',
cancel: true,
persistent: true
})
.onOk(() => {
rows.value = rows.value.filter((val: any) => val.id != row.id)
})
.onCancel(() => {})
.onDismiss(() => {})
}
/**
* กดบันทึกใน dialog
*/
@ -474,7 +514,7 @@ const saveData = async () => {
* บันทึกแก้ไขข้อมูล
*/
const editData = async () => {
edit.value = false
// edit.value = false
editRow.value = false
// loader.value = true;
@ -528,7 +568,7 @@ const clickClose = async () => {
const selectData = (props: DataProps) => {
modalEdit.value = true
modal.value = true
edit.value = false
// edit.value = false
rawItem.value = props.row
rowIndex.value = props.rowIndex
qualification.value = props.row.qualification
@ -538,7 +578,12 @@ const selectData = (props: DataProps) => {
name.value = props.row.name
duration.value = props.row.duration
id.value = props.row.id
checkRowPage()
if (edit.value == true) {
next.value = false
previous.value = false
} else {
checkRowPage()
}
}
/**
@ -547,7 +592,7 @@ const selectData = (props: DataProps) => {
const addRow = () => {
modalEdit.value = false
modal.value = true
edit.value = true
// edit.value = true
qualification.value = ''
qualificationId.value = ''
major.value = ''
@ -560,22 +605,23 @@ const addRow = () => {
* ฟังก์ชันปุ่มยกเลิกการแก้ไขข้อมูล
*/
const clickCancel = async () => {
if (editRow.value == true) {
$q.dialog({
title: `ข้อมูลมีการแก้ไข`,
message: `ยืนยันการบันทึกข้อมูลใช่หรือไม่?`,
cancel: 'ยกเลิก',
ok: 'ยืนยัน',
persistent: true
}).onOk(async () => {
edit.value = false
checkRowPage()
await getData()
})
} else {
edit.value = false
checkRowPage()
}
// if (editRow.value == true) {
// $q.dialog({
// title: `ข้อมูลมีการแก้ไข`,
// message: `ยืนยันการบันทึกข้อมูลใช่หรือไม่?`,
// cancel: 'ยกเลิก',
// ok: 'ยืนยัน',
// persistent: true
// }).onOk(async () => {
// edit.value = false
// checkRowPage()
// await getData()
// })
// } else {
// edit.value = false
// checkRowPage()
// }
edit.value = false
}
/**

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

@ -314,7 +314,7 @@
</q-img>
</q-file>
</div>
<div class="col-12 text-center" v-show="disabledPic">
<div class="col-12 text-center" v-if="disabledPic">
<q-btn outline dense color="black" icon="mdi-content-save-outline" @click="savePic">
<q-tooltip content-class="bg-grey-2 text-black">บันทึกรูป</q-tooltip>
</q-btn>

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

@ -1,9 +1,11 @@
<!-- page:detail 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">{{
tittle
}}</q-toolbar-title>
<q-toolbar-title class="toptitle text-dark col-12 row items-center">
{{ tittle }}
<q-space />
<q-btn color="primary" label="ออกจากระบบ" push size="sm" v-close-popup @click="doLogout" />
</q-toolbar-title>
</q-toolbar>
<q-card flat class="">
<div class="justify-center">
@ -17,15 +19,19 @@
header-nav
animated
done-color="positive"
active-color="amber-7"
active-color="blue-7"
inactive-color="positive"
done-icon="check"
:active-icon="stepRaw === step && stepRaw != 4 ? 'mdi-pencil-outline' : 'mdi-eye-outline'"
>
<q-step
:done="step > 1"
:disable="stepRaw < 1"
:name="1"
title="อ่านคำชี้แจง"
:icon="stepRaw >= 1 ? 'check' : 'edit'"
:icon="
stepRaw >= 1 ? (stepRaw == 1 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline'
"
>
<ExamDetail :fetchStep="fetchStep" :step="stepRaw" />
</q-step>
@ -33,8 +39,10 @@
:done="step > 2"
:disable="stepRaw < 2"
:name="2"
title="กรอกข้อมูล"
:icon="stepRaw >= 2 ? 'check' : 'edit'"
title="ข้อมูลสมัครสอบ"
:icon="
stepRaw >= 2 ? (stepRaw == 2 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline'
"
>
<ExamForm :fetchStep="fetchStep" :step="stepRaw" />
</q-step>
@ -43,7 +51,9 @@
:disable="stepRaw < 3"
:name="3"
title="ชำระค่าธรรมเนียมการสอบ"
:icon="stepRaw >= 3 ? 'check' : 'edit'"
:icon="
stepRaw >= 3 ? (stepRaw == 3 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline'
"
>
<ExamPayment :fetchStep="fetchStep" :step="stepRaw" />
</q-step>
@ -52,7 +62,9 @@
:disable="stepRaw < 4"
:name="4"
title="สำเร็จ"
:icon="stepRaw >= 4 ? 'check' : 'edit'"
:icon="
stepRaw >= 4 ? (stepRaw == 4 ? 'mdi-pencil-outline' : 'check') : 'mdi-pencil-outline'
"
>
<ExamFinished :fetchStep="fetchStep" :step="stepRaw" />
</q-step>
@ -67,7 +79,10 @@ import ExamDetail from '@/modules/01_exam/components/ExamDetail.vue'
import ExamForm from '@/modules/01_exam/components/ExamForm.vue'
import ExamPayment from '@/modules/01_exam/components/ExamPayment.vue'
import ExamFinished from '@/modules/01_exam/components/ExamFinished.vue'
import keycloak from '@/plugins/keycloak'
import { useQuasar } from 'quasar'
const $q = useQuasar()
const examId = ref<string>('zxc')
const step = ref<number>(1)
const stepRaw = ref<number>(1)
@ -118,4 +133,20 @@ const fetchStep = () => {
stepRaw.value += 1
step.value += 1
}
/**
* logout keycloak
* confirm ก่อนออกจากระบบ
*/
const doLogout = () => {
$q.dialog({
title: 'ยืนยันการออกจากระบบ',
message: `ต้องการออกจากระบบใช้หรือไม่?`,
cancel: 'ยกเลิก',
ok: 'ยืนยัน',
persistent: true
}).onOk(() => {
keycloak.logout()
})
}
</script>

28
src/router/index.ts
View file

@ -65,20 +65,20 @@ const router = createRouter({
// ]
// })
router.beforeEach((to, from, next) => {
if (to.meta.Auth) {
if (!keycloak.authenticated) {
keycloak.login({
redirectUri: `${window.location.protocol}//${window.location.host}${to.path}`,
locale: 'th'
})
} else {
// keycloak.updateToken(60);
next()
}
} else {
next()
}
// next();
// if (to.meta.Auth) {
// if (!keycloak.authenticated) {
// keycloak.login({
// redirectUri: `${window.location.protocol}//${window.location.host}${to.path}`,
// locale: 'th'
// })
// } else {
// // keycloak.updateToken(60);
// next()
// }
// } else {
// next()
// }
next()
})
export default router

37
src/views/MainLayout.vue
View file

@ -1,11 +1,14 @@
<script setup lang="ts">
import { useQuasar } from 'quasar'
import { ref } from 'vue'
// import keycloak from '@/plugins/keycloak'
import { useRoute } from 'vue-router'
import { menuList, options, notiList } from '../interface/main/index'
import keycloak from '@/plugins/keycloak'
const route = useRoute()
const $q = useQuasar()
const miniState = ref<boolean>(false)
const active = ref<number>(0)
const drawerL = ref<boolean>(false)
@ -37,18 +40,15 @@ const activeMenu = (path: string) => {
* confirm ก่อนออกจากระบบ
*/
const doLogout = () => {
// this.$q
// .dialog({
// title: "ยืนยันการออกจากระบบ",
// message: `ต้องการออกจากระบบใช้หรือไม่?`,
// cancel: "ยกเลิก",
// ok: "ยืนยัน",
// persistent: true,
// })
// .onOk(() => {
// // this.$router.push("/logout")
// keycloak.logout()
// });
$q.dialog({
title: 'ยืนยันการออกจากระบบ',
message: `ต้องการออกจากระบบใช้หรือไม่?`,
cancel: 'ยกเลิก',
ok: 'ยืนยัน',
persistent: true
}).onOk(() => {
keycloak.logout()
})
}
/**
@ -92,12 +92,12 @@ const doLogout = () => {
<q-icon name="mdi-magnify" size="20px" color="grey-7" />
</template>
</q-input> -->
<q-btn class="bg-grey-3" flat dense round>
<!-- <q-btn class="bg-grey-3" flat dense round>
<q-icon name="mdi-magnify" size="20px" color="grey-7" />
</q-btn>
</q-btn> -->
<!-- Notification -->
<q-btn
<!-- <q-btn
round
dense
flat
@ -145,7 +145,6 @@ const doLogout = () => {
<q-item v-close-popup class="q-pa-none">
<q-item-section avatar>
<q-avatar color="grey-3">
<!-- <img src="https://cdn.quasar.dev/img/avatar.png" /> -->
<q-icon name="mdi-account" size="22px" color="grey-7" />
</q-avatar>
</q-item-section>
@ -164,7 +163,6 @@ const doLogout = () => {
<div class="column items-center col-12 q-py-md" color="grey-3">
<q-avatar size="72px" color="grey-4">
<q-icon name="mdi-account" color="grey-7" />
<!-- <img :src="require('@/assets/logo.png')" /> -->
</q-avatar>
<div class="text-subtitle2 q-mt-md q-mb-xs text-center">
{{ fullname }}
@ -176,14 +174,13 @@ const doLogout = () => {
size="sm"
v-close-popup
@click="doLogout"
/><!-- -->
/>
</div>
<div class="column col-12">
<q-separator />
<div class="column q-pb-md justify-center">
<div class="text-overline text-grey q-px-md q-pt-sm">เลือกโหมด</div>
<!-- <q-option-group v-model="group" :options="options" color="primary"/> -->
<q-list dense v-for="op in options" :key="op.label">
<q-item clickable>
<q-item-section avatar>
@ -202,7 +199,7 @@ const doLogout = () => {
</div>
</div>
</q-btn-dropdown>
</div>
</div> -->
</q-toolbar>
</q-header>
<!-- end header -->