From feb1bc83e9d2e2b57fef8bdafaa2e24a43fec96c Mon Sep 17 00:00:00 2001 From: liudong <liudong> Date: 星期五, 02 八月 2024 12:11:17 +0800 Subject: [PATCH] 解析块和解析方法的页面开发和功能开发 --- src/views/authority/users/index.vue | 227 ++++++++++++++++++++++++++++++++++++++++++++++++++++---- 1 files changed, 209 insertions(+), 18 deletions(-) diff --git a/src/views/authority/users/index.vue b/src/views/authority/users/index.vue index 097ab35..80bb673 100644 --- a/src/views/authority/users/index.vue +++ b/src/views/authority/users/index.vue @@ -79,7 +79,7 @@ </template> <template #dept="{ record }">{{ record.dept ? record.dept.deptName : "" }}</template> <template #status="{record}"> - <a-switch checked-value="0" unchecked-value="1" @change="statusChange(record.status,record)" + <a-switch checked-value="1" unchecked-value="0" @change="statusChange(record.status,record)" v-model="record.status" /> </template> <template #operations="{ record }"> @@ -149,40 +149,101 @@ </a-modal> <a-modal width="30%" v-model:visible="resourcevisible" title="鏉冮檺閰嶇疆" @cancel="handleCancel(3)" - @ok="editDeptHandleOk"> + @ok="editResourceHandleOk"> <div :style="{ display:'flex', 'flex-direction':'column' }"> <a-tabs :style="{ width: '100%',height: '500px', 'overflow-y': 'auto' }"> <a-tab-pane key="1"> <template #title> - <icon-calendar/> 鑿滃崟 + <icon-calendar /> + 鑿滃崟 </template> - Content of Tab Panel 1 + <a-tree + class="tree-demo" + v-model:checked-keys="checkedKeysMenu" + v-model:expanded-keys="expandKdysMenu" + :checkable="true" + :data="treeDataMenu" + :show-line="showLineMenu" + @check="onCheckMenu" + :fieldNames="{ + key:'menuId', + title:'menuName', + children:'children', + }" + :check-strictly="checkStrictlyMenu" + > + </a-tree> </a-tab-pane> <a-tab-pane key="2"> <template #title> - <icon-clock-circle/> 鐭ヨ瘑搴� + <icon-clock-circle /> + 鐭ヨ瘑搴� </template> - Content of Tab Panel 2 + <a-space direction="vertical" size="large"> + <a-checkbox-group v-model="checkedKeysKnowledge" direction="vertical" @change="onCheckKnowledge"> + <a-checkbox + v-for="(knowledg, index) of knowledgeList" + :value="knowledg.id" + :lable="knowledg.name" + @change="onCheckKnowledge" + > + {{ knowledg.name }} + </a-checkbox> + </a-checkbox-group> + </a-space> </a-tab-pane> <a-tab-pane key="3"> <template #title> - <icon-user/> 鏅鸿兘浣� + <icon-user /> + 鏅鸿兘浣� </template> - Content of Tab Panel 3 + <a-checkbox-group v-model="checkedKeysDialog" direction="vertical" @change="onCheckDialog"> + <a-checkbox + v-for="(dialog, index) of DialogsList" + :value="dialog.id" + :lable="dialog.name" + @change="onCheckDialog" + > + {{ dialog.name }} + </a-checkbox> + </a-checkbox-group> </a-tab-pane> </a-tabs> - <a-card :style="{ width: '100%',height: '200px', 'overflow-y': 'auto', margin:'1px'}" - class="card-demo" - title="鐢ㄦ埛鎵�鏈夋潈闄�" - hoverable + <a-card :style="{ width: '100%',height: '200px', 'overflow-y': 'auto', margin:'1px'}" + class="card-demo" + title="鐢ㄦ埛鎵�鏈夋潈闄�" + hoverable > <a-space wrap> + 鑿滃崟鍔熻兘锛� <a-tag - v-for="(tag, index) of checkResourceStrictly" - :key="tag.deptId" - @close="handleRemove(tag)" + v-for="(tag, index) of checkStrictlyMenu" + :key="tag.menuId" + @close="handleMenuRemove(tag)" > - {{ tag.deptName }} + {{ tag.menuName }} + </a-tag> + </a-space> + <a-divider /> + <a-space wrap> + 鐭ヨ瘑搴�: + <a-tag + v-for="(tag, index) of checkStrictlyKnowledge" + :key="tag.knowledgeId" + @close="handleKnowledgeRemove(tag)" + > + {{ tag.knowledgeName }} + </a-tag> + </a-space> + <a-divider /> + <a-space wrap> + 鏅鸿兘浣�: + <a-tag + v-for="(tag, index) of checkStrictlyDialog" + :key="tag.dialogId" + @close="handleDialogRemove(tag)" + > + {{ tag.dialogName }} </a-tag> </a-space> </a-card> @@ -199,7 +260,10 @@ import { Pagination } from "@/types/global"; import type { TableColumnData } from "@arco-design/web-vue/es/table/interface"; import { + DialogList, + KnowledgeList, OrganizationList, + ResourceList, User, UserAdd, UserChangePwd, @@ -215,7 +279,23 @@ let checkedKeys = ref([]); let expandKdys = ref([]); let checkStrictly = ref([]); -let checkResourceStrictly=ref([]) + + +let treeDataMenu = ref([]); +let checkedKeysMenu = ref([]); +let expandKdysMenu = ref([]); +let checkStrictlyMenu = ref([]); + +let checkedKeysKnowledge= ref([]); +let checkStrictlyKnowledge= ref([]); + +let checkedKeysDialog= ref([]); +let checkStrictlyDialog= ref([]); + +let knowledgeList = ref([]); +let DialogsList = ref([]); + + let menuTips = ref(["鏉冮檺绠$悊", "璐﹀彿"]); type SizeProps = "mini" | "small" | "medium" | "large"; const account = ref(null); @@ -262,9 +342,65 @@ } }; +const onCheckMenu = (newCheckedKeys, event) => { + let o = { "menuId": event.node.menuId, "menuName": event.node.menuName }; + if (event.checked) { + checkStrictlyMenu.value.push(o); + } else { + checkStrictlyMenu.value.forEach((val, idx, array) => { + // val: 褰撳墠鍊� + if (val.menuId == event.node.menuId) { + checkStrictlyMenu.value.splice(idx, 1); + return true; + } + }); + } +}; +const onCheckKnowledge = (newCheckedKeys, event) => { + let o = { "knowledgeId": event.target.value, "knowledgeName": event.target.labels[0].innerText }; + if (event.target.checked) { + checkStrictlyKnowledge.value.push(o); + } else { + checkStrictlyKnowledge.value.forEach((val, idx, array) => { + // val: 褰撳墠鍊� + if (val.knowledgeId == event.target.value) { + checkStrictlyKnowledge.value.splice(idx, 1); + return true; + } + }); + } +}; + + +const onCheckDialog = (newCheckedKeys, event) => { + let o = { "dialogId": event.target.value, "dialogName": event.target.labels[0].innerText }; + if (event.target.checked) { + checkStrictlyDialog.value.push(o); + } else { + checkStrictlyDialog.value.forEach((val, idx, array) => { + // val: 褰撳墠鍊� + if (val.dialogId == event.target.value) { + checkStrictlyDialog.value.splice(idx, 1); + return true; + } + }); + } +}; + const handleRemove = (key) => { checkStrictly.value = checkStrictly.value.filter((tag) => tag !== key); }; +const handleMenuRemove = (key) => { + checkStrictlyMenu.value = checkStrictlyMenu.value.filter((tag) => tag !== key); +}; +const handleKnowledgeRemove = (key) => { + checkStrictlyKnowledge.value = checkStrictlyKnowledge.value.filter((tag) => tag !== key); +}; +const handleDialogRemove = (key) => { + checkStrictlyDialog.value = checkStrictlyDialog.value.filter((tag) => tag !== key); +}; + + const basePagination: Pagination = { current: 1, pageSize: 20 @@ -352,6 +488,28 @@ }); }; +const editResourceHandleOk = async () => { + let resources: Array = [],dialogs: Array = [],Knowledges: Array = [], user: User = { "userId": selectUser.value.userId }; + checkStrictlyMenu.value.forEach((val) => { + resources.push(val.menuId); + }); + user.resources = resources; + + checkStrictlyKnowledge.value.forEach((val) => { + Knowledges.push(val.knowledgeId); + }); + user.knowledges = Knowledges; + + checkStrictlyDialog.value.forEach((val) => { + dialogs.push(val.dialogId); + }); + user.dialogs = dialogs; + + await UserEdit(user).then((res) => { + fetchData(); + }); +}; + const editHandleOk = async () => { if (editform.value.userId.length > 0) { await UserEdit({ @@ -414,7 +572,27 @@ //鏉冮檺 if (t == 4) { resourcevisible.value = true; - + checkedKeysMenu.value = []; + expandKdysMenu.value = []; + checkStrictlyMenu.value = []; + checkStrictlyKnowledge.value=[]; + checkedKeysKnowledge.value=[]; + checkStrictlyDialog.value=[]; + checkedKeysDialog.value=[]; + selectUser.value = record; + record.resources.forEach((val) => { + checkStrictlyMenu.value.push({ "menuId": val.menuId, "menuName": val.menuName }); + checkedKeysMenu.value.push(val.menuId); + expandKdysMenu.value.push(val.menuId); + }); + record.knowledges.forEach((val) => { + checkStrictlyKnowledge.value.push({ "knowledgeId": val.id, "knowledgeName": val.name }); + checkedKeysKnowledge.value.push(val.id); + }); + record.dialogs.forEach((val) => { + checkStrictlyDialog.value.push({ "dialogId": val.id, "dialogName": val.name }); + checkedKeysDialog.value.push(val.id); + }); } //鏈烘瀯 @@ -468,9 +646,22 @@ treeData.value = [...res.rows]; }); }; +const MenuData = async (key) => { + await ResourceList(key).then((res) => { + treeDataMenu.value = [...res.rows]; + }); +}; +KnowledgeList().then((res) => { + knowledgeList.value = res.rows; +}); + +DialogList().then((res) => { + DialogsList.value = res.rows; +}); fetchData(); OrganizationData(""); +MenuData(); const reset = () => { formModel.value = generateFormModel(); -- Gitblit v1.8.0