diff --git a/src/api/02_organizational/api.organization.ts b/src/api/02_organizational/api.organization.ts index d9f9ba3c3..c5e6cd258 100644 --- a/src/api/02_organizational/api.organization.ts +++ b/src/api/02_organizational/api.organization.ts @@ -37,6 +37,6 @@ export default { /**ครองตำแหน่ง */ orgSearchProfile: `${orgProfile}/search`, - orgProfile: `${orgProfile}`, - orgDeleteProfile: (id: string) => `${orgProfile}/delete/${id}`, + orgProfile: `${orgPos}/profile`, + orgDeleteProfile: (id: string) => `${orgPos}/profile/delete/${id}`, }; diff --git a/src/modules/02_organizationalNew/components/DialogFormPosition.vue b/src/modules/02_organizationalNew/components/DialogFormPosition.vue index 04aaa3f15..c82cea922 100644 --- a/src/modules/02_organizationalNew/components/DialogFormPosition.vue +++ b/src/modules/02_organizationalNew/components/DialogFormPosition.vue @@ -588,11 +588,10 @@ async function emitSearch(keyword: string, typeSelect: string) { :close="close" /> - - -
-
-
+ + +
+
{{ !isPosition - ? "เลือกตำแหน่งที่ต้องการเพิ่ม" - : "ปิดหน้าต่าง" + ? "คลิกเพื่อแสดงส่วนของการเพิ่มตำแหน่ง" + : "ปิดหน้าต่างการเพิ่มตำแหน่ง" }} + - สืบทอดตำแหน่ง + สืบทอดตำแหน่ง - - - +
-
-
-
- -
- เลือกตำแหน่งที่ต้องการเพิ่ม - สร้างตำแหน่ง +
+ +
-
-
-
-
-
- -
- -
- -
- -
- - -
-
- -
- สร้างตำแหน่ง - - -
-
- +
+
+
+
+ +
+ +
+ +
+ +
+ + +
+
+ +
+ + + + +
+
+ +
-
- - + + + + + + import { ref, reactive, watch } from "vue"; import { useQuasar } from "quasar"; - import http from "@/plugins/http"; import config from "@/app.config"; +/** importType*/ import type { QTableProps } from "quasar"; -import { useCounterMixin } from "@/stores/mixin"; -import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational"; -import DialogHeader from "@/components/DialogHeader.vue"; -import type { Position } from "@/modules/02_organizationalNew/interface/index/organizational"; -import type { DataOption } from "@/modules/02_organizationalNew/interface/index/Main"; +import type { + Position, + SeaechResult, + FormPositionFilter, +} from "@/modules/02_organizationalNew/interface/index/organizational"; +import type { + DataOption, + NewPagination, +} from "@/modules/02_organizationalNew/interface/index/Main"; import type { OptionType, OptionExecutive, OptionLevel, + SelectPerson, + TypePos, } from "@/modules/02_organizationalNew/interface/response/organizational"; -interface FormDetailPosition { - positionNo: string; - positionType: string; - positionLevel: string; - personal: string; - position: string; - status: string; -} -interface SeaechResult { - id: string; - citizenId: string; - name: string; - posTypeName: string; - posLevelName: string; -} +/** importCompoonents*/ +import DialogHeader from "@/components/DialogHeader.vue"; -const isReadonly = ref(false); // อ่านได้อย่างเดียว -const isDisValidate = ref(false); -const executiveOpsMain = ref([]); -const typeOpsMain = ref([]); -const levelOpsMain = ref([]); -const typeOps = ref([]); -const levelOps = ref([]); -const dataLevel = ref(); -const selected = ref([]); -const isSit = ref(false); -const executiveOps = ref([]); -const store = useOrganizational(); +/** import*Store*/ +import { useCounterMixin } from "@/stores/mixin"; +import { useOrganizational } from "@/modules/02_organizationalNew/store/organizational"; + +/** use*/ const $q = useQuasar(); -const { dialogConfirm, showLoader, success, hideLoader, messageError } = - useCounterMixin(); +const store = useOrganizational(); +const { + dialogConfirm, + showLoader, + success, + hideLoader, + messageError, + dialogMessageNotify, +} = useCounterMixin(); +/** props*/ const modal = defineModel("modal", { required: true }); -// const modal = ref(true); - const props = defineProps({ fetchActive: { type: Function, require: true, }, dataDetailPos: { type: Object, require: true }, + fetchDataTable: { + type: Function, + required: true, + }, }); -const row = ref([]); -const rowResult = ref([]); -const formData = reactive({ +const isReadonly = ref(false); // อ่านได้อย่างเดียว +const isDisValidate = ref(false); +const typeOpsMain = ref([]); +const levelOpsMain = ref([]); +const typeOps = ref([]); +const levelOps = ref([]); +const dataLevel = ref([]); +const selected = ref([]); +const isSit = ref(false); + +const formData = reactive({ positionNo: "", //*เลขที่ตำแหน่ง positionType: "", //*เลขที่ตำแหน่ง positionLevel: "", //*เลขที่ตำแหน่ง @@ -71,6 +75,7 @@ const formData = reactive({ status: "", }); +/** Table*/ const visibleColumnsResult = ref([ "no", "citizenId", @@ -78,7 +83,6 @@ const visibleColumnsResult = ref([ "posTypeName", "posLevelName", ]); - const columns = ref([ { name: "no", @@ -209,11 +213,15 @@ const columnsResult = ref([ style: "font-size: 14px", }, ]); +const row = ref([]); +const rowResult = ref([]); +/** function closePopup*/ function close() { modal.value = false; } +/** function เรียกข้อมูลประเภทตำแหน่ง*/ async function fetchType() { showLoader(); await http @@ -234,26 +242,6 @@ async function fetchType() { }); } -/** function เรียกรายการตำแหน่งทางการบริหาร */ -async function fetchExecutive() { - showLoader(); - await http - .get(config.API.orgPosExecutive) - .then((res) => { - executiveOpsMain.value = res.data.result.map((e: OptionExecutive) => ({ - id: e.id, - name: e.posExecutiveName, - })); - executiveOps.value = executiveOpsMain.value; - }) - .catch((err) => { - messageError($q, err); - }) - .finally(() => { - hideLoader(); - }); -} - /** * ส่งค่า css ออกไปตามเงื่อนไข * @param val true/false @@ -265,6 +253,105 @@ function inputEdit(val: boolean) { }; } +/** function เรียกข้แมูลระดับตำแหน่ง*/ +function updateSelectType(val: string) { + const listLevel: any = dataLevel.value.find((e: TypePos) => e.id === val); + levelOpsMain.value = listLevel?.posLevels.map((e: OptionLevel) => ({ + id: e.id, + name: e.posLevelName, + })); + levelOps.value = levelOpsMain.value; + formData.positionLevel = ""; +} + +/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */ +function validateForm() { + if (selected.value.length === 0) { + dialogMessageNotify($q, "กรุณาเลือกรายการตำแหน่ง"); + } else if (selectedProfile.value.length === 0) { + dialogMessageNotify($q, "กรุณาเลือกคนครอง"); + } else { + onSubmit(); + } +} + +/** function ยืนยันการบันทึกข้อมูล */ +function onSubmit() { + dialogConfirm( + $q, + () => { + const body = { + posMaster: props.dataDetailPos?.id, //*id อัตรากำลัง + position: selected.value[0]?.id, //*id ตำแหน่ง + profileId: selectedProfile.value[0]?.id, //*id profile + isSit: isSit.value, //*นั่งทับที่ไหม + }; + showLoader(); + http + .post(config.API.orgProfile, body) + .then(() => { + props.fetchDataTable?.(store.treeId, store.level, false); + success($q, "บันทึกข้อมูลสำเร็จ"); + }) + .catch((err) => { + messageError($q, err); + }) + .finally(async () => { + modal.value = await false; + close(); + hideLoader(); + }); + }, + "ยืนยันการเลือกคนครอง", + "ต้องการยืนยันการเลือกคนครองตำแหน่งนี้ใช่หรือไม่?" + ); +} + +const page = ref(1); +const pageSize = ref(10); +const totalPage = ref(0); +const selectedProfile = ref([]); +/** functiuon ค้นหาคนครอง */ +async function searchData() { + showLoader(); + const reqBody = { + posTypeId: formData.positionType, // id ประเภทตำแหน่ง + posLevelId: formData.positionLevel, // id ระดับตำแหน่ง + position: formData.position, // ตำแหน่ง + page: page.value, //*หน้า + pageSize: pageSize.value, //*จำนวนแถวต่อหน้า + keyword: formData.personal, //นามสกุล ชื่อ สกุล เลขบัตร + }; + await http + .post(config.API.orgSearchProfile, reqBody) + .then((res) => { + totalPage.value = Math.ceil(res.data.result.total / pageSize.value); + const list = res.data.result.data.map((e: SelectPerson) => ({ + id: e.id, + citizenId: e.citizenId, + name: `${e.prefix + e.firstName + " " + e.lastName}`, + posTypeName: e.posType ?? "-", + positionName: e.position ?? "-", + posLevelName: e.posLevel ?? "-", + })); + rowResult.value = list; + }) + + .catch((err) => { + messageError($q, err); + }) + .finally(() => { + hideLoader(); + }); +} + +/** function update PageSize*/ +function updatePagination(newPagination: NewPagination) { + pageSize.value = newPagination.rowsPerPage; + page.value = 1; +} + +/** function เคลียร์Form*/ function clearForm() { formData.positionType = ""; formData.positionLevel = ""; @@ -272,15 +359,24 @@ function clearForm() { formData.position = ""; row.value = []; rowResult.value = []; + selected.value = []; + selectedProfile.value = []; + isSit.value = false; } +/** function เคลียร์ตำแหน่ง*/ +function clearPosition() { + formData.positionType = ""; + formData.positionLevel = ""; +} + +/** callback function ทำงานเมื่อเปิด popup*/ watch( () => modal.value, () => { if (modal.value == true) { clearForm(); fetchType(); - fetchExecutive(); if (props.dataDetailPos) { formData.positionNo = props.dataDetailPos.posMasterNo; @@ -307,128 +403,10 @@ watch( } ); -function updateSelectType(val: string) { - const listLevel = dataLevel.value.find((e: any) => e.id === val); - levelOpsMain.value = listLevel.posLevels.map((e: OptionLevel) => ({ - id: e.id, - name: e.posLevelName, - })); - levelOps.value = levelOpsMain.value; - formData.positionLevel = ""; -} - -/** ฟังก์ชั่นตรวจสอบความถูกต้องของข้อมูลในฟอร์ม */ -function validateForm() { - // const hasError = []; - // for (const key in objectRef) { - // if (Object.prototype.hasOwnProperty.call(objectRef, key)) { - // const property = objectRef[key]; - // if (property.value && typeof property.value.validate === "function") { - // const isValid = property.value.validate(); - // hasError.push(isValid); - // } - // } - // } - // if (hasError.every((result) => result === true)) { - onSubmit(); - // } else { - // } -} - -/** ฟังชั่น บันทึก */ -function onSubmit() { - dialogConfirm( - $q, - () => { - console.log("ตำแหน่ง==>", selected.value); - console.log("ทับที่==>", isSit); - // showLoader(); - // http - // .post(config.API.createOrganization, formData) - // .then((res) => { - // status.value = true; - // store.typeOrganizational = "draft"; - // store.draftId = res.data.result.id; - // success($q, "บันทึกข้อมูลสำเร็จ"); - // // props.fetchActive?.(); - // }) - // .catch((err) => { - // messageError($q, err); - // }) - // .finally(async () => { - // modal.value = await false; - // await close(); - // await hideLoader(); - // }); - }, - "ยืนยันการเลือกคนครอง", - "ต้องการยืนยันการเลือกคนครองตำแหน่งนี้ใช่หรือไม่?" - ); -} - -/** เมื่อ enter ให้ทำการ ค้นหาข้อมูล */ -const page = ref(1); -const pageSize = ref(20); -async function searchData() { - showLoader(); - console.log(formData); - const reqBody = { - posTypeId: formData.positionType, // id ประเภทตำแหน่ง - posLevelId: formData.positionLevel, // id ระดับตำแหน่ง - position: formData.position, // ตำแหน่ง - page: page.value, //*หน้า - pageSize: pageSize.value, //*จำนวนแถวต่อหน้า - keyword: formData.personal, //นามสกุล ชื่อ สกุล เลขบัตร - }; - await http - .post(config.API.orgSearchProfile, reqBody) - .then((res) => { - console.log(res); - const list = res.data.result.data.map((e: any) => ({ - id: e.id, - citizenId: e.citizenId, - name: `${e.prefix + e.firstName + e.lastName}`, - posTypeName: e.posType ?? "-", - positionName: e.position ?? "-", - posLevelName: e.posLevel ?? "-", - })); - rowResult.value = list; - }) - - .catch((err) => { - messageError($q, err); - }) - .finally(() => { - hideLoader(); - }); - - // const data = [ - // { - // id: "test1", - // citizenId: "test1", - // name: "test1", - // posTypeName: "test1", - // positionName: "test1", - // posLevelName: "test1", - // }, - // { - // id: "test2", - // citizenId: "test2", - // name: "test2", - // posTypeName: "test2", - // positionName: "test2", - // posLevelName: "test2", - // }, - // ]; - - // rowResult.value = data; - // props.fetchListDisciplinary?.(); -} - -function clearPosition() { - formData.positionType = ""; - formData.positionLevel = ""; -} +/** callback function ทำงานการค้นหาข้อมุลคนครองเมื่อมีการ update Pagination*/ +watch([() => page.value, () => pageSize.value], () => { + searchData(); +});