From 5f93eed344a797eb09018bb37df7d8ea0a1f1ec0 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期三, 14 十月 2020 13:55:48 +0800
Subject: [PATCH] 修复数据栈无法绘制区域的问题
---
src/pages/cameraAccess/index/VideoManage.vue | 19 +++++----
src/pages/cameraAccess/components/SeparateRules.vue | 83 +++++++++++++++++++++--------------------
2 files changed, 54 insertions(+), 48 deletions(-)
diff --git a/src/pages/cameraAccess/components/SeparateRules.vue b/src/pages/cameraAccess/components/SeparateRules.vue
index 6bce67a..b9802db 100644
--- a/src/pages/cameraAccess/components/SeparateRules.vue
+++ b/src/pages/cameraAccess/components/SeparateRules.vue
@@ -270,11 +270,11 @@
}
},
computed: {
- cameraType () {
+ cameraType() {
return this.TreeDataPool.treeActiveName === 'camera' ? "camera" : "dataStack"
}
},
- data () {
+ data() {
return {
mockSceneData: [],
loading: false,
@@ -321,21 +321,21 @@
stackFilesSize: 5,
};
},
- mounted () {
+ mounted() {
this.mockAsync();
this.PollData.statistics();
},
watch: {
'Camera.cameraId': {
- handler (n, o) {
+ handler(n, o) {
if (n) {
if (this.TreeDataPool.treeActiveName == "dataStack") {
this.stackFilesPage = 1;
this.stackFilesSize = 5;
this.stackId = n;
if (this.stackId) {
- console.log('getStackFiles')
+ // console.log('getStackFiles')
this.swipercanvasData = [];
this.getStackFiles()
}
@@ -345,15 +345,15 @@
}
},
methods: {
- prevClick () {
- console.log(this.swiperIndex)
- console.log(this.$refs.swiper.swiper.activeIndex)
+ prevClick() {
+ // console.log(this.swiperIndex)
+ // console.log(this.$refs.swiper.swiper.activeIndex)
if (this.swiperIndex == 0) {
- console.log('鏈鍒嗛〉鐨勭涓�鏉�')
+ // console.log('鏈鍒嗛〉鐨勭涓�鏉�')
//璇锋眰涓婁竴椤�
if (this.stackFilesPage > 1) {
this.stackFilesPage--;
- this.getStackFiles();
+ this.getStackFiles(true);
} else {
this.$message({
type: 'info',
@@ -363,17 +363,15 @@
}
},
- nextClick () {
- console.log(this.swiperIndex)
- console.log(this.$refs.swiper.swiper.activeIndex)
+ nextClick() {
if (this.swiperIndex == this.swipercanvasData.length - 1) {
- console.log('鏈�鍚庝竴寮�,鍔犺浇鏇村')
+ // console.log('鏈�鍚庝竴寮�,鍔犺浇鏇村')
//璇锋眰涓嬩竴椤�
this.stackFilesPage++;
- this.getStackFiles();
+ this.getStackFiles(true);
}
},
- getStackFiles () {
+ getStackFiles(onClick = false) {
this.getStackFileLoading = true;
let _this = this;
findAllFileByStackId({ name: '', stackId: this.stackId, page: this.stackFilesPage, size: this.stackFilesSize, type: 0 }).then(res => {
@@ -390,20 +388,19 @@
loading: false
}
});
- console.log(_this.swipercanvasData)
- console.log(this.swipercanvasData)
this.swiperIndex = 0;
this.$refs.swiper.swiper.activeIndex = 0;
} else {
- console.log(this.swipercanvasData)
- this.$message({
- type: 'info',
- message: '宸叉棤鏇村鏁版嵁!'
- });
+ if (onClick) {
+ this.$message({
+ type: 'warning',
+ message: '宸叉棤鏇村鏁版嵁!'
+ });
+ }
}
} else {
- console.log(this.swipercanvasData)
+ // console.log(this.swipercanvasData)
this.$message({
type: 'error',
message: '鏁版嵁璇锋眰澶辫触,璇风◢鍚庨噸璇�!'
@@ -411,14 +408,14 @@
}
this.getStackFileLoading = false;
}).catch(e => {
- console.log(e);
+ // console.log(e);
this.getStackFileLoading = false;
});
},
- swiperSlideChange () {
+ swiperSlideChange() {
this.swiperIndex = this.$refs.swiper.swiper.activeIndex;
},
- mockAsync () {
+ mockAsync() {
setTimeout(() => {
this.mockSceneData = [
{ scenename: "name1", id: 1, icon: ["iconrenlianjiance", "icongetijingzhi"] },
@@ -444,10 +441,16 @@
];
}, 3000)
},
- drawBaseImg () {
- this.$refs.canvas.showModal();
+ drawBaseImg() {
+ if (Array.isArray(this.$refs.canvas)) {
+ if (this.$refs.canvas.length > 0) {
+ this.$refs.canvas[0].showModal();
+ }
+ } else {
+ this.$refs.canvas.showModal();
+ }
},
- getCanvasData (data) {
+ getCanvasData(data) {
let polyon = { ...data };
polyon.camera_id = this.Camera.cameraId;
savePolygon(polyon).then(rsp => {
@@ -455,11 +458,11 @@
this.Camera.getCameraTask();
});
},
- refresh (url) {
+ refresh(url) {
this.Camera.baseImg = url
},
// 鍒濆鍖栨憚鍍忔満淇℃伅锛岀埗缁勪欢璋冪敤
- async initCameraData (id) {
+ async initCameraData(id) {
this.Camera = new VideoRuleData();
if (id && id !== "") {
@@ -480,7 +483,7 @@
},
- saveSceneRule (groupRule) {
+ saveSceneRule(groupRule) {
const payload = { ...groupRule }
payload.cameraIds = [this.Camera.cameraId];
let _this = this;
@@ -498,15 +501,15 @@
}
});
},
- delScenRule () {
+ delScenRule() {
this.Camera.update();
},
- changeLoading (params) {
+ changeLoading(params) {
this.loading = params
// console.log(this.loading,'changeLoading',params)
},
//鏄惁杩涜瑙嗛鍒嗘瀽澶勭悊
- pollEnable (row) {
+ pollEnable(row) {
let val = 0
if (row) {
if (this.PollData.RealTimeSum < this.PollData.channelTotal) {
@@ -542,7 +545,7 @@
this.PollData.statisticTaskInfo();
},
//瀹炴椂銆佽疆璇㈠垏鎹�
- changePoll (row) {
+ changePoll(row) {
//鍒ゆ柇鏄柊澧炶繕鏄洿鏂�
if (this.Camera.cameraId && this.Camera.cameraId !== undefined) {
if (this.PollData.RealTimeSum < this.PollData.channelTotal) {
@@ -591,7 +594,7 @@
}
},
//澶嶅埗
- ctrlC () {
+ ctrlC() {
this.TreeDataPool.ctrlCameraId = this.Camera.cameraId;
this.TreeDataPool.ctrlCameraName = this.Camera.cameraName;
this.$notify({
@@ -599,7 +602,7 @@
message: "澶嶅埗绠楁硶鎴愬姛锛�"
})
},
- ctrlV () {
+ ctrlV() {
if (this.Camera.cameraId === this.TreeDataPool.ctrlCameraId) {
this.$notify({
type: "warning",
@@ -1023,7 +1026,7 @@
}
}
.el-loading-spinner {
- background: url('/images/cameraAccess/loading.gif') no-repeat;
+ background: url("/images/cameraAccess/loading.gif") no-repeat;
top: 50%;
margin-top: -21px;
width: calc(100% - 260px) !important;
diff --git a/src/pages/cameraAccess/index/VideoManage.vue b/src/pages/cameraAccess/index/VideoManage.vue
index 0788cb0..5e2ba7e 100644
--- a/src/pages/cameraAccess/index/VideoManage.vue
+++ b/src/pages/cameraAccess/index/VideoManage.vue
@@ -1,6 +1,12 @@
<template>
<div class="s-video-manage">
- <el-tabs class="video-tab" ref="topTab" v-model="activeName" type="border-card" @tab-click="handleClick">
+ <el-tabs
+ class="video-tab"
+ ref="topTab"
+ v-model="activeName"
+ type="border-card"
+ @tab-click="handleClick"
+ >
<el-tab-pane
:label="firstLabeName"
name="camera-info"
@@ -108,14 +114,11 @@
},
"DataStackPool.selectedDir": {
handler(node, oldNode) {
- console.log(this.activeName)
- console.log(node, '鍕鹃�夋湰鍦拌棰�')
if (this.TreeDataPool.treeActiveName !== 'dataStack') {
return
}
this.$nextTick(() => {
if (this.activeName == "camera-info") {
- console.log("dataStackInfo.selectDir(node)")
this.$refs.dataStackInfo.selectDir(node);
} else if (this.activeName == "separate-rule" && node.length !== 0) {
this.$refs.sepRule.initCameraData(node.id);
@@ -124,7 +127,7 @@
},
deep: true
},
-
+
},
created() {
if (this.TreeDataPool.treeActiveName == 'camera') {
@@ -230,7 +233,7 @@
<style lang="scss">
.s-video-manage {
width: 100%;
- min-width:1599px;
+ min-width: 1599px;
height: 100%;
float: left;
box-sizing: border-box;
@@ -250,8 +253,8 @@
.el-tabs--border-card {
height: 100%;
width: 100%;
- &.video-tab{
- &>.el-tabs__header{
+ &.video-tab {
+ & > .el-tabs__header {
//position: fixed;
//position: absolute;
//top:0;
--
Gitblit v1.8.0