From 7cea2db9d57b24d98e42b5207fa6f9a703362e26 Mon Sep 17 00:00:00 2001 From: heyujie <516346543@qq.com> Date: 星期四, 24 六月 2021 10:29:19 +0800 Subject: [PATCH] 朔黄和系统设置 --- src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue | 117 +++++++++++++++++++++++++++++++--------------------------- 1 files changed, 62 insertions(+), 55 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue b/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue index 331b1f6..538fad8 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue @@ -17,7 +17,8 @@ v-for="(item, index) in popDownArr" :key="index" :command="item" - >{{ item.CameraPosition }}</el-dropdown-item> + >{{ item.CameraPosition }}</el-dropdown-item + > </el-dropdown-menu> </el-dropdown> @@ -52,10 +53,10 @@ <div class="v-name-block"> <div class="video-name" - :class="{ current: curVideo.ID == video.ID }" + :class="{ current: curVideo.id == video.id }" @click="checkVideo(video, index)" v-for="(video, index) in curRoomVideos" - :key="video.ID" + :key="video.id" > <i class="el-icon-film"></i> <span>{{ video.VideoDate }}</span> @@ -118,7 +119,11 @@ </template> <div class="player-control"> <div class="progress-bar"> - <el-tooltip placement="top" v-for="(item, index) in eventMarks" :key="index"> + <el-tooltip + placement="top" + v-for="(item, index) in eventMarks" + :key="index" + > <div slot="content"> {{ getTimeStr(item.offset) }} <br /> @@ -132,7 +137,11 @@ @click="dotJump(item.offset)" ></div> </el-tooltip> - <el-tooltip placement="top" v-for="(item, index) in labelMarks" :key="index"> + <el-tooltip + placement="top" + v-for="(item, index) in labelMarks" + :key="index" + > <div slot="content"> {{ getTimeStr(item.offset) }} <br /> @@ -201,16 +210,21 @@ v-show="isUnusual == 1" type="primary" @click="addLabel(curVideo)" - >娣诲姞鏍囨敞</el-button> + >娣诲姞鏍囨敞</el-button + > </div> <div class="flex-box fixed-height-box"> <label v-if="!showTable">鏍囨敞淇℃伅:</label> <div class="mark-list" v-if="!showTable"> - <div class="mark" v-for="mark in curVideo.LableLst" :key="mark.ID"> + <div + class="mark" + v-for="mark in curVideo.LableLst" + :key="mark.ID" + > <div class="time"> <span> {{ pad0(Math.floor(mark.Time / 60)) }}:{{ - pad0(mark.Time % 60) + pad0(mark.Time % 60) }} </span> <i class="el-icon-edit" @click="editCurLabel(mark)"></i> @@ -269,12 +283,19 @@ <div class="label-check"> <p class="label">闅愭偅闂:</p> <el-checkbox-group v-model="labelCheckedList"> - <el-checkbox v-for="item in labelOptions" :key="item.ID" :label="item.ID">{{ item.Name }}</el-checkbox> + <el-checkbox + v-for="item in labelOptions" + :key="item.ID" + :label="item.ID" + >{{ item.Name }}</el-checkbox + > </el-checkbox-group> </div> <div class="btns"> <el-button @click="cancelLabelChecked" size="small">鍙栨秷</el-button> - <el-button @click="submitLabelChecked" size="small" type="primary">纭畾</el-button> + <el-button @click="submitLabelChecked" size="small" type="primary" + >纭畾</el-button + > </div> </el-dialog> </div> @@ -332,11 +353,11 @@ filters: { fixPath(str) { if (!str || str == undefined) { - return "" + return ""; } - return str.replace("/opt/vasystem", "") - } + return str.replace("/opt/vasystem", ""); + }, }, data() { return { @@ -396,7 +417,7 @@ this.renderLabelOpts(); this.setGuid(1); this.getCurVideos(this.videoDetails); - // this.getRelatedVideos(this.videoDetails); + this.getRelatedVideos(this.videoDetails); }, destroyed() { this.videoArrs.length = 0; @@ -532,26 +553,6 @@ _this.$nextTick(() => { _this.$refs[`player_${_this.curVideo.id}`][0].init(); }); - // let _this = this; - // console.log(cmd) - // getCarVideos({ - // TrainNumber: cmd.TrainNumber, - // CarNumber: cmd.CarNumber, - // Driver1: cmd.Driver1, - // }).then((res) => { - // _this.allCurVideos = res.data; - // _this.curCamera = cmd.CameraPosition; - // _this.curRoomVideos = _this.allCurVideos.filter((item) => { - // return item.CameraPosition == cmd.CameraPosition; - // }); - // _this.curVideo = _this.curRoomVideos.find((item) => { - // return item.ID == cmd.ID; - // }); - // _this.$nextTick(() => { - // _this.$refs[`player_${_this.curVideo.ID}`][0].init(); - // }); - // }); - }, pad0(val) { return val < 10 ? "0" + val : val; @@ -569,14 +570,6 @@ CarNumber: v.CarNumber, Driver1: v.Driver1, }).then((res) => { - // 濉厖鍗曠獥鍙g殑涓嬫媺鑿滃崟 - res.data.forEach((item) => { - _this.popDownArr.push(item); - }); - // if (_this.popDownArr.length) { - // _this.curCamera = _this.popDownArr[0].CameraPosition; - // } - res.data.forEach((item) => { item.marks = _this.mergeMarks(item); }); @@ -608,7 +601,8 @@ _this.$nextTick(() => { _this.$refs[`player_${_this.curVideo.id}`][0].init(); let arr = _this.maxVideoTime.split(":"); - let min = +arr[1], sec = +arr[2]; + let min = +arr[1], + sec = +arr[2]; _this.maxSecond = min * 60 + sec; }); }); @@ -616,15 +610,15 @@ getRelatedVideos(video) { let _this = this; getRelatedVideoInfo({ GroupID: video.GroupID }).then((res) => { - let arr = []; - let map = {}; res.data.forEach((item) => { _this.popDownArr.push(item); }); + // _this.popDownArr = res.data if (_this.popDownArr.length) { _this.curCamera = _this.popDownArr[0].CameraPosition; } }); + _this.popDownArr; }, renderLabelOpts() { let _this = this; @@ -633,17 +627,31 @@ }); }, refreshCurVideoLabel(video) { + let _this = this; + _this.popDownArr = []; getRelatedVideoInfo({ GroupID: video.GroupID }).then((res) => { - res.data.forEach((d) => { - if (d.ID === video.ID) { - video.LableLst = d.LableLst; + res.data.forEach((item) => { + _this.popDownArr.push(item); + if (item.ID === video.ID) { + video.LableLst = item.LableLst; } }); }); + _this.popDownArr; }, checkVideo(video, index) { this.refreshCurVideoLabel(video); this.curVideo = video; + this.eventMarks = [] + this.labelMarks = [] + video.marks.forEach((item) => { + if (item.type == 0) { + this.eventMarks.push(item); + } else { + this.labelMarks.push(item); + } + }) + this.videoArrs = this.allCurVideos.filter( (item) => video.GroupID == item.GroupID ); @@ -738,11 +746,10 @@ }, removeCurLabel(mark) { let _this = this; + debugger; let obj = { - Desc: mark.Desc, - ParentUniqID: mark.ParentUniqID, - Time: mark.Time, - ParentID: mark.ParentID + ID: mark.ID, + VideoIds: mark.VideoIds, }; delLabel(obj).then((rsp) => { if (rsp && rsp.success) { @@ -766,7 +773,7 @@ }, mergeMarks(videoInfo) { if (!videoInfo.EventLst || !videoInfo.LableLst) { - console.log("mergeMarks data null") + console.log("mergeMarks data null"); return; } @@ -905,7 +912,7 @@ height: 8px; width: 6px; z-index: 1; - background-color: lightcoral; + background-color: yellowgreen; cursor: pointer; -webkit-transform: translateX(-50%); transform: translateX(-50%); @@ -915,7 +922,7 @@ height: 8px; width: 6px; z-index: 1; - background-color: yellowgreen; + background-color: lightcoral; cursor: pointer; -webkit-transform: translateX(-50%); transform: translateX(-50%); -- Gitblit v1.8.0