From bae0368f502f524fc739003fe751fb0eb06c5859 Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@iotlink.com> Date: 星期四, 17 六月 2021 14:48:29 +0800 Subject: [PATCH] 修改朔黄前端分析 --- src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue | 110 +++++++++++++++++++++++++------------------------------ 1 files changed, 50 insertions(+), 60 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue b/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue index c1a6ea0..90ab683 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/videoAnalyze.vue @@ -9,15 +9,15 @@ v-show="showLocChoise" > <span class="el-dropdown-link"> - {{ curCamera }}<i class="el-icon-arrow-down el-icon--right"></i> + {{ curCamera }} + <i class="el-icon-arrow-down el-icon--right"></i> </span> <el-dropdown-menu slot="dropdown"> <el-dropdown-item v-for="(item, index) in popDownArr" :key="index" :command="item" - >{{ item.Camera }}</el-dropdown-item - > + >{{ item.Camera }}</el-dropdown-item> </el-dropdown-menu> </el-dropdown> @@ -118,13 +118,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 />{{ item.text }} + {{ getTimeStr(item.offset) }} + <br /> + {{ item.text }} </div> <div class="self-dot" @@ -134,13 +132,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 />{{ item.text }} + {{ getTimeStr(item.offset) }} + <br /> + {{ item.text }} </div> <div class="label-dot" @@ -161,7 +157,7 @@ @mouseover.native="intoBar" @change="progressChange" ></el-slider> - </div> + </div> <div class="control-zone"> <span class="time">{{ curPlayTime }} / {{ maxVideoTime }}</span> <div class="play-btn"> @@ -205,23 +201,18 @@ 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) - }}</span - > + <span> + {{ pad0(Math.floor(mark.Time / 60)) }}:{{ + pad0(mark.Time % 60) + }} + </span> <i class="el-icon-edit" @click="editCurLabel(mark)"></i> <i class="el-icon-delete" @click="removeCurLabel(mark)"></i> </div> @@ -230,12 +221,12 @@ </div> </div> </div> - </div></el-tab-pane - > + </div> + </el-tab-pane> <!-- <div class="flex-box fixed-height-box2"></div> --> <dataset-chart style="width: 100%" v-if="showTable"></dataset-chart> - <el-tab-pane label="鍏噷鏍�" name="second"> </el-tab-pane> + <el-tab-pane label="鍏噷鏍�" name="second"></el-tab-pane> </el-tabs> </div> <div class="bot-right block"> @@ -274,23 +265,16 @@ <el-radio :label="1">鏍囨敞鍦ㄥ叏閮ㄤ綅缃殑瑙嗛娈�</el-radio> <el-radio :label="0">浠呮爣娉ㄩ�変腑鐨勮棰戞</el-radio> </el-radio-group> - </div> --> + </div>--> <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> @@ -540,18 +524,18 @@ Driver1: cmd.Driver1, }).then((res) => { _this.allCurVideos = res.data; - _this.curCamera = cmd.Camera; - _this.curRoomVideos = _this.allCurVideos.filter((item) => { - return item.Camera == cmd.Camera; + _this.curCamera = cmd.Camera; + _this.curRoomVideos = _this.allCurVideos.filter((item) => { + return item.Camera == cmd.Camera; + }); + _this.curVideo = _this.curRoomVideos.find((item) => { + return item.ID == cmd.ID; + }); + _this.$nextTick(() => { + _this.$refs[`player_${_this.curVideo.ID}`][0].init(); + }); }); - _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; @@ -583,7 +567,8 @@ if (_this.guid == 1) { _this.maxVideoTime = _this.curVideo.VideoTime; } - _this.videoArrs = res.data.filter((item) => v.UniqeID == item.UniqeID); + + _this.videoArrs = res.data.filter((item) => v.GroupID == item.GroupID); _this.allCurVideos = res.data; _this.curRoomVideos = _this.allCurVideos.filter((item) => { return item.Camera == "鍙告満瀹�"; @@ -600,7 +585,7 @@ }, getRelatedVideos(video) { let _this = this; - getRelatedVideoInfo({ UniqeID: video.UniqeID }).then((res) => { + getRelatedVideoInfo({ GroupID: video.GroupID }).then((res) => { let arr = []; let map = {}; res.data.forEach((item) => { @@ -618,7 +603,7 @@ }); }, refreshCurVideoLabel(video) { - getRelatedVideoInfo({ UniqeID: video.UniqeID }).then((res) => { + getRelatedVideoInfo({ GroupID: video.GroupID }).then((res) => { res.data.forEach((d) => { if (d.ID === video.ID) { video.LableLst = d.LableLst; @@ -630,7 +615,7 @@ this.refreshCurVideoLabel(video); this.curVideo = video; this.videoArrs = this.allCurVideos.filter( - (item) => video.UniqeID == item.UniqeID + (item) => video.GroupID == item.GroupID ); this.$nextTick(() => { this.$refs[`player_${this.curVideo.ID}`][0].init(); @@ -656,7 +641,7 @@ `calc(` + 100 / guid + `%)`; // this.$refs["playerWrap"].offsetHeight / guid + "px"; } - console.log(this.$refs[`player_${this.videoArrs[index].ID}`]); + // console.log(this.$refs[`player_${this.videoArrs[index].ID}`]); }); }, cancelLabelChecked() { @@ -681,12 +666,12 @@ let query = { ID: this.selectedLabelId, ParentID: tempArr.join(","), - ParentUniqID: this.curVideo.UniqeID + "", + ParentUniqID: this.curVideo.GroupID + "", Time: Math.round(this.setLabelTime) + "", Codes: this.labelCheckedList.join(","), Desc: desc.join("锛�"), }; - + editLabel(query).then((rsp) => { if (rsp && rsp.success) { _this.labelDialogVisible = false; @@ -728,7 +713,7 @@ Desc: mark.Desc, ParentUniqID: mark.ParentUniqID, Time: mark.Time, - ParentID:mark.ParentID + ParentID: mark.ParentID }; delLabel(obj).then((rsp) => { if (rsp && rsp.success) { @@ -751,6 +736,11 @@ }); }, mergeMarks(videoInfo) { + if (!videoInfo.EventLst || !videoInfo.LableLst) { + console.log("mergeMarks data null") + return; + } + const eMarks = videoInfo.EventLst.map((item) => { return { offset: item.SecondsInVideo, -- Gitblit v1.8.0