From f15fb880a1f949c4ae50a8658dff217a3ccce892 Mon Sep 17 00:00:00 2001 From: ZZJ <zzjdsg2300@163.com> Date: 星期四, 30 九月 2021 18:33:34 +0800 Subject: [PATCH] 系统设置/维护v1.2 --- src/components/wasmPlayer/index.vue | 72 +++++++++++++++++++++++++++++++++-- 1 files changed, 67 insertions(+), 5 deletions(-) diff --git a/src/components/wasmPlayer/index.vue b/src/components/wasmPlayer/index.vue index 0dcf7f5..becc42e 100644 --- a/src/components/wasmPlayer/index.vue +++ b/src/components/wasmPlayer/index.vue @@ -21,6 +21,10 @@ height="540" ></canvas> </div> + + <transition name="fade"> + <div class="popuptext" id="myPopup" v-if="fullScreenNotice">璧勬簮涓嬭浇涓�,璇风◢鍚�...</div> + </transition> <!-- 鎺у埗鏉� --> <section @@ -194,7 +198,8 @@ isEmptyUrl: false, videoLoading: false, loadUrl:'', - isFullScreen:false + isFullScreen:false, + fullScreenNotice:false } }, watch: { @@ -496,14 +501,33 @@ }, async downLoad() { - this.$notify.info({ + if (!this.loadUrl) { + this.$notify.info({ title: '娑堟伅', - message: '璧勬簮涓嬭浇涓�,璇风◢鍚�...' + message:'涓嬭浇澶辫触锛屾棤鏁堢殑瑙嗛鍦板潃' }); + } + + if (this.isFullScreen) { + /* const screen = this.player.webglPlayer.canvas.parentNode + var p = document.createElement("p"); + var txt = document.createTextNode("璧勬簮涓嬭浇涓�,璇风◢鍚�..."); + p.appendChild(txt); + p.classList.add("downloadNotice"); + screen.appendChild(p); */ + this.fullScreenNotice = true + setTimeout(()=>{this.fullScreenNotice = false},2000);} + + else { + this.$notify.info({ + title: '娑堟伅', + message:`璧勬簮涓嬭浇涓�,璇风◢鍚�...` + }); + } + let url = 'http://'+window.location.host+this.loadUrl // let url = "http://localhost:8080/httpImage/192.168.20.189:6700/283,2f49bf283ad7?collection=2021-09-28-DSVAD010120190703-video" - console.log(url); let name = url.substring(url.lastIndexOf("/") + 1) let responsePromise = await fetch(url) let blob = await responsePromise.blob() @@ -567,7 +591,7 @@ position: absolute; bottom: 0; left: 0; - z-index: 2147483648; + z-index: 100; width: 100%; height: 40px; line-height: 40px; @@ -792,4 +816,42 @@ font-size: 14px; color: #fff; } + +.downloadNotice { + position: absolute; + height: 200px; + width: 200px; + background-color: pink; +} + + .popuptext { + /* display:none; */ + height: 50px; + line-height: 50px; + font-size: 20px; + background-color: #555; + opacity: .8; + color: #fff; + text-align: center; + border-radius: 25px; + position: relative; + top: 30px; + z-index: 1; +} + + .fade-enter{ + opacity: 0; + } + .fade-enter-active{ + transition: opacity .5s; + } + .fade-leave-to{ + opacity: 0; + } + .fade-leave-active{ + transition: opacity 3s; + } + .canvasDiv .el-loading-mask { + z-index: 1000 !important; + } </style> -- Gitblit v1.8.0