From ed35d0b4c2051e067bd9904c4b0158257d5db0d9 Mon Sep 17 00:00:00 2001 From: ZZJ <10913410+zzj2100@user.noreply.gitee.com> Date: 星期二, 02 八月 2022 18:58:30 +0800 Subject: [PATCH] 摄像机树样式,导出数据样式 --- src/views/search/Searching.vue | 92 ++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 85 insertions(+), 7 deletions(-) diff --git a/src/views/search/Searching.vue b/src/views/search/Searching.vue index eb7d71d..52a08f4 100644 --- a/src/views/search/Searching.vue +++ b/src/views/search/Searching.vue @@ -1,5 +1,5 @@ <template> - <div class="searching-box"> + <div class="searching-box" @click="showDownBox = false"> <div class="searching-right"> <div class="searching-right-nav"> <el-breadcrumb @@ -138,9 +138,32 @@ >鎼滅储</el-button > </p> + + <div class="btnArea"> + <div class="button light" @click.stop="showDownBox = !showDownBox"> + <span class="iconfont"></span> + 瀵煎嚭鏁版嵁 + </div> + + <div class="downBox" v-if="showDownBox"> + <div class="downItem">瀵煎嚭鍏ㄩ儴鏁版嵁</div> + <div class="downItem">瀵煎嚭绛涢�夋暟鎹�</div> + </div> + </div> + <p class="p-clear"> <b class="clear-searching" @click="clearSearch">閲嶇疆</b> </p> + <el-tooltip + class="item" + effect="dark" + content="閰嶇疆瀛樺偍璺緞" + placement="bottom" + > + <span @click="showSetBox = true" class="iconfont setIcon" + ></span + > + </el-tooltip> </div> <div ref="mid" style="height: calc(100% - 50px)"> <div class="left-selection" v-if="VideoPhotoData.uploadDiaplay"> @@ -262,16 +285,13 @@ </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">淇濆瓨</el-button> + <el-button type="default">鍙栨秷</el-button> </div> </div> </hsc-window> </hsc-window-style-metal> + <SetBox v-if="showSetBox" @close="showSetBox = false"></SetBox> </div> </template> @@ -280,11 +300,13 @@ import UploadImg from "./components/UploadImg"; import bus from "@/main"; import { getUrlKey } from "@/api/utils.ts"; +import SetBox from "@/views/search/components/SetBox"; export default { name: "RightSide", components: { Card, UploadImg, + SetBox, }, data() { return { @@ -299,12 +321,14 @@ tagValues: [], alarmValues: [], taskValues: [], + showDownBox: false, searchTime: [ this.$moment().format("YYYY-MM-DD 00:00:00"), this.$moment().format("YYYY-MM-DD HH:mm:ss"), ], searchText: "", currentPage: 1, + showSetBox: false, }; }, computed: { @@ -887,6 +911,16 @@ color: #2249b4; } } + .p-input .el-button { + transform: translateY(-1px); + } + + .setIcon { + margin-left: 10px; + font-size: 18px; + color: #1677ff; + cursor: pointer; + } .clear-searching { cursor: pointer; text-decoration: underline; @@ -1038,4 +1072,48 @@ position: relative; } } +.btnArea { + padding: 0 10px; + margin-right: 10px; + color: #0064ff; + background-color: #fff; + text-align: center; + line-height: 28px; + display: inline-block; + height: 28px; + border-radius: 5px; + cursor: pointer; + font-size: 12px; + border: 1px solid #0065ff; + + .light { + } + + .downBox { + top: 104px; + right: 255px; + position: absolute; + text-align: center; + background-color: #fff; + border-radius: 3px; + color: #3d3d3d; + width: 100px; + z-index: 10; + padding: 10px; + box-shadow: 0px 1px 10px 0px rgba(0, 0, 0, 0.05), + 0px 4px 5px 0px rgba(0, 0, 0, 0.08), 0px 2px 4px -1px rgba(0, 0, 0, 0.12); + + .downItem { + text-align: center; + height: 40px; + line-height: 40px; + font-size: 12px; + cursor: pointer; + + &:hover { + background-color: #f0f5fa; + } + } + } +} </style> -- Gitblit v1.8.0