no message

This commit is contained in:
setthawutttty 2023-07-05 10:00:36 +07:00
parent e344e5845e
commit dd6ae8c04d
5 changed files with 132 additions and 115 deletions

View file

@ -2,7 +2,7 @@ import env from "../index"
const placement = `${env.API_URI}/Placement/placement` const placement = `${env.API_URI}/Placement/placement`
export default { export default {
MainDetail: () => `${placement}`, MainDetail: (year:number) => `${placement}/exam/${year}`,
yearOptions: () => `${placement}/fiscal`, yearOptions: () => `${placement}/fiscal`,
redirectToPage: (examId:string) => `${placement}/pass/${examId}`, redirectToPage: (examId:string) => `${placement}/pass/${examId}`,
} }

View file

@ -33,73 +33,73 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px", style: "font-size: 14px",
}, },
{ {
name: "name", name: "examRound",
align: "left", align: "left",
label: "รอบการสอบ", label: "รอบการสอบ",
sortable: true, sortable: true,
field: "name", field: "examRound",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
{ {
name: "round", name: "examOrder",
align: "left", align: "left",
label: "ครั้งที่", label: "ครั้งที่",
sortable: true, sortable: true,
field: "round", field: "examOrder",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
}, },
{ {
name: "year", name: "fiscalYear",
align: "left", align: "left",
label: "ปีงบประมาณ", label: "ปีงบประมาณ",
sortable: true, sortable: true,
field: "year", field: "fiscalYear",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
}, },
{ {
name: "number", name: "numberOfCandidates",
align: "left", align: "left",
label: "จำนวนผู้สอบได้", label: "จำนวนผู้สอบได้",
sortable: false, sortable: false,
field: "number", field: "numberOfCandidates",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
{ {
name: "placementType", name: "examTypeName",
align: "left", align: "left",
label: "ประเภทการสอบ", label: "ประเภทการสอบ",
sortable: false, sortable: false,
field: "placementType", field: "examTypeName",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
{ {
name: "startDate", name: "accountStartDate",
align: "left", align: "left",
label: "วันที่เริ่มคำสั่ง", label: "วันที่เริ่มคำสั่ง",
sortable: true, sortable: true,
field: "startDate", field: "accountStartDate",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
sort: (a: string, b: string) => sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }), a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
}, },
{ {
name: "endDate", name: "accountExpirationDate",
align: "left", align: "left",
label: "วันที่บัญชีหมดอายุ", label: "วันที่บัญชีหมดอายุ",
sortable: true, sortable: true,
field: "endDate", field: "accountExpirationDate",
headerStyle: "font-size: 14px", headerStyle: "font-size: 14px",
style: "font-size: 14px", style: "font-size: 14px",
sort: (a: string, b: string) => sort: (a: string, b: string) =>
@ -111,23 +111,23 @@ const columns = ref<QTableProps["columns"]>([
const rows = ref<FormPlacementMainData[]>([ const rows = ref<FormPlacementMainData[]>([
{ {
id: 0, id: 0,
name: "", examRound: "",
round:0 , examOrder: 0,
year: 0, fiscalYear: 0,
number: 0, numberOfCandidates: 0,
placementType: 0, examTypeValue:"",
startDate: "", examTypeName: "",
endDate: "", accountStartDate: "",
accountExpirationDate: "",
}, },
]); ]);
let OriginalData = ref<FormPlacementMainData[]>([]); let OriginalData = ref<FormPlacementMainData[]>([]);
let UpdataData = ref<FormPlacementMainData[]>([]); let UpdataData = ref<FormPlacementMainData[]>([]);
const OriginalDataFetch = async () => { const OriginalDataFetch = async (year: number) => {
await http await http
.get(config.API.MainDetail()) .get(config.API.MainDetail(year)) // API
.then(async (res: any) => { .then(async (res: any) => {
console.log("🚀 ~ file: Main.vue:160 ~ .then ~ res:", res.data.result); console.log("🚀 ~ file: Main.vue:160 ~ .then ~ res:", res.data.result);
await DataStore.DataMain(res.data.result); await DataStore.DataMain(res.data.result);
@ -141,12 +141,12 @@ const OriginalDataFetch = async () => {
}; };
onMounted(async () => { onMounted(async () => {
await OriginalDataFetch(); await fiscalYearFilter(); // await fiscalYearFilter()
fiscalYearFilter(); await OriginalDataFetch(fiscalyear.value); // fiscalyear OriginalDataFetch()
examTimeFilter(); examTimeFilter();
examTypeFilter(); await examTypeFilter();
await expiredAccountFilter(); expiredAccountFilter();
searchFilterTable(); await searchFilterTable();
}); });
// //
@ -156,25 +156,30 @@ const redirectToPage = (examId?: number) => {
}; };
// //
const fiscalyear = ref<number | null>(0); const fiscalyear = ref<number>(0);
const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]); const fiscalyearOP = reactive<DataOption[]>([{ id: "", name: "ทั้งหมด" }]);
const addedfiscalYearValues: number[] = []; const addedfiscalYearValues: number[] = [];
const fiscalYearFilter = async () => { const fiscalYearFilter = async () => {
// API let maxYear = 0; // maxYear
await http await http
.get(config.API.yearOptions()) .get(config.API.yearOptions())
.then((res: any) => { .then((res: any) => {
console.log("🚀 ", res.data.result); console.log("🚀 ", res.data.result);
for (let data of res.data.result) { for (let data of res.data.result) {
fiscalyearOP.push(data); fiscalyearOP.push(data);
if (data.id > maxYear) {
maxYear = data.id; // maxYear
}
} }
// DataStore.DataMainYearSet(rows.value);
// fiscalyearOP.value = DataStore.DataMainYearGet;
}) })
.catch((e: any) => { .catch((e: any) => {
messageError($q, e); messageError($q, e);
}) })
.finally(async () => {}); .finally(async () => {
// fiscalyear
fiscalyear.value = maxYear;
});
}; };
// API // API
@ -202,14 +207,15 @@ const resetFilter = () => {
const attrs = ref<any>(useAttrs()); const attrs = ref<any>(useAttrs());
const visibleColumns = ref<any[]>([ const visibleColumns = ref<any[]>([
"id", "id",
"name", "examRound",
"round", "examOrder",
"year", "fiscalYear",
"number", "numberOfCandidates",
"placementType", "examTypeValue",
"startDate", "examTypeName",
"endDate", "accountStartDate",
"accountExpirationDate",
]); // ]); //
// //
@ -217,38 +223,48 @@ const examTime = ref<number | null>(null);
const examTimeOP = ref<number[]>([]); const examTimeOP = ref<number[]>([]);
const examTimeFilter = async () => { const examTimeFilter = async () => {
for (let data of OriginalData.value) { for (let data of OriginalData.value) {
if (!examTimeOP.value.includes(data.round)) { if (!examTimeOP.value.includes(data.examOrder)) {
examTimeOP.value.push(data.round); examTimeOP.value.push(data.examOrder);
} }
} }
examTimeOP.value.sort((a, b) => a - b); // examTimeOP.value.sort((a, b) => a - b); //
}; };
// //
const examType = ref<number | null>(0);
const examTypeOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]); const examType = ref<string | null>("");
const addedexamTypeValues: number[] = []; const examTypeOP = reactive<DataOption[]>([
const examTypeFilter = async () => { { id: "", name: "ทั้งหมด" },
for (let data of OriginalData.value) { ]);
const examTypeValue = data.placementType; const addedExamTypeValues: Set<string> = new Set();
if (examTypeValue == 1 && !addedexamTypeValues.includes(1)) { const examTypeFilter = async () => {
examTypeOP.push({ id: 1, name: "คัดเลือก" }); for (const data of OriginalData.value) {
addedexamTypeValues.push(1); const examTypeName = data.examTypeName;
} else if (examTypeValue == 2 && !addedexamTypeValues.includes(2)) { const examTypeValue = data.examTypeValue;
examTypeOP.push({ id: 2, name: "สอบแข่งขัน" });
addedexamTypeValues.push(2); if (
examTypeName &&
!addedExamTypeValues.has(examTypeName)
) {
examTypeOP.push({
id: examTypeValue,
name: examTypeName,
});
addedExamTypeValues.add(examTypeName);
} }
} }
}; };
const searchFilterTable = async () => { const searchFilterTable = async () => {
// console.log('Input value changed:', examTime.value, examType.value, expiredAccount.value); if (examType.value !== undefined && examType.value !== null) {
await DataStore.DataUpdateMain( await DataStore.DataUpdateMain(
examTime.value, examTime.value,
examType.value, examType.value,
expiredAccount.value expiredAccount.value
); );
UpdataData.value = DataStore.DataMainUpdate; UpdataData.value = DataStore.DataMainUpdate;
}
}; };
// //
@ -256,7 +272,7 @@ const expiredAccount = ref<boolean>(false);
const expiredAccountFilter = async () => { const expiredAccountFilter = async () => {
const currentDate = new Date(); const currentDate = new Date();
const updatedRows = OriginalData.value.map((data) => { const updatedRows = OriginalData.value.map((data) => {
let expirationDate = new Date(data.endDate); let expirationDate = new Date(data.accountExpirationDate);
let isExpired = expirationDate < currentDate; let isExpired = expirationDate < currentDate;
return { ...data, isExpired }; return { ...data, isExpired };
@ -366,9 +382,9 @@ const paginationLabel = (start: string, end: string, total: string) => {
dense dense
emit-value emit-value
map-options map-options
option-label="name" option-label="examTypeName"
:options="examTypeOP" :options="examTypeOP"
option-value="id" option-value="examTypeValue"
lazy-rules lazy-rules
hide-bottom-space hide-bottom-space
:readonly="false" :readonly="false"
@ -421,28 +437,28 @@ const paginationLabel = (start: string, end: string, total: string) => {
@click="redirectToPage(props.row.id)" @click="redirectToPage(props.row.id)"
> >
<q-td key="id" :props="props"> <q-td key="id" :props="props">
{{ props.rowIndex+1 }} {{ props.rowIndex + 1 }}
</q-td> </q-td>
<q-td key="name" :props="props"> <q-td key="examRound" :props="props">
{{ props.row.name }} {{ props.row.examRound }}
</q-td> </q-td>
<q-td key="round" :props="props"> <q-td key="examOrder" :props="props">
{{ props.row.round }} {{ props.row.examOrder }}
</q-td> </q-td>
<q-td key="year" :props="props"> <q-td key="fiscalYear" :props="props">
{{ props.row.year + 543 }} {{ props.row.fiscalYear }}
</q-td> </q-td>
<q-td key="number" :props="props"> <q-td key="numberOfCandidates" :props="props">
{{ props.row.number }} {{ props.row.numberOfCandidates }}
</q-td> </q-td>
<q-td key="placementType" :props="props"> <q-td key="examTypeName" :props="props">
{{ props.row.placementType == 1 ? "คัดเลือก" : "สอบแข่งขัน" }} {{ props.row.examTypeName }}
</q-td> </q-td>
<q-td key="startDate" :props="props"> <q-td key="accountStartDate" :props="props">
{{ textDate(props.row.startDate) }} {{ textDate(props.row.accountStartDate) }}
</q-td> </q-td>
<q-td key="endDate" :props="props"> <q-td key="accountExpirationDate" :props="props">
{{ textDate(props.row.endDate) }} {{ textDate(props.row.accountExpirationDate) }}
</q-td> </q-td>
</q-tr> </q-tr>
</template> </template>

View file

@ -1,7 +1,7 @@
import type { zipCodeOption } from "../../components/PersonalDetail/profileType"; import type { zipCodeOption } from "../../components/PersonalDetail/profileType";
interface DataOption { interface DataOption {
id: number | string; id: string|null;
name: string; name:string|null;
disable?: boolean; disable?: boolean;
} }

View file

@ -1,13 +1,14 @@
// ข้อมูลรายการสอบแข่งขัน/คัดเลือก // ข้อมูลรายการสอบแข่งขัน/คัดเลือก
interface FormPlacementMainData { interface FormPlacementMainData {
id: number; id: number;
name: string; examRound: string;
round: number; examOrder: number;
year: number; fiscalYear: number;
number: number; numberOfCandidates: number;
placementType: number; examTypeValue:string;
startDate: string; examTypeName: string;
endDate: string; accountStartDate: string;
accountExpirationDate: string;
isExpired?: boolean; isExpired?: boolean;
} }

View file

@ -105,76 +105,76 @@ export const usePlacementDataStore = defineStore("placement", () => {
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 | null,
filter_2: number | null, filter_2: string | null,
filter_3: boolean filter_3: boolean
) => { ) => {
DataMainUpdate.value = []; DataMainUpdate.value = [];
if (filter_1 === null && filter_2 === 0 && filter_3 === false) { if (filter_1 === null && filter_2 === "" && 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 === null && filter_3 === false) { } else if (filter_1 === null && filter_2 === "" && 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 === 0 && filter_3 === false) { } else if (filter_1 !== null && filter_2 === "" && 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.round === filter_1 && item.isExpired === filter_3 (item) => item.examOrder === filter_1 && item.isExpired === filter_3
)); ));
} else if (filter_1 !== null && filter_2 === null && filter_3 === false) { } else if (filter_1 !== null && filter_2 === "" && 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.round === filter_1 && item.isExpired === filter_3 (item) => item.examOrder === filter_1 && item.isExpired === filter_3
)); ));
} else if (filter_1 !== null && filter_2 !== 0 && filter_3 === false) { } else if (filter_1 !== null && filter_2 !== "" && 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) =>
item.round === filter_1 && item.examOrder === filter_1 &&
item.placementType === filter_2 && item.examTypeValue === filter_2 &&
item.isExpired === filter_3 item.isExpired === filter_3
)); ));
} else if (filter_1 === null && filter_2 !== 0 && filter_3 === false) { } else if (filter_1 === null && filter_2 !== "" && 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.placementType === filter_2 && item.isExpired === filter_3 (item) => item.examTypeValue === filter_2 && item.isExpired === filter_3
)); ));
} else if (filter_1 === null && filter_2 === 0 && filter_3 === true) { } else if (filter_1 === null && filter_2 === "" && 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 === null && filter_3 === true) { } else if (filter_1 === null && filter_2 === "" && 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 === 0 && filter_3 === true) { } else if (filter_1 !== null && filter_2 === "" && 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.round == filter_1 && item.isExpired == filter_3 (item) => item.examOrder == filter_1 && item.isExpired == filter_3
)); ));
} else if (filter_1 !== null && filter_2 === null && filter_3 === true) { } else if (filter_1 !== null && filter_2 === "" && 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.round == filter_1 && item.isExpired == filter_3 (item) => item.examOrder == filter_1 && item.isExpired == filter_3
)); ));
} else if (filter_1 !== null && filter_2 !== 0 && filter_3 === true) { } else if (filter_1 !== null && filter_2 !== "" && 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) =>
item.round == filter_1 && item.examOrder == filter_1 &&
item.placementType == filter_2 && item.examTypeValue == filter_2 &&
item.isExpired == filter_3 item.isExpired == filter_3
)); ));
} else if (filter_1 === null && filter_2 !== 0 && filter_3 === true) { } else if (filter_1 === null && filter_2 !== "" && 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.placementType == filter_2 && item.isExpired == filter_3 (item) => item.examTypeValue == filter_2 && item.isExpired == filter_3
)); ));
} }
}; };