From 21a340c24815a55a07db2dc3d2e5a19e7de440cd Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期六, 29 八月 2020 19:27:57 +0800 Subject: [PATCH] 添加摄像机区域管理应用 --- src/pages/search/index/Searching.vue | 109 ++++++++++++++++++++++++++++++++++++++---------------- 1 files changed, 77 insertions(+), 32 deletions(-) diff --git a/src/pages/search/index/Searching.vue b/src/pages/search/index/Searching.vue index 9c7a8c6..cfbaa35 100644 --- a/src/pages/search/index/Searching.vue +++ b/src/pages/search/index/Searching.vue @@ -122,16 +122,14 @@ </div> <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" - - > + <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' : ''" @@ -144,20 +142,18 @@ @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> + <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> <!-- <div class="foot"> <el-pagination @@ -169,7 +165,7 @@ layout="total, sizes, prev, pager, next, jumper" :total="VideoPhotoData.total" ></el-pagination> - </div> --> + </div>--> </div> </div> <hsc-window-style-metal class="windown-model"> @@ -279,6 +275,9 @@ this.TreeDataPool.fetchTreeData(); }, mounted() { + debugger + //this.isShowUpload(); + console.log('search mounted') this.$nextTick(() => { let scrollContain = this.$refs.scrollContain this.VideoPhotoData.scrollContainDom = scrollContain @@ -303,10 +302,17 @@ // 鏆傛椂鍏抽棴璺宠浆 20200730 // if (this.$route.query.showType === "findByPic") { - if (this.VideoPhotoData.uploadDiaplay) { - // this.$nextTick(() => { - // this.$refs.uploadImg.rightSectionDisplay = true; - // }); + if (this.getUrlKey("showType")) { + this.VideoPhotoData.uploadDiaplay = true; + // console.log("鍒璺宠繃鏉ョ殑浠ュ浘鎼滃浘"); + this.VideoPhotoData.picUrl = this.getUrlKey("picSmUrl"); + this.VideoPhotoData.uploadImg = this.getUrlKey("picSmUrl"); + this.VideoPhotoData.uploadType = true + this.VideoPhotoData.compTargetId = this.getUrlKey("targetId") + this.VideoPhotoData.compTargetType = this.getUrlKey("compType") + this.VideoPhotoData.size = 30 + this.VideoPhotoData.compareTabs = ["esData"]; + this.VideoPhotoData.findPerson2(); // 鏌ユ壘姝や汉 } else { this.searchTime = this.getDateInit(); this.VideoPhotoData.searchTime = this.getDateInit(); @@ -427,6 +433,7 @@ } }, "VideoPhotoData.uploadDiaplay": function (value) { + debugger this.getHeight(); console.log("upload鐨勫�兼槸锛�", value) if (value) { @@ -449,6 +456,28 @@ } }, methods: { + isShowUpload(){ + console.log('isShowUpload',this.VideoPhotoData.uploadDiaplay) + this.getHeight(); + console.log("upload鐨勫�兼槸锛�", this.VideoPhotoData.uploadDiaplay) + if (this.VideoPhotoData.uploadDiaplay) { + if (!this.VideoPhotoData.uploadType) { + console.log("uploadDisplay涓殑鍒锋柊"); + 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; }, @@ -459,7 +488,11 @@ let w = this.$refs.mid.offsetWidth; let integer = parseInt(w / 330); let integerSearchImg = parseInt((w - 300) / 325); - this.handleSizeChange(integer, integerSearchImg); + + // 鍙栨秷size淇敼 + // console.log(integer, integerSearchImg) + // this.handleSizeChange(integer, integerSearchImg); + this.cardWidth = `calc(${100 / integer}% - 20px)`; this.searchImgCardWidth = `calc(${100 / integerSearchImg}% - 20px)`; }, @@ -523,7 +556,6 @@ }) }, getDetails(ev, index) { - debugger //let obj = this.CardList.datalist[index]; this.CardList.datalist = this.VideoPhotoData.cards; let obj = this.CardList.datalist[index]; @@ -534,7 +566,6 @@ this.VideoPhotoData.activeCard = obj.activeObject.id; }, toAdd(item) { - debugger this.CardList.addBaseList.push(item) }, handleClose(done) { @@ -704,6 +735,9 @@ fn.then(_ => { this.AuthData.closeLoad(); }) + }, + getUrlKey(name) { + return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null } } }; @@ -811,9 +845,20 @@ 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; @@ -898,7 +943,7 @@ } } } - + .right-section { //width: calc(100% - 315px); height: 100%; -- Gitblit v1.8.0