From ddb0df2153bc75e54c3f7c1049be663d4d2dba96 Mon Sep 17 00:00:00 2001 From: hanbaoshan <hanbaoshan@aiotlink.com> Date: 星期六, 15 八月 2020 19:10:03 +0800 Subject: [PATCH] Merge branch 'master' of http://192.168.5.5:10010/r/vue-smart-ai --- src/pages/desktop/index/components/Tools.vue | 80 ++++++++++++++++++++++++++++++++++++++-- 1 files changed, 76 insertions(+), 4 deletions(-) diff --git a/src/pages/desktop/index/components/Tools.vue b/src/pages/desktop/index/components/Tools.vue index 24d5c47..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> @@ -31,14 +31,26 @@ <img :src="`${publicPath}images/desktop/header-icon/notice.png`" alt /> </div> <div class="tools-icon"> - <img :src="`${publicPath}images/desktop/header-icon/user.png`" alt /> + <el-dropdown size="small" placement="bottom"> + <span class="el-dropdown-link"> + <img :src="`${publicPath}images/desktop/header-icon/user.png`" alt /> + <!-- <i class="el-icon-arrow-down el-icon--right"></i> --> + </span> + <el-dropdown-menu slot="dropdown" style='top: 44px;'> + <el-dropdown-item @click.native='toLogout'> + 閫�鍑虹櫥褰� + </el-dropdown-item> + </el-dropdown-menu> + </el-dropdown> + </div> </div> </div> </template> <script> - +import html2canvas from 'html2canvas'; +import {logout} from "@/api/login"; export default { name: "Tools", data() { @@ -127,6 +139,60 @@ debugger 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, + cancelButtonClass: "comfirm-class-cancle", + confirmButtonClass: "comfirm-class-sure" + }).then(_ => { + logout().then(res => { + if (res === "閫�鍑烘垚鍔�") { + sessionStorage.removeItem("userInfo"); + location.assign('/view/index'); + this.$notify({ + title: "鎻愮ず", + type: "success", + message: "閫�鍑烘垚鍔燂紒" + }); + } else { + this.$notify({ + title: "鎻愮ず", + type: "success", + message: "閫�鍑哄け璐�!" + }); + } + }); + }).catch(_ => { + console.log("閫�鍑哄け璐�"); + }); } } }; @@ -159,6 +225,7 @@ float: left; position: relative; } + .tools .tools-middle::before { width: 1px; height: 20px; @@ -183,6 +250,7 @@ } .tools-middle .dock-item-wrap.actived{ border-color: #40c3ff; + background-color: #98aabe; } .dock-item-wrap a { height: 100%; @@ -193,6 +261,7 @@ } .dock-item-wrap .dock-shot { visibility: hidden; + /* transform: scale(0.5); */ width: 100px; height: 46px; position: absolute; @@ -224,4 +293,7 @@ height: 100%; margin-right: 14px; } +.el-dropdown-menu{ + top: 40px !important; +} </style> \ No newline at end of file -- Gitblit v1.8.0