吊装监控
This commit is contained in:
parent
78f0a8519b
commit
5ba4211691
File diff suppressed because one or more lines are too long
|
|
@ -0,0 +1,212 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<title>Document</title>
|
||||
<style type="text/css">
|
||||
html,
|
||||
body {
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
button {
|
||||
font-size: 12px;
|
||||
color: #232323;
|
||||
}
|
||||
</style>
|
||||
|
||||
<link href="css/chunk-common.css" rel="stylesheet">
|
||||
<script type="text/javascript">
|
||||
var video;
|
||||
|
||||
window.onVideoRealPlayLoad = function (suport, v) {
|
||||
if (suport == false) return alert("不支持该浏览器！");
|
||||
video = v;
|
||||
//this.init();
|
||||
}
|
||||
|
||||
//初始化================================================================================================
|
||||
|
||||
function init() {
|
||||
var videoIp = document.getElementById("videoIp").value;
|
||||
var videoPort = parseInt(document.getElementById("videoPort").value);
|
||||
var timeout = document.getElementById("timeout").value;
|
||||
var user = document.getElementById("user").value;
|
||||
var pwd = document.getElementById("pwd").value;
|
||||
var row = parseInt(document.getElementById("row").value);
|
||||
var col = parseInt(document.getElementById("col").value);
|
||||
|
||||
video.init({ ip: videoIp, port: videoPort, user: user, pwd: pwd, timeout: timeout, row: row, col: col, toolbar: 'top'/*top|bottom|false*/, onServerOpen: onServerOpen, onServerClose: onServerClose, onVideoClose: onVideoClose });
|
||||
}
|
||||
|
||||
function onServerOpen(time) {
|
||||
alert("第" + time + "次连接上视频服务器");
|
||||
}
|
||||
|
||||
function onServerClose(time) {
|
||||
alert("第" + time + "次断开视频服务器");
|
||||
}
|
||||
|
||||
//视频================================================================================================
|
||||
|
||||
function onVideoClose(sim, chn) {
|
||||
alert("视频关闭 SIM卡号:" + sim + " 通道号:" + chn);
|
||||
}
|
||||
|
||||
function playVideo() {
|
||||
var playTitle = document.getElementById("playTitle").value;
|
||||
var playSim = document.getElementById("playSim").value;
|
||||
var playChn = document.getElementById("playChn").value;
|
||||
var playStream = 1;// 0-清晰(主码流); 1-流畅(子码流) 可不传该参数
|
||||
var cloud = document.getElementById("cloud").checked;
|
||||
|
||||
var ret = video.playVideo(playTitle, playSim, playChn, playStream, cloud);
|
||||
if (ret === 1) {
|
||||
alert("成功播放");
|
||||
} else if (ret === -1) {
|
||||
alert("窗口播放满了,不播放");
|
||||
} else if (ret === 0) {
|
||||
alert("该设备通道已经有窗口在播放");
|
||||
}
|
||||
}
|
||||
|
||||
function closeVideo() {
|
||||
var playSim = document.getElementById("playSim").value;
|
||||
var playChn = document.getElementById("playChn").value;
|
||||
video.closeVideo(playSim, playChn);
|
||||
}
|
||||
|
||||
//对讲================================================================================================
|
||||
|
||||
function playTalk() {
|
||||
var sim = document.getElementById("sim").value;
|
||||
var chn = document.getElementById("chn").value;
|
||||
video.playTalk(sim, chn, onTalkResult, onTalkClose);
|
||||
}
|
||||
|
||||
function onTalkResult(state, sim, chn, tip) {
|
||||
if (state === 0) return alert("设备请求失败 SIM卡号:" + sim + " 通道号:" + chn + " 原因:" + tip);
|
||||
if (state === 1) return alert("对讲成功 SIM卡号:" + sim + " 通道号:" + chn);
|
||||
if (state === 2) return alert("设备请求成功，但获取不到麦克风！ SIM卡号:" + sim + " 通道号:" + chn + " 原因:" + tip);
|
||||
}
|
||||
|
||||
function onTalkClose(sim, chn) {
|
||||
alert("对讲关闭 SIM卡号:" + sim + " 通道号:" + chn);
|
||||
}
|
||||
|
||||
function closeTalk() {
|
||||
video.closeTalk();
|
||||
}
|
||||
|
||||
//监听================================================================================================
|
||||
|
||||
function playListen() {
|
||||
var sim = document.getElementById("sim").value;
|
||||
var chn = document.getElementById("chn").value;
|
||||
video.playListen(sim, chn, onListenResult, onListenClose);
|
||||
}
|
||||
|
||||
function onListenResult(state, sim, chn, tip) {
|
||||
if (state === 0) return alert("设备监听失败 SIM卡号:" + sim + " 通道号:" + chn + " 原因:" + tip);
|
||||
if (state === 1) return alert("监听成功 SIM卡号:" + sim + " 通道号:" + chn);
|
||||
}
|
||||
|
||||
function onListenClose(sim, chn) {
|
||||
alert("监听关闭 SIM卡号:" + sim + " 通道号:" + chn);
|
||||
}
|
||||
|
||||
function closeListen() {
|
||||
video.closeListen();
|
||||
}
|
||||
|
||||
//布局================================================================================================
|
||||
|
||||
function regrid() {
|
||||
var row = document.getElementById("row").value;
|
||||
var col = document.getElementById("col").value;
|
||||
video.regrid(parseInt(row), parseInt(col));
|
||||
}
|
||||
|
||||
//关闭全部================================================================================================
|
||||
|
||||
function closeAll() {
|
||||
video.closeAll();
|
||||
}
|
||||
|
||||
//销毁全部================================================================================================
|
||||
|
||||
function destroy() {
|
||||
video.destroy();
|
||||
video = null;
|
||||
}
|
||||
|
||||
function toolbar(v) {
|
||||
video && (video.toolbar = v);
|
||||
}
|
||||
</script>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div style="border:1px solid #D6D6D6;background:#F5F5F5;padding:5px;margin:5px;">
|
||||
<span>视频服务器IP</span>
|
||||
<input type="text" id="videoIp" value="8.142.156.35" style="width:100px;">
|
||||
<span style="margin-left:5px;">端口</span>
|
||||
<input type="text" id="videoPort" value="9988" style="width:30px;">
|
||||
<span style="margin-left:5px;">未操作关闭(0不关闭)</span>
|
||||
<input type="text" id="timeout" value="300" style="width:30px;">
|
||||
<span>秒</span>
|
||||
<span style="margin-left:5px;">登录用户</span>
|
||||
<input type="text" id="user" value="TSH" style="width:47px;">
|
||||
<span style="margin-left:5px;">登录密码</span>
|
||||
<input type="text" id="pwd" value="77804d2ba1922c33" style="width:120px;">
|
||||
<button onclick="init()">初始化</button>
|
||||
</div>
|
||||
<div style="border:1px solid #D6D6D6;background:#F5F5F5;padding:5px;margin:-6px 5px 5px 5px;">
|
||||
<span>设备SIM卡号</span>
|
||||
<input type="text" id="playSim" value="19500000002" style="width:100px;">
|
||||
<span style="margin-left:5px;">通道号</span>
|
||||
<input type="text" id="playChn" value="1" style="width:30px;">
|
||||
<span style="margin-left:5px;">标题</span>
|
||||
<input type="text" id="playTitle" value="车辆A-通道B" style="margin-left:5px;width:95px;">
|
||||
<span style="margin-left:5px;">云台</span>
|
||||
<input type="checkbox" id="cloud" checked />
|
||||
<button type="button" onclick="playVideo()">播放视频</button>
|
||||
<button type="button" onclick="closeVideo()">停止视频</button>
|
||||
</div>
|
||||
<div style="border:1px solid #D6D6D6;background:#F5F5F5;padding:5px;margin:-6px 5px 5px 5px;">
|
||||
<span>设备SIM卡号</span>
|
||||
<input type="text" id="sim" value="19500000002" style="width:100px;">
|
||||
<span style="margin-left:5px;">通道号</span>
|
||||
<input type="text" id="chn" value="2" style="width:30px;">
|
||||
<button type="button" onclick="playTalk()">开始对讲</button>
|
||||
<button type="button" onclick="closeTalk()">停止对讲</button>
|
||||
<button type="button" onclick="playListen()">开始监听</button>
|
||||
<button type="button" onclick="closeListen()">停止监听</button>
|
||||
</div>
|
||||
<div style="border:1px solid #D6D6D6;background:#F5F5F5;padding:5px;margin:-6px 5px 5px 5px;">
|
||||
<span>工具栏</span>
|
||||
<button type="button" onclick="toolbar('top')">顶</button>
|
||||
<button type="button" onclick="toolbar('bottom')" style="margin-left:-5px;">底</button>
|
||||
<button type="button" onclick="toolbar(false)" style="margin-left:-5px;">无</button>
|
||||
<input type="text" id="row" value="3" style="width:15px;">行
|
||||
<input type="text" id="col" value="3" style="width:15px;">列
|
||||
<button type="button" onclick="regrid()">确定</button>
|
||||
<button onclick="closeAll()">关闭所有视频/对讲/监听</button>
|
||||
<button onclick="destroy()">离开页面销毁</button>
|
||||
</div>
|
||||
|
||||
<div style="width:calc(100% - 10px);height:calc(100% - 147px);position:absolute;left:5px;top:142px;">
|
||||
<div id="VideoRealPlay"></div>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
<script src="./js/chunk-vendors.js" type="text/javascript"></script>
|
||||
<script src="./js/chunk-common.js" type="text/javascript"></script>
|
||||
<script src="./js/VideoRealPlay.js" type="text/javascript"></script>
|
||||
|
||||
</html>
|
||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
After Width: | Height: | Size: 31 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
|
|
@ -0,0 +1 @@
|
|||
(function(e){function n(n){for(var t,i,l=n[0],a=n[1],c=n[2],f=0,p=[];f<l.length;f++)i=l[f],o[i]&&p.push(o[i][0]),o[i]=0;for(t in a)Object.prototype.hasOwnProperty.call(a,t)&&(e[t]=a[t]);d&&d(n);while(p.length)p.shift()();return u.push.apply(u,c||[]),r()}function r(){for(var e,n=0;n<u.length;n++){for(var r=u[n],t=!0,l=1;l<r.length;l++){var a=r[l];0!==o[a]&&(t=!1)}t&&(u.splice(n--,1),e=i(i.s=r[0]))}return e}var t={},o={VideoPlay:0},u=[];function i(n){if(t[n])return t[n].exports;var r=t[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,i),r.l=!0,r.exports}i.m=e,i.c=t,i.d=function(e,n,r){i.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},i.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},i.t=function(e,n){if(1&n&&(e=i(e)),8&n)return e;if(4&n&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(i.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var t in e)i.d(r,t,function(n){return e[n]}.bind(null,t));return r},i.n=function(e){var n=e&&e.__esModule?function(){return e["default"]}:function(){return e};return i.d(n,"a",n),n},i.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},i.p="";var l=window["webpackJsonp"]=window["webpackJsonp"]||[],a=l.push.bind(l);l.push=n,l=l.slice();for(var c=0;c<l.length;c++)n(l[c]);var d=a;u.push([2,"chunk-vendors","chunk-common"]),r()})({2:function(e,n,r){e.exports=r("8db3")},"8db3":function(e,n,r){"use strict";r.r(n);var t=r("2b0e"),o=(r("10c1"),r("2229"),r("6c89"),r("fd4c")),u=(r("c695"),r("64fd")),i=(r("7f70"),r("774a")),l=r("299b");window._babelPolyfill||r("db4d"),t["a"].mixin(o["a"]),t["a"].use(u["a"]),window.VideoRealPlayMount=e=>{let n=new t["a"]({render:e=>e(l["a"])}).$mount(a(e));return c(n,e)},window.VideoPlayBackMount=e=>{let n=new t["a"]({render:e=>e(i["a"])}).$mount(a(e));return c(n,e)};let a=function(e){let n=document.createElement("div");return e.appendChild(n),n},c=function(e,n){return e.destroy=()=>{e.$children[0].destroy(),e.$destroy(),n.innerHTML=""},e}}});
|
||||
|
|
@ -0,0 +1 @@
|
|||
(function(e){function n(n){for(var t,a,i=n[0],l=n[1],c=n[2],d=0,p=[];d<i.length;d++)a=i[d],o[a]&&p.push(o[a][0]),o[a]=0;for(t in l)Object.prototype.hasOwnProperty.call(l,t)&&(e[t]=l[t]);f&&f(n);while(p.length)p.shift()();return u.push.apply(u,c||[]),r()}function r(){for(var e,n=0;n<u.length;n++){for(var r=u[n],t=!0,i=1;i<r.length;i++){var l=r[i];0!==o[l]&&(t=!1)}t&&(u.splice(n--,1),e=a(a.s=r[0]))}return e}var t={},o={VideoPlayBack:0},u=[];function a(n){if(t[n])return t[n].exports;var r=t[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,a),r.l=!0,r.exports}a.m=e,a.c=t,a.d=function(e,n,r){a.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},a.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},a.t=function(e,n){if(1&n&&(e=a(e)),8&n)return e;if(4&n&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(a.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var t in e)a.d(r,t,function(n){return e[n]}.bind(null,t));return r},a.n=function(e){var n=e&&e.__esModule?function(){return e["default"]}:function(){return e};return a.d(n,"a",n),n},a.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},a.p="";var i=window["webpackJsonp"]=window["webpackJsonp"]||[],l=i.push.bind(i);i.push=n,i=i.slice();for(var c=0;c<i.length;c++)n(i[c]);var f=l;u.push([1,"chunk-vendors","chunk-common"]),r()})({1:function(e,n,r){e.exports=r("5079")},5079:function(e,n,r){"use strict";r.r(n);var t=r("2b0e"),o=(r("10c1"),r("2229"),r("6c89"),r("fd4c")),u=(r("c695"),r("64fd")),a=(r("7f70"),r("774a"));window._babelPolyfill||r("db4d"),t["a"].mixin(o["a"]),t["a"].use(u["a"]);let i=document.getElementById("VideoPlayBack");i?new t["a"]({render:e=>e(a["a"])}).$mount("#VideoPlayBack"):window.VideoPlayBackMount=e=>{return new t["a"]({render:e=>e(a["a"])}).$mount(e)}}});
|
||||
|
|
@ -0,0 +1 @@
|
|||
(function(e){function n(n){for(var t,l,a=n[0],i=n[1],c=n[2],d=0,p=[];d<a.length;d++)l=a[d],o[l]&&p.push(o[l][0]),o[l]=0;for(t in i)Object.prototype.hasOwnProperty.call(i,t)&&(e[t]=i[t]);f&&f(n);while(p.length)p.shift()();return u.push.apply(u,c||[]),r()}function r(){for(var e,n=0;n<u.length;n++){for(var r=u[n],t=!0,a=1;a<r.length;a++){var i=r[a];0!==o[i]&&(t=!1)}t&&(u.splice(n--,1),e=l(l.s=r[0]))}return e}var t={},o={VideoRealPlay:0},u=[];function l(n){if(t[n])return t[n].exports;var r=t[n]={i:n,l:!1,exports:{}};return e[n].call(r.exports,r,r.exports,l),r.l=!0,r.exports}l.m=e,l.c=t,l.d=function(e,n,r){l.o(e,n)||Object.defineProperty(e,n,{enumerable:!0,get:r})},l.r=function(e){"undefined"!==typeof Symbol&&Symbol.toStringTag&&Object.defineProperty(e,Symbol.toStringTag,{value:"Module"}),Object.defineProperty(e,"__esModule",{value:!0})},l.t=function(e,n){if(1&n&&(e=l(e)),8&n)return e;if(4&n&&"object"===typeof e&&e&&e.__esModule)return e;var r=Object.create(null);if(l.r(r),Object.defineProperty(r,"default",{enumerable:!0,value:e}),2&n&&"string"!=typeof e)for(var t in e)l.d(r,t,function(n){return e[n]}.bind(null,t));return r},l.n=function(e){var n=e&&e.__esModule?function(){return e["default"]}:function(){return e};return l.d(n,"a",n),n},l.o=function(e,n){return Object.prototype.hasOwnProperty.call(e,n)},l.p="";var a=window["webpackJsonp"]=window["webpackJsonp"]||[],i=a.push.bind(a);a.push=n,a=a.slice();for(var c=0;c<a.length;c++)n(a[c]);var f=i;u.push([0,"chunk-vendors","chunk-common"]),r()})({0:function(e,n,r){e.exports=r("7f63")},"7f63":function(e,n,r){"use strict";r.r(n);var t=r("2b0e"),o=(r("10c1"),r("2229"),r("6c89"),r("fd4c")),u=r("299b");window._babelPolyfill||r("db4d"),t["a"].mixin(o["a"]);let l=document.getElementById("VideoRealPlay");l?new t["a"]({render:e=>e(u["a"])}).$mount("#VideoRealPlay"):window.VideoRealPlayMount=e=>{return new t["a"]({render:e=>e(u["a"])}).$mount(e)}}});
|
||||
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
Binary file not shown.
Binary file not shown.
|
Before Width: | Height: | Size: 117 KiB After Width: | Height: | Size: 11 KiB |
|
|
@ -22,25 +22,13 @@
|
|||
<el-empty description="暂无数据"></el-empty>
|
||||
</div>
|
||||
</div>
|
||||
<div class="center-1">
|
||||
<img :src="dz_dev_warn_img" />
|
||||
</div>
|
||||
<div class="center-2 layout">
|
||||
<div class="dz-video-box layout">
|
||||
<div class="layout">前面</div>
|
||||
<video class="ball-content" autoplay="autoplay" loop="loop" muted controls="controls"></video>
|
||||
<div class="center">
|
||||
<div class="center-1">
|
||||
<img :src="dz_dev_warn_img" />
|
||||
</div>
|
||||
<div class="dz-video-box layout">
|
||||
<div class="layout">后面</div>
|
||||
<video class="ball-content" autoplay="autoplay" loop="loop" muted controls="controls"></video>
|
||||
</div>
|
||||
<div class="dz-video-box layout">
|
||||
<div class="layout">左面</div>
|
||||
<video class="ball-content" autoplay="autoplay" loop="loop" muted controls="controls"></video>
|
||||
</div>
|
||||
<div class="dz-video-box layout">
|
||||
<div class="layout">右面</div>
|
||||
<video class="ball-content" autoplay="autoplay" loop="loop" muted controls="controls"></video>
|
||||
<div class="center-2 layout">
|
||||
<!-- 吊装视频播放 -->
|
||||
<iframe :src="htmlContent" ref="iframe" scrolling="no"></iframe>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
|
|
@ -78,9 +66,9 @@
|
|||
@close="closeConfigItem">
|
||||
<el-form ref="form" :model="form" :rules="rules">
|
||||
<div class="form-box">
|
||||
<div v-for="(data, index) in form.configItems" :key="data.key">
|
||||
<div v-for="(data, index) in form.configItems" :key="index">
|
||||
<h3>配置{{ index + 1 }}</h3>
|
||||
<el-form-item label="线路属性" :key="data.key">
|
||||
<el-form-item label="线路属性">
|
||||
<el-radio-group v-model="data.configType">
|
||||
<el-radio v-for="item in configTypeArr" :label="item.id" :key="item.id"
|
||||
@change="chooseConfigType(index, data.configType)">{{ item.name }}</el-radio>
|
||||
|
|
@ -123,7 +111,6 @@
|
|||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { getDzWarnList, getJdList, getLineStats, getVoltageLevelByLineStats, configJdDevice, getConfigJdDevice, getJdWarnList } from "@/api/construction/manage/hoistManage.js";
|
||||
import dz_dev_img from "@/assets/images/dz_dev.png";
|
||||
|
|
@ -168,6 +155,7 @@ export default {
|
|||
},
|
||||
// 表单校验
|
||||
rules: {},
|
||||
htmlContent: '/static/dz_video.html'
|
||||
};
|
||||
},
|
||||
created() {
|
||||
|
|
@ -175,6 +163,10 @@ export default {
|
|||
this.loadJdList();
|
||||
this.loadJdWarnList();
|
||||
},
|
||||
mounted(){
|
||||
this.$refs.iframe.reload();
|
||||
// document.getElementById("iframe").contentWindow.location.reload();
|
||||
},
|
||||
methods: {
|
||||
/* 加载吊装预警设备列表 */
|
||||
laodDzWarnList() {
|
||||
|
|
@ -460,20 +452,44 @@ export default {
|
|||
font-size: 14px;
|
||||
}
|
||||
|
||||
.hoistManage .center-1 {
|
||||
width: 31%;
|
||||
.hoistManage .center {
|
||||
width: 56%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.hoistManage .center-1 {
|
||||
width: 100%;
|
||||
height: 40%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-position: center center !important;
|
||||
}
|
||||
|
||||
.hoistManage .center-1 img {
|
||||
background-position: center center !important;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
|
||||
.hoistManage .center-2 {
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
height: 60%;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
.hoistManage .center-2 iframe {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border: none;
|
||||
}
|
||||
|
||||
#VideoRealPlayBox {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.dz-video-box {
|
||||
width: 100%;
|
||||
height: 24%;
|
||||
|
|
|
|||
Loading…
Reference in New Issue