From 929cf4c7be11bfd1e134d0cb0d7cbbe94772ebdf Mon Sep 17 00:00:00 2001 From: zhangzengfei <zhangzengfei@iotlink.com> Date: 星期一, 07 九月 2020 15:35:14 +0800 Subject: [PATCH] 摄像机树增加导入功能 --- src/pages/search/index/Searching.vue | 171 ++++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 139 insertions(+), 32 deletions(-) diff --git a/src/pages/search/index/Searching.vue b/src/pages/search/index/Searching.vue index 7cead48..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,10 +165,71 @@ layout="total, sizes, prev, pager, next, jumper" :total="VideoPhotoData.total" ></el-pagination> - </div> --> + </div>--> </div> </div> - + <hsc-window-style-metal class="windown-model"> + <hsc-window + v-for="(item, index) in CardList.addBaseList" + :closeButton="true" + @closebuttonclick="closeWindow(index)" + :key="index" + @update:height="resizeHeight" + @update:width="resizeWidth" + style="background:white; height:475px" + :left="center.x + index * 10" + :top="center.y + index * 10" + :resizable="true" + positionHint="center" + :isScrollable="true" + :minWidth="662" + :minHeight="479" + :maxWidth="10000" + :maxHeight="7000" + :height="defaultHeight" + :width="defaultWidth" + > + <div class="addToBase"> + <div class="topLabel">鍔犲叆搴曞簱</div> + <div class="items"> + <div class="lable"> + <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 + :label="item.value" + :title="item.title" + :disabled="item.disabled" + >{{item.title}}</el-checkbox> + </div> + </el-checkbox-group> + </div> + </div> + <div class="items"> + <div class="lable"> + <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 + :label="item.value" + :title="item.title" + :disabled="item.disabled" + >{{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> + </div> + </div> + </hsc-window> + </hsc-window-style-metal> </div> </template> @@ -218,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 @@ -242,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(); @@ -366,6 +433,7 @@ } }, "VideoPhotoData.uploadDiaplay": function (value) { + debugger this.getHeight(); console.log("upload鐨勫�兼槸锛�", value) if (value) { @@ -388,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; }, @@ -398,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)`; }, @@ -462,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]; @@ -642,6 +735,9 @@ fn.then(_ => { this.AuthData.closeLoad(); }) + }, + getUrlKey(name) { + return decodeURIComponent((new RegExp('[?|&]' + name + '=' + '([^&;]+?)(&|#|;|$)').exec(location.href) || [, ""])[1].replace(/\+/g, '%20')) || null } } }; @@ -749,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; @@ -836,7 +943,7 @@ } } } - + .right-section { //width: calc(100% - 315px); height: 100%; -- Gitblit v1.8.0