| | |
| | | <div class="searching-box"> |
| | | <div class="searching-right"> |
| | | <div class="searching-right-nav"> |
| | | <el-breadcrumb separator-class="el-icon-arrow-right" style="display: inline-block;"> |
| | | <el-breadcrumb |
| | | separator-class="el-icon-arrow-right" |
| | | style="display: inline-block" |
| | | > |
| | | <el-breadcrumb-item> |
| | | <span @click="uploadChange()">检索</span> |
| | | <span @click="uploadChange">检索</span> |
| | | </el-breadcrumb-item> |
| | | <el-breadcrumb-item v-if="!VideoPhotoData.uploadType">全部</el-breadcrumb-item> |
| | | <el-breadcrumb-item v-if="VideoPhotoData.uploadType">以图搜图</el-breadcrumb-item> |
| | | <el-breadcrumb-item v-if="!VideoPhotoData.uploadType" |
| | | >全部</el-breadcrumb-item |
| | | > |
| | | <el-breadcrumb-item v-if="VideoPhotoData.uploadType" |
| | | >以图搜图</el-breadcrumb-item |
| | | > |
| | | </el-breadcrumb> |
| | | </div> |
| | | <div class="searching-right-content"> |
| | | <div class="top"> |
| | | <el-tooltip content="以图搜图" placement="bottom" popper-class="atooltip"> |
| | | <el-tooltip |
| | | content="以图搜图" |
| | | placement="bottom" |
| | | popper-class="atooltip" |
| | | > |
| | | <el-button |
| | | @click="showUpload" |
| | | type="primary" |
| | | icon="el-icon-camera-solid" |
| | | size="mini" |
| | | circle |
| | | :style="VideoPhotoData.uploadDiaplay ? 'margin-right: 20px;' : 'margin-right: 20px;background-color:#cccccc;border-color:#cccccc'" |
| | | :style=" |
| | | VideoPhotoData.uploadDiaplay |
| | | ? 'margin-right: 20px;' |
| | | : 'margin-right: 20px;background-color:#cccccc;border-color:#cccccc' |
| | | " |
| | | ></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 |
| | | @change="searchingBtn" |
| | | :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" |
| | | style="font-size:12px" |
| | | style="font-size: 12px" |
| | | :key="item.key" |
| | | :label="item.title" |
| | | :value="item.value" |
| | |
| | | ></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-option |
| | | v-for="item in VideoPhotoData.tasks" |
| | | style="font-size:12px" |
| | | :key="item.id+'x'" |
| | | style="font-size: 12px" |
| | | :key="item.id + 'x'" |
| | | :value="item.id" |
| | | :label="item.isDelete ? item.name+'(已删除)' : item.name" |
| | | :title="item.isDelete ? item.name+'(已删除)' : item.name" |
| | | :label="item.isDelete ? item.name + '(已删除)' : item.name" |
| | | :title="item.isDelete ? item.name + '(已删除)' : item.name" |
| | | ></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" |
| | |
| | | :disabled="isDisabled" |
| | | collapse-tags |
| | | size="mini" |
| | | style="width:calc(100% - 64px);min-width: 120px;" |
| | | placeholder="请选择" |
| | | style="width: calc(100% - 64px); min-width: 120px" |
| | | placeholder="选择" |
| | | > |
| | | <el-option |
| | | v-for="item in VideoPhotoData.dictionary.ALARMLEVEL" |
| | |
| | | ></el-option> |
| | | </el-select> |
| | | </p> |
| | | <p class="p-date" style="width:19%"> |
| | | <p class="p-date" style="width: 19%; vertical-align: top"> |
| | | <el-date-picker |
| | | size="mini" |
| | | v-model="searchTime" |
| | | @change="searchingBtn" |
| | | @change="changeTime" |
| | | type="datetimerange" |
| | | start-placeholder="开始日期" |
| | | end-placeholder="结束日期" |
| | | :default-time="['00:00:00','23:59:59']" |
| | | style="width:99%;min-width:200px" |
| | | :default-time="['00:00:00', '23:59:59']" |
| | | 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;margin-left:10px;margin-right: 10px;" |
| | | style=" |
| | | width: calc(100% - 75px); |
| | | min-width: 85px; |
| | | margin-left: 10px; |
| | | margin-right: 10px; |
| | | " |
| | | v-model="VideoPhotoData.inputValue" |
| | | size="mini" |
| | | ></el-input> |
| | | <el-button type="primary" size="mini" @click="searchingBtn">搜索</el-button> |
| | | <el-button type="primary" size="mini" @click="searchingBtn" |
| | | >搜索</el-button |
| | | > |
| | | </p> |
| | | <p class="p-clear"> |
| | | <b class="clear-searching" @click="clearSearch">重置</b> |
| | | </p> |
| | | </div> |
| | | <div ref="mid" style="height:calc(100% - 72px)"> |
| | | <!-- <div id="searchMid" class="mid" ref="scrollContain" v-if="!VideoPhotoData.uploadDiaplay"> |
| | | <Card |
| | | :class="item.activeObject.id === VideoPhotoData.activeCard ? 'my-active-card' : ''" |
| | | v-for="(item, index) in VideoPhotoData.cards" |
| | | :key="index + 'a'" |
| | | :outHeight="'155px'" |
| | | :outWidth="cardWidth" |
| | | :data="item" |
| | | :showType="showType" |
| | | @detailsClick="getDetails($event, index)" |
| | | @addToBase="toAdd" |
| | | ></Card> |
| | | </div>--> |
| | | <div id="searchMid" class="mid"> |
| | | <div class="left-selection" v-if="VideoPhotoData.uploadDiaplay"> |
| | | <upload-img ref="uploadImg" @labelDisabled="disabled"></upload-img> |
| | | </div> |
| | | <div |
| | | class="right-section" |
| | | ref="scrollContain" |
| | | :style="VideoPhotoData.uploadDiaplay ? 'calc(100% - 315px)' : 'width:100%'" |
| | | > |
| | | <div ref="mid" style="height: calc(100% - 50px)"> |
| | | <div class="left-selection" v-if="VideoPhotoData.uploadDiaplay"> |
| | | <upload-img ref="uploadImg" @labelDisabled="disabled"></upload-img> |
| | | </div> |
| | | <div |
| | | id="searchMid" |
| | | class="mid" |
| | | :style="{ |
| | | width: VideoPhotoData.uploadDiaplay |
| | | ? 'calc(100% - 315px)' |
| | | : '100%', |
| | | }" |
| | | > |
| | | <div class="right-section" ref="scrollContain"> |
| | | <Card |
| | | v-for="(item, index) in VideoPhotoData.cards" |
| | | :class="item.activeObject.id === VideoPhotoData.activeCard ? 'my-active-card' : ''" |
| | | :class=" |
| | | item.activeObject.id === VideoPhotoData.activeCard |
| | | ? 'my-active-card' |
| | | : '' |
| | | " |
| | | :key="index + 'u'" |
| | | :outHeight="'162px'" |
| | | :outWidth="VideoPhotoData.uploadDiaplay?searchImgCardWidth:cardWidth" |
| | | :outWidth=" |
| | | VideoPhotoData.uploadDiaplay ? searchImgCardWidth : cardWidth |
| | | " |
| | | :data="item" |
| | | :searchTime="searchTimeFormated" |
| | | :showType="showType" |
| | | @detailsClick="getDetails($event, index)" |
| | | @addToBase="toAdd" |
| | | ></Card> |
| | | <div class="foot"> |
| | | <el-pagination |
| | | :current-page="VideoPhotoData.page" |
| | | @current-change="changePages" |
| | | @size-change="sizeChange" |
| | | :page-sizes="VideoPhotoData.pageSizeOption" |
| | | :page-size="VideoPhotoData.size" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="VideoPhotoData.total" |
| | | ></el-pagination> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | </div> |
| | | <div class="foot"> |
| | | <el-pagination |
| | | :current-page="VideoPhotoData.page" |
| | | @current-change="changePages" |
| | | @size-change="sizeChange" |
| | | :page-sizes="VideoPhotoData.pageSizeOption" |
| | | :page-size="VideoPhotoData.size" |
| | | layout="total, sizes, prev, pager, next, jumper" |
| | | :total="VideoPhotoData.total" |
| | | ></el-pagination> |
| | | </div> |
| | | </div> |
| | | </div> |
| | |
| | | :key="index" |
| | | @update:height="resizeHeight" |
| | | @update:width="resizeWidth" |
| | | style="background:white; height:475px" |
| | | style="background: white; height: 475px" |
| | | :left="center.x + index * 10" |
| | | :top="center.y + index * 10" |
| | | :resizable="true" |
| | |
| | | <p>黑名单 ></p> |
| | | </div> |
| | | <div class="baseList"> |
| | | <el-checkbox-group v-model="VideoPhotoData.selectBlacks" @change="blackAngWhite"> |
| | | <div class="base" v-for="(item, index) in VideoPhotoData.blackList" :key="index"> |
| | | <el-checkbox-group |
| | | v-model="VideoPhotoData.selectBlacks" |
| | | @change="blackAngWhite" |
| | | > |
| | | <div |
| | | class="base" |
| | | v-for="(item, index) in VideoPhotoData.blackList" |
| | | :key="index" |
| | | > |
| | | <el-checkbox |
| | | :label="item.value" |
| | | :title="item.title" |
| | | :disabled="item.disabled" |
| | | >{{item.title}}</el-checkbox> |
| | | >{{ item.title }}</el-checkbox |
| | | > |
| | | </div> |
| | | </el-checkbox-group> |
| | | </div> |
| | |
| | | <p>白名单 ></p> |
| | | </div> |
| | | <div class="baseList"> |
| | | <el-checkbox-group v-model="VideoPhotoData.selectWhites" @change="blackAngWhite"> |
| | | <div class="base" v-for="(item, index) in VideoPhotoData.whiteList" :key="index"> |
| | | <el-checkbox-group |
| | | v-model="VideoPhotoData.selectWhites" |
| | | @change="blackAngWhite" |
| | | > |
| | | <div |
| | | class="base" |
| | | v-for="(item, index) in VideoPhotoData.whiteList" |
| | | :key="index" |
| | | > |
| | | <el-checkbox |
| | | :label="item.value" |
| | | :title="item.title" |
| | | :disabled="item.disabled" |
| | | >{{item.title}}</el-checkbox> |
| | | >{{ item.title }}</el-checkbox |
| | | > |
| | | </div> |
| | | </el-checkbox-group> |
| | | </div> |
| | | </div> |
| | | <div class="buttons"> |
| | | <el-button type="primary" @click="saveAddBase(item, index)">保存</el-button> |
| | | <el-button type="default" @click="closeWindow(index)">取消</el-button> |
| | | <el-button type="primary" @click="saveAddBase(item, index)" |
| | | >保存</el-button |
| | | > |
| | | <el-button type="default" @click="closeWindow(index)" |
| | | >取消</el-button |
| | | > |
| | | </div> |
| | | </div> |
| | | </hsc-window> |
| | |
| | | import Card from "@/components/subComponents/Card"; |
| | | import UploadImg from "@/components/searching/UploadImg"; |
| | | import bus from "./main"; |
| | | import { getUrlKey } from "@/api/utils"; |
| | | export default { |
| | | components: { |
| | | Card, |
| | | UploadImg |
| | | UploadImg, |
| | | }, |
| | | data() { |
| | | return { |
| | |
| | | searchImgCardWidth: "", |
| | | tagValues: [], |
| | | alarmValues: [], |
| | | dialogVisible: false, |
| | | taskValues: [], |
| | | collection: "", |
| | | searchTime: [ |
| | | this.$moment().format("YYYY-MM-DD 00:00:00"), |
| | | this.$moment().format("YYYY-MM-DD HH:mm:ss") |
| | | this.$moment().format("YYYY-MM-DD HH:mm:ss"), |
| | | ], |
| | | searchText: "", |
| | | currentPage: 1, |
| | | |
| | | }; |
| | | }, |
| | | |
| | | computed: { |
| | | searchTimeFormated() { |
| | | return this.format(this.searchTime); |
| | | }, |
| | | }, |
| | | created() { |
| | | this.TreeDataPool.readonly = true; |
| | | this.TreeDataPool.gbReadonly = true; |
| | |
| | | }, |
| | | mounted() { |
| | | 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 scrollContain = this.$refs.scrollContain; |
| | | this.VideoPhotoData.scrollContainDom = scrollContain; |
| | | // let list = this.TreeDataPool.localVedioList.filter((i) => { |
| | | // return i.progress == 100 |
| | | // }) |
| | | // this.TreeDataPool.localVedioList = list |
| | | }); |
| | | window.addEventListener("resize", this.getHeight); |
| | | this.getCenter(); |
| | | this.getHeight(); |
| | |
| | | // this.VideoTaskData.tasks[this.VideoTaskData.activeIndex].taskId |
| | | // ]; |
| | | // } |
| | | |
| | | this.searchTime = this.getDateInit(); |
| | | this.VideoPhotoData.searchTime = this.getDateInit(); |
| | | let start = getUrlKey("start"); |
| | | let end = getUrlKey("end"); |
| | | if (start && end) { |
| | | this.searchTime = [start, end]; |
| | | this.VideoPhotoData.searchTime = [start, end]; |
| | | } else { |
| | | this.searchTime = this.getDateInit(); |
| | | this.VideoPhotoData.searchTime = this.getDateInit(); |
| | | } |
| | | |
| | | // 暂时关闭跳转 20200730 |
| | | // if (this.$route.query.showType === "findByPic") { |
| | | if (0) { |
| | | if (getUrlKey("showType")) { |
| | | this.VideoPhotoData.uploadDiaplay = true; |
| | | console.log("别处跳过来的以图搜图"); |
| | | this.VideoPhotoData.picUrl = this.$route.query.picSmUrl; |
| | | this.VideoPhotoData.uploadImg = this.$route.query.picSmUrl; |
| | | this.VideoPhotoData.uploadType = true |
| | | this.VideoPhotoData.compTargetId = this.$route.query.targetId |
| | | this.VideoPhotoData.compTargetType = this.$route.query.compType |
| | | this.VideoPhotoData.size = 30 |
| | | this.VideoPhotoData.picUrl = getUrlKey("picSmUrl"); |
| | | this.VideoPhotoData.uploadImg = getUrlKey("picSmUrl"); |
| | | this.VideoPhotoData.uploadType = true; |
| | | this.VideoPhotoData.compTargetId = getUrlKey("targetId"); |
| | | this.VideoPhotoData.compTargetType = getUrlKey("compType"); |
| | | this.VideoPhotoData.size = 30; |
| | | this.VideoPhotoData.compareTabs = ["esData"]; |
| | | this.VideoPhotoData.findPerson2(); // 查找此人 |
| | | // this.$nextTick(() => { |
| | | // this.$refs.uploadImg.rightSectionDisplay = true; |
| | | // }); |
| | | } else { |
| | | this.searchTime = this.getDateInit(); |
| | | this.VideoPhotoData.searchTime = this.getDateInit(); |
| | |
| | | this.VideoPhotoData.queryTaskList(); |
| | | this.VideoPhotoData.queryDictionary(); |
| | | this.$nextTick(() => { |
| | | bus.$on("changePage", page => { |
| | | bus.$on("changePage", (page) => { |
| | | this.currentPage = page; |
| | | this.VideoPhotoData.page = page; |
| | | }); |
| | |
| | | this.VideoPhotoData.selectWhites = []; |
| | | }, |
| | | 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) { |
| | | this.getHeight(); |
| | | if (this.VideoPhotoData.realSmallPath.length > 0) { |
| | |
| | | // "TreeDataPool.selectedNodes": function(newValue,oldValue) { |
| | | // if (newValue !== oldValue) { |
| | | // this.VideoPhotoData.treeNodes = newValue; |
| | | // console.log("监听树节点中的刷新方法", newValue,oldValue); |
| | | // this.VideoPhotoData.querySearchList(); |
| | | // } |
| | | // }, |
| | |
| | | if (newVal !== oldVal) { |
| | | this.VideoPhotoData.treeNodes = newVal; |
| | | if (this.VideoPhotoData.uploadType) { |
| | | this.VideoPhotoData.findPersonByPage() |
| | | this.VideoPhotoData.findPersonByPage(); |
| | | } else { |
| | | // this.VideoPhotoData.querySearchList(); |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | } |
| | | } |
| | | }, |
| | | deep: true //深度监听 |
| | | deep: true, //深度监听 |
| | | }, |
| | | "DataStackPool.selectedDir": { |
| | | handler(nodes, oldNodes) { |
| | | if (nodes !== oldNodes) { |
| | | if (nodes !== oldNodes && nodes.id != "") { |
| | | // this.VideoPhotoData.treeNodes = nodes.map(i=>{return i.id}); |
| | | this.VideoPhotoData.treeNodes = [nodes.id]; |
| | | if (this.VideoPhotoData.uploadType) { |
| | | this.VideoPhotoData.findPersonByPage() |
| | | this.VideoPhotoData.findPersonByPage(); |
| | | } else { |
| | | // this.VideoPhotoData.querySearchList(); |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | } |
| | | } |
| | | }, |
| | | deep: true |
| | | deep: true, |
| | | }, |
| | | "VideoPhotoData.activeCard": function (value) { |
| | | let card = this.$refs.scrollContain.getElementsByClassName("my-active-card"); |
| | | let card = |
| | | this.$refs.scrollContain.getElementsByClassName("my-active-card"); |
| | | |
| | | if (card.length > 0) { |
| | | let cardHeight = card[0].clientHeight; |
| | |
| | | } |
| | | }, |
| | | "VideoPhotoData.uploadType": function (value) { |
| | | console.log("页面模式:", value) |
| | | if (value) { |
| | | this.typeDisable = true; |
| | | this.disabled = true; |
| | | } else { |
| | | this.typeDisable = false; |
| | | this.VideoPhotoData.querySearchList(); |
| | | } |
| | | }, |
| | | "VideoPhotoData.selectBlacks": function (value) { |
| | | this.blackAngWhite() |
| | | this.blackAngWhite(); |
| | | }, |
| | | "VideoPhotoData.selectWhites": function (value) { |
| | | this.blackAngWhite() |
| | | }, |
| | | tagValues: function (newValue, oldValue) { |
| | | if (newValue.length > 0) { |
| | | this.showType = "compare"; |
| | | } else { |
| | | this.showType = "search"; |
| | | } |
| | | if (newValue.length !== oldValue.length) { |
| | | console.log("tagValue中的刷新方法"); |
| | | // this.VideoPhotoData.querySearchList(); |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | } |
| | | this.blackAngWhite(); |
| | | }, |
| | | "VideoPhotoData.uploadDiaplay": function (value) { |
| | | this.getHeight(); |
| | | console.log("upload的值是:", value) |
| | | if (value) { |
| | | if (!this.VideoPhotoData.uploadType) { |
| | | console.log("uploadDisplay中的刷新"); |
| | | let scrollContain = this.$refs.scrollContain |
| | | this.VideoPhotoData.scrollContainDom = scrollContain |
| | | let scrollContain = this.$refs.scrollContain; |
| | | this.VideoPhotoData.scrollContainDom = scrollContain; |
| | | this.VideoPhotoData.showType = "search"; |
| | | // this.VideoPhotoData.querySearchList(); |
| | | //this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | |
| | | this.VideoPhotoData.uploadType = false; |
| | | this.VideoPhotoData.showType = "search"; |
| | | } |
| | | } |
| | | }, |
| | | }, |
| | | methods: { |
| | | isShowUpload() { |
| | | this.getHeight(); |
| | | if (this.VideoPhotoData.uploadDiaplay) { |
| | | if (!this.VideoPhotoData.uploadType) { |
| | | let scrollContain = this.$refs.scrollContain; |
| | | this.VideoPhotoData.scrollContainDom = scrollContain; |
| | | this.VideoPhotoData.showType = "search"; |
| | | // this.VideoPhotoData.querySearchList(); |
| | | //this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | this.isDisabled = false; |
| | | } else { |
| | | //this.VideoPhotoData.scrollContainDom = ''; |
| | | this.VideoPhotoData.showType = "findByPic"; |
| | | } |
| | | } else { |
| | | this.VideoPhotoData.uploadType = false; |
| | | this.VideoPhotoData.showType = "search"; |
| | | } |
| | | }, |
| | | resizeWidth(w) { |
| | | this.defaultWidth = w; |
| | | }, |
| | |
| | | let w = this.$refs.mid.offsetWidth; |
| | | let integer = parseInt(w / 330); |
| | | let integerSearchImg = parseInt((w - 300) / 325); |
| | | this.handleSizeChange(integer, integerSearchImg); |
| | | |
| | | // 取消size修改 |
| | | // this.handleSizeChange(integer, integerSearchImg); |
| | | |
| | | this.cardWidth = `calc(${100 / integer}% - 20px)`; |
| | | this.searchImgCardWidth = `calc(${100 / integerSearchImg}% - 20px)`; |
| | | }, |
| | | uploadChange() { |
| | | this.VideoPhotoData.uploadDiaplay = false; |
| | | this.VideoPhotoData.clearStatus(); |
| | | }, |
| | | blackAngWhite() { |
| | | if (this.VideoPhotoData.selectBlacks.length > 0) { |
| | | for (let i = 0; i < this.VideoPhotoData.whiteList.length; i++) { |
| | | //this.VideoPhotoData.whiteList[i].disabled = true |
| | | this.$set(this.VideoPhotoData.whiteList[i], 'disabled', true) |
| | | this.$set(this.VideoPhotoData.whiteList[i], "disabled", true); |
| | | } |
| | | } |
| | | if (this.VideoPhotoData.selectBlacks.length == 0) { |
| | | for (let i = 0; i < this.VideoPhotoData.whiteList.length; i++) { |
| | | //this.VideoPhotoData.whiteList[i].disabled = false |
| | | this.$set(this.VideoPhotoData.whiteList[i], 'disabled', false) |
| | | this.$set(this.VideoPhotoData.whiteList[i], "disabled", false); |
| | | } |
| | | } |
| | | if (this.VideoPhotoData.selectWhites.length > 0) { |
| | | for (let i = 0; i < this.VideoPhotoData.blackList.length; i++) { |
| | | // this.VideoPhotoData.blackList[i].disabled = true |
| | | this.$set(this.VideoPhotoData.blackList[i], 'disabled', true) |
| | | // this.VideoPhotoData.blackList[i].disabled = true |
| | | this.$set(this.VideoPhotoData.blackList[i], "disabled", true); |
| | | } |
| | | } |
| | | if (this.VideoPhotoData.selectWhites.length == 0) { |
| | | for (let i = 0; i < this.VideoPhotoData.blackList.length; i++) { |
| | | //this.VideoPhotoData.blackList[i].disabled = false |
| | | this.$set(this.VideoPhotoData.blackList[i], 'disabled', false) |
| | | //this.VideoPhotoData.blackList[i].disabled = false |
| | | this.$set(this.VideoPhotoData.blackList[i], "disabled", false); |
| | | } |
| | | } |
| | | }, |
| | | saveAddBase(item, index) { |
| | | if (this.VideoPhotoData.selectBlacks.length === 0 && this.VideoPhotoData.selectWhites.length === 0) { |
| | | if ( |
| | | this.VideoPhotoData.selectBlacks.length === 0 && |
| | | this.VideoPhotoData.selectWhites.length === 0 |
| | | ) { |
| | | this.$notify({ |
| | | title: "注意", |
| | | message: "请选择要添加的底库", |
| | | type: "warning" |
| | | }) |
| | | return |
| | | type: "warning", |
| | | }); |
| | | return; |
| | | } |
| | | let res = this.VideoPhotoData.addBase(item) |
| | | res.then(data => { |
| | | console.log("then", data) |
| | | let res = this.VideoPhotoData.addBase(item); |
| | | res.then((data) => { |
| | | if (data.success) { |
| | | this.$notify({ |
| | | title: "成功", |
| | | message: data.data, |
| | | type: "success" |
| | | }) |
| | | type: "success", |
| | | }); |
| | | } else { |
| | | this.$notify({ |
| | | title: "失败", |
| | | message: data.data, |
| | | type: "error" |
| | | }) |
| | | type: "error", |
| | | }); |
| | | } |
| | | this.CardList.addBaseList.splice(index, 1); |
| | | this.VideoPhotoData.selectBlacks = [] |
| | | this.VideoPhotoData.selectWhites = [] |
| | | }) |
| | | this.VideoPhotoData.selectBlacks = []; |
| | | this.VideoPhotoData.selectWhites = []; |
| | | }); |
| | | }, |
| | | getDetails(ev, index) { |
| | | //let obj = this.CardList.datalist[index]; |
| | |
| | | this.VideoPhotoData.activeCard = obj.activeObject.id; |
| | | }, |
| | | toAdd(item) { |
| | | this.CardList.addBaseList.push(item) |
| | | this.CardList.addBaseList.push(item); |
| | | }, |
| | | handleClose(done) { |
| | | this.$confirm('确认关闭?') |
| | | .then(_ => { |
| | | this.$confirm("确认关闭?") |
| | | .then((_) => { |
| | | done(); |
| | | }) |
| | | .catch(_ => { }); |
| | | .catch((_) => {}); |
| | | }, |
| | | showUpload() { |
| | | this.VideoPhotoData.uploadDiaplay = !this.VideoPhotoData.uploadDiaplay; |
| | |
| | | end.setTime(nowDate.getTime() + 3600 * 1000 * 24 - 1); |
| | | return [ |
| | | this.$moment(start).format("YYYY-MM-DD HH:mm:ss"), |
| | | this.$moment(end).format("YYYY-MM-DD HH:mm:ss") |
| | | this.$moment(end).format("YYYY-MM-DD HH:mm:ss"), |
| | | ]; |
| | | }, |
| | | 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") |
| | | this.$moment(array[1]).format("YYYY-MM-DD HH:mm:ss"), |
| | | ]; |
| | | }, |
| | | searchingBtn() { |
| | | // let obj = document.getElementById('searchMid'); |
| | | // console.log(obj,'target',document) |
| | | // let load = this.$loading({ |
| | | // target:obj, |
| | | // }) |
| | | // load.close(); |
| | | // console.log(load,'loading') |
| | | // this.AuthData.loading = true |
| | | this.VideoPhotoData.page = 1; |
| | | this.VideoPhotoData.queryTabs = this.tagValues; |
| | | //处理搜索类型 |
| | | var tempArr = this.taskValues.map(task => task.split(',')); |
| | | var tempArr = this.taskValues.map((task) => task.split(",")); |
| | | var tasks = []; |
| | | tempArr.forEach(arr => { |
| | | tasks = tasks.concat(arr) |
| | | tempArr.forEach((arr) => { |
| | | tasks = tasks.concat(arr); |
| | | }); |
| | | this.VideoPhotoData.queryTasks = tasks; |
| | | |
| | |
| | | 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) { |
| | | console.log("查询方法"); |
| | | this.VideoPhotoData.uploadDiaplay = false; |
| | | //this.VideoPhotoData.page = this.currentPage; |
| | | // this.VideoPhotoData.querySearchList(); |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | } else { |
| | | console.log("以图搜图"); |
| | | //this.VideoPhotoData.page = this.currentPage; |
| | | // this.VideoPhotoData.findPersonByPage(); |
| | | this.setLoadSearch(this.VideoPhotoData.findPersonByPage()); |
| | |
| | | }, |
| | | stringToNum() { |
| | | var arr = []; |
| | | this.alarmValues.forEach(element => { |
| | | this.alarmValues.forEach((element) => { |
| | | if (element == "-1") { |
| | | arr.push(-1); |
| | | } |
| | |
| | | arr.push(5); |
| | | } |
| | | }); |
| | | // console.log("输出的数组:", arr); |
| | | return arr; |
| | | }, |
| | | changePages(page) { |
| | | this.VideoPhotoData.page = page; |
| | | if (!this.VideoPhotoData.uploadType) { |
| | | console.log("分页改变!") |
| | | this.VideoPhotoData.uploadDiaplay = false; |
| | | // this.VideoPhotoData.querySearchList(); |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | |
| | | } |
| | | }, |
| | | clearSearch() { |
| | | this.tagValues = [] |
| | | this.taskValues = [] |
| | | this.alarmValues = [] |
| | | 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(); |
| | |
| | | getCenter() { |
| | | this.center = { |
| | | x: document.documentElement.clientWidth / 2 - 250, |
| | | y: document.documentElement.clientHeight / 2 - 200 |
| | | y: document.documentElement.clientHeight / 2 - 200, |
| | | }; |
| | | }, |
| | | setLoadSearch(fn) { |
| | | this.AuthData.setLoading("searchMid", this); |
| | | fn.then(_ => { |
| | | fn.then((_) => { |
| | | this.AuthData.closeLoad(); |
| | | }) |
| | | } |
| | | } |
| | | }); |
| | | }, |
| | | tagChange(obj) { |
| | | if (obj.length > 0) { |
| | | this.showType = "compare"; |
| | | } else { |
| | | this.showType = "search"; |
| | | } |
| | | |
| | | this.VideoPhotoData.queryTabs = obj; |
| | | |
| | | this.setLoadSearch(this.VideoPhotoData.querySearchList()); |
| | | }, |
| | | changeTime(val) { |
| | | if (!val) { |
| | | this.searchTime = []; |
| | | } |
| | | |
| | | this.searchingBtn(); |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | |
| | |
| | | height: 100%; |
| | | padding: 0px 20px; |
| | | box-sizing: border-box; |
| | | |
| | | //临时 |
| | | .el-carousel__item.is-active { |
| | | z-index: 0 !important; |
| | | } |
| | | //临时 |
| | | |
| | | .searching-right-nav { |
| | | height: 50px; |
| | | width: 100%; |
| | |
| | | color: rgba(0, 0, 0, 0.78) !important; |
| | | } |
| | | .searching-right-content { |
| | | height: calc(100% - 135px); |
| | | height: calc(100% - 80px); |
| | | width: 100%; |
| | | box-sizing: border-box; |
| | | .top { |
| | |
| | | } |
| | | } |
| | | .mid { |
| | | width: 100%; |
| | | height: 100%; |
| | | padding: 10px; |
| | | //width: 100%; |
| | | //height: 100%; |
| | | padding: 5px; |
| | | overflow: auto; |
| | | position: relative; |
| | | .my-card { |
| | |
| | | overflow: hidden; |
| | | width: 100%; |
| | | height: 80px; |
| | | line-height: 80px; |
| | | padding-top: 24px; |
| | | //line-height: 80px; |
| | | padding-top: 20px; |
| | | padding-right: 24px; |
| | | box-sizing: border-box; |
| | | text-align: right; |
| | |
| | | white-space: nowrap; |
| | | text-overflow: ellipsis; |
| | | } |
| | | .titlebar { |
| | | height: 10px !important; |
| | | background: #fff !important; |
| | | .button { |
| | | position: absolute; |
| | | font-size: 25px !important; |
| | | right: 10px; |
| | | top: 10px; |
| | | z-index: 3; |
| | | } |
| | | } |
| | | .addToBase { |
| | | width: 98%; |
| | | height: 450px; |
| | | height: 430px; |
| | | position: relative; |
| | | .topLabel { |
| | | margin-top: 20px; |
| | |
| | | } |
| | | </style> |
| | | <style lang="scss" scoped> |
| | | .left-selection { |
| | | width: 300px; |
| | | height: 100%; |
| | | float: left; |
| | | margin-right: 15px; |
| | | } |
| | | #searchMid { |
| | | height: 100%; |
| | | box-sizing: border-box; |
| | | .el-loading-mask { |
| | | .el-loading-spinner { |
| | | width: 100%; |
| | | height: 100%; |
| | | .el-loading-spinner-search { |
| | | background: url("../../../assets/gif/searchLoading.gif") no-repeat; |
| | | background: url("/images/search/searchLoading.gif") no-repeat; |
| | | } |
| | | } |
| | | } |
| | | .left-selection { |
| | | width: 300px; |
| | | height: 100%; |
| | | float: left; |
| | | margin-right: 15px; |
| | | } |
| | | |
| | | .right-section { |
| | | //width: calc(100% - 315px); |
| | | height: 100%; |
| | | float: left; |
| | | padding-bottom: 20px; |
| | | box-sizing: border-box; |
| | | //float: left; |
| | | overflow: auto; |
| | | position: relative; |
| | | } |