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

ผูก api หน้า รายการหน้าเเข่งขัน

Browse source
This commit is contained in:
setthawutttty 2023-07-07 09:47:46 +07:00
parent 27b966291c
commit f3ad4d21fb
2 changed files with 58 additions and 62 deletions
Download patch file Download diff file Expand all files Collapse all files

94
src/modules/05_placement/components/Main.vue
View file

@ -115,7 +115,7 @@ const rows = ref<FormPlacementMainData[]>([
examOrder: 0, examOrder: 0,
fiscalYear: 0, fiscalYear: 0,
numberOfCandidates: 0, numberOfCandidates: 0,
examTypeValue:"", examTypeValue: "",
examTypeName: "", examTypeName: "",
accountStartDate: "", accountStartDate: "",
accountExpirationDate: "", accountExpirationDate: "",
@ -126,23 +126,21 @@ let OriginalData = ref<FormPlacementMainData[]>([]);
let UpdataData = ref<FormPlacementMainData[]>([]); let UpdataData = ref<FormPlacementMainData[]>([]);
const OriginalDataFetch = async (year: number) => { const OriginalDataFetch = async (year: number) => {
await http try {
.get(config.API.MainDetail(year)) // ส่งปีที่เลือกมาเป็นอาร์กิวเมนต์ในการเรียก API const response = await http.get(config.API.MainDetail(year));
.then(async (res: any) => { const apiData = response.data.result;
console.log("🚀 ~ file: Main.vue:160 ~ .then ~ res:", res.data.result); console.log("🚀 ~ file: Main.vue:160 ~ .then ~ res:", apiData);
await DataStore.DataMain(res.data.result); await DataStore.DataMain(apiData);
OriginalData.value = await DataStore.DataMainOrig; OriginalData.value = await DataStore.DataMainOrig;
UpdataData.value = OriginalData.value; UpdataData.value = OriginalData.value;
}) } catch (error) {
.catch((e: any) => { messageError($q, error);
messageError($q, e); }
})
.finally(async () => {});
}; };
onMounted(async () => { onMounted(async () => {
await fiscalYearFilter(); // เรียกใช้ await เพื่อรอให้ fiscalYearFilter() เสร็จสิ้น await fiscalYearFilter();
await OriginalDataFetch(fiscalyear.value); // ส่งค่าปีที่เลือกจาก fiscalyear เป็นอาร์กิวเมนต์ให้กับ OriginalDataFetch() await OriginalDataFetch(fiscalyear.value);
examTimeFilter(); examTimeFilter();
await examTypeFilter(); await examTypeFilter();
expiredAccountFilter(); expiredAccountFilter();
@ -151,13 +149,12 @@ onMounted(async () => {
// ดูรายการสอบแข่งขัน หน้าต่อไป // ดูรายการสอบแข่งขัน หน้าต่อไป
const redirectToPage = (examId?: number) => { const redirectToPage = (examId?: number) => {
// router.push({ name: 'placementDetail'});
router.push(`/placement/pass/${examId}`); router.push(`/placement/pass/${examId}`);
}; };
// เลือกปีงบประมาณ //-------------------|เลือกปีงบประมาณ|-----------------------//
const fiscalyear = ref<number>(0); const fiscalyear = ref<number>(0);
const fiscalyearOP = reactive<DataOption[]>([{ id: "", name: "ทั้งหมด" }]); const fiscalyearOP = reactive<DataOption[]>([{ id: null, name: "ทั้งหมด" }]);
const addedfiscalYearValues: number[] = []; const addedfiscalYearValues: number[] = [];
const fiscalYearFilter = async () => { const fiscalYearFilter = async () => {
let maxYear = 0; // เพิ่มตัวแปร maxYear let maxYear = 0; // เพิ่มตัวแปร maxYear
@ -182,22 +179,19 @@ const fiscalYearFilter = async () => {
}); });
}; };
// เลือกปีงบประมาณตาม API //-------------------|เลือกปีงบประมาณตาม API|--------------------//
const searchfiscalyear = async () => { const searchfiscalyear = async () => {
console.log("Input value changed:", fiscalyear.value);
// API // API
await http await http
.get(config.API.yearOptions()) .get(config.API.yearOptions())
.then((res: any) => { .then((res: any) => {})
console.log("🚀date", res);
})
.catch((e: any) => { .catch((e: any) => {
messageError($q, e); messageError($q, e);
}) })
.finally(async () => {}); .finally(async () => {});
}; };
// ค้นหาในตาราง //-------------------|ค้นหาในตาราง|-----------------//
const filterKeyword = ref<string>(""); const filterKeyword = ref<string>("");
const filterRef = ref<any>(null); const filterRef = ref<any>(null);
const resetFilter = () => { const resetFilter = () => {
@ -216,37 +210,40 @@ const visibleColumns = ref<any[]>([
"examTypeName", "examTypeName",
"accountStartDate", "accountStartDate",
"accountExpirationDate", "accountExpirationDate",
]); //ค้นหา คอลัมน์ คอลัมน์ที่แสดง ]);
//-------------------|ครั้งที่สอบ|------------------------------//
const examTime = ref<number | string>("all");
const examTimeOP = reactive<DataOption[]>([]);
const addedExamTimeValues: Set<number> = new Set();
// ครั้งที่สอบ
const examTime = ref<number | null>(null);
const examTimeOP = ref<number[]>([]);
const examTimeFilter = async () => { const examTimeFilter = async () => {
for (let data of OriginalData.value) { examTimeOP.push({ id: "all", name: "ทั้งหมด" });
if (!examTimeOP.value.includes(data.examOrder)) {
examTimeOP.value.push(data.examOrder); for (const data of OriginalData.value) {
const examOrder = data.examOrder;
if (examOrder !== null && !addedExamTimeValues.has(examOrder)) {
examTimeOP.push({ id: examOrder.toString(), name: examOrder.toString() });
addedExamTimeValues.add(examOrder);
} }
} }
examTimeOP.value.sort((a, b) => a - b); // เรียงลำดับ examTimeOP.sort((a, b) => {
if (a.id === "all") return -1; // ให้ตัวเลือก "ทั้งหมด" อยู่ด้านหน้า
if (b.id === "all") return 1;
return Number(a.id) - Number(b.id);
}); // เรียงลำดับตาม id ที่แปลงเป็นตัวเลข
}; };
// ประเภทการสอบ // ประเภทการสอบ
const examType = ref<string | null>("all");
const examType = ref<string | null>(""); const examTypeOP = ref<DataOption[]>([{ id: "all", name: "ทั้งหมด" }]);
const examTypeOP = reactive<DataOption[]>([
{ id: "", name: "ทั้งหมด" },
]);
const addedExamTypeValues: Set<string> = new Set(); const addedExamTypeValues: Set<string> = new Set();
const examTypeFilter = async () => { const examTypeFilter = () => {
for (const data of OriginalData.value) { for (const data of OriginalData.value) {
const examTypeName = data.examTypeName; const examTypeName = data.examTypeName;
const examTypeValue = data.examTypeValue; const examTypeValue = data.examTypeValue;
if (examTypeName && !addedExamTypeValues.has(examTypeName)) {
if ( examTypeOP.value.push({
examTypeName &&
!addedExamTypeValues.has(examTypeName)
) {
examTypeOP.push({
id: examTypeValue, id: examTypeValue,
name: examTypeName, name: examTypeName,
}); });
@ -254,8 +251,7 @@ const addedExamTypeValues: Set<string> = new Set();
} }
} }
}; };
//--------------|ฟิลเตอร์|--------------------------------------//
const searchFilterTable = async () => { const searchFilterTable = async () => {
if (examType.value !== undefined && examType.value !== null) { if (examType.value !== undefined && examType.value !== null) {
await DataStore.DataUpdateMain( await DataStore.DataUpdateMain(
@ -267,7 +263,7 @@ const searchFilterTable = async () => {
} }
}; };
// บัญชีหมดอายุ //----------------|บัญชีหมดอายุ|-----------------------------//
const expiredAccount = ref<boolean>(false); const expiredAccount = ref<boolean>(false);
const expiredAccountFilter = async () => { const expiredAccountFilter = async () => {
const currentDate = new Date(); const currentDate = new Date();
@ -382,9 +378,9 @@ const paginationLabel = (start: string, end: string, total: string) => {
dense dense
emit-value emit-value
map-options map-options
option-label="examTypeName" option-label="name"
:options="examTypeOP" :options="examTypeOP"
option-value="examTypeValue" option-value="id"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
:readonly="false" :readonly="false"

26
src/modules/05_placement/store.ts
View file

@ -104,33 +104,33 @@ export const usePlacementDataStore = defineStore("placement", () => {
(DataMainYear.value = val); (DataMainYear.value = val);
const DataMain = (val: FormPlacementMainData[]) => (DataMainOrig.value = val); const DataMain = (val: FormPlacementMainData[]) => (DataMainOrig.value = val);
const DataUpdateMain = ( const DataUpdateMain = (
filter_1: number | null, filter_1: number | string,
filter_2: string | null, filter_2: string | null,
filter_3: boolean filter_3: boolean
) => { ) => {
DataMainUpdate.value = []; DataMainUpdate.value = [];
if (filter_1 === null && filter_2 === "" && filter_3 === false) { if (filter_1 === "all" && filter_2 === "all" && filter_3 === false) {
// console.log('case 1'); // console.log('case 1');
// return DataMainUpdate.value = DataMainOrig.value; อันเก่า // return DataMainUpdate.value = DataMainOrig.value; อันเก่า
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.isExpired === filter_3 (item) => item.isExpired === filter_3
)); ));
} else if (filter_1 === null && filter_2 === "" && filter_3 === false) { } else if (filter_1 === "all" && filter_2 === "all" && filter_3 === false) {
// console.log('case 1.1'); // console.log('case 1.1');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.isExpired === filter_3 (item) => item.isExpired === filter_3
)); ));
} else if (filter_1 !== null && filter_2 === "" && filter_3 === false) { } else if (filter_1 !== "all" && filter_2 === "all" && filter_3 === false) {
// console.log('case 2'); // console.log('case 2');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.examOrder === filter_1 && item.isExpired === filter_3 (item) => item.examOrder === filter_1 && item.isExpired === filter_3
)); ));
} else if (filter_1 !== null && filter_2 === "" && filter_3 === false) { } else if (filter_1 !== "all" && filter_2 === "all" && filter_3 === false) {
// console.log('case 2.1'); // console.log('case 2.1');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.examOrder === filter_1 && item.isExpired === filter_3 (item) => item.examOrder === filter_1 && item.isExpired === filter_3
)); ));
} else if (filter_1 !== null && filter_2 !== "" && filter_3 === false) { } else if (filter_1 !== "all" && filter_2 !== "all" && filter_3 === false) {
// console.log('case 2.2'); // console.log('case 2.2');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => (item) =>
@ -138,32 +138,32 @@ export const usePlacementDataStore = defineStore("placement", () => {
item.examTypeValue === filter_2 && item.examTypeValue === filter_2 &&
item.isExpired === filter_3 item.isExpired === filter_3
)); ));
} else if (filter_1 === null && filter_2 !== "" && filter_3 === false) { } else if (filter_1 === "all" && filter_2 !== "all" && filter_3 === false) {
// console.log('case 3'); // console.log('case 3');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.examTypeValue === filter_2 && item.isExpired === filter_3 (item) => item.examTypeValue === filter_2 && item.isExpired === filter_3
)); ));
} else if (filter_1 === null && filter_2 === "" && filter_3 === true) { } else if (filter_1 === "all" && filter_2 === "all" && filter_3 === true) {
// console.log('case 3.1'); // console.log('case 3.1');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.isExpired === filter_3 (item) => item.isExpired === filter_3
)); ));
} else if (filter_1 === null && filter_2 === "" && filter_3 === true) { } else if (filter_1 === "all" && filter_2 === "all" && filter_3 === true) {
// console.log('case 3.2'); // console.log('case 3.2');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.isExpired === filter_3 (item) => item.isExpired === filter_3
)); ));
} else if (filter_1 !== null && filter_2 === "" && filter_3 === true) { } else if (filter_1 !== "all" && filter_2 === "all" && filter_3 === true) {
// console.log('case 3.3'); // console.log('case 3.3');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.examOrder == filter_1 && item.isExpired == filter_3 (item) => item.examOrder == filter_1 && item.isExpired == filter_3
)); ));
} else if (filter_1 !== null && filter_2 === "" && filter_3 === true) { } else if (filter_1 !== "all" && filter_2 === "all" && filter_3 === true) {
// console.log('case 3.4'); // console.log('case 3.4');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.examOrder == filter_1 && item.isExpired == filter_3 (item) => item.examOrder == filter_1 && item.isExpired == filter_3
)); ));
} else if (filter_1 !== null && filter_2 !== "" && filter_3 === true) { } else if (filter_1 !== "all" && filter_2 !== "all" && filter_3 === true) {
// console.log('case 3.5'); // console.log('case 3.5');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => (item) =>
@ -171,7 +171,7 @@ export const usePlacementDataStore = defineStore("placement", () => {
item.examTypeValue == filter_2 && item.examTypeValue == filter_2 &&
item.isExpired == filter_3 item.isExpired == filter_3
)); ));
} else if (filter_1 === null && filter_2 !== "" && filter_3 === true) { } else if (filter_1 === "all" && filter_2 !== "all" && filter_3 === true) {
// console.log('case 3.6'); // console.log('case 3.6');
return (DataMainUpdate.value = DataMainOrig.value.filter( return (DataMainUpdate.value = DataMainOrig.value.filter(
(item) => item.examTypeValue == filter_2 && item.isExpired == filter_3 (item) => item.examTypeValue == filter_2 && item.isExpired == filter_3