XW-AIOT/wvp-platform
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

优化国标树型展示

Browse Source
This commit is contained in:
648540858
2022-07-03 07:40:54 +08:00
parent 0da452293f
commit f5fcc79a2c
29 changed files with 1341 additions and 537 deletions
Download Patch File Download Diff File Expand all files Collapse all files

141
web_src/src/components/common/DeviceTree.vue
View File

@@ -4,7 +4,7 @@
<el-header>设备列表</el-header>
<el-main style="background-color: #ffffff;">
<div class="device-tree-main-box">
<el-tree :props="defaultProps" :load="loadNode" lazy @node-click="handleNodeClick"@node-contextmenu="handleContextMenu" style="min-width: 100%; display:inline-block !important;">
<el-tree ref="gdTree" :props="defaultProps" :load="loadNode" lazy @node-click="handleNodeClick"@node-contextmenu="handleContextMenu" node-key="id" style="min-width: 100%; display:inline-block !important;">
<span class="custom-tree-node" slot-scope="{ node, data }" style="width: 100%">
<span v-if="node.data.type === 0 && node.data.online" title="在线设备" class="device-online iconfont icon-jiedianleizhukongzhongxin2"></span>
<span v-if="node.data.type === 0 && !node.data.online " title="离线设备" class="device-offline iconfont icon-jiedianleizhukongzhongxin2"></span>
@@ -47,98 +47,112 @@ export default {
}
};
},
props: ['clickEvent', 'contextMenuEvent'],
props: ['device', 'onlyCatalog', 'clickEvent', 'contextMenuEvent'],
methods: {
handleNodeClick(data,node,element) {
console.log("点击事件")
console.log(data)
let deviceNode = this.$refs.gdTree.getNode(data.userData.deviceId)
if(typeof (this.clickEvent) == "function") {
this.clickEvent(data.userData)
this.clickEvent(deviceNode.data.userData, data.userData, data.type === 2)
}
},
handleContextMenu(event,data,node,element) {
console.log("右键点击事件")
let deviceNode = this.$refs.gdTree.getNode(data.userData.deviceId)
if(typeof (this.contextMenuEvent) == "function") {
this.contextMenuEvent(event, data.userData)
this.contextMenuEvent(deviceNode.data.userData, event, data.userData, data.type === 2)
}
},
loadNode: function(node, resolve){
console.log(this.device)
if (node.level === 0) {
this.deviceService.getAllDeviceList((data)=>{
console.log(data)
if (data.length > 0) {
let nodeList = []
for (let i = 0; i < data.length; i++) {
console.log(data[i].name)
let node = {
name: data[i].name || data[i].deviceId,
isLeaf: false,
id: data[i].deviceId,
type: data[i].online,
online: data[i].online === 1,
userData: data[i]
}
nodeList.push(node);
}
resolve(nodeList)
}else {
resolve([])
if (this.device) {
let node = {
name: this.device.name || this.device.deviceId,
isLeaf: false,
id: this.device.deviceId,
type: this.device.online,
online: this.device.online === 1,
userData: this.device
}
}, (list)=>{
resolve([node])
}else {
this.deviceService.getAllDeviceList((data)=>{
console.log(data)
if (data.length > 0) {
let nodeList = []
for (let i = 0; i < data.length; i++) {
console.log(data[i].name)
let node = {
name: data[i].name || data[i].deviceId,
isLeaf: false,
id: data[i].deviceId,
type: data[i].online,
online: data[i].online === 1,
userData: data[i]
}
nodeList.push(node);
}
resolve(nodeList)
}else {
resolve([])
}
}, (list)=>{
console.log("设备加载完成")
}, (error)=>{
}, (error)=>{
})
}
if (node.level === 1) {
})
}
}else {
let channelArray = []
this.deviceService.getAllChannel(true, true, node.data.id, catalogData =>{
this.deviceService.getTree(node.data.userData.deviceId, node.data.id, this.onlyCatalog, catalogData =>{
console.log(catalogData)
channelArray = channelArray.concat(catalogData)
this.channelDataHandler(channelArray, resolve)
},(endCatalogData) => {
this.deviceService.getAllChannel(false, true, node.data.id, channelData => {
channelArray = channelArray.concat(channelData)
this.channelDataHandler(channelArray, resolve)
}, endChannelList => {
})
})
}else if (node.level > 1){
let channelArray = []
this.deviceService.getAllSubChannel(true, node.data.deviceId, node.data.id, (catalogData)=>{
channelArray = channelArray.concat(catalogData)
this.channelDataHandler(channelArray, resolve)
}, (endCatalogData)=>{
this.deviceService.getAllSubChannel(false, node.data.deviceId, node.data.id, (channelData)=>{
channelArray = channelArray.concat(channelData)
this.channelDataHandler(channelArray, resolve)
})
})
}
},
channelDataHandler: function (data, resolve) {
if (data.length > 0) {
let nodeList = []
for (let i = 0; i < data.length; i++) {
for (let i = 0; i <data.length; i++) {
let item = data[i];
let type = 3;
if (data[i].subCount > 0 || data[i].parental === 1) {
if (item.id.length <= 10) {
type = 2;
}else if (data[i].ptztype === 1 ) { // 1-球机;2-半球;3-固定枪机;4-遥控枪机
type = 4;
}else if (data[i].ptztype === 2) {
type = 5;
}else if (data[i].ptztype === 3 || data[i].ptztype === 4) {
type = 6;
}else {
if (item.id.length > 14) {
let channelType = item.id.substring(10, 13)
console.log("channelType: " + channelType)
if (channelType === '215' || channelType === '216') {
type = 2;
}
console.log(type)
if (item.basicData.ptztype === 1 ) { // 1-球机;2-半球;3-固定枪机;4-遥控枪机
type = 4;
}else if (item.basicData.ptztype === 2) {
type = 5;
}else if (item.basicData.ptztype === 3 || item.basicData.ptztype === 4) {
type = 6;
}
}else {
if (item.basicData.subCount > 0 || item.basicData.parental === 1) {
type = 2;
}
}
}
let node = {
name: data[i].name || data[i].channelId,
isLeaf: data[i].subCount === 0,
id: data[i].channelId,
deviceId: data[i].deviceId,
name: item.name || item.basicData.channelId,
isLeaf: type !== 2,
id: item.id,
deviceId: item.deviceId,
type: type,
online: data[i].status === 1,
hasGPS: data[i].longitude*data[i].latitude !== 0,
userData: data[i]
online: item.basicData.status === 1,
hasGPS: item.basicData.longitude*item.basicData.latitude !== 0,
userData: item.basicData
}
nodeList.push(node);
}
@@ -146,6 +160,9 @@ export default {
}else {
resolve([])
}
},
reset: function (){
this.$forceUpdate();
}
},
destroyed() {