From f20a554bdb24e9dfde9dc6a69d78595944f61d15 Mon Sep 17 00:00:00 2001 From: mark <mark18340872469@163.com> Date: 星期二, 25 十月 2022 14:53:57 +0800 Subject: [PATCH] 设备管理 样式调整 --- src/views/hashrate/CameraManage/index.vue | 114 ++++++++++++++++++++++++++++++++++++++++++++------------ 1 files changed, 89 insertions(+), 25 deletions(-) diff --git a/src/views/hashrate/CameraManage/index.vue b/src/views/hashrate/CameraManage/index.vue index 61cc152..b738df9 100644 --- a/src/views/hashrate/CameraManage/index.vue +++ b/src/views/hashrate/CameraManage/index.vue @@ -2,7 +2,7 @@ <div class="CameraManage"> <div class="cluster"> <div class="title">闆嗙兢閫夋嫨</div> - <el-select v-model="cluster" placeholder="璇烽�夋嫨"> + <el-select v-model="cluster" placeholder="璇烽�夋嫨" @change="selectCluster"> <el-option v-for="item in clusterArr" :key="item.value" @@ -51,6 +51,8 @@ import CameraRules from "./CameraRules"; import VideoRuleData from "@/Pool/VideoRuleData"; +import { getClusterDevList } from "@/api/clusterManage"; + import bus from "@/plugin/bus"; export default { components: { @@ -62,17 +64,9 @@ data() { return { activeTab: "淇℃伅缁存姢", - clusterArr: [ - { - value: 0, - label: "闆嗙兢涓�", - }, - { - value: 1, - label: "闆嗙兢浜�", - }, - ], + clusterArr: [], cluster: "", + clusterData: [], intervalTimer: null, leftWith: 0, screenHeight: 0, @@ -84,31 +78,45 @@ }, watch: { - "TreeDataPool.selectedNode": function (node) { - if (this.TreeDataPool.multiple) { - return; - } - + "TreeDataPool.activeNode": function (node) { + sessionStorage.setItem("cameraDevId", node.devId); if (this.activeTab == "淇℃伅缁存姢") { if (this.TreeDataPool.treeActiveName == "camera") { this.$refs.cameraInfo.selectCamera(node); } } else if (this.activeTab === "鍦烘櫙閰嶇疆") { this.$refs.sepRule.initCameraData(node.id); + if (!this.TreeDataPool.multiple) { + this.$refs.sepRule.showRules(node.id); + } } }, "TreeDataPool.selectedNodes": { - handler(nodes) { + handler(nodes, oldVal) { if (this.activeTab == "鍦烘櫙閰嶇疆") { // this.$refs.sepRule.initCameraData(nodes[nodes.length - 1]); let CameraArr = []; + let CameraIds = []; nodes.forEach((id) => { let newCamera = new VideoRuleData(id); CameraArr.push(newCamera); + CameraIds.push(id); }); this.$refs.sepRule.Carmeras = CameraArr; + if ( + nodes.length == 1 && + oldVal.length == 1 && + nodes[0] == oldVal[0] + ) { + return; + } + if (this.TreeDataPool.multiple && oldVal[0]) { + this.$refs.sepRule.showRules(CameraIds); + } + + console.log(CameraArr); } }, deep: true, @@ -130,7 +138,7 @@ }, }, created() { - this.PollData.statistics(); + this.getCluster(); this.TreeDataPool.readonly = false; // this.TreeDataPool.readonly = true; @@ -138,9 +146,10 @@ this.TreeDataPool.multiple = false; this.TreeDataPool.selectedNode = ""; this.selectedNodes = []; - this.VideoManageData.init(); }, beforeDestroy() { + sessionStorage.removeItem("devId"); + sessionStorage.removeItem("clusterId"); clearInterval(this.intervalTimer); //this.TreeDataPool.treeActiveName = "camera"; }, @@ -154,12 +163,6 @@ }); this.TreeDataPool.clean(); }); - - let _this = this; - _this.PollData.statisticTaskInfo(); - this.intervalTimer = setInterval(() => { - _this.PollData.statisticTaskInfo(); - }, 10000); }, methods: { handAddDevice(node) { @@ -189,11 +192,72 @@ } else if (tab === "鍦烘櫙閰嶇疆") { if (this.TreeDataPool.treeActiveName == "camera") { this.$refs.sepRule.initCameraData(this.TreeDataPool.selectedNode.id); + this.$refs.sepRule.showRules(this.TreeDataPool.selectedNode.id); } else if (this.TreeDataPool.treeActiveName == "dataStack") { this.$refs.sepRule.initCameraData(this.DataStackPool.selectedDir.id); } } }, + async getCluster() { + const res = await getClusterDevList(); + if (res && res.success) { + this.clusterData = res.data.clusterList; + if (res.data.clusterList <= 0 && res.data.devList <= 0) { + this.$confirm( + "绯荤粺妫�娴嬪埌鎮ㄨ繕鏈坊鍔犺澶�, 璇峰湪璁惧绠$悊椤甸潰缁存姢", + "鎻愮ず", + { + confirmButtonText: "璺宠浆", + cancelButtonText: "鍙栨秷", + type: "warning", + } + ) + .then(() => { + this.$router.push("/manageCenter"); + }) + .catch(() => {}); + } + + res.data.clusterList.forEach((item) => { + this.clusterArr.push({ + label: item.cluster_name, + value: "0$$" + item.cluster_id, + }); + }); + + res.data.devList.forEach((item) => { + this.clusterArr.push({ + label: item.devName, + value: "1$$" + item.devId, + }); + }); + + this.cluster = this.clusterArr[0].value; + this.selectCluster(this.clusterArr[0].value); + } + }, + selectCluster(val) { + const arr = val.split("$$"); + if (arr[0] == "0") { + sessionStorage.setItem("clusterId", arr[1]); + sessionStorage.setItem("devId", ""); + console.log(this.clusterData); + this.clusterData.forEach((item) => { + if (arr[1] == item.cluster_id) { + sessionStorage.setItem("nodeId", item.nodeList[0].devId); + } + }); + } + if (arr[0] == "1") { + sessionStorage.setItem("clusterId", ""); + sessionStorage.setItem("devId", arr[1]); + sessionStorage.setItem("nodeId", arr[1]); + } + this.TreeDataPool.fetchTreeData(); + this.PollData.statisticTaskInfo(); + this.VideoManageData.init(); + this.PollData.statistics(); + }, }, }; </script> -- Gitblit v1.8.0