From 0175cda6150656bc74b34c6f6c71edd1e1fc653c Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@iotlink.com>
Date: 星期四, 04 二月 2021 18:22:54 +0800
Subject: [PATCH] treee, 修复tab切换时树的选中状态.添加区域
---
src/pages/cameraAccess/components/SeparateRules.vue | 161 +++++++++++++++++++++++++++--------------------------
1 files changed, 82 insertions(+), 79 deletions(-)
diff --git a/src/pages/cameraAccess/components/SeparateRules.vue b/src/pages/cameraAccess/components/SeparateRules.vue
index b176fa1..2260c2d 100644
--- a/src/pages/cameraAccess/components/SeparateRules.vue
+++ b/src/pages/cameraAccess/components/SeparateRules.vue
@@ -28,25 +28,13 @@
</div>
<div v-if="Camera.analytics" class="flex-box" v-show="cameraType === 'camera'">
- <span class="label">鍒嗚鲸鐜�</span>
- <el-select
- v-model="Camera.selectResolution"
- placeholder="璇烽�夋嫨"
- size="mini"
- style="width: 134px;
- margin-left:10px;"
- >
- <el-option
- v-for="item in Camera.resolutionOption"
- :key="item.value"
- :label="item.label"
- :value="item.value"
- ></el-option>
- </el-select>
+ <span
+ class="label"
+ >鍒嗚鲸鐜�: {{(Camera.camearInfo.resolution_width == 0 || Camera.camearInfo.resolution_height == 0) ? '鏈満鍒嗚鲸鐜�': `${Camera.camearInfo.resolution_width} * ${Camera.camearInfo.resolution_height}` }}</span>
</div>
<div v-if="Camera.analytics" class="flex-box">
- <span class="label">鏅鸿兘璁＄畻鑺傜偣: {{ Camera.runServerName}}</span>
+ <span class="label">SmartAI鑺傜偣: {{ Camera.runServerName}}</span>
</div>
<div v-if="Camera.analytics" class="flex-box">
@@ -144,7 +132,7 @@
></polygon-canvas>
</template>
<template v-else>
- <div style="width:100%" v-loading='getStackFileLoading'>
+ <div style="width:100%" v-loading="getStackFileLoading">
<swiper
ref="swiper"
:auto-update="true"
@@ -182,12 +170,20 @@
</div>
</swiper-slide>
</swiper>
- <div class="swiper-local-prev" v-show="swipercanvasData.length>1" @click="prevClick">
+ <div
+ class="swiper-local-prev"
+ v-show="swipercanvasData.length>1"
+ @click="prevClick"
+ >
<div class="icon-btn" slot="button-prev">
<i class="iconfont iconzuo"></i>
</div>
</div>
- <div class="swiper-local-next" v-show="swipercanvasData.length>1" @click="nextClick">
+ <div
+ class="swiper-local-next"
+ v-show="swipercanvasData.length>1"
+ @click="nextClick"
+ >
<div class="icon-btn" slot="button-next">
<i class="iconfont iconyou1"></i>
</div>
@@ -262,11 +258,11 @@
}
},
computed: {
- cameraType () {
+ cameraType() {
return this.TreeDataPool.treeActiveName === 'camera' ? "camera" : "dataStack"
}
},
- data () {
+ data() {
return {
mockSceneData: [],
loading: false,
@@ -313,20 +309,21 @@
stackFilesSize: 5,
};
},
- mounted () {
+ mounted() {
this.mockAsync();
this.PollData.statistics();
},
watch: {
- 'Camera.cameraId':{
- handler(n,o){
+ 'Camera.cameraId': {
+ handler(n, o) {
if (n) {
if (this.TreeDataPool.treeActiveName == "dataStack") {
this.stackFilesPage = 1;
this.stackFilesSize = 5;
this.stackId = n;
- if(this.stackId){
+ if (this.stackId) {
+ // console.log('getStackFiles')
this.swipercanvasData = [];
this.getStackFiles()
}
@@ -336,45 +333,44 @@
}
},
methods: {
- prevClick(){
- console.log(this.swiperIndex)
- console.log(this.$refs.swiper.swiper.activeIndex)
- if(this.swiperIndex == 0){
- console.log('鏈鍒嗛〉鐨勭涓�鏉�')
+ prevClick() {
+ // console.log(this.swiperIndex)
+ // console.log(this.$refs.swiper.swiper.activeIndex)
+ if (this.swiperIndex == 0) {
+ // console.log('鏈鍒嗛〉鐨勭涓�鏉�')
//璇锋眰涓婁竴椤�
- if(this.stackFilesPage > 1){
+ if (this.stackFilesPage > 1) {
this.stackFilesPage--;
- this.getStackFiles();
- }else{
+ this.getStackFiles(true);
+ } else {
this.$message({
- type:'info',
- message:'褰撳墠宸叉槸绗竴椤�'
+ type: 'info',
+ message: '褰撳墠宸叉槸绗竴椤�'
});
}
-
+
}
},
- nextClick(){
- console.log(this.swiperIndex)
- console.log(this.$refs.swiper.swiper.activeIndex)
- if(this.swiperIndex == this.swipercanvasData.length-1){
- console.log('鏈�鍚庝竴寮�,鍔犺浇鏇村')
+ nextClick() {
+ if (this.swiperIndex == this.swipercanvasData.length - 1) {
+ // 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 => {
- if (res && res.success ) {
- if(res.data.dataList.length > 0){
+ if (res && res.success) {
+ if (res.data.dataList.length > 0) {
this.swipercanvasData = [];
this.swipercanvasData = res.data.dataList.map(item => {
return {
name: item.name,
stackId: item.stack_id,
- baseImg: item.type == 2 ? `/files/${item.identifier}.jpg` : item.snapshot_url,
+ baseImg: item.type == 2 ? `/files/${item.path.substr(item.path.lastIndexOf('/') + 1)}` : item.snapshot_url,
type: item.type,
id: item.id,
loading: false
@@ -382,31 +378,32 @@
});
this.swiperIndex = 0;
this.$refs.swiper.swiper.activeIndex = 0;
-
- }else{
- console.log(this.swipercanvasData)
- this.$message({
- type:'info',
- message:'宸叉棤鏇村鏁版嵁!'
- });
+
+ } else {
+ if (onClick) {
+ this.$message({
+ type: 'warning',
+ message: '宸叉棤鏇村鏁版嵁!'
+ });
+ }
}
- }else{
- console.log(this.swipercanvasData)
+ } else {
+ // console.log(this.swipercanvasData)
this.$message({
- type:'error',
- message:'鏁版嵁璇锋眰澶辫触,璇风◢鍚庨噸璇�!'
+ type: 'error',
+ message: '鏁版嵁璇锋眰澶辫触,璇风◢鍚庨噸璇�!'
});
}
- this.getStackFileLoading = false;
+ 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"] },
@@ -432,29 +429,35 @@
];
}, 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 => {
this.Camera.getPolygon();
- this.Camera.getCameraTask();
+ //this.Camera.getCameraTask();
});
},
- refresh (url) {
+ refresh(url) {
this.Camera.baseImg = url
},
// 鍒濆鍖栨憚鍍忔満淇℃伅锛岀埗缁勪欢璋冪敤
- async initCameraData (id) {
+ async initCameraData(id) {
this.Camera = new VideoRuleData();
if (id && id !== "") {
this.loading = false;
this.Camera.cameraId = id;
await this.Camera.update();
- debugger
+
}
this.$refs.timeSlider.activeTab = this.VideoManageData.TimeRules[0].id;
@@ -468,7 +471,7 @@
},
- saveSceneRule (groupRule) {
+ saveSceneRule(groupRule) {
const payload = { ...groupRule }
payload.cameraIds = [this.Camera.cameraId];
let _this = this;
@@ -480,21 +483,21 @@
message: "绛栫暐淇濆瓨鎴愬姛锛�"
});
//鍒锋柊宸︿晶鏍�
- debugger
+
_this.$root.$children[0].$children[0].querySearchAsync('camera')
}
});
},
- 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) {
@@ -530,7 +533,7 @@
this.PollData.statisticTaskInfo();
},
//瀹炴椂銆佽疆璇㈠垏鎹�
- changePoll (row) {
+ changePoll(row) {
//鍒ゆ柇鏄柊澧炶繕鏄洿鏂�
if (this.Camera.cameraId && this.Camera.cameraId !== undefined) {
if (this.PollData.RealTimeSum < this.PollData.channelTotal) {
@@ -579,7 +582,7 @@
}
},
//澶嶅埗
- ctrlC () {
+ ctrlC() {
this.TreeDataPool.ctrlCameraId = this.Camera.cameraId;
this.TreeDataPool.ctrlCameraName = this.Camera.cameraName;
this.$notify({
@@ -587,7 +590,7 @@
message: "澶嶅埗绠楁硶鎴愬姛锛�"
})
},
- ctrlV () {
+ ctrlV() {
if (this.Camera.cameraId === this.TreeDataPool.ctrlCameraId) {
this.$notify({
type: "warning",
@@ -624,8 +627,8 @@
};
</script>
<style lang="scss">
-.el-message--info .el-message__content{
- color: #999;
+.el-message--info .el-message__content {
+ color: #999 !important;
}
.swiper-container {
margin-left: auto;
@@ -1011,7 +1014,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;
--
Gitblit v1.8.0