From 0b737708e696c45720499759b5c31aced87fdbb6 Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@iotlink.com> Date: 星期三, 07 七月 2021 14:10:03 +0800 Subject: [PATCH] merge master --- src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue | 264 ++++++++++++++++++++++++---------------------------- 1 files changed, 124 insertions(+), 140 deletions(-) diff --git a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue index 8645349..d6d1a9b 100644 --- a/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue +++ b/src/pages/shuohuangMonitorAnalyze/components/searchForVideoAnalyze.vue @@ -36,11 +36,6 @@ <span class="title">{{ config.title }}</span > : <span class="val" v-for="option in config.data" :key="option.id"> - <!-- <template> - <div> - - </div> - </template>--> <span v-if="option.isChecked" class="val-show"> {{ option.name }} <i>銆�</i> @@ -167,8 +162,8 @@ @change="filterSearchData" > <el-option value label="鍏ㄩ儴"></el-option> - <el-option :value="false" label="鏈叧娉�"></el-option> - <el-option :value="true" label="宸插叧娉�"></el-option> + <el-option :value="'1'" label="鏈叧娉�"></el-option> + <el-option :value="'0'" label="宸插叧娉�"></el-option> </el-select> </div> <div> @@ -214,7 +209,7 @@ > <div class="card"> <div class="video-wrap" @click="checkVideoDetail(data)"> - <img :src="data.VideoCover" alt /> + <img :src="data.VideoCover | fixPath" alt /> </div> <div class="video-info"> <div class="base-info"> @@ -228,7 +223,7 @@ </div> <div class="flex-box"> <label>鏃堕棿:</label> - <span>{{ data.VideoDate }}</span> + <span>{{ data.StartTime }}</span> </div> <div class="flex-box"> <label>鍙告満 | 鍓徃鏈�:</label> @@ -244,11 +239,12 @@ class="abnormal-label" v-for="(label, index) in data.LableLst" :key="index" - >{{ + > + {{ label.Desc + (index == data.LableLst.length - 1 ? "" : "锛�") - }}</span - > + }} + </span> </div> <div v-else> <span>鏃犲紓甯�</span> @@ -281,7 +277,7 @@ <div class="star" @click="toggleFollow(data)"> <i class="iconfont" - :class="[data.IsFollow ? 'follow' : '', 'iconguanzhu']" + :class="[data.IsFollow == '0' ? 'follow' : '', 'iconguanzhu']" ></i> </div> </div> @@ -312,21 +308,19 @@ </template> </el-table-column> + <el-table-column label="澶у皬" prop="VideoSize" sortable> + <template slot-scope="scope" style="cursor: pointer"> + <div> + {{ Math.round(+scope.row.VideoSize / (1024 * 1024)) + " MB" }} + </div> + </template> + </el-table-column> <el-table-column - label="澶у皬" - prop="VideoSize" + label="瑙嗛鏃堕棿" + prop="StartTime" sortable ></el-table-column> - <el-table-column - label="淇敼鏃ユ湡" - prop="VideoUpdateDate" - sortable - ></el-table-column> - <el-table-column - label="鍒涘缓鏃ユ湡" - prop="VideoCreateDate" - sortable - ></el-table-column> + <!-- <el-table-column label="鍒涘缓鏃ユ湡" prop="VideoCreateDate" sortable></el-table-column> --> <el-table-column label="鎿嶄綔"> <template slot-scope="scope"> @@ -334,11 +328,13 @@ <div class="star"> <i class="iconfont" - :class="[scope.row.IsFollow ? 'follow' : '', 'iconguanzhu']" + :class="[ + scope.row.IsFollow == '0' ? 'follow' : '', + 'iconguanzhu', + ]" @click.stop="toggleFollow(scope.row)" ></i> </div> - <!-- <i class="el-icon-star-off" @click="toggleFollow(scope.row)"></i> --> </div> </template> </el-table-column> @@ -358,25 +354,30 @@ v-drag v-resize - --> + --> <!-- <div > --> - <!-- :modal="false" --> - <el-dialog v-drag v-resize - class="dialog-video" - :visible="videoDialogVisible" - @close="closeDial" - :close-on-click-modal="false" - :destroy-on-close="true" - :modal-append-to-body="false" - > - <div slot="title" class="title"> - <div class="center"> - <i class="el-icon-connection"></i> - <span>鎾斁瑙嗛</span> - </div> + <!-- :modal="false" --> + <el-dialog + v-drag + v-resize + class="dialog-video" + :visible="videoDialogVisible" + @close="closeDial" + :close-on-click-modal="false" + :destroy-on-close="true" + :modal-append-to-body="false" + > + <div slot="title" class="title"> + <div class="center"> + <i class="el-icon-connection"></i> + <span>鎾斁瑙嗛</span> </div> - <video-analyze v-if="videoDialogVisible" :videoDetails="selectedVideo" /> - </el-dialog> + </div> + <video-analyze + v-if="videoDialogVisible" + :videoDetails="selectedVideo" + /> + </el-dialog> <!-- </div> --> <el-dialog @@ -397,12 +398,9 @@ <script> import { getlstInit, - updateVideoAnalyze, + updateFollow, getlst, - getRelatedVideoInfo, getLabelMap, - delLabel, - editLabel, getEventVideo, } from "@/api/shuohuang"; import VideoAnalyze from "./videoAnalyze"; @@ -413,6 +411,15 @@ VideoAnalyze, EventVideos, }, + filters: { + fixPath(str) { + if (!str || str == undefined) { + return ""; + } + + return str.replace("/opt/vasystem", ""); + }, + }, data() { return { CLIP: "http://", @@ -420,7 +427,7 @@ IsFollow: "", searchTime: [ new Date(2020, 0, 1, 0, 0, 0), - new Date(2020, 11, 31, 23, 59, 59), + new Date(2021, 11, 31, 23, 59, 59), ], curTabPage: 1, curTablePage: 1, @@ -468,7 +475,6 @@ const end = new Date(); const start = new Date(); start.setTime(start.getTime() - 3600 * 1000 * 24 * 7); - //start.setHours(0,0,0); picker.$emit("pick", [start, end]); }, }, @@ -506,19 +512,24 @@ }, methods: { checkEventVideo(label) { + if (label.LKGID != "") { + this.$message.warning("璇ヤ簨浠舵病鏈夌浉鍏宠仈鐨勮棰�"); + return; + } + this.eventDialogVisible = true; this.curEventDetail = label; let _this = this; - getEventVideo({ Event: label.Event, LkgID: label.ParentID }).then( + getEventVideo({ event: label.Event, videoId: label.VideoIds }).then( (res) => { _this.eventVideoArr = res.data; _this.curEvName = label.Event; } ); }, - closeDial(){ - this.videoDialogVisible = false - this.selectedVideo={} + closeDial() { + this.videoDialogVisible = false; + this.selectedVideo = {}; }, handleTabSizeChange(size) { this.tabPageSize = size; @@ -534,14 +545,6 @@ //浜岀骇鏌ヨ filterSearchData() { let _this = this; - let isFollow = ""; - if (this.IsFollow === "") { - isFollow = ""; - } else if (!!this.IsFollow) { - isFollow = "1"; - } else { - isFollow = "0"; - } let query = { KeyWord: this.keyword, StartDate: this.searchTime[0], @@ -551,7 +554,7 @@ PageSize: this.showType == "list" ? this.tablePageSize : this.tabPageSize, IsDetail: this.showType == "list", - IsFollow: isFollow, + IsFollow: this.IsFollow , IsOperate: this.IsOperate, }; let filterQuerys = []; @@ -593,6 +596,10 @@ }, //涓�绾ф煡璇� init() { + if (this.checkedConfigs.length) { + this.filterSearchData() + return + } let _this = this; let query = { KeyWord: this.keyword, @@ -606,6 +613,18 @@ IsFollow: this.IsFollow, IsOperate: this.IsOperate, }; + let filterQuerys = []; + this.checkedConfigs.forEach((config) => { + let checkedOpts = config.data.filter((option) => option.isChecked); + if (checkedOpts.length) { + var linkOpts = checkedOpts.map((opt) => opt.name); + linkOpts = linkOpts.join(","); + let obj = {}; + obj[config.NameEn] = linkOpts; + filterQuerys.push(obj); + } + }); + Object.assign(query, ...filterQuerys); this.optionalConfigs = []; this.highLevelConfigs = []; getlstInit(query).then((res) => { @@ -630,15 +649,8 @@ return item; }); } - res.filterlst.forEach((config) => { this.$set(config, "isShow", true); - // config.data = Object.keys(config.Node).map(key => { - // let obj = {}; - // obj.name = key; - // obj.id = config.Node[key] - // return obj - // }); config.data = config.Node.map((item) => { let obj = {}; obj.name = item[0]; @@ -670,33 +682,26 @@ config.showMore = false; } }); - console.log(this.optionalConfigs); }); }); }, toggleFollow(data) { - data.IsFollow = !data.IsFollow; - this.updataVideo(data); - if (data.IsFollow) { + data.IsFollow == "0" ? (data.IsFollow = "1") : (data.IsFollow = "0"); + updateFollow({ + id: data.id, + IsFollow: data.IsFollow, + }).then((res) => { this.$notify({ type: "success", - message: "宸叉坊鍔犲叧娉�!", + message: data.IsFollow == "0" ? "宸叉坊鍔犲叧娉�!" : "宸插彇娑堝叧娉�!", }); - } - }, - updataVideo(data) { - let _this = this; - updateVideoAnalyze(data).then((res) => { - //浜岀骇鏌ヨ }); }, - checkVideoDetail(data) { let _this = this; _this.selectedVideo = data; _this.videoDialogVisible = true; }, - checkFollow() {}, checkType(type) { this.showType = type; this.filterSearchData(); @@ -727,15 +732,11 @@ option.isChecked = true; } this.checkedConfigs.push(config); - config.isShow = false; config.isMultCheck = false; if (config.IsAdvanced) { this.showAdvance = false; } - // this.$nextTick(() => { - // this.$set(config, 'isShow', false) - // }) }, cancleMultCheck(config) { @@ -799,43 +800,42 @@ }; }, resize(el, binding, vnode) { - const dragDom = el.querySelector('.el-dialog') - dragDom.style.overflow = 'hidden' - let minWidth = 400 - let minHeight = 300 // - - // 鎷変几 - let resizeEl = document.createElement('div') - dragDom.appendChild(resizeEl) // 鍦ㄥ脊绐楀彸涓嬭鍔犱笂涓�涓�10-10px鐨勬帶鍒跺潡 - resizeEl.style.cursor = 'nwse-resize' - // resizeEl.style.cursor = 'se-resize' - resizeEl.style.position = 'absolute' - resizeEl.style.height = '12px' - resizeEl.style.width = '12px' - resizeEl.style.right = '0px' - resizeEl.style.bottom = '0px' //榧犳爣鎷変几寮圭獥 - resizeEl.style.background = 'url("/images/desktop/resize.png") no-repeat' //榧犳爣鎷変几寮圭獥 + const dragDom = el.querySelector(".el-dialog"); + dragDom.style.overflow = "hidden"; + let minWidth = 400; + let minHeight = 300; // - resizeEl.onmousedown = (e) => { - // 璁板綍鍒濆x浣嶇疆 - const clientX = e.clientX // 榧犳爣鎸変笅锛岃绠楀綋鍓嶅厓绱犺窛绂诲彲瑙嗗尯鐨勮窛绂� - const disX = e.clientX - resizeEl.offsetLeft - const disY = e.clientY - resizeEl.offsetTop + // 鎷変几 + let resizeEl = document.createElement("div"); + dragDom.appendChild(resizeEl); // 鍦ㄥ脊绐楀彸涓嬭鍔犱笂涓�涓�10-10px鐨勬帶鍒跺潡 + resizeEl.style.cursor = "nwse-resize"; + // resizeEl.style.cursor = 'se-resize' + resizeEl.style.position = "absolute"; + resizeEl.style.height = "12px"; + resizeEl.style.width = "12px"; + resizeEl.style.right = "0px"; + resizeEl.style.bottom = "0px"; //榧犳爣鎷変几寮圭獥 + resizeEl.style.background = 'url("/images/desktop/resize.png") no-repeat'; //榧犳爣鎷変几寮圭獥 - document.onmousemove = function(e) { - e.preventDefault() // 绉诲姩鏃剁鐢ㄩ粯璁や簨浠� // 閫氳繃浜嬩欢濮旀墭锛岃绠楃Щ鍔ㄧ殑璺濈 + resizeEl.onmousedown = (e) => { + // 璁板綍鍒濆x浣嶇疆 + const clientX = e.clientX; // 榧犳爣鎸変笅锛岃绠楀綋鍓嶅厓绱犺窛绂诲彲瑙嗗尯鐨勮窛绂� + const disX = e.clientX - resizeEl.offsetLeft; + const disY = e.clientY - resizeEl.offsetTop; - const x = e.clientX - disX + (e.clientX - clientX) //杩欓噷 鐢变簬elementUI鐨刣ialog鎺у埗灞呬腑鐨勶紝鎵�浠ユ按骞虫媺浼告晥鏋滄槸鍙屽�� - const y = e.clientY - disY //姣旇緝鏄惁灏忎簬鏈�灏忓楂� - dragDom.style.width = x > minWidth ? `${x}px` : minWidth + 'px' - dragDom.style.height = - y > minHeight ? `${y}px` : minHeight + 'px' - } //鎷変几缁撴潫 - document.onmouseup = function(e) { - document.onmousemove = null - document.onmouseup = null - } - } + document.onmousemove = function (e) { + e.preventDefault(); // 绉诲姩鏃剁鐢ㄩ粯璁や簨浠� 閫氳繃浜嬩欢濮旀墭锛岃绠楃Щ鍔ㄧ殑璺濈 + + const x = e.clientX - disX + (e.clientX - clientX); //杩欓噷 鐢变簬elementUI鐨刣ialog鎺у埗灞呬腑鐨勶紝鎵�浠ユ按骞虫媺浼告晥鏋滄槸鍙屽�� + const y = e.clientY - disY; //姣旇緝鏄惁灏忎簬鏈�灏忓楂� + dragDom.style.width = x > minWidth ? `${x}px` : minWidth + "px"; + dragDom.style.height = y > minHeight ? `${y}px` : minHeight + "px"; + }; //鎷変几缁撴潫 + document.onmouseup = function (e) { + document.onmousemove = null; + document.onmouseup = null; + }; + }; }, }, }; @@ -843,7 +843,6 @@ <style lang="scss"> .search-for-video-analyze { - //padding: 20px 30px; //鍑烘í鍚戞粴鍔ㄦ潯 padding: 20px 40px; .flex-box { @@ -975,8 +974,6 @@ } .config-submenu { .el-menu--horizontal { - //max-width: 700px; - //overflow-x: auto; left: 20px !important; & > ul { flex-wrap: wrap; @@ -1053,10 +1050,6 @@ margin: 0 -30px; margin-bottom: -30px; padding: 0; - // .el-row { - // display: flex; - // flex-wrap: wrap; - // } .el-table__row { cursor: pointer; } @@ -1090,9 +1083,6 @@ width: 100%; height: 100%; object-fit: contain; - // width: 100%; - // max-height: 200px; - // border-radius: 3px; } } .video-info { @@ -1164,21 +1154,17 @@ background: #f5f5f5; } } - .el-dialog__wrapper{ - top: -22px; + .el-dialog__wrapper { + top: -22px; } .dialog-video { - // z-index: 2020 !important; .el-dialog { width: 1180px; - // height: 893px; } .el-dialog__body { background: #eaeaea; padding: 0; - // height: 100%; - height: inherit; - + height: inherit; } .el-dialog__header { padding: 3px; @@ -1221,8 +1207,6 @@ .window-view { width: 100%; height: auto; - // height: 100%; - // min-height: 684px; overflow: auto; z-index: 2000; } -- Gitblit v1.8.0