ปรับหน้าลงเวลาเข้างาน, ออกงาน, ประวัติการลาเวลา

This commit is contained in:
Tanyalak 2023-09-26 15:57:16 +07:00
parent 421f4d5805
commit 7f0e41ff31
15 changed files with 696 additions and 191 deletions

View file

@ -0,0 +1,49 @@
/**
* Router
*/
const Main = () => import("@/modules/03_retire/views/main.vue")
const AddRetire = () => import("@/modules/03_retire/views/addRetire.vue")
const ResultQuestionair = () => import("@/modules/03_retire/views/result.vue")
export default [
{
path: "/retire",
name: "Retire",
component: Main,
meta: {
Auth: true,
Key: [7],
},
},
{
path: "/retire/add",
name: "AddRetire",
component: AddRetire,
meta: {
Auth: true,
Key: [7],
},
},
{
path: "/retire/:id",
name: "detailRetire",
component: AddRetire,
meta: {
Auth: true,
Key: [7],
},
},
{
path: "/retire/result/:id",
name: "resultRetire",
component: ResultQuestionair,
meta: {
Auth: true,
Key: [7],
},
},
]

View file

@ -0,0 +1,29 @@
import { defineStore } from "pinia";
export const useRestDataStore = defineStore("Rest", () => {
const statusText = (val: string) => {
switch (val) {
case "WAITTING":
return "รอดำเนินการ";
case "PENDING":
return "เลือกตำแหน่งแล้ว";
case "APPROVE":
return "อนุมัติ";
case "REJECT":
return "ไม่อนุมัติ";
case "DELETE":
return "ยกเลิกการลาออก";
case "REPORT":
return "ส่งรายชื่อไปออกคำสั่ง";
case "DONE":
return "ออกคำสั่งเสร็จแล้ว";
default:
return "-";
}
};
return {
statusText,
};
});

View file

@ -0,0 +1,403 @@
<script setup lang="ts">
import { ref, onMounted } from "vue"
import { useQuasar } from "quasar"
import { useRouter, useRoute } from "vue-router"
import { useCounterMixin } from "@/stores/mixin"
import http from "@/plugins/http"
import config from "@/app.config"
import type { QForm } from "quasar"
const mixin = useCounterMixin()
const { date2Thai, dateToISO, success, messageError, showLoader, hideLoader, fails } = mixin
const router = useRouter()
const route = useRoute()
const myform = ref<QForm | null>(null)
const $q = useQuasar()
const routeName = router.currentRoute.value.name
const id = ref<string>("")
const fileDocDataUpload = ref<File[]>([])
const files = ref<any>()
const tranferOrg = ref("")
const dateCommand = ref<Date>(new Date())
const dateLeave = ref<Date>(new Date())
const noteReason = ref("")
const nameFile = ref<string>("")
const dataDetail = ref<any>({
datetext: "",
activeDate: new Date(),
createdAt: new Date(),
firstName: "",
id: "",
isActive: true,
lastName: "",
location: "",
organizationPositionOld: "",
positionLevelOld: "",
positionNumberOld: "",
positionTypeOld: "",
prefix: "",
profileId: "",
reason: "",
salary: 0,
sendDate: new Date(),
status: "",
statustext: "",
fullname: "",
})
const clickBack = () => {
router.push(`/retire`)
}
const statusOrder = (val: boolean) => {
switch (val) {
case true:
return "ยับยั้งการลาออก"
case false:
return "อนุมัติการลาออก"
}
}
const filesNull = () => {
files.value = null
}
onMounted(() => {
if (route.params.id !== undefined) {
id.value = route.params.id.toString()
fectDataresign(id.value)
}
})
const saveData = async () => {
if (myform.value != null) {
await myform.value.validate().then(async (saveDataTest: Boolean) => {
if (saveDataTest) {
saveResing()
}
})
}
}
const fileUploadDoc = async (file: any) => {
fileDocDataUpload.value.push(file)
nameFile.value = file[0].name
files.value = file
}
const saveResing = () => {
$q.dialog({
title: "ยืนยันการยื่นข้อมูลลาออก",
message: "ต้องการยื่นข้อมูลลาออกนี้ใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(() => {
createFormresign()
})
.onCancel(() => {})
.onDismiss(() => {})
}
//
const cancelResing = () => {
$q.dialog({
title: "ยืนยันการยกเลิกการลาออก",
message: "ต้องการยื่นข้อมูลยกเลิกการลาออกนี้ใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(async () => {
if (route.params.id !== undefined) {
id.value = route.params.id.toString()
deleteResting(id.value)
}
})
.onCancel(() => {})
.onDismiss(() => {})
}
const deleteResting = async (id: string) => {
showLoader()
await http
.delete(config.API.resingByid(id))
.then(() => {
success($q, "ยกเลิกการลาออกขอสำเร็จ")
})
.catch(e => {
messageError($q, e)
})
.finally(() => {
hideLoader()
clickBack()
})
}
//
const createFormresign = async () => {
const formData = new FormData()
if (files.value > 0) {
const blob = files.value.slice(0, files.value[0].size)
const newFile = new File(blob, nameFile.value, {
type: files.value[0].type,
})
formData.append("file", newFile)
}
formData.append("Location", tranferOrg.value)
formData.append("SendDate", dateToISO(dateCommand.value))
formData.append("ActiveDate", dateToISO(dateLeave.value))
formData.append("Reason", noteReason.value)
await http
.post(config.API.listResign(), formData)
.then((res: any) => {
let data = res.data.result.id
success($q, "บันทึกข้อมูลสำเร็จ")
router.push(`/retire/result/${data}`)
})
.catch((e: any) => {
messageError($q, e)
})
}
const fectDataresign = async (id: string) => {
showLoader()
await http
.get(config.API.resingByid(id))
.then((res: any) => {
let data = res.data.result
;(tranferOrg.value = data.location),
(dateCommand.value = data.sendDate),
(dateLeave.value = data.activeDate),
(noteReason.value = data.reason),
(files.value = data.docs),
(dataDetail.value = data)
})
.catch((e: any) => {
messageError($q, e)
})
.finally(() => {
hideLoader()
})
}
</script>
<template>
<div class="col-12 row justify-center">
<div class="col-xs-12 col-sm-12 col-md-11">
<div class="toptitle text-white col-12 row items-center">
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.go(-1)" />
<div v-if="routeName == 'AddRetire'">เพิ่มเรื่องลาออก</div>
<div v-else>รายละเอียดเรื่องลาออก</div>
</div>
<q-form ref="myform" class="col-12">
<q-card bordered>
<div class="col-12 row q-col-gutter-md q-pa-md">
<div class="col-xs-12 col-sm-12">
<div class="col-12 row q-pa-sm q-col-gutter-sm">
<q-input
class="col-8"
dense
outlined
v-model="tranferOrg"
label="สถานที่ยื่นขอลาออกจากราชการ"
:readonly="routeName != 'AddRetire'"
:rules="[(val:string) => !!val || `${'กรุณากรอกสถานที่ยื่นขอลาออกจากราชการ'}`]"
/>
<datepicker class="col-2" menu-class-name="modalfix" v-model="dateCommand" :locale="'th'" autoApply readonly borderless :enableTimePicker="false" week-start="0">
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
readonly
dense
hide-bottom-space
class="full-width datepicker"
:model-value="dateCommand != null ? date2Thai(dateCommand) : null"
:label="`${'วันที่ยื่นขอลาออกจากราชการ'}`"
:rules="[val => !!val || `${'กรุณาเลือกวันที่ยื่นขอลาออกจากราชการ'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<datepicker
class="col-2"
menu-class-name="modalfix"
v-model="dateLeave"
:locale="'th'"
autoApply
borderless
:enableTimePicker="false"
week-start="0"
:readonly="routeName != 'AddRetire'"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
outlined
dense
hide-bottom-space
:readonly="routeName != 'AddRetire'"
class="full-width datepicker"
:model-value="dateLeave != null ? date2Thai(dateLeave) : null"
:label="`${'วันที่ขอลาออกจากราชการ'}`"
:rules="[val => !!val || `${'กรุณาเลือกวันที่ขอลาออกจากราชการ'}`]"
>
<template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon>
</template>
</q-input>
</template>
</datepicker>
<q-input
class="col-12"
dense
outlined
v-model="noteReason"
label="เหตุผลที่ลาออกจากราชการ"
type="textarea"
:readonly="routeName != 'AddRetire'"
:rules="[val => !!val || `${'กรุณากรอกเหตุผลที่ลาออกจากราชการ'}`]"
/>
<div class="col-12 row" v-if="routeName == 'AddRetire'">
<q-uploader
flat
bordered
class="col-xs-12 col-sm-12"
accept=".jpg,.png,.pdf,.csv,.doc"
url="http://localhost:4444/upload"
label="เอกสารเพิ่มเติม"
type="file"
@added="fileUploadDoc"
@removed="filesNull"
style="max-width: px"
/>
</div>
<div class="col-12 row" v-if="routeName != 'AddRetire'">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">เอกสารเพมเต</div>
</div>
<q-card bordered flat class="full-width">
<q-list separator>
<q-item v-for="file in files" :key="file.key" class="q-my-xs">
<q-item-section>
<q-item-label class="full-width ellipsis">
{{ file.fileName }}
</q-item-label>
<q-item-label caption> </q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-card>
</div>
</div>
<q-card bordered class="row col-12 text-dark q-mt-sm" v-if="routeName != 'AddRetire'">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">ผลการพจารณาของผงคบบญชา</div>
</div>
<q-separator />
<div class="row col-12 q-pa-md">
<div class="col-12 row bg-white q-col-gutter-md">
<div class="col-xs-6 row items-start">
<div class="col-12 text-top">สถานะ</div>
<div class="col-12 text-detail">
{{ dataDetail.commanderReject !== null ? statusOrder(dataDetail.commanderReject) : "-" }}
</div>
</div>
<div class="col-xs-6 row items-start">
<div class="col-12 text-top">นสดทายทบย</div>
<div class="col-12 text-detail">
{{ dataDetail.commanderRejectDate !== null ? date2Thai(dataDetail.commanderRejectDate) : "-" }}
</div>
</div>
<div class="col-xs-12 row items-start">
<div class="col-12 text-top">ความคดเหนและเหตผล</div>
<div class="col-12 text-detail" v-if="dataDetail.commanderReject === false">
{{ dataDetail.commanderApproveReason !== null ? dataDetail.commanderApproveReason : "-" }}
</div>
<div class="col-12 text-detail" v-if="dataDetail.commanderReject === true">
{{ dataDetail.commanderRejectReason !== null ? dataDetail.commanderRejectReason : "-" }}
</div>
</div>
</div>
</div>
</q-card>
<q-card bordered class="row col-12 text-dark q-mt-sm" v-if="routeName != 'AddRetire'">
<div class="bg-grey-1 q-pa-sm col-12 row items-center text-primary">
<div class="q-pl-sm text-weight-bold text-dark">ผลการพจารณาของผอำนาจ</div>
</div>
<q-separator />
<div class="row col-12 q-pa-md">
<div class="col-12 row bg-white q-col-gutter-md">
<div class="col-xs-6 row items-start">
<div class="col-12 text-top">สถานะ</div>
<div class="col-12 text-detail">
{{ dataDetail.oligarchReject !== null ? statusOrder(dataDetail.oligarchReject) : "-" }}
</div>
</div>
<div class="col-xs-6 row items-start">
<div class="col-12 text-top">นสดทายทบย</div>
<div class="col-12 text-detail">
{{ dataDetail.oligarchRejectDate !== null ? date2Thai(dataDetail.oligarchRejectDate) : "-" }}
</div>
</div>
<div class="col-xs-12 row items-start">
<div class="col-12 text-top">ความคดเหนและเหตผล</div>
<div class="col-12 text-detail" v-if="dataDetail.oligarchReject == false">
{{ dataDetail.oligarchApproveReason !== null ? dataDetail.oligarchApproveReason : "-" }}
</div>
<div class="col-12 text-detail" v-else-if="dataDetail.oligarchReject == true">
{{ dataDetail.oligarchRejectReason !== null ? dataDetail.oligarchRejectReason : "-" }}
</div>
</div>
</div>
</div>
</q-card>
</div>
<div class="row col-12 q-pa-md" v-if="routeName != 'AddRetire'">
<q-space />
<q-btn
v-if="dataDetail.status !== 'DELETE' && dataDetail.status !== 'DONE'"
unelevated
dense
class="q-px-md items-center"
color="orange"
label="ยกเลิกการลาออก"
@click="cancelResing"
:disable="tranferOrg == '' && noteReason == ''"
/>
</div>
</div>
<q-separator v-if="routeName == 'AddRetire'" />
<div class="row col-12 q-pa-md" v-if="routeName == 'AddRetire'">
<q-space />
<q-btn unelevated dense class="q-px-md items-center" color="primary" label="ยื่นเรื่องขอลาออก" @click="saveData" :disable="tranferOrg == '' && noteReason == ''" />
</div>
</q-card>
</q-form>
</div>
</div>
</template>

View file

@ -0,0 +1,156 @@
<script setup lang="ts">
import type { QTableProps } from "quasar"
import { ref, onMounted } from "vue"
import { useQuasar } from "quasar"
import { useRouter } from "vue-router"
import { useCounterMixin } from "@/stores/mixin"
import http from "@/plugins/http"
import config from "@/app.config"
import { useRestDataStore } from "@/modules/03_retire/store"
import Table from "@/components/Table.vue"
const RestData = useRestDataStore()
const { statusText } = RestData
const router = useRouter()
const $q = useQuasar()
const mixin = useCounterMixin()
const { date2Thai, messageError, showLoader, hideLoader } = mixin
const filter = ref<string>("")
const visibleColumns = ref<String[]>(["no", "placeLeave", "dateStartLeave", "dateLeave", "statustext"])
const columns = ref<QTableProps["columns"]>([
{
name: "no",
align: "left",
label: "ลำดับ",
sortable: true,
field: "no",
headerStyle: "font-size: 14px",
style: "font-size: 14px; width:5%;",
},
{
name: "placeLeave",
align: "left",
label: "สถานที่ยื่นขอลาออกจากราชการ",
sortable: true,
field: "placeLeave",
headerStyle: "font-size: 14px",
style: "font-size: 14px; width:15%;",
},
{
name: "dateStartLeave",
align: "left",
label: "วันที่ยื่นขอลาออกจากราชการ",
sortable: true,
field: "dateStartLeave",
headerStyle: "font-size: 14px",
style: "font-size: 14px; width:15%;",
},
{
name: "dateLeave",
align: "left",
label: "วันที่ขอลาออกจากราชการ",
sortable: true,
field: "dateLeave",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "statustext",
align: "left",
label: "สถานะ",
sortable: true,
field: "statustext",
headerStyle: "font-size: 14px",
style: "font-size: 14px; width:10%;",
},
])
const rows = ref<any>([])
const initialPagination = ref({
rowsPerPage: 0,
})
onMounted(() => {
fectListleave()
})
//
const fectListleave = async () => {
showLoader()
await http
.get(config.API.listUser())
.then((res: any) => {
let data = res.data.result
rows.value = data.map((e: any) => ({
id: e.id,
placeLeave: e.location,
dateStartLeave: date2Thai(e.sendDate),
dateLeave: date2Thai(e.activeDate),
status: e.status,
statustext: statusText(e.status),
}))
})
.catch((e: any) => {
messageError($q, e)
})
.finally(() => {
hideLoader()
})
}
const clickAdd = async () => {
router.push(`/retire/add`)
}
const clickBack = () => {
router.push(`/`)
}
</script>
<template>
<div class="col-12 row justify-center">
<div class="col-xs-12 col-sm-12 col-md-11">
<div class="toptitle text-white col-12 row items-center">
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="clickBack" />
ลาออก
</div>
<div class="col-12">
<q-card bordered class="q-pa-md">
<Table
style="max-height: 80vh"
:rows="rows"
:columns="columns"
:filter="filter"
:visible-columns="visibleColumns"
v-model:inputfilter="filter"
v-model:inputvisible="visibleColumns"
:pagination="initialPagination"
:inputShow="false"
:add="clickAdd"
:titleText="''"
>
<template #columns="props">
<q-tr :props="props" class="cursor-pointer" @click="router.push(`/retire/` + props.row.id)">
<q-td key="no" :props="props">
{{ props.rowIndex + 1 }}
</q-td>
<q-td key="placeLeave" :props="props">
{{ props.row.placeLeave }}
</q-td>
<q-td key="dateStartLeave" :props="props">
{{ props.row.dateStartLeave }}
</q-td>
<q-td key="dateStartLeave" :props="props">
{{ props.row.dateStartLeave }}
</q-td>
<q-td key="statustext" :props="props">
{{ props.row.statustext }}
</q-td>
</q-tr>
</template>
</Table>
</q-card>
</div>
</div>
</div>
</template>
<style></style>

View file

@ -0,0 +1,339 @@
<script setup lang="ts">
import { ref } from "vue"
import { useQuasar } from "quasar"
import { useRouter, useRoute } from "vue-router"
import { useCounterMixin } from "@/stores/mixin"
import http from "@/plugins/http"
import config from "@/app.config"
const route = useRoute()
const router = useRouter()
const $q = useQuasar()
const mixin = useCounterMixin()
const { success, messageError, notifyError } = mixin
const dataId = ref<any>(route.params.id.toString())
const exitFactor = ref<any>([])
const reasonWork = ref<any>([])
const adjust = ref<any>([])
const timeThink = ref<any>()
const realReason = ref<any>("")
const notExitFactor = ref<any>("")
const haveJob = ref<any>()
const suggestFriends = ref<any>()
const futureWork = ref<any>()
const suggestion = ref<any>("")
const reasonWorkOther = ref("")
const reasonWork_option = ref<any>([
{ label: "ความมั่นคงในการทำงาน ", value: 0 },
{ label: "สิทธิประโยชน์/สวัสดิการ", value: 1 },
{ label: "อัตราเงินเดือน ", value: 2 },
{ label: "ลักษณะงาน ", value: 3 },
{ label: "วัฒนธรรมการทำงานของข้าราชการ ", value: 4 },
{ label: "นโยบายของหน่วยงาน ", value: 5 },
{ label: "ระบบการทำงาน", value: 6 },
{ label: "สมดุลชีวิตการทำงาน ", value: 7 },
{ label: "บรรยากาศในการทำงาน ", value: 8 },
{ label: "การพัฒนาในสายอาชีพ ", value: 9 },
{ label: "โอกาสความก้าวหน้า ", value: 10 },
{ label: "การได้รับการยอมรับจากสังคม ", value: 11 },
{ label: "อื่น ๆ (ระบุ) ", value: 12 },
])
const exitFactorOther = ref("")
const exitFactor_option = ref<any>([
{ label: "อัตราเงินเดือน ", value: 0 },
{ label: "สวัสดิการ", value: 1 },
{ label: "ลักษณะงาน ", value: 2 },
{ label: "ระบบการทำงาน ", value: 3 },
{ label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
{ label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
{ label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
{ label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
{ label: "ระบบบริหารงานภายในหน่วยงาน ", value: 8 },
{ label: "บรรยากาศในการทำงาน ", value: 9 },
{ label: "การปฏิบัติอย่างเป็นธรรม ", value: 10 },
{ label: "การยอมรับความแตกต่างหลากหลาย ", value: 11 },
{ label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน ", value: 12 },
{ label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
{ label: "โอกาสความก้าวหน้า ", value: 14 },
{ label: "อื่น ๆ (ระบุ) ", value: 15 },
])
const suggestFriendsReason = ref("")
const suggestFriends_option = ref<any>([
{ label: "แนะนำ ", value: 0 },
{ label: "ไม่แนะนำ (ระบุ)", value: 1 },
])
const timeThink_option = ref<any>([
{ label: "น้อยกว่า 2 สัปดาห์ ", value: 0 },
{ label: "1 เดือน - 3 เดือน", value: 1 },
{ label: "3 เดือน - 6 เดือน ", value: 2 },
{ label: "6 เดือนขึ้นไป ", value: 3 },
])
const haveJobReason = ref<any>("")
const haveJob_option = ref<any>([
{ label: "มี (ระบุ)", value: 0 },
{ label: "ไม่มี", value: 1 },
])
const futureWorkReason = ref<any>("")
const futureWork_option = ref<any>([
{ label: "อยาก ", value: 0 },
{ label: "ไม่อยาก (ระบุ)", value: 1 },
])
const adjustOther = ref("")
const adjust_option = ref<any>([
{ label: "อัตราเงินเดือน ", value: 0 },
{ label: "สวัสดิการ", value: 1 },
{ label: "ลักษณะงาน ", value: 2 },
{ label: "ระบบการทำงาน ", value: 3 },
{ label: "ระบบสนับสนุนการปฏิบัติงาน ", value: 4 },
{ label: "การมอบหมายงานที่ชัดเจนและเหมาะสม ", value: 5 },
{ label: "การบริหารงานของผู้บังคับบัญชา", value: 6 },
{ label: "การทำงานเป็นทีมกับเพื่อนร่วมงาน ", value: 7 },
{ label: "ระบบบริหารงานภายในหน่วยงาน ", value: 8 },
{ label: "บรรยากาศในการทำงาน ", value: 9 },
{ label: "การปฏิบัติอย่างเป็นธรรม ", value: 10 },
{ label: "การยอมรับความแตกต่างหลากหลาย ", value: 11 },
{ label: "การดูแลและให้ความช่วยเหลือในช่วงเริ่มต้นปฏิบัติงาน ", value: 12 },
{ label: "การพัฒนาอย่างเป็นระบบและต่อเนื่อง ", value: 13 },
{ label: "โอกาสความก้าวหน้า ", value: 14 },
{ label: "อื่น ๆ (ระบุ) ", value: 15 },
])
//
const saveForm = () => {
let hasError = false
if (
reasonWork.value.length === 0 ||
(reasonWork.value.filter((x: any) => x == 12).length > 0 && (reasonWorkOther.value == null || reasonWorkOther.value == "")) ||
timeThink.value.length === 0 ||
exitFactor.value.length === 0 ||
(exitFactor.value.filter((x: any) => x == 15).length > 0 && (exitFactorOther.value == null || exitFactorOther.value == "")) ||
adjust.value.length === 0 ||
(adjust.value.filter((x: any) => x == 15).length > 0 && (adjustOther.value == null || adjustOther.value == "")) ||
realReason.value.length < 1 ||
notExitFactor.value.length < 1 ||
haveJob.value.length === 0 ||
(haveJob.value === 0 && (haveJobReason.value == null || haveJobReason.value == "")) ||
suggestFriends.value.length === 0 ||
(suggestFriends.value === 1 && (suggestFriendsReason.value == null || suggestFriendsReason.value == "")) ||
futureWork.value.length === 0 ||
(futureWork.value === 1 && (futureWorkReason.value == null || futureWorkReason.value == "")) ||
suggestion.value.length < 1
) {
hasError = true
} else {
$q.dialog({
title: "ยืนยันข้อมูลแบบสอบถาม",
message: "ต้องการส่งข้อมูลแบบสอบถามนี้ใช่หรือไม่?",
cancel: {
flat: true,
color: "negative",
},
persistent: true,
})
.onOk(async () => {
createResult()
})
.onCancel(() => {})
.onDismiss(() => {})
}
if (hasError === true) {
notifyError($q, "กรุณากรอกข้อมูลให้ครบ")
}
}
const createResult = async () => {
const data = {
RetirementResignId: dataId.value,
ReasonWork: reasonWork.value,
ReasonWorkOther: reasonWorkOther.value,
TimeThink: timeThink.value,
ExitFactor: exitFactor.value,
ExitFactorOther: exitFactorOther.value,
Adjust: adjust.value,
AdjustOther: adjustOther.value,
RealReason: realReason.value,
NotExitFactor: notExitFactor.value,
Havejob: haveJob.value,
HavejobReason: haveJobReason.value,
SuggestFriends: suggestFriends.value,
SuggestFriendsReason: suggestFriendsReason.value,
FutureWork: futureWork.value,
FutureWorkReason: futureWorkReason.value,
Suggestion: suggestion.value,
}
await http
.post(config.API.listquestionnaire(), data)
.then((res: any) => {
success($q, "บันทึกข้อมูลสำเร็จ")
router.push(`/retire`)
})
.catch((e: any) => {
messageError($q, e)
})
}
</script>
<template>
<div class="col-12 row justify-center">
<div class="col-xs-12 col-sm-12 col-md-11">
<div class="toptitle text-white col-12 row items-center">
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm" @click="router.push(`/retire`)" />
</div>
<div class="col-12">
<q-card bordered>
<div class="col-12 row q-col-gutter-md q-pa-md">
<div class="col-xs-12 col-sm-12">
<q-card bordered flat>
<div class="q-pa-xs bg-white-2 row items-center q-py-sm q-px-md justify-center text-bold">เราไดบแบบฟอรมของคณแล กรณาตอบแบบสอบถาม</div>
<div class="q-pa-xs bg-grey-2 row items-center q-py-sm q-px-md justify-center text-bold">แบบสอบถาม</div>
<q-separator />
<div class="col-12 row q-pa-sm q-col-gutter-sm">
<div class="col-12 text-top0 items-center">1. เหตใดทานจงตดสนใจรวมงานกบกรงเทพมหานคร (เลอกไดมากกว 1 )</div>
<q-option-group :options="reasonWork_option" type="checkbox" v-model="reasonWork" />
<div class="col-12 text-top0 items-center">
<q-item-label>
<q-input
v-if="reasonWork.includes(12)"
v-model="reasonWorkOther"
label="กรอกอื่นๆ"
dense
lazy-rules
type="text"
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[val => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
/>
</q-item-label>
</div>
<div class="col-12 text-top0 items-center">2. สำหรบการลาออกในครงน านไดดทบทวนอยางจรงจงเปนระยะเวลานานเทาใด</div>
<q-option-group :options="timeThink_option" type="radio" v-model="timeThink" />
<div class="col-12 text-top0 items-center">3. จจยใดททำใหานตดสนใจลาออกจากราชการ (เลอกไดมากกว 1 )</div>
<q-option-group :options="exitFactor_option" type="checkbox" v-model="exitFactor" />
<div class="col-12 text-top0 items-center">
<q-item-label>
<q-input
v-if="exitFactor.includes(15)"
v-model="exitFactorOther"
label="กรอกอื่นๆ"
dense
lazy-rules
type="text"
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[val => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
/>
</q-item-label>
</div>
<div class="col-12 text-top0 items-center">4. อะไรคอสงทานเหนวาควรปรบปร (เลอกไดมากกว 1 )</div>
<q-list>
<q-option-group :options="adjust_option" type="checkbox" v-model="adjust" />
</q-list>
<div class="col-12 text-top0 items-center">
<q-item-label>
<q-input
v-if="adjust.includes(15)"
v-model="adjustOther"
label="กรอกอื่นๆ"
dense
lazy-rules
type="text"
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[val => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
/>
</q-item-label>
</div>
<div class="col-12 text-top0 items-center">5. โปรดระบสาเหตแทจร ทำใหานตดสนใจลาออกจากการปฏราชการกบกรงเทพมหานคร ?</div>
<q-input class="col-12" dense outlined v-model="realReason" label=" " type="textarea" />
<div class="col-12 text-top0 items-center">6. จจยใดทจะชวยทำใหานเปลยนใจ ไมอยากลาออกจากการปฏราชการกบกรงเทพมหานคร</div>
<q-input class="col-12" dense outlined v-model="notExitFactor" label=" " type="textarea" />
<div class="col-12 text-top0 items-center">
7. านมงานใหมหรอไม าม (โปรดระบ อบรทเอกชน/หนวยงานภาคร) และอะไรคอสงททำงานใหมใหบทาน
งทานรกวาเปนทาพอใจมากกวาการปฏราชการกบกรงเทพมหานคร
</div>
<q-option-group :options="haveJob_option" type="radio" v-model="haveJob" />
<div class="col-12 text-top0 items-center">
<q-item-label>
<q-input
v-if="haveJob === 0"
v-model="haveJobReason"
label="กรอกข้อความ"
dense
lazy-rules
type="text"
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[val => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
/>
</q-item-label>
</div>
<div class="col-12 text-top0 items-center">8. านจะแนะนำเพอนใหมารวมงานกบกรงเทพมหานครหรอไม (าไม โปรดระบเหตผล)</div>
<q-option-group :options="suggestFriends_option" type="radio" v-model="suggestFriends" />
<div class="col-12 text-top0 items-center">
<q-item-label>
<q-input
v-if="suggestFriends === 1"
v-model="suggestFriendsReason"
label="กรอกข้อความ"
dense
lazy-rules
type="text"
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[val => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
/>
</q-item-label>
</div>
<div class="col-12 text-top0 items-center">9. หากทานมโอกาสในอนาคต านอยากกลบมารวมงานกบกรงเทพมหานครหรอไม (าไม โปรดระบเหตผล)</div>
<q-option-group :options="futureWork_option" type="radio" v-model="futureWork" />
<div class="col-12 text-top0 items-center">
<q-item-label>
<q-input
v-if="futureWork === 1"
v-model="futureWorkReason"
label="กรอกข้อความ"
dense
lazy-rules
type="text"
autogrow
hide-bottom-space
outlined
class="bg-white"
:rules="[val => (val && val.length > 0) || 'กรุณากรอกข้อความ']"
/>
</q-item-label>
</div>
<div class="col-12 text-top0 items-center">10. ความคดเหนและขอเสนอแนะอ </div>
<q-input class="col-12" dense outlined v-model="suggestion" label=" " type="textarea" />
<q-separator />
</div>
</q-card>
</div>
</div>
<div class="row col-12 q-pa-sm">
<q-space />
<q-btn unelevated dense class="q-px-md items-center" color="primary" label="บันทึกข้อมูลแบบสอบถาม" @click="saveForm" />
</div>
</q-card>
</div>
</div>
</div>
</template>