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

Refactoring code 09_leave

Browse source
This commit is contained in:
STW_TTTY\stwtt 2024-09-18 17:26:53 +07:00
parent d20fdb0190
commit 94eb31fc26
27 changed files with 289 additions and 577 deletions
Download patch file Download diff file Expand all files Collapse all files

2
src/modules/09_leave/components/1_Work/DialogMap.vue
View file

@ -108,7 +108,7 @@ watch(
unelevated
round
dense
@click="props.close"
@click="props.close?.()"
style="color: #eb0505; background-color: #ffdede"
/>
</q-toolbar>

7
src/modules/09_leave/components/1_Work/DialogReport.vue
View file

@ -1,9 +1,11 @@
<script setup lang="ts">
import { ref, watch } from "vue";
import { useQuasar } from "quasar";
import axios from "axios";
import http from "@/plugins/http";
import config from "@/app.config";
import axios from "axios";
import { useCounterMixin } from "@/stores/mixin";
/** importType*/
import type {
@ -14,9 +16,6 @@ import type {
/** importComponents*/
import Header from "@/components/DialogHeader.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
/** use*/
const mixin = useCounterMixin();
const $q = useQuasar();

6
src/modules/09_leave/components/1_Work/Tab1.vue
View file

@ -18,14 +18,14 @@ import TableList from "@/modules/09_leave/components/1_Work/TableList.vue";
/** importStores */
import { useCounterMixin } from "@/stores/mixin";
import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
/** useStore */
const $q = useQuasar(); //ใช้ noti quasar
const mixin = useCounterMixin();
const workStore = useWorklistDataStore();
const { date2Thai, dateToISO, showLoader, hideLoader, messageError } = mixin;
const total = ref<number>(0);
const $q = useQuasar(); //ใช้ noti quasar
/** ตัวแปร querySting*/
const total = ref<number>(0);
const keyword = ref<string>("");
const page = ref<number>(1);
const rowsPerPage = ref<number>(10);

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

@ -18,6 +18,7 @@ import TableList from "@/modules/09_leave/components/1_Work/TableList.vue";
/** importStores */
import { useCounterMixin } from "@/stores/mixin";
import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
/** useStore */
const total = ref<number>(0);
const mixin = useCounterMixin();

15
src/modules/09_leave/components/1_Work/TableList.vue
View file

@ -1,25 +1,14 @@
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
/** importType*/
import type { QTableProps } from "quasar";
import { checkPermission } from "@/utils/permissions";
import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
/** importComponents */
import DialogDetail from "@/modules/09_leave/components/1_Work/DialogDetail.vue";
import DialogEdit from "@/modules/09_leave/components/1_Work/DialogEdit.vue";
/** importStores */
import { useCounterMixin } from "@/stores/mixin";
import { useWorklistDataStore } from "@/modules/09_leave/stores/WorkStore";
import { checkPermission } from "@/utils/permissions";
/** useStore */
const mixin = useCounterMixin();
const workStore = useWorklistDataStore();
const { date2Thai } = mixin;
// const { searchDataFn, filterFn } = workStore;
const props = defineProps({
rows: {
type: Object,

51
src/modules/09_leave/components/2_Leave/Calendar.vue
View file

@ -2,28 +2,29 @@
import { ref, watch, onMounted } from "vue";
import { useRouter } from "vue-router";
import { useQuasar } from "quasar";
import type { CalendarOptions } from "@fullcalendar/core";
import moment from "moment";
import FullCalendar from "@fullcalendar/vue3";
import dayGridPlugin from "@fullcalendar/daygrid";
import timeGridPlugin from "@fullcalendar/timegrid";
import interactionPlugin from "@fullcalendar/interaction";
import allLocales from "@fullcalendar/core/locales-all";
import listPlugin from "@fullcalendar/list";
import http from "@/plugins/http";
import config from "@/app.config";
import moment from "moment";
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
import { checkPermission } from "@/utils/permissions";
/** importType*/
import type { CalendarOptions } from "@fullcalendar/core";
import type {
DataDateMonthObject,
ResCalendar,
} from "@/modules/09_leave/interface/response/leave";
import { tokenParsed } from "@/plugins/auth";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
/** use*/
const leaveStore = useLeavelistDataStore();
const mixin = useCounterMixin(); //เรียกฟังก์ชันกลาง
@ -51,7 +52,7 @@ const calendarOptions = ref<CalendarOptions>({
},
headerToolbar: false,
initialView: "dayGridMonth",
initialEvents: [], // alternatively, use the `events` setting to fetch from a feed
initialEvents: [],
selectable: true,
dayMaxEvents: true,
weekends: true,
@ -177,6 +178,20 @@ function convertKeycloakId(id: any) {
const filterLists = ref<any[]>([]);
const filterVal = ref<any>([]);
function redirectToDetail(id: string) {
router.push(`leave/detail/${id}`);
}
/** function เปลี่ยน calendar*/
async function changCalendar() {
await fetchDataCalendar("chang");
}
function monthYearThai(val: DataDateMonthObject) {
if (val == null) return "";
else return monthYear2Thai(val.month, val.year);
}
watch(
() => filterVal.value,
async () => {
@ -199,10 +214,6 @@ watch(
}
);
function redirectToDetail(id: string) {
router.push(`leave/detail/${id}`);
}
/**
* เรียกฟังก์ชันทั้งหมดตอนเรียกใช้ไฟล์นี้
*/
@ -211,23 +222,12 @@ onMounted(async () => {
keycloakId.value = user?.sub;
await fetchDataCalendar("onMounted");
});
/** function เปลี่ยน calendar*/
async function changCalendar() {
await fetchDataCalendar("chang");
}
const monthYearThai = (val: DataDateMonthObject) => {
if (val == null) return "";
else return monthYear2Thai(val.month, val.year);
};
</script>
<template>
<div class="q-mt-sm">
<div class="row q-gutter-sm">
<div class="col-3">
<q-list bordered class="rounded-borders">
<!-- <q-item-label header>User</q-item-label> -->
<q-item
v-for="(item, i) in filterLists"
:key="i"
@ -377,13 +377,6 @@ const monthYearThai = (val: DataDateMonthObject) => {
display: flex;
justify-content: center;
align-items: center;
/* border: 2px solid #17a259; */
/* border-radius: 50%;
height: 25px;
width: 25px;
font-weight: bold;
color: white !important;
background: #17a259; */
}
.fc-day-today .fc-daygrid-day-frame {

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

@ -2,13 +2,13 @@
import { ref, reactive, onMounted } from "vue";
import { useRoute, useRouter } from "vue-router";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import genReport from "@/plugins/genreport";
/** importStore */
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
import DialogReason from "@/components/Dialogs/PopupReason.vue";
/** importType */
@ -48,18 +48,9 @@ const paramsId = route.params.id.toString();
const modalApprove = ref(false);
const typeDocx = ref<string>("docx");
const typePdf = ref<string>("pdf");
const dialogTitleUnapprove = ref<string>("ไม่อนุมัติ");
const dialogTitle = ref<string>("อนุมัติ");
const dialogLabel = ref<string>("เหตุผล");
/** ฟังก์ชั่น อัปโหลด
* consolelog ไว้ก่อน
*/
const filesUpload = ref<any>(null);
function upLoadFile() {
// console.log("upload", filesUpload.value);
}
/** Form รายละเอียดข้อมูล*/
const formData = reactive<FremData>({
id: "", //Id การยื่นขอลา
@ -79,8 +70,6 @@ const formData = reactive<FremData>({
leaveLimit: 0, //โควต้าลา(แต่ละประเภท)หน่วยเป็นวัน
leaveSummary: 0, //ลาป่วยไปแล้ว(แต่ละประเภท)หน่วยเป็นวัน
leaveRemain: 0, //คงเหลือโควต้า(แต่ละประเภท)หน่วยเป็นวัน
// leaveStartDate: new Date(), //*วัน เดือน ปีเริ่มต้นลา
// leaveEndDate: new Date(), //*วัน เดือน ปีสิ้นสุดลา
leaveWrote: "", //เขียนที่
leaveAddress: "", //สถานที่ติดต่อขณะลา
leaveNumber: "", //หมายเลขที่ติดต่อขณะลา
@ -133,13 +122,6 @@ const formData = reactive<FremData>({
leaveRange: "",
});
onMounted(async () => {
// showLoader();
if (paramsId) {
await fetchDetailLeave(paramsId);
}
});
/**
* Function fetch รายละเอียดของข้อมูล
* @param paramsId รับ ID จาก paramID
@ -476,6 +458,13 @@ async function onClickDownloadFile(id: string, fileName: string, type: string) {
function formattedNumber(x: number) {
return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
}
onMounted(async () => {
// showLoader();
if (paramsId) {
await fetchDetailLeave(paramsId);
}
});
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">
@ -494,17 +483,6 @@ function formattedNumber(x: number) {
รายละเอียดการลาของ {{ formData.fullName }}
</div>
<div>
<!-- <q-btn
icon="mdi-download"
unelevated
round
dense
flat
color="primary"
class="q-mr-sm"
@click="onClickDownloadFile(formData.id, formData.leaveTypeName)"
><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
> -->
<q-btn class="q-mr-sm" icon="mdi-download" round color="primary" flat>
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
<q-menu>
@ -554,29 +532,6 @@ function formattedNumber(x: number) {
</q-btn>
</div>
<q-space />
<!-- <q-file
v-model="filesUpload"
dense
label="อัปโหลดไฟล์"
outlined
class="col-xs-12 col-sm-3 col-md-2"
bg-color="white"
multiple
accept="application/pdf"
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file> -->
<!-- <q-btn
v-if="filesUpload"
flat
round
color="primary"
icon="mdi-arrow-up-bold"
@click="upLoadFile"
><q-tooltip>อัปโหลด</q-tooltip></q-btn
> -->
</div>
</div>
<q-card flat bordered class="col-12 q-mt-sm">

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

@ -2,14 +2,12 @@
import { ref, reactive, onMounted } from "vue";
import { useRoute, useRouter } from "vue-router";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import genReport from "@/plugins/genreport";
/** importStore */
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
import DialogReason from "@/components/Dialogs/PopupReason.vue";
/** importType */
import type {
@ -17,7 +15,9 @@ import type {
FormReject,
} from "@/modules/09_leave/interface/response/leave";
import type { FremData } from "@/modules/09_leave/interface/request/leave";
/** importForm*/
import DialogReason from "@/components/Dialogs/PopupReason.vue";
import FormMain from "@/modules/09_leave/components/2_Leave/formDetail/formMain.vue"; // from ซ้าย
import FormLeave from "@/modules/09_leave/components/2_Leave/formDetail/formLeave.vue"; // ลาป่วย ลาคลอดบุตร และลากิจส่วนตัว
import FormChildbirth from "@/modules/09_leave/components/2_Leave/formDetail/formChildbirth.vue"; // ลาไปช่วยเหลือภริยาที่คลอดบุตร
@ -429,17 +429,6 @@ async function onClickDownloadFile(id: string, fileName: string, type: string) {
รายละเอียดการขอยกเลิกของ {{ formData.fullName }}
</div>
<div>
<!-- <q-btn
icon="mdi-download"
unelevated
round
dense
flat
color="primary"
class="q-mr-sm"
@click="onClickDownloadFile(formData.id, formData.leaveTypeName)"
><q-tooltip>ดาวน์โหลดไฟล์</q-tooltip></q-btn
> -->
<q-btn class="q-mr-sm" icon="mdi-download" round color="primary" flat>
<q-tooltip>ดาวน์โหลดไฟล์</q-tooltip>
<q-menu>
@ -481,29 +470,7 @@ async function onClickDownloadFile(id: string, fileName: string, type: string) {
</q-btn>
</div>
<q-space />
<!-- <q-file
v-model="filesUpload"
dense
label="อัปโหลดไฟล์"
outlined
class="col-xs-12 col-sm-3 col-md-2"
bg-color="white"
multiple
accept="application/pdf"
>
<template v-slot:prepend>
<q-icon name="attach_file" color="primary" />
</template>
</q-file> -->
<!-- <q-btn
v-if="filesUpload"
flat
round
color="primary"
icon="mdi-arrow-up-bold"
@click="upLoadFile"
><q-tooltip>อัปโหลด</q-tooltip></q-btn
> -->
</div>
</div>
<q-card flat bordered class="col-12 q-mt-sm">

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

@ -1,8 +1,11 @@
<script setup lang="ts">
import { ref, reactive, onMounted, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
/**importType*/
import type {
@ -14,10 +17,6 @@ import TableList from "@/modules/09_leave/components/2_Leave/TableList.vue";
import ToolBar from "@/modules/09_leave/components/2_Leave/ToolBarLeave.vue";
import CalendarView from "@/modules/09_leave/components/2_Leave/Calendar.vue";
/**importStroe*/
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
const $q = useQuasar(); //ใช้ noti quasar
const mixin = useCounterMixin();
const leaveStore = useLeavelistDataStore();
@ -61,8 +60,6 @@ async function fecthLeaveList() {
hideLoader();
});
}
// const data = APIDATA.data;
// maxPage.value = Math.ceil(data.length / querySting.pageSize);
}
/**
@ -99,11 +96,6 @@ async function fetchOption() {
.finally(() => {});
}
onMounted(async () => {
await fetchOption();
await fecthLeaveList();
});
watch(
() => leaveStore.tabView,
async () => {
@ -111,6 +103,11 @@ watch(
(await fecthLeaveList(), await fetchOption());
}
);
onMounted(async () => {
await fetchOption();
await fecthLeaveList();
});
</script>
<template>
<q-toolbar class="text-primary" style="padding: 0">

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

@ -1,8 +1,11 @@
<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
/**importType*/
import type {
@ -13,10 +16,6 @@ import type {
import TableList from "@/modules/09_leave/components/2_Leave/TableList.vue";
import ToolBar from "@/modules/09_leave/components/2_Leave/ToolBarLeave.vue";
/**importStroe*/
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
const mixin = useCounterMixin();
const leaveStore = useLeavelistDataStore();
const { showLoader, hideLoader, messageError } = mixin;

42
src/modules/09_leave/components/2_Leave/TableList.vue
View file

@ -2,19 +2,12 @@
import { ref, onMounted, watch } from "vue";
import type { QTableProps } from "quasar";
import { useRouter } from "vue-router";
import { checkPermission } from "@/utils/permissions";
/** importStores*/
import { useCounterMixin } from "@/stores/mixin";
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
const mixin = useCounterMixin();
const leaveStore = useLeavelistDataStore();
const checkForm = ref<string>("");
const router = useRouter();
/** เรียน funtion จาก stores*/
// const { date2Thai } = mixin;
// const { optionYear, searchDataFn, filterOption } = leaveStore;
const leaveStore = useLeavelistDataStore();
const router = useRouter();
/** ข้อมูลหัวตาราง รายการลา */
const columnsLeave = ref<QTableProps["columns"]>([
@ -212,17 +205,19 @@ const props = defineProps({
const emit = defineEmits(["update:querySting"]);
function updateQuerySting(newPage: number, pageSize: number) {
// ส่ง event ไปยัง parent component เพื่ออัพเดทค่า props
emit("update:querySting", newPage, pageSize);
}
const currentPage = ref<number>(1);
const pagination = ref({
descending: true,
page: props.page,
rowsPerPage: props.rowsPerPage,
});
function updateQuerySting(newPage: number, pageSize: number) {
// ส่ง event ไปยัง parent component เพื่ออัพเดทค่า props
emit("update:querySting", newPage, pageSize);
}
/** ไปหน้ารายละเอียด */
function redirectToDetail(id: string) {
const routePrefix = leaveStore.tabMenu === "1" ? "/leave" : "/leave-reject";
router.push(`${routePrefix}/detail/${id}`);
@ -233,12 +228,10 @@ function updatedPagination(newPageZize: any) {
pagination.value.rowsPerPage = newPageZize.rowsPerPage;
}
watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
currentPage.value &&
pagination.value.rowsPerPage &&
updateQuerySting(currentPage.value, pagination.value.rowsPerPage);
});
/**
* แปลง สถานะ เป็น text
* @param val
*/
function convert(val: any) {
const filtertype = props.dataToobar?.find(
(e: any) => e.id === val.leaveTypeId
@ -252,6 +245,13 @@ function convert(val: any) {
return val.leaveTypeName;
}
}
watch([() => currentPage.value, () => pagination.value.rowsPerPage], () => {
currentPage.value &&
pagination.value.rowsPerPage &&
updateQuerySting(currentPage.value, pagination.value.rowsPerPage);
});
/** Hook*/
onMounted(() => {
if (leaveStore.tabMenu === "1") {

18
src/modules/09_leave/components/2_Leave/ToolBarLeave.vue
View file

@ -1,21 +1,15 @@
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import { ref, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import type { DateFilter } from "@/modules/09_leave/interface/request/leave";
import type { DataOption } from "@/modules/09_leave/interface/index/Main";
/** importStores*/
import { useLeavelistDataStore } from "@/modules/09_leave/stores/LeaveStore";
import { useCounterMixin } from "@/stores/mixin";
const leaveStore = useLeavelistDataStore();
const mixin = useCounterMixin();
const $q = useQuasar();
const { messageError } = mixin;
const leaveStore = useLeavelistDataStore();
const props = defineProps({
rowsPerPage: {
@ -27,14 +21,6 @@ const props = defineProps({
const emit = defineEmits(["update:querySting"]);
/** formFilter*/
// const filter = reactive<DateFilter>({
// year: new Date().getFullYear(), //*ปีในการยื่นขอใบลา(ใช้เป็น คศ.)
// type: "00000000-0000-0000-0000-000000000000", //*Id ประเภทการลา
// status: "ALL", //*สถานะการของลา
// keyword: "", //keyword ค้นหา
// });
/**
* function update ข้อมูลการค้นหา (QuerySting)
* @param newPage หน้า

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

@ -5,7 +5,6 @@ const props = defineProps({
required: true,
},
});
console.log(props);
</script>
<template>

97
src/modules/09_leave/components/3_Report/LeaveReport.vue
View file

@ -1,17 +1,16 @@
<script setup lang="ts">
import axios from "axios";
import { ref, onMounted } from "vue";
import { VuePDF, usePDF } from "@tato30/vue-pdf";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import axios from "axios";
import { checkPermission } from "@/utils/permissions";
/** importType*/
import type { DataOption } from "@/modules/09_leave/interface/index/Main";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import type { DataOption } from "@/modules/09_leave/interface/index/Main";
/** use*/
const mixin = useCounterMixin();
const $q = useQuasar();
@ -495,94 +494,6 @@ onMounted(() => {
</q-splitter>
</div>
</q-card>
<!-- Dialog Full Screen -->
<!-- <q-dialog
v-model="modalFull"
persistent
:maximized="true"
transition-show="slide-up"
transition-hide="slide-down"
>
<q-card class="bg-white">
<div class="flex justify-end items-center align-center q-mr-md q-mt-sm">
<q-btn
icon="close"
unelevated
round
dense
style="color: #ff8080; background-color: #ffdede"
size="12px"
v-close-popup
/>
</div>
<div class="q-pa-md">
<div class="row items-start items-center">
<div class="col">
<q-btn
padding="xs"
icon="mdi-chevron-left"
color="grey-2"
text-color="grey-5"
size="md"
class="my-auto"
@click="backPage"
:disable="page == 1"
/>
</div>
<div class="col-12 col-md-auto">
<div class="q-pa-md flex">
หน้าที่ {{ page }} จาก {{ numOfPages }}
</div>
</div>
<div class="col text-right">
<q-btn
padding="xs"
icon="mdi-chevron-right"
color="grey-2"
text-color="grey-5"
size="md"
@click="nextPage"
:disable="page === numOfPages"
/>
</div>
</div>
<div class="row items- items-center">
<VuePDF ref="vuePDFRef" :pdf="pdfSrc" :page="page" fit-parent />
</div>
<div class="row items- items-end">
<div class="col">
<q-btn
padding="xs"
icon="mdi-chevron-left"
color="grey-2"
text-color="grey-5"
size="md"
class="my-auto"
@click="backPage"
:disable="page == 1"
/>
</div>
<div class="col-12 col-md-auto">
<div class="q-pa-md flex">
หน้าที่ {{ page }} จาก {{ numOfPages }}
</div>
</div>
<div class="col text-right">
<q-btn
padding="xs"
icon="mdi-chevron-right"
color="grey-2"
text-color="grey-5"
size="md"
@click="nextPage"
:disable="page === numOfPages"
/>
</div>
</div>
</div>
</q-card>
</q-dialog> -->
</template>
<style scoped></style>

11
src/modules/09_leave/components/3_WorkTime/DialogForm.vue
View file

@ -1,21 +1,18 @@
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import http from "@/plugins/http";
import config from "@/app.config";
import { useQuasar } from "quasar";
/** ImportType */
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import type {
FormData,
MyObjectRoundRef,
} from "@/modules/09_leave/interface/response/round";
/** ImportComponents */
import DialogHeader from "@/components/DialogHeader.vue";
/** importstore*/
import { useCounterMixin } from "@/stores/mixin";
const $q = useQuasar();
const mixin = useCounterMixin();

94
src/modules/09_leave/components/4_ChangeRound/DialogForm.vue
View file

@ -1,21 +1,20 @@
<script setup lang="ts">
import { ref, reactive, watch, onMounted } from "vue";
import { date, useQuasar } from "quasar";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useChangeRoundDataStore } from "@/modules/09_leave/stores/ChangeRoundStore";
/** importType */
import type {
changeRoundEdit,
MyObjectRoundChangeRef,
DataOption,
} from "@/modules/09_leave/interface/request/changeRound";
/** importStore */
import { useCounterMixin } from "@/stores/mixin";
import { useChangeRoundDataStore } from "@/modules/09_leave/stores/ChangeRoundStore";
/** useStore */
const $q = useQuasar();
const dataStore = useChangeRoundDataStore();
const mixin = useCounterMixin();
const {
@ -27,11 +26,15 @@ const {
success,
} = mixin;
const $q = useQuasar();
const emit = defineEmits(["update:change-page"]);
/**Hook */
onMounted(async () => {
// await fetchDataOption();
/**Props */
const props = defineProps({
modal: Boolean,
closeDialog: Function,
editCheck: String,
DataRow: Object,
personId: String,
});
/**FormData */
@ -52,6 +55,31 @@ const objectRoundChange: MyObjectRoundChangeRef = {
reson: resonRef,
};
const dataToday = ref<Date>(new Date());
const pageSize = ref<number>(10);
/**
* ฟังก์ชั่น api เปลี่ยนหน้า
* @param pageVal page
* @param pageSizeVal pagesize
*/
// Pagination - initial pagination
const initialPagination = ref<any>({
sortBy: null,
descending: false,
page: 1,
rowsPerPage: pageSize, // set ตาม page หลักส่งมา
});
// Pagination - page & change page & get new data
const currentPage = ref<number>(1);
const roundOp = ref<any>([]);
async function updatePagination(newPagination: any) {
initialPagination.value = newPagination;
currentPage.value = 1; // set current page เป็น 1 เสมอเมื่อเปลี่ยน per row
}
/** Function validateForm */
function validateForm() {
const hasError = [];
@ -68,7 +96,6 @@ function validateForm() {
onSubmit();
}
}
const dataToday = ref<Date>(new Date());
/** Function ยืนยันการบันทึกข้อมูล */
function onSubmit() {
@ -103,7 +130,6 @@ async function changeRound() {
});
}
const roundOp = ref<any>([]);
/**
*ประวัติการเปลี่ยนรอบการปฏิบัติงาน"
*
@ -134,25 +160,13 @@ async function fetchDataOption() {
});
}
// paging
const pageSize = ref<number>(10);
/**ฟังก์ชั่น ปิดไดอาล็อก */
function close() {
if (props.closeDialog) {
props.closeDialog();
}
}
/**
* ฟังก์ชั่น api เปลี่ยนหน้า
* @param pageVal page
* @param pageSizeVal pagesize
*/
// Pagination - initial pagination
const initialPagination = ref<any>({
sortBy: null,
descending: false,
page: 1,
rowsPerPage: pageSize, // set ตาม page หลักส่งมา
});
// Pagination - page & change page & get new data
const currentPage = ref<number>(1);
watch(
[() => currentPage.value, () => initialPagination.value.rowsPerPage],
() => {
@ -164,27 +178,7 @@ watch(
);
}
);
const emit = defineEmits(["update:change-page"]);
async function updatePagination(newPagination: any) {
initialPagination.value = newPagination;
currentPage.value = 1; // set current page เป็น 1 เสมอเมื่อเปลี่ยน per row
}
/**Props */
const props = defineProps({
modal: Boolean,
closeDialog: Function,
editCheck: String,
DataRow: Object,
personId: String,
});
/**ฟังก์ชั่น ปิดไดอาล็อก */
function close() {
if (props.closeDialog) {
props.closeDialog();
}
}
watch(
() => props.modal,
async () => {

38
src/modules/09_leave/components/4_specialTime/DialogApprove.vue
View file

@ -1,26 +1,25 @@
<script setup lang="ts">
import { ref, reactive, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import { useSpecialTimeStore } from "@/modules/09_leave/stores/SpecialTimeStore";
/** importType*/
import type {
dataRowRound,
MyObjectRoundRef,
} from "@/modules/09_leave/interface/response/specialTime";
import DialogHeader from "@/components/DialogHeader.vue";
/** importStores*/
import { useCounterMixin } from "@/stores/mixin";
import { useSpecialTimeStore } from "@/modules/09_leave/stores/SpecialTimeStore";
/** useStore*/
const $q = useQuasar();
const SpecialTimeStore = useSpecialTimeStore();
const mixin = useCounterMixin();
const { dialogConfirm, showLoader, success, messageError, hideLoader } = mixin;
const option = ref<any[]>(SpecialTimeStore.optionStatus);
const $q = useQuasar();
/** props*/
const props = defineProps({
@ -120,6 +119,19 @@ function close() {
}
}
/**
* function ค้นหาข้อมูลใน option
* @param val คำค้นหา
* @param update function
*/
function filterOptionFn(val: string, update: Function) {
update(() => {
option.value = SpecialTimeStore.optionStatus.filter(
(e: any) => e.name.search(val) !== -1
);
});
}
watch(
() => props.modal,
() => {
@ -159,19 +171,6 @@ watch(
}
}
);
/**
* function ค้นหาข้อมูลใน option
* @param val คำค้นหา
* @param update function
*/
function filterOptionFn(val: string, update: Function) {
update(() => {
option.value = SpecialTimeStore.optionStatus.filter(
(e: any) => e.name.search(val) !== -1
);
});
}
</script>
<template>
@ -337,7 +336,6 @@ function filterOptionFn(val: string, update: Function) {
type="submit"
class="q-px-md"
>
<!-- icon="mdi-content-save-outline" -->
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>

30
src/modules/09_leave/interface/request/specialTime.ts
View file

@ -18,4 +18,32 @@ interface DataDateMonthObject {
month: number;
year: number;
}
export type { ListData, DataDateMonthObject };
interface DetailData {
id: string;
fullName: string;
createdAt: string;
checkDate: string;
checkInEdit: boolean;
checkOutEdit: boolean;
checkInTime: string;
checkOutTime: string;
checkInStatus: string;
checkOutStatus: string;
startTimeMorning: string;
endTimeMorning: string;
startTimeAfternoon: string;
endTimeAfternoon: string;
reason: string;
status: string;
description: string;
statusSort: number;
}
interface Pagination {
sortBy: string | null;
descending: boolean;
page: number;
rowsPerPage: number;
}
export type { ListData, DataDateMonthObject,DetailData,Pagination };

16
src/modules/09_leave/interface/response/changeRound.ts
View file

@ -26,13 +26,25 @@ interface dataRowChangeRoundHistory {
reson: string | null;
}
interface historyShow {
round: number;
startTimeMorning: string;
leaveTimeAfternoon: string;
time: string;
effectiveDate: string | null;
reson: string | null;
effectiveDate: string;
reson: string;
}
interface DataInterface {
round: number;
startTimeMorning: string;
leaveTimeAfternoon: string;
effectiveDate: Date; // ใช้ Date แทน string หากต้องการแปลงเป็น Date object
remark: string;
}
export type {
changeShow,
dataRowChangeRound,
dataRowChangeRoundHistory,
historyShow,
DataInterface
};

42
src/modules/09_leave/stores/ChangeRoundStore.ts
View file

@ -1,32 +1,24 @@
import { defineStore } from "pinia";
import { ref, reactive } from "vue";
import type {
changeShow,
dataRowChangeRound,
dataRowChangeRoundHistory,
historyShow,
} from "@/modules/09_leave/interface/response/changeRound";
import type { dataPost } from "@/modules/09_leave/interface/request/changeRound";
import type { QTableProps } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import { useQuasar } from "quasar";
import { ref } from "vue";
import http from "@/plugins/http";
import config from "@/app.config";
import { useQuasar } from "quasar";
import { useCounterMixin } from "@/stores/mixin";
import type {
changeShow,
historyShow,
DataInterface,
} from "@/modules/09_leave/interface/response/changeRound";
import type { QTableProps } from "quasar";
const mixin = useCounterMixin();
const $q = useQuasar();
const {
date2Thai,
messageError,
showLoader,
dialogMessageNotify,
dialogConfirm,
success,
hideLoader,
} = mixin;
const { date2Thai, messageError, showLoader, hideLoader } = mixin;
const checkCilck = ref<boolean>(false);
const profileId = ref<string>("");
// store ลา >> รอบการปฏิบัติงาน
export const useChangeRoundDataStore = defineStore(
"changeRoundDataStore",
() => {
@ -200,17 +192,12 @@ export const useChangeRoundDataStore = defineStore(
await http
.get(
config.API.leaveRoundById(profileId.value) +
// {
// page: page.value,
// pageSize: pageSize.value,
// keyword: filter.value,
// }
`?page=${page.value}&pageSize=${pageSize.value}&keyword=${filter.value}`
)
.then((res) => {
const dataHistory = res.data.result.data;
rowsHistory.value = [];
dataHistory.map((e: any) => {
dataHistory.map((e: DataInterface) => {
rowsHistory.value.push({
round: e.round,
startTimeMorning: e.startTimeMorning,
@ -223,6 +210,7 @@ export const useChangeRoundDataStore = defineStore(
maxPage.value = Math.ceil(total.value / pageSize.value);
maxPage.value = maxPage.value < 1 ? 1 : maxPage.value;
});
console.log(rowsHistory.value);
})
.catch((err) => {
messageError($q, err);

46
src/modules/09_leave/stores/LeaveStore.ts
View file

@ -12,7 +12,7 @@ import type {
import type { FremData } from "@/modules/09_leave/interface/request/leave";
const mixin = useCounterMixin();
const { date2Thai, showLoader, hideLoader } = mixin;
const { date2Thai } = mixin;
export const useLeavelistDataStore = defineStore("leave", () => {
/** ข้อมูล Main*/
@ -123,41 +123,6 @@ export const useLeavelistDataStore = defineStore("leave", () => {
}
}
// /**
// * ฟังก์ชั่นแปลงประเภทการลา
// * @param val ค่าประเภทของกาลา
// */
// function convertLeave(val: string) {
// switch (val) {
// case "leave1":
// return "ลากิจส่วนตัว";
// case "leave2":
// return "ลาป่วย";
// case "leave3":
// return "ลาคลอดบุตร";
// case "leave4":
// return "ลาไปช่วยเหลือภริยาที่คลอดบุตร";
// case "leave5":
// return "ลาพักผ่อน";
// case "leave6":
// return "ลาอุปสมบท";
// case "leave7":
// return "ลาประกอบพิธีฮัจญ์";
// case "leave8":
// return "ลาเข้ารับการตรวจเลือกหรือเข้ารับการเตรียมพล";
// case "leave9":
// return "ลาไปศึกษา";
// case "leave10":
// return "ลาไปฝึกอบรม ปฏิบัติการวิจัย หรือดูงาน";
// case "leave11":
// return "ลาไปปฏิบัติงานในองค์การระหว่างประเทศ";
// case "leave12":
// return "ลาติดตามคู่สมรส";
// case "leave13":
// return "ลาไปฟื้นฟูสมรรถภาพด้านอาชีพ";
// }
// }
/**
* ฟังชั่นแปลงค่าการลา
* @param val ค่าของการลา
@ -202,25 +167,16 @@ export const useLeavelistDataStore = defineStore("leave", () => {
}
return {
/** ข้อมูล Main*/
tabMenu,
/** ข้อมูล Tab1*/
/** filter */
filter,
tabView,
/**ข้อมูลใน Table */
rows,
fetchListLeave,
columns,
visibleColumns,
fetchListLeaveReject,
convertSatatus,
/** Function แปลงค่า */
// convertLeave,
convertLeaveDaytype,
leaveType,
colorType,
};

0
src/modules/09_leave/stores/ReportStore.ts
View file

29
src/modules/09_leave/stores/SpecialTimeStore.ts
View file

@ -1,27 +1,17 @@
import { defineStore } from "pinia";
import { ref, watch, defineEmits } from "vue";
import { ref } from "vue";
import type { QTableProps } from "quasar";
import type { DataRows } from "@/modules/09_leave/interface/response/specialTime";
import type { DataDateMonthObject } from "@/modules/09_leave/interface/request/specialTime";
import { useCounterMixin } from "@/stores/mixin";
import type { DataOption } from "@/modules/09_leave/interface/index/Main";
import http from "@/plugins/http";
import config from "@/app.config";
import { useQuasar } from "quasar";
import { mount } from "@vue/test-utils";
const $q = useQuasar();
const mixin = useCounterMixin();
const {
date2Thai,
messageError,
showLoader,
dialogMessageNotify,
dialogConfirm,
success,
hideLoader,
} = mixin;
const { date2Thai, messageError, showLoader, hideLoader } = mixin;
export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
const rows = ref<any[]>([]);
@ -157,21 +147,6 @@ export const useSpecialTimeStore = defineStore("LeaveSpecialTime", () => {
{ id: "NOT_COMPLETE", name: "ปฏิบัติงานไม่ครบตามกำหนดเวลา" },
]);
// const filterSelector = (val: any, update: Function, refData: string) => {
// switch (refData) {
// case "":
// update(() => {
// selectDate.value = selectDate.value.filter(
// (v: any) => v.name.indexOf(val) > -1
// );
// });
// break;
// default:
// break;
// }
// };
const visibleColumns = ref<String[]>([
"no",
"fullname",

22
src/modules/09_leave/stores/WorkStore.ts
View file

@ -12,20 +12,6 @@ export const useWorklistDataStore = defineStore("work", () => {
/** ค้นหาวัน ข้อมูล Table */
const selectDate = ref<Date | null>(new Date());
// function filterFn(val: string, update: Function) {
// if (val == "") {
// update(() => {
// optionStatus.value = optionStatusMain.value;
// });
// } else {
// update(() => {
// optionStatus.value = optionStatusMain.value.filter(
// (e: any) => e.name.search(val) !== -1
// );
// });
// }
// }
// convertSatatus
/**
* function แปลงค่าสถานะ
@ -44,17 +30,9 @@ export const useWorklistDataStore = defineStore("work", () => {
}
}
return {
//ข้อมูลในตาราง
columns,
visibleColumns,
// fetchListLog,
// fetchListTime,
//ค้นหาข้อมูล
selectDate,
// filterFn,
convertSatatus,
};
});

28
src/modules/09_leave/views/ChangeRoundMain.vue
View file

@ -1,21 +1,17 @@
<script setup lang="ts">
import { ref, watch, reactive } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
/** importType */
import type { dataPost } from "@/modules/09_leave/interface/request/changeRound";
/** importComponents */
import Dialogform from "@/modules/09_leave/components/4_ChangeRound/DialogForm.vue";
/** importStore */
import { useCounterMixin } from "@/stores/mixin";
import { useChangeRoundDataStore } from "@/modules/09_leave/stores/ChangeRoundStore";
import { checkPermission } from "@/utils/permissions";
import type { dataPost } from "@/modules/09_leave/interface/request/changeRound";
import Dialogform from "@/modules/09_leave/components/4_ChangeRound/DialogForm.vue";
/** useStore */
const mixin = useCounterMixin();
const {
@ -121,13 +117,6 @@ function updatePagination(newPagination: any) {
formData.pageSize = newPagination.rowsPerPage;
}
watch(
() => formData.pageSize,
() => {
searchData();
}
);
/** Function ค้นหาข้อมูล */
function searchData() {
if (formData.cardId || formData.firstName || formData.lastName) {
@ -136,6 +125,13 @@ function searchData() {
dialogMessageNotify($q, "กรุณากรอกข้อมูลอย่างน้อย 1 ช่อง");
}
}
watch(
() => formData.pageSize,
() => {
searchData();
}
);
</script>
<template>
<div class="toptitle text-dark col-12 row items-center">

5
src/modules/09_leave/views/RoundMain.vue
View file

@ -12,14 +12,13 @@ import { useCounterMixin } from "@/stores/mixin";
import DialogForm from "@/modules/09_leave/components/3_WorkTime/DialogForm.vue";
import { checkPermission } from "@/utils/permissions";
const $q = useQuasar(); //ใช้ noti quasar
const attrs = ref<any>(useAttrs());
const mixin = useCounterMixin();
const dataStore = useRoundDataStore();
const { fetchData } = dataStore;
const { showLoader, hideLoader, messageError, dialogRemove, success } = mixin;
const $q = useQuasar(); //ใช้ noti quasar
const attrs = ref<any>(useAttrs());
const modal = ref<boolean>(false);
const isRead = ref<boolean>(false);
const detailData = ref<any>();

135
src/modules/09_leave/views/SpecialTimeMain.vue
View file

@ -1,34 +1,32 @@
<script setup lang="ts">
import { onMounted, ref, watch } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
/** importType*/
import type { DataDateMonthObject } from "@/modules/09_leave/interface/request/specialTime";
/** importComponents*/
import DialogReason from "@/components/Dialogs/PopupReason.vue";
import DialogApprove from "@/modules/09_leave/components/4_specialTime/DialogApprove.vue";
/** importStore*/
import { useCounterMixin } from "@/stores/mixin";
import { useSpecialTimeStore } from "@/modules/09_leave/stores/SpecialTimeStore";
import { checkPermission } from "@/utils/permissions";
import type {
DataDateMonthObject,
DetailData,
Pagination,
} from "@/modules/09_leave/interface/request/specialTime";
import DialogReason from "@/components/Dialogs/PopupReason.vue";
import DialogApprove from "@/modules/09_leave/components/4_specialTime/DialogApprove.vue";
const dataSpecialTime = useSpecialTimeStore();
const $q = useQuasar(); // show dialog
const mixin = useCounterMixin();
const { hideLoader, monthYear2Thai, messageError, showLoader, success } = mixin;
const emit = defineEmits(["update:change-page"]);
/**ตัวแปรที่ใช้ */
const modalUnapprove = ref(false);
const modalApprove = ref(false);
const detailData = ref<any>();
const modalUnapprove = ref<boolean>(false);
const modalApprove = ref<boolean>(false);
const detailData = ref<DetailData[]>([]);
const editCheck = ref<string>("");
const dialogTitle = ref<string>("");
const dialogDesc = ref<string>("");
@ -38,6 +36,34 @@ const dateDialog = ref<string>("");
const dateFixDialog = ref<string>("");
const dateYear = ref<number>(new Date().getFullYear());
/** Function Date */
const dateMonth = ref<DataDateMonthObject>({
month: new Date().getMonth(),
year: new Date().getFullYear(),
});
// paging
const currentPage = ref<number>(1);
const pageSize = ref<number>(10);
const initialPagination = ref<Pagination>({
sortBy: null,
descending: false,
page: 1,
rowsPerPage: pageSize.value, // set ตาม page หลักส่งมา
});
// ค้นหาในตาราง
const filterKeyword = ref<string>("");
const filterRef = ref<HTMLInputElement | null>(null);
const resetFilter = () => {
filterKeyword.value = "";
dataSpecialTime.filter = filterKeyword.value;
dataSpecialTime.fetchData();
if (filterRef.value) {
filterRef.value.focus();
}
};
/**
* ฟังก์ชั่นไม่อนุมัติ
* @param fullname ชื่อ
@ -59,7 +85,6 @@ function openModal(
personId: string
) {
id.value = personId;
console.log(personId);
modalApprove.value = true;
dateDialog.value = date;
dateFixDialog.value = dateFix;
@ -70,14 +95,14 @@ function openModal(
}
/** function closeDialog */
const closeDialog = () => {
function closeDialog() {
modalUnapprove.value = false;
modalApprove.value = false;
editCheck.value = "PENDING";
};
}
/** API reject */
const clickSave = async (reason: string) => {
async function clickSave(reason: string) {
showLoader();
modalUnapprove.value = false;
const body = {
@ -95,48 +120,14 @@ const clickSave = async (reason: string) => {
await dataSpecialTime.fetchData();
hideLoader();
});
};
}
// paging
const pageSize = ref<number>(10);
// Pagination - initial pagination
const initialPagination = ref<any>({
sortBy: null,
descending: false,
page: 1,
rowsPerPage: pageSize, // set ตาม page หลักส่งมา
});
// Pagination - page & change page & get new data
const currentPage = ref<number>(1);
watch(
[() => currentPage.value, () => initialPagination.value.rowsPerPage],
async () => {
dataSpecialTime.page = currentPage.value;
await dataSpecialTime.fetchData();
}
);
// Pagination - update rowsPerPage
async function updatePagination(initialPagination: any) {
currentPage.value = 1;
dataSpecialTime.pageSize = initialPagination.rowsPerPage;
dataSpecialTime.page = 1; // set current page เป็น 1 เสมอเมื่อเปลี่ยน per row
}
// ค้นหาในตาราง
const filterKeyword = ref<string>("");
const filterRef = ref<HTMLInputElement | null>(null);
const resetFilter = () => {
filterKeyword.value = "";
dataSpecialTime.filter = filterKeyword.value;
dataSpecialTime.fetchData();
if (filterRef.value) {
filterRef.value.focus();
}
};
/** function ค้นหาข้อมูลแล้วอัปเดท*/
function filterFn() {
updatePagination(filterKeyword.value);
@ -146,23 +137,33 @@ function filterFn() {
dataSpecialTime.fetchData();
}
/** Function Date */
const dateMonth = ref<any>({
month: new Date().getMonth(),
year: new Date().getFullYear(),
});
const updateMonth = async (e: DataDateMonthObject) => {
// console.log(dateMonth.value);
/**
* ดึงข้อมูลตามปี
* @param e ปี
*/
async function updateMonth(e: DataDateMonthObject) {
if (e != null) {
dateYear.value = e.year;
dateYear.value = dataSpecialTime.year;
dataSpecialTime.month = dateMonth.value.month + 1;
dataSpecialTime.year = dateMonth.value.year;
// filterKeyword.value = "";
await dataSpecialTime.fetchData();
console.log(dateMonth);
}
};
}
//แปลงเดือนเป็นไทย
function monthYearThai(val: any) {
if (val == null) return "";
else return monthYear2Thai(val.month, val.year);
}
watch(
[() => currentPage.value, () => initialPagination.value.rowsPerPage],
async () => {
dataSpecialTime.page = currentPage.value;
await dataSpecialTime.fetchData();
}
);
/**Hook */
onMounted(async () => {
@ -174,12 +175,6 @@ onMounted(async () => {
dataSpecialTime.year = yearToday;
await dataSpecialTime.fetchData();
});
//แปลงเดือนเป็นไทย
const monthYearThai = (val: any) => {
if (val == null) return "";
else return monthYear2Thai(val.month, val.year);
};
</script>
<template>