From f5fcc79a2c7e6379a73b14ba4e366ad1654e9475 Mon Sep 17 00:00:00 2001
From: 648540858 <648540858@qq.com>
Date: 星期日, 03 七月 2022 07:40:54 +0800
Subject: [PATCH] 优化国标树型展示
---
web_src/src/components/common/DeviceTree.vue | 141 ++++++++++++++++++++++++++--------------------
1 files changed, 79 insertions(+), 62 deletions(-)
diff --git a/web_src/src/components/common/DeviceTree.vue b/web_src/src/components/common/DeviceTree.vue
index 73618cc..c701bf0 100644
--- a/web_src/src/components/common/DeviceTree.vue
+++ b/web_src/src/components/common/DeviceTree.vue
@@ -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 @@
}
};
},
- 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 @@
}else {
resolve([])
}
+ },
+ reset: function (){
+ this.$forceUpdate();
}
},
destroyed() {
--
Gitblit v1.8.0