no message

This commit is contained in:
Kittapath 2023-03-21 16:30:02 +07:00
parent ae7b52e875
commit 6fe6aed921
10 changed files with 213 additions and 185 deletions

View file

@ -1,9 +1,9 @@
/**ใช้รวมไฟล์ย่อยๆ ของ api แต่ละไฟล์ */
import manageOrganization from './api/manage/api.organization'
import metadata from './api/exam/api.metadata'
const API = {
...manageOrganization
...metadata
}
export default {

View file

@ -12,9 +12,9 @@
/>
</div>
<div class="col text-dark">
<span class="text-bold">{{ modalTittle }}</span>
<span class="text-bold">{{ tittle }}</span>
<br />
<span>{{ modalDetail }}</span>
<span>{{ detail }}</span>
</div>
</q-card-section>
@ -30,8 +30,8 @@ import { ref, useAttrs } from 'vue'
const props = defineProps({
modal: Boolean,
modalTittle: String,
modalDetail: String,
tittle: String,
detail: String,
ok: {
type: Function,
default: () => console.log('not function')

View file

@ -0,0 +1,86 @@
<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>

View file

@ -74,23 +74,23 @@
color="primary"
class="q-ml-md"
label="สมัครสอบ"
@click="okModalComfirm"
@click="okModalConfirm"
v-if="step === 2 && tab == 'document'"
:disable="!acceptTermOfUse || statusEdit"
/>
</div>
</div>
<NotifyConfirm
:modal="modalComfirm"
:modalTittle="modalComfirmTittle"
:modalDetail="modalComfirmDetail"
:modal="modalConfirm"
:tittle="modalConfirmTittle"
:detail="modalConfirmDetail"
:ok="applyCandidate"
:cancel="cancelModalComfirm"
:cancel="cancelModalConfirm"
/>
<NotifyError
:modalError="modalNoEdit"
:modalErrorTittle="modalNoEditTittle"
:modalErrorDetail="modalNoEditDetail"
:modal="modalNoEdit"
:Tittle="modalNoEditTittle"
:Detail="modalNoEditDetail"
:close="closeModalError"
/>
</template>
@ -121,9 +121,9 @@ const tabRaw = ref<string>('profile')
const loader = ref<boolean>(false)
const statusEdit = ref<boolean>(false)
const acceptTermOfUse = ref<boolean>(false)
const modalComfirm = ref<boolean>(false)
const modalComfirmTittle = ref<string>('ยืนยันการสมัครสอบ?')
const modalComfirmDetail = ref<string>('เมื่อยืนยันการสมัครสอบแล้วจะไม่สามารถแก้ไขข้อมูลได้')
const modalConfirm = ref<boolean>(false)
const modalConfirmTittle = ref<string>('ยืนยันการสมัครสอบ?')
const modalConfirmDetail = ref<string>('เมื่อยืนยันการสมัครสอบแล้วจะไม่สามารถแก้ไขข้อมูลได้')
const modalNoEdit = ref<boolean>(false)
const modalNoEditTittle = ref<string>('ไม่สามารถเปลี่ยนแท็ปได้?')
const modalNoEditDetail = ref<string>('มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล')
@ -134,18 +134,18 @@ onMounted(async () => {
}
})
const okModalComfirm = () => {
const okModalConfirm = () => {
if (statusEdit.value == true) {
modalNoEditTittle.value = 'ไม่สามารถสมัครสอบได้?'
modalNoEditDetail.value = 'มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล'
modalNoEdit.value = true
} else {
modalComfirm.value = true
modalConfirm.value = true
}
}
const cancelModalComfirm = () => {
modalComfirm.value = false
const cancelModalConfirm = () => {
modalConfirm.value = false
}
const closeModalError = () => {

View file

@ -135,7 +135,6 @@ const getFontColor = (val: string) => {
return 'text-blue'
}
}
console.log(getFontColor)
</script>
<style lang="scss" scoped>

View file

@ -45,7 +45,7 @@
round
size="14px"
icon="mdi-trash-can-outline"
@click="clickDeleteRow(props.row)"
@click="checkDelete(props.row)"
/>
</q-td>
</q-tr>
@ -57,7 +57,7 @@
<q-dialog v-model="modal" persistent>
<q-card style="width: 600px">
<q-form ref="myForm">
<DialogHeader tittle="ประวัติการทำงาน/ฝึกงาน" :close="clickClose" />
<DialogHeader tittle="ประวัติการทำงาน/ฝึกงาน" :close="checkClose" />
<q-separator />
<q-card-section class="q-p-sm">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
@ -177,12 +177,6 @@
</q-form>
</q-card>
</q-dialog>
<notifyError
:modalError="modalError"
:modalErrorTittle="modalErrorTittle"
:modalErrorDetail="modalErrorDetail"
:close="closeModalError"
></notifyError>
</template>
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue'
@ -219,7 +213,7 @@ const props = defineProps({
const $q = useQuasar()
const mixin = useCounterMixin() //
const { dateThaiRange } = mixin
const { dateThaiRange, notifyDelete, notifyConfirm } = mixin
const store = useExamDataStore()
const { examData, changeExamColumns } = store
const loader = ref<boolean>(false)
@ -238,17 +232,8 @@ const rowIndex = ref<number>(0) //indexข้อมูลเดิมที่
const previous = ref<boolean>() //
const next = ref<boolean>() //
const editRow = ref<boolean>(false) //
const modalError = ref<boolean>(false) // modal error
const modalErrorTittle = ref<string>('') // tittle modal error
const modalErrorDetail = ref<string>('') // detail modal error
const statusCode = ref<number>()
const checkValidate = ref<boolean>(false) //validate data
const closeModalError = () => {
modalError.value = false
if (statusCode.value != 404) {
// fetchData();
}
}
const emit = defineEmits(['update:loader', 'update:statusEdit'])
@ -343,7 +328,9 @@ onMounted(async () => {
// await fetchData()
})
const fetchData = async () => {}
const fetchData = async () => {
editRow.value = false
}
/**
* กดดอมลกอนหน
@ -377,19 +364,6 @@ const clickNext = () => {
checkRowPage()
}
/**
* กดดอมลตอไป
*/
const getData = () => {
const row = rows.value[rowIndex.value]
location.value = row.location
position.value = row.position
salary.value = row.salary
duration.value = row.duration
reason.value = row.reason
id.value = row.id
}
/**
* เชคปมดอม อน อไป าตองแสดงไหม
*/
@ -421,22 +395,17 @@ const clickAdd = () => {
addRow()
}
const checkDelete = (row: RequestItemsObject) => {
rawItem.value = row
notifyDelete($q, 'ยืนยันการลบข้อมูล', 'หากต้องการลบกดให้กดตกลง', clickDeleteRow)
}
/**
* ลบขอมลใน 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)
edit.value = false
})
.onCancel(() => {})
.onDismiss(() => {})
function clickDeleteRow() {
rows.value = rows.value.filter((val: any) => val.id != rawItem.value?.id)
edit.value = false
}
/**
@ -507,28 +476,22 @@ const editData = async () => {
// });
}
const checkClose = async () => {
if (editRow.value == true) {
notifyConfirm($q, 'ข้อมูลมีการแก้ไข', 'ยืนยันการดำเนินต่อใช่หรือไม่', clickClose)
} else {
await clickClose()
}
await fetchData()
}
/**
* กดป dialog
*/
const clickClose = async () => {
if (editRow.value == true) {
$q.dialog({
title: `ข้อมูลมีการแก้ไข`,
message: `ยืนยันการบันทึกข้อมูลใช่หรือไม่?`,
cancel: 'ยกเลิก',
ok: 'ยืนยัน',
persistent: true
}).onOk(async () => {
modal.value = false
next.value = false
previous.value = false
await getData()
})
} else {
modal.value = false
next.value = false
previous.value = false
}
modal.value = false
next.value = false
previous.value = false
}
/**
@ -573,22 +536,6 @@ 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()
// }
edit.value = false
}

View file

@ -42,7 +42,7 @@
round
size="14px"
icon="mdi-trash-can-outline"
@click="clickDeleteRow(props.row)"
@click="checkDelete(props.row)"
/>
</q-td>
</q-tr>
@ -54,7 +54,7 @@
<q-dialog v-model="modal" persistent>
<q-card style="width: 600px">
<q-form ref="myForm">
<DialogHeader tittle="ประวัติการศึกษา" :close="clickClose" />
<DialogHeader tittle="ประวัติการศึกษา" :close="checkClose" />
<q-separator />
<q-card-section class="q-p-sm">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
@ -178,12 +178,6 @@
</q-form>
</q-card>
</q-dialog>
<notifyError
:modalError="modalError"
:modalErrorTittle="modalErrorTittle"
:modalErrorDetail="modalErrorDetail"
:close="closeModalError"
></notifyError>
</template>
<script setup lang="ts">
import { onMounted, ref, watch } from 'vue'
@ -221,7 +215,7 @@ const props = defineProps({
const $q = useQuasar()
const mixin = useCounterMixin() //
const { dateThaiRange } = mixin
const { dateThaiRange, notifyDelete, notifyConfirm } = mixin
const store = useExamDataStore()
const { examData, changeExamColumns } = store
const loader = ref<boolean>(false)
@ -242,17 +236,9 @@ const rowIndex = ref<number>(0) //indexข้อมูลเดิมที่
const previous = ref<boolean>() //
const next = ref<boolean>() //
const editRow = ref<boolean>(false) //
const modalError = ref<boolean>(false) // modal error
const modalErrorTittle = ref<string>('') // tittle modal error
const modalErrorDetail = ref<string>('') // detail modal error
const statusCode = ref<number>()
const checkValidate = ref<boolean>(false) //validate data
const closeModalError = () => {
modalError.value = false
if (statusCode.value != 404) {
// fetchData();
}
}
const emit = defineEmits(['update:loader', 'update:statusEdit'])
const rows = ref<RequestItemsObject[]>([
@ -367,7 +353,9 @@ const fetchQualification = async () => {
// })
}
const fetchData = async () => {}
const fetchData = async () => {
editRow.value = false
}
/**
* กดดอมลกอนหน
@ -403,20 +391,6 @@ const clickNext = () => {
checkRowPage()
}
/**
* กดดอมลตอไป
*/
const getData = () => {
const row = rows.value[rowIndex.value]
qualification.value = row.qualification
qualificationId.value = row.qualificationId
major.value = row.major
scores.value = row.scores
name.value = row.name
duration.value = row.duration
id.value = row.id
}
/**
* เชคปมดอม อน อไป าตองแสดงไหม
*/
@ -448,22 +422,17 @@ const clickAdd = () => {
addRow()
}
const checkDelete = (row: RequestItemsObject) => {
rawItem.value = row
notifyDelete($q, 'ยืนยันการลบข้อมูล', 'หากต้องการลบกดให้กดตกลง', clickDeleteRow)
}
/**
* ลบขอมลใน 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)
edit.value = false
})
.onCancel(() => {})
.onDismiss(() => {})
function clickDeleteRow() {
rows.value = rows.value.filter((val: any) => val.id != rawItem.value?.id)
edit.value = false
}
/**
@ -534,28 +503,22 @@ const editData = async () => {
// });
}
const checkClose = async () => {
if (editRow.value == true) {
notifyConfirm($q, 'ข้อมูลมีการแก้ไข', 'ยืนยันการดำเนินต่อใช่หรือไม่', clickClose)
} else {
await clickClose()
}
await fetchData()
}
/**
* กดป dialog
*/
const clickClose = async () => {
if (editRow.value == true) {
$q.dialog({
title: `ข้อมูลมีการแก้ไข`,
message: `ยืนยันการบันทึกข้อมูลใช่หรือไม่?`,
cancel: 'ยกเลิก',
ok: 'ยืนยัน',
persistent: true
}).onOk(async () => {
modal.value = false
next.value = false
previous.value = false
await getData()
})
} else {
modal.value = false
next.value = false
previous.value = false
}
modal.value = false
next.value = false
previous.value = false
}
/**
@ -602,22 +565,6 @@ 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()
// }
edit.value = false
}

View file

@ -20,9 +20,9 @@
/>
<Occupation v-model:statusEdit="statusEdit" :notiNoEdit="notiNoEdit" :step="step" />
<NotifyError
:modalError="modalNoEdit"
:modalErrorTittle="modalNoEditTittle"
:modalErrorDetail="modalNoEditDetail"
:modal="modalNoEdit"
:tittle="modalNoEditTittle"
:detail="modalNoEditDetail"
:close="closeModalError"
/>
</template>
@ -36,6 +36,8 @@ import Occupation from '@/modules/01_exam/components/Form/Profile/Occupation.vue
import NotifyError from '@/components/NotifyError.vue'
import http from '@/plugins/http'
import config from '@/app.config'
import { useQuasar } from 'quasar'
import { useCounterMixin } from '@/stores/mixin'
const props = defineProps({
loader: {
@ -53,6 +55,8 @@ const props = defineProps({
}
})
const mixin = useCounterMixin() //
const { notifyConfirm } = mixin
const loader = ref<boolean>(true)
const statusEdit = ref<boolean>(false)
const modalNoEdit = ref<boolean>(false)

View file

@ -215,6 +215,7 @@ export const useCounterMixin = defineStore('mixin', () => {
})
}
}
function notifyError(q: any, val: string) {
if (val !== '') {
q.notify({
@ -229,6 +230,48 @@ export const useCounterMixin = defineStore('mixin', () => {
}
}
function notifyDelete(q: any, title: string, message: string, ok: Function, cancel?: Function) {
q.dialog({
title: `<span class="text-red">${title}</span>`,
message: `<span class="text-red">${message}</span>`,
cancel: true,
ok: {
push: true,
color: 'negative'
},
persistent: true,
html: true
})
.onOk(() => {
ok()
})
.onCancel(() => {
if (cancel != undefined) cancel()
})
.onDismiss(() => {})
}
function notifyConfirm(q: any, title: string, message: string, ok: Function, cancel?: Function) {
q.dialog({
title: `<span class="text-primary">${title}</span>`,
message: `<span class="text-primary">${message}</span>`,
cancel: true,
ok: {
push: true,
color: 'primary'
},
persistent: true,
html: true
})
.onOk(() => {
ok()
})
.onCancel(() => {
if (cancel != undefined) cancel()
})
.onDismiss(() => {})
}
const dateText = (val: Date) => {
if (val != null) {
return date2Thai(val)
@ -343,6 +386,8 @@ export const useCounterMixin = defineStore('mixin', () => {
textToPhone,
textToFax,
dateThaiRange,
monthThaiRange
monthThaiRange,
notifyDelete,
notifyConfirm
}
})