From dbb3445dc720a8f36b3424e73f2e02a6b0f9deb6 Mon Sep 17 00:00:00 2001 From: zhangherong <571457620@qq.com> Date: 星期日, 27 四月 2025 11:31:57 +0800 Subject: [PATCH] art: 从沃克项目迁移设备管理代码到航宇 --- src/views/dnc/base/modules/ProductStructure/ProductStructureTree.vue | 159 +++++++++++++++++++++++++++++++++++++++++----------- 1 files changed, 125 insertions(+), 34 deletions(-) diff --git a/src/views/dnc/base/modules/ProductStructure/ProductStructureTree.vue b/src/views/dnc/base/modules/ProductStructure/ProductStructureTree.vue index 97b73a0..a734005 100644 --- a/src/views/dnc/base/modules/ProductStructure/ProductStructureTree.vue +++ b/src/views/dnc/base/modules/ProductStructure/ProductStructureTree.vue @@ -1,35 +1,37 @@ <template> - <a-card class="tree_con" :loading="cardLoading" :bordered="false" @contextmenu.native="e=>e.preventDefault()"> + <a-card class="tree_con" :loading="cardLoading" :bordered="false" @contextmenu.native.stop="openBaseContextMenu"> <a-spin :spinning="loading"> <div style="display: flex;flex-direction: column;height: 100%"> - <div style="display: flex"> + <div style="display: flex;justify-content: space-between"> <a-input placeholder="杈撳叆鍏抽敭瀛楄繘琛屾悳绱�" allowClear v-model="searchInput" @change="handleSearchInputChange"/> - <a-dropdown :trigger="['click']" placement="bottomCenter" style="margin: 0 8px"> - <a-menu slot="overlay"> - <a-menu-item key="1" @click="expandedKeys = allTreeKeys">灞曞紑鎵�鏈�</a-menu-item> - <a-menu-item key="2" @click="expandedKeys = ['-1']">鍚堝苟鎵�鏈�</a-menu-item> - <a-menu-item key="3" @click="getTreeDataByApi">鍒锋柊</a-menu-item> - </a-menu> - <a-button> - <a-icon type="bars"/> - </a-button> - </a-dropdown> - <a-button type="primary" v-has="'product_add'" - @click="$refs.productModalFormRef.triggerCorrespondingMethod({modalTitle:'娣诲姞浜у搧',methodName:'handleProductAdd'})"> - <a-icon type="plus"></a-icon> - 浜у搧 - </a-button> + <!-- <a-tooltip title="鍒锋柊">--> + <!-- <a-button icon="reload" @click="handleTreeReload" style="width: 18%;margin-left: 8px"></a-button>--> + <!-- </a-tooltip>--> + <!-- <a-button type="primary" v-has="'product_add'" icon="plus" style="margin-left: 8px"--> + <!-- @click="$refs.productModalFormRef.triggerCorrespondingMethod({modalTitle:'娣诲姞浜у搧',methodName:'handleProductAdd'})">--> + <!-- 浜у搧--> + <!-- </a-button>--> + <!-- <a-dropdown :trigger="['click']" placement="bottomCenter" style="margin: 0 8px">--> + <!-- <a-menu slot="overlay">--> + <!-- <a-menu-item key="1" @click="expandedKeys = allTreeKeys">灞曞紑鎵�鏈�</a-menu-item>--> + <!-- <a-menu-item key="2" @click="expandedKeys = ['-1']">鍚堝苟鎵�鏈�</a-menu-item>--> + <!-- <a-menu-item key="3" @click="getTreeDataByApi">鍒锋柊</a-menu-item>--> + <!-- </a-menu>--> + <!-- <a-button>--> + <!-- <a-icon type="bars"/>--> + <!-- </a-button>--> + <!-- </a-dropdown>--> </div> <!--浜у搧缁撴瀯鏍�--> - <div style="flex: 1;overflow:auto;margin-top: 10px"> + <div id="tree-container" style="flex: 1;overflow:auto;margin-top: 10px"> <a-tree blockNode show-icon :expandedKeys.sync="expandedKeys" :selectedKeys="selectedKeys" :treeData="treeDataSource" :autoExpandParent="autoExpandParent" @select="handleTreeSelect" @expand="handleTreeExpand" @rightClick="handleTreeRightClick"> - <template slot="title" slot-scope="{ label, parentId, entity, key:treeKey,type}"> + <template slot="title" slot-scope="{ label, parentId, key:treeKey,type}"> <ProductStructureTreeContextMenu ref="contextMenuRef" - :treeParams="{label,treeKey,searchValue,type,entity}"/> + :treeParams="{label,treeKey,searchValue,type}"/> </template> <a-icon slot="switcherIcon" type="down"/> @@ -59,6 +61,10 @@ <ProcessStepModal :currentTreeNodeInfo="rightClickSelected" @submitSuccess="modalFormSubmitSuccess"/> <!--鏉冮檺閰嶇疆寮圭獥--> <AssignPermissionModal :currentTreeNodeInfo="rightClickSelected" @submitSuccess="modalFormSubmitSuccess"/> + <!--妫�绱㈢數瀛愭ā鏉垮脊绐�--> + <NcDocumentSearchModal :currentDocumentInfo="rightClickSelected" @submitSuccess="modalFormSubmitSuccess"/> + <!--浜у搧缁撴瀯鏍戝熀鏈彸閿彍鍗�(绌虹櫧澶勮Е鍙�)--> + <ProductStructureBaseContextMenu ref="baseContextmenuRef"/> </a-card> </template> @@ -73,10 +79,15 @@ import ProcessModal from './Process/ProcessModal' import ProcessStepModal from './ProcessStep/ProcessStepModal' import AssignPermissionModal from './Permission/AssignPermissionModal' +import DeviceCustomTypeModal from '@views/dnc/base/modules/ProductStructure/DeviceCustomType/DeviceCustomTypeModal.vue' +import ProductStructureBaseContextMenu from '@views/dnc/base/modules/ProductStructure/ProductStructureBaseContextMenu.vue' +import NcDocumentSearchModal from '@views/dnc/base/modules/ProductStructure/Document/NcDocumentSearchModal.vue' export default { name: 'ProductStructureTree', components: { + ProductStructureBaseContextMenu, + DeviceCustomTypeModal, AssignPermissionModal, ProcessStepModal, ProcessModal, @@ -84,7 +95,8 @@ PartModal, ComponentModal, ProductModal, - ProductStructureTreeContextMenu + ProductStructureTreeContextMenu, + NcDocumentSearchModal }, data() { return { @@ -100,7 +112,6 @@ autoExpandParent: true, checkStrictly: true, allTreeKeys: [], - currentSelected: {}, rightClickSelected: {}, url: { delete: '/nc/product/delete' @@ -111,14 +122,18 @@ this.getTreeDataByApi() this.$bus.$on('treeMenuItemMethodTrigger', this.triggerCorrespondingMethod) }, + beforeDestroy() { + this.$bus.$off('treeMenuItemMethodTrigger', this.triggerCorrespondingMethod) + }, methods: { + // 璋冪敤鎺ュ彛鑾峰彇鏍戠殑鏁版嵁 getTreeDataByApi() { this.loading = true this.cardLoading = true + this.treeDataSource = [] dncApi.getProductStructureTreeApi() .then(res => { if (res.success) { - console.log('res=================', res) this.dataList = [] this.allTreeKeys = [] this.treeDataSource = res.result @@ -140,22 +155,63 @@ * @param {node} node 鑺傜偣瀵硅薄 */ handleTreeSelect(selectedKeys, { node }) { + const that = this let record = node.dataRef - this.currentSelected = Object.assign({}, record) - // 鍚戝彸渚х埗绾х粍浠跺彂閫佸綋鍓嶉�変腑鏍戣妭鐐逛俊鎭� - this.$bus.$emit('sendCurrentTreeNodeInfo', this.currentSelected) + const { id, type } = record + dncApi.getProductStructureTreeNodeEntityApi({ id, type }) + .then(res => { + if (res.success) { + let currentSelectedNodeInfo + if (res.result.length > 0) { + currentSelectedNodeInfo = Object.assign({}, record, { entity: res.result[0] }) + } else { + currentSelectedNodeInfo = {} + that.$notification.warning({ + message: '娑堟伅', + description: '鏆傛棤璇ヨ妭鐐硅缁嗕俊鎭�' + }) + } + // 鍚戝彸渚х埗绾х粍浠跺彂閫佸綋鍓嶉�変腑鏍戣妭鐐逛俊鎭� + this.$bus.$emit('sendCurrentTreeNodeInfo', currentSelectedNodeInfo) + } else { + that.$notification.error({ + message: '娑堟伅', + description: res.message + }) + } + }) if (selectedKeys.length === 0) return this.selectedKeys = selectedKeys }, /** * 鏍戣妭鐐瑰彸閿崟鍑昏妭鐐规椂瑙﹀彂 - * @param event 浜嬩欢瀵硅薄 * @param node 鑺傜偣瀵硅薄 */ - handleTreeRightClick({ event, node }) { + handleTreeRightClick({ node }) { + if (this.$refs.baseContextmenuRef) this.$refs.baseContextmenuRef.menuVisible = false + const that = this const record = node.dataRef - this.rightClickSelected = Object.assign({}, record) + const { id, type } = record + dncApi.getProductStructureTreeNodeEntityApi({ id, type }) + .then(res => { + if (res.success) { + if (res.result.length > 0) { + that.rightClickSelected = Object.assign({}, record, { entity: res.result[0] }) + } else { + that.rightClickSelected = {} + that.$notification.warning({ + message: '娑堟伅', + description: '鏆傛棤璇ヨ妭鐐硅缁嗕俊鎭�' + }) + } + } else { + that.$notification.error({ + message: '娑堟伅', + description: res.message + }) + } + }) }, // 鏍戣妭鐐瑰彸閿崟鍑昏彍鍗曚腑鍒犻櫎鎸夐挳鏃惰Е鍙� @@ -200,6 +256,7 @@ /** * 鑷姩灞曞紑娣诲姞涓嬬骇鑺傜偣鐨勭埗鑺傜偣 + * @param isAddNextLevel 鏄惁闇�瑕佸睍寮�涓嬬骇 */ modalFormSubmitSuccess(isAddNextLevel) { // 鍒ゆ柇鏄惁涓烘坊鍔犱笅绾у苟涓斿垽鏂埗鑺傜偣鏄惁灞曞紑 @@ -216,8 +273,18 @@ this.autoExpandParent = false }, - /* 杈撳叆鏌ヨ鍐呭鍙樺寲鏃惰Е鍙� */ + // 杈撳叆鏌ヨ鍐呭鍙樺寲鏃惰Е鍙戯紙澧炲姞闃叉姈鏈哄埗锛� handleSearchInputChange() { + const that = this + let timer + if (timer) clearTimeout(timer) + timer = setTimeout(function() { + that.searchAndExpandTreeNode() // 鍔犲皬鎷彿璋冪敤鍑芥暟 + }, 1000) + }, + + // 闃叉姈鍑芥暟涓Е鍙戞悳绱㈠苟灞曞紑鏍戣妭鐐� + searchAndExpandTreeNode() { let search = this.searchInput let expandedKeys let autoExpandParent @@ -237,7 +304,6 @@ expandedKeys = this.beforeSearchExpandedKeys autoExpandParent = false } - Object.assign(this, { expandedKeys, searchValue: search, @@ -283,8 +349,17 @@ } }, - triggerCorrespondingMethod({ methodName }) { - if (this[methodName]) this[methodName]() + /** + * 鏍戞墍鍦ㄧ埗鍏冪礌鐨勫彸閿簨浠� + * @param event 浜嬩欢瀵硅薄 + */ + openBaseContextMenu(event) { + event.preventDefault() + if (event.target.id !== 'tree-container') return + this.$refs.baseContextmenuRef.menuStyle.top = event.clientY + 'px' + this.$refs.baseContextmenuRef.menuStyle.left = event.clientX + 'px' + this.$refs.baseContextmenuRef.menuVisible = true + document.body.addEventListener('click', this.handleBaseContextMenuClose) }, /** @@ -292,7 +367,7 @@ * @param treeNode */ setTreeNodeIcon(treeNode) { - switch (treeNode.type) { + switch (+treeNode.type) { case 1: treeNode.slots = { icon: 'product' } break @@ -313,7 +388,23 @@ break default: } + }, + + // 鎺у埗鍩虹鍙抽敭鑿滃崟鍏抽棴 + handleBaseContextMenuClose() { + this.$refs.baseContextmenuRef.menuVisible = false + document.body.removeEventListener('click', this.handleBaseContextMenuClose) + }, + + // 鍒锋柊閲嶆柊鑾峰彇鏍戠殑鏁版嵁 + handleTreeReload() { + this.getTreeDataByApi() + }, + + triggerCorrespondingMethod({ methodName }) { + if (this[methodName]) this[methodName]() } + } } </script> -- Gitblit v1.9.3