|
|
@@ -2,6 +2,7 @@
|
|
|
<html lang="zh" xmlns:th="http://www.thymeleaf.org">
|
|
|
<head>
|
|
|
<meta charset="utf-8">
|
|
|
+ <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
|
|
|
<title>智慧养殖可视化系统</title>
|
|
|
<link rel="shortcut icon" href="../static/sooka.ico" th:href="@{sooka.ico}"/>
|
|
|
<link th:href="@{/zhnc/syweb/css/zhncksh.css}" rel="stylesheet"/>
|
|
|
@@ -18,6 +19,14 @@
|
|
|
<script th:src="@{/zhnc/bigdata/js/echarts.min.js}"></script>
|
|
|
<script type="text/javascript"
|
|
|
src="http://api.map.baidu.com/api?v=3.0&ak=PlhFWpA02aoURjAOpnWcRGqw7AI8EEyO"></script>
|
|
|
+
|
|
|
+ <script th:src="@{/zhnc/hls.min.js}"></script>
|
|
|
+ <!--<script th:src="@{/zhnc/website/lib/polyfill.min.js}"></script>-->
|
|
|
+ <!--<!– import Vue.js –>-->
|
|
|
+ <!--<script th:src="@{/zhnc/website/lib/vue.js}"></script>-->
|
|
|
+ <!--<!– import iView –>-->
|
|
|
+ <!--<script th:src="@{/zhnc/website/lib/iview.js}" ></script>-->
|
|
|
+ <!--<script th:src="@{/zhnc/website/lib/DHWs.js}"></script>-->
|
|
|
</head>
|
|
|
<style>
|
|
|
/*地图标题*/
|
|
|
@@ -116,6 +125,30 @@
|
|
|
.txtk input.gb_btn:hover{
|
|
|
background: #980505;
|
|
|
}
|
|
|
+ .ptz .btn {
|
|
|
+ width: 30%;
|
|
|
+ height: 3em;
|
|
|
+ background: transparent;
|
|
|
+ border: solid 1px #00ffea;
|
|
|
+ color: #00ffea;
|
|
|
+ border-radius: 5px;
|
|
|
+ cursor: pointer;
|
|
|
+ margin-bottom: 3px;
|
|
|
+ }
|
|
|
+ .ptz .btn:hover {
|
|
|
+ background: #008f81;
|
|
|
+ color: #fff;
|
|
|
+ }
|
|
|
+ .tab_tit i{
|
|
|
+ color: #ffffff;
|
|
|
+ font-weight: normal;
|
|
|
+ margin-right: 20px;
|
|
|
+ cursor: pointer;
|
|
|
+ }
|
|
|
+ .tab_tit i.on{
|
|
|
+ color: #00ffea;
|
|
|
+ font-weight: 900;
|
|
|
+ }
|
|
|
</style>
|
|
|
<body>
|
|
|
|
|
|
@@ -131,7 +164,7 @@
|
|
|
</div>
|
|
|
<!-- 头部结束 -->
|
|
|
|
|
|
- <!-- 中间内容 开始 -->*
|
|
|
+ <!-- 中间内容 开始 -->
|
|
|
<div class="map" id="container"></div>
|
|
|
<!-- 左侧开始 -->
|
|
|
<div class="con_left">
|
|
|
@@ -490,8 +523,16 @@
|
|
|
<div class="tk_right fl">
|
|
|
<div class="ncxq_div" style="height: 610px;">
|
|
|
<!--<img th:src="@{/zhnc/syweb/images/zhnctk_46.png}" style="width:100%;height:100%"/>-->
|
|
|
- <iframe src="http://121.37.83.100:40005/dahua/cn/video-tk1.html" id="iframeVideo-tk1" style="width: 100%;height: 100%;overflow:hidden;"></iframe>
|
|
|
- <!--<iframe src="http://localhost:8082/dahua/cn/video-tk1.html" id="iframeVideo-tk1" style="width: 100%;height: 100%;overflow:hidden;"></iframe>-->
|
|
|
+ <!--<iframe src="http://121.37.83.100:40005/dahua/cn/video-tk1.html" id="iframeVideo-tk1" style="width: 100%;height: 100%;overflow:hidden;"></iframe>-->
|
|
|
+ <!--<iframe src="http://localhost:9090/dahua/cn/video-tk1.html" id="iframeVideo-tk1" style="width: 100%;height: 100%;overflow:hidden;"></iframe>-->
|
|
|
+ <!--<iframe src="http://localhost:9090/dahua/demo/index.html" style="width: 100%;height: 100%;overflow:hidden;"></iframe>-->
|
|
|
+ <!--<video id="openVideo" style="width: 500px;height: 500px;">-->
|
|
|
+ <!--<source src="http://222.161.138.120:7086/live/cameraid/1000029%240/substream/1.m3u8" type="application/x-mpegURL">-->
|
|
|
+ <!--</video>-->
|
|
|
+ <!--<video id="openVideo" class="video-js vjs-default-skin" x-webkit-airplay="allow" poster="" webkit-playsinline playsinline x5-video-player-type="h5" x5-video-player-fullscreen="true" preload="auto">-->
|
|
|
+ <!--<source src="http://222.161.138.120:7086/live/cameraid/1000029%240/substream/1.m3u8" type="application/x-mpegURL">-->
|
|
|
+ <!--</video>-->
|
|
|
+ <video id="openVideo" controls width="100%"></video>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
@@ -539,18 +580,34 @@
|
|
|
<div class="tk_right fl">
|
|
|
<div class="sp_div">
|
|
|
<!--<img th:src="@{/zhnc/syweb/images/zhnctk_03.png}" style="width:100%;height:100%"/>-->
|
|
|
- <iframe src="http://121.37.83.100:40005/dahua/cn/video.html" id="iframeVideo" style="width: 100%;height: 100%;overflow:hidden;"></iframe>
|
|
|
+ <!--<iframe src="" id="iframeVideo" style="width: 100%;height: 100%;overflow:hidden;"></iframe>-->
|
|
|
<!--<iframe src="http://localhost:8082/dahua/cn/video.html" id="iframeVideo" style="width: 100%;height: 100%;overflow:hidden;"></iframe>-->
|
|
|
+ <div id="alone">
|
|
|
+ <video id="openVideo-tk2" controls width="80%" style="float: left"></video>
|
|
|
+ <div style="float: left;width: 18%;margin-left: 12px;" class="ptz">
|
|
|
+ <button type="button" onclick="OperateDirect('5')" class="btn">左上</button>
|
|
|
+ <button type="button" onclick="OperateDirect('1')" class="btn">上</button>
|
|
|
+ <button type="button" onclick="OperateDirect('7')" class="btn">右上</button>
|
|
|
+ </div>
|
|
|
+ <div style="float: left;width: 18%;margin-left: 12px;" class="ptz">
|
|
|
+ <button type="button" onclick="OperateDirect('3')" class="btn">左</button>
|
|
|
+ <button class="btn">自动</button>
|
|
|
+ <button type="button" onclick="OperateDirect('4')" class="btn">右</button>
|
|
|
+ </div>
|
|
|
+ <div style="float: left;width: 18%;margin-left: 12px;" class="ptz">
|
|
|
+ <button type="button" onclick="OperateDirect('6')" class="btn">左下</button>
|
|
|
+ <button type="button" onclick="OperateDirect('2')" class="btn">下</button>
|
|
|
+ <button type="button" onclick="OperateDirect('8')" class="btn">右下</button>
|
|
|
+ </div>
|
|
|
+ </div>
|
|
|
+ <div id="group" style="display: none;">
|
|
|
+
|
|
|
+ </div>
|
|
|
</div>
|
|
|
+
|
|
|
<div class="sp_list">
|
|
|
- <h5 class="sp_tit">摄像头列表</h5>
|
|
|
- <ul class="sp_ul" id="tantou">
|
|
|
- <li>
|
|
|
- <a><i></i>牛舍监控探头1</a>
|
|
|
- </li>
|
|
|
- <li th:each="tt : ${list}">
|
|
|
- <a th:onclick="goPlugIn([[${tt.ip}]],[[${tt.port}]],[[${tt.account}]],[[${tt.password}]])"><i></i>端口[[${tt.port}]]的探头</a>
|
|
|
- </li>
|
|
|
+ <h5 class="sp_tit tab_tit"><i class="qiehuan on">摄像头列表</i><i class="qiehuan">组织</i></h5>
|
|
|
+ <ul class="sp_ul tab_ul" id="tantou">
|
|
|
</ul>
|
|
|
</div>
|
|
|
<div class="clear"></div>
|
|
|
@@ -619,7 +676,7 @@
|
|
|
<!-- 底部 横条按钮 开始 -->
|
|
|
<div class="tk_hbtn">
|
|
|
<input type="button" value="确定" class="btn_qd fr" onclick="hideMessage();"/>
|
|
|
- <input type="button" value="返回" class="btn_qx fr" onclick="$('#tk_div1').show();hideMessage();sendMessagetk1()"/>
|
|
|
+ <input type="button" value="返回" class="btn_qx fr" onclick="$('#tk_div1').show();hideMessage();"/>
|
|
|
</div>
|
|
|
<!-- 底部 横条按钮 结束 -->
|
|
|
|
|
|
@@ -790,7 +847,7 @@
|
|
|
<!-- 底部 横条按钮 开始 -->
|
|
|
<div class="tk_hbtn">
|
|
|
<input type="button" value="确定" class="btn_qd fr" onclick="$('#tk_div3').hide()"/>
|
|
|
- <input type="button" value="返回" class="btn_qx fr" onclick="sendMessage();$('#tk_div3').hide();"/>
|
|
|
+ <input type="button" value="返回" class="btn_qx fr" onclick="showTkDiv2();$('#tk_div3').hide();"/>
|
|
|
</div>
|
|
|
<!-- 底部 横条按钮 结束 -->
|
|
|
|
|
|
@@ -807,10 +864,12 @@
|
|
|
<input type="button" value="关闭" class="gb_btn"/>
|
|
|
</div>
|
|
|
</body>
|
|
|
-
|
|
|
<script type="text/javascript">
|
|
|
- var niushe = ['固定牛舍1','固定牛舍2','固定牛舍3','活动牛舍1','活动牛舍2','活动牛舍3','活动牛舍4','活动牛舍5','隔离牛舍1','隔离牛舍2','','','','',''];
|
|
|
- var ports = ["8011","8012","8013","8014","8015","8016","8017","8018","8019","8020","8021","8022","8023","8024","8025","8026","8027","8028","8029","8030","8111","8112","8113","8114","8115","8116","8117","8118"];
|
|
|
+ var niushe = ['固定牛舍1', '固定牛舍2', '固定牛舍3', '活动牛舍1', '活动牛舍2', '活动牛舍3', '活动牛舍4', '活动牛舍5', '隔离牛舍1', '隔离牛舍2', '', '', '', '', ''];
|
|
|
+ var ports = ["1000034", "1000035", "1000036", "1000037", "1000038", "1000039", "1000040", "1000041", "1000042", "1000043", "1000044", "1000045", "1000046", "1000047", "1000048", "1000049", "1000050", "1000051", "1000052", "1000053", "1000020", "1000021", "1000022", "1000023", "1000024", "1000025", "1000026", "1000027"];
|
|
|
+ var sxtUrl = "http://121.37.83.100:40005/";
|
|
|
+ var connalId = "";
|
|
|
+ var aloneOrGroup = "";
|
|
|
// webSocket
|
|
|
|
|
|
// var websocket = null;
|
|
|
@@ -850,95 +909,95 @@
|
|
|
|
|
|
// webSocketend
|
|
|
|
|
|
- var oneIndex=0;
|
|
|
- var errorIndex=0;
|
|
|
- var errorTwoIndex=0;
|
|
|
+ var oneIndex = 0;
|
|
|
+ var errorIndex = 0;
|
|
|
+ var errorTwoIndex = 0;
|
|
|
|
|
|
var map = new BMap.Map("container");
|
|
|
- map.centerAndZoom(new BMap.Point(129.77637582701928, 43.00009148769267),12);
|
|
|
+ map.centerAndZoom(new BMap.Point(129.77637582701928, 43.00009148769267), 12);
|
|
|
map.enableScrollWheelZoom();
|
|
|
- var mapStyle ={
|
|
|
- style : 'midnight',
|
|
|
- };
|
|
|
- map.setMapStyle(mapStyle);
|
|
|
+ var mapStyle = {
|
|
|
+ style: 'midnight',
|
|
|
+ };
|
|
|
+ map.setMapStyle(mapStyle);
|
|
|
|
|
|
- var longitude = [129.5464786,129.83889789051372,129.82078805143257,129.80842736761528,129.81690737162947,130.02215221454924,129.99714338915146,129.99728711803306];//经度
|
|
|
- var latitude = [42.9837084,42.899784486382835,43.10065511842016,43.0820096348773,43.07726834614238,43.00051348484174,43.02603888101937,42.99449974985549];//纬度
|
|
|
- var niucount = [3000,2800,2960,2940,2800,2920,2920,2950];//牛只数量
|
|
|
- var fzr = ['张凯','张国刚','钱峰','孙长江','赵明','冯启年','徐腾飞','牛东'];//负责人
|
|
|
- var nvname = ['清茶牧业牛场','原生态黄牛养殖场','全牛园养殖场','长青绿牧场','平安牧场','犇犇牛业养殖场','腾飞牧业','绿色养殖场'];//牛场名称
|
|
|
+ var longitude = [129.5464786, 129.83889789051372, 129.82078805143257, 129.80842736761528, 129.81690737162947, 130.02215221454924, 129.99714338915146, 129.99728711803306];//经度
|
|
|
+ var latitude = [42.9837084, 42.899784486382835, 43.10065511842016, 43.0820096348773, 43.07726834614238, 43.00051348484174, 43.02603888101937, 42.99449974985549];//纬度
|
|
|
+ var niucount = [3000, 2800, 2960, 2940, 2800, 2920, 2920, 2950];//牛只数量
|
|
|
+ var fzr = ['张凯', '张国刚', '钱峰', '孙长江', '赵明', '冯启年', '徐腾飞', '牛东'];//负责人
|
|
|
+ var nvname = ['清茶牧业牛场', '原生态黄牛养殖场', '全牛园养殖场', '长青绿牧场', '平安牧场', '犇犇牛业养殖场', '腾飞牧业', '绿色养殖场'];//牛场名称
|
|
|
|
|
|
- var icon0 = ctx+"zhnc/syweb/images/zhncksh_36.png";
|
|
|
- var icon1 = ctx+"zhnc/syweb/images/zhncksh_36-1.png";
|
|
|
- var icon2 = ctx+"zhnc/syweb/images/zhncksh_36-2.png";
|
|
|
- var icon3 = ctx+"zhnc/syweb/images/zhncksh_36-3.png";
|
|
|
- var icon4 = ctx+"zhnc/syweb/images/zhncksh_36-4.png";
|
|
|
- var error = ctx+"zhnc/syweb/images/zhncksh_68.png";
|
|
|
- var yanshi = ctx+"zhnc/syweb/images/zhnctk_45.png";
|
|
|
+ var icon0 = ctx + "zhnc/syweb/images/zhncksh_36.png";
|
|
|
+ var icon1 = ctx + "zhnc/syweb/images/zhncksh_36-1.png";
|
|
|
+ var icon2 = ctx + "zhnc/syweb/images/zhncksh_36-2.png";
|
|
|
+ var icon3 = ctx + "zhnc/syweb/images/zhncksh_36-3.png";
|
|
|
+ var icon4 = ctx + "zhnc/syweb/images/zhncksh_36-4.png";
|
|
|
+ var error = ctx + "zhnc/syweb/images/zhncksh_68.png";
|
|
|
+ var yanshi = ctx + "zhnc/syweb/images/zhnctk_45.png";
|
|
|
|
|
|
for (var i = 0; i < longitude.length; i++) {
|
|
|
var icon;
|
|
|
- if(0<= niucount[i] && niucount[i]<3000) {
|
|
|
+ if (0 <= niucount[i] && niucount[i] < 3000) {
|
|
|
icon = new BMap.Icon(icon0, new BMap.Size(31, 39));
|
|
|
- } else if (3000<= niucount[i] && niucount[i]<4000){
|
|
|
+ } else if (3000 <= niucount[i] && niucount[i] < 4000) {
|
|
|
icon = new BMap.Icon(icon1, new BMap.Size(31, 39));
|
|
|
- } else if (4000<= niucount[i] && niucount[i]<5000){
|
|
|
+ } else if (4000 <= niucount[i] && niucount[i] < 5000) {
|
|
|
icon = new BMap.Icon(icon2, new BMap.Size(31, 39));
|
|
|
- } else if (5000<= niucount[i] && niucount[i]<6000){
|
|
|
+ } else if (5000 <= niucount[i] && niucount[i] < 6000) {
|
|
|
icon = new BMap.Icon(icon3, new BMap.Size(31, 39));
|
|
|
- } else if (6000<= niucount[i] && niucount[i]<7000){
|
|
|
+ } else if (6000 <= niucount[i] && niucount[i] < 7000) {
|
|
|
icon = new BMap.Icon(icon4, new BMap.Size(31, 39));
|
|
|
}
|
|
|
|
|
|
- if(i == 2){
|
|
|
+ if (i == 2) {
|
|
|
icon = new BMap.Icon(error, new BMap.Size(31, 39));
|
|
|
}
|
|
|
- if(nvname[i] == '清茶牧业牛场'){
|
|
|
+ if (nvname[i] == '清茶牧业牛场') {
|
|
|
icon = new BMap.Icon(yanshi, new BMap.Size(31, 26));
|
|
|
}
|
|
|
var P = new BMap.Point(longitude[i], latitude[i])
|
|
|
- var MP = new BMap.Marker(P,{icon: icon});
|
|
|
+ var MP = new BMap.Marker(P, {icon: icon});
|
|
|
map.addOverlay(MP);
|
|
|
var sContent =
|
|
|
- "<p>牛场名称："+nvname[i]+"</p><br>" +
|
|
|
- "<p>牛场规模："+niucount[i]+"头</p><br>" +
|
|
|
- "<p>负责人："+fzr[i]+"</p><br>" +
|
|
|
+ "<p>牛场名称：" + nvname[i] + "</p><br>" +
|
|
|
+ "<p>牛场规模：" + niucount[i] + "头</p><br>" +
|
|
|
+ "<p>负责人：" + fzr[i] + "</p><br>" +
|
|
|
"<p>牛只种类：黄牛、牦牛、奶牛</p><br>";
|
|
|
- if(i == 2){
|
|
|
- sContent+="<p style='color: red'>报警信息：牛场报警！！！</p><br>";
|
|
|
- }
|
|
|
- addClickHandler(sContent, MP,i);
|
|
|
+ if (i == 2) {
|
|
|
+ sContent += "<p style='color: red'>报警信息：牛场报警！！！</p><br>";
|
|
|
+ }
|
|
|
+ addClickHandler(sContent, MP, i);
|
|
|
}
|
|
|
|
|
|
- function addClickHandler(content, marker,index) {
|
|
|
+ function addClickHandler(content, marker, index) {
|
|
|
// 创建信息窗口属性
|
|
|
var opts = {
|
|
|
- width : 100, // 信息窗口宽度
|
|
|
+ width: 100, // 信息窗口宽度
|
|
|
title: '<h4>牛舍信息</h4>'
|
|
|
}
|
|
|
- var infoWindow = new BMap.InfoWindow(content,opts);
|
|
|
+ var infoWindow = new BMap.InfoWindow(content, opts);
|
|
|
marker.addEventListener('click', function () {
|
|
|
var tk_dl_one_html = "<dt>\n" +
|
|
|
"<span>编号</span>\n" +
|
|
|
"<span>牛舍名称</span>\n" +
|
|
|
- "<span>牛只数量</span>\n"+
|
|
|
- "<span>状态</span>"+
|
|
|
+ "<span>牛只数量</span>\n" +
|
|
|
+ "<span>状态</span>" +
|
|
|
"</dt>";
|
|
|
for (var i = 1; i <= 15; i++) {
|
|
|
- if(index == 2 && i==1){
|
|
|
- tk_dl_one_html+="<dd style='color: red'><a onclick=\"showTkDiv2("+index+","+i+")\">\n" +
|
|
|
- " <span>0"+i+"</span>\n" +
|
|
|
- " <span>"+niushe[i-1]+"</span>\n" +
|
|
|
- " <span>"+(Math.ceil(Math.random()*50)+150)+"</span>\n";
|
|
|
- tk_dl_one_html+="<span >异常</span>";
|
|
|
- }else{
|
|
|
- tk_dl_one_html+="<dd ><a onclick=\"showTkDiv2("+index+","+i+")\">\n" +
|
|
|
- " <span>0"+i+"</span>\n" +
|
|
|
- " <span>"+niushe[i-1]+"</span>\n" +
|
|
|
- " <span>"+(Math.ceil(Math.random()*50)+150)+"</span>\n";
|
|
|
- tk_dl_one_html+="<span style='color: green'>正常</span>";
|
|
|
+ if (index == 2 && i == 1) {
|
|
|
+ tk_dl_one_html += "<dd style='color: red'><a onclick=\"showTkDiv2(" + index + "," + i + ")\">\n" +
|
|
|
+ " <span>0" + i + "</span>\n" +
|
|
|
+ " <span>" + niushe[i - 1] + "</span>\n" +
|
|
|
+ " <span>" + (Math.ceil(Math.random() * 50) + 150) + "</span>\n";
|
|
|
+ tk_dl_one_html += "<span >异常</span>";
|
|
|
+ } else {
|
|
|
+ tk_dl_one_html += "<dd ><a onclick=\"showTkDiv2(" + index + "," + i + ")\">\n" +
|
|
|
+ " <span>0" + i + "</span>\n" +
|
|
|
+ " <span>" + niushe[i - 1] + "</span>\n" +
|
|
|
+ " <span>" + (Math.ceil(Math.random() * 50) + 150) + "</span>\n";
|
|
|
+ tk_dl_one_html += "<span style='color: green'>正常</span>";
|
|
|
}
|
|
|
- tk_dl_one_html+=" </a>\n" +
|
|
|
+ tk_dl_one_html += " </a>\n" +
|
|
|
" </dd>";
|
|
|
}
|
|
|
$("#tk_dl_one").html(tk_dl_one_html);
|
|
|
@@ -960,103 +1019,144 @@
|
|
|
* @param index
|
|
|
* @private
|
|
|
*/
|
|
|
- function con_(index){
|
|
|
+ function con_(index) {
|
|
|
var tk_dl_one_html = "<dt>\n" +
|
|
|
"<span>编号</span>\n" +
|
|
|
"<span>牛舍名称</span>\n" +
|
|
|
- "<span>牛只数量</span>\n"+
|
|
|
- "<span>状态</span>"+
|
|
|
+ "<span>牛只数量</span>\n" +
|
|
|
+ "<span>状态</span>" +
|
|
|
"</dt>";
|
|
|
for (var i = 1; i <= 15; i++) {
|
|
|
- if(index == 2 && i==1){
|
|
|
- tk_dl_one_html+="<dd style='color: red'><a onclick=\"showTkDiv2("+index+","+i+")\">\n" +
|
|
|
- " <span>0"+i+"</span>\n" +
|
|
|
- " <span>"+niushe[i-1]+"</span>\n" +
|
|
|
- " <span>"+(Math.ceil(Math.random()*50)+150)+"</span>\n";
|
|
|
- tk_dl_one_html+="<span >异常</span>";
|
|
|
- }else{
|
|
|
- tk_dl_one_html+="<dd ><a onclick=\"showTkDiv2("+index+","+i+")\">\n" +
|
|
|
- " <span>0"+i+"</span>\n" +
|
|
|
- " <span>"+niushe[i-1]+"</span>\n" +
|
|
|
- " <span>"+(Math.ceil(Math.random()*50)+150)+"</span>\n";
|
|
|
- tk_dl_one_html+="<span style='color: green'>正常</span>";
|
|
|
+ if (index == 2 && i == 1) {
|
|
|
+ tk_dl_one_html += "<dd style='color: red'><a onclick=\"showTkDiv2(" + index + "," + i + ")\">\n" +
|
|
|
+ " <span>0" + i + "</span>\n" +
|
|
|
+ " <span>" + niushe[i - 1] + "</span>\n" +
|
|
|
+ " <span>" + (Math.ceil(Math.random() * 50) + 150) + "</span>\n";
|
|
|
+ tk_dl_one_html += "<span >异常</span>";
|
|
|
+ } else {
|
|
|
+ tk_dl_one_html += "<dd ><a onclick=\"showTkDiv2(" + index + "," + i + ")\">\n" +
|
|
|
+ " <span>0" + i + "</span>\n" +
|
|
|
+ " <span>" + niushe[i - 1] + "</span>\n" +
|
|
|
+ " <span>" + (Math.ceil(Math.random() * 50) + 150) + "</span>\n";
|
|
|
+ tk_dl_one_html += "<span style='color: green'>正常</span>";
|
|
|
}
|
|
|
- tk_dl_one_html+=" </a>\n" +
|
|
|
+ tk_dl_one_html += " </a>\n" +
|
|
|
" </dd>";
|
|
|
}
|
|
|
$("#tk_dl_one").html(tk_dl_one_html);
|
|
|
$("#tk_div1").show();
|
|
|
sendMessagetk1();
|
|
|
}
|
|
|
- var iframetk1 = document.getElementById("iframeVideo-tk1");
|
|
|
+
|
|
|
function sendMessagetk1() {
|
|
|
- var FormObj = iframetk1.contentWindow;
|
|
|
- FormObj.postMessage({ // 传过去的值
|
|
|
- left: 585,
|
|
|
- top: 170,
|
|
|
- key: true,
|
|
|
- ip: "111.26.169.125",
|
|
|
- port: "8015",
|
|
|
- account: "admin",
|
|
|
- password: "admin123"
|
|
|
- },'*');
|
|
|
+ var url = ctx+'/ksh/findVideo';
|
|
|
+ $.ajax({
|
|
|
+ dataType: 'json',
|
|
|
+ url: url,
|
|
|
+ data:{
|
|
|
+ channelId:"1000029"
|
|
|
+ },
|
|
|
+ success: function (result) {
|
|
|
+ var video = document.getElementById("openVideo");
|
|
|
+ var hls = new Hls();
|
|
|
+ hls.loadSource(result.data[0]);
|
|
|
+ hls.attachMedia(video);
|
|
|
+ hls.on(Hls.Events.MANIFEST_PARSED,function() {
|
|
|
+ video.play();
|
|
|
+ });
|
|
|
+ },
|
|
|
+ error: function (jqXHR, status, errorThrown) {
|
|
|
+ console.log(status, errorThrown);
|
|
|
+ },
|
|
|
+ complete: function(XMLHttpRequest, textStatus) {
|
|
|
+ console.log(textStatus);
|
|
|
+ }
|
|
|
+ });
|
|
|
}
|
|
|
- var iframe = document.getElementById("iframeVideo");
|
|
|
|
|
|
- function sendMessage(){
|
|
|
- var FormObj = iframe.contentWindow;
|
|
|
- FormObj.postMessage({ // 传过去的值
|
|
|
- left: 600,
|
|
|
- top: 175,
|
|
|
- key: true,
|
|
|
- ip: "111.26.169.125",
|
|
|
- port: "8015",
|
|
|
- account: "admin",
|
|
|
- password: "admin123"
|
|
|
- },'*');
|
|
|
+ function sendMessage() {
|
|
|
$('#tk_div2').show();
|
|
|
}
|
|
|
- function goPlugIn(jIp,jPort,jUsername,jPassword) {
|
|
|
- var jDeviceport = 8000;
|
|
|
- // var url = 'http://localhost:8899/camera_id='+jIp+","+jPort+","+jUsername+","+jPassword+","+jDeviceport;
|
|
|
- // window.location.href="http://"+jIp+":"+jPort+"/doc/page/preview.asp";
|
|
|
- // $.ajax({
|
|
|
- // dataType: 'json',
|
|
|
- // url: url,
|
|
|
- // headers: {
|
|
|
- // 'Access-Control-Allow-Origin': "*"
|
|
|
- // },
|
|
|
- // success: function (result) {
|
|
|
- // console.log(result);
|
|
|
- // },
|
|
|
- // error: function (jqXHR, status, errorThrown) {
|
|
|
- // console.log(status, errorThrown);
|
|
|
- // },
|
|
|
- // complete: function(XMLHttpRequest, textStatus) {
|
|
|
- // console.log(textStatus);
|
|
|
- // }
|
|
|
- // });
|
|
|
- var url = 'http://117.78.49.164:17000/camera2/cn/demo.html?camera_id='+jIp+","+jPort+","+jUsername+","+jPassword+","+jDeviceport;
|
|
|
- window.location.href="openIE:"+url;
|
|
|
|
|
|
+ function goPlugIn(sbbh) {
|
|
|
+ var url = ctx+'/ksh/findVideo';
|
|
|
+ connalId=sbbh;
|
|
|
+ $.ajax({
|
|
|
+ dataType: 'json',
|
|
|
+ url: url,
|
|
|
+ data:{
|
|
|
+ channelId:sbbh
|
|
|
+ },
|
|
|
+ success: function (result) {
|
|
|
+ if(aloneOrGroup == 'group'){
|
|
|
+ var html = "";
|
|
|
+ for(var i=0;i<result.data.length;i++){
|
|
|
+ html+="<video id=\"openVideo-tk2-"+i+"\" controls width=\"50%\" style=\"float: left;height: 200px;\"></video>";
|
|
|
+ }
|
|
|
+ $("#group").html(html);
|
|
|
+ for(var i=0;i<result.data.length;i++){
|
|
|
+ var video = document.getElementById("openVideo-tk2-"+i);
|
|
|
+ var hls = new Hls();
|
|
|
+ hls.loadSource(result.data[i]);
|
|
|
+ hls.attachMedia(video);
|
|
|
+ }
|
|
|
+ for(var i=0;i<result.data.length;i++){
|
|
|
+ var video = document.getElementById("openVideo-tk2-"+i);
|
|
|
+ video.play();
|
|
|
+ }
|
|
|
+ $("#group").show();
|
|
|
+ $("#alone").hide();
|
|
|
+ }else{
|
|
|
+ var video = document.getElementById("openVideo-tk2");
|
|
|
+ var hls = new Hls();
|
|
|
+ hls.loadSource(result.data[0]);
|
|
|
+ hls.attachMedia(video);
|
|
|
+ hls.on(Hls.Events.MANIFEST_PARSED,function() {
|
|
|
+ video.play();
|
|
|
+ });
|
|
|
+ $("#alone").show();
|
|
|
+ $("#group").hide();
|
|
|
+ }
|
|
|
+ },
|
|
|
+ error: function (jqXHR, status, errorThrown) {
|
|
|
+ console.log(status, errorThrown);
|
|
|
+ },
|
|
|
+ complete: function(XMLHttpRequest, textStatus) {
|
|
|
+ console.log(textStatus);
|
|
|
+ }
|
|
|
+ });
|
|
|
}
|
|
|
|
|
|
|
|
|
- function hideMessage(){
|
|
|
- $("#iframeVideo").attr('src','http://121.37.83.100:40005/dahua/cn/video.html');
|
|
|
- // $("#iframeVideo").attr('src','http://localhost:8082/dahua/cn/video.html');
|
|
|
+ //摄像头移动方法
|
|
|
+ function OperateDirect(direct){
|
|
|
+ var url = ctx+'/ksh/operateDirect';
|
|
|
+ $.ajax({
|
|
|
+ dataType: 'json',
|
|
|
+ url: url,
|
|
|
+ data:{
|
|
|
+ channelId:connalId,
|
|
|
+ direct:direct
|
|
|
+ },
|
|
|
+ success: function (result) {
|
|
|
+ }
|
|
|
+ });
|
|
|
+ }
|
|
|
+
|
|
|
+
|
|
|
+ function hideMessage() {
|
|
|
$('#tk_div2').hide();
|
|
|
}
|
|
|
- function hideMessagetk1(){
|
|
|
- $("#iframeVideo-tk1").attr('src','http://121.37.83.100:40005/dahua/cn/video-tk1.html');
|
|
|
- // $("#iframeVideo-tk1").attr('src','http://localhost:8082/dahua/cn/video-tk1.html');
|
|
|
+
|
|
|
+ function hideMessagetk1() {
|
|
|
$('#tk_div1').hide();
|
|
|
}
|
|
|
- function showTkDiv2(index,er){
|
|
|
+
|
|
|
+ function showTkDiv2(index, er) {
|
|
|
hideMessagetk1();
|
|
|
sendMessage();
|
|
|
- errorIndex=index;
|
|
|
- errorTwoIndex=er;
|
|
|
+ errorIndex = index!=null?index:errorIndex;
|
|
|
+ errorTwoIndex = er!=null?er:errorTwoIndex;
|
|
|
var tk_dl_two_html = "<dt>\n" +
|
|
|
" <span>编号</span>\n" +
|
|
|
" <span>品种</span>\n" +
|
|
|
@@ -1066,11 +1166,11 @@
|
|
|
" <span>状态</span>\n" +
|
|
|
" </dt>";
|
|
|
for (var i = 1; i <= 16; i++) {
|
|
|
- if (index == 2 && i == 1 && er==1) {
|
|
|
+ if (index == 2 && i == 1 && er == 1) {
|
|
|
tk_dl_two_html += "<dd style='color: red'><a onclick=\"showTkDiv3('1')\">\n" +
|
|
|
" <span>0" + i + "</span>\n" +
|
|
|
" <span>黄牛</span>\n" +
|
|
|
- " <span>"+(Math.ceil(Math.random()*50)+200)+"</span>\n" +
|
|
|
+ " <span>" + (Math.ceil(Math.random() * 50) + 200) + "</span>\n" +
|
|
|
" <span class='wdbh_error'>42.5</span>\n" +
|
|
|
" <span>入驻</span>\n";
|
|
|
tk_dl_two_html += "<span >异常</span>";
|
|
|
@@ -1079,8 +1179,8 @@
|
|
|
tk_dl_two_html += "<dd><a onclick=\"showTkDiv3('0')\">\n" +
|
|
|
" <span>0" + i + "</span>\n" +
|
|
|
" <span>黄牛</span>\n" +
|
|
|
- " <span>"+(Math.ceil(Math.random()*50)+200)+"</span>\n" +
|
|
|
- " <span class='wdbh_"+i+"'>"+(Math.ceil(Math.random()*1)+38)+"."+(Math.ceil(Math.random()*9))+"</span>\n" +
|
|
|
+ " <span>" + (Math.ceil(Math.random() * 50) + 200) + "</span>\n" +
|
|
|
+ " <span class='wdbh_" + i + "'>" + (Math.ceil(Math.random() * 1) + 38) + "." + (Math.ceil(Math.random() * 9)) + "</span>\n" +
|
|
|
" <span>入驻</span>\n";
|
|
|
tk_dl_two_html += "<span style='color: green'>正常</span>";
|
|
|
tk_dl_two_html += "</a></dd>";
|
|
|
@@ -1088,32 +1188,35 @@
|
|
|
}
|
|
|
|
|
|
$("#tk_dl_two").html(tk_dl_two_html);
|
|
|
- var html = "<li>\n" +
|
|
|
- " <a><i></i>牛舍监控探头1</a>\n" +
|
|
|
- " </li>";
|
|
|
- if(er == 1){
|
|
|
- for(var i = 0; i < 20; i++){
|
|
|
- html+="<li>\n" +
|
|
|
- "<a onclick=\"goPlugIn('222.161.138.120',ports[i],'admin','qingchamuye123')\"><i></i>端口"+ports[i]+"的探头</a>\n" +
|
|
|
+ var html = "";
|
|
|
+ if (errorTwoIndex == 1) {
|
|
|
+ for (var i = 0; i < 20; i++) {
|
|
|
+ html += "<li>\n" +
|
|
|
+ "<a onclick=\"goPlugIn('"+ports[i]+"')\"><i></i>端口" + ports[i] + "的探头</a>\n" +
|
|
|
"</li>";
|
|
|
}
|
|
|
- }else if(er == 4){
|
|
|
- for(var i = 20; i < 28; i++){
|
|
|
- html+="<li>\n" +
|
|
|
- "<a onclick=\"goPlugIn('222.161.138.120',ports[i],'admin','qingchamuye123')\"><i></i>端口"+ports[i]+"的探头</a>\n" +
|
|
|
+ goPlugIn(ports[0])
|
|
|
+ } else if (errorTwoIndex == 4) {
|
|
|
+ for (var i = 20; i < 28; i++) {
|
|
|
+ html += "<li>\n" +
|
|
|
+ "<a onclick=\"goPlugIn('" + ports[i] + "')\"><i></i>端口" + ports[i] + "的探头</a>\n" +
|
|
|
"</li>";
|
|
|
}
|
|
|
+ goPlugIn(ports[20])
|
|
|
+ } else {
|
|
|
+ $("#openVideo-tk2").attr("src","");
|
|
|
}
|
|
|
$("#tantou").html(html);
|
|
|
}
|
|
|
- function showTkDiv3(flag){
|
|
|
+
|
|
|
+ function showTkDiv3(flag) {
|
|
|
$('#tk_div3').show();
|
|
|
hideMessage();
|
|
|
- if(flag=='1'){
|
|
|
+ if (flag == '1') {
|
|
|
$(".tk_twyc").show();
|
|
|
$("#errortw").show();
|
|
|
$("#successtw").hide();
|
|
|
- }else{
|
|
|
+ } else {
|
|
|
$(".tk_twyc").hide();
|
|
|
$("#errortw").hide();
|
|
|
$("#successtw").show();
|
|
|
@@ -1122,70 +1225,122 @@
|
|
|
|
|
|
setInterval(function () {
|
|
|
for (var i = 1; i <= 16; i++) {
|
|
|
- $(".wdbh_"+i).html((Math.ceil(Math.random()*1)+38)+"."+(Math.ceil(Math.random()*9)));
|
|
|
+ $(".wdbh_" + i).html((Math.ceil(Math.random() * 1) + 38) + "." + (Math.ceil(Math.random() * 9)));
|
|
|
}
|
|
|
|
|
|
- $(".wdbh_error").html((Math.ceil(Math.random()*3)+41)+"."+(Math.ceil(Math.random()*9)));
|
|
|
- },2000);
|
|
|
+ $(".wdbh_error").html((Math.ceil(Math.random() * 3) + 41) + "." + (Math.ceil(Math.random() * 9)));
|
|
|
+ }, 2000);
|
|
|
|
|
|
setInterval(function () {
|
|
|
- $("#wd").html((Math.ceil(Math.random()*10)+15)+"."+(Math.ceil(Math.random()*9))+"°C");
|
|
|
- $("#sd").html((Math.ceil(Math.random()*10)+55)+"%");
|
|
|
- $("#eyht").html((Math.ceil(Math.random()*8)+45)+"."+(Math.ceil(Math.random()*9))+"mg/m³");
|
|
|
- $("#gz").html((Math.ceil(Math.random()*10)+75)+"."+(Math.ceil(Math.random()*9))+"lx");
|
|
|
- $("#lhq").html("0."+(Math.ceil(Math.random()*5)+10)+"mg/m³");
|
|
|
- },3000);
|
|
|
+ $("#wd").html((Math.ceil(Math.random() * 10) + 15) + "." + (Math.ceil(Math.random() * 9)) + "°C");
|
|
|
+ $("#sd").html((Math.ceil(Math.random() * 10) + 55) + "%");
|
|
|
+ $("#eyht").html((Math.ceil(Math.random() * 8) + 45) + "." + (Math.ceil(Math.random() * 9)) + "mg/m³");
|
|
|
+ $("#gz").html((Math.ceil(Math.random() * 10) + 75) + "." + (Math.ceil(Math.random() * 9)) + "lx");
|
|
|
+ $("#lhq").html("0." + (Math.ceil(Math.random() * 5) + 10) + "mg/m³");
|
|
|
+ }, 3000);
|
|
|
|
|
|
- </script>
|
|
|
|
|
|
- <script type="text/javascript">
|
|
|
- // 时间
|
|
|
- myformatter(new Date());
|
|
|
- function myformatter(date){
|
|
|
- var y = date.getFullYear();
|
|
|
- var m = date.getMonth()+1;
|
|
|
- var d = date.getDate();
|
|
|
- var h = date.getHours();
|
|
|
- var min = date.getMinutes();
|
|
|
- var s = date.getSeconds();
|
|
|
- var str=y+'/'+(m<10?('0'+m):m)+'/'+(d<10?('0'+d):d)+'/ '+(h<10?('0'+h):h)+':'+(min<10?('0'+min):min)+':'+(s<10?('0'+s):s);
|
|
|
- jQuery(".time").html(str);
|
|
|
- setTimeout("myformatter(new Date());", 1000);
|
|
|
- return str;
|
|
|
- }
|
|
|
+ // 时间
|
|
|
+ myformatter(new Date());
|
|
|
|
|
|
- $(function(){
|
|
|
- // 地图点 显示隐藏
|
|
|
- $(".map_ld1").hover(function(){
|
|
|
- $(this).children(".xs_div").show();
|
|
|
- },function(){
|
|
|
- $(this).children(".xs_div").hide();
|
|
|
- });
|
|
|
- $(".map_ld3").hover(function(){
|
|
|
- $(this).children(".xs_div").show();
|
|
|
- },function(){
|
|
|
- $(this).children(".xs_div").hide();
|
|
|
- });
|
|
|
+ function myformatter(date) {
|
|
|
+ var y = date.getFullYear();
|
|
|
+ var m = date.getMonth() + 1;
|
|
|
+ var d = date.getDate();
|
|
|
+ var h = date.getHours();
|
|
|
+ var min = date.getMinutes();
|
|
|
+ var s = date.getSeconds();
|
|
|
+ var str = y + '/' + (m < 10 ? ('0' + m) : m) + '/' + (d < 10 ? ('0' + d) : d) + '/ ' + (h < 10 ? ('0' + h) : h) + ':' + (min < 10 ? ('0' + min) : min) + ':' + (s < 10 ? ('0' + s) : s);
|
|
|
+ jQuery(".time").html(str);
|
|
|
+ setTimeout("myformatter(new Date());", 1000);
|
|
|
+ return str;
|
|
|
+ }
|
|
|
|
|
|
- // 弹框2TITTLE显示隐藏
|
|
|
- $(".tk2_list ul li").hover(function(){
|
|
|
- $(this).children(".tk2_div").show();
|
|
|
- },function(){
|
|
|
- $(this).children(".tk2_div").hide();
|
|
|
- });
|
|
|
+ $(function () {
|
|
|
+ // 地图点 显示隐藏
|
|
|
+ $(".map_ld1").hover(function () {
|
|
|
+ $(this).children(".xs_div").show();
|
|
|
+ }, function () {
|
|
|
+ $(this).children(".xs_div").hide();
|
|
|
+ });
|
|
|
+ $(".map_ld3").hover(function () {
|
|
|
+ $(this).children(".xs_div").show();
|
|
|
+ }, function () {
|
|
|
+ $(this).children(".xs_div").hide();
|
|
|
+ });
|
|
|
|
|
|
- // 二维码点击放大
|
|
|
- $(".zhnc_ewm").on('click',function(){
|
|
|
- var ewmsrc = $(this).attr('src');
|
|
|
- $(".ewm_src img").attr('src', ewmsrc);
|
|
|
- $(".ewm_src").show();
|
|
|
- });
|
|
|
- $(".ewm_src span").on('click',function(){
|
|
|
- $(".ewm_src img").attr('src', '');
|
|
|
- $(".ewm_src").hide();
|
|
|
- });
|
|
|
- })
|
|
|
+ // 弹框2TITTLE显示隐藏
|
|
|
+ $(".tk2_list ul li").hover(function () {
|
|
|
+ $(this).children(".tk2_div").show();
|
|
|
+ }, function () {
|
|
|
+ $(this).children(".tk2_div").hide();
|
|
|
+ });
|
|
|
|
|
|
- </script>
|
|
|
+ // 二维码点击放大
|
|
|
+ $(".zhnc_ewm").on('click', function () {
|
|
|
+ var ewmsrc = $(this).attr('src');
|
|
|
+ $(".ewm_src img").attr('src', ewmsrc);
|
|
|
+ $(".ewm_src").show();
|
|
|
+ });
|
|
|
+ $(".ewm_src span").on('click', function () {
|
|
|
+ $(".ewm_src img").attr('src', '');
|
|
|
+ $(".ewm_src").hide();
|
|
|
+ });
|
|
|
+
|
|
|
+
|
|
|
+ $(".qiehuan").on('click', function () {
|
|
|
+ var text = $(this).html();
|
|
|
+ $(".qiehuan").attr("class","qiehuan");
|
|
|
+ $(this).attr("class","qiehuan on");
|
|
|
+ if(text == "组织"){
|
|
|
+ aloneOrGroup = "group";
|
|
|
+ var html = "";
|
|
|
+ if (errorTwoIndex == 1) {
|
|
|
+ for (var i = 0; i < 20; i+=4) {
|
|
|
+ var portsparam = ports[i]+","+ports[i+1]+","+ports[i+2]+","+ports[i+3];
|
|
|
+ html += "<li>\n" +
|
|
|
+ "<a onclick=\"goPlugIn('"+portsparam+"')\"><i></i>"+(i+1)+"-"+(i+4)+"探头</a>\n" +
|
|
|
+ "</li>";
|
|
|
+ }
|
|
|
+ var oneports = ports[0]+","+ports[1]+","+ports[2]+","+ports[3];
|
|
|
+ goPlugIn(oneports)
|
|
|
+ } else if (errorTwoIndex == 4) {
|
|
|
+ for (var i = 20; i < 28; i++) {
|
|
|
+ var portsparam = ports[i]+","+ports[i+1]+","+ports[i+2]+","+ports[i+3];
|
|
|
+ html += "<li>\n" +
|
|
|
+ "<a onclick=\"goPlugIn('"+portsparam+"')\"><i></i>"+(i+1)+"-"+(i+4)+"探头</a>\n" +
|
|
|
+ "</li>";
|
|
|
+ }
|
|
|
+ var oneports = ports[20]+","+ports[21]+","+ports[22]+","+ports[23];
|
|
|
+ goPlugIn(oneports)
|
|
|
+ } else {
|
|
|
+ $("#openVideo-tk2").attr("src","");
|
|
|
+ }
|
|
|
+ $("#tantou").html(html);
|
|
|
+ }else {
|
|
|
+ aloneOrGroup = "alone";
|
|
|
+ var html = "";
|
|
|
+ if (errorTwoIndex == 1) {
|
|
|
+ for (var i = 0; i < 20; i++) {
|
|
|
+ html += "<li>\n" +
|
|
|
+ "<a onclick=\"goPlugIn('"+ports[i]+"')\"><i></i>" + ports[i] + "的探头</a>\n" +
|
|
|
+ "</li>";
|
|
|
+ }
|
|
|
+ goPlugIn(ports[0])
|
|
|
+ } else if (errorTwoIndex == 4) {
|
|
|
+ for (var i = 20; i < 28; i++) {
|
|
|
+ html += "<li>\n" +
|
|
|
+ "<a onclick=\"goPlugIn('" + ports[i] + "')\"><i></i>" + ports[i] + "的探头</a>\n" +
|
|
|
+ "</li>";
|
|
|
+ }
|
|
|
+ goPlugIn(ports[20])
|
|
|
+ } else {
|
|
|
+ $("#openVideo-tk2").attr("src","");
|
|
|
+ }
|
|
|
+ $("#tantou").html(html);
|
|
|
+ }
|
|
|
+ });
|
|
|
+ })
|
|
|
+ </script>
|
|
|
|
|
|
</html>
|
