From d656ff9cf8c97a01c0cc990d935e4b42b314be22 Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期四, 06 八月 2020 18:21:50 +0800 Subject: [PATCH] 摄像机信息区域/时间规则,系统维护,实时监控,算力管理样式调整 --- src/pages/desktop/index/components/DFrame.vue | 29 ++++++++++++++++------------- 1 files changed, 16 insertions(+), 13 deletions(-) diff --git a/src/pages/desktop/index/components/DFrame.vue b/src/pages/desktop/index/components/DFrame.vue index 86c96e5..4909bb4 100644 --- a/src/pages/desktop/index/components/DFrame.vue +++ b/src/pages/desktop/index/components/DFrame.vue @@ -3,9 +3,10 @@ v-show="data.isShow" :class="['d-frame', {'d-frame-full': fullScreen}]" :data-id="data.id" - v-bind:style="{left: data.leftOffset + '%', top: data.topOffset + '%', 'z-index': 125 + data.order, width: width + 'px', height: height + 'px'}" + v-bind:style="{left: data.leftOffset + 'px', top: data.topOffset + 'px', 'z-index': 125 + data.order, width: width + 'px', height: height + 'px'}" + @click="frameClick" > - <div class="d-frame-title" v-drag @click="frameClick()"> + <div class="d-frame-title" v-drag> <div class="d-frame-title-operation"> <i class="icon-minus d-frame-operation-minus" @click="minFrame(data,$event)"> <img :src="`${publicPath}images/desktop/header-icon/min.png`" alt /> @@ -25,7 +26,7 @@ </div> </slot> </div> - <div class="d-frame-content"> + <div class="d-frame-content" @click="frameClick" > <iframe :src="data.url" v-if="data.url"></iframe> <div v-html="data.html" v-if="data.html"></div> <!-- <span class="d-frame-operation-resize" v-resize></span> --> @@ -94,8 +95,7 @@ changeFullScreen: function () { this.fullScreen = !this.fullScreen; }, - frameClick: function () { - debugger + frameClick() { this.$store.commit('desktop/refreshFrame', this.data); }, minFrame(data, e) { @@ -104,12 +104,13 @@ //淇濆瓨褰撳墠搴旂敤蹇収 html2canvas(curIframe.contentWindow.document.body, { dpi: window.devicePixelRatio * 4, - logging: true, //鏌ョ湅html2canvas鍐呴儴鎵ц娴佺▼ + //logging: true, //鏌ョ湅html2canvas鍐呴儴鎵ц娴佺▼ removeContainer: true, imageTimeout: 0, useCORS: true //寮�鍚法鍩熼厤缃� }).then(canvas => { let shotSrc = canvas.toDataURL(); + this.$store.commit('desktop/addMinDock', { id: this.data.id, src: this.data.icon, @@ -149,16 +150,16 @@ let toLeft = e.clientX - disx; let toTop = e.clientY - disy; //杈圭晫澶勭悊 - if (toLeft <= 0) { - toLeft = 0 - } else if (toLeft >= document.body.getBoundingClientRect().width - 40) { - toLeft = document.body.getBoundingClientRect().width - 40; + if (toLeft <= -(el.parentElement.offsetWidth-46*3)) { + toLeft = -(el.parentElement.offsetWidth-46*3) + } else if (toLeft >= document.body.getBoundingClientRect().width - 46*3) { + toLeft = document.body.getBoundingClientRect().width - 46*3; } el.parentElement.style.left = toLeft + 'px'; if (toTop <= 40) { toTop = 40 - } else if (toTop >= document.body.getBoundingClientRect().height - 40) { - toTop = document.body.getBoundingClientRect().height - 40; + } else if (toTop >= document.body.getBoundingClientRect().height - 31) { + toTop = document.body.getBoundingClientRect().height - 31; } el.parentElement.style.top = toTop + 'px'; }; @@ -203,13 +204,14 @@ } .d-frame { position: fixed; + box-shadow: 0 5px 10px rgba(0,0,0,.5); } .d-frame.d-frame-full { width: 100% !important; height: 100% !important; left: 0 !important; - top: 0 !important; + top: 40px !important; } .d-frame .d-frame-title { @@ -240,6 +242,7 @@ text-align: center; vertical-align: middle; cursor: pointer; + line-height: 28px; } .d-frame-title-operation i:hover { -- Gitblit v1.8.0