<!DOCTYPE html>
|
<html lang="zh-cn" xmlns:th=http://www.thymeleaf.org>
|
<head>
|
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="renderer" content="webkit">
|
<title>视频播放-流媒体</title>
|
<link rel="stylesheet" th:href="@{../../static/plugins/layui/css/layui.css}" media="all">
|
<link rel="stylesheet" th:href="@{../../static/admin/afgl/video.css}">
|
|
<style>
|
.layui-fluid {
|
position: relative;
|
margin: 0 auto;
|
padding: unset;
|
}
|
.layui-col-space20 {
|
margin: unset;
|
}
|
.layui-col-space20>* {
|
padding: 10px 5px;
|
}
|
/** 隐藏列表下拉滚动条 **/
|
.scroll::-webkit-scrollbar {
|
display: none;
|
}
|
embed{
|
width:100%;
|
height:100%;
|
}
|
.layui-form-label {
|
padding: 9px 10px;
|
color: #FFFFFF;
|
font-size: 16px;
|
margin-left: 20px;
|
}
|
.layui-input {
|
display: unset;
|
width: 160px;
|
background: #3f474e;
|
border-style: solid;
|
border-width: 0;
|
color: #ffffff;
|
}
|
.layui-btn {
|
padding: 0 15px;
|
font-size: 16px;
|
margin-left: 10px;
|
margin-top: -3px;
|
}
|
</style>
|
</head>
|
|
<body class="pdgxq-body">
|
<div class="i-container">
|
<div class="jmkt-main">
|
<div class="layui-fluid">
|
<div class="sp-boxWrap layui-row layui-col-space20">
|
<div class="layui-col-lg9 layui-col-md9">
|
<div class="pdgxq-m1-left sp-box">
|
<div class="sp-tab-bd" style="padding: 10px;">
|
<div class="sp-showBox layui-row show">
|
<div class="layui-col-lg12 layui-col-md12">
|
<div class="sp-showItem2">
|
<!-- 使用多媒体播放 -->
|
<div id="newplay" onClick="onplay"></div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div>
|
</div><!--pdgxq-m1-left end-->
|
<div class="layui-col-lg3 layui-col-md3">
|
<div class="pdgxq-m1-right sp-box">
|
<div class="pdgxq-H">
|
<h3><i></i>云台控制</h3>
|
</div>
|
<div class="sp-cz-wrap">
|
<div class="sp-cz-box">
|
<ul>
|
<li class="sp-cz-l1">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(5);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l2">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(1);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l3">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(7);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l4">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(3);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l5">
|
<a href="javascript:void(0)">
|
<img th:src="${logo}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l6">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(4);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l7">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(6);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l8">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(2);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
<li class="sp-cz-l9">
|
<a href="javascript:void(0)" onmousedown="mouseDownPTZControl(8);" onmouseup="mouseUpPTZControl();">
|
<img th:src="@{../../static/images/sp-arrow.png}"/>
|
</a>
|
</li>
|
</ul>
|
</div>
|
<div class="sp-bianbei">
|
<button type="button" class="sp-sxBtn sp-czBtn" onmousedown="PTZZoomout()" onmouseup="PTZZoomStop()"><i>－</i></button>
|
<span>变倍</span>
|
<button type="button" class="sp-fdBtn sp-czBtn" onmousedown="PTZZoomIn()" onmouseup="PTZZoomStop()"><i>＋</i></button>
|
</div>
|
</div><!--sp-cz-wrap end-->
|
<div>
|
<label class="layui-form-label">预置点：</label>
|
<div class="layui-input-block">
|
<input type="text" id="preset" class="layui-input">
|
<button class="layui-btn layui-btn-normal" value="1" onclick="clickGoPreset();">确定</button>
|
</div>
|
</div>
|
<div class="pdgxq-H">
|
<h3><i></i>设备信息</h3>
|
</div>
|
<div class="sp-table-box">
|
<div class="sp-table">
|
<ul class="sp-list">
|
<li>
|
<a href="javascript:void(0)">
|
<p>设备名称：<span th:text="${cameraData.name}"></span></p>
|
</a>
|
</li>
|
<li>
|
<a href="javascript:void(0)">
|
<p>设备类型：<span th:text="${cameraData.type=='02'?'球机':'枪机'}"></span></p>
|
</a>
|
</li>
|
<li>
|
<a href="javascript:void(0)">
|
<p>设备品牌：<span th:text="${cameraData.brand}"></span></p>
|
</a>
|
</li>
|
</ul>
|
</div>
|
</div>
|
</div>
|
</div><!--pdgxq-m1-left end-->
|
</div><!--sp-boxWrap end-->
|
</div>
|
</div><!--jmkt-main end-->
|
</div> <!--i-container end-->
|
|
|
<script th:inline="javascript">
|
var cameraData = [[${cameraData}]];
|
</script>
|
|
<script th:src="@{../../static/plugins/video/EasyWasmPlayer.js}"></script>
|
<script th:src="@{../../static/plugins/layui/layui.js}"></script>
|
<script th:src="@{../../static/js/jquery.min.js}"></script>
|
<script th:src="@{../../static/admin/afgl/video-hikys.js}"></script>
|
</body>
|
</html>
|
