From 4a800a8fc83c6bd1f86a8e847b079a51a7532c09 Mon Sep 17 00:00:00 2001
From: zhangzengfei <zhangzengfei@smartai.com>
Date: 星期三, 20 七月 2022 15:05:58 +0800
Subject: [PATCH] 修复国标配置的bug
---
src/pages/cameraAccess/components/LinkageRule.vue | 224 +++++++++++++++++++++++++++++++++----------------------
1 files changed, 134 insertions(+), 90 deletions(-)
diff --git a/src/pages/cameraAccess/components/LinkageRule.vue b/src/pages/cameraAccess/components/LinkageRule.vue
index dcf7ca7..d57a3d7 100644
--- a/src/pages/cameraAccess/components/LinkageRule.vue
+++ b/src/pages/cameraAccess/components/LinkageRule.vue
@@ -17,17 +17,17 @@
/>
</div>
</div>
- </div> -->
- <div class="top" >
+ </div>-->
+ <div class="top">
<p class="task-css">
- <b style="font-size: 14px; line-height: 18px;">鍦烘櫙</b>
+ <b style="font-size: 14px; line-height: 18px">鍦烘櫙</b>
</p>
<div class="clearfix">
<slide-scene :sceneData="tableRuleList"></slide-scene>
<div class="top-right">
<sysinfo
v-if="showSysInfo"
- style="margin-top: -10px;"
+ style="margin-top: -10px"
:ShowLocalVedio="this.TreeDataPool.treeActiveName !== 'camera'"
:showRealPoll="this.TreeDataPool.treeActiveName == 'camera'"
/>
@@ -36,7 +36,7 @@
:ShowLocalVedio="cameraType === 'dataStack'"
v-if="showSysInfo"
style="margin-top:-10px"
- /> -->
+ />-->
</div>
</div>
</div>
@@ -45,11 +45,19 @@
<div class="bottom-right">
<div class="draw-and-time-box">
<div class="draw-box">
- <p style="text-align:left;padding: 10px 0px 0px 0px;box-sizing: border-box;">
+ <p
+ style="
+ text-align: left;
+ padding: 10px 0px 0px 0px;
+ box-sizing: border-box;
+ "
+ >
<b style="font-size: 14px">鏌ョ湅鍖哄煙</b>
</p>
<div class="img-box">
- <span class="camera-tip" v-show="swipercanvasData.length == 0 ">鏆傛棤鍖哄煙锛岃鑷冲皯閫夋嫨2涓憚鍍忔満</span>
+ <span class="camera-tip" v-show="swipercanvasData.length == 0"
+ >鏆傛棤鍖哄煙锛岃鑷冲皯閫夋嫨2涓憚鍍忔満</span
+ >
<!-- swiper 灞曠ず -->
<swiper
ref="swiper"
@@ -57,8 +65,15 @@
@slideChange="swiperSlideChange"
class="swiper-box-container2"
>
- <swiper-slide v-for="(data, index) in swipercanvasData" :key="index">
- <b class="video-title" style="font-size:14px;margin-top:-10px">{{ data.name }}</b>
+ <swiper-slide
+ v-for="(data, index) in swipercanvasData"
+ :key="index"
+ >
+ <b
+ class="video-title"
+ style="font-size: 14px; margin-top: -10px"
+ >{{ data.name }}</b
+ >
<polygon-canvas
ref="canvas"
v-loading="loading"
@@ -74,27 +89,38 @@
:currentCameraId="data.cameraId"
@changeLoading="changeLoading"
@fromCanvas="getCanvasData"
+ @refresh="refresh"
></polygon-canvas>
</swiper-slide>
</swiper>
- <div class="swiper-local-prev" v-show="swipercanvasData.length>1">
+ <div
+ class="swiper-local-prev"
+ v-show="swipercanvasData.length > 1"
+ >
<div class="icon-btn" slot="button-prev">
<i class="iconfont iconzuo"></i>
</div>
</div>
- <div class="swiper-local-next" v-show="swipercanvasData.length>1">
+ <div
+ class="swiper-local-next"
+ v-show="swipercanvasData.length > 1"
+ >
<div class="icon-btn" slot="button-next">
<i class="iconfont iconyou1"></i>
</div>
</div>
</div>
</div>
- <div style="float:left;width:calc(10% - 90px);height:100%;"></div>
+ <div style="float: left; width: calc(10% - 90px); height: 100%"></div>
<div
class="time-box"
- style="width:calc(90% + 90px - 576px);overflow-x:auto;overflow-y:hidden"
+ style="
+ width: calc(90% + 90px - 576px);
+ overflow-x: auto;
+ overflow-y: hidden;
+ "
>
- <p style="text-align:left;padding: 10px;box-sizing: border-box">
+ <p style="text-align: left; padding: 10px; box-sizing: border-box">
<b style="font-size: 14px">鏃堕棿瑙勫垯</b>
</p>
<time-slider ref="timeSlider" :type="'link'" />
@@ -108,6 +134,7 @@
:tableRuleList="tableRuleList"
:onSaveScene="saveSceneRule"
@delete-rule="showRules"
+ v-loading="loadingRuleList"
></scene-rule>
</div>
</div>
@@ -115,10 +142,7 @@
</template>
<script>
-import {
- saveLinkScene,
- getLinkSceneRule,
-} from '@/api/scene'
+import { saveLinkScene, getLinkSceneRule } from "@/api/scene";
import VideoRuleData from "@/Pool/VideoRuleData";
import polygonCanvas from "@/components/canvas";
@@ -134,32 +158,18 @@
polygonCanvas,
SceneRule,
Sysinfo,
- SlideScene
+ SlideScene,
},
computed: {
selectedCameraIds() {
- let ids = [];
- if (this.TreeDataPool.treeActiveName == 'dataStack') {
- if (this.TreeDataPool.checkedLocalVedio.length > 0) {
- ids = this.TreeDataPool.checkedLocalVedio.map(i => {
- return i.id;
- })
-
- }
- } else {
- if (this.TreeDataPool.selectedNodes.length > 0) {
- ids = this.TreeDataPool.selectedNodes;
- }
- }
-
- return ids;
- }
+ return this.TreeDataPool.selectedNodes;
+ },
},
data() {
return {
loading: false,
+ loadingRuleList: false,
Carmeras: [],
- Camera: new VideoRuleData(),
tasksTable: {},
swipercanvasData: [],
seqNumber: 0,
@@ -169,26 +179,27 @@
grabCursor: true,
pagination: {
el: ".swiper-pagination",
- type: "fraction"
+ type: "fraction",
},
navigation: {
nextEl: ".swiper-local-next",
- prevEl: ".swiper-local-prev"
- }
+ prevEl: ".swiper-local-prev",
+ },
},
swiperTaskOption: {
slidesPerView: 4,
// spaceBetween: 10,
pagination: {
el: ".swiper-pagination",
- clickable: true
+ clickable: true,
},
navigation: {
nextEl: ".next-border",
- prevEl: ".pre-border"
- }
+ prevEl: ".pre-border",
+ },
},
- showSysInfo: false
+ showSysInfo: false,
+ requestSeq: "",
};
},
watch: {
@@ -196,31 +207,32 @@
handler(newVal, oldVal) {
this.setSwiperData();
},
- deep: true
- }
+ deep: true,
+ },
},
methods: {
swiperSlideChange() {
this.swiperIndex = this.$refs.swiper.swiper.activeIndex;
},
- initCameraData() {
+ initCameraData(type) {
this.$nextTick(() => {
this.Carmeras = [];
- this.loading = false;
this.showSysInfo = true;
- if (this.TreeDataPool.treeActiveName == 'dataStack') {
- this.TreeDataPool.checkedLocalVedio.forEach(camera => {
- this.Carmeras.push(new VideoRuleData(camera.id));
+
+ if (type === 1) {
+ this.selectedCameraIds.forEach((cid) => {
+ this.Carmeras.push(new VideoRuleData(cid, true));
});
} else {
- this.TreeDataPool.selectedNodes.forEach(camera => {
- this.Carmeras.push(new VideoRuleData(camera));
+ this.selectedCameraIds.forEach((cid) => {
+ this.Carmeras.push(new VideoRuleData(cid));
});
}
+
this.$refs.timeSlider.activeTab = this.VideoManageData.TimeRules[0].id;
this.showRules();
- })
+ });
},
setSwiperData() {
let swipers = [];
@@ -236,15 +248,35 @@
}
this.swipercanvasData = swipers;
},
- getCanvasData() { },
+ refresh(url, id) {
+ this.swipercanvasData.forEach((data) => {
+ if (data.cameraId == id) {
+ data.baseImg = url;
+ }
+ });
+ //this.Camera.baseImg = url
+ },
+ getCanvasData() {},
+ newUid() {
+ let originStr = "xxxxxxxx-xxxx-xxxx-xxxx-xxxxxxxxxxxx";
+ let originChar = "0123456789abcdef";
+ let len = originChar.length;
+ return originStr.replace(/x/g, function (match) {
+ return originChar.charAt(Math.floor(Math.random() * len));
+ });
+ },
showRules() {
this.tableRuleList = [];
if (this.selectedCameraIds.length > 0) {
- getLinkSceneRule({ cameraIds: this.selectedCameraIds }).then(
- rsp => {
- if (rsp && rsp.success) {
+ this.loadingRuleList = true;
+ let seq = this.newUid();
+ this.requestSeq = seq;
+ getLinkSceneRule({ cameraIds: this.selectedCameraIds })
+ .then((rsp) => {
+ this.loadingRuleList = false;
+ if (rsp && rsp.success && seq === this.requestSeq) {
this.tableRuleList = rsp.data;
// 缁熶竴瑙勫垯缂栬緫鐨勬暟鎹粨鏋�
@@ -253,41 +285,54 @@
}
}
// this.TreeDataPool.fetchTreeData();
- }
- );
+ })
+ .catch(() => {
+ this.loadingRuleList = false;
+ });
}
-
},
saveSceneRule(groupRule) {
- const payload = { ...groupRule }
+ const payload = { ...groupRule };
+ if (!payload.rules) {
+ this.$message({
+ type: "warning",
+ message: "瑙勫垯鍙傛暟鏈夎",
+ });
+
+ return;
+ }
+
payload.cameraIds = this.selectedCameraIds;
- saveLinkScene(payload).then(rsp => {
- if (rsp && rsp.success) {
- //this.Camera.update();
- this.initCameraData();
- this.$notify({
- type: "success",
- message: "浠诲姟淇濆瓨鎴愬姛锛�"
- });
- } else {
- this.$notify({
+ saveLinkScene(payload)
+ .then((rsp) => {
+ if (rsp && rsp.success) {
+ //this.Camera.update();
+ this.initCameraData();
+ // this.showRules();
+ this.$notify({
+ type: "success",
+ message: "浠诲姟淇濆瓨鎴愬姛锛�",
+ });
+ } else {
+ this.$notify({
+ type: "error",
+ message: rsp.data,
+ });
+ }
+ })
+ .catch((err) => {
+ this.$message({
type: "error",
- message: rsp.data
+ message: "淇濆瓨澶辫触锛�",
});
- }
- }).catch(err => {
- this.$message({
- type: "error",
- message: "淇濆瓨澶辫触锛�" + err.data
});
- });
},
changeLoading(params) {
- this.loading = params
- }
- }
+ this.loading = params;
+ },
+ },
};
</script>
<style lang="scss">
@@ -296,9 +341,9 @@
//height: 100%;
//padding: 13px 0 20px;
position: relative;
- .devide{
+ .devide {
height: 10px;
- background: #E9EBF2;
+ background: #e9ebf2;
}
.top {
width: 100%;
@@ -396,14 +441,14 @@
float: right;
width: 54%;
height: 144px;
- .card-box{
- width: 54%!important;
+ .card-box {
+ width: 54% !important;
}
- .eCharts-box{
+ .eCharts-box {
width: 45%;
- canvas{
- width: 98%!important;
- }
+ canvas {
+ width: 98% !important;
+ }
}
}
.task-css {
@@ -568,7 +613,6 @@
.add-btn:hover {
color: #2249b4;
}
-
}
</style>
<style lang="scss" scoped>
--
Gitblit v1.8.0