<template>
|
<a-layout>
|
<a-layout-sider style='background: #fff;overflow: auto' width='300'>
|
<a-tree :expandedKeys.sync='expandedKeys' :tree-data='treeData' default-expand-all show-icon
|
style='height: 50' @expand='expand' @select='onSelect'>
|
<template #title='{ key: treeKey, title }'>
|
<a-dropdown :trigger="['contextmenu']">
|
<span>{{ title }}</span>
|
<template #overlay>
|
<a-menu @click='({ key: menuKey }) => addProjectModal(treeKey, menuKey)'>
|
<a-menu-item v-if='treeKey === "0"' key='1'>新增项目</a-menu-item>
|
<a-menu-item v-if='treeKey.substr(0, 2) === "xm"' key='2'>编辑</a-menu-item>
|
<a-menu-item v-if='treeKey.substr(0, 2) === "xm"' key='1'>删除</a-menu-item>
|
</a-menu>
|
</template>
|
</a-dropdown>
|
</template>
|
<a-icon slot='switcherIcon' type='down' />
|
<a-icon slot='iot' type="home" theme="filled" :style="{ color: 'rgb(24, 144, 255)' }" />
|
<a-icon slot='classify' type='folder' theme="filled" :style="{ color: 'rgb(24, 144, 255)' }" />
|
<a-icon slot='project' type="cloud" theme="filled" :style="{ color: 'rgb(24, 144, 255)' }"/>
|
<a-icon slot='empty' type='code-sandbox-square' theme="filled" :style="{ color: 'rgb(24, 144, 255)' }" />
|
<a-icon slot='solid' type='instagram' theme="filled" :style="{ color: 'rgb(24, 144, 255)' }" />
|
<a-icon slot='equipment' type='sliders' :style="{ color: 'rgb(24, 144, 255)' }" />
|
<a-icon slot='group' type='file-text' :style="{ color: 'rgb(24, 144, 255)' }" />
|
</a-tree>
|
</a-layout-sider>
|
|
<a-layout style='padding: 0 0 0 1px'>
|
<a-layout :style="{ background: '#fff', padding: '1px'}">
|
<index-bdc v-if='indexStyle===0' />
|
<server v-if='indexStyle===1' ref='server' :project-id='projectId' @tree='tree' />
|
<equipment v-if='indexStyle===2' ref='equipment' :server-id='serverId' @tree='tree' />
|
<solid-equipment v-if='indexStyle===3' ref='equipment' :server-id='serverId' @tree='tree' />
|
<empty-equipment v-if='indexStyle===4' ref='equipment' :server-id='serverId' @tree='tree' />
|
<parameter-group v-if='indexStyle===5' ref='equipment' :server-id='serverId' @tree='tree' />
|
<solid-parameter v-if='indexStyle===6' ref='equipment' :server-id='serverId' @tree='tree' />
|
<empty-parameter v-if='indexStyle===7' ref='equipment' :server-id='serverId' @tree='tree' />
|
</a-layout>
|
</a-layout>
|
<project-modal ref='projectModal' @ok='modalFormTree'></project-modal>
|
</a-layout>
|
</template>
|
|
<script>
|
import IndexBdc from './IndexBdc'
|
import ProjectModal from './ProjectModal'
|
import Server from '../iot/server/Server'
|
import Equipment from '../iot/equipment/Equipment'
|
import SolidEquipment from '../iot/equipment/solid/SolidEquipment'
|
import SolidParameter from '../iot/equipment/solid/SolidParameter'
|
import EmptyParameter from '../iot/equipment/empty/EmptyParameter'
|
import EmptyEquipment from '../iot/equipment/empty/EmptyEquipment'
|
import ParameterGroup from '../iot/equipment/parameter/ParameterGroup'
|
import { deleteAction, getAction } from '@/api/manage'
|
|
export default {
|
name: 'Analysis',
|
components: {
|
SolidParameter,
|
ParameterGroup,
|
EmptyEquipment,
|
SolidEquipment,
|
EmptyParameter,
|
Equipment,
|
ProjectModal,
|
Server,
|
IndexBdc
|
},
|
data() {
|
return {
|
treeData1: [
|
{
|
title: 'parent 1',
|
key: '0-0',
|
slots: {
|
icon: 'smile'
|
},
|
children: [
|
{ title: 'leaf', key: '0-0-0', slots: { icon: 'meh' } },
|
{ title: 'leaf', key: '0-0-1', scopedSlots: { icon: 'custom' } }
|
]
|
}
|
],
|
projectId: '',
|
serverId: '',
|
indexStyle: 0,
|
treeData: [],
|
expandedKeys: [],
|
selectedKeys: [],
|
currentSelectedKeys: [],
|
url: {
|
tree: '/projectClassify/tree',
|
queryByProjectCode: '/projectClassify/queryByProjectCode',
|
queryByServe: '/serve/deploy/queryByProjectCode',
|
delete: '/projectClassify/delete'
|
}
|
}
|
},
|
methods: {
|
modalFormTree(val) {
|
this.tree()
|
},
|
generateList(data) {
|
for (let i = 0; i < data.length; i++) {
|
const node = data[i]
|
const key = node.key
|
this.expandedKeys.push(key)
|
if (node.children) {
|
this.generateList(node.children)
|
}
|
}
|
},
|
addProjectModal(treeKey, menuKey) {
|
if (treeKey.substr(0, 2) === 'xm' && menuKey ==='1') {
|
if (!this.url.delete) {
|
this.$message.error('请设置url.delete属性!')
|
return
|
}
|
var that = this
|
deleteAction(that.url.delete, { id: treeKey }).then((res) => {
|
if (res.success) {
|
that.$message.success(res.message)
|
this.tree()
|
} else {
|
that.$message.warning(res.message)
|
}
|
})
|
}
|
if (treeKey.substr(0, 2) === 'xm' && menuKey ==='2') {
|
// 查询项目
|
getAction(this.url.queryByProjectCode, { projectCode: treeKey }).then((res) => {
|
if (res.success) {
|
this.$refs.projectModal.edit(res.result)
|
this.$refs.projectModal.title = '编辑项目'
|
}
|
})
|
|
} else {
|
this.$refs.projectModal.add()
|
this.$refs.projectModal.title = '新增项目'
|
}
|
},
|
onSelect(selectedKeys, info) {
|
if (selectedKeys.length === 0) {
|
return
|
}
|
this.currentSelectedKeys = selectedKeys
|
switch (selectedKeys[0].split('_')[0]) {
|
case 'xm':
|
// 查询id
|
getAction(this.url.queryByProjectCode, { projectCode: selectedKeys[0] }).then((res) => {
|
if (res.success) {
|
this.projectId = res.result.id
|
this.indexStyle = 1
|
}
|
})
|
break
|
case 'fwq':
|
getAction(this.url.queryByServe, { projectCode: selectedKeys[0].split('_')[1] }).then((res) => {
|
if (res.success) {
|
this.serverId = res.result.id
|
this.indexStyle = 2
|
}
|
})
|
break
|
case 'solid':
|
// 实设备
|
getAction(this.url.queryByServe, { projectCode: selectedKeys[0].split('_')[1] }).then((res) => {
|
if (res.success) {
|
this.serverId = res.result.id
|
this.indexStyle = 3
|
}
|
})
|
break
|
case 'empty':
|
// 虚设备
|
getAction(this.url.queryByServe, { projectCode: selectedKeys[0].split('_')[1] }).then((res) => {
|
if (res.success) {
|
this.serverId = res.result.id
|
this.indexStyle = 4
|
}
|
})
|
break
|
case 'group':
|
// 参数组
|
this.serverId = selectedKeys[0].split('_')[1]
|
this.indexStyle = 5
|
break
|
case 'ssb':
|
this.serverId = selectedKeys[0].split('_')[1]
|
this.indexStyle = 6
|
break
|
case 'xxb':
|
this.serverId = selectedKeys[0].split('_')[1]
|
this.indexStyle = 7
|
break
|
default:
|
this.indexStyle = 0
|
}
|
},
|
tree() {
|
getAction(this.url.tree).then((res) => {
|
if (res.success) {
|
this.treeData = res.result
|
// this.generateList(this.treeData)
|
if (this.expandedKeys.length === 0) this.expandedKeys = [res.result[0].key, res.result[0].children[0].key, res.result[0].children[0].children[0].key]
|
}
|
})
|
},
|
expand(expandedKeys) {
|
this.expandedKeys = expandedKeys
|
}
|
},
|
created() {
|
this.tree()
|
}
|
}
|
</script>
|
<style>
|
</style>
|