From 84f11d4ca59f9580a7e7de5471e3eb86ea14c16b Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期六, 01 八月 2020 18:08:16 +0800 Subject: [PATCH] 屏蔽未开放应用 --- src/pages/desktop/index/components/DFrame.vue | 58 +++++++++++++++++++++++++++++++++++++++++++++------------- 1 files changed, 45 insertions(+), 13 deletions(-) diff --git a/src/pages/desktop/index/components/DFrame.vue b/src/pages/desktop/index/components/DFrame.vue index f7c5feb..cfe46e1 100644 --- a/src/pages/desktop/index/components/DFrame.vue +++ b/src/pages/desktop/index/components/DFrame.vue @@ -8,7 +8,7 @@ <div class="d-frame-title" v-drag @click="frameClick()"> <div class="d-frame-title-operation"> <i class="fa fa-circle d-frame-operation-close" @click="closeFrame()"></i> - <i class="fa fa-circle d-frame-operation-minus" @click="minFrame()"></i> + <i class="fa fa-circle d-frame-operation-minus" @click="minFrame(data)"></i> <i class="fa fa-circle d-frame-operation-full" @click="changeFullScreen()"></i> </div> <slot name="d-frame-title-content"> @@ -27,6 +27,7 @@ </template> <script> +import html2canvas from 'html2canvas' export default { name: "DFrame", props: { @@ -36,7 +37,9 @@ return { fullScreen: false, width: this.data.width || 1024, - height: this.data.height || 512 + height: this.data.height || 512, + dragLock: false, + resizeLock: false } }, mounted() { @@ -57,13 +60,27 @@ frameClick: function () { this.$store.commit('desktop/refreshFrame', this.data); }, - minFrame: function () { - this.$store.commit('desktop/addMinDock', { - id: this.data.id, - src: this.data.icon, - alt: this.data.title, - type: "3" - }); + minFrame: function (data) { + //鎵惧埌褰撳墠鐨刬frame + let curIframe = Array.from(document.querySelectorAll('iframe')).find(iframe => iframe.src.indexOf(data.url) >= 0); + //淇濆瓨褰撳墠搴旂敤蹇収 + html2canvas(curIframe.contentWindow.document.body,{ + dpi: window.devicePixelRatio*4, + 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, + alt: this.data.title, + type: "3", + screenshot: shotSrc + }); + }) + //this.refreshDock(); }, refreshDock: function () { @@ -79,7 +96,12 @@ }, directives: { drag(el) { + + if (el.dragLock) { + return + } el.onmousedown = function (e) { + el.dragLock = true; let disx = e.clientX - el.parentElement.offsetLeft; let disy = e.clientY - el.parentElement.offsetTop; el.style.cursor = 'move'; @@ -89,13 +111,18 @@ el.parentElement.style.top = e.clientY - disy + 'px'; }; document.onmouseup = function () { - document.onmousemove = document.onmouseup = void 0; + el.dragLock = false; + document.onmousemove = document.onmouseup = null; el.style.cursor = 'unset'; }; } }, resize(el, binding, vnode) { + if (el.resizeLock) { + return; + } el.onmousedown = function (e) { + el.resizeLock = true; let disx = e.clientX; let disy = e.clientY; let disw = vnode.context.width; @@ -107,7 +134,8 @@ vnode.context.height = dish + e.clientY - disy; }; document.onmouseup = function () { - document.onmousemove = document.onmouseup = void 0; + el.resizeLock = false; + document.onmousemove = document.onmouseup = null; el.style.cursor = 'unset'; }; } @@ -117,6 +145,9 @@ </script> <style scoped> +html,body{ + heiht: 100%; +} .d-frame { position: fixed; } @@ -194,7 +225,7 @@ width: 100%; height: calc(100% - 30px); border-radius: 0 0 4px 4px; - background-color: azure; + background-color: #fff; } .d-frame-content iframe { @@ -209,7 +240,8 @@ right: 0; width: 15px; height: 15px; - z-index: 100; + z-index: 1000; + cursor: nwse-resize; background: url("/images/resize.png") no-repeat; } </style> \ No newline at end of file -- Gitblit v1.8.0