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

Merge branch 'develop' of github.com:Frappet/bma-ehr-frontend into me

Browse source
This commit is contained in:
Thanit Konmek 2023-06-15 17:22:32 +07:00
commit 1bc7263410
47 changed files with 10024 additions and 1005 deletions
Download patch file Download diff file Expand all files Collapse all files

87
src/modules/01_metadata/components/insignia/Insignia.vue
View file

@ -303,8 +303,8 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const { manageData, changeManageColumns, getInsignia, dataInsignia } = store;
const rows = ref<RequestItemsHistoryObject[]>(dataInsignia); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
const tittleHistory = ref<string>("ประวัติแก้ไขชื่อเครื่องราชฯ"); //
@ -574,46 +574,51 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listInsigniaHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
shortName: e.shortName,
level: e.level,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
insigniaType: e.insigniaType,
note: e.note,
});
});
rows.value.sort(
(
firstItem: RequestItemsHistoryObject,
secondItem: RequestItemsHistoryObject
) => firstItem.level - secondItem.level
);
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await fetchinsigniaType();
});
const result = await getInsignia(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listInsigniaHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// shortName: e.shortName,
// level: e.level,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// insigniaType: e.insigniaType,
// note: e.note,
// });
// });
// rows.value.sort(
// (
// firstItem: RequestItemsHistoryObject,
// secondItem: RequestItemsHistoryObject
// ) => firstItem.level - secondItem.level
// );
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(async () => {
// await fetchinsigniaType();
// });
};
/**

70
src/modules/01_metadata/components/insignia/InsigniaType.vue
View file

@ -204,8 +204,9 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const { manageData, changeManageColumns, getInsigniaType, dataInsigniaType } =
store;
const rows = ref<RequestItemsHistoryObject[]>(dataInsigniaType); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
const tittleHistory = ref<string>("ประวัติแก้ไขลำดับชั้นเครื่องราชฯ"); //
@ -363,37 +364,42 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listInsigniaTypeHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getInsigniaType(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listInsigniaTypeHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

70
src/modules/01_metadata/components/position/Path.vue
View file

@ -217,7 +217,8 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const { manageData, changeManageColumns, getPositionPath, dataPositionPath } =
store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
@ -400,38 +401,43 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listPositionPathHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getPositionPath(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listPositionPathHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// note: e.note,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

72
src/modules/01_metadata/components/positionEmployee/Group.vue
View file

@ -204,7 +204,12 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const {
manageData,
changeManageColumns,
getPositionEmployeeGroup,
dataPositionEmployeeGroup,
} = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
@ -363,37 +368,42 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listPositionEmployeeGroupHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getPositionEmployeeGroup(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listPositionEmployeeGroupHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

73
src/modules/01_metadata/components/positionEmployee/Level.vue
View file

@ -204,7 +204,12 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const {
manageData,
changeManageColumns,
getPositionEmployeeLevel,
dataPositionEmployeeLevel,
} = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
@ -362,37 +367,43 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listPositionEmployeeLevelHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getPositionEmployeeLevel(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listPositionEmployeeLevelHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

72
src/modules/01_metadata/components/positionEmployee/Line.vue
View file

@ -204,7 +204,12 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const {
manageData,
changeManageColumns,
getPositionEmployeeLine,
dataPositionEmployeeLine,
} = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
@ -363,37 +368,42 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listPositionEmployeeLineHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getPositionEmployeeLine(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listPositionEmployeeLineHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

74
src/modules/01_metadata/components/positionEmployee/Position.vue
View file

@ -216,7 +216,12 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const {
manageData,
changeManageColumns,
getPositionEmployee,
dataPositionEmployee,
} = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
@ -399,38 +404,43 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listPositionEmployeePositionHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getPositionEmployee(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listPositionEmployeePositionHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// note: e.note,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

74
src/modules/01_metadata/components/positionEmployee/PositionSide.vue
View file

@ -216,7 +216,12 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const {
manageData,
changeManageColumns,
getPositionEmployeeSide,
dataPositionEmployeeSide,
} = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
@ -399,38 +404,43 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listPositionEmployeePositionSideHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getPositionEmployeeSide(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listPositionEmployeePositionSideHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// note: e.note,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

72
src/modules/01_metadata/components/positionEmployee/Status.vue
View file

@ -204,7 +204,12 @@ const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { success, dateText, messageError, showLoader, hideLoader } = mixin;
const store = useManageDataStore();
const { manageData, changeManageColumns } = store;
const {
manageData,
changeManageColumns,
getPositionEmployeeStatus,
dataPositionEmployeeStatus,
} = store;
const rows = ref<RequestItemsHistoryObject[]>([]); //list data table
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const rawHistory = ref<RequestItemsHistoryObject[]>([]); //raw data history
@ -363,37 +368,42 @@ const $q = useQuasar();
/**
* ฟังก์ชัน get data ล่าสุด
*/
const fetchData = async () => {
const fetchData = async (load: boolean = false) => {
await props.fetchDataComponent();
rows.value.splice(0);
showLoader();
await http
.get(config.API.listPositionEmployeeStatusHistory)
.then((res) => {
let data = res.data.result;
version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: RequestItemsHistoryObject) => {
rows.value.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
updateData.value = false;
hideLoader();
});
const result = await getPositionEmployeeStatus(false, load);
version.value = result.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
idVersion.value = result.idversion; //เลข id ใน mongodb
rows.value = result.data;
updateData.value = false;
// rows.value.splice(0);
// showLoader();
// await http
// .get(config.API.listPositionEmployeeStatusHistory)
// .then((res) => {
// let data = res.data.result;
// version.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
// idVersion.value = data.id; //เลข id ใน mongodb
// data.items.map((e: RequestItemsHistoryObject) => {
// rows.value.push({
// id: e.id,
// name: e.name,
// createdAt: e.createdAt,
// lastUpdatedAt: e.lastUpdatedAt,
// lastUpdateFullName: e.lastUpdateFullName,
// isActive: e.isActive,
// createdFullName: e.createdFullName,
// createdUserId: e.createdUserId,
// lastUpdateUserId: e.lastUpdateUserId,
// });
// });
// })
// .catch((e) => {
// messageError($q, e);
// })
// .finally(() => {
// updateData.value = false;
// hideLoader();
// });
};
/**

904
src/modules/01_metadata/store.ts
View file

@ -5,6 +5,15 @@ import http from "@/plugins/http";
import config from "@/app.config";
import { useCounterMixin } from "@/stores/mixin";
import type { RequestItemsHistoryObject } from "@/modules/01_metadata/interface/request/person/Prefix";
import type { RequestItemsHistoryObject as InsigniaResponse } from "@/modules/01_metadata/interface/request/insignia/Insignia";
import type { RequestItemsHistoryObject as InsigniaTypeResponse } from "@/modules/01_metadata/interface/request/insignia/InsigniaType";
import type { RequestItemsHistoryObject as positionEmployeeResponse } from "@/modules/01_metadata/interface/request/positionEmployee/Position";
import type { RequestItemsHistoryObject as positionEmployeeSideResponse } from "@/modules/01_metadata/interface/request/positionEmployee/PositionSide";
import type { RequestItemsHistoryObject as positionEmployeeGroupResponse } from "@/modules/01_metadata/interface/request/positionEmployee/Group";
import type { RequestItemsHistoryObject as positionEmployeeLineResponse } from "@/modules/01_metadata/interface/request/positionEmployee/Line";
import type { RequestItemsHistoryObject as positionEmployeeLevelResponse } from "@/modules/01_metadata/interface/request/positionEmployee/Level";
import type { RequestItemsHistoryObject as positionEmployeeStatusResponse } from "@/modules/01_metadata/interface/request/positionEmployee/Status";
import type { RequestItemsHistoryObject as positionPathResponse } from "@/modules/01_metadata/interface/request/position/Path";
const $q = useQuasar();
const mixin = useCounterMixin();
@ -13,6 +22,25 @@ const { success, messageError, showLoader, hideLoader } = mixin;
export const useManageDataStore = defineStore("manage", () => {
const dataPrefix = ref<RequestItemsHistoryObject[]>([]); //list data table
const draftPrefix = ref<RequestItemsHistoryObject[]>([]); //list data table
const dataInsignia = ref<InsigniaResponse[]>([]); //list data table
const draftInsignia = ref<InsigniaResponse[]>([]); //list data table
const dataInsigniaType = ref<InsigniaTypeResponse[]>([]); //list data table
const draftInsigniaType = ref<InsigniaTypeResponse[]>([]); //list data table
const dataPositionEmployee = ref<positionEmployeeResponse[]>([]); //list data table
const draftPositionEmployee = ref<positionEmployeeResponse[]>([]); //list data table
const dataPositionEmployeeSide = ref<positionEmployeeSideResponse[]>([]); //list data table
const draftPositionEmployeeSide = ref<positionEmployeeSideResponse[]>([]); //list data table
const dataPositionEmployeeGroup = ref<positionEmployeeGroupResponse[]>([]); //list data table
const draftPositionEmployeeGroup = ref<positionEmployeeGroupResponse[]>([]); //list data table
const dataPositionEmployeeLine = ref<positionEmployeeLineResponse[]>([]); //list data table
const draftPositionEmployeeLine = ref<positionEmployeeLineResponse[]>([]); //list data table
const dataPositionEmployeeLevel = ref<positionEmployeeLevelResponse[]>([]); //list data table
const draftPositionEmployeeLevel = ref<positionEmployeeLevelResponse[]>([]); //list data table
const dataPositionEmployeeStatus = ref<positionEmployeeStatusResponse[]>([]); //list data table
const draftPositionEmployeeStatus = ref<positionEmployeeStatusResponse[]>([]); //list data table
const dataPositionPath = ref<positionPathResponse[]>([]); //list data table
const draftPositionPath = ref<positionPathResponse[]>([]); //list data table
const storeIdVersion = ref<string>(""); //id data ใน mongodb
const storeVersion = ref<string>("published"); //รายการข้อมูลล่าสุดได้เผยแพร่หรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
interface manage {
@ -269,6 +297,267 @@ export const useManageDataStore = defineStore("manage", () => {
}
};
const getInsigniaType = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataInsignia.value.length === 0) {
await fetchInsigniaType(true, selector);
return {
data: draftInsigniaType.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchInsigniaType(true, selector);
return {
data: draftInsigniaType.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftInsigniaType.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getInsignia = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataInsignia.value.length === 0) {
await fetchInsignia(true, selector);
return {
data: draftInsignia.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchInsignia(true, selector);
return {
data: draftInsignia.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftInsignia.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getPositionEmployee = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataPositionEmployee.value.length === 0) {
await fetchPositionEmployee(true, selector);
return {
data: draftPositionEmployee.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchPositionEmployee(true, selector);
return {
data: draftPositionEmployee.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftPositionEmployee.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getPositionEmployeeSide = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataPositionEmployeeSide.value.length === 0) {
await fetchPositionEmployeeSide(true, selector);
return {
data: draftPositionEmployeeSide.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchPositionEmployeeSide(true, selector);
return {
data: draftPositionEmployeeSide.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftPositionEmployeeSide.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getPositionEmployeeGroup = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataPositionEmployeeGroup.value.length === 0) {
await fetchPositionEmployeeGroup(true, selector);
return {
data: draftPositionEmployeeGroup.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchPositionEmployeeGroup(true, selector);
return {
data: draftPositionEmployeeGroup.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftPositionEmployeeGroup.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getPositionEmployeeLine = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataPositionEmployeeLine.value.length === 0) {
await fetchPositionEmployeeLine(true, selector);
return {
data: draftPositionEmployeeLine.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchPositionEmployeeLine(true, selector);
return {
data: draftPositionEmployeeLine.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftPositionEmployeeLine.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getPositionEmployeeLevel = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataPositionEmployeeLevel.value.length === 0) {
await fetchPositionEmployeeLevel(true, selector);
return {
data: draftPositionEmployeeLevel.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchPositionEmployeeLevel(true, selector);
return {
data: draftPositionEmployeeLevel.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftPositionEmployeeLevel.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getPositionEmployeeStatus = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataPositionEmployeeStatus.value.length === 0) {
await fetchPositionEmployeeStatus(true, selector);
return {
data: draftPositionEmployeeStatus.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchPositionEmployeeStatus(true, selector);
return {
data: draftPositionEmployeeStatus.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftPositionEmployeeStatus.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const getPositionPath = async (
selector: boolean = false,
newFetch: boolean = false
) => {
if (dataPositionPath.value.length === 0) {
await fetchPositionPath(true, selector);
return {
data: draftPositionPath.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
if (newFetch) {
await fetchPositionPath(true, selector);
return {
data: draftPositionPath.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
} else {
return {
data: draftPositionPath.value,
version: storeVersion.value,
idversion: storeIdVersion.value,
};
}
}
};
const fetchPrefix = async (loader: boolean, selector: boolean) => {
let apiPrefix = "";
if (loader) {
@ -316,8 +605,614 @@ export const useManageDataStore = defineStore("manage", () => {
});
};
const fetchInsignia = async (loader: boolean, selector: boolean) => {
let apiInsignia = "";
if (loader) {
showLoader();
}
if (selector) {
apiInsignia = config.API.insignia;
} else {
apiInsignia = config.API.listInsigniaHistory;
}
await http
.get(apiInsignia)
.then((res) => {
const data = res.data.result;
let rows: InsigniaResponse[] = [];
if (selector) {
data.map((e: InsigniaResponse) => {
rows.push({
id: e.id,
name: e.name,
shortName: e.shortName,
level: e.level,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
insigniaType: e.insigniaType,
note: e.note,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: InsigniaResponse) => {
rows.push({
id: e.id,
name: e.name,
shortName: e.shortName,
level: e.level,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
insigniaType: e.insigniaType,
note: e.note,
});
});
}
draftInsignia.value = rows;
if (loader) {
dataInsignia.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchInsigniaType = async (loader: boolean, selector: boolean) => {
let apiInsigniaType = "";
if (loader) {
showLoader();
}
if (selector) {
apiInsigniaType = config.API.insigniaType;
} else {
apiInsigniaType = config.API.listInsigniaTypeHistory;
}
await http
.get(apiInsigniaType)
.then((res) => {
const data = res.data.result;
let rows: InsigniaTypeResponse[] = [];
if (selector) {
data.map((e: InsigniaTypeResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: InsigniaTypeResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
}
draftInsigniaType.value = rows;
if (loader) {
dataInsigniaType.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchPositionEmployee = async (loader: boolean, selector: boolean) => {
let apiPositionEmployee = "";
if (loader) {
showLoader();
}
if (selector) {
apiPositionEmployee = config.API.positionEmployeePosition;
} else {
apiPositionEmployee = config.API.listPositionEmployeePositionHistory;
}
await http
.get(apiPositionEmployee)
.then((res) => {
const data = res.data.result;
let rows: positionEmployeeResponse[] = [];
if (selector) {
data.map((e: positionEmployeeResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: positionEmployeeResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
}
draftPositionEmployee.value = rows;
if (loader) {
dataPositionEmployee.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchPositionEmployeeSide = async (
loader: boolean,
selector: boolean
) => {
let apiPositionEmployeeSide = "";
if (loader) {
showLoader();
}
if (selector) {
apiPositionEmployeeSide = config.API.positionEmployeePositionSide;
} else {
apiPositionEmployeeSide =
config.API.listPositionEmployeePositionSideHistory;
}
await http
.get(apiPositionEmployeeSide)
.then((res) => {
const data = res.data.result;
let rows: positionEmployeeSideResponse[] = [];
if (selector) {
data.map((e: positionEmployeeSideResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: positionEmployeeSideResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
}
draftPositionEmployeeSide.value = rows;
if (loader) {
dataPositionEmployeeSide.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchPositionEmployeeGroup = async (
loader: boolean,
selector: boolean
) => {
let apiPositionEmployeeGroup = "";
if (loader) {
showLoader();
}
if (selector) {
apiPositionEmployeeGroup = config.API.positionEmployeeGroup;
} else {
apiPositionEmployeeGroup = config.API.listPositionEmployeeGroupHistory;
}
await http
.get(apiPositionEmployeeGroup)
.then((res) => {
const data = res.data.result;
let rows: positionEmployeeGroupResponse[] = [];
if (selector) {
data.map((e: positionEmployeeGroupResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: positionEmployeeGroupResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
}
draftPositionEmployeeGroup.value = rows;
if (loader) {
dataPositionEmployeeGroup.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchPositionEmployeeLine = async (
loader: boolean,
selector: boolean
) => {
let apiPositionEmployeeLine = "";
if (loader) {
showLoader();
}
if (selector) {
apiPositionEmployeeLine = config.API.positionEmployeeLine;
} else {
apiPositionEmployeeLine = config.API.listPositionEmployeeLineHistory;
}
await http
.get(apiPositionEmployeeLine)
.then((res) => {
const data = res.data.result;
let rows: positionEmployeeLineResponse[] = [];
if (selector) {
data.map((e: positionEmployeeLineResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: positionEmployeeLineResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
}
draftPositionEmployeeLine.value = rows;
if (loader) {
dataPositionEmployeeLine.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchPositionEmployeeLevel = async (
loader: boolean,
selector: boolean
) => {
let apiPositionEmployeeLevel = "";
if (loader) {
showLoader();
}
if (selector) {
apiPositionEmployeeLevel = config.API.positionEmployeeLevel;
} else {
apiPositionEmployeeLevel = config.API.listPositionEmployeeLevelHistory;
}
await http
.get(apiPositionEmployeeLevel)
.then((res) => {
const data = res.data.result;
let rows: positionEmployeeLevelResponse[] = [];
if (selector) {
data.map((e: positionEmployeeLevelResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: positionEmployeeLevelResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
}
draftPositionEmployeeLevel.value = rows;
if (loader) {
dataPositionEmployeeLevel.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchPositionEmployeeStatus = async (
loader: boolean,
selector: boolean
) => {
let apiPositionEmployeeStatus = "";
if (loader) {
showLoader();
}
if (selector) {
apiPositionEmployeeStatus = config.API.positionEmployeeStatus;
} else {
apiPositionEmployeeStatus = config.API.listPositionEmployeeStatusHistory;
}
await http
.get(apiPositionEmployeeStatus)
.then((res) => {
const data = res.data.result;
let rows: positionEmployeeStatusResponse[] = [];
if (selector) {
data.map((e: positionEmployeeStatusResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: positionEmployeeStatusResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
});
});
}
draftPositionEmployeeStatus.value = rows;
if (loader) {
dataPositionEmployeeStatus.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
const fetchPositionPath = async (loader: boolean, selector: boolean) => {
let apiPositionPath = "";
if (loader) {
showLoader();
}
if (selector) {
apiPositionPath = config.API.positionPath;
} else {
apiPositionPath = config.API.listPositionPathHistory;
}
await http
.get(apiPositionPath)
.then((res) => {
const data = res.data.result;
let rows: positionPathResponse[] = [];
if (selector) {
data.map((e: positionPathResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
} else {
storeVersion.value = data.version; //ตัวแปรที่บอกว่าข้อมูลเผยแพร่ไปหรือยัง published=เผยแพร่แล้ว draft=ยังไม่เผยแพร่
storeIdVersion.value = data.id; //เลข id ใน mongodb
data.items.map((e: positionPathResponse) => {
rows.push({
id: e.id,
name: e.name,
createdAt: e.createdAt,
lastUpdatedAt: e.lastUpdatedAt,
lastUpdateFullName: e.lastUpdateFullName,
isActive: e.isActive,
createdFullName: e.createdFullName,
createdUserId: e.createdUserId,
lastUpdateUserId: e.lastUpdateUserId,
note: e.note,
});
});
}
draftPositionPath.value = rows;
if (loader) {
dataPositionPath.value = rows;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
if (loader) {
hideLoader();
}
});
};
return {
dataPrefix,
dataInsignia,
dataInsigniaType,
dataPositionEmployee,
dataPositionEmployeeSide,
dataPositionEmployeeGroup,
dataPositionEmployeeLine,
dataPositionEmployeeLevel,
dataPositionEmployeeStatus,
dataPositionPath,
storeIdVersion,
storeVersion,
manageData,
@ -325,5 +1220,14 @@ export const useManageDataStore = defineStore("manage", () => {
changeManageCurrentTab,
changeManageLink,
changeManageColumns,
getInsignia,
getInsigniaType,
getPositionEmployee,
getPositionEmployeeSide,
getPositionEmployeeGroup,
getPositionEmployeeLine,
getPositionEmployeeLevel,
getPositionEmployeeStatus,
getPositionPath,
};
});

73
src/modules/05_placement/components/exams_other/Detail.vue Normal file
View file

@ -0,0 +1,73 @@
<!-- หน้า รายละเอียดของ -->
<script setup lang="ts">
import { onMounted, reactive, ref } from "vue";
import { useDataStore } from "@/stores/data";
import { useRouter } from "vue-router";
const router = useRouter();
import Informationvue from "@/modules/05_placement/components/exams_other/Information/layout.vue";
import EducationVue from "@/modules/05_placement/components/exams_other/Education.vue";
import Certicate from "@/modules/05_placement/components/exams_other/Information/Certicate.vue";
import InsigniaVue from "@/modules/05_placement/components/exams_other/Insignia.vue";
import ExamResult from "@/modules/05_placement/components/exams_other/ExamResult.vue";
import Qualification from "@/modules/05_placement/components/exams_other/Qualification.vue";
const store = useDataStore();
const { changeTab } = store;
const statusEdit = ref<boolean>(false);
const profileType = ref<string>("");
const FormData = reactive<any>({
fullName: "นาย กอ กอกอก",
});
onMounted(async () => {
// await checkProfileData();
// await fetchData();
await changeTab("information");
});
</script>
<template>
<div class="col-xs-12 col-sm-12 col-md-8 col-lg-8 row q-pb-sm">
<div class="header-text">
<q-btn icon="mdi-arrow-left" unelevated round dense flat color="primary" class="q-mr-sm"
@click="router.go(-1)" />
รายละเอียดของ {{ FormData.fullName }}
</div>
</div>
<div>
<q-card flat bordered>
<div id="information" name="1" class="row col-12 information">
<Informationvue v-model:statusEdit="statusEdit" :profileType="profileType" />
</div>
<div id="education" name="2" class="row col-12 q-mt-md">
<EducationVue v-model:statusEdit="statusEdit" />
</div>
<div id="certicate" name="15" class="row col-12 q-mt-md">
<Certicate v-model:statusEdit="statusEdit" :profileType="profileType" />
</div>
<div id="insignia" name="4" class="row col-12 q-mt-md">
<InsigniaVue v-model:statusEdit="statusEdit" />
</div>
<div id="examresult" name="0" class="q-px-lg q-py-lg">
<ExamResult />
</div>
<div id="qualification" name="0" class="q-px-lg q-py-lg">
<Qualification />
</div>
</q-card>
</div>
</template>
<style lang="scss" scoped>
.header-text {
font-size: 24px;
font-weight: 700;
line-height: 32px;
letter-spacing: 0.0025em;
color: #35373C;
}
.information:target {
padding-top: 84px;
}
</style>

93
src/modules/05_placement/components/exams_other/DialogFooter.vue Normal file
View file

@ -0,0 +1,93 @@
<script setup lang="ts">
const props = defineProps({
editvisible: Boolean,
next: Boolean,
previous: Boolean,
modalEdit: Boolean,
clickNext: {
type: Function,
default: () => console.log("not function"),
},
clickPrevious: {
type: Function,
default: () => console.log("not function"),
},
cancel: {
type: Function,
default: () => console.log("not function"),
},
edit: {
type: Function,
default: () => console.log("not function"),
},
save: {
type: Function,
default: () => console.log("not function"),
},
validate: {
type: Function,
default: () => console.log("not function"),
},
clickDelete: {
type: Function,
default: () => console.log("not function"),
},
});
const emit = defineEmits([
"update:editvisible",
"update:next",
"update:previous",
]);
const updateEdit = (value: Boolean) => {
emit("update:editvisible", value);
};
const cancel = async () => {
props.cancel();
};
const clickDelete = async () => {
props.clickDelete();
};
const edit = async () => {
updateEdit(!props.editvisible);
props.edit();
};
const checkSave = () => {
props.validate();
props.save();
};
const clickNext = async () => {
await props.clickNext();
};
const clickPrevious = async () => {
await props.clickPrevious();
};
</script>
<template>
<q-card-actions class="text-primary q-py-sm">
<q-btn flat round icon="mdi-menu-left" @click="clickPrevious" v-if="modalEdit == true" :disable="previous == false"
:color="!previous ? 'grey-7' : 'public'" />
<q-btn flat round icon="mdi-menu-right" @click="clickNext" v-if="modalEdit == true" :disable="next == false"
:color="!next ? 'grey-7' : 'public'" />
<q-space />
<q-btn v-if="modalEdit == true" flat round color="red" @click="clickDelete" icon="mdi-delete">
<q-tooltip>ลบข้อมูล</q-tooltip>
</q-btn>
<q-btn v-if="!editvisible" flat round :disabled="editvisible" :color="editvisible ? 'grey-7' : 'primary'"
@click="edit" icon="mdi-pencil-outline">
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
</q-btn>
<div v-else>
<q-btn flat round :disabled="!editvisible" :outline="!editvisible" :color="!editvisible ? 'grey-7' : 'red'"
@click="cancel()" icon="mdi-undo" v-if="modalEdit == true">
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn>
<q-btn flat round :disabled="!editvisible" :color="!editvisible ? 'grey-7' : 'public'" @click="checkSave"
icon="mdi-content-save-outline">
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>
</q-card-actions>
</template>

27
src/modules/05_placement/components/exams_other/DialogHeader.vue Normal file
View file

@ -0,0 +1,27 @@
<script setup lang="ts">
const props = defineProps({
tittle: String,
close: {
type: Function,
default: () => console.log("not function"),
},
});
const close = async () => {
props.close();
};
</script>
<template>
<q-toolbar>
<q-toolbar-title class="text-subtitle2 text-bold">{{
tittle
}}</q-toolbar-title>
<q-btn
icon="close"
unelevated
round
dense
@click="close"
style="color: #ff8080; background-color: #ffdede"
/>
</q-toolbar>
</template>

1381
src/modules/05_placement/components/exams_other/Education.vue Normal file
View file

File diff suppressed because it is too large Load diff

101
src/modules/05_placement/components/exams_other/ExamResult.vue Normal file
View file

@ -0,0 +1,101 @@
<script setup lang="ts">
</script>
<template>
<div class="row">
<q-icon name="mdi-briefcase-edit" size="1.5em" color="grey-5" class="q-pr-md" />
<span class="text-bold text-subtitle2 ">ผลการสอบ</span>
</div>
<div class="row">
<div class="col-7 q-pl-xl">
<q-card class="card-exam">
<div class="row">
<div class="col q-pa-xs header-sub-text-exam">
<div class="q-pb-xs"> ประเภท </div>
<div class="q-pb-xs"> ภาค ก </div>
<div class="q-pb-xs"> ภาค ข </div>
<div class="q-pb-xs"> ภาค ค </div>
<div> รวมทั้งหมด </div>
</div>
<div class="col q-pa-xs">
<div class="header-sub-text-exam-2 q-pb-xs">คะแนนเต็ม</div>
<div class="sub-text-exam q-pb-xs">200</div>
<div class="sub-text-exam q-pb-xs">200</div>
<div class="sub-text-exam q-pb-xs">100</div>
<div class="sub-text-exam ">500</div>
</div>
<div class="col q-pa-xs header-sub-text-exam-2">
<div class="header-sub-text-exam-2 q-pb-xs">คะแนนที่ได้</div>
<div class="sub-text-exam q-pb-xs">133</div>
<div class="sub-text-exam q-pb-xs">149</div>
<div class="sub-text-exam q-pb-xs">100</div>
<div class="sub-text-exam q-pb-xs">382</div>
</div>
</div>
</q-card>
</div>
<div class="col q-pl-xl">
<q-card class="q-pt-xs">
<div class="header-text-right">ผลการสอบ</div>
<div class="sub-text-right q-pb-xs">ผ่าน</div>
<div class="header-text-right">ลำดับที่สอบได้</div>
<div class="sub-text-right q-pb-xs">3</div>
<div class="header-text-right">จำนวนครั้งที่สมัครสอบ</div>
<div class="sub-text-right q-pb-xs">5</div>
</q-card>
</div>
</div>
</template>
<style lang="scss" scoped>
.header-text {
font-size: 18px;
font-weight: 600;
color: #4F4F4F;
}
.header-text-right {
font-size: 12px;
font-weight: 400;
line-height: 150%;
color: #818181;
}
.sub-text-right {
font-size: 14px;
font-weight: 600;
line-height: 150%;
color: #000000;
}
.sub-text {
font-weight: 400;
font-size: 16px;
line-height: 22px;
letter-spacing: 0.0025em;
color: #35373C;
}
.card-exam {
border-radius: 5px;
background: #FAFAFA;
}
.header-sub-text-exam {
font-size: 15px;
font-weight: 500;
line-height: 150%;
color: #818181;
}
.header-sub-text-exam-2 {
font-size: 15px;
font-weight: 500;
line-height: 150%;
color: #00AA86;
}
.sub-text-exam {
font-size: 15px;
font-weight: 500;
color: #000000;
}
</style>

834
src/modules/05_placement/components/exams_other/Information/Address.vue Normal file
View file

@ -0,0 +1,834 @@
<!-- card ข้อมูลที่อยู่ -->
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useDataStore } from "@/stores/data";
import { useQuasar } from "quasar";
import http from "@/plugins/http";
import config from "@/app.config";
import type {
Address,
DataOption,
zipCodeOption,
} from "@/modules/05_placement/components/exams_other/profileType";
import { defaultAddress } from "@/modules/05_placement/components/exams_other/profileType";
import HeaderTop from "@/modules/05_placement/components/exams_other/Information/top.vue";
import type { RequestItemsHistoryObject } from "@/modules//05_placement/interface/request/Address";
import type { ResponseObject } from "@/modules//05_placement/interface/response/Address";
import HistoryTable from "@/components/TableHistory.vue";
import { useRoute } from "vue-router";
import type { AddressOps } from "@/modules//05_placement/interface/index/Main";
import type { QTableProps } from "quasar";
const props = defineProps({
statusEdit: {
type: Boolean,
required: true,
},
notiNoEdit: {
type: Function,
default: () => console.log("not function"),
},
});
const emit = defineEmits(["update:statusEdit"]);
const route = useRoute();
const $q = useQuasar();
const dataStore = useDataStore();
const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { date2Thai, success, messageError, showLoader, hideLoader } = mixin;
const edit = ref<boolean>(false);
const addressData = ref<Address>(defaultAddress);
const myform = ref<any>();
const codep = ref<string>("");
const codec = ref<string>("");
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const tittleHistory = ref<string>("ประวัติแก้ไขข้อมูลที่อยู่"); //
const filterHistory = ref<string>(""); //search data table history
const modalHistory = ref<boolean>(false); //modal ประวัติการแก้ไขข้อมูล
const Ops = ref<AddressOps>({
provinceOps: [],
districtOps: [],
districtCOps: [],
subdistrictOps: [],
subdistrictCOps: [],
});
const OpsFilter = ref<AddressOps>({
provinceOps: [],
districtOps: [],
districtCOps: [],
subdistrictOps: [],
subdistrictCOps: [],
});
const columnsHistory = ref<QTableProps["columns"]>([
{
name: "registrationAddress",
align: "left",
label: "ที่อยู่ตามทะเบียนบ้าน",
sortable: true,
field: "registrationAddress",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "registrationProvince",
align: "left",
label: "จังหวัดตามทะเบียนบ้าน",
sortable: true,
field: "registrationProvince",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "registrationDistrict",
align: "left",
label: "เขต/อำเภอตามทะเบียนบ้าน",
sortable: true,
field: "registrationDistrict",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "registrationSubDistrict",
align: "left",
label: "ตำบล/แขวงตามทะเบียนบ้าน",
sortable: true,
field: "registrationSubDistrict",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "registrationZipCode",
align: "left",
label: "รหัสไปรษณีย์ตามทะเบียนบ้าน",
sortable: true,
field: "registrationZipCode",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "registrationSame",
align: "left",
label: "ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน",
sortable: true,
field: "registrationSame",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "currentAddress",
align: "left",
label: "ที่อยู่ปัจจุบัน",
sortable: true,
field: "currentAddress",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "currentProvince",
align: "left",
label: "จังหวัดปัจจุบัน",
sortable: true,
field: "currentProvince",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "currentDistrict",
align: "left",
label: "เขต/อำเภอปัจจุบัน",
sortable: true,
field: "currentDistrict",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "currentSubDistrict",
align: "left",
label: "ตำบล/แขวงปัจจุบัน",
sortable: true,
field: "currentSubDistrict",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "currentZipCode",
align: "left",
label: "รหัสไปรษณีย์ปัจจุบัน",
sortable: true,
field: "currentZipCode",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "createdFullName",
align: "left",
label: "ผู้ดำเนินการ",
sortable: true,
field: "createdFullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "createdAt",
align: "left",
label: "วันที่แก้ไข",
sortable: true,
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const visibleColumnsHistory = ref<String[]>([
"currentAddress",
"currentDistrict",
"currentProvince",
"currentSubDistrict",
"currentZipCode",
"registrationAddress",
"registrationDistrict",
"registrationProvince",
"registrationSame",
"registrationSubDistrict",
"registrationZipCode",
"createdFullName",
"createdAt",
]);
onMounted(async () => {
// await getNewData();
emit("update:statusEdit", false);
});
const filterSelector = (val: any, update: Function, refData: string) => {
switch (refData) {
case "provinceOps":
update(() => {
Ops.value.provinceOps = OpsFilter.value.provinceOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "districtOps":
update(() => {
Ops.value.districtOps = OpsFilter.value.districtOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "districtCOps":
update(() => {
Ops.value.districtCOps = OpsFilter.value.districtCOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "subdistrictOps":
update(() => {
Ops.value.subdistrictOps = OpsFilter.value.subdistrictOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "subdistrictCOps":
update(() => {
Ops.value.subdistrictCOps = OpsFilter.value.subdistrictCOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
default:
break;
}
};
/**
* ฟังชั้นดูข้อมูลประวัติแก้ไขข้อมูลที่เลือก
*/
const clickHistory = async () => {
modalHistory.value = true;
showLoader();
await http
.get(config.API.profileAdrsHisId(route.params.id.toString()))
.then((res) => {
let data = res.data.result;
rowsHistory.value = [];
data.map((e: RequestItemsHistoryObject) => {
rowsHistory.value.push({
currentAddress: e.currentAddress,
currentDistrict: e.currentDistrict,
currentProvince: e.currentProvince,
currentSubDistrict: e.currentSubDistrict,
currentZipCode: e.currentZipCode,
registrationSame: e.registrationSame,
registrationAddress: e.registrationAddress,
registrationDistrict: e.registrationDistrict,
registrationProvince: e.registrationProvince,
registrationSubDistrict: e.registrationSubDistrict,
registrationZipCode: e.registrationZipCode,
createdFullName: e.createdFullName,
createdAt: new Date(e.createdAt),
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const refreshData = async () => {
myform.value.reset();
await getNewData();
};
const getNewData = async () => {
await fetchData();
await fetchProvince();
await fetchDistrict(addressData.value.provinceId, "1");
await fetchDistrict(addressData.value.provinceIdC, "2");
await fetchSubDistrict(addressData.value.districtId, "1");
await fetchSubDistrict(addressData.value.districtIdC, "2");
await selectSubDistrict(addressData.value.subdistrictId, "1");
await selectSubDistrict(addressData.value.subdistrictIdC, "2");
};
const fetchData = async () => {
showLoader();
await http
.get(config.API.profileAdrsId(route.params.id.toString()))
.then((res) => {
const data: ResponseObject = res.data.result;
addressData.value.address = data.registrationAddress;
addressData.value.addressC = data.currentAddress;
addressData.value.districtId = data.registrationDistrictId;
addressData.value.districtIdC = data.currentDistrictId;
addressData.value.provinceId = data.registrationProvinceId;
addressData.value.provinceIdC = data.currentProvinceId;
addressData.value.subdistrictId = data.registrationSubDistrictId;
addressData.value.subdistrictIdC = data.currentSubDistrictId;
addressData.value.same = data.registrationSame ? "1" : "0";
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const editData = async () => {
const body: ResponseObject = {
registrationSame: addressData.value.same == "1",
registrationAddress: addressData.value.address,
registrationSubDistrictId: addressData.value.subdistrictId,
registrationDistrictId: addressData.value.districtId,
registrationProvinceId: addressData.value.provinceId,
registrationZipCode: codep.value,
currentAddress:
addressData.value.same == "1"
? addressData.value.address
: addressData.value.addressC,
currentSubDistrictId:
addressData.value.same == "1"
? addressData.value.subdistrictId
: addressData.value.subdistrictIdC,
currentDistrictId:
addressData.value.same == "1"
? addressData.value.districtId
: addressData.value.districtIdC,
currentProvinceId:
addressData.value.same == "1"
? addressData.value.provinceId
: addressData.value.provinceIdC,
currentZipCode: addressData.value.same == "1" ? codep.value : codec.value,
createdAt: new Date(),
createdFullName: "-",
};
showLoader();
await http
.put(config.API.profileAdrsId(route.params.id.toString()), body)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await getNewData();
});
};
const saveData = async () => {
await myform.value.validate().then(async (success: boolean) => {
if (success) {
await editData();
} else {
}
});
};
const selectProvince = async (e: string | null, name: string) => {
if (e != null) {
if (name == "1") {
addressData.value.districtId = "";
addressData.value.subdistrictId = "";
codep.value = "";
} else {
addressData.value.districtIdC = "";
addressData.value.subdistrictIdC = "";
codec.value = "";
}
myform.value.resetValidation();
await fetchDistrict(e, name);
}
};
const selectDistrict = async (e: string | null, name: string) => {
if (e != null) {
if (name == "1") {
addressData.value.subdistrictId = "";
codep.value = "";
} else {
addressData.value.subdistrictIdC = "";
codec.value = "";
}
myform.value.resetValidation();
await fetchSubDistrict(e, name);
}
};
const selectSubDistrict = (e: string | null, name: string) => {
if (e != null) {
if (name == "1") {
const findcode = Ops.value.subdistrictOps.filter((r) => r.id == e);
const namecode = findcode.length > 0 ? findcode[0].zipCode : "";
codep.value = namecode;
} else {
const findcode = Ops.value.subdistrictCOps.filter((r) => r.id == e);
const namecode = findcode.length > 0 ? findcode[0].zipCode : "";
codec.value = namecode;
}
}
};
const fetchProvince = async () => {
showLoader();
await http
.get(config.API.province)
.then((res) => {
const data = res.data.result;
let option: DataOption[] = [];
data.map((r: any) => {
option.push({ id: r.id.toString(), name: r.name.toString() });
});
Ops.value.provinceOps = option;
OpsFilter.value.provinceOps = option;
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const fetchDistrict = async (id: string | null, position: string) => {
if (id != null) {
showLoader();
await http
.get(config.API.listDistrict(id))
.then((res) => {
const data = res.data.result;
let option: DataOption[] = [];
data.map((r: any) => {
option.push({ id: r.id.toString(), name: r.name.toString() });
});
if (position == "1") {
Ops.value.districtOps = option;
OpsFilter.value.districtOps = option;
} else {
Ops.value.districtCOps = option;
OpsFilter.value.districtCOps = option;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
};
const fetchSubDistrict = async (id: string | null, position: string) => {
if (id != null) {
showLoader();
await http
.get(config.API.listSubDistrict(id))
.then((res) => {
const data = res.data.result;
let option: zipCodeOption[] = [];
data.map((r: any) => {
option.push({
id: r.id.toString(),
name: r.name.toString(),
zipCode: r.zipCode.toString(),
});
});
if (position == "1") {
Ops.value.subdistrictOps = option;
OpsFilter.value.subdistrictOps = option;
} else {
Ops.value.subdistrictCOps = option;
OpsFilter.value.subdistrictCOps = option;
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
}
};
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false;
props.notiNoEdit();
} else {
emit("update:statusEdit", true);
}
} else {
emit("update:statusEdit", false);
}
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>
<template>
<q-card flat class="col-12 q-px-lg q-py-md q-mt-md">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลที่อยู่"
icon="mdi-map-marker"
:save="saveData"
:history="true"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="refreshData"
:historyClick="clickHistory"
/>
<q-form ref="myform">
<div class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs">
<div class="col-xs-12">
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
type="textarea"
autogrow
:readonly="!edit"
:borderless="!edit"
v-model="addressData.address"
:rules="[(val:string) => !!val || `${'กรุณากรอก ที่อยู่ตามทะเบียนบ้าน'}`]"
:label="`${'ที่อยู่ตามทะเบียนบ้าน'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
:outlined="edit"
dense
lazy-rules
v-model="addressData.provinceId"
emit-value
map-options
option-label="name"
:options="Ops.provinceOps"
option-value="id"
:label="`${'จังหวัด'}`"
@update:model-value="(value:string) => selectProvince(value, '1')"
use-input
input-debounce="0"
@filter="(inputValue:string,
doneFn:Function) => filterSelector(inputValue, doneFn,'provinceOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
:outlined="edit"
dense
lazy-rules
v-model="addressData.districtId"
emit-value
map-options
option-label="name"
:options="Ops.districtOps"
option-value="id"
:label="`${'เขต / อำเภอ'}`"
@update:model-value="(value:string) => selectDistrict(value, '1')"
use-input
input-debounce="0"
@filter="(inputValue:string,
doneFn:Function) => filterSelector(inputValue, doneFn,'districtOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก ตำบล / แขวง'}`]"
:outlined="edit"
dense
lazy-rules
v-model="addressData.subdistrictId"
emit-value
map-options
option-label="name"
:options="Ops.subdistrictOps"
option-value="id"
:label="`${'ตำบล / แขวง'}`"
@update:model-value="(value:string) => selectSubDistrict(value, '1')"
use-input
input-debounce="0"
@filter="(inputValue:string,
doneFn:Function) => filterSelector(inputValue, doneFn,'subdistrictOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"
hide-bottom-space
dense
lazy-rules
readonly
borderless
v-model="codep"
:style="!edit ? '' : 'padding:0 12px;'"
:label="`${'รหัสไปรษณีย์'}`"
/>
</div>
<div class="col-12 q-pt-lg"><q-separator /></div>
<div class="col-xs-12 q-gutter-sm items-center flex q-my-sm">
<label class="text-bold"
>ที่อยู่ปัจจุบันตรงกับที่อยู่ตามทะเบียนบ้าน</label
>
<q-radio
v-model="addressData.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="1"
label="ใช่"
dense
:disable="!edit"
/>
<q-radio
v-model="addressData.same"
checked-icon="task_alt"
unchecked-icon="panorama_fish_eye"
val="0"
label="ไม่"
dense
:disable="!edit"
/>
</div>
<div class="col-xs-12" v-if="addressData.same == '0'">
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
type="textarea"
autogrow
:readonly="!edit"
:borderless="!edit"
v-model="addressData.addressC"
:rules="[(val:string) => !!val || `${'กรุณากรอก ที่อยู่ปัจจุบัน'}`]"
:label="`${'ที่อยู่ปัจจุบัน'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก จังหวัด'}`]"
:outlined="edit"
dense
lazy-rules
v-model="addressData.provinceIdC"
emit-value
map-options
option-label="name"
:options="Ops.provinceOps"
option-value="id"
:label="`${'จังหวัด'}`"
@update:model-value="(value:string) => selectProvince(value, '2')"
use-input
input-debounce="0"
@filter="(inputValue:string,
doneFn:Function) => filterSelector(inputValue, doneFn,'provinceOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก เขต / อำเภอ'}`]"
:outlined="edit"
dense
lazy-rules
v-model="addressData.districtIdC"
emit-value
map-options
option-label="name"
:options="Ops.districtCOps"
option-value="id"
:label="`${'เขต / อำเภอ'}`"
@update:model-value="(value:string) => selectDistrict(value, '2')"
use-input
input-debounce="0"
@filter="(inputValue:string,
doneFn:Function) => filterSelector(inputValue, doneFn,'districtCOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก ตำบล / แขวง'}`]"
:outlined="edit"
dense
lazy-rules
v-model="addressData.subdistrictIdC"
emit-value
map-options
option-label="name"
:options="Ops.subdistrictCOps"
option-value="id"
:label="`${'ตำบล / แขวง'}`"
@update:model-value="(value:string) => selectSubDistrict(value, '2')"
use-input
input-debounce="0"
@filter="(inputValue:string,
doneFn:Function) => filterSelector(inputValue, doneFn,'subdistrictCOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3" v-if="addressData.same == '0'">
<q-input
:class="getClass(edit)"
hide-bottom-space
dense
lazy-rules
readonly
borderless
v-model="codec"
:style="!edit ? '' : 'padding:0 12px;'"
:label="`${'รหัสไปรษณีย์'}`"
/>
</div>
</div>
</q-form>
</q-card>
<HistoryTable
:rows="rowsHistory"
:columns="columnsHistory"
:filter="filterHistory"
:visible-columns="visibleColumnsHistory"
v-model:modal="modalHistory"
v-model:inputfilter="filterHistory"
v-model:inputvisible="visibleColumnsHistory"
v-model:tittle="tittleHistory"
>
<template #columns="props">
<q-tr :props="props">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<div v-if="col.name == 'createdAt'" class="table_ellipsis">
{{ date2Thai(col.value) }}
</div>
<div
v-else-if="col.name == 'registrationSame'"
class="table_ellipsis"
>
{{ col.value ? "ใช่" : "ไม่" }}
</div>
<div v-else class="table_ellipsis">
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</HistoryTable>
</template>

828
src/modules/05_placement/components/exams_other/Information/Certicate.vue Normal file
View file

@ -0,0 +1,828 @@
<!-- card ใบอนุญาตประกอบอาชีพ -->
<script setup lang="ts">
import { onMounted, ref, watch } from "vue";
import { useRoute } from "vue-router";
import { useProfileDataStore } from "@/modules/05_placement/store";
import { useCounterMixin } from "@/stores/mixin";
import { useDataStore } from "@/stores/data";
import ProfileTable from "@/modules/05_placement/components/exams_other/Table.vue";
import DialogHeader from "@/modules/05_placement/components/exams_other/DialogHeader.vue";
import DialogFooter from "@/modules/05_placement/components/exams_other/DialogFooter.vue";
import { useQuasar } from "quasar";
import type {
RequestItemsObject,
DataProps,
} from "@/modules/05_placement/interface/request/Certificate";
import type { ResponseObject } from "@/modules/05_placement/interface/response/Certificate";
import HistoryTable from "@/components/TableHistory.vue";
import http from "@/plugins/http";
import config from "@/app.config";
import type { QTableProps } from "quasar";
const props = defineProps({
statusEdit: {
type: Boolean,
required: true,
},
profileType: {
type: String,
required: true,
},
});
const $q = useQuasar();
const store = useProfileDataStore();
const { profileData, changeProfileColumns } = store;
const dataStore = useDataStore();
const { loaderPage } = dataStore;
const mixin = useCounterMixin();
const { date2Thai, success, dateToISO, messageError, showLoader, hideLoader } =
mixin;
const route = useRoute();
const id = ref<string>("");
const certificateNo = ref<string>();
const issuer = ref<string>();
const issueDate = ref<Date>(new Date());
const expireDate = ref<Date>(new Date());
const certificateType = ref<string>();
const minDate = ref<Date>();
const myForm = ref<any>(); //form data input
const edit = ref<boolean>(false); //เช็คการกดปุ่มแก้ไขใน dialog
const modal = ref<boolean>(false); //modal add detail
const modalEdit = ref<boolean>(false); //modal ที่แสดงใช้สำหรับแก้ไขหรือไม่
const rawItem = ref<RequestItemsObject>(); //ข้อมูลเดิมที่เลือกใน row นั้น
const rowIndex = ref<number>(0); //indexข้อมูลเดิมที่เลือกใน row นั้น
const previous = ref<boolean>(); //แสดงปุ่มดูข้อมูลก่อนหน้า
const next = ref<boolean>(); //แสดงปุ่มดูข้อมูลต่อไป
const editRow = ref<boolean>(false); //เช็คมีการแก้ไขข้อมูล
const rowsHistory = ref<RequestItemsObject[]>([]); //select data history
const tittleHistory = ref<string>("ประวัติแก้ไขใบอนุญาตประกอบอาชีพ"); //
const filterHistory = ref<string>(""); //search data table history
const modalHistory = ref<boolean>(false); //modal ประวัติการแก้ไขข้อมูล
const checkValidate = ref<boolean>(false); //validate data ผ่านหรือไม่
// const profileId = ref<string>(route.params.id.toString());
const profileId = ref<string>('');
const rows = ref<RequestItemsObject[]>([]);
const filter = ref<string>(""); //search data table
const visibleColumns = ref<String[]>([]);
profileData.certicate.columns.length == 0
? (visibleColumns.value = [
"certificateType",
"certificateNo",
"issuer",
"issueDate",
"expireDate",
])
: (visibleColumns.value = profileData.certicate.columns);
const columns = ref<QTableProps["columns"]>([
{
name: "certificateType",
align: "left",
label: "ชื่อใบอนุญาต",
sortable: true,
field: "certificateType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "issuer",
align: "left",
label: "หน่วยงานผู้ออกใบอนุญาต",
sortable: true,
field: "issuer",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "certificateNo",
align: "left",
label: "เลขที่ใบอนุญาต",
sortable: true,
field: "certificateNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "issueDate",
align: "left",
label: "วันที่ออกใบอนุญาต",
sortable: true,
field: "issueDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "expireDate",
align: "left",
label: "วันที่หมดอายุ",
sortable: true,
field: "expireDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const columnsHistory = ref<QTableProps["columns"]>([
{
name: "certificateType",
align: "left",
label: "ชื่อใบอนุญาต",
sortable: true,
field: "certificateType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "issuer",
align: "left",
label: "หน่วยงานผู้ออกใบอนุญาต",
sortable: true,
field: "issuer",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "certificateNo",
align: "left",
label: "เลขที่ใบอนุญาต",
sortable: true,
field: "certificateNo",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "issueDate",
align: "left",
label: "วันที่ออกใบอนุญาต",
sortable: true,
field: "issueDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "expireDate",
align: "left",
label: "วันที่หมดอายุ",
sortable: true,
field: "expireDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "createdFullName",
align: "left",
label: "ผู้ดำเนินการ",
sortable: true,
field: "createdFullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "createdAt",
align: "left",
label: "วันที่แก้ไข",
sortable: true,
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const visibleColumnsHistory = ref<String[]>([
"certificateType",
"certificateNo",
"issuer",
"issueDate",
"expireDate",
"createdFullName",
"createdAt",
]);
watch(visibleColumns, async (count: String[], prevCount: String[]) => {
await changeProfileColumns("certicate", count);
});
onMounted(async () => {
// await fetchData();
});
const fetchData = async () => {
showLoader();
await http
.get(config.API.profileCertId(profileId.value))
.then((res) => {
let data = res.data.result;
rows.value = [];
data.map((e: ResponseObject) => {
rows.value.push({
id: e.id,
certificateNo: e.certificateNo,
issuer: e.issuer,
issueDate: new Date(e.issueDate),
expireDate: new Date(e.expireDate),
certificateType: e.certificateType,
createdFullName: e.createdFullName,
createdAt: new Date(e.createdAt),
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
/**
* กดดูข้อมูลก่อนหน้า
*/
const clickPrevious = async () => {
edit.value = false;
rowIndex.value -= 1;
await getData();
await checkRowPage();
};
/**
* กดดูข้อมูลต่อไป
*/
const clickNext = async () => {
edit.value = false;
rowIndex.value += 1;
await getData();
await checkRowPage();
};
/**
* กดดูข้อมูลต่อไป
*/
const getData = () => {
const row = rows.value[rowIndex.value];
certificateNo.value = row.certificateNo;
issuer.value = row.issuer;
issueDate.value = row.issueDate;
expireDate.value = row.expireDate;
certificateType.value = row.certificateType;
id.value = row.id;
};
/**
* เช็คปุ่มดูข้อมูล ย้อน กับ ต่อไป ว่าต้องแสดงไหม
*/
const checkRowPage = () => {
editRow.value = false;
next.value = true;
previous.value = true;
if (rowIndex.value + 1 >= rows.value.length) {
next.value = false;
}
if (rowIndex.value - 1 < 0) {
previous.value = false;
}
};
/**
* กดปุ่มแก้ไขใน dialog
*/
const clickEdit = () => {
editRow.value = false;
next.value = false;
previous.value = false;
};
/**
* กดปุ่มเพิ่มด้านบน table
*/
const clickAdd = async () => {
editRow.value = false;
await addData();
};
/**
* กดบันทึกใน dialog
*/
const clickSave = async () => {
myForm.value.validate().then(async (result: boolean) => {
if (result) {
if (modalEdit.value) {
await editData();
} else {
await saveData();
}
}
});
};
/**
* บันทึกเพิ่มข้อมูล
*/
const saveData = async () => {
showLoader();
await http
.post(config.API.profileCertId(profileId.value), {
id: id.value,
certificateNo: certificateNo.value,
issuer: issuer.value,
issueDate: dateToISO(issueDate.value),
expireDate: dateToISO(expireDate.value),
certificateType: certificateType.value,
})
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
modal.value = false;
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await fetchData();
});
};
/**
* บันทึกแก้ไขข้อมูล
*/
const editData = async () => {
showLoader();
await http
.put(config.API.profileCertId(id.value), {
id: id.value,
certificateNo: certificateNo.value,
issuer: issuer.value,
issueDate: dateToISO(issueDate.value),
expireDate: dateToISO(expireDate.value),
certificateType: certificateType.value,
})
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
modal.value = false;
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await fetchData();
});
};
/**
* ลบลบข้อมูล
*/
const clickDelete = async () => {
$q.dialog({
title: `ลบข้อมูล`,
message: `ต้องการทำการลบข้อมูลนี้ใช่หรือไม่?`,
cancel: "ยกเลิก",
ok: "ยืนยัน",
persistent: true,
})
.onOk(async () => {
showLoader();
await http
.delete(config.API.profileCertId(id.value))
.then((res) => {
success($q, "ลบข้อมูลสำเร็จ");
modal.value = false;
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
await fetchData();
});
})
.onCancel(async () => {
await fetchData();
});
};
/**
* กดปิด dialog
*/
const clickClose = async () => {
if (editRow.value == true) {
$q.dialog({
title: `ข้อมูลมีการแก้ไข`,
message: `ยืนยันที่จะปิดโดยไม่บันทึกใช่หรือไม่?`,
cancel: "ยกเลิก",
ok: "ยืนยัน",
persistent: true,
}).onOk(async () => {
modal.value = false;
next.value = false;
previous.value = false;
});
} else {
modal.value = false;
next.value = false;
previous.value = false;
}
};
/**
* กดเลือกข้อมูลที่จะแก้ไข
* @param props ค่า props ใน row ที่เลือก
*/
const selectData = async (props: DataProps) => {
modalEdit.value = true; //กดสำหรับแก้ไขข้อมูล
modal.value = true; //modal ที่เด้งขึ้นมา
edit.value = false; //ปุ่ม edit ใน modal
rawItem.value = props.row;
rowIndex.value = props.rowIndex;
certificateNo.value = props.row.certificateNo;
issuer.value = props.row.issuer;
issueDate.value = props.row.issueDate;
expireDate.value = props.row.expireDate;
certificateType.value = props.row.certificateType;
id.value = props.row.id;
await checkRowPage();
};
/**
* กดปุ่มเพิ่มบน table
*/
const addData = () => {
modalEdit.value = false;
modal.value = true;
edit.value = true;
certificateNo.value = "";
issuer.value = "";
issueDate.value = new Date();
expireDate.value = new Date();
certificateType.value = "";
};
/**
* ฟังก์ชันปุ่มยกเลิกการแก้ไขข้อมูล
*/
const clickCancel = async () => {
if (editRow.value == true) {
$q.dialog({
title: `ข้อมูลมีการแก้ไข`,
message: `ยืนยันยกเลิกการแก้ไขใช่หรือไม่?`,
cancel: "ยกเลิก",
ok: "ยืนยัน",
persistent: true,
}).onOk(async () => {
edit.value = false;
await checkRowPage();
await getData();
});
} else {
edit.value = false;
await checkRowPage();
}
};
/**
* เช็คว่ามีการแก้ไขข้อมูล
*/
const clickEditRow = () => {
editRow.value = true;
};
/**
* ฟังชั้นดูข้อมูลประวัติแก้ไขข้อมูลที่เลือก
* @param row ข้อมูล row ที่ดูประวัติการแก้ไข
*/
const clickHistory = async (row: RequestItemsObject) => {
tittleHistory.value =
props.profileType == "employee"
? "ประวัติแก้ไขใบอนุญาตของลูกจ้าง"
: "ประวัติแก้ไขใบอนุญาตประกอบอาชีพ";
modalHistory.value = true;
showLoader();
await http
.get(config.API.profileCertHisId(row.id))
.then((res) => {
let data = res.data.result;
rowsHistory.value = [];
data.map((e: ResponseObject) => {
rowsHistory.value.push({
id: e.id,
certificateNo: e.certificateNo,
issuer: e.issuer,
issueDate: new Date(e.issueDate),
expireDate: new Date(e.expireDate),
certificateType: e.certificateType,
createdFullName: e.createdFullName,
createdAt: new Date(e.createdAt),
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
/**
* validate input ใน dialog
*/
const validateData = async () => {
checkValidate.value = true;
await myForm.value.validate().then((result: boolean) => {
if (result == false) {
checkValidate.value = false;
}
});
};
/**
* class จัดรูปแบบแสดงระหว่างข้อมูลที่แก้ไขหรือแสดงเฉยๆ
* @param val ข้อมูล input สำหรับแก้ไขหรือไม่
*/
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>
<template>
<q-card flat bordered class="col-12 q-px-lg q-py-md q-mt-md">
<q-form ref="myForm">
<ProfileTable
:rows="rows"
:columns="columns"
:filter="filter"
:visible-columns="visibleColumns"
v-model:inputfilter="filter"
v-model:inputvisible="visibleColumns"
:add="clickAdd"
:name="
profileType == 'employee'
? 'ใบอนุญาตของลูกจ้าง'
: 'ใบอนุญาตประกอบอาชีพ'
"
icon="mdi-book"
:statusEdit="statusEdit"
>
<template #columns="props">
<q-tr :props="props">
<q-td
v-for="col in props.cols"
:key="col.name"
:props="props"
@click="selectData(props)"
class="cursor-pointer"
>
<div
v-if="col.name == 'issueDate' || col.name == 'expireDate'"
class="table_ellipsis"
>
{{ date2Thai(col.value) }}
</div>
<div v-else class="table_ellipsis">
{{ col.value }}
</div>
</q-td>
<q-td auto-width>
<q-btn
color="info"
flat
dense
round
size="14px"
icon="mdi-history"
@click="clickHistory(props.row)"
/>
</q-td>
</q-tr>
</template>
</ProfileTable>
</q-form>
</q-card>
<!-- popup Edit window-->
<q-dialog v-model="modal" persistent>
<q-card style="width: 600px">
<q-form ref="myForm">
<DialogHeader
:tittle="
profileType == 'employee'
? 'ใบอนุญาตของลูกจ้าง'
: 'ใบอนุญาตประกอบอาชีพ'
"
:close="clickClose"
/>
<q-separator />
<q-card-section class="q-p-sm">
<div
class="row col-12 items-center q-col-gutter-x-xs q-col-gutter-y-xs"
>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="certificateType"
:rules="[(val) => !!val || `${'กรุณากรอกชื่อใบอนุญาต'}`]"
hide-bottom-space
:label="`${'ชื่อใบอนุญาต'}`"
@update:modelValue="clickEditRow"
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="issuer"
:rules="[
(val) => !!val || `${'กรุณากรอกหน่วยงานผู้ออกใบอนุญาต'}`,
]"
hide-bottom-space
:label="`${'หน่วยงานผู้ออกใบอนุญาต'}`"
@update:modelValue="clickEditRow"
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="certificateNo"
:rules="[(val) => !!val || `${'กรุณากรอกเลขที่ใบอนุญาต'}`]"
hide-bottom-space
:label="`${'เลขที่ใบอนุญาต'}`"
@update:modelValue="clickEditRow"
/>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<datepicker
menu-class-name="modalfix"
:readonly="!edit"
v-model="issueDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
@update:modelValue="clickEditRow"
week-start="0"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:borderless="!edit"
:model-value="date2Thai(issueDate)"
:rules="[
(val) => !!val || `${'กรุณาเลือกวันที่ออกใบอนุญาต'}`,
]"
hide-bottom-space
:label="`${'วันที่ออกใบอนุญาต'}`"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
:style="
edit
? 'color: var(--q-primary)'
: 'color: var(--q-grey)'
"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-6 col-sm-6 col-md-6">
<datepicker
menu-class-name="modalfix"
v-model="expireDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
:min-date="minDate"
:readonly="!edit"
@update:modelValue="clickEditRow"
week-start="0"
>
<template #year="{ year }">{{ year + 543 }}</template>
<template #year-overlay-value="{ value }">{{
parseInt(value + 543)
}}</template>
<template #trigger>
<q-input
:class="getClass(edit)"
:outlined="edit"
dense
lazy-rules
:borderless="!edit"
:model-value="date2Thai(expireDate)"
:rules="[(val) => !!val || `${'กรุณาเลือกวันที่หมดอายุ'}`]"
hide-bottom-space
:label="`${'วันที่หมดอายุ'}`"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
:style="
edit
? 'color: var(--q-primary)'
: 'color: var(--q-grey)'
"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
</div>
</q-card-section>
<q-separator />
<DialogFooter
:cancel="clickCancel"
:edit="clickEdit"
:save="clickSave"
:validate="validateData"
:clickNext="clickNext"
:clickPrevious="clickPrevious"
:clickDelete="clickDelete"
v-model:editvisible="edit"
v-model:next="next"
v-model:previous="previous"
v-model:modalEdit="modalEdit"
/>
</q-form>
</q-card>
</q-dialog>
<HistoryTable
:rows="rowsHistory"
:columns="columnsHistory"
:filter="filterHistory"
:visible-columns="visibleColumnsHistory"
v-model:modal="modalHistory"
v-model:inputfilter="filterHistory"
v-model:inputvisible="visibleColumnsHistory"
v-model:tittle="tittleHistory"
>
<template #columns="props">
<q-tr :props="props">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<div
v-if="
col.name == 'expireDate' ||
col.name == 'issueDate' ||
col.name == 'createdAt'
"
class="table_ellipsis"
>
{{ date2Thai(col.value) }}
</div>
<div v-else class="table_ellipsis">
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</HistoryTable>
</template>
<style lang="scss">
.modalfix {
position: fixed !important;
}
</style>

992
src/modules/05_placement/components/exams_other/Information/Information.vue Normal file
View file

@ -0,0 +1,992 @@
<!-- card ข้อมูลส่วนตัว -->
<script setup lang="ts">
import { ref, onMounted } from "vue";
import { useCounterMixin } from "@/stores/mixin";
import { useDataStore } from "@/stores/data";
import { useQuasar } from "quasar";
import type {
Information,
DataOption,
} from "@/modules/05_placement/components/exams_other/profileType";
import { defaultInformation } from "@/modules/05_placement/components/exams_other/profileType";
import type {
RequestItemsHistoryObject,
Columns,
} from "@/modules/05_placement/interface/request/Information";
import type { ResponseObject } from "@/modules/05_placement/interface/response/Information";
import type { InformationOps } from "@/modules/05_placement/interface/index/Main";
import HeaderTop from "@/modules/05_placement/components/exams_other/Information/top.vue";
import HistoryTable from "@/components/TableHistory.vue";
import http from "@/plugins/http";
import config from "@/app.config";
import { useRoute } from "vue-router";
import { useProfileDataStore } from "@/modules/05_placement/store";
import type { QTableColumn, QForm } from "quasar";
const props = defineProps({
statusEdit: {
type: Boolean,
required: true,
},
notiNoEdit: {
type: Function,
default: () => console.log("not function"),
},
});
const emit = defineEmits(["update:statusEdit"]);
const route = useRoute();
const $q = useQuasar();
const mixin = useCounterMixin();
const {
date2Thai,
success,
dateToISO,
messageError,
modalError,
showLoader,
hideLoader,
} = mixin;
const dataStore = useDataStore();
const { loaderPage } = dataStore;
const profileStore = useProfileDataStore();
const { changeRetireText, changeBirth } = profileStore;
const edit = ref<boolean>(false);
const informaData = ref<Information>(defaultInformation);
const rowsHistory = ref<RequestItemsHistoryObject[]>([]); //select data history
const tittleHistory = ref<string>("ประวัติแก้ไขข้อมูลส่วนตัว"); //
const filterHistory = ref<string>(""); //search data table history
const modalHistory = ref<boolean>(false); //modal ประวัติการแก้ไขข้อมูล
const age = ref<boolean>(true);
const myform = ref<QForm | null>(null);
const Ops = ref<InformationOps>({
prefixOps: [],
genderOps: [],
bloodOps: [],
statusOps: [],
religionOps: [],
employeeClassOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
employeeTypeOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
});
const OpsFilter = ref<InformationOps>({
prefixOps: [],
genderOps: [],
bloodOps: [],
statusOps: [],
religionOps: [],
employeeClassOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
employeeTypeOps: [
{ id: "gov", name: "งบประมาณเงินอุดหนุนรัฐบาล" },
{ id: "bkk", name: "งบประมาณกรุงเทพมหานคร" },
],
});
const columnsHistory = ref<QTableColumn[]>([
{
name: "citizenId",
align: "left",
label: "เลขบัตรประจำตัวประชาชน",
sortable: true,
field: "citizenId",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "prefix",
align: "left",
label: "คำนำหน้า",
sortable: true,
field: "prefix",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "firstName",
align: "left",
label: "ชื่อ",
sortable: true,
field: "firstName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "lastName",
align: "left",
label: "นามสกุล",
sortable: true,
field: "lastName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "birthDate",
align: "left",
label: "วัน/เดือน/ปี เกิด",
sortable: true,
field: "birthDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "gender",
align: "left",
label: "เพศ",
sortable: true,
field: "gender",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "relationship",
align: "left",
label: "สถานภาพ",
sortable: true,
field: "relationship",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "bloodGroup",
align: "left",
label: "หมู่เลือด",
sortable: true,
field: "bloodGroup",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "nationality",
align: "left",
label: "สัญชาติ",
sortable: true,
field: "nationality",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "race",
align: "left",
label: "เชื้อชาติ",
sortable: true,
field: "race",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "religion",
align: "left",
label: "ศาสนา",
sortable: true,
field: "religion",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "telephoneNumber",
align: "left",
label: "เบอร์โทร",
sortable: true,
field: "telephoneNumber",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "employeeType",
align: "left",
label: "ประเภทการจ้าง",
sortable: true,
field: "employeeType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "employeeClass",
align: "left",
label: "ประเภทลูกจ้าง",
sortable: true,
field: "employeeClass",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "createdFullName",
align: "left",
label: "ผู้ดำเนินการ",
sortable: true,
field: "createdFullName",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "createdAt",
align: "left",
label: "วันที่แก้ไข",
sortable: true,
field: "createdAt",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
]);
const visibleColumnsHistory = ref<String[]>([
"citizenId",
"prefix",
"firstName",
"lastName",
"birthDate",
"gender",
"relationship",
"bloodGroup",
"nationality",
"race",
"religion",
"telephoneNumber",
"employeeType",
"employeeClass",
"createdFullName",
"createdAt",
]);
onMounted(async () => {
// await fetchPerson();
// await fetchData();
emit("update:statusEdit", false);
});
const onCancel = async () => {
if (myform.value != null) {
myform.value.reset();
}
await fetchData();
};
/**
* get รายการ ข้อมูลเกี่ยวกับบุคคล
*/
const fetchPerson = async () => {
showLoader();
await http
.get(config.API.person)
.then((res) => {
const data = res.data.result;
let optionbloodGroups: DataOption[] = [];
data.bloodGroups.map((r: any) => {
optionbloodGroups.push({
id: r.id.toString(),
name: r.name.toString(),
});
});
Ops.value.bloodOps = optionbloodGroups;
OpsFilter.value.bloodOps = optionbloodGroups;
let optiongenders: DataOption[] = [];
data.genders.map((r: any) => {
optiongenders.push({
id: r.id.toString(),
name: r.name.toString(),
});
});
Ops.value.genderOps = optiongenders;
OpsFilter.value.genderOps = optiongenders;
let optionprefixs: DataOption[] = [];
data.prefixs.map((r: any) => {
optionprefixs.push({
id: r.id.toString(),
name: r.name.toString(),
});
});
Ops.value.prefixOps = optionprefixs;
OpsFilter.value.prefixOps = optionprefixs;
let optionrelationships: DataOption[] = [];
data.relationships.map((r: any) => {
optionrelationships.push({
id: r.id.toString(),
name: r.name.toString(),
});
});
Ops.value.statusOps = optionrelationships;
OpsFilter.value.statusOps = optionrelationships;
let optionreligions: DataOption[] = [];
data.religions.map((r: any) => {
optionreligions.push({
id: r.id.toString(),
name: r.name.toString(),
});
});
Ops.value.religionOps = optionreligions;
OpsFilter.value.religionOps = optionreligions;
})
.catch((e: any) => {})
.finally(() => {
hideLoader();
});
};
/**
* ฟังชั้นดูข้อมูลประวัติแก้ไขข้อมูลที่เลือก
*/
const clickHistory = async () => {
modalHistory.value = true;
showLoader();
await http
.get(config.API.profileInforHisId(route.params.id.toString()))
.then((res) => {
let data = res.data.result;
rowsHistory.value = [];
data.map((e: RequestItemsHistoryObject) => {
rowsHistory.value.push({
citizenId: e.citizenId,
prefix: e.prefix,
firstName: e.firstName,
lastName: e.lastName,
birthDate: new Date(e.birthDate),
gender: e.gender,
relationship: e.relationship,
bloodGroup: e.bloodGroup,
nationality: e.nationality,
race: e.race,
religion: e.religion,
telephoneNumber: e.telephoneNumber,
employeeType:
e.employeeType == "gov"
? "งบประมาณเงินอุดหนุนรัฐบาล"
: e.employeeType == "bkk"
? "งบประมาณกรุงเทพมหานคร"
: "-",
employeeClass:
e.employeeClass == "perm"
? "ลูกจ้างประจำ"
: e.employeeClass == "temp"
? "ลูกจ้างชั่วคราว"
: "-",
createdFullName: e.createdFullName,
createdAt: new Date(e.createdAt),
});
});
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const filterSelector = (val: any, update: Function, refData: string) => {
switch (refData) {
case "prefixOps":
update(() => {
Ops.value.prefixOps = OpsFilter.value.prefixOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "genderOps":
update(() => {
Ops.value.genderOps = OpsFilter.value.genderOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "bloodOps":
update(() => {
Ops.value.bloodOps = OpsFilter.value.bloodOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "statusOps":
update(() => {
Ops.value.statusOps = OpsFilter.value.statusOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "religionOps":
update(() => {
Ops.value.religionOps = OpsFilter.value.religionOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "employeeClassOps":
update(() => {
Ops.value.employeeClassOps = OpsFilter.value.employeeClassOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
case "employeeTypeOps":
update(() => {
Ops.value.employeeTypeOps = OpsFilter.value.employeeTypeOps.filter(
(v: DataOption) => v.name.indexOf(val) > -1
);
});
break;
default:
break;
}
};
const handleDate = async (modelData: Date) => {
informaData.value.birthDate = modelData;
await calRetire(modelData);
};
const calRetire = async (birth: Date) => {
const body = {
birthDate: dateToISO(birth),
};
showLoader();
await http
.post(config.API.profileCalRetire, body)
.then((res: any) => {
const data = res.data.result;
informaData.value.age = data.age;
changeRetireText(data.retireDate);
age.value = true;
})
.catch((e: any) => {
age.value = false;
messageError($q, e);
const retire = new Date(`${birth.getFullYear() + 60}-09-30`);
changeRetireText(date2Thai(retire));
})
.finally(() => {
hideLoader();
});
};
const fetchData = async () => {
showLoader();
await http
.get(config.API.profileInforId(route.params.id.toString()))
.then(async (res: any) => {
const data: ResponseObject = res.data.result;
informaData.value.cardid = data.citizenId;
informaData.value.prefix = "";
informaData.value.prefixId = data.prefixId;
informaData.value.firstname = data.firstName;
informaData.value.lastname = data.lastName;
informaData.value.birthDate = new Date(data.birthDate);
informaData.value.genderId = data.genderId;
informaData.value.bloodId = data.bloodGroupId;
informaData.value.nationality = data.nationality;
informaData.value.ethnicity = data.race;
informaData.value.statusId = data.relationshipId;
informaData.value.religionId = data.religionId;
informaData.value.tel = data.telephoneNumber;
informaData.value.age = data.age;
informaData.value.employeeType = data.employeeType;
informaData.value.employeeClass = data.employeeClass;
informaData.value.profileType = data.profileType;
await calRetire(new Date(dateToISO(new Date(data.birthDate))));
if (data.profileType == "officer" && columnsHistory.value.length >= 15) {
columnsHistory.value.splice(13, 1);
columnsHistory.value.splice(12, 1);
}
})
.catch((e) => {
messageError($q, e);
})
.finally(() => {
hideLoader();
});
};
const editData = async () => {
if (age.value == false) {
modalError($q, "พบข้อผิดพลาด", "วันเกิดไม่ถูกต้อง");
return;
}
const body: any = {
citizenId: informaData.value.cardid,
prefixId: informaData.value.prefixId,
firstName: informaData.value.firstname,
lastName: informaData.value.lastname,
genderId: informaData.value.genderId,
nationality: informaData.value.nationality,
race: informaData.value.ethnicity,
religionId: informaData.value.religionId,
birthDate: dateToISO(informaData.value.birthDate) ?? dateToISO(new Date()),
bloodGroupId: informaData.value.bloodId,
relationshipId: informaData.value.statusId,
telephoneNumber: informaData.value.tel,
createdAt: new Date(),
age: null,
employeeType: informaData.value.employeeType,
employeeClass: informaData.value.employeeClass,
profileType: informaData.value.profileType,
createdFullName: "-",
};
showLoader();
await http
.put(config.API.profileInforId(route.params.id.toString()), body)
.then((res) => {
success($q, "บันทึกข้อมูลสำเร็จ");
})
.catch((e) => {
messageError($q, e);
})
.finally(async () => {
edit.value = false;
emit("update:statusEdit", false);
await fetchData();
await changeBirth(informaData.value.birthDate ?? new Date());
});
};
const saveData = async () => {
if (myform.value != null) {
await myform.value.validate().then(async (success: boolean) => {
if (success) {
await editData();
} else {
}
});
}
};
const changeBtn = async () => {
if (edit.value == true) {
if (props.statusEdit === true) {
edit.value = false;
props.notiNoEdit();
} else {
emit("update:statusEdit", true);
}
} else {
emit("update:statusEdit", false);
}
};
const getClass = (val: boolean) => {
return {
"full-width inputgreen cursor-pointer": val,
"full-width cursor-pointer": !val,
};
};
</script>
<template>
<q-card flat bordered class="col-12 q-px-lg q-py-md">
<HeaderTop
v-model:edit="edit"
header="ข้อมูลส่วนตัว"
icon="mdi-account"
:save="saveData"
:history="true"
:changeBtn="changeBtn"
:disable="statusEdit"
:cancel="onCancel"
:historyClick="clickHistory"
/>
<q-form ref="myform" class="col-12">
<div class="row col-12 items-center q-col-gutter-x-sm q-col-gutter-y-sm">
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="informaData.cardid"
maxlength="13"
:rules="[
(val:string) => !!val || `${'กรุณากรอก เลขบัตรประจำตัวประชาชน'}`,
(val:string) =>
val.length >= 13 ||
`${'กรุณากรอกเลขบัตรประจำตัวประชาชนให้ครบ'}`,
]"
label="เลขบัตรประจำตัวประชาชน"
mask="#############"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก คำนำหน้า'}`]"
:outlined="edit"
dense
lazy-rules
v-model="informaData.prefixId"
emit-value
map-options
option-label="name"
:options="Ops.prefixOps"
option-value="id"
:label="`${'คำนำหน้า'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'prefixOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="informaData.firstname"
:rules="[(val:string) => !!val || `${'กรุณากรอก ชื่อ'}`]"
:label="`${'ชื่อ'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="informaData.lastname"
:rules="[(val:string) => !!val || `${'กรุณากรอก นามสกุล'}`]"
:label="`${'นามสกุล'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<datepicker
v-model="informaData.birthDate"
:locale="'th'"
autoApply
:enableTimePicker="false"
week-start="0"
:max-date="new Date()"
:disabled="!edit"
@update:model-value="handleDate"
>
<template #year="{ year }">
{{ year + 543 }}
</template>
<template #year-overlay-value="{ value }">
{{ parseInt(value + 543) }}
</template>
<template #trigger>
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
:model-value="date2Thai(informaData.birthDate)"
:rules="[(val:string) => !!val || `${'กรุณาเลือก วัน/เดือน/ปี เกิด'}`]"
:label="`${'วัน/เดือน/ปี เกิด'}`"
>
<template v-slot:prepend>
<q-icon
name="event"
class="cursor-pointer"
:style="
edit ? 'color: var(--q-primary)' : 'color: var(--q-grey)'
"
>
</q-icon>
</template>
</q-input>
</template>
</datepicker>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(false)"
hide-bottom-space
dense
lazy-rules
readonly
borderless
:style="!edit ? '' : 'padding:0 12px;'"
:model-value="informaData.age"
:label="`${'อายุ'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก เพศ'}`]"
:outlined="edit"
dense
lazy-rules
v-model="informaData.genderId"
emit-value
map-options
option-label="name"
:options="Ops.genderOps"
option-value="id"
:label="`${'เพศ'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'genderOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก สถานภาพ'}`]"
:outlined="edit"
dense
lazy-rules
v-model="informaData.statusId"
emit-value
map-options
option-label="name"
:options="Ops.statusOps"
option-value="id"
:label="`${'สถานภาพ'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'statusOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก หมู่เลือด'}`]"
:outlined="edit"
dense
lazy-rules
v-model="informaData.bloodId"
emit-value
map-options
option-label="name"
:options="Ops.bloodOps"
option-value="id"
:label="`${'หมู่เลือด'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'bloodOps'
) "
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="informaData.nationality"
:rules="[(val:string) => !!val || `${'กรุณากรอก สัญชาติ'}`]"
:label="`${'สัญชาติ'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<q-input
:class="getClass(edit)"
hide-bottom-space
:outlined="edit"
dense
lazy-rules
:readonly="!edit"
:borderless="!edit"
v-model="informaData.ethnicity"
:rules="[(val:string) => !!val || `${'กรุณากรอก เชื้อชาติ'}`]"
:label="`${'เชื้อชาติ'}`"
/>
</div>
<div class="col-xs-6 col-sm-3 col-md-3">
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก ศาสนา'}`]"
:outlined="edit"
dense
lazy-rules
v-model="informaData.religionId"
emit-value
map-options
option-label="name"
:options="Ops.religionOps"
option-value="id"
:label="`${'ศาสนา'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'religionOps'
) "
/>
</div>
<!-- <div class="col-xs-6 col-sm-3 col-md-3">
<q-input
hide-bottom-space
:outlined="edit"
dense
lazy-rules
type="tel"
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
v-model="informaData.tel"
:rules="[
(val:string) => !!val || `${'กรุณากรอก เบอร์โทร'}`,
(val:string) => val.length >= 10 || `${'กรุณากรอกข้อมูลเบอร์โทรให้ครบ'}`,
]"
:label="`${'เบอร์โทร'}`"
mask="##########"
/>
</div> -->
<div
class="col-xs-6 col-sm-3 col-md-3"
v-if="informaData.profileType == 'employee'"
>
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก ประเภทการจ้าง'}`]"
:outlined="edit"
dense
lazy-rules
v-model="informaData.employeeType"
emit-value
map-options
option-label="name"
:options="Ops.employeeTypeOps"
option-value="id"
:label="`${'ประเภทการจ้าง'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'employeeTypeOps'
) "
/>
</div>
<div
class="col-xs-6 col-sm-3 col-md-3"
v-if="informaData.profileType == 'employee'"
>
<selector
:hide-dropdown-icon="!edit"
hide-bottom-space
:class="getClass(edit)"
:readonly="!edit"
:borderless="!edit"
:rules="[(val:string) => !!val || `${'กรุณาเลือก ประเภทลูกจ้าง'}`]"
:outlined="edit"
dense
lazy-rules
v-model="informaData.employeeClass"
emit-value
map-options
option-label="name"
:options="Ops.employeeClassOps"
option-value="id"
:label="`${'ประเภทลูกจ้าง'}`"
use-input
input-debounce="0"
@filter="(inputValue:any,
doneFn:Function) => filterSelector(inputValue, doneFn,'employeeClassOps'
) "
/>
</div>
</div>
</q-form>
</q-card>
<HistoryTable
:rows="rowsHistory"
:columns="columnsHistory"
:filter="filterHistory"
:visible-columns="visibleColumnsHistory"
v-model:modal="modalHistory"
v-model:inputfilter="filterHistory"
v-model:inputvisible="visibleColumnsHistory"
v-model:tittle="tittleHistory"
>
<template #columns="props">
<q-tr :props="props">
<q-td v-for="col in props.cols" :key="col.name" :props="props">
<div
v-if="col.name == 'birthDate' || col.name == 'createdAt'"
class="table_ellipsis"
>
{{ date2Thai(col.value) }}
</div>
<div v-else class="table_ellipsis">
{{ col.value }}
</div>
</q-td>
</q-tr>
</template>
</HistoryTable>
</template>

51
src/modules/05_placement/components/exams_other/Information/layout.vue Normal file
View file

@ -0,0 +1,51 @@
<!-- card รวม ข้อมูลส่วนตัว กับ ที่อยู่ -->
<script setup lang="ts">
import { ref, onMounted, watch } from "vue";
import Information from "@/modules/05_placement/components/exams_other/Information/Information.vue";
import Address from "@/modules/05_placement/components/exams_other/Information/Address.vue";
import { useCounterMixin } from "@/stores/mixin";
const props = defineProps({
statusEdit: {
type: Boolean,
required: true,
},
profileType: {
type: String,
required: true,
},
});
const emit = defineEmits(["update:statusEdit"]);
const mixin = useCounterMixin();
const { showLoader, hideLoader } = mixin;
const statusEdit = ref<boolean>(false);
const modalNoEdit = ref<boolean>(false);
const modalNoEditTittle = ref<string>("ไม่สามารถไม่สามารถแก้ไขข้อมูลได้?");
const modalNoEditDetail = ref<string>("มีข้อมูลที่ยังไม่ถูกบันทึกข้อมูล");
watch(statusEdit, (count: boolean, prevCount: boolean) => {
emit("update:statusEdit", count);
});
watch(props, (count: any, prevCount: any) => {
statusEdit.value = props.statusEdit;
});
onMounted(() => {
// hideLoader();
});
const notiNoEdit = () => {
modalNoEdit.value = true;
};
const closeModalError = () => {
modalNoEdit.value = false;
};
</script>
<template>
<Information :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
<Address :notiNoEdit="notiNoEdit" v-model:statusEdit="statusEdit" />
</template>

120
src/modules/05_placement/components/exams_other/Information/top.vue Normal file
View file

@ -0,0 +1,120 @@
<!-- ส่วนหัวของ ข้อมูลส่วนตัว และ ที่อยู่ -->
<script setup lang="ts">
const props = defineProps({
header: {
type: String,
default: "ข้อความ",
required: true,
},
icon: {
type: String,
default: "mdi-help",
required: true,
},
edit: {
type: Boolean,
default: true,
required: true,
},
history: {
type: Boolean,
default: true,
required: true,
},
addData: {
type: Boolean,
defualt: false,
},
disable: {
type: Boolean,
defualt: false,
},
historyClick: {
type: Function,
default: () => console.log("not function"),
},
add: {
type: Function,
default: () => console.log("not function"),
},
save: {
type: Function,
default: () => console.log("not function"),
},
deleted: {
type: Function,
default: () => console.log("not function"),
},
cancel: {
type: Function,
default: () => console.log("not function"),
},
changeBtn: {
type: Function,
default: () => console.log("not function"),
},
});
const emit = defineEmits(["update:edit"]);
const updateEdit = (value: any) => {
emit("update:edit", value);
};
const ClickEdit = () => {
updateEdit(!props.edit);
props.changeBtn();
};
const historyClick = async () => {
await props.historyClick();
};
const ClickCancel = () => {
updateEdit(!props.edit);
props.cancel();
props.changeBtn();
};
const save = () => {
props.save();
};
const add = () => {
props.add();
};
</script>
<template>
<div class="flex items-center">
<div class="flex items-center">
<q-icon :name="icon" size="1.5em" color="grey-5" class="q-mr-md" v-if="icon != ''" />
<div class="text-bold text-subtitle2 col-12 row items-center" v-if="header != ''">
{{ header }}
</div>
</div>
<div class="q-gutter-sm q-mx-sm" v-if="addData == false">
<q-btn size="12px" v-if="!edit" flat round :disabled="disable" :color="edit ? 'grey-7' : 'primary'"
@click="ClickEdit" icon="mdi-pencil-outline">
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
</q-btn>
<q-btn size="12px" flat round v-if="edit" :color="!edit ? 'grey-7' : 'public'" @click="save"
icon="mdi-content-save-outline">
<q-tooltip>บันทึกข้อมูล</q-tooltip>
</q-btn>
<q-btn size="12px" flat round v-if="edit" :color="!edit ? 'grey-7' : 'red'" @click="ClickCancel" icon="mdi-undo">
<q-tooltip>ยกเลิก</q-tooltip>
</q-btn>
</div>
<div class="q-pl-sm" v-else>
<q-btn size="12px" flat round :disabled="disable" color="add" @click="add" icon="mdi-plus">
<q-tooltip>เพิ่มข้อมูล</q-tooltip>
</q-btn>
</div>
<q-space />
<q-btn color="info" flat dense round size="14px" icon="mdi-history" v-if="history" @click="historyClick">
<q-tooltip>ประวัติ{{ header }}</q-tooltip>
</q-btn>
</div>
</template>
<style scoped></style>

1199
src/modules/05_placement/components/exams_other/Insignia.vue Normal file
View file

File diff suppressed because it is too large Load diff

154
src/modules/05_placement/components/exams_korkor/Main.vue → src/modules/05_placement/components/exams_other/Main.vue
View file

@ -29,62 +29,62 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
{
name: "ExamRound",
name: "examRound",
align: "left",
label: "รอบการสอบ",
sortable: true,
field: "ExamRound",
field: "examRound",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "ExamOrder",
name: "examOrder",
align: "left",
label: "ครั้งที่",
sortable: true,
field: "ExamOrder",
field: "examOrder",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "FiscalYear",
name: "fiscalYear",
align: "left",
label: "ปีงบประมาณ",
sortable: true,
field: "FiscalYear",
field: "fiscalYear",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "NumberofCandidates",
name: "numberofCandidates",
align: "left",
label: "จำนวนผู้สอบได้",
sortable: false,
field: "NumberofCandidates",
field: "numberofCandidates",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "ExamType",
name: "examType",
align: "left",
label: "ประเภทการสอบ",
sortable: false,
field: "ExamType",
field: "examType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "AccountExpirationDate",
name: "accountExpirationDate",
align: "left",
label: "วันที่บัญชีหมดอายุ",
sortable: true,
field: "AccountExpirationDate",
field: "accountExpirationDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -96,48 +96,48 @@ const columns = ref<QTableProps["columns"]>([
// ข้อมูลตาราง (จำลอง)
const rows = ref<FormPlacementMainData[]>([{
id: 1,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 3,
FiscalYear: 2023,
NumberofCandidates: 8,
ExamType: 1,
AccountExpirationDate: "2023-02-28T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 3,
fiscalYear: 2023,
numberofCandidates: 8,
examType: 1,
accountExpirationDate: "2023-02-28T14:47:04.1785384Z"
},
{
id: 2,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 2,
FiscalYear: 2023,
NumberofCandidates: 12,
ExamType: 1,
AccountExpirationDate: "2023-02-28T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2023,
numberofCandidates: 12,
examType: 1,
accountExpirationDate: "2023-02-28T14:47:04.1785384Z"
},
{
id: 3,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 2,
FiscalYear: 2023,
NumberofCandidates: 20,
ExamType: 1,
AccountExpirationDate: "2023-01-31T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2023,
numberofCandidates: 20,
examType: 1,
accountExpirationDate: "2023-01-31T14:47:04.1785384Z"
},
{
id: 4,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 2,
FiscalYear: 2022,
NumberofCandidates: 16,
ExamType: 2,
AccountExpirationDate: "2023-11-30T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2022,
numberofCandidates: 16,
examType: 2,
accountExpirationDate: "2023-11-30T14:47:04.1785384Z"
},
{
id: 5,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 1,
FiscalYear: 2021,
NumberofCandidates: 20,
ExamType: 2,
AccountExpirationDate: "2024-05-21T14:47:04.1785384Z",
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 1,
fiscalYear: 2021,
numberofCandidates: 20,
examType: 2,
accountExpirationDate: "2024-05-21T14:47:04.1785384Z",
},
]);
@ -165,23 +165,19 @@ onMounted(async () => {
fiscalYearFilter()
examTimeFilter()
examTypeFilter()
expiredAccountFilter()
await expiredAccountFilter()
searchFilterTable()
})
// ดูรายการสอบแข่งขัน หน้าต่อไป
const redirectToPage = (id: number) => {
router.push({
name: 'placementDetail',
params: {
id: id
}
});
const redirectToPage = (id?: number) => {
router.push(`/placement2/detail`);
};
// เลือกปีงบประมาณ
const fiscalyear = ref<number | null>(0);
const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: 'ทั้งหมด' }]);
const addedFiscalYearValues: number[] = [];
const addedfiscalYearValues: number[] = [];
const fiscalYearFilter = async () => {
// API
// await http
@ -196,21 +192,21 @@ const fiscalYearFilter = async () => {
// .finally(async () => {
// });
for (let data of OriginalData.value) {
const year = data.FiscalYear + 543;
const year = data.fiscalYear + 543;
if (fiscalyear.value === null || year > fiscalyear.value) {
fiscalyear.value = year;
}
if (!addedFiscalYearValues.includes(year)) {
if (!addedfiscalYearValues.includes(year)) {
fiscalyearOP.push({ id: year, name: year.toString() });
addedFiscalYearValues.push(year);
addedfiscalYearValues.push(year);
}
}
}
// เลือกปีงบประมาณตาม API
const searchFiscalyear = () => {
const searchfiscalyear = () => {
console.log('Input value changed:', fiscalyear.value);
// API
// await http
@ -233,15 +229,15 @@ const resetFilter = () => {
};
const attrs = ref<any>(useAttrs());
const visibleColumns = ref<string[]>(['id', 'ExamRound', 'ExamOrder', 'FiscalYear', 'NumberofCandidates', 'ExamType', 'AccountExpirationDate']) //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
const visibleColumns = ref<string[]>(['id', 'examRound', 'examOrder', 'fiscalYear', 'numberofCandidates', 'examType', 'accountExpirationDate']) //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
// ครั้งที่สอบ
const examTime = ref<number | null>(null);
const examTimeOP = ref<number[]>([]);
const examTimeFilter = async () => {
for (let data of OriginalData.value) {
if (!examTimeOP.value.includes(data.ExamOrder)) {
examTimeOP.value.push(data.ExamOrder);
if (!examTimeOP.value.includes(data.examOrder)) {
examTimeOP.value.push(data.examOrder);
}
}
examTimeOP.value.sort((a, b) => a - b); // เรียงลำดับ
@ -250,16 +246,16 @@ const examTimeFilter = async () => {
// ประเภทการสอบ
const examType = ref<number | null>(0);
const examTypeOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
const addedExamTypeValues: number[] = [];
const addedexamTypeValues: number[] = [];
const examTypeFilter = async () => {
for (let data of OriginalData.value) {
const examTypeValue = data.ExamType;
if (examTypeValue == 1 && !addedExamTypeValues.includes(1)) {
const examTypeValue = data.examType;
if (examTypeValue == 1 && !addedexamTypeValues.includes(1)) {
examTypeOP.push({ id: 1, name: "คัดเลือก" });
addedExamTypeValues.push(1);
} else if (examTypeValue == 2 && !addedExamTypeValues.includes(2)) {
addedexamTypeValues.push(1);
} else if (examTypeValue == 2 && !addedexamTypeValues.includes(2)) {
examTypeOP.push({ id: 2, name: "สอบแข่งขัน" });
addedExamTypeValues.push(2);
addedexamTypeValues.push(2);
}
}
}
@ -275,8 +271,8 @@ const expiredAccount = ref<boolean>(false);
const expiredAccountFilter = async () => {
const currentDate = new Date();
const updatedRows = OriginalData.value.map((data) => {
let expirationDate = new Date(data.AccountExpirationDate);
let isExpired = expirationDate < currentDate;
let expirationDate = new Date(data.accountExpirationDate);
let isExpired = expirationDate < currentDate
return { ...data, isExpired };
});
@ -302,7 +298,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
<div class="col-xs-12 col-sm-3 col-md-2">
<q-select v-model="fiscalyear" label="ปีงบประมาณ" dense clearable emit-value map-options :options="fiscalyearOP"
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFiscalyear" />
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchfiscalyear" />
</div>
<div class="col-xs-12 col-sm-3 col-md-6"></div>
<div class="col-xs-12 col-sm-3 col-md-2">
@ -349,23 +345,23 @@ const paginationLabel = (start: string, end: string, total: string) => {
<q-td key="id" :props="props">
{{ props.row.id }}
</q-td>
<q-td key="ExamRound" :props="props">
{{ props.row.ExamRound }}
<q-td key="examRound" :props="props">
{{ props.row.examRound }}
</q-td>
<q-td key="ExamOrder" :props="props">
{{ props.row.ExamOrder }}
<q-td key="examOrder" :props="props">
{{ props.row.examOrder }}
</q-td>
<q-td key="FiscalYear" :props="props">
{{ props.row.FiscalYear + 543 }}
<q-td key="fiscalYear" :props="props">
{{ props.row.fiscalYear + 543 }}
</q-td>
<q-td key="NumberofCandidates" :props="props">
{{ props.row.NumberofCandidates }}
<q-td key="numberofCandidates" :props="props">
{{ props.row.numberofCandidates }}
</q-td>
<q-td key="ExamType" :props="props">
{{ props.row.ExamType == 1 ? 'คัดเลือก' : 'สอบแข่งขัน' }}
<q-td key="examType" :props="props">
{{ props.row.examType == 1 ? 'คัดเลือก' : 'สอบแข่งขัน' }}
</q-td>
<q-td key="AccountExpirationDate" :props="props">
{{ textDate(props.row.AccountExpirationDate) }}
<q-td key="accountExpirationDate" :props="props">
{{ textDate(props.row.accountExpirationDate) }}
</q-td>
</q-tr>
</template>

84
src/modules/05_placement/components/exams_other/Qualification.vue Normal file
View file

@ -0,0 +1,84 @@
<script setup lang="ts">
import { ref } from 'vue';
import type { CheckboxItem } from "@/modules/05_placement/interface/index/Main";
const selection = ref([]);
const checkboxItems: CheckboxItem[] = [
{ id: 1, label: 'ไม่เป็นผู้ดำรงตำแหน่งทางการเมือง' },
{ id: 2, label: 'ไม่เป็นคนไร้ความสามารถ คนเสมือนไร้ความสามารถ คนวิกลจริตหรือจิตฟั่นเฟือน ไม่สมประกอบหรือเป็นโรคตามที่กำหนดในกฎ ก.พ.' },
{ id: 3, label: 'ไม่เป็นผู้อยู่ในระหว่างถูกสั่งพักราชการหรือถูกสั่งให้ออกจากราชการไว้ก่อนตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 4, label: 'ไม่เป็นผู้บกพร่องในศีลธรรมอันดีจนเป็นที่รังเกียจของสังคม' },
{ id: 5, label: 'ไม่เป็นกรรมการหรือผู้ดำรงตำแหน่งที่รับผิดชอบในการบริหารพรรคการเมือง หรือเจ้าหน้าที่ในพรรคการเมือง' },
{ id: 6, label: 'ไม่เป็นบุคคลล้มละลาย' },
{ id: 7, label: 'ไม่เป็นผู้เคยต้องรับโทษจำคุกโดยคำพิพากษาถึงที่สุดให้จำคุกเพราะกระทำความผิดทางอาญา เว้นแต่เป็นโทษสำหรับความผิดที่ใด้กระทำโดยประมาทหรือความผิดลหุโทษ' },
{ id: 8, label: 'ไม่เป็นผู้เคยถูกลงโทษให้ออก ปลดออก หรือไล่ออกจากรัฐวิสาหกิจ หรือ หน่วยงานอื่นของรัฐ' },
{ id: 9, label: 'เป็นผู้เคยถูลงโทษให้ออก หรือปลดออก เพราะกระทำผิตวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 10, label: 'เป็นผู้เคยถูกลงโทษไล่ออก เพราะกระทำผิดวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 11, label: 'เป็นผู้เคยกระทำการทุจริตในการสอบเข้ารับราชการ หรือเข้าปฏิบัติงานใน หน่วยงานของรัฐ' },
]
</script>
<template>
<div class="row">
<q-icon name="mdi-briefcase-edit" size="1.5em" color="grey-5" class="q-pr-md" />
<span class="text-bold text-subtitle2 ">การคัดกรองคุณสมบัติ</span>
</div>
<div class="contanier-box-mini">
<q-card bordered class="card-panding">
<div class="col-12 row items-center q-pa-sm header-text">
การคัดกรองคุณสมบัติ
</div>
<div v-for="item of checkboxItems" :key="item.id" class="q-pa-sm">
<q-checkbox size="xs" v-model="selection" :val="item.id" :label="item.label" keep-color color="teal"
class="checkbox-group" />
<q-separator />
</div>
</q-card>
</div>
</template>
<style lang="scss" scoped>
.header-text {
font-size: 18px;
font-weight: 600;
color: #4F4F4F;
}
.sub-text-right {
font-size: 14px;
font-weight: 600;
line-height: 150%;
color: #000000;
}
.sub-text {
font-weight: 400;
font-size: 16px;
line-height: 22px;
letter-spacing: 0.0025em;
color: #35373C;
}
.card-exam {
border-radius: 5px;
background: #FAFAFA;
}
.header-sub-text-exam {
font-size: 15px;
font-weight: 500;
line-height: 150%;
color: #818181;
}
.header-sub-text-exam-2 {
font-size: 15px;
font-weight: 500;
line-height: 150%;
color: #00AA86;
}
.sub-text-exam {
font-size: 15px;
font-weight: 500;
color: #000000;
}
</style>

201
src/modules/05_placement/components/exams_other/Table.vue Normal file
View file

@ -0,0 +1,201 @@
<script setup lang="ts">
import { ref, useAttrs } from "vue";
import HeaderTop from "@/modules/05_placement/components/exams_other/Information/top.vue";
import type { Pagination } from "@/modules/05_placement/interface/index/Main";
const attrs = ref<any>(useAttrs());
const table = ref<any>(null);
const filterRef = ref<any>(null);
const editBtn = ref<boolean>(false);
const initialPagination = ref<Pagination>({
rowsPerPage: 0,
});
const props = defineProps({
inputfilter: String,
name: String,
icon: String,
inputvisible: Array,
editvisible: Boolean,
headerShow: {
type: Boolean,
default: true,
},
statusEdit: {
type: Boolean,
required: true,
},
edit: {
type: Function,
default: () => console.log("not function"),
},
add: {
type: Function,
default: () => console.log("not function"),
},
cancel: {
type: Function,
default: () => console.log("not function"),
},
validate: {
type: Function,
default: () => console.log("not function"),
},
});
const emit = defineEmits([
"update:inputfilter",
"update:inputvisible",
"update:editvisible",
]);
const updateEdit = (value: Boolean) => {
emit("update:editvisible", value);
};
const updateInput = (value: string | number | null) => {
emit("update:inputfilter", value);
};
const updateVisible = (value: []) => {
emit("update:inputvisible", value);
};
const paginationLabel = (start: string, end: string, total: string) => {
return start + "-" + end + " ใน " + total;
};
const checkAdd = () => {
props.add();
};
const edit = async () => {
updateEdit(!props.editvisible);
props.edit();
};
const cancel = async () => {
updateEdit(!props.editvisible);
props.cancel();
};
const resetFilter = () => {
// reset ค่าที่ค้นหาเมื่อกดปุ่ม X ในกล่องค้นหา
emit("update:inputfilter", "");
filterRef.value.focus();
};
</script>
<template>
<div class="q-pb-sm row">
<HeaderTop
v-model:edit="editBtn"
:header="name"
:icon="icon"
:add="checkAdd"
:addData="true"
:history="false"
:disable="statusEdit"
/>
<q-space />
<div class="items-center" style="display: flex" v-if="headerShow">
<!-- ค้นหาข้อความใน table -->
<q-input
standout
dense
:model-value="inputfilter"
ref="filterRef"
@update:model-value="updateInput"
outlined
debounce="300"
placeholder="ค้นหา"
style="max-width: 200px"
class="q-ml-sm"
>
<template v-slot:append>
<q-icon v-if="inputfilter == ''" name="search" />
<q-icon
v-if="inputfilter !== ''"
name="clear"
class="cursor-pointer"
@click="resetFilter"
/>
</template>
</q-input>
<!-- แสดงคอลัมน์ใน table -->
<q-select
:model-value="inputvisible"
@update:model-value="updateVisible"
:display-value="$q.lang.table.columns"
multiple
outlined
dense
:options="attrs.columns"
options-dense
option-value="name"
map-options
emit-value
style="min-width: 150px"
class="gt-xs q-ml-sm"
/>
</div>
</div>
<q-table
ref="table"
flat
bordered
class="custom-header-table"
v-bind="attrs"
virtual-scroll
:virtual-scroll-sticky-size-start="48"
dense
:pagination-label="paginationLabel"
:pagination="initialPagination"
:rows-per-page-options="[0]"
>
<template v-slot:header="props">
<q-tr :props="props">
<q-th v-for="col in props.cols" :key="col.name" :props="props">
<span class="text-weight-medium">{{ col.label }}</span>
</q-th>
<q-th auto-width />
</q-tr>
</template>
<template #body="props">
<slot v-bind="props" name="columns"></slot>
</template>
</q-table>
</template>
<style lang="scss">
.icon-color {
color: #4154b3;
}
.custom-header-table {
max-height: 64vh;
.q-table tr:nth-child(odd) td {
background: white;
}
.q-table tr:nth-child(even) td {
background: #f8f8f8;
}
.q-table thead tr {
background: #ecebeb;
}
.q-table thead tr th {
position: sticky;
z-index: 1;
}
/* this will be the loading indicator */
.q-table thead tr:last-child th {
/* height of all previous header rows */
top: 48px;
}
.q-table thead tr:first-child th {
top: 0;
}
}
</style>

171
src/modules/05_placement/components/exams_other/profileType.ts Normal file
View file

@ -0,0 +1,171 @@
//interface class array object {name string ,id number}
import type { childrenFamily } from "@/modules/04_registry/interface/response/Family";
interface ChangeActive {
name: string;
id: number;
}
//ข้อมูลส่วนตัว
interface Information {
cardid: string | null;
prefix: string | null;
age: string | null;
prefixId: string | null;
firstname: string | null;
lastname: string | null;
birthDate: Date;
genderId: string | null;
bloodId: string | null;
nationality: string | null;
ethnicity: string | null;
statusId: string | null;
religionId: string | null;
tel: string | null;
employeeType: string | null;
employeeClass: string | null;
profileType: string | null;
}
interface Family {
prefixC: string | null; // couple
prefixIdC: string | null;
firstnameC: string | null;
lastnameC: string | null;
lastnameCOld: string | null;
occupationC: string | null;
prefixM: string | null; // male
prefixIdM: string | null;
firstnameM: string | null;
lastnameM: string | null;
occupationM: string | null;
prefixF: string | null; // female
prefixIdF: string | null;
firstnameF: string | null;
lastnameF: string | null;
occupationF: string | null;
same: string | null;
childrens: childrenFamily[];
}
interface Address {
address: string | null;
provinceId: string | null;
districtId: string | null;
subdistrictId: string | null;
addressC: string | null;
provinceIdC: string | null;
districtIdC: string | null;
subdistrictIdC: string | null;
same: string | null;
}
interface Goverment {
ocId: string | null;
positionId: string | null;
workId: string | null;
typeId: string | null;
levelId: string | null;
numberId: string | null;
businessId: string | null;
containDate: Date;
workDate: Date;
retireDate: string | null;
absent: number | null;
age: number | null;
ageAll: string | null;
reasonSameDate: string | null;
}
interface DataOption {
id: string | number;
name: string;
zipCode?: string;
}
interface zipCodeOption {
id: string;
name: string;
zipCode: string;
}
const defaultGoverment: Goverment = {
ocId: null,
positionId: null,
workId: null,
typeId: null,
levelId: null,
numberId: null,
businessId: null,
containDate: new Date(),
workDate: new Date(),
retireDate: null,
absent: 0,
age: 0,
ageAll: null,
reasonSameDate: null,
};
const defaultAddress: Address = {
address: null,
provinceId: null,
districtId: null,
subdistrictId: null,
addressC: null,
provinceIdC: null,
districtIdC: null,
subdistrictIdC: null,
same: "0",
};
const defaultInformation: Information = {
cardid: null,
age: null,
prefix: null,
prefixId: null,
firstname: null,
lastname: null,
birthDate: new Date(),
genderId: null,
bloodId: null,
nationality: null,
ethnicity: null,
statusId: null,
religionId: null,
tel: null,
employeeType: null,
employeeClass: null,
profileType: null,
};
const defaultFamily: Family = {
prefixC: null,
prefixIdC: null,
firstnameC: null,
lastnameC: null,
lastnameCOld: null,
occupationC: null,
prefixM: null,
prefixIdM: null,
firstnameM: null,
lastnameM: null,
occupationM: null,
prefixF: null,
prefixIdF: null,
firstnameF: null,
lastnameF: null,
occupationF: null,
same: "0",
childrens: [],
};
export { defaultInformation, defaultFamily, defaultAddress, defaultGoverment };
export type {
ChangeActive,
Information,
Family,
Address,
Goverment,
DataOption,
zipCodeOption,
};

155
src/modules/05_placement/components/exams_sorkorcho/Main.vue
View file

@ -29,62 +29,62 @@ const columns = ref<QTableProps["columns"]>([
style: "font-size: 14px",
},
{
name: "ExamRound",
name: "examRound",
align: "left",
label: "รอบการสอบ",
sortable: true,
field: "ExamRound",
field: "examRound",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "ExamOrder",
name: "examOrder",
align: "left",
label: "ครั้งที่",
sortable: true,
field: "ExamOrder",
field: "examOrder",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "FiscalYear",
name: "fiscalYear",
align: "left",
label: "ปีงบประมาณ",
sortable: true,
field: "FiscalYear",
field: "fiscalYear",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
},
{
name: "NumberofCandidates",
name: "numberofCandidates",
align: "left",
label: "จำนวนผู้สอบได้",
sortable: false,
field: "NumberofCandidates",
field: "numberofCandidates",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "ExamType",
name: "examType",
align: "left",
label: "ประเภทการสอบ",
sortable: false,
field: "ExamType",
field: "examType",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
a.localeCompare(b, undefined, { numeric: true, sensitivity: "base" }),
},
{
name: "AccountExpirationDate",
name: "accountExpirationDate",
align: "left",
label: "วันที่บัญชีหมดอายุ",
sortable: true,
field: "AccountExpirationDate",
field: "accountExpirationDate",
headerStyle: "font-size: 14px",
style: "font-size: 14px",
sort: (a: string, b: string) =>
@ -96,48 +96,48 @@ const columns = ref<QTableProps["columns"]>([
// ข้อมูลตาราง (จำลอง)
const rows = ref<FormPlacementMainData[]>([{
id: 1,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 3,
FiscalYear: 2023,
NumberofCandidates: 8,
ExamType: 1,
AccountExpirationDate: "2023-02-28T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 3,
fiscalYear: 2023,
numberofCandidates: 8,
examType: 1,
accountExpirationDate: "2023-02-28T14:47:04.1785384Z"
},
{
id: 2,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 2,
FiscalYear: 2023,
NumberofCandidates: 12,
ExamType: 1,
AccountExpirationDate: "2023-02-28T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2023,
numberofCandidates: 12,
examType: 1,
accountExpirationDate: "2023-02-28T14:47:04.1785384Z"
},
{
id: 3,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 2,
FiscalYear: 2023,
NumberofCandidates: 20,
ExamType: 1,
AccountExpirationDate: "2023-01-31T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2023,
numberofCandidates: 20,
examType: 1,
accountExpirationDate: "2023-01-31T14:47:04.1785384Z"
},
{
id: 4,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 2,
FiscalYear: 2022,
NumberofCandidates: 16,
ExamType: 2,
AccountExpirationDate: "2023-11-30T14:47:04.1785384Z"
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 2,
fiscalYear: 2022,
numberofCandidates: 16,
examType: 2,
accountExpirationDate: "2023-11-30T14:47:04.1785384Z"
},
{
id: 5,
ExamRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
ExamOrder: 1,
FiscalYear: 2021,
NumberofCandidates: 20,
ExamType: 2,
AccountExpirationDate: "2024-05-21T14:47:04.1785384Z",
examRound: "การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ ส่วนการจัดการทั่วไป",
examOrder: 1,
fiscalYear: 2021,
numberofCandidates: 20,
examType: 2,
accountExpirationDate: "2024-05-21T14:47:04.1785384Z",
},
]);
@ -165,23 +165,20 @@ onMounted(async () => {
fiscalYearFilter()
examTimeFilter()
examTypeFilter()
expiredAccountFilter()
await expiredAccountFilter()
searchFilterTable()
})
// ดูรายการสอบแข่งขัน หน้าต่อไป
const redirectToPage = (id: number) => {
router.push({
name: 'placementDetail',
params: {
id: id
}
});
const redirectToPage = (id?: number) => {
// router.push({ name: 'placementDetail'});
router.push(`/placement/detail`);
};
// เลือกปีงบประมาณ
const fiscalyear = ref<number | null>(0);
const fiscalyearOP = reactive<DataOption[]>([{ id: 0, name: 'ทั้งหมด' }]);
const addedFiscalYearValues: number[] = [];
const addedfiscalYearValues: number[] = [];
const fiscalYearFilter = async () => {
// API
// await http
@ -196,21 +193,21 @@ const fiscalYearFilter = async () => {
// .finally(async () => {
// });
for (let data of OriginalData.value) {
const year = data.FiscalYear + 543;
const year = data.fiscalYear + 543;
if (fiscalyear.value === null || year > fiscalyear.value) {
fiscalyear.value = year;
}
if (!addedFiscalYearValues.includes(year)) {
if (!addedfiscalYearValues.includes(year)) {
fiscalyearOP.push({ id: year, name: year.toString() });
addedFiscalYearValues.push(year);
addedfiscalYearValues.push(year);
}
}
}
// เลือกปีงบประมาณตาม API
const searchFiscalyear = () => {
const searchfiscalyear = () => {
console.log('Input value changed:', fiscalyear.value);
// API
// await http
@ -233,15 +230,15 @@ const resetFilter = () => {
};
const attrs = ref<any>(useAttrs());
const visibleColumns = ref<string[]>(['id', 'ExamRound', 'ExamOrder', 'FiscalYear', 'NumberofCandidates', 'ExamType', 'AccountExpirationDate']) //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
const visibleColumns = ref<string[]>(['id', 'examRound', 'examOrder', 'fiscalYear', 'numberofCandidates', 'examType', 'accountExpirationDate']) //ค้นหา คอลัมน์ คอลัมน์ที่แสดง
// ครั้งที่สอบ
const examTime = ref<number | null>(null);
const examTimeOP = ref<number[]>([]);
const examTimeFilter = async () => {
for (let data of OriginalData.value) {
if (!examTimeOP.value.includes(data.ExamOrder)) {
examTimeOP.value.push(data.ExamOrder);
if (!examTimeOP.value.includes(data.examOrder)) {
examTimeOP.value.push(data.examOrder);
}
}
examTimeOP.value.sort((a, b) => a - b); // เรียงลำดับ
@ -250,16 +247,16 @@ const examTimeFilter = async () => {
// ประเภทการสอบ
const examType = ref<number | null>(0);
const examTypeOP = reactive<DataOption[]>([{ id: 0, name: "ทั้งหมด" }]);
const addedExamTypeValues: number[] = [];
const addedexamTypeValues: number[] = [];
const examTypeFilter = async () => {
for (let data of OriginalData.value) {
const examTypeValue = data.ExamType;
if (examTypeValue == 1 && !addedExamTypeValues.includes(1)) {
const examTypeValue = data.examType;
if (examTypeValue == 1 && !addedexamTypeValues.includes(1)) {
examTypeOP.push({ id: 1, name: "คัดเลือก" });
addedExamTypeValues.push(1);
} else if (examTypeValue == 2 && !addedExamTypeValues.includes(2)) {
addedexamTypeValues.push(1);
} else if (examTypeValue == 2 && !addedexamTypeValues.includes(2)) {
examTypeOP.push({ id: 2, name: "สอบแข่งขัน" });
addedExamTypeValues.push(2);
addedexamTypeValues.push(2);
}
}
}
@ -275,8 +272,8 @@ const expiredAccount = ref<boolean>(false);
const expiredAccountFilter = async () => {
const currentDate = new Date();
const updatedRows = OriginalData.value.map((data) => {
let expirationDate = new Date(data.AccountExpirationDate);
let isExpired = expirationDate < currentDate;
let expirationDate = new Date(data.accountExpirationDate);
let isExpired = expirationDate < currentDate
return { ...data, isExpired };
});
@ -302,7 +299,7 @@ const paginationLabel = (start: string, end: string, total: string) => {
<div class="col-xs-12 col-sm-3 col-md-2">
<q-select v-model="fiscalyear" label="ปีงบประมาณ" dense clearable emit-value map-options :options="fiscalyearOP"
option-value="id" option-label="name" lazy-rules hide-bottom-space :readonly="false" :borderless="false"
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchFiscalyear" />
:outlined="true" :hide-dropdown-icon="false" @update:model-value="searchfiscalyear" />
</div>
<div class="col-xs-12 col-sm-3 col-md-6"></div>
<div class="col-xs-12 col-sm-3 col-md-2">
@ -349,23 +346,23 @@ const paginationLabel = (start: string, end: string, total: string) => {
<q-td key="id" :props="props">
{{ props.row.id }}
</q-td>
<q-td key="ExamRound" :props="props">
{{ props.row.ExamRound }}
<q-td key="examRound" :props="props">
{{ props.row.examRound }}
</q-td>
<q-td key="ExamOrder" :props="props">
{{ props.row.ExamOrder }}
<q-td key="examOrder" :props="props">
{{ props.row.examOrder }}
</q-td>
<q-td key="FiscalYear" :props="props">
{{ props.row.FiscalYear + 543 }}
<q-td key="fiscalYear" :props="props">
{{ props.row.fiscalYear + 543 }}
</q-td>
<q-td key="NumberofCandidates" :props="props">
{{ props.row.NumberofCandidates }}
<q-td key="numberofCandidates" :props="props">
{{ props.row.numberofCandidates }}
</q-td>
<q-td key="ExamType" :props="props">
{{ props.row.ExamType == 1 ? 'คัดเลือก' : 'สอบแข่งขัน' }}
<q-td key="examType" :props="props">
{{ props.row.examType == 1 ? 'คัดเลือก' : 'สอบแข่งขัน' }}
</q-td>
<q-td key="AccountExpirationDate" :props="props">
{{ textDate(props.row.AccountExpirationDate) }}
<q-td key="accountExpirationDate" :props="props">
{{ textDate(props.row.accountExpirationDate) }}
</q-td>
</q-tr>
</template>

16
src/modules/05_placement/components/pass/Detail.vue
View file

@ -1,14 +1,18 @@
<script setup lang="ts">
import { reactive, ref } from "vue";
import { useQuasar } from "quasar";
import { defineAsyncComponent } from "@vue/runtime-core";
import { useRouter } from "vue-router";
const $q = useQuasar();
const router = useRouter();
const year = ref<string>("2566");
const round = ref<string>("1");
const title = ref<string>("การสอบแข่งขันเพื่อรับบุคคลทั่วไปเข้ารับราชการ");
const sizeCard = (val: number) => {
if (val === 5) {
return "width:15%;";
}
};
const itemTop = reactive([
{
id: 1,
@ -54,13 +58,11 @@ const AddTablePosition = defineAsyncComponent(
</div>
<q-space />
<div class="q-py-md row col-12 no-wrap">
<hr class="q-separator q-separator--vertical gt-sm" aria-orientation="vertical" style="width: 2px" />
<div class="q-py-md row col-12">
<div class="col-12 row bg-white">
<div class="fit q-pa-md">
<div class="row col-12 q-col-gutter-md fit">
<div class="" v-for="item in itemTop" :key="item.id" style="width: 15%">
<div class="" v-for="item in itemTop" :key="item.id" :style="$q.screen.lt.md ? '' : sizeCard(5)" :class="$q.screen.lt.sm ? 'col-4' : ''">
<div class="q-card q-card--bordered q-card--flat no-shadow row fit cardNum items-center q-pa-sm">
<div class="col-12 row items-center q-pa-sm">
<div class="col-12 text-h5 text-weight-bold" :style="{ color: item.color }">

32
src/modules/05_placement/components/pass/DialogFooter.vue
View file

@ -1,21 +1,4 @@
<template>
<q-card-actions class="text-primary">
<q-space />
<q-btn v-if="!editvisible" flat round :disabled="editvisible" :color="editvisible ? 'grey-7' : 'primary'"
@click="edit" icon="mdi-pencil-outline">
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
</q-btn>
<div v-else>
<q-btn flat round :disabled="!editvisible" :color="!editvisible ? 'grey-7' : 'public'" @click="checkSave"
icon="mdi-content-save-outline">
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>
</q-card-actions>
</template>
<script setup lang="ts">
import { ref, useAttrs } from "vue";
const props = defineProps({
editvisible: Boolean,
@ -59,3 +42,18 @@ const checkSave = () => {
};
</script>
<template>
<q-card-actions class="text-primary">
<q-space />
<q-btn v-if="!editvisible" flat round :disabled="editvisible" :color="editvisible ? 'grey-7' : 'primary'"
@click="edit" icon="mdi-pencil-outline">
<q-tooltip>แก้ไขข้อมูล</q-tooltip>
</q-btn>
<div v-else>
<q-btn flat round :disabled="!editvisible" :color="!editvisible ? 'grey-7' : 'public'" @click="checkSave"
icon="mdi-content-save-outline">
<q-tooltip>บันทึก</q-tooltip>
</q-btn>
</div>
</q-card-actions>
</template>

33
src/modules/05_placement/components/pass/DialogHeader.vue
View file

@ -1,19 +1,4 @@
<template>
<q-toolbar>
<q-toolbar-title class="text-subtitle2 text-bold">{{ title }}</q-toolbar-title>
<q-btn
icon="close"
unelevated
round
dense
@click="close"
style="color: #ff8080; background-color: #ffdede"
/>
</q-toolbar>
</template>
<script setup lang="ts">
import { ref, useAttrs } from "vue";
const props = defineProps({
title: String,
close: {
@ -24,5 +9,21 @@ const props = defineProps({
const close = async () => {
props.close();
};
</script>
<template>
<q-toolbar class="q-py-md">
<q-toolbar-title class="header-text">{{ title }}</q-toolbar-title>
<q-btn icon="close" unelevated round dense @click="close" style="color: #ff8080; background-color: #ffdede" />
</q-toolbar>
</template>
<style scoped lang="scss">
.header-text {
font-size: 18px;
font-weight: 600;
line-height: 26px;
color: #35373C;
}
</style>

2022
src/modules/05_placement/components/pass/Table.vue
View file

File diff suppressed because it is too large Load diff

309
src/modules/05_placement/components/pass/TableDetail.vue Normal file
View file

@ -0,0 +1,309 @@
<script setup lang="ts">
import { ref } from "vue";
import DialogHeader from "@/modules/05_placement/components/pass/DialogHeader.vue";
import DialogFooter from "@/modules/05_placement/components/pass/DialogFooter.vue";
import type { CheckboxItem } from "@/modules/05_placement/interface/index/Main";
const save = ref<boolean>(true);
const props = defineProps({
Modal: Boolean,
close: {
type: Function,
default: () => console.log("not function"),
},
getdetail: {
type: Object,
required: true
}
});
const selection = ref([]);
const checkboxItems: CheckboxItem[] = [
{ id: 1, label: 'ไม่เป็นผู้ดำรงตำแหน่งทางการเมือง' },
{ id: 2, label: 'ไม่เป็นคนไร้ความสามารถ คนเสมือนไร้ความสามารถ คนวิกลจริตหรือจิตฟั่นเฟือน ไม่สมประกอบหรือเป็นโรคตามที่กำหนดในกฎ ก.พ.' },
{ id: 3, label: 'ไม่เป็นผู้อยู่ในระหว่างถูกสั่งพักราชการหรือถูกสั่งให้ออกจากราชการไว้ก่อนตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 4, label: 'ไม่เป็นผู้บกพร่องในศีลธรรมอันดีจนเป็นที่รังเกียจของสังคม' },
{ id: 5, label: 'ไม่เป็นกรรมการหรือผู้ดำรงตำแหน่งที่รับผิดชอบในการบริหารพรรคการเมือง หรือเจ้าหน้าที่ในพรรคการเมือง' },
{ id: 6, label: 'ไม่เป็นบุคคลล้มละลาย' },
{ id: 7, label: 'ไม่เป็นผู้เคยต้องรับโทษจำคุกโดยคำพิพากษาถึงที่สุดให้จำคุกเพราะกระทำความผิดทางอาญา เว้นแต่เป็นโทษสำหรับความผิดที่ใด้กระทำโดยประมาทหรือความผิดลหุโทษ' },
{ id: 8, label: 'ไม่เป็นผู้เคยถูกลงโทษให้ออก ปลดออก หรือไล่ออกจากรัฐวิสาหกิจ หรือ หน่วยงานอื่นของรัฐ' },
{ id: 9, label: 'เป็นผู้เคยถูลงโทษให้ออก หรือปลดออก เพราะกระทำผิตวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 10, label: 'เป็นผู้เคยถูกลงโทษไล่ออก เพราะกระทำผิดวินัยตามพระราชบัญญัตินี้ หรือตามกฎหมายอื่น' },
{ id: 11, label: 'เป็นผู้เคยกระทำการทุจริตในการสอบเข้ารับราชการ หรือเข้าปฏิบัติงานใน หน่วยงานของรัฐ' },
];
const clickSave = async () => {
console.log(selection.value)
};
</script>
<template>
<q-dialog v-model="props.Modal">
<q-card style="max-width: 100%;width:80%;">
<q-form ref="myForm">
<div class="row">
<DialogHeader :title="`รายละเอียดของ ${props.getdetail.fullName}`" :close="close" />
</div>
<q-separator />
<div class="contanier-box-main">
<div class="contanier-box-mini">
<q-card bordered class="card-panding">
<div class="row items-center q-pa-xs header-text">
ข้อมูลทั่วไป <span class="check-officer"><q-icon name="mdi-check" />
ข้าราชการฯ กทม</span>
</div>
<div class="row q-pa-xs">
<div class="col-3 header-sub-text">
<div class="q-pb-md">
เลขที่ประจำตัวประชาชน
</div>
<div class="q-pb-md">
วัน/เดือน/ปีเกิด
</div>
</div>
<div class="col-4 sub-text">
<div class="q-pb-md">
{{ props.getdetail.profileID }}
</div>
<div class="q-pb-md">
{{ props.getdetail.dateOfBirth }}
</div>
</div>
<div class="col-2 header-sub-text">
<div class="q-pb-md">
ชื่อ-นามสกุล
</div>
<div class="q-pb-md">
เพศ
</div>
</div>
<div class="col-3 sub-text">
<div class="q-pb-md">
{{ props.getdetail.fullName }}
</div>
<div class="q-pb-md">
{{ props.getdetail.gender }}
</div>
</div>
</div>
</q-card>
</div>
<div class="contanier-box-mini">
<q-card bordered class="card-panding">
<div class="row items-center q-pa-xs header-text">
ภูมิลำนำ
</div>
<div class="row q-pa-xs">
<div class="col-3 header-sub-text">
ที่อยู่
</div>
<div class="col-9 sub-text">
{{ props.getdetail.address }}
</div>
</div>
</q-card>
</div>
<div class="contanier-box-mini">
<q-card bordered class="card-panding">
<div class="row items-center q-pa-xs header-text">
การศึกษา
</div>
<div class="row q-pa-xs">
<div class="col-3 header-sub-text">
<div class="q-pb-md">
สถานศึกษา
</div>
<div class="q-pb-md">
สาขาวิชาเอก
</div>
</div>
<div class="col-4 sub-text">
<div class="q-pb-md">
{{ props.getdetail.university }}
</div>
<div class="q-pb-md">
{{ props.getdetail.major }}
</div>
</div>
<div class="col-2 header-sub-text">
<div class="q-pb-md">
วุฒิการศึกษา
</div>
<div class="q-pb-md">
อื่นๆ
</div>
</div>
<div class="col-3 sub-text">
<div class="q-pb-md">
{{ props.getdetail.degree ? props.getdetail.degree : '-' }}
</div>
<div class="q-pb-md">
{{ props.getdetail.remark ? props.getdetail.remark : '-' }}
</div>
</div>
</div>
</q-card>
</div>
<div class="contanier-box-mini">
<q-card bordered class="card-panding">
<div class="row items-center q-pa-xs header-text">
การสอบ
</div>
<div class="row q-pa-xs">
<div class="col-6">
<q-card class="card-exam q-pa-sm">
<div class="row">
<div class="col-4 q-pa-xs header-sub-text-exam">
<div> ประเภท </div>
<div> ภาค ก </div>
<div> ภาค ข </div>
<div> ภาค ค </div>
<div> รวมทั้งหมด </div>
</div>
<div class="col-4 q-pa-xs">
<div class="header-sub-text-exam-2"> คะแนนที่ได้</div>
<div class="sub-text-exam"> {{
props.getdetail.scoreResult.scoreAFull }}</div>
<div class="sub-text-exam"> {{
props.getdetail.scoreResult.scoreBFull }}</div>
<div class="sub-text-exam"> {{
props.getdetail.scoreResult.scoreCFull }}</div>
<div class="sub-text-exam"> {{
(props.getdetail.scoreResult.scoreSumFull) }}
</div>
</div>
<div class="col-4 q-pa-xs header-sub-text-exam-2">
<div class="header-sub-text-exam-2">ผลการสอบ</div>
<div class="sub-text-exam">{{ props.getdetail.scoreResult.scoreA
}}</div>
<div class="sub-text-exam">{{ props.getdetail.scoreResult.scoreB
}}</div>
<div class="sub-text-exam">{{ props.getdetail.scoreResult.scoreC
}}</div>
<div class="sub-text-exam">{{
(props.getdetail.scoreResult.scoreSum) }}</div>
</div>
</div>
</q-card>
</div>
<div class="col-1"></div>
<div class="col-5 q-pt-sm q-pl-lg">
<div class="row">
<div class="col-7 header-sub-text">
<div class="q-pb-sm">ผลการสอบ</div>
<div class="q-pb-sm">ลำดับที่สอบได้</div>
<div class="q-pb-sm">จำนวนครั้งที่สมัครสอบ</div>
</div>
<div class="col-5 sub-text-exam">
<div class="q-pb-sm">{{ props.getdetail.scoreResult.examResult }}
</div>
<div class="q-pb-sm">{{ props.getdetail.number }}</div>
<div class="q-pb-sm">{{ props.getdetail.examCount }}</div>
</div>
</div>
</div>
</div>
</q-card>
</div>
<div class="contanier-box-mini">
<q-card bordered class="card-panding">
<div class="col-12 row items-center q-pa-sm header-text">
การคัดกรองคุณสมบัติ
</div>
<div v-for="item of checkboxItems" :key="item.id" class="q-pa-sm">
<q-checkbox size="xs" v-model="selection" :val="item.id" :label="item.label" keep-color
color="teal" class="checkbox-group" />
<q-separator />
</div>
</q-card>
</div>
</div>
<q-separator />
<div>
<DialogFooter :save="clickSave" v-model:editvisible="save" />
</div>
</q-form>
</q-card>
</q-dialog>
</template>
<style lang="scss" scoped>
.icon-officer {
color: #00AA86;
padding-left: 20px;
}
.check-officer {
font-size: 17px;
font-weight: 500;
line-height: 26px;
color: #00AA86;
padding-left: 20px;
}
.contanier-box-main {
padding: 10px 21px 10px 21px;
}
.contanier-box-mini {
padding: 10px 0px 10px 0px;
}
.card-panding {
padding: 15px 21px 15px 21px;
}
.header-text {
font-size: 18px;
font-weight: 600;
color: #4F4F4F;
}
.header-sub-text {
font-size: 16px;
font-weight: 400;
line-height: 150%;
color: #818181;
}
.sub-text {
font-weight: 400;
font-size: 16px;
line-height: 22px;
letter-spacing: 0.0025em;
color: #35373C;
}
.card-exam {
border-radius: 5px;
background: #FAFAFA;
}
.header-sub-text-exam {
font-size: 15px;
font-weight: 500;
line-height: 150%;
color: #818181;
}
.header-sub-text-exam-2 {
font-size: 15px;
font-weight: 500;
line-height: 150%;
color: #00AA86;
}
.sub-text-exam {
font-size: 15px;
font-weight: 500;
color: #000000;
}
.checkbox-group {
font-size: 16px;
font-weight: 400;
color: #35373C;
}
</style>

66
src/modules/05_placement/interface/index/Main.ts
View file

@ -1,7 +1,67 @@
import type { zipCodeOption } from "../../components/exams_other/profileType";
interface DataOption {
id: number;
name: string;
id: number | string;
name: string;
disable?: boolean;
}
interface DataOptionInsignia {
id: string;
name: string;
typeName: string;
}
interface EduOps {
levelOptions: DataOption[];
positionPathOptions: DataOption[];
}
export type { DataOption };
interface InformationOps {
prefixOps: DataOption[];
genderOps: DataOption[];
bloodOps: DataOption[];
statusOps: DataOption[];
religionOps: DataOption[];
employeeClassOps: DataOption[];
employeeTypeOps: DataOption[];
}
interface AddressOps {
provinceOps: DataOption[];
districtOps: DataOption[];
districtCOps: DataOption[];
subdistrictOps: zipCodeOption[];
subdistrictCOps: zipCodeOption[];
}
interface InsigniaOps {
insigniaOptions: DataOptionInsignia[];
}
interface Pagination {
rowsPerPage: number;
}
interface treeTab {
id: string;
label: string;
children: treeTab[];
}
interface CheckboxItem {
id: number;
label: string;
}
export type {
DataOption,
DataOptionInsignia,
treeTab,
InformationOps,
AddressOps,
Pagination,
EduOps,
InsigniaOps,
CheckboxItem
};

55
src/modules/05_placement/interface/request/Address.ts Normal file
View file

@ -0,0 +1,55 @@
interface DataProps {
row: RequestItemsObject;
rowIndex: number;
}
//ข้อมูล
interface RequestItemsObject {
currentAddress: String | null;
currentDistrictId: String | null;
currentProvinceId: String | null;
currentSubDistrictId: String | null;
currentZipCode: String | null;
registrationAddress: String | null;
registrationDistrictId: String | null;
registrationProvinceId: String | null;
registrationSame: Boolean | null;
registrationSubDistrictId: String | null;
registrationZipCode: String | null;
}
interface RequestItemsHistoryObject {
currentAddress: String | null;
currentDistrict: String | null;
currentProvince: String | null;
currentSubDistrict: String | null;
currentZipCode: String | null;
registrationAddress: String | null;
registrationDistrict: String | null;
registrationProvince: String | null;
registrationSame: Boolean | null;
registrationSubDistrict: String | null;
registrationZipCode: String | null;
createdFullName: String | null;
createdAt: Date;
}
//columns
interface Columns {
[index: number]: {
name: String;
align: String;
label: String;
sortable: Boolean;
field: String;
headerStyle: String;
style: String;
};
}
export type {
RequestItemsObject,
Columns,
DataProps,
RequestItemsHistoryObject,
};

31
src/modules/05_placement/interface/request/Certificate.ts Normal file
View file

@ -0,0 +1,31 @@
interface DataProps {
row: RequestItemsObject;
rowIndex: number;
}
//ข้อมูล
interface RequestItemsObject {
id: string;
certificateNo: string;
issuer: string;
issueDate: Date;
expireDate: Date;
certificateType: string;
createdFullName: string;
createdAt: Date;
}
//columns
interface Columns {
[index: number]: {
name: String;
align: String;
label: String;
sortable: Boolean;
field: String;
headerStyle: String;
style: String;
};
}
export type { RequestItemsObject, Columns, DataProps };

42
src/modules/05_placement/interface/request/Education.ts Normal file
View file

@ -0,0 +1,42 @@
interface DataProps {
row: RequestItemsObject;
rowIndex: number;
}
//ข้อมูล
interface RequestItemsObject {
id: string;
level: string;
levelId: string;
positionPath: string;
positionPathId: string;
institute: string;
degree: string;
field: string;
gpa: string;
country: string;
duration: string;
durationYear: number;
other: string;
fundName: string;
finishDate: Date;
startDate: number;
endDate: number;
createdFullName: string;
createdAt: Date;
}
//columns
interface Columns {
[index: number]: {
name: String;
align: String;
label: String;
sortable: Boolean;
field: String;
headerStyle: String;
style: String;
};
}
export type { RequestItemsObject, Columns, DataProps };

59
src/modules/05_placement/interface/request/Information.ts Normal file
View file

@ -0,0 +1,59 @@
interface DataProps {
row: RequestItemsObject;
rowIndex: number;
}
//ข้อมูล
interface RequestItemsObject {
birthDate: Date | null;
bloodGroupId: string | null;
citizenId: string | null;
firstName: string | null;
genderId: string | null;
lastName: string | null;
nationality: string | null;
prefixId: string | null;
race: string | null;
relationshipId: string | null;
religionId: string | null;
telephoneNumber: string | null;
employeeType: string | null;
employeeClass: string | null;
}
interface RequestItemsHistoryObject {
citizenId: string | null;
prefix: string | null;
firstName: string | null;
lastName: string | null;
birthDate: Date;
gender: string | null;
relationship: string | null;
bloodGroup: string | null;
nationality: string | null;
race: string | null;
religion: string | null;
telephoneNumber: string | null;
createdFullName: string | null;
createdAt: Date;
employeeType: string | null;
employeeClass: string | null;
}
//columns
interface Columns {
name: String;
align: String;
label: String;
sortable: Boolean;
field: String;
headerStyle: String;
style: String;
}
export type {
RequestItemsObject,
Columns,
DataProps,
RequestItemsHistoryObject,
};

38
src/modules/05_placement/interface/request/Insignia.ts Normal file
View file

@ -0,0 +1,38 @@
interface DataProps {
row: RequestItemsObject;
rowIndex: number;
}
//ข้อมูล
interface RequestItemsObject {
id: string;
insigniaType: string;
insignia: string;
insigniaId: string;
year: number;
no: string;
issue: string;
volumeNo: string;
volume: string;
section: string;
page: string;
receiveDate: Date;
dateAnnounce: Date;
createdFullName: string;
createdAt: Date;
}
//columns
interface Columns {
[index: number]: {
name: String;
align: String;
label: String;
sortable: Boolean;
field: String;
headerStyle: String;
style: String;
};
}
export type { RequestItemsObject, Columns, DataProps };

12
src/modules/05_placement/interface/request/Main.ts
View file

@ -1,12 +1,12 @@
// ข้อมูลรายการสอบแข่งขัน/คัดเลือก
interface FormPlacementMainData {
id: number;
ExamRound: string;
ExamOrder: number;
FiscalYear: number;
NumberofCandidates: number;
ExamType: number;
AccountExpirationDate: string;
examRound: string;
examOrder: number;
fiscalYear: number;
numberofCandidates: number;
examType: number;
accountExpirationDate: string;
isExpired?: boolean;
}

26
src/modules/05_placement/interface/request/placement.ts
View file

@ -1,7 +1,9 @@
interface TableName {
Id: string;
profileID: string;
position: number;
Name: string;
fullName: string;
dateOfBirth: string;
gender: string;
ExamOrder: number;
unitId: string;
UnitGroup: string;
@ -10,6 +12,24 @@ interface TableName {
BMAOfficer: boolean;
Status: string;
checkList: any;
}
address: string;
university: string;
degree: string;
major: string;
remark: string;
number: number;
examCount: number;
scoreResult: {
scoreAFull:number
scoreA: number;
scoreBFull: number;
scoreB: number;
scoreCFull: number;
scoreC: number;
scoreSumFull: number;
scoreSum: number;
examResult: string;
};
}
export type { TableName };

34
src/modules/05_placement/interface/response/Address.ts Normal file
View file

@ -0,0 +1,34 @@
//ข้อมูล
interface ResponseObject {
currentAddress: string | null;
currentDistrictId: string | null;
currentProvinceId: string | null;
currentSubDistrictId: string | null;
currentZipCode: string | null;
registrationAddress: string | null;
registrationDistrictId: string | null;
registrationProvinceId: string | null;
registrationSame: Boolean | null;
registrationSubDistrictId: string | null;
registrationZipCode: string | null;
createdFullName: string | null;
createdAt: Date;
}
interface ResponseHistory {
currentAddress: string | null;
currentDistrictId: string | null;
currentProvinceId: string | null;
currentSubDistrictId: string | null;
currentZipCode: string | null;
registrationAddress: string | null;
registrationDistrictId: string | null;
registrationProvinceId: string | null;
registrationSame: string | null;
registrationSubDistrictId: string | null;
registrationZipCode: string | null;
createdFullName: string | null;
createdAt: Date;
}
export type { ResponseObject, ResponseHistory };

13
src/modules/05_placement/interface/response/Certificate.ts Normal file
View file

@ -0,0 +1,13 @@
//ข้อมูล
interface ResponseObject {
id: string;
certificateNo: string;
issuer: string;
issueDate: Date;
expireDate: Date;
certificateType: string;
createdFullName: string;
createdAt: Date;
}
export type { ResponseObject };

24
src/modules/05_placement/interface/response/Education.ts Normal file
View file

@ -0,0 +1,24 @@
//ข้อมูล
interface ResponseObject {
id: string;
educationLevel: string;
educationLevelId: string;
positionPath: string;
positionPathId: string;
institute: string;
degree: string;
field: string;
gpa: string;
country: string;
duration: string;
durationYear: number;
other: string;
fundName: string;
finishDate: Date;
startDate: number;
endDate: number;
createdFullName: string;
createdAt: Date;
}
export type { ResponseObject };

23
src/modules/05_placement/interface/response/Information.ts Normal file
View file

@ -0,0 +1,23 @@
//ข้อมูล
interface ResponseObject {
birthDate: Date;
bloodGroupId: string | null;
citizenId: string | null;
firstName: string | null;
genderId: string | null;
lastName: string | null;
nationality: string | null;
prefixId: string | null;
race: string | null;
relationshipId: string | null;
religionId: string | null;
telephoneNumber: string | null;
createdFullName: string | null;
createdAt: Date;
age: string | null;
employeeType: string | null;
employeeClass: string | null;
profileType: string | null;
}
export type { ResponseObject };

20
src/modules/05_placement/interface/response/Insignia.ts Normal file
View file

@ -0,0 +1,20 @@
//ข้อมูล
interface ResponseObject {
id: string;
insigniaType: string;
insignia: string;
insigniaId: string;
year: number;
no: string;
issue: string;
volumeNo: string;
volume: string;
section: string;
page: string;
receiveDate: Date;
dateAnnounce: Date;
createdFullName: string;
createdAt: Date;
}
export type { ResponseObject };

32
src/modules/05_placement/router.ts
View file

@ -3,8 +3,10 @@
*/
const MainSorkorcho = () => import("@/modules/05_placement/components/exams_sorkorcho/Main.vue");
const MainSorkorkor = () => import("@/modules/05_placement/components/exams_korkor/Main.vue");
const PlacementDetail = () => import("@/modules/05_placement/components/pass/Detail.vue");
const MainOther = () => import("@/modules/05_placement/components/exams_other/Main.vue");
const Placement2Detail = () => import("@/modules/05_placement/components/exams_other/Detail.vue");
export default [
{
@ -17,10 +19,20 @@ export default [
Role: "placement",
},
},
{
path: "/placement/detail",
name: "placementDetail",
component: PlacementDetail,
meta: {
Auth: true,
Key: [7],
Role: "placement",
},
},
{
path: "/placement2",
name: "placement2",
component: MainSorkorkor,
component: MainOther,
meta: {
Auth: true,
Key: [7],
@ -28,19 +40,9 @@ export default [
},
},
{
path: "/placement/detail",
name: "placementDetail",
component: PlacementDetail,
meta: {
Auth: true,
Key: [7],
Role: "placement",
},
},
{
path: "/placement/detail",
name: "placementDetail",
component: PlacementDetail,
path: "/placement2/detail",
name: "placement2Detail",
component: Placement2Detail,
meta: {
Auth: true,
Key: [7],

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

@ -1,8 +1,83 @@
import { defineStore } from "pinia";
import { ref } from "vue";
import type { FormPlacementMainData } from "@/modules/05_placement/interface/request/Main"
export const useProfileDataStore = defineStore("placement", () => {
return {};
export const useProfileDataStore = defineStore("profile", () => {
interface profile {
main: { columns: String[] };
education: { columns: String[] };
certicate: { columns: String[] };
train: { columns: String[] };
insignia: { columns: String[] };
coined: { columns: String[] };
assessment: { columns: String[] };
salary: { columns: String[] };
discipline: { columns: String[] };
leave: { columns: String[] };
talent: { columns: String[] };
work: { columns: String[] };
record: { columns: String[] };
other: { columns: String[] };
document: { columns: String[] };
}
const birthDate = ref<Date>(new Date());
const retireText = ref<string | null>(null);
const changeRetireText = (val: string | null) => {
retireText.value = val;
};
const changeBirth = (val: Date) => {
birthDate.value = val;
};
const profileData = ref<profile>({
main: { columns: [] },
education: { columns: [] },
certicate: { columns: [] },
train: { columns: [] },
insignia: { columns: [] },
coined: { columns: [] },
assessment: { columns: [] },
salary: { columns: [] },
discipline: { columns: [] },
leave: { columns: [] },
talent: { columns: [] },
work: { columns: [] },
record: { columns: [] },
other: { columns: [] },
document: { columns: [] },
});
const changeProfileColumns = (system: String, val: String[]) => {
if (system == "main") profileData.value.main.columns = val;
if (system == "education") profileData.value.education.columns = val;
if (system == "certicate") profileData.value.certicate.columns = val;
if (system == "train") profileData.value.train.columns = val;
if (system == "insignia") profileData.value.insignia.columns = val;
if (system == "coined") profileData.value.coined.columns = val;
if (system == "assessment") profileData.value.assessment.columns = val;
if (system == "salary") profileData.value.salary.columns = val;
if (system == "discipline") profileData.value.discipline.columns = val;
if (system == "leave") profileData.value.leave.columns = val;
if (system == "talent") profileData.value.talent.columns = val;
if (system == "work") profileData.value.work.columns = val;
if (system == "record") profileData.value.record.columns = val;
if (system == "other") profileData.value.other.columns = val;
if (system == "document") profileData.value.document.columns = val;
localStorage.setItem("profile", JSON.stringify(profileData.value));
};
if (localStorage.getItem("profile") !== null) {
profileData.value = JSON.parse(localStorage.getItem("profile") || "{}");
}
return {
profileData,
changeProfileColumns,
birthDate,
changeBirth,
retireText,
changeRetireText,
};
});
export const usePlacementDataStore = defineStore("placement", () => {
interface placement {
@ -29,28 +104,29 @@ export const usePlacementDataStore = defineStore("placement", () => {
let DataMainYear = ref<object[]>([]) // ข้อมูลจำนวนปี
let DataMainOrig = ref<FormPlacementMainData[]>([]) // ข้อมูลหลักดั้งเดิม
let DataMainUpdate = ref<FormPlacementMainData[]>([]) // ข้อมูลเปลี่ยนแปลง
const DataMainYearSet = (val: any) => (DataMainYear.value = val)
const DataMain = (val: any) => (DataMainOrig.value = val)
const DataMainYearSet = (val: FormPlacementMainData[]) => (DataMainYear.value = val)
const DataMain = (val: FormPlacementMainData[]) => (DataMainOrig.value = val)
const DataUpdateMain = (filter_1: number | null, filter_2: number | null, filter_3: boolean) => {
DataMainUpdate.value = [];
if (filter_1 === null && filter_2 === 0 && filter_3 === false) {
// console.log('case 1');
return DataMainUpdate.value = DataMainOrig.value;
// return DataMainUpdate.value = DataMainOrig.value; อันเก่า
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.isExpired === filter_3);
} else if (filter_1 === null && filter_2 === null && filter_3 === false) {
// console.log('case 1.1');
return DataMainUpdate.value = DataMainOrig.value;
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.isExpired === filter_3);
} else if (filter_1 !== null && filter_2 === 0 && filter_3 === false) {
// console.log('case 2');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamOrder === filter_1);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examOrder === filter_1 && item.isExpired === filter_3);
} else if (filter_1 !== null && filter_2 === null && filter_3 === false) {
// console.log('case 2.1');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamOrder === filter_1);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examOrder === filter_1 && item.isExpired === filter_3);
} else if (filter_1 !== null && filter_2 !== 0 && filter_3 === false) {
// console.log('case 2.2');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamOrder === filter_1 && item.ExamType === filter_2);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examOrder === filter_1 && item.examType === filter_2 && item.isExpired === filter_3);
} else if (filter_1 === null && filter_2 !== 0 && filter_3 === false) {
// console.log('case 3');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamType === filter_2);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examType === filter_2 && item.isExpired === filter_3);
} else if (filter_1 === null && filter_2 === 0 && filter_3 === true) {
// console.log('case 3.1');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.isExpired === filter_3);
@ -59,16 +135,16 @@ export const usePlacementDataStore = defineStore("placement", () => {
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.isExpired === filter_3);
} else if (filter_1 !== null && filter_2 === 0 && filter_3 === true) {
// console.log('case 3.3');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamOrder == filter_1 && item.isExpired == filter_3);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examOrder == filter_1 && item.isExpired == filter_3);
} else if (filter_1 !== null && filter_2 === null && filter_3 === true) {
// console.log('case 3.4');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamOrder == filter_1 && item.isExpired == filter_3);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examOrder == filter_1 && item.isExpired == filter_3);
} else if (filter_1 !== null && filter_2 !== 0 && filter_3 === true) {
// console.log('case 3.5');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamOrder == filter_1 && item.ExamType == filter_2 && item.isExpired == filter_3);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examOrder == filter_1 && item.examType == filter_2 && item.isExpired == filter_3);
} else if (filter_1 === null && filter_2 !== 0 && filter_3 === true) {
// console.log('case 3.6');
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.ExamType == filter_2 && item.isExpired == filter_3);
return DataMainUpdate.value = DataMainOrig.value.filter((item) => item.examType == filter_2 && item.isExpired == filter_3);
}
}