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

เพิ่มปุ่มลบ/refactor

Browse source
This commit is contained in:
AnandaTon 2024-01-12 17:45:20 +07:00
parent 01b550520e
commit aa76e7d030
30 changed files with 8420 additions and 7699 deletions
Download patch file Download diff file Expand all files Collapse all files

17
src/api/leave/api.leave.ts
View file

@ -1,14 +1,15 @@
import env from "../index" import env from "../index";
const retirementResign = `${env.API_URI}/retirement` const retirementResign = `${env.API_URI}/retirement`;
const leave = `${env.API_URI}/leave` const leave = `${env.API_URI}/leave`;
const holiday = `${env.API_URI}/metadata/holiday/` const holiday = `${env.API_URI}/metadata/holiday/`;
export default { export default {
listUser: () => `${retirementResign}/resign/user`, listUser: () => `${retirementResign}/resign/user`,
listResign: () => `${retirementResign}/resign`, listResign: () => `${retirementResign}/resign`,
resingByid: (id: string) => `${retirementResign}/resign/${id}`, resingByid: (id: string) => `${retirementResign}/resign/${id}`,
questionnaireByid: (id: string) => `${retirementResign}/resign/questionnaire/${id}`, questionnaireByid: (id: string) =>
`${retirementResign}/resign/questionnaire/${id}`,
listquestionnaire: () => `${retirementResign}/resign/questionnaire`, listquestionnaire: () => `${retirementResign}/resign/questionnaire`,
// คำถาม // คำถาม
questionList: () => `${retirementResign}/resign/questionnaire/question`, questionList: () => `${retirementResign}/resign/questionnaire/question`,
@ -26,6 +27,8 @@ export default {
leaveCheck: () => `${leave}/user/check`, leaveCheck: () => `${leave}/user/check`,
leaveReport: (id: string) => `${leave}/report/${id}`, leaveReport: (id: string) => `${leave}/report/${id}`,
leaveSendReport: () => `${leave}/report-template/docx`, leaveSendReport: () => `${leave}/report-template/docx`,
leaveDocumentId: (id: string) => `${leave}/user/file/document/${id}`,
listHolidayHistoryYearMonth: (year: number, month: number) => `${holiday}${year}/${month}`, listHolidayHistoryYearMonth: (year: number, month: number) =>
} `${holiday}${year}/${month}`,
};

325
src/modules/05_leave/components/Calendar.vue
View file

@ -1,46 +1,50 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, onMounted, watch } from "vue" import { ref, onMounted, watch } from "vue";
import { useQuasar } from "quasar" import { useQuasar } from "quasar";
import keycloak from "@/plugins/keycloak" import keycloak from "@/plugins/keycloak";
import http from "@/plugins/http" import http from "@/plugins/http";
import config from "@/app.config" import config from "@/app.config";
/**import calendar*/ /**import calendar*/
import FullCalendar from "@fullcalendar/vue3" import FullCalendar from "@fullcalendar/vue3";
import dayGridPlugin from "@fullcalendar/daygrid" import dayGridPlugin from "@fullcalendar/daygrid";
// import type { CalendarOptions } from "@fullcalendar/core" // import type { CalendarOptions } from "@fullcalendar/core"
import timeGridPlugin from "@fullcalendar/timegrid" import timeGridPlugin from "@fullcalendar/timegrid";
import interactionPlugin from "@fullcalendar/interaction" import interactionPlugin from "@fullcalendar/interaction";
import allLocales from "@fullcalendar/core/locales-all" import allLocales from "@fullcalendar/core/locales-all";
import listPlugin from "@fullcalendar/list" import listPlugin from "@fullcalendar/list";
/** import type*/ /** import type*/
import type { DataDateMonthObject } from "@/modules/05_leave/interface/request/Calendar.ts" import type { DataDateMonthObject } from "@/modules/05_leave/interface/request/Calendar.ts";
import type { DataCalendar, LeaveType } from "@/modules/05_leave/interface/response/leave" import type {
DataCalendar,
LeaveType,
} from "@/modules/05_leave/interface/response/leave";
/** import componest*/ /** import componest*/
import DialogDetail from "@/modules/05_leave/components/DialogDetail.vue" import DialogDetail from "@/modules/05_leave/components/DialogDetail.vue";
/** import stort*/ /** import stort*/
import { useCounterMixin } from "@/stores/mixin" import { useCounterMixin } from "@/stores/mixin";
// import { aR } from "@fullcalendar/core/internal-common" // import { aR } from "@fullcalendar/core/internal-common"
/**ตัวแปรที่ใช้ */
const mixin = useCounterMixin() const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError, date2Thai, monthYear2Thai, dateToISO } = mixin const { showLoader, hideLoader, messageError, monthYear2Thai } = mixin;
const $q = useQuasar();
const $q = useQuasar() const emit = defineEmits(["update:dateYear"]);
const fullName = ref<string>("");
const emit = defineEmits(["update:dateYear"]) const mainData = ref<DataCalendar[]>([]);
const keycloakId = ref<string>(
const fullName = ref<string>("") keycloak.tokenParsed ? keycloak.tokenParsed.sub!.toString() : ""
const mainData = ref<DataCalendar[]>([]) );
const modal = ref<boolean>(false);
const keycloakId = ref<string>(keycloak.tokenParsed ? keycloak.tokenParsed.sub!.toString() : "") const leaveId = ref<string>("");
/** /**
* Option ของปฏิทิน * Option ของปฏิทิน
*/ */
const fullCalendar = ref<any>() //ref calendar const fullCalendar = ref<any>(); //ref calendar
const calendarOptions = ref<any>({ const calendarOptions = ref<any>({
plugins: [ plugins: [
dayGridPlugin, dayGridPlugin,
@ -65,38 +69,43 @@ const calendarOptions = ref<any>({
displayEventTime: false, displayEventTime: false,
editable: true, editable: true,
events: [], events: [],
}) });
/**Map ตัวแปร dateMonth */
const dateMonth = ref<DataDateMonthObject>({ const dateMonth = ref<DataDateMonthObject>({
month: new Date().getMonth(), month: new Date().getMonth(),
year: new Date().getFullYear(), year: new Date().getFullYear(),
}) });
/** function เรียกข้อมูล calendar*/ /** function เรียกข้อมูล calendar*/
async function fetchDataCalendar() { async function fetchDataCalendar() {
showLoader() showLoader();
await http await http
.post(config.API.leaveCalendar(), { .post(config.API.leaveCalendar(), {
year: dateMonth.value.year, year: dateMonth.value.year,
}) })
.then(res => { .then((res) => {
mainData.value = res.data.result mainData.value = res.data.result;
const double_name = [...new Set(mainData.value.map((item: DataCalendar) => item.keycloakId))] const double_name = [
filterLists.value = [] ...new Set(mainData.value.map((item: DataCalendar) => item.keycloakId)),
];
filterLists.value = [];
for (let i = 1; i <= double_name.length; i++) { for (let i = 1; i <= double_name.length; i++) {
const name = double_name[i - 1] const name = double_name[i - 1];
const filterName = { const filterName = {
id: name, id: name,
name: convertKeycloakId(name), name: convertKeycloakId(name),
color: name === keycloakId.value ? "green" : "grey", color: name === keycloakId.value ? "green" : "grey",
};
filterLists.value.push(filterName);
} }
filterLists.value.push(filterName) console.log(double_name);
}
console.log(double_name)
if (filterVal.value.length !== 0) { if (filterVal.value.length !== 0) {
const data = mainData.value.filter((e: any) => e.keycloakId === keycloakId.value) const data = mainData.value.filter(
(e: any) => e.keycloakId === keycloakId.value
);
const event = data const event = data
.filter((x: any) => x.status != "REJECT" && x.status != "DELETE") .filter((x: any) => x.status != "REJECT" && x.status != "DELETE")
@ -104,45 +113,57 @@ async function fetchDataCalendar() {
id: e.id, id: e.id,
title: `${e.fullName} (${e.leaveTypeName})`, title: `${e.fullName} (${e.leaveTypeName})`,
start: e.leaveStartDate, start: e.leaveStartDate,
end: new Date(new Date(e.leaveEndDate).setHours(23, 59, 59)).toISOString(), end: new Date(
new Date(e.leaveEndDate).setHours(23, 59, 59)
).toISOString(),
allDay: e.leaveStartDate === e.leaveEndDate ? true : false, allDay: e.leaveStartDate === e.leaveEndDate ? true : false,
color: e.keycloakId === keycloakId.value ? "#DCEDC8" : "#CFD8DC", color: e.keycloakId === keycloakId.value ? "#DCEDC8" : "#CFD8DC",
textColor: "black", textColor: "black",
})) }));
calendarOptions.value.events = event calendarOptions.value.events = event;
console.log(calendarOptions.value.events) console.log(calendarOptions.value.events);
} }
}) })
.catch(err => { .catch((err) => {
messageError($q, err) messageError($q, err);
}) })
.finally(() => { .finally(() => {
hideLoader() hideLoader();
}) });
await fetchData() await fetchData();
} }
/** /**
* fetch วันหยุดในปฏิทิน * fetch วันหยุดในปฏิทิน
*/ */
const fetchData = async () => { const fetchData = async () => {
showLoader() showLoader();
await http await http
.get(config.API.listHolidayHistoryYearMonth(dateMonth.value.year, dateMonth.value.month + 1)) .get(
.then(res => { config.API.listHolidayHistoryYearMonth(
const dataNormal = res.data.result.normal dateMonth.value.year,
const dataSixDays = res.data.result.sixDays dateMonth.value.month + 1
const data = dataNormal )
)
.then((res) => {
const dataNormal = res.data.result.normal;
const dataSixDays = res.data.result.sixDays;
const data = dataNormal;
const event = data.map((e: any) => ({ const event = data.map((e: any) => ({
id: e.id, id: e.id,
title: `${e.name} `, title: `${e.name} `,
start: e.holidayDate, start: e.holidayDate,
end: new Date(new Date(e.holidayDate).setHours(23, 59, 59)).toISOString(), end: new Date(
new Date(e.holidayDate).setHours(23, 59, 59)
).toISOString(),
allDay: e.holidayDate === e.holidayDate ? true : false, allDay: e.holidayDate === e.holidayDate ? true : false,
color: " #CCE5FF", color: " #CCE5FF",
textColor: "#0080FF", textColor: "#0080FF",
})) }));
calendarOptions.value.events = [...calendarOptions.value.events, ...event] calendarOptions.value.events = [
...calendarOptions.value.events,
...event,
];
// const dataSix = dataSixDays // const dataSix = dataSixDays
// const eventSix = dataSix.map((e: any) => ({ // const eventSix = dataSix.map((e: any) => ({
// id: e.id, // id: e.id,
@ -154,32 +175,33 @@ const fetchData = async () => {
// textColor: "#FF8000", // textColor: "#FF8000",
// })) // }))
// calendarOptions.value.events = [...calendarOptions.value.events, ...eventSix] // calendarOptions.value.events = [...calendarOptions.value.events, ...eventSix]
console.log(calendarOptions.value.events) console.log(calendarOptions.value.events);
}) })
.catch(e => { .catch((e) => {
messageError($q, e) messageError($q, e);
}) })
.finally(async () => { .finally(async () => {
hideLoader() hideLoader();
}) });
} };
/**function แปลงkeycloakId */
function convertKeycloakId(id: any) { function convertKeycloakId(id: any) {
const filterName = mainData.value.find((e: any) => e.keycloakId === id) const filterName = mainData.value.find((e: any) => e.keycloakId === id);
return filterName?.fullName return filterName?.fullName;
} }
const leaveType = ref<LeaveType[]>([])
/** function เรียกประเภทการลา */ /** function เรียกประเภทการลา */
const leaveType = ref<LeaveType[]>([]);
async function fectOptionType() { async function fectOptionType() {
await http await http
.get(config.API.leaveType()) .get(config.API.leaveType())
.then(async res => { .then(async (res) => {
leaveType.value = res.data.result leaveType.value = res.data.result;
})
.catch(err => {
messageError($q, err)
}) })
.catch((err) => {
messageError($q, err);
});
} }
/** /**
@ -187,66 +209,72 @@ async function fectOptionType() {
* @param val datepicker แบบเลือกปีและเดือน * @param val datepicker แบบเลือกปีและเดือน
*/ */
function monthYearThai(val: DataDateMonthObject) { function monthYearThai(val: DataDateMonthObject) {
if (val == null) return "" if (val == null) return "";
else return monthYear2Thai(val.month, val.year) else return monthYear2Thai(val.month, val.year);
} }
/** function อัปเดท Calendar */ /** function อัปเดท Calendar */
async function updateMonth() { async function updateMonth() {
await fetchDataCalendar() await fetchDataCalendar();
await fetchData() await fetchData();
const calen = fullCalendar.value.getApi() const calen = fullCalendar.value.getApi();
const date = new Date(dateMonth.value.year, dateMonth.value.month) const date = new Date(dateMonth.value.year, dateMonth.value.month);
calen.gotoDate(date) calen.gotoDate(date);
} }
const modal = ref<boolean>(false)
const leaveId = ref<string>("")
/** /**
* function openPopupDateail * function openPopupDateail
* @param id การลา * @param id การลา
*/ */
async function onCilckview(id: string) { async function onCilckview(id: string) {
modal.value = true modal.value = true;
leaveId.value = id leaveId.value = id;
} }
/** function closePopup*/ /** function closePopup*/
async function onClickClose() { async function onClickClose() {
modal.value = false modal.value = false;
} }
/** filter calendar left */ /** filter calendar left */
const filterLists = ref<any>([]) const filterLists = ref<any>([]);
const filterVal = ref<any>([]) const filterVal = ref<any>([]);
/**** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่Calendar */
watch( watch(
() => filterVal.value, () => filterVal.value,
() => { () => {
const eventData = filterVal.value.map((item: any) => { const eventData = filterVal.value.map((item: any) => {
return mainData.value return mainData.value
.filter((e: DataCalendar) => e.keycloakId === item && e.status != "REJECT" && e.status != "DELETE") .filter(
.map(e => ({ (e: DataCalendar) =>
e.keycloakId === item &&
e.status != "REJECT" &&
e.status != "DELETE"
)
.map((e) => ({
id: e.id, id: e.id,
title: `${e.fullName} (${e.leaveTypeName})`, title: `${e.fullName} (${e.leaveTypeName})`,
start: e.leaveStartDate, start: e.leaveStartDate,
end: new Date(new Date(e.leaveEndDate).setHours(23, 59, 59)).toISOString(), end: new Date(
new Date(e.leaveEndDate).setHours(23, 59, 59)
).toISOString(),
allDay: e.leaveStartDate === e.leaveEndDate ? true : false, allDay: e.leaveStartDate === e.leaveEndDate ? true : false,
color: e.keycloakId === keycloakId.value ? "#DCEDC8" : "#CFD8DC", color: e.keycloakId === keycloakId.value ? "#DCEDC8" : "#CFD8DC",
textColor: "black", textColor: "black",
})) }));
}) });
const allEventData = [].concat(...eventData) const allEventData = [].concat(...eventData);
calendarOptions.value.events = allEventData calendarOptions.value.events = allEventData;
} }
) );
/**Hook */
onMounted(async () => { onMounted(async () => {
filterVal.value.push(keycloakId.value) filterVal.value.push(keycloakId.value);
await fetchDataCalendar() await fetchDataCalendar();
await fectOptionType() await fectOptionType();
}) });
</script> </script>
<template> <template>
@ -255,8 +283,18 @@ onMounted(async () => {
<q-card class="col-12" flat bordered> <q-card class="col-12" flat bordered>
<div class="q-gutter-sm col-12"> <div class="q-gutter-sm col-12">
<q-list class="rounded-borders q-pt-sm" dense> <q-list class="rounded-borders q-pt-sm" dense>
<q-item v-for="(item, i) in filterLists" :key="i" tag="label" v-ripple> <q-item
<q-checkbox size="sm" v-model="filterVal" :val="item.id" :color="item.color" /> v-for="(item, i) in filterLists"
:key="i"
tag="label"
v-ripple
>
<q-checkbox
size="sm"
v-model="filterVal"
:val="item.id"
:color="item.color"
/>
<q-item-section> <q-item-section>
<q-item-label>{{ item.name }}</q-item-label> <q-item-label>{{ item.name }}</q-item-label>
</q-item-section> </q-item-section>
@ -270,16 +308,40 @@ onMounted(async () => {
<div class="q-mt-sm col-12"> <div class="q-mt-sm col-12">
<div class="row col-12 q-gutter-sm"> <div class="row col-12 q-gutter-sm">
<div class="demo-app-main"> <div class="demo-app-main">
<q-card bordered flat class="q-pa-sm q-mb-sm col-12 row bg-grey-1 shadow-0"> <q-card
bordered
flat
class="q-pa-sm q-mb-sm col-12 row bg-grey-1 shadow-0"
>
<div class="items-center col-12 row q-col-gutter-sm"> <div class="items-center col-12 row q-col-gutter-sm">
<!-- filter เลือกเดือนปี --> <!-- filter เลือกเดือนปี -->
<datepicker v-model="dateMonth" :locale="'th'" autoApply month-picker :enableTimePicker="false" @update:modelValue="updateMonth"> <datepicker
v-model="dateMonth"
:locale="'th'"
autoApply
month-picker
:enableTimePicker="false"
@update:modelValue="updateMonth"
>
<template #year="{ year }">{{ year + 543 }}</template> <template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{ parseInt(value + 543) }}</template> <template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger> <template #trigger>
<q-input :model-value="monthYearThai(dateMonth)" dense outlined bg-color="white" style="width: 130px"> <q-input
:model-value="monthYearThai(dateMonth)"
dense
outlined
bg-color="white"
style="width: 130px"
>
<template v-slot:prepend> <template v-slot:prepend>
<q-icon name="event" class="cursor-pointer" style="color: var(--q-primary)"> </q-icon> <q-icon
name="event"
class="cursor-pointer"
style="color: var(--q-primary)"
>
</q-icon>
</template> </template>
</q-input> </q-input>
</template> </template>
@ -288,14 +350,29 @@ onMounted(async () => {
</q-card> </q-card>
<div class="main-content"> <div class="main-content">
<FullCalendar ref="fullCalendar" class="demo-app-calendar" :options="calendarOptions"> <FullCalendar
ref="fullCalendar"
class="demo-app-calendar"
:options="calendarOptions"
>
<template v-slot:eventContent="arg"> <template v-slot:eventContent="arg">
<div v-if="arg.event.textColor == 'black'" class="row col-12 items-center no-wrap" :style="`background: + ${arg.event.color}`"> <div
<div class="textHover col-10" @click="onCilckview(arg.event.id)"> v-if="arg.event.textColor == 'black'"
class="row col-12 items-center no-wrap"
:style="`background: + ${arg.event.color}`"
>
<div
class="textHover col-10"
@click="onCilckview(arg.event.id)"
>
{{ arg.event.title }} {{ arg.event.title }}
</div> </div>
</div> </div>
<div v-else class="row col-12 items-center no-wrap" :style="`background: + ${arg.event.color}`"> <div
v-else
class="row col-12 items-center no-wrap"
:style="`background: + ${arg.event.color}`"
>
<div class="textHover col-10"> <div class="textHover col-10">
{{ arg.event.title }} {{ arg.event.title }}
</div> </div>
@ -307,15 +384,30 @@ onMounted(async () => {
</div> </div>
<div class="row q-col-gutter-lg justify-end"> <div class="row q-col-gutter-lg justify-end">
<div class="items-center row"> <div class="items-center row">
<q-icon size="10px" color="blue" name="mdi-circle" class="q-mr-sm" /> <q-icon
size="10px"
color="blue"
name="mdi-circle"
class="q-mr-sm"
/>
<span class="text-caption text-grey-8">วันหยุด</span> <span class="text-caption text-grey-8">วันหยุด</span>
</div> </div>
<div class="items-center row"> <div class="items-center row">
<q-icon size="10px" color="green-7" name="mdi-circle" class="q-mr-sm" /> <q-icon
size="10px"
color="green-7"
name="mdi-circle"
class="q-mr-sm"
/>
<span class="text-caption text-grey-8">การลาของฉัน</span> <span class="text-caption text-grey-8">การลาของฉัน</span>
</div> </div>
<div class="items-center row"> <div class="items-center row">
<q-icon size="10px" color="grey-6" name="mdi-circle" class="q-mr-sm" /> <q-icon
size="10px"
color="grey-6"
name="mdi-circle"
class="q-mr-sm"
/>
<span class="text-caption text-grey-8">การลาของบุคคลอื่น</span> <span class="text-caption text-grey-8">การลาของบุคคลอื่น</span>
</div> </div>
</div> </div>
@ -323,7 +415,12 @@ onMounted(async () => {
</div> </div>
</div> </div>
<DialogDetail :modal="modal" :leaveId="leaveId" :onClickClose="onClickClose" :leaveType="leaveType" /> <DialogDetail
:modal="modal"
:leaveId="leaveId"
:onClickClose="onClickClose"
:leaveType="leaveType"
/>
</template> </template>
<style scope lang="scss"> <style scope lang="scss">

504
src/modules/05_leave/components/DialogDetail.vue
View file

@ -1,37 +1,54 @@
<script setup lang="ts"> <script setup lang="ts">
import { ref, reactive, watch } from "vue" import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar" import { useQuasar } from "quasar";
import http from "@/plugins/http" import http from "@/plugins/http";
import config from "@/app.config" import config from "@/app.config";
/** import type*/ /** import type*/
import type { FremDetail, FormDelete, FormDeleteRef, FromCancelDetail } from "@/modules/05_leave/interface/response/leave" import type {
FremDetail,
FormDelete,
FormDeleteRef,
FromCancelDetail,
} from "@/modules/05_leave/interface/response/leave";
/** import componest*/ /** import componest*/
import FormLeave from "@/modules/05_leave/components/formDetail/01_SickForm.vue" import FormLeave from "@/modules/05_leave/components/formDetail/01_SickForm.vue";
import FormChildbirth from "@/modules/05_leave/components/formDetail/04_HelpWifeBirthForm.vue" import FormChildbirth from "@/modules/05_leave/components/formDetail/04_HelpWifeBirthForm.vue";
import FormHoliday from "@/modules/05_leave/components/formDetail/05_VacationForm.vue" import FormHoliday from "@/modules/05_leave/components/formDetail/05_VacationForm.vue";
import FormUpasom from "@/modules/05_leave/components/formDetail/06_OrdinationForm.vue" import FormUpasom from "@/modules/05_leave/components/formDetail/06_OrdinationForm.vue";
import FormHajj from "@/modules/05_leave/components/formDetail/07_HajjForm.vue" import FormHajj from "@/modules/05_leave/components/formDetail/07_HajjForm.vue";
import FormCheckSelect from "@/modules/05_leave/components/formDetail/08_MilitaryForm.vue" import FormCheckSelect from "@/modules/05_leave/components/formDetail/08_MilitaryForm.vue";
import FormStudy from "@/modules/05_leave/components/formDetail/09_StudyForm.vue" import FormStudy from "@/modules/05_leave/components/formDetail/09_StudyForm.vue";
import FormLeaveToTraining from "@/modules/05_leave/components/formDetail/10_TrainForm.vue" import FormLeaveToTraining from "@/modules/05_leave/components/formDetail/10_TrainForm.vue";
import FormLeaveToWorkInternational from "@/modules/05_leave/components/formDetail/11_WorkInternationalForm.vue" import FormLeaveToWorkInternational from "@/modules/05_leave/components/formDetail/11_WorkInternationalForm.vue";
import FormSpouse from "@/modules/05_leave/components/formDetail/12_FollowSpouseForm.vue" import FormSpouse from "@/modules/05_leave/components/formDetail/12_FollowSpouseForm.vue";
import FormVocationalRehabilitation from "@/modules/05_leave/components/formDetail/13_RehabilitationForm.vue" import FormVocationalRehabilitation from "@/modules/05_leave/components/formDetail/13_RehabilitationForm.vue";
import FormCancel from "@/modules/05_leave/components/formDetail/formCancel.vue" import FormCancel from "@/modules/05_leave/components/formDetail/formCancel.vue";
/** import stort*/ /** import stort*/
import { useCounterMixin } from "@/stores/mixin" import { useCounterMixin } from "@/stores/mixin";
import { useLeaveStore } from "@/modules/05_leave/store" import { useLeaveStore } from "@/modules/05_leave/store";
const dataStore = useLeaveStore() /**ตัวแปร */
const { convertStatud } = dataStore const dataStore = useLeaveStore();
const mixin = useCounterMixin() const { convertStatud } = dataStore;
const { showLoader, hideLoader, messageError, date2Thai, success, dialogConfirm, calculateDurationYmd } = mixin const titleMain = ref<string>("รายละเอียดการลาของ");
const titleMainCancle = ref<string>("รายละเอียดการยกเลิกการลาของ");
const $q = useQuasar() const titleName = ref<string>("");
const mixin = useCounterMixin();
const {
showLoader,
hideLoader,
messageError,
date2Thai,
success,
dialogConfirm,
calculateDurationYmd,
} = mixin;
const $q = useQuasar();
/**Prop */
const props = defineProps({ const props = defineProps({
modal: { modal: {
type: Boolean, type: Boolean,
@ -57,13 +74,10 @@ const props = defineProps({
type: Function, type: Function,
require: true, require: true,
}, },
}) });
const titleMain = ref<string>("รายละเอียดการลาของ")
const titleMainCancle = ref<string>("รายละเอียดการยกเลิกการลาของ")
const titleName = ref<string>("")
/**checkForm Form การลา*/ /**checkForm Form การลา*/
const checkForm = ref<string>("") const checkForm = ref<string>("");
/** Form รายละเอียดข้อมูล*/ /** Form รายละเอียดข้อมูล*/
const formData = reactive<FremDetail>({ const formData = reactive<FremDetail>({
@ -125,8 +139,9 @@ const formData = reactive<FremDetail>({
coupleDaySumTotalHistory: "", //ประวัติ ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา กี่ปี กี่เดือน กี่วัน (ลาติดตามคู่สมรส) coupleDaySumTotalHistory: "", //ประวัติ ในกรณีลาติดต่อกับครั้งก่อน รวมทั้งนี้ด้วย เป็นเวลา กี่ปี กี่เดือน กี่วัน (ลาติดตามคู่สมรส)
approveStep: "", approveStep: "",
dear: "", dear: "",
leaveRange: "" leaveRange: "",
}) });
/** Form รายละเอียดข้อมูล*/ /** Form รายละเอียดข้อมูล*/
const formDataCancle = reactive<FromCancelDetail>({ const formDataCancle = reactive<FromCancelDetail>({
id: "", id: "",
@ -142,103 +157,131 @@ const formDataCancle = reactive<FromCancelDetail>({
leaveTotal: 0, leaveTotal: 0,
leaveStartDate: new Date(), leaveStartDate: new Date(),
leaveEndDate: new Date(), leaveEndDate: new Date(),
}) });
/** form ขอยกเลิก*/ /** form ขอยกเลิก*/
const formDelete = reactive<FormDelete>({ const formDelete = reactive<FormDelete>({
writeAt: "", writeAt: "",
reason: "", reason: "",
doc: null, doc: null,
}) });
/**Validate ข้อมูล */ /**Validate ข้อมูล */
const writeAtRef = ref<Object | null>(null) const writeAtRef = ref<Object | null>(null);
const reasonRef = ref<Object | null>(null) const reasonRef = ref<Object | null>(null);
const docRef = ref<Object | null>(null) const docRef = ref<Object | null>(null);
const formDeleteRef: FormDeleteRef = { const formDeleteRef: FormDeleteRef = {
writeAt: writeAtRef, writeAt: writeAtRef,
reason: reasonRef, reason: reasonRef,
doc: docRef, doc: docRef,
} };
/** /**
* function เรียกข้อมูลการลา * function เรียกข้อมูลการลา
* @param id การลา * @param id การลา
*/ */
async function fetchDataDetail(id: string) { async function fetchDataDetail(id: string) {
showLoader() showLoader();
await http await http
.get(config.API.leaveUserId(id), {}) .get(config.API.leaveUserId(id), {})
.then(res => { .then((res) => {
const data = res.data.result const data = res.data.result;
titleName.value = data.fullName ?? "-" titleName.value = data.fullName ?? "-";
formData.id = data.id ?? "-" formData.id = data.id ?? "-";
formData.leaveTypeName = data.leaveTypeName ?? "-" formData.leaveTypeName = data.leaveTypeName ?? "-";
formData.leaveTypeId = data.leaveTypeId ?? "-" formData.leaveTypeId = data.leaveTypeId ?? "-";
formData.fullname = data.fullName ?? "-" formData.fullname = data.fullName ?? "-";
formData.dateSendLeave = data.dateSendLeave && date2Thai(data.dateSendLeave) formData.dateSendLeave =
formData.status = data.status ?? "-" data.dateSendLeave && date2Thai(data.dateSendLeave);
formData.leaveDateStart = data.leaveStartDate && date2Thai(data.leaveStartDate) formData.status = data.status ?? "-";
formData.leaveDateEnd = data.leaveEndDate && date2Thai(data.leaveEndDate) formData.leaveDateStart =
formData.leaveCount = calculateDurationYmd(data.leaveStartDate, data.leaveEndDate) data.leaveStartDate && date2Thai(data.leaveStartDate);
formData.leaveWrote = data.leaveWrote ?? "-" formData.leaveDateEnd = data.leaveEndDate && date2Thai(data.leaveEndDate);
formData.leaveAddress = data.leaveAddress ?? "-" formData.leaveCount = calculateDurationYmd(
formData.leaveNumber = data.leaveNumber ?? "-" data.leaveStartDate,
formData.leaveDetail = data.leaveDetail ?? "-" data.leaveEndDate
formData.leaveDocument = data.leaveDocument );
formData.leaveDocument = data.leaveDocument formData.leaveWrote = data.leaveWrote ?? "-";
formData.leaveRange = data.leaveRange formData.leaveAddress = data.leaveAddress ?? "-";
formData.leaveLastStart = data.leaveLastStart && date2Thai(data.leaveLastStart) formData.leaveNumber = data.leaveNumber ?? "-";
formData.leaveLastEnd = data.leaveLastStart && date2Thai(data.leaveLastEnd) formData.leaveDetail = data.leaveDetail ?? "-";
formData.leaveDocument = data.leaveDocument;
formData.leaveDocument = data.leaveDocument;
formData.leaveRange = data.leaveRange;
formData.leaveLastStart =
data.leaveLastStart && date2Thai(data.leaveLastStart);
formData.leaveLastEnd =
data.leaveLastStart && date2Thai(data.leaveLastEnd);
// formData.leaveTotal = calculateDurationYmd(data.leaveStartDate, data.leaveEndDate) // formData.leaveTotal = calculateDurationYmd(data.leaveStartDate, data.leaveEndDate)
formData.leaveTotal = data.leaveTotal formData.leaveTotal = data.leaveTotal;
formData.leavebirthDate = data.leaveBirthDate && date2Thai(data.leaveBirthDate) formData.leavebirthDate =
formData.leavegovernmentDate = data.leaveGovernmentDate && date2Thai(data.leaveGovernmentDate) data.leaveBirthDate && date2Thai(data.leaveBirthDate);
formData.leaveSalary = data.leaveSalary ? data.leaveSalary.toLocaleString("th-TH") : "-" formData.leavegovernmentDate =
formData.leaveSalaryText = data.leaveSalaryText ?? "-" data.leaveGovernmentDate && date2Thai(data.leaveGovernmentDate);
formData.wifeDayName = data.wifeDayName ?? "-" formData.leaveSalary = data.leaveSalary
formData.wifeDayDateBorn = data.wifeDayDateBorn && date2Thai(data.wifeDayDateBorn) ? data.leaveSalary.toLocaleString("th-TH")
formData.restDayOldTotal = data.restDayOldTotal ?? "-" : "-";
formData.restDayCurrentTotal = data.restDayCurrentTotal ?? "-" formData.leaveSalaryText = data.leaveSalaryText ?? "-";
formData.ordainDayStatus = data.ordainDayStatus ? "เคย" : "ไม่เคยบวช" formData.wifeDayName = data.wifeDayName ?? "-";
formData.ordainDayLocationName = data.ordainDayLocationName ?? "-" formData.wifeDayDateBorn =
formData.ordainDayLocationAddress = data.ordainDayLocationAddress ?? "-" data.wifeDayDateBorn && date2Thai(data.wifeDayDateBorn);
formData.ordainDayLocationNumber = data.ordainDayLocationNumber ?? "-" formData.restDayOldTotal = data.restDayOldTotal ?? "-";
formData.ordainDayOrdination = data.ordainDayOrdination && date2Thai(data.ordainDayOrdination) formData.restDayCurrentTotal = data.restDayCurrentTotal ?? "-";
formData.ordainDayBuddhistLentName = data.ordainDayBuddhistLentName ?? "-" formData.ordainDayStatus = data.ordainDayStatus ? "เคย" : "ไม่เคยบวช";
formData.ordainDayBuddhistLentAddress = data.ordainDayBuddhistLentAddress ?? "-" formData.ordainDayLocationName = data.ordainDayLocationName ?? "-";
formData.hajjDayStatus = data.hajjDayStatus ? "เคย" : "ไม่เคยไปประกอบพิธีฮัจญ์" formData.ordainDayLocationAddress = data.ordainDayLocationAddress ?? "-";
formData.absentDaySummon = data.absentDaySummon ?? "-" formData.ordainDayLocationNumber = data.ordainDayLocationNumber ?? "-";
formData.absentDayLocation = data.absentDayLocation ?? "-" formData.ordainDayOrdination =
formData.absentDayRegistorDate = data.absentDayRegistorDate && date2Thai(data.absentDayRegistorDate) data.ordainDayOrdination && date2Thai(data.ordainDayOrdination);
formData.absentDayGetIn = data.absentDayGetIn ?? "-" formData.ordainDayBuddhistLentName =
formData.absentDayAt = data.absentDayAt ?? "-" data.ordainDayBuddhistLentName ?? "-";
formData.studyDaySubject = data.studyDaySubject ?? "-" formData.ordainDayBuddhistLentAddress =
formData.studyDayDegreeLevel = data.studyDayDegreeLevel ?? "-" data.ordainDayBuddhistLentAddress ?? "-";
formData.studyDayUniversityName = data.studyDayUniversityName ?? "-" formData.hajjDayStatus = data.hajjDayStatus
formData.studyDayTrainingSubject = data.studyDayTrainingSubject ?? "-" ?? "-" ? "เคย"
formData.studyDayTrainingName = data.studyDayTrainingName ?? "-" : "ไม่เคยไปประกอบพิธีฮัจญ์";
formData.studyDayCountry = data.studyDayCountry ?? "-" formData.absentDaySummon = data.absentDaySummon ?? "-";
formData.studyDayScholarship = data.studyDayScholarship ?? "-" formData.absentDayLocation = data.absentDayLocation ?? "-";
formData.coupleDayName = data.coupleDayName ?? "-" formData.absentDayRegistorDate =
formData.coupleDayPosition = data.coupleDayPosition ?? "-" data.absentDayRegistorDate && date2Thai(data.absentDayRegistorDate);
formData.coupleDayLevel = data.coupleDayLevel ?? "-" formData.absentDayGetIn = data.absentDayGetIn ?? "-";
formData.coupleDayLevelCountry = data.coupleDayLevelCountry ?? "-" formData.absentDayAt = data.absentDayAt ?? "-";
formData.coupleDayCountryHistory = data.coupleDayCountryHistory ?? "-" formData.studyDaySubject = data.studyDaySubject ?? "-";
formData.coupleDayTotalHistory = data.coupleDayTotalHistory ?? "-" formData.studyDayDegreeLevel = data.studyDayDegreeLevel ?? "-";
formData.coupleDayStartDateHistory = data.coupleDayStartDateHistory && date2Thai(data.coupleDayStartDateHistory) formData.studyDayUniversityName = data.studyDayUniversityName ?? "-";
formData.coupleDayEndDateHistory = data.coupleDayEndDateHistory && date2Thai(data.coupleDayEndDateHistory) formData.studyDayTrainingSubject =
formData.coupleDaySumTotalHistory = data.coupleDaySumTotalHistory ?? "-" data.studyDayTrainingSubject ?? "-" ?? "-";
formData.approveStep = data.approveStep ?? "-" formData.studyDayTrainingName = data.studyDayTrainingName ?? "-";
formData.dear = data.dear ?? "-" formData.studyDayCountry = data.studyDayCountry ?? "-";
checkLeaveType(formData.leaveTypeId, formData.leaveTypeName, formData.ordainDayLocationName, formData.studyDayTrainingSubject) formData.studyDayScholarship = data.studyDayScholarship ?? "-";
formData.coupleDayName = data.coupleDayName ?? "-";
formData.coupleDayPosition = data.coupleDayPosition ?? "-";
formData.coupleDayLevel = data.coupleDayLevel ?? "-";
formData.coupleDayLevelCountry = data.coupleDayLevelCountry ?? "-";
formData.coupleDayCountryHistory = data.coupleDayCountryHistory ?? "-";
formData.coupleDayTotalHistory = data.coupleDayTotalHistory ?? "-";
formData.coupleDayStartDateHistory =
data.coupleDayStartDateHistory &&
date2Thai(data.coupleDayStartDateHistory);
formData.coupleDayEndDateHistory =
data.coupleDayEndDateHistory && date2Thai(data.coupleDayEndDateHistory);
formData.coupleDaySumTotalHistory = data.coupleDaySumTotalHistory ?? "-";
formData.approveStep = data.approveStep ?? "-";
formData.dear = data.dear ?? "-";
checkLeaveType(
formData.leaveTypeId,
formData.leaveTypeName,
formData.ordainDayLocationName,
formData.studyDayTrainingSubject
);
}) })
.catch(err => { .catch((err) => {
props.onClickClose?.() props.onClickClose?.();
messageError($q, err) messageError($q, err);
}) })
.finally(() => { .finally(() => {
hideLoader() hideLoader();
}) });
} }
/** /**
@ -246,38 +289,43 @@ async function fetchDataDetail(id: string) {
* @param leaveTypeId ประเภทการลา * @param leaveTypeId ประเภทการลา
* @param leaveTypeName ประเภทการลา * @param leaveTypeName ประเภทการลา
*/ */
function checkLeaveType(leaveTypeId: string, leaveTypeName: string, ordainDayLocationName: string, studyDayTrainingSubject: string) { function checkLeaveType(
console.log(leaveTypeName) leaveTypeId: string,
console.log(leaveTypeId) leaveTypeName: string,
console.log(ordainDayLocationName) ordainDayLocationName: string,
studyDayTrainingSubject: string
) {
console.log(leaveTypeName);
console.log(leaveTypeId);
console.log(ordainDayLocationName);
if (props.leaveType) { if (props.leaveType) {
const filtertype = props.leaveType.find((e: any) => e.id === leaveTypeId) const filtertype = props.leaveType.find((e: any) => e.id === leaveTypeId);
const type = filtertype.code const type = filtertype.code;
console.log(type) console.log(type);
if (type === "LV-001" || type === "LV-002" || type === "LV-003") { if (type === "LV-001" || type === "LV-002" || type === "LV-003") {
checkForm.value = "FormLeave" checkForm.value = "FormLeave";
} else if (type === "LV-004") { } else if (type === "LV-004") {
checkForm.value = "FormChildbirth" checkForm.value = "FormChildbirth";
} else if (type === "LV-005") { } else if (type === "LV-005") {
checkForm.value = "FormHoliday" checkForm.value = "FormHoliday";
} else if (type === "LV-006" && ordainDayLocationName === "") { } else if (type === "LV-006" && ordainDayLocationName === "") {
checkForm.value = "FormHajj" checkForm.value = "FormHajj";
} else if (type === "LV-006") { } else if (type === "LV-006") {
checkForm.value = "FormUpasom" checkForm.value = "FormUpasom";
} else if (type === "LV-007") { } else if (type === "LV-007") {
checkForm.value = "FormCheckSelect" checkForm.value = "FormCheckSelect";
} else if (type === "LV-008" && studyDayTrainingSubject === "") { } else if (type === "LV-008" && studyDayTrainingSubject === "") {
checkForm.value = "FormStudy" checkForm.value = "FormStudy";
} else if (type === "LV-008") { } else if (type === "LV-008") {
checkForm.value = "FormLeaveToTraining" checkForm.value = "FormLeaveToTraining";
} else if (type === "LV-009") { } else if (type === "LV-009") {
checkForm.value = "FormLeaveToWorkInternational" checkForm.value = "FormLeaveToWorkInternational";
} else if (type === "LV-010") { } else if (type === "LV-010") {
checkForm.value = "FormSpouse" checkForm.value = "FormSpouse";
} else if (type === "LV-011") { } else if (type === "LV-011") {
checkForm.value = "FormVocationalRehabilitation" checkForm.value = "FormVocationalRehabilitation";
} }
} }
} }
@ -287,95 +335,100 @@ function checkLeaveType(leaveTypeId: string, leaveTypeName: string, ordainDayLoc
* @param id ยกเลิกการลา * @param id ยกเลิกการลา
*/ */
async function fetchDataCancelDetail(id: string) { async function fetchDataCancelDetail(id: string) {
showLoader() showLoader();
await http await http
.get(config.API.leaveCancelById(id)) .get(config.API.leaveCancelById(id))
.then(res => { .then((res) => {
const data = res.data.result const data = res.data.result;
formDataCancle.leaveTypeName = data.leaveTypeName ?? "-" formDataCancle.leaveTypeName = data.leaveTypeName ?? "-";
formDataCancle.leaveWrote = data.leaveWrote ?? "-" formDataCancle.leaveWrote = data.leaveWrote ?? "-";
formDataCancle.fullname = data.fullName ?? "-" formDataCancle.fullname = data.fullName ?? "-";
formDataCancle.status = convertStatud(data.status) ?? "-" formDataCancle.status = convertStatud(data.status) ?? "-";
formDataCancle.leaveStartDate = data.leaveStartDate && date2Thai(data.leaveStartDate) formDataCancle.leaveStartDate =
formDataCancle.leaveEndDate = data.leaveEndDate && date2Thai(data.leaveEndDate) data.leaveStartDate && date2Thai(data.leaveStartDate);
formDataCancle.leaveTotal = data.leaveTotal ?? "-" formDataCancle.leaveEndDate =
formDataCancle.leaveAddress = data.leaveAddress ?? "-" data.leaveEndDate && date2Thai(data.leaveEndDate);
formDataCancle.leaveNumber = data.leaveNumber ?? "-" formDataCancle.leaveTotal = data.leaveTotal ?? "-";
formDataCancle.leaveResonDelete = data.leaveReasonDelete ?? "-" formDataCancle.leaveAddress = data.leaveAddress ?? "-";
formDataCancle.leaveDetail = data.leaveDetail ?? "-" formDataCancle.leaveNumber = data.leaveNumber ?? "-";
formDataCancle.leaveDocDelete = data.leaveDocDelete ?? null formDataCancle.leaveResonDelete = data.leaveReasonDelete ?? "-";
formDataCancle.leaveDetail = data.leaveDetail ?? "-";
formDataCancle.leaveDocDelete = data.leaveDocDelete ?? null;
console.log(res) console.log(res);
}) })
.catch(err => { .catch((err) => {
messageError($q, err) messageError($q, err);
}) })
.finally(() => { .finally(() => {
hideLoader() hideLoader();
}) });
} }
/** function ยินยันการบันทึกข้อมูล*/ /** function ยินยันการบันทึกข้อมูล*/
async function onClickSave() { async function onClickSave() {
const hasError = [] const hasError = [];
for (const key in formDeleteRef) { for (const key in formDeleteRef) {
if (Object.prototype.hasOwnProperty.call(formDeleteRef, key)) { if (Object.prototype.hasOwnProperty.call(formDeleteRef, key)) {
const property = formDeleteRef[key] const property = formDeleteRef[key];
if (property.value && typeof property.value.validate === "function") { if (property.value && typeof property.value.validate === "function") {
const isValid = property.value.validate() const isValid = property.value.validate();
hasError.push(isValid) hasError.push(isValid);
} }
} }
} }
if (hasError.every(result => result === true)) { if (hasError.every((result) => result === true)) {
dialogConfirm( dialogConfirm(
$q, $q,
() => { () => {
onSubmit() onSubmit();
}, },
"ยืนยันการบันทึกข้อมูล", "ยืนยันการบันทึกข้อมูล",
"ต้องการยินยันการบันทึกข้อมูลนี้หรือไม่ ?" "ต้องการยินยันการบันทึกข้อมูลนี้หรือไม่ ?"
) );
} else { } else {
console.log(hasError) console.log(hasError);
} }
} }
/** function บันทึกข้อมูล*/ /** function บันทึกข้อมูล*/
async function onSubmit() { async function onSubmit() {
showLoader() showLoader();
const id = props.leaveId ? props.leaveId : "" const id = props.leaveId ? props.leaveId : "";
const formData = new FormData() const formData = new FormData();
formData.append("leaveWrote", formDelete.writeAt) formData.append("leaveWrote", formDelete.writeAt);
formData.append("reason", formDelete.reason) formData.append("reason", formDelete.reason);
formData.append("doc", formDelete.doc) formData.append("doc", formDelete.doc);
await http await http
.post(config.API.leaveCancelById(id), formData) .post(config.API.leaveCancelById(id), formData)
.then(() => { .then(() => {
success($q, "บันทึกข้อมูลสำเร็จ") success($q, "บันทึกข้อมูลสำเร็จ");
props.onClickClose?.() props.onClickClose?.();
}) })
.catch(err => { .catch((err) => {
messageError($q, err) messageError($q, err);
}) })
.finally(() => { .finally(() => {
props.fetchDataTable?.() props.fetchDataTable?.();
hideLoader() hideLoader();
}) });
} }
/**** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาแล้วเปิด modal */
watch( watch(
() => props.modal, () => props.modal,
() => { () => {
if (props.modal === true) { if (props.modal === true) {
formDelete.writeAt = "" formDelete.writeAt = "";
formDelete.reason = "" formDelete.reason = "";
formDelete.doc = null formDelete.doc = null;
props.leaveStatus === "DELETE" ? props.leaveId && fetchDataCancelDetail(props.leaveId) : props.leaveId && fetchDataDetail(props.leaveId) props.leaveStatus === "DELETE"
? props.leaveId && fetchDataCancelDetail(props.leaveId)
: props.leaveId && fetchDataDetail(props.leaveId);
} }
} }
) );
</script> </script>
<template> <template>
@ -384,20 +437,38 @@ watch(
<q-card-section class="row items-center q-pa-sm"> <q-card-section class="row items-center q-pa-sm">
<div class="text-bold q-pl-sm">{{ titleMain }}{{ titleName }}</div> <div class="text-bold q-pl-sm">{{ titleMain }}{{ titleName }}</div>
<q-space /> <q-space />
<q-btn icon="close" unelevated round dense @click="props.onClickClose" style="color: #ff8080; background-color: #ffdede" /> <q-btn
icon="close"
unelevated
round
dense
@click="props.onClickClose"
style="color: #ff8080; background-color: #ffdede"
/>
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-p-md row q-gutter-y-md"> <q-card-section class="q-p-md row q-gutter-y-md">
<div flat :class="props.leaveStatus === 'CANCEL' ? 'col-xs-6 col-sm-6' : 'col-12'"> <div
flat
:class="
props.leaveStatus === 'CANCEL' ? 'col-xs-6 col-sm-6' : 'col-12'
"
>
<div class="col-12 q-col-gutter-sm row items-center"></div> <div class="col-12 q-col-gutter-sm row items-center"></div>
<!-- ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว --> <!-- ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว -->
<FormLeave v-if="checkForm === 'FormLeave'" :data="formData" /> <FormLeave v-if="checkForm === 'FormLeave'" :data="formData" />
<!-- ลาไปช่วยเหลือภริยาที่คลอดบุตร --> <!-- ลาไปช่วยเหลือภริยาที่คลอดบุตร -->
<FormChildbirth v-else-if="checkForm === 'FormChildbirth'" :data="formData" /> <FormChildbirth
v-else-if="checkForm === 'FormChildbirth'"
:data="formData"
/>
<!-- ลาพักผ่อน --> <!-- ลาพักผ่อน -->
<FormHoliday v-else-if="checkForm === 'FormHoliday'" :data="formData" /> <FormHoliday
v-else-if="checkForm === 'FormHoliday'"
:data="formData"
/>
<!-- ลาอุปสมบท --> <!-- ลาอุปสมบท -->
<FormUpasom v-else-if="checkForm === 'FormUpasom'" :data="formData" /> <FormUpasom v-else-if="checkForm === 'FormUpasom'" :data="formData" />
@ -406,28 +477,70 @@ watch(
<FormHajj v-else-if="checkForm === 'FormHajj'" :data="formData" /> <FormHajj v-else-if="checkForm === 'FormHajj'" :data="formData" />
<!-- ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล --> <!-- ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล -->
<FormCheckSelect v-else-if="checkForm === 'FormCheckSelect'" :data="formData" /> <FormCheckSelect
v-else-if="checkForm === 'FormCheckSelect'"
:data="formData"
/>
<!-- ลาไปศึกษา --> <!-- ลาไปศึกษา -->
<FormStudy v-else-if="checkForm === 'FormStudy'" :data="formData" /> <FormStudy v-else-if="checkForm === 'FormStudy'" :data="formData" />
<!-- ลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน --> <!-- ลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน -->
<FormLeaveToTraining v-else-if="checkForm === 'FormLeaveToTraining'" :data="formData" /> <FormLeaveToTraining
v-else-if="checkForm === 'FormLeaveToTraining'"
:data="formData"
/>
<!-- ลาไปปฏิบัติงานในองค์การระหว่างประเทศ --> <!-- ลาไปปฏิบัติงานในองค์การระหว่างประเทศ -->
<FormLeaveToWorkInternational v-else-if="checkForm === 'FormLeaveToWorkInternational'" :data="formData" /> <FormLeaveToWorkInternational
v-else-if="checkForm === 'FormLeaveToWorkInternational'"
:data="formData"
/>
<!-- ลาติดตามคู่สมรส --> <!-- ลาติดตามคู่สมรส -->
<FormSpouse v-else-if="checkForm === 'FormSpouse'" :data="formData" /> <FormSpouse v-else-if="checkForm === 'FormSpouse'" :data="formData" />
<!-- ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ --> <!-- ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ -->
<FormVocationalRehabilitation v-else-if="checkForm === 'FormVocationalRehabilitation'" :data="formData" /> <FormVocationalRehabilitation
v-else-if="checkForm === 'FormVocationalRehabilitation'"
:data="formData"
/>
</div> </div>
<div flat class="col-xs-6 col-sm-6" v-if="props.leaveStatus === 'CANCEL'"> <div
<q-input ref="writeAtRef" v-model="formDelete.writeAt" label="เขียนที่" :rules="[val => !!val || 'กรุณากรอกเขียนที่']" lazy-rules outlined dense /> flat
<q-input ref="reasonRef" v-model="formDelete.reason" type="textarea" label="กรอกเหตุผล" :rules="[val => !!val || 'กรูณากรอกเหตุผล']" lazy-rules outlined dense /> class="col-xs-6 col-sm-6"
<q-file ref="docRef" outlined v-model="formDelete.doc" label="เลือกไฟล์เอกสารหลักฐาน" :rules="[val => !!val || 'กรูณา เลือกไฟล์เอกสารหลักฐาน']" lazy-rules use-chips dense> v-if="props.leaveStatus === 'CANCEL'"
>
<q-input
ref="writeAtRef"
v-model="formDelete.writeAt"
label="เขียนที่"
:rules="[(val) => !!val || 'กรุณากรอกเขียนที่']"
lazy-rules
outlined
dense
/>
<q-input
ref="reasonRef"
v-model="formDelete.reason"
type="textarea"
label="กรอกเหตุผล"
:rules="[(val) => !!val || 'กรูณากรอกเหตุผล']"
lazy-rules
outlined
dense
/>
<q-file
ref="docRef"
outlined
v-model="formDelete.doc"
label="เลือกไฟล์เอกสารหลักฐาน"
:rules="[(val) => !!val || 'กรูณา เลือกไฟล์เอกสารหลักฐาน']"
lazy-rules
use-chips
dense
>
<template v-slot:prepend> <template v-slot:prepend>
<q-icon name="attach_file" /> <q-icon name="attach_file" />
</template> </template>
@ -435,17 +548,36 @@ watch(
</div> </div>
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="row items-center q-pa-sm" v-if="props.leaveStatus === 'CANCEL'"> <q-card-section
class="row items-center q-pa-sm"
v-if="props.leaveStatus === 'CANCEL'"
>
<q-space /> <q-space />
<q-btn label="ยืนยัน" unelevated color="secondary" dense class="q-px-md" @click="onClickSave" /> <q-btn
label="ยืนยัน"
unelevated
color="secondary"
dense
class="q-px-md"
@click="onClickSave"
/>
</q-card-section> </q-card-section>
</q-card> </q-card>
<q-card q-card style="min-width: 70%" v-if="props.leaveStatus === 'DELETE'"> <q-card q-card style="min-width: 70%" v-if="props.leaveStatus === 'DELETE'">
<q-card-section class="row items-center q-pa-sm"> <q-card-section class="row items-center q-pa-sm">
<div class="text-bold q-pl-sm">{{ titleMainCancle }}{{ titleName }}</div> <div class="text-bold q-pl-sm">
{{ titleMainCancle }}{{ titleName }}
</div>
<q-space /> <q-space />
<q-btn icon="close" unelevated round dense @click="props.onClickClose" style="color: #ff8080; background-color: #ffdede" /> <q-btn
icon="close"
unelevated
round
dense
@click="props.onClickClose"
style="color: #ff8080; background-color: #ffdede"
/>
</q-card-section> </q-card-section>
<q-separator /> <q-separator />
<q-card-section class="q-p-md row q-gutter-y-md"> <q-card-section class="q-p-md row q-gutter-y-md">

48
src/modules/05_leave/components/FormLeave/01_SickForm.vue
View file

@ -16,16 +16,7 @@ const dataStore = useLeaveStore();
const $q = useQuasar(); const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const router = useRouter(); const router = useRouter();
const { const { date2Thai, dateToISO, messageError, dialogRemove } = mixin;
date2Thai,
dateToISO,
dialogConfirm,
success,
messageError,
fails,
showLoader,
hideLoader,
} = mixin;
const edit = ref<boolean>(true); const edit = ref<boolean>(true);
/** รับ props มาจากหน้าหลัก */ /** รับ props มาจากหน้าหลัก */
@ -143,6 +134,7 @@ function onValidate() {
props.onSubmit(formData, isLeave.value); props.onSubmit(formData, isLeave.value);
} }
} }
/** /**
* check ว่าลาได้ไหม จาก api * check ว่าลาได้ไหม จาก api
* @param formData * @param formData
@ -166,6 +158,26 @@ async function fetchCheck() {
}); });
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** /**
* ฟังก์ชั่นแปลงครึ่งวัน/ทั้งวัน * ฟังก์ชั่นแปลงครึ่งวัน/ทั้งวัน
*/ */
@ -189,12 +201,13 @@ function inputEdit(val: boolean) {
}; };
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */ /** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const statusCheck = ref<any>("");
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
formDataSick.leaveWrote = props.data.leaveWrote; formDataSick.leaveWrote = props.data.leaveWrote;
@ -212,6 +225,7 @@ watch(props.data, () => {
} }
}); });
/** Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
formDataSick.leaveWrote = props.data.leaveWrote; formDataSick.leaveWrote = props.data.leaveWrote;
@ -504,9 +518,21 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/03_Birth.vue
View file

@ -13,7 +13,7 @@ const dataStore = useLeaveStore();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const router = useRouter(); const router = useRouter();
const $q = useQuasar(); const $q = useQuasar();
const { date2Thai, dateToISO, dialogConfirm, success, messageError, fails } = const { date2Thai, dateToISO, dialogRemove, success, messageError, fails } =
mixin; mixin;
const edit = ref<boolean>(true); const edit = ref<boolean>(true);
@ -138,13 +138,34 @@ async function fetchCheck() {
}); });
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
formDataBirth.leaveWrote = props.data.leaveWrote; formDataBirth.leaveWrote = props.data.leaveWrote;
@ -160,6 +181,7 @@ watch(props.data, () => {
} }
}); });
/** Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
formDataBirth.leaveWrote = props.data.leaveWrote; formDataBirth.leaveWrote = props.data.leaveWrote;
@ -423,9 +445,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/04_HelpWifeBirthForm.vue
View file

@ -20,7 +20,7 @@ const {
date2Thai, date2Thai,
calculateDurationYmd, calculateDurationYmd,
dateToISO, dateToISO,
dialogConfirm, dialogRemove,
fails, fails,
success, success,
messageError, messageError,
@ -43,6 +43,26 @@ const props = defineProps({
}, },
}); });
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** ข้อมูล v-model ของฟอร์ม */ /** ข้อมูล v-model ของฟอร์ม */
const formDataHelpWife = reactive<any>({ const formDataHelpWife = reactive<any>({
type: dataStore.typeId, type: dataStore.typeId,
@ -168,13 +188,14 @@ async function fetchCheck() {
}); });
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
// console.log("data==>", props.data) // console.log("data==>", props.data)
@ -193,6 +214,7 @@ watch(props.data, () => {
} }
}); });
/**Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
// console.log("data==>", props.data) // console.log("data==>", props.data)
@ -507,9 +529,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/05_VacationForm.vue
View file

@ -16,7 +16,7 @@ const $q = useQuasar();
const dataStore = useLeaveStore(); const dataStore = useLeaveStore();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const router = useRouter(); const router = useRouter();
const { date2Thai, dateToISO, dialogConfirm, success, messageError, fails } = const { date2Thai, dateToISO, dialogRemove, success, messageError, fails } =
mixin; mixin;
const edit = ref<boolean>(true); const edit = ref<boolean>(true);
@ -127,6 +127,26 @@ function onValidate() {
} }
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** /**
* check ว่าลาได้ไหม จาก api * check ว่าลาได้ไหม จาก api
* @param formData * @param formData
@ -178,13 +198,14 @@ const isReadOnly = computed(() => {
return conditionleaveRange; return conditionleaveRange;
}); });
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
// console.log("data==>", props.data) // console.log("data==>", props.data)
@ -204,6 +225,7 @@ watch(props.data, () => {
} }
}); });
/**Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
// console.log("data==>", props.data) // console.log("data==>", props.data)
@ -506,9 +528,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/06_OrdinationForm.vue
View file

@ -15,7 +15,7 @@ const router = useRouter();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
dialogConfirm, dialogRemove,
calculateDurationYmd, calculateDurationYmd,
fails, fails,
dateToISO, dateToISO,
@ -197,13 +197,14 @@ function updateLeaveTotal() {
formDataOrdination.leaveTotal = newLeaveTotal; formDataOrdination.leaveTotal = newLeaveTotal;
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
formDataOrdination.leaveWrote = props.data.leaveWrote; formDataOrdination.leaveWrote = props.data.leaveWrote;
@ -228,6 +229,7 @@ watch(props.data, () => {
} }
}); });
/** Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
formDataOrdination.leaveWrote = props.data.leaveWrote; formDataOrdination.leaveWrote = props.data.leaveWrote;
@ -251,6 +253,26 @@ onMounted(() => {
// formDataOrdination.leaveDocument = props.data.leaveDocument; // formDataOrdination.leaveDocument = props.data.leaveDocument;
} }
}); });
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
</script> </script>
<!-- ฟอร์ม ลาอุปสมบท --> <!-- ฟอร์ม ลาอุปสมบท -->
@ -688,9 +710,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/07_HajjForm.vue
View file

@ -15,7 +15,7 @@ const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
dialogConfirm, dialogRemove,
calculateDurationYmd, calculateDurationYmd,
fails, fails,
messageError, messageError,
@ -149,13 +149,14 @@ function updateLeaveTotal() {
formDataHaji.leaveTotal = newLeaveTotal; formDataHaji.leaveTotal = newLeaveTotal;
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
formDataHaji.leaveWrote = props.data.leaveWrote; formDataHaji.leaveWrote = props.data.leaveWrote;
@ -171,6 +172,7 @@ watch(props.data, () => {
} }
}); });
/**Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
formDataHaji.leaveWrote = props.data.leaveWrote; formDataHaji.leaveWrote = props.data.leaveWrote;
@ -185,6 +187,26 @@ onMounted(() => {
// formDataHaji.leaveDocument = props.data.leaveDocument; // formDataHaji.leaveDocument = props.data.leaveDocument;
} }
}); });
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
</script> </script>
<template> <template>
@ -453,9 +475,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/08_MilitaryForm.vue
View file

@ -15,7 +15,7 @@ const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
dialogConfirm, dialogRemove,
calculateDurationYmd, calculateDurationYmd,
dateToISO, dateToISO,
success, success,
@ -155,6 +155,26 @@ async function fetchCheck() {
}); });
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** /**
* function อัพเดทค่า LeaveTotal * function อัพเดทค่า LeaveTotal
*/ */
@ -167,13 +187,14 @@ function updateLeaveTotal() {
console.log("test"); console.log("test");
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
formDataMilitary.leaveWrote = props.data.leaveWrote; formDataMilitary.leaveWrote = props.data.leaveWrote;
@ -192,6 +213,7 @@ watch(props.data, () => {
} }
}); });
/**Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
formDataMilitary.leaveWrote = props.data.leaveWrote; formDataMilitary.leaveWrote = props.data.leaveWrote;
@ -508,9 +530,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/09_StudyForm.vue
View file

@ -15,7 +15,7 @@ const router = useRouter();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
dialogConfirm, dialogRemove,
calculateDurationYmd, calculateDurationYmd,
fails, fails,
dateToISO, dateToISO,
@ -154,6 +154,27 @@ function onValidate() {
} }
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
@ -191,9 +212,9 @@ function updateLeaveTotal() {
formDataStudy.leaveTotal = newLeaveTotal; formDataStudy.leaveTotal = newLeaveTotal;
} }
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, async () => { watch(props.data, async () => {
if (props.data) { if (props.data) {
formDataStudy.leaveWrote = props.data.leaveWrote; formDataStudy.leaveWrote = props.data.leaveWrote;
@ -224,6 +245,7 @@ watch(props.data, async () => {
} }
}); });
/**Hook */
onMounted(async () => { onMounted(async () => {
if (props.data) { if (props.data) {
formDataStudy.leaveWrote = props.data.leaveWrote; formDataStudy.leaveWrote = props.data.leaveWrote;
@ -664,9 +686,20 @@ onMounted(async () => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/10_TrainForm.vue
View file

@ -15,7 +15,7 @@ const router = useRouter();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
dialogConfirm, dialogRemove,
arabicNumberToText, arabicNumberToText,
calculateDurationYmd, calculateDurationYmd,
fails, fails,
@ -175,6 +175,26 @@ async function fetchCheck() {
}); });
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** /**
* function อัพเดทค่า LeaveTotal * function อัพเดทค่า LeaveTotal
*/ */
@ -195,13 +215,14 @@ const formattedSalary = computed(() => {
: ""; : "";
}); });
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, async () => { watch(props.data, async () => {
if (props.data) { if (props.data) {
formDataTrain.leaveWrote = props.data.leaveWrote; formDataTrain.leaveWrote = props.data.leaveWrote;
@ -230,6 +251,7 @@ watch(props.data, async () => {
} }
}); });
/**Hook */
onMounted(async () => { onMounted(async () => {
if (props.data) { if (props.data) {
formDataTrain.leaveWrote = props.data.leaveWrote; formDataTrain.leaveWrote = props.data.leaveWrote;
@ -653,9 +675,20 @@ onMounted(async () => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/11_WorkInternationalForm.vue
View file

@ -15,7 +15,7 @@ const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
dialogConfirm, dialogRemove,
fails, fails,
dateToISO, dateToISO,
success, success,
@ -142,6 +142,26 @@ async function onClickDownloadFile(id: string, fileName: string) {
}); });
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** /**
* check ว่าลาได้ไหม จาก api * check ว่าลาได้ไหม จาก api
* @param formData * @param formData
@ -164,14 +184,15 @@ async function fetchCheck() {
}); });
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const leaveDraftDocument = ref<string>(); const leaveDraftDocument = ref<string>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props, () => { watch(props, () => {
if (props.data) { if (props.data) {
formDataWorkInternational.leaveWrote = props.data.leaveWrote; formDataWorkInternational.leaveWrote = props.data.leaveWrote;
@ -188,6 +209,7 @@ watch(props, () => {
} }
}); });
/**Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
formDataWorkInternational.leaveWrote = props.data.leaveWrote; formDataWorkInternational.leaveWrote = props.data.leaveWrote;
@ -404,9 +426,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/12_FollowSpouseForm.vue
View file

@ -17,7 +17,7 @@ const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const router = useRouter(); const router = useRouter();
const { const {
dialogConfirm, dialogRemove,
date2Thai, date2Thai,
arabicNumberToText, arabicNumberToText,
calculateDurationYmd, calculateDurationYmd,
@ -198,6 +198,26 @@ async function fetchCheck() {
}); });
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** /**
* function อัพเดทค่า LeaveTotal * function อัพเดทค่า LeaveTotal
*/ */
@ -222,13 +242,14 @@ function updateLeaveHistoryTotal() {
formDataFollowSpouse.coupleDayTotalHistory = newLeaveTotal; formDataFollowSpouse.coupleDayTotalHistory = newLeaveTotal;
} }
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, async () => { watch(props.data, async () => {
if (props.data) { if (props.data) {
formDataFollowSpouse.leaveWrote = props.data.leaveWrote; formDataFollowSpouse.leaveWrote = props.data.leaveWrote;
@ -269,6 +290,7 @@ watch(props.data, async () => {
} }
}); });
/**Hook */
onMounted(async () => { onMounted(async () => {
if (props.data) { if (props.data) {
formDataFollowSpouse.leaveWrote = props.data.leaveWrote; formDataFollowSpouse.leaveWrote = props.data.leaveWrote;
@ -726,9 +748,20 @@ onMounted(async () => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

37
src/modules/05_leave/components/FormLeave/13_RehabilitationForm.vue
View file

@ -15,7 +15,7 @@ const $q = useQuasar();
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { const {
date2Thai, date2Thai,
dialogConfirm, dialogRemove,
fails, fails,
dateToISO, dateToISO,
success, success,
@ -159,14 +159,35 @@ async function onClickDownloadFile(id: string, fileName: string) {
}); });
} }
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** แจ้งเมื่อวันลาไม่ถูกต้อง */
const dateEndInputStyle = computed(() => { const dateEndInputStyle = computed(() => {
return !isLeave.value ? "input-alert" : ""; return !isLeave.value ? "input-alert" : "";
}); });
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
const leaveDocumentList = ref<any>(); const leaveDocumentList = ref<any>();
const leaveDraftDocument = ref<string>(); const leaveDraftDocument = ref<string>();
const statusCheck = ref<any>(""); const statusCheck = ref<any>("");
/** ตรวจสอบว่ามีการส่งข้อมูลเข้ามาที่ฟอร์มไหม เมื่อมีการส่งจะ map ข้อมูลเข้า v-model ของฟอร์ม */
watch(props.data, () => { watch(props.data, () => {
if (props.data) { if (props.data) {
formDataRehabilitation.leaveWrote = props.data.leaveWrote; formDataRehabilitation.leaveWrote = props.data.leaveWrote;
@ -181,6 +202,7 @@ watch(props.data, () => {
} }
}); });
/**Hook */
onMounted(() => { onMounted(() => {
if (props.data) { if (props.data) {
formDataRehabilitation.leaveWrote = props.data.leaveWrote; formDataRehabilitation.leaveWrote = props.data.leaveWrote;
@ -374,9 +396,20 @@ onMounted(() => {
color="blue" color="blue"
label="ดาวน์โหลด" label="ดาวน์โหลด"
size="12px" size="12px"
class="q-mr-md"
> >
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
</q-btn> </q-btn>
<q-btn
@click="clickDelete"
target="_blank"
outline
color="red"
label="ลบไฟล์"
size="12px"
>
<q-tooltip>ลบไฟล์</q-tooltip>
</q-btn>
</q-item-label> </q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>

2
src/modules/05_leave/components/FormLeave/Form.vue
View file

@ -5,6 +5,7 @@ import { useQuasar } from "quasar";
import type { FormData } from "@/modules/05_leave/interface/request/AddAbsence"; import type { FormData } from "@/modules/05_leave/interface/request/AddAbsence";
import { useLeaveStore } from "@/modules/05_leave/store"; import { useLeaveStore } from "@/modules/05_leave/store";
/**ตัวแปรที่ใช้ */
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const dataStore = useLeaveStore(); const dataStore = useLeaveStore();
const { date2Thai } = mixin; const { date2Thai } = mixin;
@ -31,6 +32,7 @@ const formData = reactive<FormData>({
leaveRemaining: "1", leaveRemaining: "1",
}); });
/**Hook */
onMounted(() => { onMounted(() => {
dataStore.typeLeave = ""; dataStore.typeLeave = "";
}); });

54
src/modules/05_leave/components/ListView.vue
View file

@ -16,13 +16,24 @@ import Table from "@/modules/05_leave/components/Table.vue";
import { useCounterMixin } from "@/stores/mixin"; import { useCounterMixin } from "@/stores/mixin";
import { useLeaveStore } from "@/modules/05_leave/store"; import { useLeaveStore } from "@/modules/05_leave/store";
/**ตัวแปรที่ใช้ */
const mixin = useCounterMixin(); const mixin = useCounterMixin();
const { showLoader, hideLoader, messageError, date2Thai, monthYear2Thai } = const {
mixin; showLoader,
hideLoader,
messageError,
date2Thai,
monthYear2Thai,
dialogRemove,
} = mixin;
const LeaveData = useLeaveStore(); const LeaveData = useLeaveStore();
const router = useRouter(); const router = useRouter();
const route = useRoute(); const route = useRoute();
const $q = useQuasar(); const $q = useQuasar();
const leaveType = ref<LeaveType[]>();
const modal = ref<boolean>(false);
const leaveId = ref<string>("");
const leaveStatus = ref<string>("");
/** filter */ /** filter */
const year = ref<number>(new Date().getFullYear()); const year = ref<number>(new Date().getFullYear());
@ -61,7 +72,6 @@ async function fetchDataTable() {
}); });
} }
const leaveType = ref<LeaveType[]>();
/** function เรียกประเภทการลา */ /** function เรียกประเภทการลา */
async function fectOptionType() { async function fectOptionType() {
await http await http
@ -75,10 +85,6 @@ async function fectOptionType() {
}); });
} }
const modal = ref<boolean>(false);
const leaveId = ref<string>("");
const leaveStatus = ref<string>("");
/** /**
* function openPopupDateail * function openPopupDateail
* @param id การลา * @param id การลา
@ -90,10 +96,34 @@ const onClickView = async (id: string, status: string) => {
leaveStatus.value = status; leaveStatus.value = status;
}; };
/**
* function ไปหน้า edit
* @param id
*/
const onClickEdit = async (id: string) => { const onClickEdit = async (id: string) => {
router.push(`/leave/edit/${id}`); router.push(`/leave/edit/${id}`);
}; };
//เเจ้งเตือนลบข้อมูล
const clickDelete = (id: string) => {
dialogRemove($q, () => onClickDelete(id));
};
/**
* function ลบรายการ
* @param id
*/
const onClickDelete = async (id: string) => {
await http
.delete(config.API.leaveUserId(id))
.then(async (res) => {
console.log("delete");
})
.catch((err) => {
messageError($q, err);
});
};
/** function closePopup*/ /** function closePopup*/
async function onClickClose() { async function onClickClose() {
modal.value = false; modal.value = false;
@ -265,6 +295,16 @@ onMounted(async () => {
<q-item-label>แก้ไข</q-item-label> <q-item-label>แก้ไข</q-item-label>
</q-item-section> </q-item-section>
</q-item> </q-item>
<q-item
v-if="props.row.status == 'DRAFT'"
clickable
v-close-popup
@click="clickDelete(props.row.id)"
>
<q-item-section>
<q-item-label>ลบรายการการลา</q-item-label>
</q-item-section>
</q-item>
</q-list> </q-list>
</q-menu> </q-menu>
</q-btn> </q-btn>

11
src/modules/05_leave/components/formDetail/01_SickForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,
@ -33,7 +36,13 @@ const props = defineProps({
<div class="row"> <div class="row">
<div class="col text-grey-8">จำนวนวันที่ลา</div> <div class="col text-grey-8">จำนวนวันที่ลา</div>
<div class="col"> <div class="col">
{{ props.data.leaveRange == 'ALL' ? props.data.leaveTotal + ' วัน' : props.data.leaveRange == 'MORNING' ? 'ลาครึ่งวันเช้า (0.5)': 'ลาครึ่งวันบ่าย (0.5)' }} {{
props.data.leaveRange == "ALL"
? props.data.leaveTotal + " วัน"
: props.data.leaveRange == "MORNING"
? "ลาครึ่งวันเช้า (0.5)"
: "ลาครึ่งวันบ่าย (0.5)"
}}
</div> </div>
</div> </div>
<div class="row"> <div class="row">

3
src/modules/05_leave/components/formDetail/04_HelpWifeBirthForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

11
src/modules/05_leave/components/formDetail/05_VacationForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,
@ -41,7 +44,13 @@ const props = defineProps({
<div class="row"> <div class="row">
<div class="col text-grey-8">จำนวนวันที่ลา</div> <div class="col text-grey-8">จำนวนวันที่ลา</div>
<div class="col"> <div class="col">
{{ props.data.leaveRange == 'ALL' ? props.data.leaveTotal + ' วัน' : props.data.leaveRange == 'MORNING' ? 'ลาครึ่งวันเช้า (0.5)': 'ลาครึ่งวันบ่าย (0.5)' }} {{
props.data.leaveRange == "ALL"
? props.data.leaveTotal + " วัน"
: props.data.leaveRange == "MORNING"
? "ลาครึ่งวันเช้า (0.5)"
: "ลาครึ่งวันบ่าย (0.5)"
}}
</div> </div>
</div> </div>
<div class="row"> <div class="row">

3
src/modules/05_leave/components/formDetail/06_OrdinationForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

3
src/modules/05_leave/components/formDetail/07_HajjForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

3
src/modules/05_leave/components/formDetail/08_MilitaryForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

3
src/modules/05_leave/components/formDetail/09_StudyForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

3
src/modules/05_leave/components/formDetail/10_TrainForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

3
src/modules/05_leave/components/formDetail/11_WorkInternationalForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

3
src/modules/05_leave/components/formDetail/12_FollowSpouseForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

3
src/modules/05_leave/components/formDetail/13_RehabilitationForm.vue
View file

@ -1,4 +1,7 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,

17
src/modules/05_leave/components/formDetail/formCancel.vue
View file

@ -1,12 +1,14 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,
required: true, required: true,
}, },
}) });
</script> </script>
<template> <template>
<q-card-section> <q-card-section>
<div class="q-pa-md q-gutter-md"> <div class="q-pa-md q-gutter-md">
@ -57,7 +59,16 @@ const props = defineProps({
<div class="row"> <div class="row">
<div class="col text-grey-8">เอกสารการยกเลิกการลา</div> <div class="col text-grey-8">เอกสารการยกเลิกการลา</div>
<div class="col" v-if="props.data.leaveDocDelete"> <div class="col" v-if="props.data.leaveDocDelete">
<q-btn :href="props.data.leaveDocDelete" target="_blank" outline color="blue" label="ดาวน์โหลด" size="12px"> <q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn> <q-btn
:href="props.data.leaveDocDelete"
target="_blank"
outline
color="blue"
label="ดาวน์โหลด"
size="12px"
>
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
>
</div> </div>
<div class="col" v-else>-</div> <div class="col" v-else>-</div>
</div> </div>

4
src/modules/05_leave/components/formDetail/formMain.vue
View file

@ -1,11 +1,13 @@
<script setup lang="ts"> <script setup lang="ts">
/**
* รับ prop จาก component
*/
const props = defineProps({ const props = defineProps({
data: { data: {
type: Object, type: Object,
required: true, required: true,
}, },
}); });
console.log(props);
</script> </script>
<template> <template>
<q-card-section> <q-card-section>