From 756daf8d68d881fa16cb288784cb22ee1b6b7b40 Mon Sep 17 00:00:00 2001 From: "DESKTOP-1R2VSQH\\Lenovo ThinkPad E490" Date: Tue, 30 Jan 2024 18:00:58 +0700 Subject: [PATCH] no message --- .../components/DialogFormAgency.vue | 30 +-- .../components/StructureDetail.vue | 12 +- .../components/listView.vue | 4 +- .../components/mainTree.vue | 223 +++++------------- .../interface/response/organizational.ts | 20 +- .../store/organizational.ts | 16 ++ 6 files changed, 124 insertions(+), 181 deletions(-) diff --git a/src/modules/02_organizationalNew/components/DialogFormAgency.vue b/src/modules/02_organizationalNew/components/DialogFormAgency.vue index c039aac4e..e1aca808d 100644 --- a/src/modules/02_organizationalNew/components/DialogFormAgency.vue +++ b/src/modules/02_organizationalNew/components/DialogFormAgency.vue @@ -34,6 +34,10 @@ const props = defineProps({ type: Object, require: true, }, + edit: { + type: Function, + require: true, + }, }); const $q = useQuasar(); @@ -134,8 +138,6 @@ function onSubmit() { ["org" + type + "Rank"]: formData.orgLevel, [nameId]: rootId, }; - console.log(body); - if (actionType.value === "ADD") { await http .post(config.API.createOrgLevel(type.toLocaleLowerCase()), body) @@ -164,6 +166,7 @@ function onSubmit() { ) .then((res) => { console.log(res); + props.edit?.(props.dataNode?.orgTreeId, type, body); success($q, "บันทึกข้อมูลสำเร็จ"); }) .catch((err) => { @@ -171,7 +174,7 @@ function onSubmit() { messageError($q, err); }) .finally(async () => { - await props.fetchDataTree?.(); + // await props.fetchDataTree?.(); await closeClear(); await hideLoader(); })); @@ -211,7 +214,10 @@ watch( formData.orgPhoneIn = props.dataNode.orgTreePhoneIn; formData.orgFax = props.dataNode.orgTreeFax; formData.orgLevel = props.dataNode.orgTreeRank; - orgLevelOption.value = orgLevelOptionMain.value.slice(1, 4); + orgLevelOption.value = + props.dataNode.orgTreeRank === "DEPARTMENT" + ? orgLevelOptionMain.value + : orgLevelOptionMain.value.slice(1, 4); } } } @@ -221,18 +227,14 @@ watch( const tittleName = computed(() => { let name = ""; if (actionType.value === "ADD") { - if (level.value === 1) { - name = "เพิ่มหน่วยงาน"; - } else { - name = "เพิ่มส่วนราชการ"; - } + name = + level.value === 0 || level.value === 1 + ? "เพิ่มหน่วยงาน" + : "เพิ่มส่วนราชการ"; } else { - if (level.value === 0) { - name = "แก้ไขหน่วยงาน"; - } else { - name = "แก้ไขเพิ่มส่วนราชการ"; - } + name = level.value === 0 ? "แก้ไขหน่วยงาน" : "แก้ไขเพิ่มส่วนราชการ"; } + return name; }); diff --git a/src/modules/02_organizationalNew/components/StructureDetail.vue b/src/modules/02_organizationalNew/components/StructureDetail.vue index bf30060de..7e2f334fc 100644 --- a/src/modules/02_organizationalNew/components/StructureDetail.vue +++ b/src/modules/02_organizationalNew/components/StructureDetail.vue @@ -33,6 +33,7 @@ const formData = reactive({ }); async function fetchDetailTree(id: string, type: string) { + showLoader(); await http .get(config.API.orgLevelByid(type.toLocaleLowerCase(), id)) .then((res) => { @@ -40,8 +41,9 @@ async function fetchDetailTree(id: string, type: string) { formData.orgName = data[`org${type}Name`]; formData.agencyName = data[`org${type}Name`]; formData.orgType = data[`org${type}Name`]; - formData.orgLevel = data[`org${type}Rank`]; - formData.status = data[`org${type}Name`]; + formData.orgLevel = store.convertType(data[`org${type}Rank`]); + formData.status = + store.typeOrganizational === "current" ? "ปัจจุบัน" : "แบบร่าง"; formData.orgPhoneEx = data[`org${type}PhoneEx`]; formData.orgPhoneIn = data[`org${type}PhoneIn`]; formData.orgFax = data[`org${type}Fax`]; @@ -61,10 +63,10 @@ function close() { watch( () => modal.value, - () => { + async () => { if (modal.value == true) { - const type = store.checkLevel(orgLevel.value); - fetchDetailTree(treeId.value, type); + const type = await store.checkLevel(orgLevel.value); + await fetchDetailTree(treeId.value, type); } } ); diff --git a/src/modules/02_organizationalNew/components/listView.vue b/src/modules/02_organizationalNew/components/listView.vue index 5f264aa91..a0d0916eb 100644 --- a/src/modules/02_organizationalNew/components/listView.vue +++ b/src/modules/02_organizationalNew/components/listView.vue @@ -5,7 +5,7 @@ import http from "@/plugins/http"; import config from "@/app.config"; /** importType*/ -import type { DataActive } from "@/modules/02_organizationalNew/interface/response/organizational"; +import type { OrgTree } from "@/modules/02_organizationalNew/interface/response/organizational"; import TreeView from "@/modules/02_organizationalNew/components/mainTree.vue"; import TableView from "@/modules/02_organizationalNew/components/tableTree.vue"; @@ -18,7 +18,7 @@ const $q = useQuasar(); const { showLoader, hideLoader, messageError } = useCounterMixin(); const showData = ref(false); -const nodeTree = ref(); +const nodeTree = ref(); // defineProps<{ dataActive: DataActive }>(); diff --git a/src/modules/02_organizationalNew/components/mainTree.vue b/src/modules/02_organizationalNew/components/mainTree.vue index 7a0a100d0..7242d88ce 100644 --- a/src/modules/02_organizationalNew/components/mainTree.vue +++ b/src/modules/02_organizationalNew/components/mainTree.vue @@ -5,6 +5,7 @@ import http from "@/plugins/http"; import config from "@/app.config"; import type { ListMenu } from "@/modules/02_organizationalNew/interface/index/Main"; +import type { OrgTree } from "@/modules/02_organizationalNew/interface/response/organizational"; /** importComponents*/ import DialogAgency from "@/modules/02_organizationalNew/components/DialogFormAgency.vue"; @@ -77,9 +78,9 @@ const listAdd = ref([ }, ]); -const nodeTEST = defineModel("nodeTree", { required: true }); +const nodeTEST = defineModel("nodeTree", { default: [] }); const filter = ref(""); -const nodes = ref>([]); +const nodes = ref>([]); const lazy = ref(nodes); const expanded = ref>([]); const notFound = ref("ไม่พบข้อมูลที่ค้นหา"); @@ -87,137 +88,42 @@ const noData = ref("ไม่มีข้อมูล"); const selected = ref(""); const orgLevel = ref(0); -const filterData = (node: any, filter: string) => { - // ให้ทาง API ค้นหาให้ - nodes.value = [ - { - organizationName: "สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร", - organizationId: "3b86d275-8259-427c-8da7-12813fe482eb", - organizationLevel: 0, - lazy: true, - children: [ - { - organizationName: "กองบริหารทั่วไป", - organizationId: "3486d275-8159-427c-8da7-12813fe482eb", - organizationLevel: 1, - }, - { - organizationName: "กองสรรหาบุคคล", - organizationId: "3486d275-8259-427c-8da7-12813fe400eb", - organizationLevel: 1, - }, - { - organizationName: "สถาบันพัฒนาทรัพยากรบุคคลกรุงเทพมหานคร", - organizationId: "3486d275-8259-437c-8da7-12813fe482eb", - organizationLevel: 1, - children: [ - { - organizationName: "ฝ่ายบริหารงานทั่วไป", - organizationId: "3486d275-8259-427c-8da7-12813ff482eb", - organizationLevel: 2, - }, - { - organizationName: "ส่วนส่งเสริมการพัฒนาทรัพยากรบุคคล", - organizationId: "3486d275-8259-427c-8da7-12833fe482eb", - organizationLevel: 2, - }, - ], - }, - ], - }, - { - organizationName: "สำนักปลัดกรุงเทพมหานคร", - organizationId: "3b86d275-8259-427c-8da7-12813fe482ec", - organizationLevel: 0, - }, - ]; - - // expanded จาก id ได้ - expanded.value = [ - "3b86d275-8259-427c-8da7-12813fe482eb", - "3486d275-8259-437c-8da7-12813fe482eb", - ]; - - return node.organizationName && node.organizationName.indexOf(filter) > -1; -}; - const updateSelected = (target: any) => { console.log("updateSelected===>", target); }; -const onLazyLoad = (details: { node: any; key: any; done: any; fail: any }) => { - // console.log(details.node); - // details.node = nodes.value.filter((e:any) => e.orgRootId === ) - // if (details.node.orgRootId == "00000000-0000-0000-0000-000000000000") { - // details.done([ - // { - // organizationName: "กองบริหารทั่วไป", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx11", - // organizationLevel: 1, - // organizationNo: "00011", - // }, - // { - // organizationName: "กองสรรหาบุคคล", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx12", - // organizationLevel: 1, - // organizationNo: "00011", - // }, - // { - // organizationName: "สถาบันพัฒนาทรัพยากรบุคคลกรุงเทพมหานคร", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx13", - // organizationLevel: 1, - // organizationNo: "00011", - // children: [ - // { - // organizationName: "ฝ่ายบริหารงานทั่วไป", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxx131", - // organizationLevel: 2, - // organizationNo: "00011", - // children: [ - // { - // organizationName: "กลุ่มงานวิเคราะห์การพัฒนาทรัพยากรบุคคล", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxx1311", - // organizationLevel: 3, - // }, - // ], - // }, - // { - // organizationName: "ส่วนส่งเสริมการพัฒนาทรัพยากรบุคคล", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx14", - // organizationLevel: 2, - // }, - // ], - // }, - // ]); - // } else if ( - // details.node.organizationId == "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx02" - // ) { - // details.done([ - // { - // organizationName: "สำนักงานการเจ้าหน้าที่", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx21", - // organizationLevel: 1, - // }, - // ]); - // } - // }, 500); -}; - const breakLoop = ref(false); -async function edit(selected: string) { - console.log("edit node tree id: " + selected); +async function edit(id: string, type: string, data: any) { + const data2 = { + orgName: data[`org${type}Name`], + orgShortName: data[`org${type}ShortName`], + orgCode: data[`org${type}Code`], + orgPhoneEx: data[`org${type}PhoneEx`], + orgPhoneIn: data[`org${type}PhoneIn`], + orgFax: data[`org${type}Fax`], + orgLevel: data[`org${type}Rank`], + }; + breakLoop.value = false; // Usage - const targetNodeId = selected; + const targetNodeId = id; const replacementNode = { - organizationName: `ชื่อใหม่ ${selected}`, - organizationId: selected, + orgTreeName: data2.orgName, + orgTreeShortName: data2.orgShortName, + orgCode: data2.orgCode, + orgTreePhoneEx: data2.orgPhoneEx, + orgTreePhoneIn: data2.orgPhoneIn, + orgTreeFax: data2.orgFax, + orgTreeRank: data2.orgLevel, }; for (let index = 0; index < nodes.value.length; index++) { const element = nodes.value[index]; - searchAndReplace(element, targetNodeId, replacementNode); + if (type !== "edit") { + searchAndReplace(element, targetNodeId, replacementNode); + } else deleteNode(element, targetNodeId); + console.log("index===>", index); console.log("breakLoop===>", breakLoop.value); if (breakLoop.value) break; @@ -226,10 +132,10 @@ async function edit(selected: string) { function searchAndReplace( treeNode: any, - organizationId: any, + organizationId: string, replacementObject: any ) { - if (treeNode.organizationId === organizationId) { + if (treeNode.orgTreeId === organizationId) { Object.assign(treeNode, replacementObject); breakLoop.value = true; } else if (treeNode.children) { @@ -239,12 +145,35 @@ function searchAndReplace( } } +function deleteNode(treeNode: any, organizationId: any): boolean { + // console.log("tttttttttttttt", treeNode.orgTreeId, organizationId); + + if (treeNode.orgTreeId === organizationId) { + console.log(treeNode); + + // ลบ Node โดยการไม่ส่งผลลบ Node ทั้งหมดภายใต้ + treeNode.children = []; + + breakLoop.value = true; + } else if (treeNode.children) { + for (let i = 0; i < treeNode.children.length; i++) { + const child = treeNode.children[i]; + if (deleteNode(child, organizationId)) { + treeNode.children.splice(i, 1); + i--; // ลดค่า i เพราะที่ลบข้อมูล + } + } + } + + return false; +} + const dialogAgency = ref(false); const actionType = ref(""); const dataNode = ref(); const treeId = ref(""); -function onClickAgency(level: number, node: any) { +function onClickAgency(level: number, node: OrgTree | {}) { dialogAgency.value = !dialogAgency.value; orgLevel.value = level; dataNode.value = node; @@ -253,12 +182,13 @@ function onClickAgency(level: number, node: any) { const dialogDetail = ref(false); function onClickDetail(id: string, level: number) { + showLoader(); treeId.value = id; dialogDetail.value = !dialogDetail.value; orgLevel.value = level; } -async function onClickEdit(node: any) { +async function onClickEdit(node: OrgTree) { dialogAgency.value = !dialogAgency.value; actionType.value = "EDIT"; orgLevel.value = node.orgLevel; @@ -267,12 +197,15 @@ async function onClickEdit(node: any) { async function onClickDel(type: number, id: string) { const level = store.checkLevel(type); + dialogRemove($q, async () => { + // edit(id, "edit", {}); showLoader(); await http .delete(config.API.orgLevelByid(level.toLocaleLowerCase(), id)) .then(() => { success($q, "ลบข้อมูลสำเร็จ"); + // edit(id, "edit", {}); }) .catch((err) => { messageError($q, err); @@ -291,34 +224,7 @@ watch( } ); -onMounted(async () => { - // setTimeout(() => { - // console.log(nodessd.value); - // }, 200); - // nodes.value = [ - // { - // organizationName: "สำนักงานคณะกรรมการข้าราชการกรุงเทพมหานคร", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx01", - // organizationLevel: 0, - // lazy: true, - // }, - // { - // organizationName: "สำนักปลัดกรุงเทพมหานคร", - // organizationId: "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxx02", - // organizationLevel: 0, - // lazy: true, - // }, - // // { - // // organizationName: "data empty", - // // lazy: true, - // // }, - // // { - // // organizationName: "Node is not expandable", - // // expandable: false, - // // children: [{ organizationName: "Some node" }], - // // }, - // ]; -}); +onMounted(async () => {});