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

รายการลา

Browse source
This commit is contained in:
setthawutttty 2023-11-06 12:12:54 +07:00
parent 5d34c40b41
commit 5559983eeb
4 changed files with 93 additions and 82 deletions
Download patch file Download diff file Expand all files Collapse all files

4
src/modules/09_leave/components/2_Leave/ToolBar.vue
View file

@ -30,7 +30,7 @@ const { searchDataFn, filterOption } = leaveStore;
outlined
dense
v-model="leaveStore.selectType"
:options="leaveStore.optionType"
:options="leaveStore.leaveOps"
option-value="id"
option-label="name"
label="ประเภทการลา"
@ -58,7 +58,7 @@ const { searchDataFn, filterOption } = leaveStore;
outlined
dense
v-model="leaveStore.selectStatus"
:options="leaveStore.optionStatus"
:options="leaveStore.statusOps"
option-value="id"
option-label="name"
label="สถานะ"

2
src/modules/09_leave/interface/request/leave.ts
View file

@ -2,7 +2,7 @@ interface ListsData {
id: string;
leaveType: string
name: string
Date: string
Date: Date
status: string
}
export type {

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

@ -1,5 +1,5 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import { ref,onMounted } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import type { DataOption } from "@/modules/09_leave/interface/index/Main";
@ -16,32 +16,45 @@ export const useLeavelistDataStore = defineStore("leave", () => {
//ข้อมูลในตาราง
const mainData = ref<any>([]);
const rows = ref<DataRows[]>([]);
const selectStatus = ref<string>("PENDING");
const columns = ref<QTableProps["columns"]>([]);
const visibleColumns = ref<string[]>([]);
const loadTable = ref<boolean>(false);
const leaveOp = [
{ id: 'all', name: 'ทั้งหมด' },
{ id: 'leave1', name: 'ลากิจส่วนตัว' },
{ id: 'leave2', name: 'ลาป่วย' },
]
const statusOp = [
{ id: 'all', name: 'ทั้งหมด' },
{ id: 'NEW', name: 'ใหม่' },
{ id: 'PENDING', name: 'อยู่ระหว่างดำเนินการ' },
{ id: 'APPROVE', name: 'อนุมัติ' },
{ id: 'REJECT', name: 'ไม่อนุมัติ' },
]
const leaveOps = ref<any>(leaveOp)
const statusOps = ref<any>(statusOp)
async function fetchList(data: ListsData[]) {
let datalist = data.map((e: ListsData) => ({
id: e.id,
leaveType: e.leaveType,
name: e.name,
Date: date2Thai(e.Date),
status: convertSatatus(e.status),
status: e.status,
}));
mainData.value = datalist.filter(
(e) => e.status === "อยู่ระหว่างดำเนินการ"
);
console.log(datalist)
mainData.value = datalist
const filteramounttab1 = datalist.filter(
(e) => e.status === "อยู่ระหว่างดำเนินการ"
(e) => e.status === "PENDING"
);
amounttab1.value = filteramounttab1.length;
amounttab2.value = datalist.length;
await fetchOption();
await searchDataFn(selectType.value, selectStatus.value);
}
//filter table
const selectYear = ref<string>("all");
const selectType = ref<string>("all");
const selectStatus = ref<string>("all");
const optionYear = ref<DataOption[]>([{ id: "all", name: "ทั้งหมด" }]);
const optionType = ref<DataOption[]>([]);
const optionStatus = ref<DataOption[]>([]);
@ -55,36 +68,66 @@ export const useLeavelistDataStore = defineStore("leave", () => {
// showLoader()
loadTable.value = true;
if (selectYear.value == "all" && type == "all" && status == "all") {
rows.value = mainData.value;
console.log(1)
rows.value = mainData.value.map((e: any) => ({
id: e.id,
leaveType: convertLeave(e.leaveType),
name: e.name,
Date: date2Thai(e.Date),
status: convertSatatus(e.status),
}));
} else if (selectYear.value !== "all" && type == "all" && status == "all") {
console.log("ค้นหาจากปี");
console.log(2);
} else if (selectYear.value == "all" && type !== "all" && status == "all") {
console.log("ค้นหาจากประเภท");
rows.value = mainData.value.filter((e: any) => e.leaveType === type);
console.log(3);
rows.value = mainData.value.filter((e: any) => e.leaveType === type)
.map((e: any) => ({
id: e.id,
leaveType: convertLeave(e.leaveType),
name: e.name,
Date: date2Thai(e.Date),
status: convertSatatus(e.status), // แปลงค่า status เมื่อเป็น "PENDING"
}));
} else if (selectYear.value == "all" && type == "all" && status !== "all") {
console.log("ค้นหาจากสถานะ");
rows.value = mainData.value.filter((e: any) => e.status === status);
console.log(4);
console.log(status);
rows.value = mainData.value.filter((e: any) => e.status === status)
.map((e: any) => ({
id: e.id,
leaveType: convertLeave(e.leaveType),
name: e.name,
Date: date2Thai(e.Date),
status: convertSatatus(e.status), // แปลงค่า status เมื่อเป็น "PENDING"
}));
} else if (
selectYear.value !== "all" &&
type !== "all" &&
status == "all"
) {
console.log("ค้นหาจากปีและประเภท");
console.log(5);
} else if (
selectYear.value !== "all" &&
type == "all" &&
status !== "all"
) {
console.log("ค้นหาจากปีและสถานะ");
console.log(6);
} else if (
selectYear.value == "all" &&
type !== "all" &&
status !== "all"
) {
console.log("ค้นหาจากประเภทและสถานะ");
console.log(7);
console.log(type);
rows.value = mainData.value.filter(
(e: any) => e.leaveType === type && e.status === status
);
)
.map((e: any) => ({
id: e.id,
leaveType: convertLeave(e.leaveType),
name: e.name,
Date: date2Thai(e.Date),
status: convertSatatus(e.status), // แปลงค่า status เมื่อเป็น "PENDING"
}));
} else console.log("ค้นหาจากทั้งหมด");
setTimeout(function () {
loadTable.value = false;
@ -97,65 +140,20 @@ export const useLeavelistDataStore = defineStore("leave", () => {
filterTable.value = "";
}
function fetchOption() {
let data = [];
data = mainData.value;
const double_leaveType = [
...new Set(data.map((item: any) => item.leaveType)),
];
// หา optionType
optionTypeMain.value = [{ id: "all", name: "ทั้งหมด" }];
for (let i = 1; i <= double_leaveType.length; i++) {
const type = double_leaveType[i - 1];
if (typeof type === "string") {
const listtype: DataOption = {
id: type,
name: type,
};
optionTypeMain.value.push(listtype);
optionType.value = optionTypeMain.value;
}
}
// หา optionStatus
const double_status = [...new Set(data.map((item: any) => item.status))];
optionStatusMain.value = [{ id: "all", name: "ทั้งหมด" }];
for (let i = 1; i <= double_status.length; i++) {
const status = double_status[i - 1];
if (typeof status === "string") {
const liststatus: DataOption = {
id: status,
name: status,
};
optionStatusMain.value.push(liststatus);
optionStatus.value = optionStatusMain.value;
}
}
}
// filter option
function filterOption(val: string, update: any, type: string) {
let data: DataOption[] = [];
let filter: DataOption[] = [];
if (type == "type") {
data = optionTypeMain.value;
} else if (type == "status") {
data = optionStatusMain.value;
}
if (val == "") {
update(() => {
filter = data;
});
} else {
update(() => {
filter = data.filter((e) => e.name.search(val) !== -1);
});
}
if (filter) {
if (type == "type") {
optionType.value = filter;
} else if (type == "status") {
optionStatus.value = filter;
function filterOption(val: string, update: any, name: string) {
update(() => {
const needle = val.toLowerCase();
if (name === "type") {
leaveOps.value = leaveOp.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
} else if (name === "status") {
statusOps.value = statusOp.filter(
(v: any) => v.name.toLowerCase().indexOf(needle) > -1
);
}
}
});
}
// convertSatatus
@ -171,6 +169,15 @@ export const useLeavelistDataStore = defineStore("leave", () => {
return "ไม่อนุมัติ";
}
}
function convertLeave(val: string) {
switch (val) {
case "leave1":
return "ลากิจส่วนตัว";
case "leave2":
return "ลาป่วย";
}
}
return {
amounttab1,
amounttab2,
@ -192,5 +199,9 @@ export const useLeavelistDataStore = defineStore("leave", () => {
clearFilter,
searchDataFn,
filterOption,
leaveOp,
statusOp,
leaveOps,
statusOps
};
});

8
src/modules/09_leave/views/LeaveListMain.vue
View file

@ -18,28 +18,28 @@ function fecthLeaveList() {
const data = [
{
id: "00000000-0000-0000-0000-000000000000",
leaveType: "ลาป่วย",
leaveType: "leave1",
name: "นายกัณฐิมา กาฬสินธ์ุ",
Date: "2023-11-03",
status: "NEW",
},
{
id: "00000000-0000-0000-0000-000000000000",
leaveType: "ลากิจส่วนตัว",
leaveType: "leave1",
name: "นายนครชัย วันดี",
Date: "2023-11-01",
status: "APPROVE",
},
{
id: "00000000-0000-0000-0000-000000000000",
leaveType: "ลากิจส่วนตัว",
leaveType: "leave1",
name: "นายกัณฐิมา กาฬสินธ์ุ",
Date: "2023-11-02",
status: "PENDING",
},
{
id: "00000000-0000-0000-0000-000000000000",
leaveType: "ลาป่วย",
leaveType: "leave2",
name: "นายปิยรมย์ ศิริธาราฟ",
Date: "2023-11-01",
status: "PENDING",