bonus
/
bonus-ui
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

监控修改

This commit is contained in:
zzyuan 2025-06-30 14:18:52 +08:00
parent 772a51037c
commit d86c765ea5
3 changed files with 153 additions and 92 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
public/iframe.html
View File

@ -30,19 +30,19 @@ html, body {
<script src="./codebase/webVideoCtrl.js"></script> <script src="./codebase/webVideoCtrl.js"></script>
<script> <script>
var urlParams = new URLSearchParams(window.location.search); var urlParams = new URLSearchParams(window.location.search);
// var type = urlParams.get('type'); var type = urlParams.get('type');
// console.log(type) console.log(type)
$(function () { $(function () {
var height = '350'; var height = '350';
var width = $("body").width(); var width = $("body").width();
// if(type=="dialog"){ if(type=="1"){
// width = $("body").width(); width = $("body").width();
// height = '500'; height = '350';
// } }
// if(type=="sanwei"){ if(type=="2"){
// width = $("body").width(); width = $("body").width();
// height = '230'; height = '600';
// } }
// <20><>ʼ<EFBFBD><CABC><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD> // <20><>ʼ<EFBFBD><CABC><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD><EFBFBD>
WebVideoCtrl.I_InitPlugin(width,height, { WebVideoCtrl.I_InitPlugin(width,height, {
bWndFull: true,//<2F>Ƿ<EFBFBD>֧<EFBFBD>ֵ<EFBFBD><D6B5><EFBFBD><EFBFBD><EFBFBD>˫<EFBFBD><CBAB>ȫ<EFBFBD><C8AB><EFBFBD><EFBFBD>Ĭ<EFBFBD><C4AC>֧<EFBFBD><D6A7> true:֧<><D6A7> false:<3A><>֧<EFBFBD><D6A7> bWndFull: true,//<2F>Ƿ<EFBFBD>֧<EFBFBD>ֵ<EFBFBD><D6B5><EFBFBD><EFBFBD><EFBFBD>˫<EFBFBD><CBAB>ȫ<EFBFBD><C8AB><EFBFBD><EFBFBD>Ĭ<EFBFBD><C4AC>֧<EFBFBD><D6A7> true:֧<><D6A7> false:<3A><>֧<EFBFBD><D6A7>

161
src/views/kitchen/environment/videoMonitoring/index.vue
View File

@ -1,5 +1,8 @@
<template> <template>
<div id="video"> <div id="video">
<div style="width: 100%;">
<el-tabs v-model="activeName" type="card" @tab-click="handleTabClick">
<el-tab-pane label="视频监控" name="1">
<div class="header"><span>视频监控</span></div> <div class="header"><span>视频监控</span></div>
<div style="width: 100%;display: flex;justify-content: space-between;"> <div style="width: 100%;display: flex;justify-content: space-between;">
<div style="width: 20%;"> <div style="width: 20%;">
@ -11,28 +14,53 @@
></el-tree> ></el-tree>
</div> </div>
<div class="contant"> <div class="contant">
<div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px;" @click="chosenWindow(1)"> <div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px;">
<div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('1')"></div> <div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('1')"></div>
<iframe src="iframe.html" ref="videoIframe1" frameborder="0" style="width: 100%;height: 100%;"></iframe> <iframe src="iframe.html?type=1" ref="videoIframe1" frameborder="0" style="width: 100%;height: 100%;"></iframe>
<span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName1}}</span> <span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName1}}</span>
</div> </div>
<div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px" @click="chosenWindow(2)"> <div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px">
<div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('2')"></div> <div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('2')"></div>
<iframe src="iframe.html" ref="videoIframe2" frameborder="0" style="width: 100%;height: 100%;"></iframe> <iframe src="iframe.html?type=1" ref="videoIframe2" frameborder="0" style="width: 100%;height: 100%;"></iframe>
<span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName2}}</span> <span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName2}}</span>
</div> </div>
<div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px" @click="chosenWindow(3)"> <div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px">
<div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('3')"></div> <div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('3')"></div>
<iframe src="iframe.html" ref="videoIframe3" frameborder="0" style="width: 100%;height: 100%;"></iframe> <iframe src="iframe.html?type=1" ref="videoIframe3" frameborder="0" style="width: 100%;height: 100%;"></iframe>
<span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName3}}</span> <span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName3}}</span>
</div> </div>
<div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px" @click="chosenWindow(4)"> <div style="width: 45%;height: 350px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px">
<div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('4')"></div> <div style="width: 100%;height: 100%;position: fixed;" @click="chosenWindow('4')"></div>
<iframe src="iframe.html" ref="videoIframe4" frameborder="0" style="width: 100%;height: 100%;"></iframe> <iframe src="iframe.html?type=1" ref="videoIframe4" frameborder="0" style="width: 100%;height: 100%;"></iframe>
<span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName4}}</span> <span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName4}}</span>
</div> </div>
</div> </div>
</div> </div>
</el-tab-pane>
<el-tab-pane label="历史视频" name="2">
<div class="header"><span>历史视频</span></div>
<div style="width: 100%;display: flex;justify-content: space-between;">
<div style="width: 20%;">
<el-tree style="height: 700px; overflow: scroll"
:data="devicesOptions" :props="defaultProps"
:default-expand-all="true"
:expand-on-click-node="false" @node-click="handleNodeClick"
ref="typeTree" node-key="deviceId" highlight-current
></el-tree>
</div>
<div class="contant">
<div style="width: 100%;height: 600px;margin-bottom: 10px; overflow: hidden;position: relative;margin-right: 10px;">
<div style="width: 100%;height: 100%;position: fixed;"></div>
<iframe src="iframe.html?type=2" ref="videoIframe5" frameborder="0" style="width: 100%;height: 100%;"></iframe>
<span style="position: absolute;left: 0.2rem;bottom:0.2rem;font-size: 14px;color: aliceblue;">{{deviceName1}}</span>
</div>
</div>
</div>
</el-tab-pane>
</el-tabs>
</div>
</div> </div>
</template> </template>
@ -46,6 +74,7 @@ components: {
}, },
data() { data() {
return { return {
activeName:'1',
deviceData:[ deviceData:[
], ],
deviceName1:'监控1', deviceName1:'监控1',
@ -69,7 +98,6 @@ created() {
mounted() { mounted() {
this.getKitchenDeviceSelect(); this.getKitchenDeviceSelect();
this.videoLogin(); this.videoLogin();
}, },
methods:{ methods:{
// 门禁设备选项 // 门禁设备选项
@ -78,7 +106,27 @@ methods:{
this.devicesOptions = response.data this.devicesOptions = response.data
}) })
}, },
// 初始化监控列表
videoLogin(){
setTimeout(() => {
this.iframeLogin('1','11')
this.iframeLogin('2','12')
this.iframeLogin('3','27')
this.iframeLogin('4','28')
}, 1000);
},
//点击设备
handleTabClick(tab){
console.log(this.activeName)
if(this.activeName=='1'){
}
if(this.activeName=='2'){
}
},
chosenWindow(num){ chosenWindow(num){
console.log(num)
this.chosenWinNo = num; this.chosenWinNo = num;
setTimeout(() => { setTimeout(() => {
this.iframeLoaded(this.chosenWinNo,this.chosenChannel) this.iframeLoaded(this.chosenWinNo,this.chosenChannel)
@ -98,6 +146,8 @@ methods:{
} }
}, },
iframeLoaded(domId,channel){ iframeLoaded(domId,channel){
console.log(domId)
console.log(channel)
var oLiveView = { var oLiveView = {
iProtocol: 1, // protocol 1<EFBFBD><EFBFBD>http, 2:https iProtocol: 1, // protocol 1<EFBFBD><EFBFBD>http, 2:https
szIP: "192.168.1.10", // protocol ip szIP: "192.168.1.10", // protocol ip
@ -110,47 +160,67 @@ methods:{
}; };
if(domId=='1'){ if(domId=='1'){
var oWebVideoCtrl1 = this.$refs.videoIframe1.contentWindow.WebVideoCtrl; var oWebVideoCtrl1 = this.$refs.videoIframe1.contentWindow.WebVideoCtrl;
setTimeout(function () { oWebVideoCtrl1.I_Logout(oLiveView.szIP + "_" + oLiveView.szPort)
var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort; // oWebVideoCtrl1.I_Login(oLiveView.szIP, oLiveView.iProtocol, oLiveView.szPort, oLiveView.szUsername, oLiveView.szPassword, {
oWebVideoCtrl1.I_StartRealPlay(szDeviceIdentify, { // success: function (xmlDoc) {
iStreamType: oLiveView.iStreamType, // var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort;
iChannelID: channel, // setTimeout(function () {
bZeroChannel: oLiveView.bZeroChannel // oWebVideoCtrl1.I_StartRealPlay(szDeviceIdentify, {
}); // iStreamType: oLiveView.iStreamType,
}, 500); // iChannelID: channel,
// bZeroChannel: oLiveView.bZeroChannel
// });
// }, 500);
// }
// });
} }
if(domId=='2'){ if(domId=='2'){
var oWebVideoCtrl2 = this.$refs.videoIframe2.contentWindow.WebVideoCtrl; var oWebVideoCtrl2 = this.$refs.videoIframe2.contentWindow.WebVideoCtrl;
setTimeout(function () { oWebVideoCtrl2.I_Logout(oLiveView.szIP + "_" + oLiveView.szPort)
var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort; // oWebVideoCtrl2.I_Login(oLiveView.szIP, oLiveView.iProtocol, oLiveView.szPort, oLiveView.szUsername, oLiveView.szPassword, {
oWebVideoCtrl2.I_StartRealPlay(szDeviceIdentify, { // success: function (xmlDoc) {
iStreamType: oLiveView.iStreamType, // var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort;
iChannelID: channel, // setTimeout(function () {
bZeroChannel: oLiveView.bZeroChannel // oWebVideoCtrl2.I_StartRealPlay(szDeviceIdentify, {
}); // iStreamType: oLiveView.iStreamType,
}, 500); // iChannelID: channel,
// bZeroChannel: oLiveView.bZeroChannel
// });
// }, 500);
// }
// });
} }
if(domId=='3'){ if(domId=='3'){
var oWebVideoCtrl3 = this.$refs.videoIframe3.contentWindow.WebVideoCtrl; var oWebVideoCtrl3 = this.$refs.videoIframe3.contentWindow.WebVideoCtrl;
setTimeout(function () { oWebVideoCtrl3.I_Logout(oLiveView.szIP + "_" + oLiveView.szPort)
var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort; // oWebVideoCtrl3.I_Login(oLiveView.szIP, oLiveView.iProtocol, oLiveView.szPort, oLiveView.szUsername, oLiveView.szPassword, {
oWebVideoCtrl3.I_StartRealPlay(szDeviceIdentify, { // success: function (xmlDoc) {
iStreamType: oLiveView.iStreamType, // var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort;
iChannelID: channel, // setTimeout(function () {
bZeroChannel: oLiveView.bZeroChannel // oWebVideoCtrl3.I_StartRealPlay(szDeviceIdentify, {
}); // iStreamType: oLiveView.iStreamType,
}, 500); // iChannelID: channel,
// bZeroChannel: oLiveView.bZeroChannel
// });
// }, 500);
// }
// });
} }
if(domId=='4'){ if(domId=='4'){
var oWebVideoCtrl4 = this.$refs.videoIframe4.contentWindow.WebVideoCtrl; var oWebVideoCtrl4 = this.$refs.videoIframe4.contentWindow.WebVideoCtrl;
setTimeout(function () { oWebVideoCtrl4.I_Logout(oLiveView.szIP + "_" + oLiveView.szPort)
var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort; // oWebVideoCtrl4.I_Login(oLiveView.szIP, oLiveView.iProtocol, oLiveView.szPort, oLiveView.szUsername, oLiveView.szPassword, {
oWebVideoCtrl4.I_StartRealPlay(szDeviceIdentify, { // success: function (xmlDoc) {
iStreamType: oLiveView.iStreamType, // var szDeviceIdentify = oLiveView.szIP + "_" + oLiveView.szPort;
iChannelID: channel, // setTimeout(function () {
bZeroChannel: oLiveView.bZeroChannel // oWebVideoCtrl4.I_StartRealPlay(szDeviceIdentify, {
}); // iStreamType: oLiveView.iStreamType,
}, 500); // iChannelID: channel,
// bZeroChannel: oLiveView.bZeroChannel
// });
// }, 500);
// }
// });
} }
}, },
iframeLogin(domId,channel){ iframeLogin(domId,channel){
@ -232,14 +302,7 @@ methods:{
// monitor.clickStartRealPlay(null,'1') // monitor.clickStartRealPlay(null,'1')
// this.$refs.vueRef.play();//播放 // this.$refs.vueRef.play();//播放
}, },
videoLogin(){
setTimeout(() => {
this.iframeLogin('1','11')
this.iframeLogin('2','12')
this.iframeLogin('3','27')
this.iframeLogin('4','28')
}, 1000);
},
} }
} }
</script> </script>

2
src/views/kitchen/index.vue
View File

@ -242,8 +242,6 @@ export default {
this.InitEChartsThree() this.InitEChartsThree()
this.InitEChartsFour() this.InitEChartsFour()
this.InitEChartsFive() this.InitEChartsFive()
}); });
}, },
changDate1(){ changDate1(){