问题修改
parent
c6eb889163
commit
ae491fc054
|
|
@ -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"
|
||||
},
|
||||
|
|
|
|||
|
|
@ -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 @@
|
|||
|
||||
<body>
|
||||
<div class="camera-dia">
|
||||
<div class="camera-box">
|
||||
<div class="camera-header ">
|
||||
<div class="camera-box fc-w fz-14">
|
||||
<div class="camera-header flex jc-sb mr-1 mb-1 ai-c">
|
||||
<span class="fz-16" id="carmerName"></span>
|
||||
<img src="../img/close.png" class="cursor" id="closeBtn" />
|
||||
<img src="../../images/close.png" class="cursor" id="closeBtn" />
|
||||
</div>
|
||||
<div class="camera-body">
|
||||
<div class="camera-body pos-r">
|
||||
<!--视频窗口展示-->
|
||||
<div id="playWnd" class="playWnd"></div>
|
||||
</div>
|
||||
|
|
@ -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();
|
||||
}
|
||||
});
|
||||
|
|
|
|||
|
|
@ -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;
|
||||
|
||||
}
|
||||
</style>
|
||||
|
||||
|
|
@ -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) {
|
||||
|
|
|
|||
|
|
@ -92,8 +92,6 @@
|
|||
<routebox :globalmap="globalmap"></routebox>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="monitor" v-if="videoCallShow">
|
||||
<div class="close-button" @click="videoCallShow = false">
|
||||
<i class='el-icon el-icon-close'></i>
|
||||
|
|
@ -101,22 +99,14 @@
|
|||
<videocall @endVideoCall="endVideoCall"></videocall>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="monitor" style="" v-if="HKmonitorboxShow">
|
||||
<div class="close-button" @click="HKmonitorboxShow = false">
|
||||
<div class="monitor" style="width:100vw;height:100vh;position:fixed;top:0px;left:0px;" v-if="HKmonitorboxShow">
|
||||
<div class="close-button" style="position:absolute;top: calc( 50% - 170px);left: calc( 50% + 200px);transform:translate(-50%,-50%);" @click="HKmonitorboxShow = false">
|
||||
<i class='el-icon el-icon-close'></i>
|
||||
</div>
|
||||
<HKmonitorbox v-if="HKmonitorboxShow" :deviceId="deviceId" :channelId="channelId"></HKmonitorbox>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
|
||||
<!-- 火情调度 -->
|
||||
<div class="situation" v-if="reportSituationShow">
|
||||
<div class="situation-info">
|
||||
|
|
@ -150,26 +140,27 @@
|
|||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<!-- 人员 -->
|
||||
<div class="personnel-container" v-if="personVisible">
|
||||
<personnel :fireData="currentInfo" :globalmap="globalmap" @close="personVisible = false" @videoCall="videoCall"></personnel>
|
||||
</div>
|
||||
|
||||
<!-- 物资 -->
|
||||
<div class="goods-container" v-if="goodsVisible">
|
||||
<goodsbox :endLngLat="endLngLat" :globalmap="globalmap" @close="goodsVisible = false"></goodsbox>
|
||||
</div>
|
||||
|
||||
<!-- 水源 -->
|
||||
<div class="goods-container" v-if="waterVisible">
|
||||
<waterbox :waterCenter="waterCenter" :globalmap="globalmap" @close="waterVisible = false"></waterbox>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 网格化管理 -->
|
||||
<div class="grid-container" v-show="appTools['griderbox'] && griderShow">
|
||||
<gridbox ></gridbox>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 右键点击设置 -->
|
||||
<div v-if="setVisibleShow">
|
||||
<rightclicksetting v-if="setVisibleShow" :globalmap="globalmap" :type="rightType" :clickdata="setDatas" @close="rightType=0"></rightclicksetting>
|
||||
|
|
@ -178,7 +169,6 @@
|
|||
<div class="socket-container" v-if="socketBoxVisible">
|
||||
<socketDiaBox v-if="socketBoxVisible" :globalmap="globalmap" @close="socketBoxVisible = false" @videoCall="videoCall"></socketDiaBox>
|
||||
</div>
|
||||
|
||||
|
||||
<!-- 火情上报 -->
|
||||
<!-- <div class="report" v-if="appTools['reportbox']">
|
||||
|
|
@ -197,20 +187,19 @@
|
|||
</template>
|
||||
|
||||
<script>
|
||||
|
||||
// 请求接口获取全部路由和工具箱信息
|
||||
import { getModules } from '@/api/modules.js';
|
||||
|
||||
import AppConfigInfo from '../../../public/config/app.json'
|
||||
|
||||
import $ from 'jquery'
|
||||
import Map from '@/components/mars3d/Map.vue'
|
||||
// import widgetdiv from '@/components/Widget/index.vue'
|
||||
import widgetdiv from '@/components/Widget/index.vue'
|
||||
import Uavbox from './widget/uavbox.vue'
|
||||
import toolbox from './widget/toolbox.vue'
|
||||
import monitorbox from './widget/monitorbox.vue'
|
||||
import routebox from './widget/routebox.vue'
|
||||
import waterbox from './widget/waterbox.vue';
|
||||
// import reportbox from './widget/reportbox.vue'
|
||||
import reportlist from './widget/reportlist.vue';
|
||||
import goodsbox from './widget/goodsbox.vue';
|
||||
import trendsbox from './widget/trendsbox.vue';
|
||||
|
|
|
|||
|
|
@ -52,16 +52,10 @@ import axios from "axios";
|
|||
|
||||
<style scoped>
|
||||
.box{
|
||||
width: 340px;
|
||||
height: 200px;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
background-image: url(/img/goods-pingyixian.png);
|
||||
background-size: 100% 100%;
|
||||
text-align:left;
|
||||
z-index: 99;
|
||||
position:absolute;
|
||||
top:500px;
|
||||
left:500px;
|
||||
}
|
||||
.box-title{
|
||||
width:100%;
|
||||
|
|
|
|||
Loading…
Reference in New Issue