hrms-mgt/src/modules/09_leave/components/2_Leave/Tab2.vue
2024-07-30 16:50:08 +07:00

122 lines
3.6 KiB
Vue

<script setup lang="ts">
import { ref, reactive, onMounted } from "vue";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
/**importType*/
import type {
QuerySting,
DateFilter,
} from "@/modules/09_leave/interface/request/leave";
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;
const { fetchListLeaveReject } = leaveStore;
const dataToobar = ref<any[]>([]);
const $q = useQuasar(); //ใช้ noti quasar
const querySting = reactive<QuerySting>({
year: leaveStore.filter.year, //*ปีในการยื่นขอใบลา(ใช้เป็น คศ.)
type: leaveStore.filter.type, //*Id ประเภทการลา
status: leaveStore.filter.status, //*สถานะการของลา
page: 1, //*หน้า
pageSize: 10, //*จำนวนแถวต่อหน้า
keyword: leaveStore.filter.keyword, //keyword ค้นหา
});
const maxPage = ref<number>(1);
const totalList = ref<number>(0);
//** เรียกข้อมูลจาก API*/
async function fecthLeaveList() {
querySting.status = await (querySting.status == null
? "ALL"
: querySting.status);
querySting.type = await (querySting.type == null
? "00000000-0000-0000-0000-000000000000"
: querySting.type);
if (querySting.status != null && querySting.type != null) {
showLoader();
await http
.post(config.API.leaveListDelete(), querySting)
.then((res) => {
const data = res.data.result;
maxPage.value = Math.ceil(data.total / querySting.pageSize);
totalList.value = data.tatol;
fetchListLeaveReject(data.data); /** ส่งข้อมูลไป stores*/
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {
hideLoader();
});
}
// const data = APIDATA.data;
}
/**
*
* @param newPage หน้า
* @param pageSize จำนวนต่อแถว
* @param dateFilter ข้อมูลค้นหา
*/
async function updatePaging(
newPage: number,
pageSize: number,
dateFilter: DateFilter
) {
querySting.year = dateFilter ? dateFilter.year : querySting.year;
querySting.type = dateFilter ? dateFilter.type : querySting.type;
querySting.status = dateFilter ? dateFilter.status : querySting.status;
querySting.page = newPage;
querySting.pageSize = pageSize ? pageSize : querySting.pageSize;
querySting.keyword = dateFilter ? dateFilter.keyword : querySting.keyword;
await fecthLeaveList();
}
/** function เรียกข้อมูลสถานะ*/
async function fetchOption() {
await http
.get(config.API.leaveType())
.then((res) => {
dataToobar.value = res.data.result;
})
.catch((err) => {
messageError($q, err);
})
.finally(() => {});
}
onMounted(async () => {
await fetchOption();
await fecthLeaveList();
});
</script>
<template>
<ToolBar
:rowsPerPage="querySting.pageSize"
@update:querySting="updatePaging"
:dataToobar="dataToobar"
/>
<TableList
:page="querySting.page"
:rowsPerPage="querySting.pageSize"
:maxPage="maxPage"
:totalList="totalList"
@update:querySting="updatePaging"
:dataToobar="dataToobar"
/>
</template>
<style scoped></style>