From aaf3198eb598932a788561d715bdf2a91330d259 Mon Sep 17 00:00:00 2001
From: hanbaoshan <hanbaoshan@aiotlink.com>
Date: 星期四, 13 八月 2020 14:53:19 +0800
Subject: [PATCH] 左侧树高度超出显示滚动条,鼠标移入应用小图标显示实时快照,样式调整
---
src/pages/gb28181/index/App.vue | 3
src/components/searching/uploadForModel.vue | 2
src/pages/settings/index/App.vue | 1
src/pages/desktop/index/components/ToolsEntry.vue | 3
src/pages/search/index/Searching.vue | 64 +++++++++++++++
src/components/searching/SearchLeft.vue | 2
src/pages/desktop/index/components/DFrame.vue | 10 ++
src/pages/datapush/index/App.vue | 2
src/components/searching/uploadDialog.vue | 2
src/pages/desktop/index/mock/userData.json | 2
src/pages/desktop/index/store/modules/desktop.js | 10 ++
src/pages/cameraAccess/index/App.vue | 7 +
src/pages/vindicate/index/App.vue | 1
src/pages/library/components/carList.vue | 13 +-
src/components/searching/UploadImg.vue | 6 +
src/pages/desktop/index/components/Tools.vue | 34 ++++++++
src/pages/library/components/personList.vue | 6 +
src/pages/datapush/index/LeftList.vue | 1
src/pages/analysisPower/index/App.vue | 27 +++++-
19 files changed, 178 insertions(+), 18 deletions(-)
diff --git a/src/components/searching/SearchLeft.vue b/src/components/searching/SearchLeft.vue
index 53edcee..060eaed 100644
--- a/src/components/searching/SearchLeft.vue
+++ b/src/components/searching/SearchLeft.vue
@@ -334,6 +334,8 @@
padding: 5px;
box-sizing: border-box;
position: relative;
+ // display: inline-block;
+ // vertical-align: middle;
img {
width: 100%;
cursor: pointer;
diff --git a/src/components/searching/UploadImg.vue b/src/components/searching/UploadImg.vue
index 35dcc8f..669c582 100644
--- a/src/components/searching/UploadImg.vue
+++ b/src/components/searching/UploadImg.vue
@@ -307,6 +307,9 @@
height: 100%;
box-sizing: border-box;
padding: 5px;
+ .el-button--info{
+ color: #222;
+ }
.upload-area {
width: 300px;
height: 100%;
@@ -352,7 +355,10 @@
padding: 5px;
box-sizing: border-box;
position: relative;
+ display: inline-block;
+ vertical-align: middle;
img {
+ width: 100%;
object-fit: contain;
cursor: pointer;
border-radius: 3px;
diff --git a/src/components/searching/uploadDialog.vue b/src/components/searching/uploadDialog.vue
index e5f7e6c..b56296d 100644
--- a/src/components/searching/uploadDialog.vue
+++ b/src/components/searching/uploadDialog.vue
@@ -316,6 +316,8 @@
padding: 5px;
box-sizing: border-box;
position: relative;
+ // display: inline-block;
+ // vertical-align: middle;
img {
width: 100%;
cursor: pointer;
diff --git a/src/components/searching/uploadForModel.vue b/src/components/searching/uploadForModel.vue
index 7cd6c85..85365f2 100644
--- a/src/components/searching/uploadForModel.vue
+++ b/src/components/searching/uploadForModel.vue
@@ -319,6 +319,8 @@
padding: 5px;
box-sizing: border-box;
position: relative;
+ // display: inline-block;
+ // vertical-align: middle;
img {
width: 100%;
cursor: pointer;
diff --git a/src/pages/analysisPower/index/App.vue b/src/pages/analysisPower/index/App.vue
index 8c4d0de..9aef803 100644
--- a/src/pages/analysisPower/index/App.vue
+++ b/src/pages/analysisPower/index/App.vue
@@ -60,7 +60,7 @@
border
:cell-style="cellStyle"
>
- <el-table-column label="搴忓彿" type="index" align="center" width="100px"></el-table-column>
+ <el-table-column label="搴忓彿" type="index" align="center" width="60px"></el-table-column>
<el-table-column label="鎽勫儚鏈哄悕绉�" align="center" show-overflow-tooltip sortable>
<template slot-scope="scope">
<span
@@ -70,7 +70,7 @@
</el-table-column>
<el-table-column label="鎽勫儚鏈哄湴鍧�" prop="addr" align="center" show-overflow-tooltip sortable></el-table-column>
<el-table-column label="鎽勫儚鏈篒P" prop="ip" align="center" width="130px" sortable></el-table-column>
- <el-table-column label="鎽勫儚鏈虹被鍨�" align="center" width="110px" sortable>
+ <el-table-column label="鎽勫儚鏈虹被鍨�" align="center" width="120px" sortable>
<template slot-scope="scope">
<span>{{scope.row.run_type | cameraType}}</span>
</template>
@@ -118,7 +118,7 @@
title="绠楀姏璁剧疆"
:visible.sync="drawer"
direction="rtl"
- size="350px"
+ size="450px"
custom-class="e-drawer"
:before-close="closeDrawer"
>
@@ -573,9 +573,16 @@
.e-drawer {
// margin-top: 150px;
-
font-family: PingFangSC-Medium;
font-size: 14px;
+ &:focus{
+ outline: none;
+ }
+ .el-dialog__close{
+ &:focus{
+ outline: none!important;
+ }
+ }
.dawer_details {
text-align: left;
margin-left: 70px;
@@ -594,9 +601,19 @@
margin-left: 20px;
}
}
-
+
.el-drawer__header {
+ border-bottom: 2px solid #eee;
+ padding-bottom: 10px;
+ font-size: 16px;
margin-bottom: 0px;
+ span{
+ border: none!important;
+ border-image-width: 0!important;
+ &:focus{
+ outline: none;
+ }
+ }
}
}
</style>
diff --git a/src/pages/cameraAccess/index/App.vue b/src/pages/cameraAccess/index/App.vue
index 5021d75..e60b5dc 100644
--- a/src/pages/cameraAccess/index/App.vue
+++ b/src/pages/cameraAccess/index/App.vue
@@ -4,7 +4,7 @@
<div class="resize-bar"></div>
<div class="resize-line"></div>
<div class="resize-save">
- <left-nav :appName="app" :edit="editTree"></left-nav>
+ <left-nav :appName="app" :edit="editTree" :height="screenHeight"></left-nav>
</div>
</div>
<div class="column-right" >
@@ -63,7 +63,10 @@
height: 100%;
}
.column-left {
- height: inherit;
+ height: 100%;
+ padding-bottom: 20px;
+ box-sizing: border-box;
+ // height: inherit;
background-color: #fff;
position: relative;
}
diff --git a/src/pages/datapush/index/App.vue b/src/pages/datapush/index/App.vue
index 749392c..d56eb85 100644
--- a/src/pages/datapush/index/App.vue
+++ b/src/pages/datapush/index/App.vue
@@ -94,8 +94,10 @@
</script>
<style lang="scss">
+
.ev-left-list {
border-right: 1px solid #e0e0e0;
+ min-width: 384px;
}
.ant-divider,
diff --git a/src/pages/datapush/index/LeftList.vue b/src/pages/datapush/index/LeftList.vue
index ddbb75b..32b7308 100644
--- a/src/pages/datapush/index/LeftList.vue
+++ b/src/pages/datapush/index/LeftList.vue
@@ -194,6 +194,7 @@
padding-top: 20px;
//height: 50em;
.left-list {
+ min-width:340px;
position: absolute;
left: 15px;
top: 10px;
diff --git a/src/pages/desktop/index/components/DFrame.vue b/src/pages/desktop/index/components/DFrame.vue
index ac00319..8152d1e 100644
--- a/src/pages/desktop/index/components/DFrame.vue
+++ b/src/pages/desktop/index/components/DFrame.vue
@@ -124,6 +124,15 @@
type: "3",
screenshot: shotSrc
});
+ }).catch(e=>{
+ console.log(e);
+ this.$store.commit('desktop/addMinDock', {
+ id: this.data.id,
+ src: this.data.icon,
+ alt: this.data.title,
+ type: "3",
+ screenshot: ''
+ });
});
return false;
//this.refreshDock();
@@ -221,6 +230,7 @@
}
.d-frame .d-frame-title {
+ /* min-width: 378px; */
height: 30px;
background-color: #e0e0e0;
border-radius: 4px 4px 0 0;
diff --git a/src/pages/desktop/index/components/Tools.vue b/src/pages/desktop/index/components/Tools.vue
index 2cda1d5..81393fd 100644
--- a/src/pages/desktop/index/components/Tools.vue
+++ b/src/pages/desktop/index/components/Tools.vue
@@ -12,11 +12,11 @@
</div>
</div>
<div class="tools-middle">
- <div v-for="dock in $store.state.desktop.minDocks" :key="dock.id" class="dock-item-wrap" :class="{'actived':dock.highlight}">
+ <div v-for="dock in $store.state.desktop.minDocks" :key="dock.id" class="dock-item-wrap" :class="{'actived':dock.highlight}" @mouseover="screenShot(dock)">
<a @click="dockClick(dock)">
<img class="dock-item" :src="dock.src" :alt="dock.alt" />
<img class="dock-shot" :src="dock.screenshot" v-if="dock.screenshot"/>
-
+ <!-- <iframe class="dock-shot" :src="dock.url" ></iframe> -->
</a>
</div>
</div>
@@ -49,6 +49,7 @@
</template>
<script>
+import html2canvas from 'html2canvas';
import {logout} from "@/api/login";
export default {
name: "Tools",
@@ -139,6 +140,33 @@
this.$store.commit("desktop/refreshFrame", dock);
}
},
+ screenShot(dock){
+ debugger
+ //鎵惧埌褰撳墠鐨刬frame
+ let curIframe = Array.from(document.querySelectorAll('iframe')).find(iframe => iframe.src.indexOf(dock.url) >= 0);
+ //淇濆瓨褰撳墠搴旂敤蹇収
+ html2canvas(curIframe.contentWindow.document.body, {
+ dpi: window.devicePixelRatio * 4,
+ logging: true, //鏌ョ湅html2canvas鍐呴儴鎵ц娴佺▼
+ removeContainer: true,
+ imageTimeout: 0,
+ useCORS: true, //寮�鍚法鍩熼厤缃�
+ //allowTaint: true
+ }).then(canvas => {
+ let shotSrc = canvas.toDataURL();
+ // this.$store.commit('desktop/addMinDock', {
+ // id: dock.id,
+ // src: dock.icon,
+ // alt: dock.title,
+ // type: "3",
+ // screenshot: shotSrc
+ // });
+ this.$store.commit('desktop/shotscreen', {id:dock.id, src:shotSrc});
+
+ }).catch(e => {
+ this.$store.commit('desktop/shotscreen', {id:dock.id, src:''});
+ });
+ },
toLogout(){
this.$confirm("鎻愮ず锛氱‘瀹氶��鍑哄悧锛�", {
center: true,
@@ -197,6 +225,7 @@
float: left;
position: relative;
}
+
.tools .tools-middle::before {
width: 1px;
height: 20px;
@@ -232,6 +261,7 @@
}
.dock-item-wrap .dock-shot {
visibility: hidden;
+ /* transform: scale(0.5); */
width: 100px;
height: 46px;
position: absolute;
diff --git a/src/pages/desktop/index/components/ToolsEntry.vue b/src/pages/desktop/index/components/ToolsEntry.vue
index a18dc4f..df9d6e0 100644
--- a/src/pages/desktop/index/components/ToolsEntry.vue
+++ b/src/pages/desktop/index/components/ToolsEntry.vue
@@ -24,6 +24,7 @@
</template>
<script>
+
export default {
name: 'toolsEntry',
data() {
@@ -66,6 +67,8 @@
alt: dock.title,
type: "3",
highlight: true,
+ url: dock.url,
+ screenshot: ''
});
} else if (dock.type === '2' && dock.isOpen) {
this.$store.commit('desktop/resetMinFrame', dock.id);
diff --git a/src/pages/desktop/index/mock/userData.json b/src/pages/desktop/index/mock/userData.json
index 7a02b33..e2de688 100644
--- a/src/pages/desktop/index/mock/userData.json
+++ b/src/pages/desktop/index/mock/userData.json
@@ -132,7 +132,7 @@
"type": "2",
"url": "/view/vindicate",
"title": "绯荤粺缁存姢",
- "width": 758,
+ "width": 760,
"height": 534
}
]
diff --git a/src/pages/desktop/index/store/modules/desktop.js b/src/pages/desktop/index/store/modules/desktop.js
index 3922f55..cfb3747 100644
--- a/src/pages/desktop/index/store/modules/desktop.js
+++ b/src/pages/desktop/index/store/modules/desktop.js
@@ -121,7 +121,14 @@
return true;
},
-
+ shotscreen: (state, {id,src}) => {
+ let curFrame = state.frames.find(frame => frame.id == id);
+ if(!curFrame.isShow){
+ return
+ }
+ let curDock = state.minDocks.find(one => one.id == id);
+ curDock.screenshot = src;
+ },
addMinDock: (state, dock) => {
let ids = state.minDocks.map(item => item.id);
@@ -132,6 +139,7 @@
let minOne = state.minDocks.find(one => one.id == dock.id);
minOne.highlight = false;
+ debugger
minOne.screenshot = dock.screenshot;
//鎵惧埌minDocks鏈�杩戞墦寮�鐨勭姸鎬乮sShow涓簍rue鐨刣ock缃负楂樹寒
let minLen = state.minDocks.length;
diff --git a/src/pages/gb28181/index/App.vue b/src/pages/gb28181/index/App.vue
index 3b6935b..404eeac 100644
--- a/src/pages/gb28181/index/App.vue
+++ b/src/pages/gb28181/index/App.vue
@@ -326,6 +326,9 @@
},
menuOpen(){
+ },
+ menuClose(){
+
}
}
}
diff --git a/src/pages/library/components/carList.vue b/src/pages/library/components/carList.vue
index f4215e4..0b4f134 100644
--- a/src/pages/library/components/carList.vue
+++ b/src/pages/library/components/carList.vue
@@ -1294,8 +1294,8 @@
.el-drawer.ltr,
.el-drawer.rtl {
width: 27% !important;
- height: 90%;
- top: 9%;
+ //height: 90%;
+ //top: 9%;
.el-drawer__header {
border-bottom: 2px solid #eee;
padding-bottom: 10px;
@@ -1445,9 +1445,9 @@
.el-drawer.rtl {
min-width: 450px;
width: 25% !important;
- height: 90%;
- min-height: 1100px;
- top: 9%;
+ //height: 90%;
+ //min-height: 1100px;
+ //top: 9%;
.el-drawer__header {
border-bottom: 2px solid #eee;
padding-bottom: 10px;
@@ -1460,7 +1460,8 @@
}
.drawerSpace {
- height: 900px;
+ height: calc(100% - 140px);
+ box-sizing: border-box;
margin-bottom: 30px;
overflow-y: scroll;
.uploadLine {
diff --git a/src/pages/library/components/personList.vue b/src/pages/library/components/personList.vue
index ad91779..7194efd 100644
--- a/src/pages/library/components/personList.vue
+++ b/src/pages/library/components/personList.vue
@@ -1031,6 +1031,12 @@
border-bottom: none;
// border-bottom: none;
}
+.el-dialog{
+ min-width: 515px;
+ .el-button--info{
+ color: #222;
+ }
+}
.el-dialog__header {
padding: 20px 0 10px;
text-align: left;
diff --git a/src/pages/search/index/Searching.vue b/src/pages/search/index/Searching.vue
index 7cead48..9c7a8c6 100644
--- a/src/pages/search/index/Searching.vue
+++ b/src/pages/search/index/Searching.vue
@@ -172,7 +172,68 @@
</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>
@@ -473,6 +534,7 @@
this.VideoPhotoData.activeCard = obj.activeObject.id;
},
toAdd(item) {
+ debugger
this.CardList.addBaseList.push(item)
},
handleClose(done) {
diff --git a/src/pages/settings/index/App.vue b/src/pages/settings/index/App.vue
index 749d7de..8a8d3e9 100644
--- a/src/pages/settings/index/App.vue
+++ b/src/pages/settings/index/App.vue
@@ -62,6 +62,7 @@
<style lang="scss">
.s-system-manage {
width: 100% !important;
+ min-width: 1067px;
height: 100%;
box-sizing: border-box;
padding: 10px;
diff --git a/src/pages/vindicate/index/App.vue b/src/pages/vindicate/index/App.vue
index 167f6fa..e41e502 100644
--- a/src/pages/vindicate/index/App.vue
+++ b/src/pages/vindicate/index/App.vue
@@ -388,6 +388,7 @@
<style lang="scss">
.s-system-manage {
width: 100% !important;
+ min-width: 759px;
box-sizing: border-box;
padding: 10px;
// background-color: #e9ebf2;
--
Gitblit v1.8.0