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

update workflow

Browse source
This commit is contained in:
DESKTOP-1R2VSQH\Lenovo ThinkPad E490 2024-10-17 18:06:31 +07:00
parent 5d9131d5b7
commit b4c7ee8129
5 changed files with 1266 additions and 1197 deletions
Download patch file Download diff file Expand all files Collapse all files

1464
src/modules/06_retirement/components/resign/ResignByid.vue
View file

File diff suppressed because it is too large Load diff

506
src/modules/09_leave/components/2_Leave/DetailLeave.vue
View file

@ -28,6 +28,7 @@ import FormLeaveToTraining from "@/modules/09_leave/components/2_Leave/formDetai
import FormLeaveToWorkInternational from "@/modules/09_leave/components/2_Leave/formDetail/formLeaveToWorkInternational.vue"; // ลาไปปฏิบัติงานในองค์การระหว่างประเทศ import FormLeaveToWorkInternational from "@/modules/09_leave/components/2_Leave/formDetail/formLeaveToWorkInternational.vue"; // ลาไปปฏิบัติงานในองค์การระหว่างประเทศ
import FormSpouse from "@/modules/09_leave/components/2_Leave/formDetail/formSpouse.vue"; // ลาติดตามคู่สมรส import FormSpouse from "@/modules/09_leave/components/2_Leave/formDetail/formSpouse.vue"; // ลาติดตามคู่สมรส
import FormVocationalRehabilitation from "@/modules/09_leave/components/2_Leave/formDetail/formVocationalRehabilitation.vue"; //ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ import FormVocationalRehabilitation from "@/modules/09_leave/components/2_Leave/formDetail/formVocationalRehabilitation.vue"; //ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ
import WorkFlow from "@/components/Workflow/Main.vue";
/** use */ /** use */
const $q = useQuasar(); const $q = useQuasar();
@ -131,8 +132,7 @@ async function fetchDetailLeave(paramsId: string) {
await http await http
.get(config.API.leaveListById(paramsId)) .get(config.API.leaveListById(paramsId))
.then(async (res) => { .then(async (res) => {
const data = res.data.result; const data = await res.data.result;
formData.id = data.id; formData.id = data.id;
formData.reasonCommander = data.reasonCommander formData.reasonCommander = data.reasonCommander
? data.reasonCommander ? data.reasonCommander
@ -350,16 +350,18 @@ function sendToCommand() {
dialogConfirm( dialogConfirm(
$q, $q,
async () => { async () => {
showLoader();
await http await http
.get(config.API.leaveApproveToComander(formData.id)) .get(config.API.leaveApproveToComander(formData.id))
.then(() => { .then(async () => {
await fetchDetailLeave(paramsId);
success($q, "บันทึกข้อมูลสำเร็จ"); success($q, "บันทึกข้อมูลสำเร็จ");
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
}) })
.finally(async () => { .finally(async () => {
await fetchDetailLeave(paramsId); hideLoader();
}); });
}, },
"ยืนยันการส่งไปผู้บังคับบัญชา", "ยืนยันการส่งไปผู้บังคับบัญชา",
@ -377,17 +379,19 @@ function clickSave(reason: string) {
dialogConfirm( dialogConfirm(
$q, $q,
async () => { async () => {
showLoader();
await http await http
.put(config.API.leaveApprove(formData.id), body) .put(config.API.leaveApprove(formData.id), body)
.then(() => { .then(async () => {
await fetchDetailLeave(paramsId);
success($q, "บันทึกข้อมูลสำเร็จ"); success($q, "บันทึกข้อมูลสำเร็จ");
modalApprove.value = false;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
}) })
.finally(async () => { .finally(async () => {
await fetchDetailLeave(paramsId); hideLoader();
modalApprove.value = false;
}); });
}, },
"ยืนยันอนุมัติ", "ยืนยันอนุมัติ",
@ -399,17 +403,19 @@ function clickSave(reason: string) {
dialogConfirm( dialogConfirm(
$q, $q,
async () => { async () => {
showLoader();
await http await http
.put(config.API.leaveReject(formData.id), body) .put(config.API.leaveReject(formData.id), body)
.then(() => { .then(async () => {
await fetchDetailLeave(paramsId);
success($q, "บันทึกข้อมูลสำเร็จ"); success($q, "บันทึกข้อมูลสำเร็จ");
modalApprove.value = false;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
}) })
.finally(async () => { .finally(async () => {
await fetchDetailLeave(paramsId); hideLoader();
modalApprove.value = false;
}); });
}, },
"ยืนยันไม่อนุมัติ", "ยืนยันไม่อนุมัติ",
@ -420,17 +426,19 @@ function clickSave(reason: string) {
dialogConfirm( dialogConfirm(
$q, $q,
async () => { async () => {
showLoader();
await http await http
.put(config.API.leaveComanderApprove(formData.id), body) .put(config.API.leaveComanderApprove(formData.id), body)
.then(() => { .then(async () => {
await fetchDetailLeave(paramsId);
success($q, "บันทึกข้อมูลสำเร็จ"); success($q, "บันทึกข้อมูลสำเร็จ");
modalApprove.value = false;
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
}) })
.finally(async () => { .finally(async () => {
await fetchDetailLeave(paramsId); hideLoader();
modalApprove.value = false;
}); });
}, },
"ยืนยันการส่งไปยังผู้มีอำนาจ", "ยืนยันการส่งไปยังผู้มีอำนาจ",
@ -460,12 +468,12 @@ function formattedNumber(x: number) {
} }
onMounted(async () => { onMounted(async () => {
// showLoader();
if (paramsId) { if (paramsId) {
await fetchDetailLeave(paramsId); await fetchDetailLeave(paramsId);
} }
}); });
</script> </script>
<template> <template>
<div class="toptitle text-dark col-12 row items-center"> <div class="toptitle text-dark col-12 row items-center">
<div class="row col-12 q-col-gutter-sm q-mb-sm"> <div class="row col-12 q-col-gutter-sm q-mb-sm">
@ -480,7 +488,7 @@ onMounted(async () => {
class="q-mr-sm" class="q-mr-sm"
@click="router.push(`/leave`)" @click="router.push(`/leave`)"
/> />
รายละเอียดการลาของ {{ formData.fullName }} รายละเอียดการลาของ{{ formData.fullName }}
</div> </div>
<div> <div>
<q-btn class="q-mr-sm" icon="mdi-download" round color="primary" flat> <q-btn class="q-mr-sm" icon="mdi-download" round color="primary" flat>
@ -534,269 +542,291 @@ onMounted(async () => {
<q-space /> <q-space />
</div> </div>
</div> </div>
<q-card flat bordered class="col-12 q-mt-sm">
<div class="col-12 row q-py-md q-pl-md"> <div class="q-pa-sm">
<div class="col-12 q-col-gutter-md"> <q-card flat bordered class="col-12 q-mt-sm">
<div class="row col-12"> <div class="col-12 row q-py-md q-pl-md">
<q-card bordered class="bg-grey-1 q-pa-md col-12"> <div class="col-12 q-col-gutter-md">
<div class="row q-col-gutter-md col-12"> <!-- ประเภทการลา -->
<div class="col-xs-12 col-sm-5 row items-center q-my-xs"> <div class="row col-12">
<div class="col-12 row"> <q-card bordered class="bg-grey-1 q-pa-md col-12">
<div class="col-xs-5 col-sm-3 text-grey-8">ประเภทการลา</div> <div class="row q-col-gutter-md col-12">
<div class="col text-primary"> <div class="col-xs-12 col-sm-5 row items-center q-my-xs">
{{ <div class="col-12 row">
checkForm !== "FormUpasom" && checkForm !== "FormHajj" <div class="col-xs-5 col-sm-3 text-grey-8">ประเภทการลา</div>
? formData.leaveTypeName <div class="col text-primary">
: formData.hajjDayStatus {{
? "ลาประกอบพิธีฮัจญ์" checkForm !== "FormUpasom" && checkForm !== "FormHajj"
: "ลาอุปสมบท" ? formData.leaveTypeName
}} : formData.hajjDayStatus
? "ลาประกอบพิธีฮัจญ์"
: "ลาอุปสมบท"
}}
</div>
</div>
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">
ชื่อ - นามสกุล
</div>
<div class="col text-weight-medium">
{{ formData.fullName }}
</div>
</div> </div>
</div> </div>
<div class="col-12 row"> <div class="col-xs-12 col-sm-7 row">
<div class="col-xs-5 col-sm-3 text-grey-8"> <div class="row col-12 q-gutter-md">
ชื่อ - นามสกุล <div
</div> v-if="formData.leaveTypeName == 'ลาพักผ่อน'"
<div class="col text-weight-medium"> class="col-3"
{{ formData.fullName }} >
</div> <q-card bordered class="items-center row col-12 q-pa-md">
</div> <div class="text-h6 text-weight-bold text-blue-10">
</div> {{ formData.leaveLimit }}
<div class="col-xs-12 col-sm-7 row"> </div>
<div class="row col-12 q-gutter-md"> <div class="col-12 text-subtitle2 text-weight-regular">
<div <span class="gt-xs">ได้รับ</span>
v-if="formData.leaveTypeName == 'ลาพักผ่อน'" </div>
class="col-3" </q-card>
> </div>
<q-card bordered class="items-center row col-12 q-pa-md"> <div class="col-3">
<div class="text-h6 text-weight-bold text-blue-10"> <q-card bordered class="items-center row col-12 q-pa-md">
{{ formData.leaveLimit }} <div class="text-h6 text-weight-bold text-light-blue-6">
</div> {{ formData.leaveSummary }}
<div class="col-12 text-subtitle2 text-weight-regular"> </div>
<span class="gt-xs">ได้รับ</span> <div class="col-12 text-subtitle2 text-weight-regular">
</div> <span class="gt-xs">ใช้ไป</span>
</q-card> </div>
</div> </q-card>
<div class="col-3"> </div>
<q-card bordered class="items-center row col-12 q-pa-md"> <div
<div class="text-h6 text-weight-bold text-light-blue-6"> v-if="formData.leaveTypeName == 'ลาพักผ่อน'"
{{ formData.leaveSummary }} class="col-3"
</div> >
<div class="col-12 text-subtitle2 text-weight-regular"> <q-card bordered class="items-center row col-12 q-pa-md">
<span class="gt-xs">ใช้ไป</span> <div class="text-h6 text-weight-bold text-indigo-7">
</div> {{ formData.leaveRemain }}
</q-card> </div>
</div> <div class="col-12 text-subtitle2 text-weight-regular">
<div <span class="gt-xs">คงเหลือ</span>
v-if="formData.leaveTypeName == 'ลาพักผ่อน'" </div>
class="col-3" </q-card>
> </div>
<q-card bordered class="items-center row col-12 q-pa-md">
<div class="text-h6 text-weight-bold text-indigo-7">
{{ formData.leaveRemain }}
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
<span class="gt-xs">คงเหลือ</span>
</div>
</q-card>
</div> </div>
</div> </div>
</div> </div>
</q-card>
</div>
<!-- ข้อมูลการลา -->
<div class="row q-col-gutter-md col-12">
<!-- ข้อมูลซ้าย -->
<div class="col-xs-12 col-sm-5 row">
<!-- card ซ้าย -->
<q-card flat bordered class="col-12">
<FormMain :data="formData" :checkForm="checkForm" />
</q-card>
</div> </div>
</q-card> <!-- ข้อมูลขวา -->
</div> <div class="col-xs-12 col-sm-7 row">
<div class="row q-col-gutter-md col-12"> <q-card flat bordered class="col-12">
<div class="col-xs-12 col-sm-5 row"> <!-- ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว -->
<!-- card ซ้าย --> <FormLeave v-if="checkForm === 'FormLeave'" :data="formData" />
<q-card flat bordered class="col-12">
<FormMain :data="formData" :checkForm="checkForm" />
</q-card>
</div>
<div class="col-xs-12 col-sm-7 row">
<q-card flat bordered class="col-12">
<!-- ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว -->
<FormLeave v-if="checkForm === 'FormLeave'" :data="formData" />
<!-- ลาไปช่วยเหลือภริยาที่คลอดบุตร --> <!-- ลาไปช่วยเหลือภริยาที่คลอดบุตร -->
<FormChildbirth <FormChildbirth
v-else-if="checkForm === 'FormChildbirth'" v-else-if="checkForm === 'FormChildbirth'"
:data="formData" :data="formData"
/> />
<!-- ลาพักผ่อน --> <!-- ลาพักผ่อน -->
<FormHoliday <FormHoliday
v-else-if="checkForm === 'FormHoliday'" v-else-if="checkForm === 'FormHoliday'"
:data="formData" :data="formData"
/> />
<!-- ลาอุปสมบท --> <!-- ลาอุปสมบท -->
<FormUpasom <FormUpasom
v-else-if="checkForm === 'FormUpasom'" v-else-if="checkForm === 'FormUpasom'"
:data="formData" :data="formData"
/> />
<!-- ลาประกอบพิธีฮัจญ์ --> <!-- ลาประกอบพิธีฮัจญ์ -->
<FormHajj v-else-if="checkForm === 'FormHajj'" :data="formData" /> <FormHajj
v-else-if="checkForm === 'FormHajj'"
:data="formData"
/>
<!-- ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล --> <!-- ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล -->
<FormCheckSelect <FormCheckSelect
v-else-if="checkForm === 'FormCheckSelect'" v-else-if="checkForm === 'FormCheckSelect'"
:data="formData" :data="formData"
/> />
<!-- ลาไปศึกษา --> <!-- ลาไปศึกษา -->
<FormStudy <FormStudy
v-else-if="checkForm === 'FormStudy'" v-else-if="checkForm === 'FormStudy'"
:data="formData" :data="formData"
/> />
<!-- ลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน --> <!-- ลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน -->
<FormLeaveToTraining <FormLeaveToTraining
v-else-if="checkForm === 'FormLeaveToTraining'" v-else-if="checkForm === 'FormLeaveToTraining'"
:data="formData" :data="formData"
/> />
<!-- ลาไปปฏิบัติงานในองค์การระหว่างประเทศ --> <!-- ลาไปปฏิบัติงานในองค์การระหว่างประเทศ -->
<FormLeaveToWorkInternational <FormLeaveToWorkInternational
v-else-if="checkForm === 'FormLeaveToWorkInternational'" v-else-if="checkForm === 'FormLeaveToWorkInternational'"
:data="formData" :data="formData"
/> />
<!-- ลาติดตามคู่สมรส --> <!-- ลาติดตามคู่สมรส -->
<FormSpouse <FormSpouse
v-else-if="checkForm === 'FormSpouse'" v-else-if="checkForm === 'FormSpouse'"
:data="formData" :data="formData"
/> />
<!-- ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ --> <!-- ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ -->
<FormVocationalRehabilitation <FormVocationalRehabilitation
v-else-if="checkForm === 'FormVocationalRehabilitation'" v-else-if="checkForm === 'FormVocationalRehabilitation'"
:data="formData" :data="formData"
/> />
</q-card> </q-card>
</div> </div>
<div class="col-xs-12 col-sm-12 row">
<q-card <!-- ความคิดเห็นของผู้บังคับบัญชา -->
bordered <div
class="row col-12 text-dark q-mt-sm" class="col-xs-12 col-sm-12 row"
v-if=" v-if="
formData.approveStep === 'st3' || formData.approveStep === 'st3' ||
formData.approveStep === 'st4' || formData.approveStep === 'st4' ||
formData.approveStep === 'st5' formData.approveStep === 'st5'
" "
> >
<div <q-card bordered class="row col-12 text-dark q-mt-sm">
class="bg-grey-1 q-pa-sm col-12 row items-center text-primary" <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 class="q-pl-sm text-weight-bold text-dark">
ความคิดเห็นของผู้บังคับบัญชา
</div>
</div> </div>
</div> <q-separator />
<q-separator /> <div class="row col-12 q-pa-md">
<div class="row col-12 q-pa-md"> <div class="col-12 row bg-white q-col-gutter-md">
<div class="col-12 row bg-white q-col-gutter-md"> <div class="col-xs-6 row items-start">
<div class="col-xs-6 row items-start"> <div class="col-12 text-detail">
<div class="col-12 text-detail"> {{ formData.reasonCommander }}
{{ formData.reasonCommander }} </div>
</div> </div>
</div> </div>
</div> </div>
</div> </q-card>
</q-card> </div>
</div>
<div class="col-xs-12 col-sm-12 row"> <!-- ความคิดเห็นของผู้มีอำนาจ -->
<q-card <div
bordered class="col-xs-12 col-sm-12 row"
class="row col-12 text-dark q-mt-sm"
v-if=" v-if="
formData.approveStep === 'st4' || formData.approveStep === 'st5' formData.approveStep === 'st4' || formData.approveStep === 'st5'
" "
> >
<div <q-card bordered class="row col-12 text-dark q-mt-sm">
class="bg-grey-1 q-pa-sm col-12 row items-center text-primary" <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 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-weight-bold text-top">
ผลการพิจารณา
</div>
<div class="col-12 text-detail">{{ formData.status }}</div>
</div> </div>
<div class="col-xs-6 row items-start"> </div>
<div class="col-12 text-weight-bold text-top"> <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-weight-bold text-top">
ผลการพิจารณา
</div>
<div class="col-12 text-detail">
{{ formData.status }}
</div>
</div> </div>
<div class="col-12 text-detail"> <div class="col-xs-6 row items-start">
{{ formData.reasonOligarch }} <div class="col-12 text-weight-bold text-top">
ความคิดเห็น
</div>
<div class="col-12 text-detail">
{{ formData.reasonOligarch }}
</div>
</div> </div>
</div> </div>
</div> </div>
</div> </q-card>
</q-card> </div>
</div>
<!-- Workflow -->
<div class="col-xs-12 col-sm-12">
<WorkFlow ref="workflowRef" :id="paramsId" sys-name="LEAVE_LIST" />
</div> </div>
</div> </div>
</div> </div>
</div>
<q-separator v-if="checkPermission($route)?.attrIsUpdate" />
<div class="row q-pa-md q-gutter-md justify-end">
<q-btn
v-if="
formData.approveStep === 'st1' &&
formData.status !== 'ยกเลิก' &&
checkPermission($route)?.attrIsUpdate
"
unelevated
color="orange-5"
label="ส่งไปยังผู้บังคับบัญชา"
@click="sendToCommand"
><q-tooltip>ส่งไปยังผู้บังคับบัญชา</q-tooltip>
</q-btn>
<q-btn <q-separator v-if="checkPermission($route)?.attrIsUpdate" />
v-if=" <div class="row q-pa-md q-gutter-md justify-end">
formData.approveStep === 'st2' && <q-btn
formData.status !== 'ยกเลิก' && v-if="
checkPermission($route)?.attrIsUpdate formData.approveStep === 'st1' &&
" formData.status !== 'ยกเลิก' &&
unelevated checkPermission($route)?.attrIsUpdate
color="orange-5" "
label="ส่งไปยังผู้มีอำนาจ" unelevated
@click="openModal('authority')" color="orange-5"
><q-tooltip>ส่งไปยังผู้มีอำนาจ</q-tooltip> label="ส่งไปยังผู้บังคับบัญชา"
</q-btn> @click="sendToCommand"
><q-tooltip>ส่งไปยังผู้บังคับบัญชา</q-tooltip>
</q-btn>
<q-btn
v-if="
formData.approveStep === 'st2' &&
formData.status !== 'ยกเลิก' &&
checkPermission($route)?.attrIsUpdate
"
unelevated
color="orange-5"
label="ส่งไปยังผู้มีอำนาจ"
@click="openModal('authority')"
><q-tooltip>ส่งไปยังผู้มีอำนาจ</q-tooltip>
</q-btn>
<q-btn
v-if="
formData.approveStep === 'st3' &&
formData.status !== 'ยกเลิก' &&
checkPermission($route)?.attrIsUpdate
"
unelevated
color="orange-5"
label="ไม่อนุมัติ"
@click="openModal('UnApprove')"
><q-tooltip>ไม่อนุมัติ</q-tooltip>
</q-btn>
<q-btn
v-if="
formData.approveStep === 'st3' &&
formData.status !== 'ยกเลิก' &&
checkPermission($route)?.attrIsUpdate
"
unelevated
color="primary"
label="อนุมัติ"
@click="openModal('approve')"
><q-tooltip>อนุมัติ</q-tooltip>
</q-btn>
</div>
</q-card>
</div>
<q-btn
v-if="
formData.approveStep === 'st3' &&
formData.status !== 'ยกเลิก' &&
checkPermission($route)?.attrIsUpdate
"
unelevated
color="orange-5"
label="ไม่อนุมัติ"
@click="openModal('UnApprove')"
><q-tooltip>ไม่อนุมัติ</q-tooltip>
</q-btn>
<q-btn
v-if="
formData.approveStep === 'st3' &&
formData.status !== 'ยกเลิก' &&
checkPermission($route)?.attrIsUpdate
"
unelevated
color="primary"
label="อนุมัติ"
@click="openModal('approve')"
><q-tooltip>อนุมัติ</q-tooltip>
</q-btn>
</div>
</q-card>
<DialogReason <DialogReason
v-model:modal="modalApprove" v-model:modal="modalApprove"
:title="dialogTitle" :title="dialogTitle"

491
src/modules/09_leave/components/2_Leave/DetailLeaveReject.vue
View file

@ -31,6 +31,7 @@ import FormLeaveToTraining from "@/modules/09_leave/components/2_Leave/formDetai
import FormLeaveToWorkInternational from "@/modules/09_leave/components/2_Leave/formDetail/formLeaveToWorkInternational.vue"; // ลาไปปฏิบัติงานในองค์การระหว่างประเทศ import FormLeaveToWorkInternational from "@/modules/09_leave/components/2_Leave/formDetail/formLeaveToWorkInternational.vue"; // ลาไปปฏิบัติงานในองค์การระหว่างประเทศ
import FormSpouse from "@/modules/09_leave/components/2_Leave/formDetail/formSpouse.vue"; // ลาติดตามคู่สมรส import FormSpouse from "@/modules/09_leave/components/2_Leave/formDetail/formSpouse.vue"; // ลาติดตามคู่สมรส
import FormVocationalRehabilitation from "@/modules/09_leave/components/2_Leave/formDetail/formVocationalRehabilitation.vue"; //ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ import FormVocationalRehabilitation from "@/modules/09_leave/components/2_Leave/formDetail/formVocationalRehabilitation.vue"; //ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ
import WorkFlow from "@/components/Workflow/Main.vue";
/** use */ /** use */
const $q = useQuasar(); const $q = useQuasar();
@ -150,8 +151,13 @@ const formData = reactive<FremData>({
onMounted(async () => { onMounted(async () => {
if (paramsId) { if (paramsId) {
await fetchDetailDeleteLeave(paramsId); showLoader();
await fetchDetailLeave(paramsId); Promise.all([
fetchDetailDeleteLeave(paramsId),
fetchDetailLeave(paramsId),
]).finally(() => {
hideLoader();
});
} }
}); });
@ -160,7 +166,6 @@ onMounted(async () => {
* @param paramsId รับ ID จาก paramID * @param paramsId รับ ID จาก paramID
*/ */
async function fetchDetailDeleteLeave(paramsId: string) { async function fetchDetailDeleteLeave(paramsId: string) {
showLoader();
await http await http
.get(config.API.leaveListDeleteByid(paramsId)) .get(config.API.leaveListDeleteByid(paramsId))
.then((res) => { .then((res) => {
@ -183,18 +188,14 @@ async function fetchDetailDeleteLeave(paramsId: string) {
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
})
.finally(() => {
hideLoader();
}); });
} }
async function fetchDetailLeave(paramsId: string) { async function fetchDetailLeave(paramsId: string) {
showLoader();
await http await http
.get(config.API.leaveListById(paramsId)) .get(config.API.leaveListById(paramsId))
.then(async (res) => { .then(async (res) => {
const data = res.data.result; const data = await res.data.result;
formData.id = data.id; formData.id = data.id;
formData.reasonCommander = data.reasonCommander; formData.reasonCommander = data.reasonCommander;
formData.reasonOligarch = data.reasonOligarch; formData.reasonOligarch = data.reasonOligarch;
@ -278,9 +279,6 @@ async function fetchDetailLeave(paramsId: string) {
}) })
.catch((err) => { .catch((err) => {
messageError($q, err); messageError($q, err);
})
.finally(() => {
hideLoader();
}); });
} }
@ -413,6 +411,7 @@ async function onClickDownloadFile(id: string, fileName: string, type: string) {
}); });
} }
</script> </script>
<template> <template>
<div class="toptitle text-dark col-12 row items-center"> <div class="toptitle text-dark col-12 row items-center">
<div class="row col-12 q-col-gutter-sm q-mb-sm"> <div class="row col-12 q-col-gutter-sm q-mb-sm">
@ -473,257 +472,275 @@ async function onClickDownloadFile(id: string, fileName: string, type: string) {
<q-space /> <q-space />
</div> </div>
</div> </div>
<q-card flat bordered class="col-12 q-mt-sm">
<div class="col-12 row q-py-md q-pl-md">
<div class="col-12 q-col-gutter-md">
<div class="col-xs-12 col-sm-12 row">
<q-card bordered class="row col-12 text-dark q-mt-sm">
<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-3 row items-start">
<div class="col-12 text-weight-bold text-top">เขียนที่</div>
<div class="col-12 text-detail">
{{ formDataReject.leaveWrote }}
</div>
</div>
<div class="col-xs-3 row items-start">
<div class="col-12 text-weight-bold text-top">วันที่</div>
<div class="col-12 text-detail">
{{ date2Thai(formDataReject.leaveStartDate) }}
</div>
</div>
<div class="col-xs-3 row items-start">
<div class="col-12 text-weight-bold text-top">เหตุผล</div>
<div class="col-12 text-detail">
{{ formDataReject.leaveReasonDelete }}
</div>
</div>
<div class="col-xs-3 row items-start">
<div class="col-12 text-weight-bold text-top">
เอกสารประกอบ
</div>
<div class="col-12 text-detail">
<q-btn
v-if="formDataReject.leaveDocDelete"
:href="formDataReject.leaveDocDelete"
target="_blank"
outline
color="blue"
label="ดาวน์โหลด"
size="12px"
>
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
>
<span v-else>-</span>
</div>
</div>
</div>
</div>
</q-card>
</div>
<div class="row col-12">
<q-card bordered class="bg-grey-1 q-pa-md col-12">
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-5 row items-center q-my-xs">
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">ประเภทการลา</div>
<div class="col text-primary">
{{ formData.leaveTypeName }}
</div>
</div>
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">
ชื่อ - นามสกุล
</div>
<div class="col text-weight-medium">
{{ formData.fullName }}
</div>
</div>
</div>
<div class="col-xs-12 col-sm-7 row">
<div class="row col-12 q-gutter-md">
<div
v-if="formData.leaveTypeName == 'ลาพักผ่อน'"
class="col-3"
>
<q-card bordered class="items-center row col-12 q-pa-md">
<div class="text-h6 text-weight-bold text-blue-10">
{{ formData.leaveLimit }}
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
<span class="gt-xs">ได้รับ</span>
</div>
</q-card>
</div>
<div class="col-3">
<q-card bordered class="items-center row col-12 q-pa-md">
<div class="text-h6 text-weight-bold text-light-blue-6">
{{ formData.leaveSummary }}
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
<span class="gt-xs">ใช้ไป</span>
</div>
</q-card>
</div>
<div
v-if="formData.leaveTypeName == 'ลาพักผ่อน'"
class="col-3"
>
<q-card bordered class="items-center row col-12 q-pa-md">
<div class="text-h6 text-weight-bold text-indigo-7">
{{ formData.leaveRemain }}
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
<span class="gt-xs">คงเหลือ</span>
</div>
</q-card>
</div>
</div>
</div>
</div>
</q-card>
</div>
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-5 row">
<!-- card ซ้าย -->
<q-card flat bordered class="col-12">
<FormMain :data="formData" />
</q-card>
</div>
<div class="col-xs-12 col-sm-7 row">
<q-card flat bordered class="col-12">
<!-- ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว -->
<FormLeave v-if="checkForm === 'FormLeave'" :data="formData" />
<!-- ลาไปช่วยเหลือภริยาที่คลอดบุตร --> <div class="q-pa-sm">
<FormChildbirth <q-card flat bordered class="col-12">
v-else-if="checkForm === 'FormChildbirth'" <div class="col-12 row q-py-md q-pl-md">
:data="formData" <div class="col-12 q-col-gutter-md">
/>
<!-- ลาพักผ่อน -->
<FormHoliday
v-else-if="checkForm === 'FormHoliday'"
:data="formData"
/>
<!-- ลาอุปสมบท -->
<FormUpasom
v-else-if="checkForm === 'FormUpasom'"
:data="formData"
/>
<!-- ลาประกอบพิธีฮัจญ์ -->
<FormHajj v-else-if="checkForm === 'FormHajj'" :data="formData" />
<!-- ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล -->
<FormCheckSelect
v-else-if="checkForm === 'FormCheckSelect'"
:data="formData"
/>
<!-- ลาไปศึกษา -->
<FormStudy
v-else-if="checkForm === 'FormStudy'"
:data="formData"
/>
<!-- ลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน -->
<FormLeaveToTraining
v-else-if="checkForm === 'FormLeaveToTraining'"
:data="formData"
/>
<!-- ลาไปปฏิบัติงานในองค์การระหว่างประเทศ -->
<FormLeaveToWorkInternational
v-else-if="checkForm === 'FormLeaveToWorkInternational'"
:data="formData"
/>
<!-- ลาติดตามคู่สมรส -->
<FormSpouse
v-else-if="checkForm === 'FormSpouse'"
:data="formData"
/>
<!-- ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ -->
<FormVocationalRehabilitation
v-else-if="checkForm === 'FormVocationalRehabilitation'"
:data="formData"
/>
</q-card>
</div>
<div class="col-xs-12 col-sm-12 row"> <div class="col-xs-12 col-sm-12 row">
<q-card <q-card bordered class="row col-12 text-dark q-mt-sm">
bordered
class="row col-12 text-dark q-mt-sm"
v-if="formDataReject.status !== 'NEW'"
>
<div <div
class="bg-grey-1 q-pa-sm col-12 row items-center text-primary" 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 class="q-pl-sm text-weight-bold text-dark">
ความคิดเห็นของผู้มีอำนาจ รายละเอียดการขอยกเลิก
</div> </div>
</div> </div>
<q-separator /> <q-separator />
<div class="row col-12 q-pa-md"> <div class="row col-12 q-pa-md">
<div class="col-12 row bg-white q-col-gutter-md"> <div class="col-12 row bg-white q-col-gutter-md">
<div class="col-xs-6 row items-start"> <div class="col-xs-3 row items-start">
<div class="col-12 text-weight-bold text-top"> <div class="col-12 text-weight-bold text-top">เขียนที่</div>
ผลการพิจารณา
</div>
<div class="col-12 text-detail"> <div class="col-12 text-detail">
{{ stores.convertSatatus(formDataReject.status) }} {{ formDataReject.leaveWrote }}
</div> </div>
</div> </div>
<div class="col-xs-6 row items-start"> <div class="col-xs-3 row items-start">
<div class="col-12 text-weight-bold text-top"> <div class="col-12 text-weight-bold text-top">วันที่</div>
ความคิดเห็น <div class="col-12 text-detail">
{{ date2Thai(formDataReject.leaveStartDate) }}
</div> </div>
</div>
<div class="col-xs-3 row items-start">
<div class="col-12 text-weight-bold text-top">เหตุผล</div>
<div class="col-12 text-detail"> <div class="col-12 text-detail">
{{ formDataReject.leaveReasonDelete }} {{ formDataReject.leaveReasonDelete }}
</div> </div>
</div> </div>
<div class="col-xs-3 row items-start">
<div class="col-12 text-weight-bold text-top">
เอกสารประกอบ
</div>
<div class="col-12 text-detail">
<q-btn
v-if="formDataReject.leaveDocDelete"
:href="formDataReject.leaveDocDelete"
target="_blank"
outline
color="blue"
label="ดาวน์โหลด"
size="12px"
>
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
>
<span v-else>-</span>
</div>
</div>
</div> </div>
</div> </div>
</q-card> </q-card>
</div> </div>
<div class="row col-12">
<q-card bordered class="bg-grey-1 q-pa-md col-12">
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-5 row items-center q-my-xs">
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">ประเภทการลา</div>
<div class="col text-primary">
{{ formData.leaveTypeName }}
</div>
</div>
<div class="col-12 row">
<div class="col-xs-5 col-sm-3 text-grey-8">
ชื่อ - นามสกุล
</div>
<div class="col text-weight-medium">
{{ formData.fullName }}
</div>
</div>
</div>
<div class="col-xs-12 col-sm-7 row">
<div class="row col-12 q-gutter-md">
<div
v-if="formData.leaveTypeName == 'ลาพักผ่อน'"
class="col-3"
>
<q-card bordered class="items-center row col-12 q-pa-md">
<div class="text-h6 text-weight-bold text-blue-10">
{{ formData.leaveLimit }}
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
<span class="gt-xs">ได้รับ</span>
</div>
</q-card>
</div>
<div class="col-3">
<q-card bordered class="items-center row col-12 q-pa-md">
<div class="text-h6 text-weight-bold text-light-blue-6">
{{ formData.leaveSummary }}
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
<span class="gt-xs">ใช้ไป</span>
</div>
</q-card>
</div>
<div
v-if="formData.leaveTypeName == 'ลาพักผ่อน'"
class="col-3"
>
<q-card bordered class="items-center row col-12 q-pa-md">
<div class="text-h6 text-weight-bold text-indigo-7">
{{ formData.leaveRemain }}
</div>
<div class="col-12 text-subtitle2 text-weight-regular">
<span class="gt-xs">คงเหลือ</span>
</div>
</q-card>
</div>
</div>
</div>
</div>
</q-card>
</div>
<div class="row q-col-gutter-md col-12">
<div class="col-xs-12 col-sm-5 row">
<!-- card ซ้าย -->
<q-card flat bordered class="col-12">
<FormMain :data="formData" />
</q-card>
</div>
<!-- ข้อมูลการลา -->
<div class="col-xs-12 col-sm-7 row">
<q-card flat bordered class="col-12">
<!-- ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว -->
<FormLeave v-if="checkForm === 'FormLeave'" :data="formData" />
<!-- ลาไปช่วยเหลือภริยาที่คลอดบุตร -->
<FormChildbirth
v-else-if="checkForm === 'FormChildbirth'"
:data="formData"
/>
<!-- ลาพักผ่อน -->
<FormHoliday
v-else-if="checkForm === 'FormHoliday'"
:data="formData"
/>
<!-- ลาอุปสมบท -->
<FormUpasom
v-else-if="checkForm === 'FormUpasom'"
:data="formData"
/>
<!-- ลาประกอบพิธีฮัจญ์ -->
<FormHajj
v-else-if="checkForm === 'FormHajj'"
:data="formData"
/>
<!-- ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล -->
<FormCheckSelect
v-else-if="checkForm === 'FormCheckSelect'"
:data="formData"
/>
<!-- ลาไปศึกษา -->
<FormStudy
v-else-if="checkForm === 'FormStudy'"
:data="formData"
/>
<!-- ลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน -->
<FormLeaveToTraining
v-else-if="checkForm === 'FormLeaveToTraining'"
:data="formData"
/>
<!-- ลาไปปฏิบัติงานในองค์การระหว่างประเทศ -->
<FormLeaveToWorkInternational
v-else-if="checkForm === 'FormLeaveToWorkInternational'"
:data="formData"
/>
<!-- ลาติดตามคู่สมรส -->
<FormSpouse
v-else-if="checkForm === 'FormSpouse'"
:data="formData"
/>
<!-- ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ -->
<FormVocationalRehabilitation
v-else-if="checkForm === 'FormVocationalRehabilitation'"
:data="formData"
/>
</q-card>
</div>
<!-- ความคิดเห็นของผู้มีอำนาจ -->
<div
class="col-xs-12 col-sm-12 row"
v-if="formDataReject.status !== 'NEW'"
>
<q-card bordered class="row col-12 text-dark q-mt-sm">
<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-weight-bold text-top">
ผลการพิจารณา
</div>
<div class="col-12 text-detail">
{{ stores.convertSatatus(formDataReject.status) }}
</div>
</div>
<div class="col-xs-6 row items-start">
<div class="col-12 text-weight-bold text-top">
ความคิดเห็น
</div>
<div class="col-12 text-detail">
{{ formDataReject.leaveReasonDelete }}
</div>
</div>
</div>
</div>
</q-card>
</div>
</div>
<!-- Workflow -->
<div class="col-xs-12 col-sm-12">
<WorkFlow ref="workflowRef" :id="paramsId" sys-name="LEAVE_LIST" />
</div>
</div> </div>
</div> </div>
</div> <q-separator v-if="checkPermission($route)?.attrIsUpdate" />
<q-separator v-if="checkPermission($route)?.attrIsUpdate" /> <div class="row q-pa-md q-gutter-md justify-end">
<div class="row q-pa-md q-gutter-md justify-end"> <q-btn
<q-btn v-if="
v-if=" formDataReject.status === 'NEW' &&
formDataReject.status === 'NEW' && checkPermission($route)?.attrIsUpdate
checkPermission($route)?.attrIsUpdate "
" unelevated
unelevated color="orange-5"
color="orange-5" label="ไม่อนุมัติการยกเลิก"
label="ไม่อนุมัติการยกเลิก" @click="openModal('UnApprove')"
@click="openModal('UnApprove')" ><q-tooltip>ไม่อนุมัติการยกเลิก</q-tooltip>
><q-tooltip>ไม่อนุมัติการยกเลิก</q-tooltip> </q-btn>
</q-btn> <q-btn
<q-btn v-if="
v-if=" formDataReject.status === 'NEW' &&
formDataReject.status === 'NEW' && checkPermission($route)?.attrIsUpdate
checkPermission($route)?.attrIsUpdate "
" unelevated
unelevated color="primary"
color="primary" label="อนุมัติการยกเลิก"
label="อนุมัติการยกเลิก" @click="openModal('approve')"
@click="openModal('approve')" ><q-tooltip>อนุมัติการยกเลิก</q-tooltip>
><q-tooltip>อนุมัติการยกเลิก</q-tooltip> </q-btn>
</q-btn> </div>
</div> </q-card>
</q-card> </div>
<DialogReason <DialogReason
v-model:modal="modalApprove" v-model:modal="modalApprove"
:title="dialogTitle" :title="dialogTitle"

1
src/modules/09_leave/components/2_Leave/Tab1.vue
View file

@ -36,6 +36,7 @@ const totalList = ref<number>(0);
//** เรียกข้อมูลจาก API*/ //** เรียกข้อมูลจาก API*/
async function fecthLeaveList() { async function fecthLeaveList() {
leaveStore.rows = [];
querySting.status = await (querySting.status == null querySting.status = await (querySting.status == null
? "ALL" ? "ALL"
: querySting.status); : querySting.status);

1
src/modules/09_leave/components/2_Leave/Tab2.vue
View file

@ -36,6 +36,7 @@ const totalList = ref<number>(0);
//** เรียกข้อมูลจาก API*/ //** เรียกข้อมูลจาก API*/
async function fecthLeaveList() { async function fecthLeaveList() {
leaveStore.rows = [];
querySting.status = await (querySting.status == null querySting.status = await (querySting.status == null
? "ALL" ? "ALL"
: querySting.status); : querySting.status);