| | |
| | | <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="{ title, parentId, entity, key:treeKey,equipmentId}"> |
| | | <template slot="title" slot-scope="{ title, parentId, entity, key:treeKey,equipmentId,type}"> |
| | | <DeviceStructureTreeContextMenu ref="contextMenuRef" |
| | | :treeParams="{title,treeKey,searchValue,equipmentId,entity}"/> |
| | | :treeParams="{title,treeKey,searchValue,equipmentId,entity,type,param:currentDeviceDocClassCode}"/> |
| | | </template> |
| | | |
| | | <a-icon slot="switcherIcon" type="down"/> |
| | |
| | | </div> |
| | | </div> |
| | | </a-spin> |
| | | |
| | | <!--权限配置弹窗--> |
| | | <AssignPermissionModal :currentTreeNodeInfo="rightClickSelected" @submitSuccess="getTreeDataByApi"/> |
| | | </a-card> |
| | | </template> |
| | | |
| | |
| | | import { mapActions } from 'vuex' |
| | | import { deleteAction } from '@/api/manage' |
| | | import DeviceStructureTreeContextMenu from './DeviceStructureTreeContextMenu' |
| | | import AssignPermissionModal from './Permission/AssignPermissionModal' |
| | | |
| | | export default { |
| | | name: 'DeviceStructureTree', |
| | | components: { |
| | | AssignPermissionModal, |
| | | DeviceStructureTreeContextMenu |
| | | }, |
| | | data() { |
| | |
| | | allTreeKeys: [], |
| | | currentSelected: {}, |
| | | rightClickSelected: {}, |
| | | currentDeviceDocClassCode: 'SEND', |
| | | url: { |
| | | delete: '/nc/product/delete' |
| | | } |
| | |
| | | created() { |
| | | this.getTreeDataByApi() |
| | | this.$bus.$on('treeMenuItemMethodTrigger', this.triggerCorrespondingMethod) |
| | | this.$bus.$on('handleSwitchDeviceDocClassCode', this.setCurrentDeviceDocClassCode) |
| | | }, |
| | | methods: { |
| | | ...mapActions(['QueryProduction']), |
| | |
| | | }) |
| | | }, |
| | | |
| | | setCurrentDeviceDocClassCode(documentActiveTabKey) { |
| | | if (documentActiveTabKey === 1) this.currentDeviceDocClassCode = 'SEND' |
| | | else this.currentDeviceDocClassCode = 'REC' |
| | | }, |
| | | |
| | | /** |
| | | * 树节点选中时触发 |
| | | * @param selectedKeys 选中节点key |
| | |
| | | */ |
| | | handleTreeRightClick({ event, node }) { |
| | | const record = node.dataRef |
| | | // 若右键时当前右侧展示层级为设备层级且当前右键树层级同为设备层级时则在触发右键菜单功能时同时触发左键选中功能 |
| | | if (this.currentSelected.type === 2 && record.type === 2) this.handleTreeSelect([record.key], { node }) |
| | | this.rightClickSelected = Object.assign({}, record) |
| | | }, |
| | | |
| | | // 树节点右键单击菜单中删除按钮时触发 |
| | | handleDelete() { |
| | | this.$confirm({ |
| | | title: '提示', |
| | | content: '确认删除此条记录吗?', |
| | | okText: '确认', |
| | | okType: 'danger', |
| | | cancelText: '取消', |
| | | onOk: () => { |
| | | console.log('this.rightClickSelected.id', this.rightClickSelected.id) |
| | | if (!this.url.delete) { |
| | | this.$message.error('请设置url.delete属性!') |
| | | return |
| | | } |
| | | const that = this |
| | | deleteAction(that.url.delete, { id: this.rightClickSelected.id }) |
| | | .then((res) => { |
| | | if (res.success) { |
| | | that.getTreeDataByApi() |
| | | that.$notification.success({ |
| | | message: '消息', |
| | | description: res.message |
| | | }) |
| | | } else { |
| | | that.$notification.warning({ |
| | | message: '消息', |
| | | description: res.message |
| | | }) |
| | | } |
| | | }) |
| | | } |
| | | }) |
| | | }, |
| | | |
| | | /** |
| | | * 自动展开添加下级节点的父节点 |
| | | */ |
| | | modalFormSubmitSuccess(isAddNextLevel) { |
| | | // 判断是否为添加下级并且判断父节点是否展开 |
| | | if (isAddNextLevel && !this.expandedKeys.includes(this.rightClickSelected.id)) this.expandedKeys.push(this.rightClickSelected.id) |
| | | this.getTreeDataByApi() |
| | | }, |
| | | |
| | | /** |