Merge branch 'shenzhen-dev' of http://10.0.0.60/dhp/zhgdyun into shenzhen-dev
This commit is contained in:
骆乐
commit
8cae38f9b4
@ -1,99 +1,113 @@
|
||||
<template>
|
||||
<div id="playWnd"></div>
|
||||
<div id="playWnd"></div>
|
||||
</template>
|
||||
<script>
|
||||
let closeVideo=null
|
||||
import {
|
||||
OpenVideo,
|
||||
unInitObjPlugin,
|
||||
InitObjPlugin,hidePluginWindow,showPluginWindow,resizeFn,isLoadPlugin
|
||||
InitObjPlugin, hidePluginWindow, showPluginWindow, resizeFn, isLoadPlugin, setWidthAndHeight, setOffset
|
||||
} from "./video_isc_plugin.js";
|
||||
export default {
|
||||
props: ["devList","type"],
|
||||
watch: {
|
||||
//监听value的变化，进行相应的操作即可
|
||||
devList: function (a, b) {
|
||||
console.log('isc_plugin.vue获取到设备列表')
|
||||
//a是value的新值，b是旧值
|
||||
if(a.length>0){
|
||||
isLoadPlugin(a,this.layout)
|
||||
}else{
|
||||
// unInitObjPlugin()
|
||||
}
|
||||
|
||||
// a.forEach(element => {
|
||||
// setTimeout(()=>{
|
||||
// OpenVideo(element.serialNumber,1)
|
||||
// },500)
|
||||
|
||||
// });
|
||||
|
||||
},
|
||||
isExpand:{
|
||||
immediate: true,
|
||||
handler: function (newval) {
|
||||
console.log('resizeFn')
|
||||
resizeFn()
|
||||
}
|
||||
}
|
||||
props: ["devList", "type", 'isIframe'],
|
||||
watch: {
|
||||
//监听value的变化，进行相应的操作即可
|
||||
devList: function (a, b) {
|
||||
console.log('isc_plugin.vue获取到设备列表')
|
||||
//a是value的新值，b是旧值
|
||||
if (a.length > 0) {
|
||||
isLoadPlugin(a, this.layout)
|
||||
} else {
|
||||
// unInitObjPlugin()
|
||||
}
|
||||
|
||||
// a.forEach(element => {
|
||||
// setTimeout(()=>{
|
||||
// OpenVideo(element.serialNumber,1)
|
||||
// },500)
|
||||
|
||||
// });
|
||||
|
||||
},
|
||||
computed: {
|
||||
isExpand() {
|
||||
return this.$store.state.isExpand;
|
||||
}
|
||||
isExpand: {
|
||||
immediate: true,
|
||||
handler: function (newval) {
|
||||
console.log('resizeFn')
|
||||
resizeFn()
|
||||
}
|
||||
},
|
||||
|
||||
data(){
|
||||
return{
|
||||
layout:''
|
||||
}
|
||||
},
|
||||
created(){
|
||||
this.$EventBus.$on("controlVideoShowOrHide", (data) => {
|
||||
console.log('controlVideoShowOrHide',data)
|
||||
if(data=='hide'){
|
||||
hidePluginWindow()
|
||||
}else{
|
||||
showPluginWindow()
|
||||
}
|
||||
});
|
||||
},
|
||||
mounted(){
|
||||
var layout = '2x2'
|
||||
if(this.type=='company'){
|
||||
// layout='6x10'
|
||||
layout='4x6'
|
||||
}
|
||||
if(this.type.indexOf('x')!=-1){
|
||||
layout=this.type
|
||||
}
|
||||
this.layout=layout
|
||||
console.log('加载isc_plugin.vue')
|
||||
// console.log(this.type)
|
||||
// console.log('layout',layout)
|
||||
// InitObjPlugin(
|
||||
// this.devList[0].appId,
|
||||
// this.devList[0].appSecret,
|
||||
// this.devList[0].account,
|
||||
// this.devList[0].password,
|
||||
// false,
|
||||
// this.devList,layout
|
||||
// );
|
||||
if(this.devList.length>0){
|
||||
isLoadPlugin(this.devList,this.layout)
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
//反初始化
|
||||
unInitObjPlugin();
|
||||
},
|
||||
methods:{
|
||||
|
||||
},
|
||||
computed: {
|
||||
isExpand() {
|
||||
return this.$store.state.isExpand;
|
||||
}
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
layout: ''
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (COMPANY == 'xingxuan') { setWidthAndHeight(633, 381); }
|
||||
|
||||
this.$EventBus.$on("controlVideoShowOrHide", (data) => {
|
||||
console.log('controlVideoShowOrHide', data)
|
||||
if (data == 'hide') {
|
||||
hidePluginWindow()
|
||||
} else {
|
||||
showPluginWindow()
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
mounted() {
|
||||
// if (COMPANY == 'xingxuan') {
|
||||
// closeVideo= setInterval(()=>{
|
||||
// window.onhashchange = function () {
|
||||
// hidePluginWindow();
|
||||
// clearTimeout(closeVideo);
|
||||
// };
|
||||
// },1000)
|
||||
// }
|
||||
|
||||
var layout = '2x2'
|
||||
if (this.type == 'company') {
|
||||
// layout='6x10'
|
||||
layout = '4x6'
|
||||
}
|
||||
if (this.type.indexOf('x') != -1) {
|
||||
layout = this.type
|
||||
}
|
||||
this.layout = layout
|
||||
console.log('加载isc_plugin.vue')
|
||||
// console.log(this.type)
|
||||
// console.log('layout',layout)
|
||||
// InitObjPlugin(
|
||||
// this.devList[0].appId,
|
||||
// this.devList[0].appSecret,
|
||||
// this.devList[0].account,
|
||||
// this.devList[0].password,
|
||||
// false,
|
||||
// this.devList,layout
|
||||
// );
|
||||
if (this.devList.length > 0) {
|
||||
isLoadPlugin(this.devList, this.layout)
|
||||
}
|
||||
},
|
||||
beforeDestroy() {
|
||||
//反初始化
|
||||
unInitObjPlugin();
|
||||
},
|
||||
methods: {
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
#playWnd{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
#playWnd {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
@ -3,21 +3,21 @@ import './jsencrypt.min.js'
|
||||
// WebControl
|
||||
// } from './jsWebControl-1.0.0.min.js'
|
||||
|
||||
var isChrome = navigator.userAgent.indexOf('Chrome') > -1 // 是否是谷歌
|
||||
var isChrome = navigator.userAgent.indexOf('Chrome') > -1 // 是否是谷歌
|
||||
|
||||
if(isChrome){
|
||||
if (isChrome) {
|
||||
// let WebControl = null
|
||||
var aa = ()=>import('./jsWebControl-1.0.0.min.js')
|
||||
aa().then(res=>{
|
||||
var aa = () => import('./jsWebControl-1.0.0.min.js')
|
||||
aa().then(res => {
|
||||
console.log(res)
|
||||
WebControl = res.WebControl
|
||||
})
|
||||
}
|
||||
console.log('谷歌'+ isChrome)
|
||||
console.log('谷歌' + isChrome)
|
||||
var oWebControl = null;
|
||||
var pubKey = '';
|
||||
var initCount = 0;
|
||||
var a, b, c, d, types,layouts;
|
||||
var a, b, c, d, types, layouts;
|
||||
var width, height;
|
||||
// var _thiss;
|
||||
// 获取公钥
|
||||
@ -45,7 +45,7 @@ function setEncrypt(value) {
|
||||
export function unInitObjPlugin() {
|
||||
console.log('调用unInitObjPlugin', '5555555');
|
||||
//
|
||||
if(!oWebControl){
|
||||
if (!oWebControl) {
|
||||
return false;
|
||||
}
|
||||
oWebControl.JS_RequestInterface({
|
||||
@ -60,17 +60,17 @@ export function unInitObjPlugin() {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_Disconnect().then(function () {
|
||||
console.log("JS_Disconnect");
|
||||
}, function () {});
|
||||
}, function () { });
|
||||
}
|
||||
} else {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_DestroyWnd().then(function () {
|
||||
console.log("JS_DestroyWnd");
|
||||
}, function () {});
|
||||
}, function () { });
|
||||
oWebControl.JS_StopService("window").then(function () {
|
||||
oWebControl.JS_Disconnect().then(function () {
|
||||
console.log("JS_Disconnect");
|
||||
}, function () {});
|
||||
}, function () { });
|
||||
});
|
||||
}
|
||||
}
|
||||
@ -92,7 +92,7 @@ export function OpenVideo(cameraIndexCode, streamMode, winIndex) {
|
||||
}).then(function (oData) {
|
||||
console.log(oData.responseMsg.code === 336)
|
||||
console.log(JSON.stringify(oData ? oData.responseMsg : ''));
|
||||
|
||||
|
||||
// if(oData.responseMsg.code === 336){
|
||||
// return
|
||||
// }
|
||||
@ -113,9 +113,9 @@ function getRatio() {
|
||||
let bodyHeight = document.body.clientHeight
|
||||
let scaleWidthNum = bodyWidth / 1920
|
||||
let scaleHeightNum = bodyHeight / 1080
|
||||
|
||||
|
||||
let ratio;
|
||||
if(scaleWidthNum > scaleHeightNum){
|
||||
if (scaleWidthNum > scaleHeightNum) {
|
||||
ratio = scaleHeightNum
|
||||
} else {
|
||||
ratio = scaleWidthNum
|
||||
@ -124,14 +124,14 @@ function getRatio() {
|
||||
}
|
||||
|
||||
// 初始化
|
||||
export function InitObjPlugin(appkey, secret, ip, port, type, videoData,layout) {
|
||||
export function InitObjPlugin(appkey, secret, ip, port, type, videoData, layout) {
|
||||
console.log(videoData)
|
||||
a = appkey
|
||||
b = secret
|
||||
c = ip
|
||||
d = port
|
||||
types = type
|
||||
layouts=layout
|
||||
layouts = layout
|
||||
//
|
||||
oWebControl = new WebControl({
|
||||
szPluginContainer: "playWnd",
|
||||
@ -149,35 +149,35 @@ export function InitObjPlugin(appkey, secret, ip, port, type, videoData,layout)
|
||||
// width = a.offsetWidth - 10
|
||||
// height = a.offsetHeight - 60
|
||||
// } else {
|
||||
// console.log(document.getElementById('videoOverview').offsetWidth,document.getElementById('videoOverview').offsetHeight)
|
||||
var bottomHeight = 0
|
||||
// if(window.location.href.indexOf('/project/')!=-1){
|
||||
// bottomHeight = 60
|
||||
// }
|
||||
width = document.getElementById('videoOverview').offsetWidth
|
||||
height = document.getElementById('videoOverview').offsetHeight - bottomHeight
|
||||
let ratio = 1
|
||||
// console.log(JSON.parse(localStorage.getItem('systemInfo')).zoomType)
|
||||
if(enabledProjectV2!=1){
|
||||
if(localStorage.getItem('systemInfo') && JSON.parse(localStorage.getItem('systemInfo')).zoomType != 1){
|
||||
ratio = getRatio()
|
||||
}
|
||||
// console.log(document.getElementById('videoOverview').offsetWidth,document.getElementById('videoOverview').offsetHeight)
|
||||
var bottomHeight = 0
|
||||
// if(window.location.href.indexOf('/project/')!=-1){
|
||||
// bottomHeight = 60
|
||||
// }
|
||||
width = document.getElementById('videoOverview').offsetWidth
|
||||
height = document.getElementById('videoOverview').offsetHeight - bottomHeight
|
||||
let ratio = 1
|
||||
// console.log(JSON.parse(localStorage.getItem('systemInfo')).zoomType)
|
||||
if (enabledProjectV2 != 1) {
|
||||
if (localStorage.getItem('systemInfo') && JSON.parse(localStorage.getItem('systemInfo')).zoomType != 1) {
|
||||
ratio = getRatio()
|
||||
}
|
||||
console.log(ratio)
|
||||
width = width*ratio
|
||||
height = height*ratio
|
||||
// width = 500
|
||||
// height = 500
|
||||
// console.dir(document.getElementById('videoOverview'))
|
||||
console.log(width, height)
|
||||
}
|
||||
console.log(ratio)
|
||||
width = width * ratio
|
||||
height = height * ratio
|
||||
// width = 500
|
||||
// height = 500
|
||||
// console.dir(document.getElementById('videoOverview'))
|
||||
console.log(width, height)
|
||||
// }
|
||||
window.$timeId = null;
|
||||
if(window.localStorage.getItem('isIframe')){
|
||||
if(window.localStorage.getItem('isIframe') == '1'){
|
||||
if (window.localStorage.getItem('isIframe')) {
|
||||
if (window.localStorage.getItem('isIframe') == '1') {
|
||||
// width = 796
|
||||
// height = 672
|
||||
width = width*0.66
|
||||
height = height*0.98
|
||||
width = width * 0.66
|
||||
height = height * 0.98
|
||||
}
|
||||
console.log(window.localStorage.getItem('isIframe'))
|
||||
}
|
||||
@ -190,12 +190,12 @@ export function InitObjPlugin(appkey, secret, ip, port, type, videoData,layout)
|
||||
// if(enabledProjectV2!=1){
|
||||
// ratio = getRatio()
|
||||
// }
|
||||
width = width*ratio
|
||||
height = height*ratio
|
||||
width = width * ratio
|
||||
height = height * ratio
|
||||
clearTimeout(window.$timeId);
|
||||
window.$timeId = setTimeout(() => {
|
||||
var a = document.getElementById('videoBoxContainer') || document.querySelector('.videocBox')
|
||||
if(a){
|
||||
if (a) {
|
||||
width = a.offsetWidth
|
||||
height = a.offsetHeight - 80
|
||||
}
|
||||
@ -205,19 +205,19 @@ export function InitObjPlugin(appkey, secret, ip, port, type, videoData,layout)
|
||||
}
|
||||
}, 10);
|
||||
}
|
||||
oWebControl.JS_CreateWnd("playWnd", width, height,{
|
||||
oWebControl.JS_CreateWnd("playWnd", width, height, {
|
||||
cbSetDocTitle: function (uuid) {
|
||||
oWebControl._pendBg = false;
|
||||
window.parent.postMessage({
|
||||
action:'updateTitle',
|
||||
msg:'子页面通知父页面修改title',
|
||||
info:uuid
|
||||
action: 'updateTitle',
|
||||
msg: '子页面通知父页面修改title',
|
||||
info: uuid
|
||||
}, '\*'); // '\*'表示跨域参数，请结合自身业务合理设置
|
||||
}
|
||||
}).then(function () {
|
||||
console.log("JS_CreateWnd success");
|
||||
// ;
|
||||
|
||||
|
||||
init(videoData)
|
||||
});
|
||||
}, function () {
|
||||
@ -305,15 +305,24 @@ function init(videoData) {
|
||||
buttonIDs: buttonIDs //自定义工具条按钮
|
||||
})
|
||||
}).then(function (oData) {
|
||||
console.log(width, height,oWebControl)
|
||||
console.log(width, height, oWebControl)
|
||||
console.log('COMPANY++++++++++++++',COMPANY)
|
||||
console.log(window.localStorage.getItem('isIframe'))
|
||||
|
||||
if (COMPANY=='xingxuan') {
|
||||
oWebControl.oDocOffset.top = 94;
|
||||
oWebControl.oDocOffset.left = 280;
|
||||
}
|
||||
|
||||
|
||||
oWebControl.JS_Resize(width, height);
|
||||
// console.log('OpenVideo')
|
||||
for (let i = 0; i < videoData.length; i++) {
|
||||
if (i < 24 && videoData.length >= i) {
|
||||
// setTimeout(()=>{
|
||||
OpenVideo(videoData[i].serialNumber, 0, i + 1)
|
||||
OpenVideo(videoData[i].serialNumber, 0, i + 1)
|
||||
// },1000)
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
// oWebControl.JS_Resize(1000, 600); // 初始化后resize一次，规避firefox下首次显示窗口后插件窗口未与DIV窗口重合问题
|
||||
@ -321,23 +330,23 @@ function init(videoData) {
|
||||
});
|
||||
}
|
||||
//判断有没有初始化插件
|
||||
export function isLoadPlugin(devList,layout){
|
||||
console.log('isLoadPlugin',oWebControl,devList)
|
||||
if(oWebControl){
|
||||
export function isLoadPlugin(devList, layout) {
|
||||
console.log('isLoadPlugin', oWebControl, devList)
|
||||
if (oWebControl) {
|
||||
devList.forEach(element => {
|
||||
setTimeout(()=>{
|
||||
OpenVideo(element.serialNumber,1)
|
||||
},500)
|
||||
|
||||
setTimeout(() => {
|
||||
OpenVideo(element.serialNumber, 1)
|
||||
}, 500)
|
||||
|
||||
});
|
||||
}else{
|
||||
} else {
|
||||
InitObjPlugin(
|
||||
devList[0].appId,
|
||||
devList[0].appSecret,
|
||||
devList[0].account,
|
||||
devList[0].password,
|
||||
false,
|
||||
devList,layout
|
||||
devList[0].appId,
|
||||
devList[0].appSecret,
|
||||
devList[0].account,
|
||||
devList[0].password,
|
||||
false,
|
||||
devList, layout
|
||||
);
|
||||
}
|
||||
}
|
||||
@ -371,25 +380,25 @@ window.onscroll = function () {
|
||||
}
|
||||
}
|
||||
//窗口关闭时销毁插件
|
||||
window.onunload=function(){
|
||||
if (oWebControl != null){
|
||||
window.onunload = function () {
|
||||
if (oWebControl != null) {
|
||||
oWebControl.JS_HideWnd(); // 先让窗口隐藏，规避可能的插件窗口滞后于浏览器消失问题
|
||||
oWebControl.JS_Disconnect().then(function(){}, function() {});
|
||||
oWebControl.JS_Disconnect().then(function () { }, function () { });
|
||||
}
|
||||
}
|
||||
export function resizeFn(val){
|
||||
if(oWebControl){
|
||||
export function resizeFn(val) {
|
||||
if (oWebControl) {
|
||||
width = document.getElementById('videoOverview').offsetWidth
|
||||
height = document.getElementById('videoOverview').offsetHeight - 0
|
||||
if(val && val == 1){
|
||||
oWebControl.JS_Resize(width/2+20, height-215);
|
||||
} else{
|
||||
if (val && val == 1) {
|
||||
oWebControl.JS_Resize(width / 2 + 20, height - 215);
|
||||
} else {
|
||||
oWebControl.JS_Resize(width, height);
|
||||
}
|
||||
|
||||
// setWndCover();
|
||||
|
||||
// setWndCover();
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
// 设置窗口遮挡
|
||||
function setWndCover() {
|
||||
@ -430,7 +439,7 @@ function setWndCover() {
|
||||
}
|
||||
}
|
||||
//隐藏插件窗口
|
||||
export function hidePluginWindow(){
|
||||
export function hidePluginWindow() {
|
||||
// console.log(123)
|
||||
// console.log('hidePluginWindow')
|
||||
oWebControl.JS_HideWnd()
|
||||
@ -441,7 +450,7 @@ export function hidePluginWindow(){
|
||||
// })
|
||||
}
|
||||
//显示插件窗口
|
||||
export function showPluginWindow(){
|
||||
export function showPluginWindow() {
|
||||
// console.log(112)
|
||||
// console.log('showPluginWindow')
|
||||
oWebControl.JS_ShowWnd()
|
||||
@ -451,9 +460,15 @@ export function showPluginWindow(){
|
||||
// console.log('showPluginWindow',data)
|
||||
// })
|
||||
}
|
||||
export function setOffset(l,t){
|
||||
WebControl.JS_SetDocOffset ({
|
||||
export function setOffset(l, t) {
|
||||
WebControl.JS_SetDocOffset({
|
||||
left: l,
|
||||
top: t
|
||||
})
|
||||
console.log(l, t, "===============================")
|
||||
}
|
||||
|
||||
export function setWidthAndHeight(width, height) {
|
||||
oWebControl.JS_Resize(width, height);
|
||||
|
||||
}
|
||||
@ -1,8 +1,8 @@
|
||||
<template>
|
||||
<!-- 下拉框选择视频，需传入视频列表 -->
|
||||
<div class="fullHeight videoOverview" id="videoOverview">
|
||||
<leCheng v-if="pluginType=='lecheng'" :url='urls' :token="lcToken"></leCheng>
|
||||
<iscPlugin v-else-if="pluginType=='isc'" :type="type" :devList="devList" :class="{'isDockingToWoer': isDockingToWoer, 'isLongguangIframe': isIframe, 'isFullScreen': isFullScreen}" :style="{left:worMenuWidth+'px'}"></iscPlugin>
|
||||
<leCheng v-if="pluginType=='lecheng'" :url='urls' :token="lcToken"></leCheng>
|
||||
<iscPlugin v-else-if="pluginType=='isc'" :type="type" :isIframe="isIframe" :devList="devList" :class="{'isDockingToWoer': isDockingToWoer, 'isLongguangIframe': isIframe, 'isFullScreen': isFullScreen}" :style="{left:worMenuWidth+'px'}"></iscPlugin>
|
||||
<div v-else
|
||||
:class="!bottomMod?'oneVideoContent videoContent'+winNum:'videoContent videoContent'+winNum"
|
||||
>
|
||||
@ -226,7 +226,9 @@ export default {
|
||||
isFullScreen: false
|
||||
};
|
||||
},
|
||||
|
||||
destroy(){
|
||||
hidePluginWindow()
|
||||
},
|
||||
created() {
|
||||
this.company = COMPANY;
|
||||
this.devList = this.$props.value;
|
||||
@ -282,6 +284,7 @@ export default {
|
||||
}
|
||||
// window.addEventListener('keydown',this.fullScreen)
|
||||
// console.log(document.getElementById('videoOverview'))
|
||||
|
||||
},
|
||||
destroyed() {
|
||||
if (this.pluginType == "videojs") {
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user