From 67161d79ff7ab027191ce125743bbed74ec2c545 Mon Sep 17 00:00:00 2001 From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" Date: Thu, 3 Oct 2024 17:33:24 +0700 Subject: [PATCH] =?UTF-8?q?UI=20=E0=B8=A1=E0=B8=AD=E0=B8=9A=E0=B8=AB?= =?UTF-8?q?=E0=B8=A1=E0=B8=B2=E0=B8=A2=E0=B8=AB=E0=B8=99=E0=B9=89=E0=B8=B2?= =?UTF-8?q?=E0=B8=97=E0=B8=B5=E0=B9=88=E0=B8=84=E0=B8=A7=E0=B8=B2=E0=B8=A1?= =?UTF-8?q?=E0=B8=A3=E0=B8=B1=E0=B8=9A=E0=B8=9C=E0=B8=B4=E0=B8=94=E0=B8=8A?= =?UTF-8?q?=E0=B8=AD=E0=B8=9A?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../DialogResponsibilities.vue | 153 ++++ .../02_users/interface/request/Main.ts | 1 + src/modules/02_users/router.ts | 16 +- .../02_users/views/03_permissionsView.vue | 17 +- .../02_users/views/05_responsIbilities.vue | 703 ++++++++++++++++++ 5 files changed, 887 insertions(+), 3 deletions(-) create mode 100644 src/modules/02_users/components/05_responsIbilities/DialogResponsibilities.vue create mode 100644 src/modules/02_users/views/05_responsIbilities.vue diff --git a/src/modules/02_users/components/05_responsIbilities/DialogResponsibilities.vue b/src/modules/02_users/components/05_responsIbilities/DialogResponsibilities.vue new file mode 100644 index 00000000..27996f71 --- /dev/null +++ b/src/modules/02_users/components/05_responsIbilities/DialogResponsibilities.vue @@ -0,0 +1,153 @@ + + + + + diff --git a/src/modules/02_users/interface/request/Main.ts b/src/modules/02_users/interface/request/Main.ts index d2130a48..e694a69a 100644 --- a/src/modules/02_users/interface/request/Main.ts +++ b/src/modules/02_users/interface/request/Main.ts @@ -22,6 +22,7 @@ interface FilterReqMaster { id: string; type: number; isAll: boolean; + isBlank: boolean; page: number; pageSize: number; keyword: string; diff --git a/src/modules/02_users/router.ts b/src/modules/02_users/router.ts index bea6e038..1c7fbc2d 100644 --- a/src/modules/02_users/router.ts +++ b/src/modules/02_users/router.ts @@ -4,7 +4,8 @@ const PageManagementRole = () => import("@/modules/02_users/views/page01_ManagementRoleUser.vue"); /** role*/ -const ListsPageRole = () => import("@/modules/02_users/views/02_rolesAndPermissions.vue"); +const ListsPageRole = () => + import("@/modules/02_users/views/02_rolesAndPermissions.vue"); const ListsPage2Role = () => import("@/modules/02_users/views/page02_rolesAndPermissionsDetail.vue"); @@ -16,6 +17,10 @@ const PermissionPage = () => const roleOrgview = () => import("@/modules/02_users/views/04_roleOrganization.vue"); +/** responsIbilities*/ +const responsIbilitiesView = () => + import("@/modules/02_users/views/05_responsIbilities.vue"); + export default [ { path: "/users", @@ -68,4 +73,13 @@ export default [ Role: ["SUPER_ADMIN", "ADMIN"], }, }, + + { + path: "/responsibilities", + name: "responsibilities", + component: responsIbilitiesView, + meta: { + Role: ["SUPER_ADMIN", "ADMIN"], + }, + }, ]; diff --git a/src/modules/02_users/views/03_permissionsView.vue b/src/modules/02_users/views/03_permissionsView.vue index b4afc58a..7c8090dc 100644 --- a/src/modules/02_users/views/03_permissionsView.vue +++ b/src/modules/02_users/views/03_permissionsView.vue @@ -194,6 +194,7 @@ const reqMaster = reactive({ id: "", type: 0, isAll: false, + isBlank: false, page: 1, pageSize: 10, keyword: "", @@ -379,10 +380,11 @@ watch([() => reqMaster.pageSize], () => { /** callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนจำนวนต่อแแแถว*/ watch( - () => reqMaster.isAll, + () => [reqMaster.isAll, reqMaster.isBlank], () => { reqMaster.page = 1; - fetchDataTable(reqMaster.id, reqMaster.revisionId, reqMaster.type); + reqMaster.id && + fetchDataTable(reqMaster.id, reqMaster.revisionId, reqMaster.type); } ); @@ -502,6 +504,17 @@ onMounted(() => {
+
+ + แสดงเฉพาะตำแหน่งว่าง + +
+
+import { ref, reactive, onMounted, watch } from "vue"; +import { useQuasar } from "quasar"; + +import http from "@/plugins/http"; +import config from "@/app.config"; +import { useCounterMixin } from "@/stores/mixin"; + +/** importType*/ +import type { QTableProps } from "quasar"; +import type { Pagination } from "@/modules/02_users/interface/index/Main"; +import type { FilterReqMaster } from "@/modules/02_users/interface/request/Main"; +import type { + NodeTree, + PosMaster, + Position, +} from "@/modules/02_users/interface/response/Main"; + +/** importComponents*/ +import DialogResponsibilities from "@/modules/02_users/components/05_responsIbilities/DialogResponsibilities.vue"; + +/** use*/ +const $q = useQuasar(); +const { showLoader, hideLoader, messageError, success, dialogRemove } = + useCounterMixin(); + +/** Tree*/ +const filter = ref(""); // ค้นหาข้อมูลโครงาสร้าง +const nodes = ref>([]); // ข้อมูลโครงสร้าง +const lazy = ref(nodes); +const expanded = ref([]); // แสดงข้อมูลในโหนดที่เลือก +const nodeId = ref(""); // id โหนด + +/** Table*/ +const columns = ref([ + { + name: "no", + align: "left", + label: "ลำดับ", + sortable: false, + field: (row) => + (reqMaster.page - 1) * reqMaster.pageSize + + posMaster.value.indexOf(row) + + 1, + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "posMasterNo", + align: "left", + label: "เลขที่ตำแหน่ง", + sortable: false, + field: (row) => + row.orgShortname + + (row.posMasterNoPrefix ? row.posMasterNoPrefix : "") + + (row.posMasterNo ? row.posMasterNo : "") + + (row.posMasterNoSuffix ? row.posMasterNoSuffix : "") + + (row.isSit ? "(ทับที่)" : ""), + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "positionName", + align: "left", + label: "ตำแหน่งในสายงาน", + field: (row) => (row.isSit ? row.profilePosition : row.positionName), + sortable: false, + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "posTypeName", + align: "left", + label: "ประเภทตำแหน่ง", + sortable: false, + field: (row) => (row.isSit ? row.profilePostype : row.posTypeName), + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "posLevelName", + align: "left", + label: "ระดับตำแหน่ง", + sortable: false, + field: (row) => (row.isSit ? row.profilePoslevel : row.posLevelName), + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "positionIsSelected", + align: "left", + label: "คนครอง", + sortable: false, + field: (row) => + row.fullNameCurrentHolder !== null ? row.fullNameCurrentHolder : "ว่าง", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "responsibilities", + align: "left", + label: "การเจ้าหน้าที่", + sortable: false, + field: "responsibilities", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, +]); +const columnsExpand = ref([ + { + name: "no", + align: "left", + label: "ลำดับ", + sortable: false, + field: "no", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "positionName", + align: "left", + label: "ตำแหน่งในสายงาน", + sortable: true, + field: "positionName", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "positionField", + align: "left", + label: "สายงาน", + sortable: true, + field: "positionField", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "posTypeName", + align: "left", + label: "ประเภทตำเเหน่ง", + sortable: true, + field: "posTypeName", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "posLevelName", + align: "left", + label: "ระดับตำแหน่ง", + sortable: true, + field: "posLevelName", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "posExecutiveName", + align: "left", + label: "ตำแหน่งทางการบริหาร", + sortable: true, + field: "posExecutiveName", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "positionExecutiveField", + align: "left", + label: "ด้านทางการบริหาร", + sortable: true, + field: "positionExecutiveField", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, + { + name: "positionArea", + align: "left", + label: "ด้าน/สาขา", + sortable: true, + field: "positionArea", + headerStyle: "font-size: 14px", + style: "font-size: 14px", + }, +]); +// ฟอร์มค้นหาตำแหน่ง +const reqMaster = reactive({ + id: "", + type: 0, + isAll: false, + isBlank: false, + page: 1, + pageSize: 10, + keyword: "", + revisionId: "", +}); +const maxPage = ref(0); +const totalRow = ref(0); +const posMaster = ref([]); // ข้อมูลรายการตำแหน่ง +const dataPosMaster = ref(); // ข้อมูลตำแหน่ง +const pagination = ref({ + page: reqMaster.page, + rowsPerPage: reqMaster.pageSize, +}); + +const modalDialog = ref(false); + +/** + * function เรียกข้อมูลโครงสร้าง แบบปัจุบัน + */ +async function fetchOrganizationActive() { + showLoader(); + await http + .get(config.API.activeOrganization) + .then(async (res) => { + const data = res.data.result; + if (data) { + await fetchDataTree(data.activeId); + } + }) + .catch((err) => { + messageError($q, err); + }) + .finally(() => { + hideLoader(); + }); +} + +/** + * function fetch ข้อมูลของ Tree + * @param id id โครงสร้าง + */ +async function fetchDataTree(id: string) { + showLoader(); + await http + .get(config.API.orgByid(id.toString())) + .then(async (res) => { + const data = await res.data.result; + nodes.value = data; + }) + .catch((err) => { + messageError($q, err); + }) + .finally(() => { + hideLoader(); + }); +} + +/** + * function fetch ข้อรายการตำแหน่ง + * @param id idTree + * @param level levelTree + */ +async function fetchDataTable(id: string, revisionId: string, level: number) { + showLoader(); + posMaster.value = []; + reqMaster.id = id; + reqMaster.revisionId = revisionId; + reqMaster.type = level; + + await http + .post(config.API.orgPosMasterList, reqMaster) + .then(async (res) => { + const dataMain: PosMaster[] = []; + maxPage.value = Math.ceil(res.data.result.total / reqMaster.pageSize); + totalRow.value = res.data.result.total; + + await res.data.result.data.forEach((e: PosMaster) => { + const p = e.positions; + if (p.length !== 0) { + const a = p.find((el: Position) => el.positionIsSelected === true); + const { id, ...rest } = a ? a : p[0]; + const pos = { ...e, ...rest }; + dataMain.push(pos); + } + }); + posMaster.value = dataMain; + }) + .catch((err) => { + messageError($q, err); + }) + .finally(() => { + hideLoader(); + }); +} + +/** + * function เลือกข้อมูลโครางสร่้าง + * @param data + */ +function updateSelected(data: NodeTree) { + nodeId.value = data.orgTreeId; + fetchDataTable(data.orgTreeId, data.orgRevisionId, data.orgLevel); +} + +/** + * function updatePagination + * @param newPagination ข้อมูล Pagination ใหม่ + */ +function updatePagination(newPagination: Pagination) { + reqMaster.pageSize = newPagination.rowsPerPage; + reqMaster.page = 1; +} + +function onClickAddRole(data: PosMaster) { + modalDialog.value = true; + dataPosMaster.value = data; +} + +/** + * ยืนยันการลบกำหนดหน้าที่ความรับผิดชอบ + * @param id ตำแหน่ง + */ +function onDelete(id: string) { + dialogRemove($q, () => { + // showLoader(); + // http + // .post(config.API.managementPermission, { + // authRoleId: "", + // posMasterId: id, + // }) + // .then(async () => { + // await fetchDataTable( + // reqMaster.id, + // reqMaster.revisionId, + // reqMaster.type + // ); + // success($q, "ลบข้อมูลสำเร็จ"); + // }) + // .catch((err) => { + // messageError($q, err); + // }) + // .finally(() => { + // hideLoader(); + // }); + }); +} + +/** callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนหน้า*/ +watch([() => reqMaster.pageSize], () => { + fetchDataTable(reqMaster.id, reqMaster.revisionId, reqMaster.type); +}); + +/** callblck function ทำการ fetch ข้อมูล Table เมื่อมีการเปลี่ยนจำนวนต่อแแแถว*/ +watch( + () => [reqMaster.isAll, reqMaster.isBlank], + () => { + reqMaster.page = 1; + reqMaster.id && + fetchDataTable(reqMaster.id, reqMaster.revisionId, reqMaster.type); + } +); + +onMounted(() => { + fetchOrganizationActive(); +}); + + + + +