| | |
| | | " |
| | | ></el-button> |
| | | </el-tooltip> |
| | | <p class="p-label" style="width: 16%"> |
| | | <b>标签:</b> |
| | | <p class="p-label" style="width: 13%"> |
| | | <b>底库:</b> |
| | | <el-select |
| | | v-model="tagValues" |
| | | multiple |
| | | :disabled="isDisabled" |
| | | collapse-tags |
| | | size="mini" |
| | | style="width: calc(100% - 40px); min-width: 120px" |
| | | placeholder="请选择" |
| | | style="width: calc(100% - 40px); min-width: 70px" |
| | | @change="tagChange" |
| | | placeholder="选择" |
| | | > |
| | | <el-option |
| | | v-for="item in VideoPhotoData.tabs" |
| | |
| | | ></el-option> |
| | | </el-select> |
| | | </p> |
| | | <p class="p-task" style="width: 16%"> |
| | | <p class="p-task" style="width: 13%"> |
| | | <b>场景:</b> |
| | | <el-select |
| | | v-model="taskValues" |
| | |
| | | :disabled="typeDisable" |
| | | collapse-tags |
| | | size="mini" |
| | | style="width: calc(100% - 40px); min-width: 120px" |
| | | placeholder="请选择" |
| | | style="width: calc(100% - 40px); min-width: 70px" |
| | | placeholder="选择" |
| | | > |
| | | <!-- <el-option |
| | | v-for="item in VideoPhotoData.tasks" |
| | |
| | | ></el-option> |
| | | </el-select> |
| | | </p> |
| | | <p class="p-level" style="width: 18%"> |
| | | |
| | | <p class="p-task" style="width: 12%"> |
| | | <b>关注:</b> |
| | | <el-select |
| | | v-model="collection" |
| | | @change="searchingBtn" |
| | | size="mini" |
| | | style="width: calc(100% - 40px); min-width: 70px" |
| | | placeholder="选择" |
| | | > |
| | | <el-option value="" label="全部"></el-option> |
| | | <el-option value="1" label="已关注"></el-option> |
| | | <el-option value="0" label="未关注"></el-option> |
| | | </el-select> |
| | | </p> |
| | | |
| | | <p class="p-level" style="width: 15%"> |
| | | <b>事件等级:</b> |
| | | <el-select |
| | | v-model="alarmValues" |
| | |
| | | collapse-tags |
| | | size="mini" |
| | | style="width: calc(100% - 64px); min-width: 120px" |
| | | placeholder="请选择" |
| | | placeholder="选择" |
| | | > |
| | | <el-option |
| | | v-for="item in VideoPhotoData.dictionary.ALARMLEVEL" |
| | |
| | | <el-date-picker |
| | | size="mini" |
| | | v-model="searchTime" |
| | | @change="searchingBtn" |
| | | @change="changeTime" |
| | | type="datetimerange" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | |
| | | style="width: 99%; min-width: 200px" |
| | | ></el-date-picker> |
| | | </p> |
| | | <p class="p-input" style="width: 19%"> |
| | | <p class="p-input" style="width: 16%"> |
| | | <el-input |
| | | placeholder="请输入内容" |
| | | placeholder="请输入" |
| | | prefix-icon="el-icon-search" |
| | | style=" |
| | | width: calc(100% - 75px); |
| | | min-width: 100px; |
| | | min-width: 85px; |
| | | margin-left: 10px; |
| | | margin-right: 10px; |
| | | " |
| | |
| | | tagValues: [], |
| | | alarmValues: [], |
| | | taskValues: [], |
| | | collection: "", |
| | | searchTime: [ |
| | | this.$moment().format("YYYY-MM-DD 00:00:00"), |
| | | this.$moment().format("YYYY-MM-DD HH:mm:ss"), |
| | |
| | | this.$nextTick(() => { |
| | | let scrollContain = this.$refs.scrollContain; |
| | | this.VideoPhotoData.scrollContainDom = scrollContain; |
| | | let list = this.TreeDataPool.localVedioList.filter((i) => { |
| | | return i.progress == 100; |
| | | }); |
| | | this.TreeDataPool.localVedioList = list; |
| | | // let list = this.TreeDataPool.localVedioList.filter((i) => { |
| | | // return i.progress == 100 |
| | | // }) |
| | | // this.TreeDataPool.localVedioList = list |
| | | }); |
| | | window.addEventListener("resize", this.getHeight); |
| | | this.getCenter(); |
| | |
| | | watch: { |
| | | "TreeDataPool.treeActiveName"(n, o) { |
| | | if (n && n == "camera") { |
| | | this.VideoPhotoData.dataSource = "camera"; |
| | | this.VideoPhotoData.treeNodes = []; |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | } else { |
| | | this.VideoPhotoData.dataSource = "stack"; |
| | | } |
| | | }, |
| | | "TreeDataPool.showTreeBox"(value) { |
| | |
| | | "VideoPhotoData.activeCard": function (value) { |
| | | let card = |
| | | this.$refs.scrollContain.getElementsByClassName("my-active-card"); |
| | | console.log(1); |
| | | console.log(card); |
| | | |
| | | if (card.length > 0) { |
| | | let cardHeight = card[0].clientHeight; |
| | | let cardTop = card[0].offsetTop; |
| | | let scrollTop = this.$refs.scrollContain.scrollTop; |
| | | let divHeight = this.$refs.scrollContain.clientHeight; |
| | | console.log(2); |
| | | console.log(cardHeight); |
| | | console.log(cardTop); |
| | | console.log(scrollTop); |
| | | console.log(divHeight); |
| | | if ( |
| | | cardTop - cardHeight - scrollTop > divHeight || |
| | | cardTop - cardHeight - scrollTop < 0 |
| | |
| | | this.CardList.details = Array.from( |
| | | new Set([...this.CardList.details, ...[obj]]) |
| | | ); |
| | | console.log(this.CardList.details); |
| | | // this.CardList.details.push(obj); |
| | | this.VideoPhotoData.activeCard = obj.activeObject.id; |
| | | }, |
| | |
| | | ]; |
| | | }, |
| | | format(array) { |
| | | if (array.length === 0) { |
| | | return []; |
| | | } |
| | | return [ |
| | | this.$moment(array[0]).format("YYYY-MM-DD HH:mm:ss"), |
| | | this.$moment(array[1]).format("YYYY-MM-DD HH:mm:ss"), |
| | | ]; |
| | | }, |
| | | searchingBtn() { |
| | | // let obj = document.getElementById('searchMid'); |
| | | // let load = this.$loading({ |
| | | // target:obj, |
| | | // }) |
| | | // load.close(); |
| | | // this.AuthData.loading = true |
| | | this.VideoPhotoData.page = 1; |
| | | this.VideoPhotoData.queryTabs = this.tagValues; |
| | | //处理搜索类型 |
| | |
| | | this.VideoPhotoData.searchTime = this.format(this.searchTime); |
| | | //this.VideoPhotoData.inputValue = this.searchText; |
| | | this.VideoPhotoData.showType = this.showType; |
| | | this.VideoPhotoData.collection = this.collection; |
| | | if (!this.VideoPhotoData.uploadType) { |
| | | this.VideoPhotoData.uploadDiaplay = false; |
| | | //this.VideoPhotoData.page = this.currentPage; |
| | |
| | | clearSearch() { |
| | | this.tagValues = []; |
| | | this.taskValues = []; |
| | | this.collection = ""; |
| | | this.alarmValues = []; |
| | | this.VideoPhotoData.queryTabs = []; |
| | | this.VideoPhotoData.queryTasks = []; |
| | | this.VideoPhotoData.queryAlarmlevel = []; |
| | | this.VideoPhotoData.searchTime = this.getDateInit(); |
| | | this.VideoPhotoData.inputValue = ""; |
| | | this.VideoPhotoData.collection = ""; |
| | | this.searchTime = this.getDateInit(); |
| | | if (!this.VideoPhotoData.uploadType) { |
| | | // this.VideoPhotoData.querySearchList(); |
| | |
| | | |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | }, |
| | | changeTime(val) { |
| | | if (!val) { |
| | | this.searchTime = []; |
| | | } |
| | | |
| | | this.searchingBtn(); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |