diff --git a/package.json b/package.json index e16f957..f757ede 100644 --- a/package.json +++ b/package.json @@ -45,7 +45,7 @@ "vue-multiselect": "^2.1.6", "vue-router": "3.0.1", "vue-video-player": "^5.0.2", - "vuedraggable": "^2.23.2", + "vuedraggable": "^2.24.3", "vuex": "3.0.1", "vuex-oidc": "^2.0.1" }, diff --git a/public/monitor/hk/index.html b/public/monitor/hk/index.html index 373b458..ebb16c3 100644 --- a/public/monitor/hk/index.html +++ b/public/monitor/hk/index.html @@ -9,24 +9,23 @@ html, body { padding: 0; margin: 0; - position:relative; } .camera-dia{ - width: 100%; - height: 100%; - background: rgba(0,0,0,0); - position:relative; + width: 100vw; + height: 100vh; + background: rgba(0,0,0,0.4); } -.camera-box{ - width: 720px; - height: 360px; + .camera-box{ + width: 400px; + height: 300px; border-radius: 5px; position: fixed; - left:50%; - top:50%; - transform:translate(-50%,-50%); + left: 50%; + top: 50%; z-index: 9999; + transform: translate(-50%,-50%); + padding: 10px 0 20px; } .camera-header{ width: 90%; @@ -37,10 +36,8 @@ height: 15px; } .camera-body{ - width: 90%; height: 230px; - /* border: 1px solid #fff; */ margin-left: 5%; } .camera-footer{ @@ -62,12 +59,12 @@
-
-
+
+
- +
-
+
@@ -93,13 +90,14 @@ // 子页面接收消息 window.addEventListener('message', function (e) { if (e.data) { - console.log("play-data",e.data); + console.log('aaa',e.data) $("#carmerName").text(e.data[0]) $("#carmerCard").text(e.data[1]) $("#carmerAppKey").text(e.data[2]) $("#carmerIp").text(e.data[3]) $("#carmerPort").text(e.data[4]) $("#appSecret").text(e.data[5]) + } }, false) @@ -136,7 +134,7 @@ cbIntegrationCallBack: cbIntegrationCallBack }); - oWebControl.JS_CreateWnd("playWnd", 780, 430).then(function () { //JS_CreateWnd创建视频播放窗口，宽高可设定 + oWebControl.JS_CreateWnd("playWnd", 360, 230).then(function () { //JS_CreateWnd创建视频播放窗口，宽高可设定 init(); // 创建播放实例成功后初始化 }); }, function () { // 启动插件服务失败 @@ -152,7 +150,6 @@ initPlugin(); }, 3000) } else { - window.parent.alertInstallVideoPlayer(); $("#playWnd").html("插件启动失败，请检查插件是否安装！"); } }, @@ -224,7 +221,7 @@ buttonIDs: buttonIDs //自定义工具条按钮 }) }).then(function (oData) { - oWebControl.JS_Resize(780, 430); // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题 + oWebControl.JS_Resize(360, 230); // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题 setWndCover(); }); // var cameraIndexCode = 'bbe9c64699174953828ce4fa8bb41b8f'; //获取输入的监控点编号值，必填 @@ -275,7 +272,7 @@ // 监听resize事件，使插件窗口尺寸跟随DIV窗口变化 $(window).resize(function () { if (oWebControl != null) { - oWebControl.JS_Resize(780, 430); + oWebControl.JS_Resize(360, 230); setWndCover(); } }); @@ -283,7 +280,7 @@ // 监听滚动条scroll事件，使插件窗口跟随浏览器滚动而移动 $(window).scroll(function () { if (oWebControl != null) { - oWebControl.JS_Resize(780, 430); + oWebControl.JS_Resize(360, 230); setWndCover(); } }); diff --git a/public/monitor/hk/index1.html b/public/monitor/hk/index1.html index 97272d9..9106249 100644 --- a/public/monitor/hk/index1.html +++ b/public/monitor/hk/index1.html @@ -23,12 +23,10 @@ border: 1px solid #386df5; border-radius: 5px; position: fixed; - right: 20px; - bottom: 130px; - z-index: 999; - padding: 10px; - position:absolute; - top:500px; + left:100%; + top:100%; + transform:translate(-50%,-50%); + z-index: 9999; } .camera-body{ width: 100%; @@ -39,7 +37,6 @@ .playWnd { width: 180px; /*播放容器的宽和高设定*/ height: 115px; - } @@ -246,8 +243,11 @@ // 设置窗口裁剪，当因滚动条滚动导致窗口需要被遮住的情况下需要JS_CuttingPartWindow部分窗口 function setWndCover() { + var iWidth = $(window).width(); var iHeight = $(window).height(); + + alert(iWidth); var oDivRect = $("#playWnd").get(0).getBoundingClientRect(); var iCoverLeft = (oDivRect.left < 0) ? Math.abs(oDivRect.left): 0; @@ -255,10 +255,10 @@ var iCoverRight = (oDivRect.right - iWidth > 0) ? Math.round(oDivRect.right - iWidth) : 0; var iCoverBottom = (oDivRect.bottom - iHeight > 0) ? Math.round(oDivRect.bottom - iHeight) : 0; - iCoverLeft = (iCoverLeft > 180) ? 180 : iCoverLeft; - iCoverTop = (iCoverTop > 115) ? 115 : iCoverTop; - iCoverRight = (iCoverRight > 180) ? 180 : iCoverRight; - iCoverBottom = (iCoverBottom > 115) ? 115 : iCoverBottom; + iCoverLeft = (iCoverLeft > 360) ? 360 : iCoverLeft; + iCoverTop = (iCoverTop > 230) ? 230 : iCoverTop; + iCoverRight = (iCoverRight > 360) ? 360 : iCoverRight; + iCoverBottom = (iCoverBottom > 230) ? 230 : iCoverBottom; oWebControl.JS_RepairPartWindow(0, 0, 1001, 115); // 多1个像素点防止还原后边界缺失一个像素条 if (iCoverLeft != 0) { diff --git a/src/views/home/index.vue b/src/views/home/index.vue index d3e8d96..93be46c 100644 --- a/src/views/home/index.vue +++ b/src/views/home/index.vue @@ -92,8 +92,6 @@
- -
@@ -101,22 +99,14 @@
- - -
-
+
+
- -
- - - -
@@ -150,26 +140,27 @@
+
+
+
-
-
@@ -178,7 +169,6 @@
-