1540 lines
57 KiB
Plaintext
1540 lines
57 KiB
Plaintext
<%@ page language="java" pageEncoding="UTF-8"%>
|
||
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
|
||
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn"%>
|
||
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
|
||
<%@ page import="com.sipai.entity.base.ServerObject"%>
|
||
<%@ taglib uri="http://www.springsecurity.org/jsp" prefix="security"%>
|
||
|
||
<%@ page import="com.sipai.tools.Mqtt" %>
|
||
<%@ page import="org.springframework.context.ApplicationContext" %>
|
||
<%@ page import="org.springframework.web.context.support.WebApplicationContextUtils" %>
|
||
<% ApplicationContext ctx = WebApplicationContextUtils.getWebApplicationContext(request.getServletContext());
|
||
Mqtt mqtt = (Mqtt) ctx.getBean("mqtt");
|
||
request.setAttribute("mqttStatus", mqtt.getStatus());
|
||
request.setAttribute("hostWeb", mqtt.getHostWeb()); %>
|
||
|
||
<!DOCTYPE html>
|
||
<!-- <html lang="zh-CN"> -->
|
||
<!-- BEGIN HEAD -->
|
||
|
||
<head>
|
||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
|
||
<meta http-equiv = "X-UA-Compatible" content = "IE=edge,chrome=1" />
|
||
<title>
|
||
<%= ServerObject.atttable.get("TOPTITLE")%>
|
||
</title>
|
||
<!-- 引用页头及CSS页-->
|
||
<jsp:include page="/jsp/inc.jsp"></jsp:include>
|
||
<script type="text/javascript" src="<%=request.getContextPath()%>/plugins/bootstrap-daterangepicker/moment.min.js"
|
||
charset="utf-8"></script>
|
||
<%-- mqtt依赖--%>
|
||
<script src="<%=request.getContextPath()%>/JS/mqtt/mqtt.min.js" type="text/javascript"></script>
|
||
<style type="text/css">
|
||
.whole-body{
|
||
width: 1920px;
|
||
height: 1080px;
|
||
}
|
||
.content-wrapper-bg{
|
||
background-size: 100% 100%;
|
||
background-repeat:no-repeat;
|
||
background-position:center center;
|
||
}
|
||
.content-wrapper-bg-darkblue{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/bg.png);
|
||
}
|
||
.content-wrapper-bg-main{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/main_bg.png);
|
||
}
|
||
.whole-element,.left-equ-number{
|
||
position: absolute;
|
||
}
|
||
.top-title{
|
||
top: 22px;
|
||
left: 53px;
|
||
font-size: 40px;
|
||
color: #ffffff;
|
||
}
|
||
/*.top-title{
|
||
top: 0px;
|
||
left: 0px;
|
||
width: 1920px;
|
||
height: 140px;
|
||
}*/
|
||
.top-weather{
|
||
top: 12px;
|
||
right: 3px;
|
||
color: #ffffff;
|
||
}
|
||
.top-weather-element{
|
||
float: left;
|
||
padding:0;
|
||
height: 80px;
|
||
}
|
||
.top-menu{
|
||
width: 196px;
|
||
height: 42px;
|
||
background-size: 100% 100%;
|
||
background-repeat:no-repeat;
|
||
background-position:center center;
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/top_menu.png);
|
||
cursor: pointer;
|
||
top: 91.5px;
|
||
left: 26.5px;
|
||
font-size: 18px;
|
||
font-weight: 700;
|
||
text-align: left;
|
||
color: #baf6ff;
|
||
line-height: 28px;
|
||
padding-top: 9px;
|
||
padding-left: 39px;
|
||
}
|
||
.top-menu-list{
|
||
width: 190px;
|
||
top: 138px;
|
||
left: 30px;
|
||
font-size: 18px;
|
||
font-weight: 700;
|
||
text-align: left;
|
||
color: #baf6ff;
|
||
display: none;
|
||
background-size: 100% 100%;
|
||
background-repeat:no-repeat;
|
||
background-position:center center;
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/u5.svg);
|
||
z-index: 10;
|
||
}
|
||
.top-menu-list-option{
|
||
height: 44px;
|
||
line-height: 2.5;
|
||
padding-left: 35px;
|
||
}
|
||
.whole-left{
|
||
top: 200px;
|
||
left: 30px;
|
||
}
|
||
.left-equ{
|
||
width: 200px;
|
||
height: 100px;
|
||
background-size: 100% 100%;
|
||
background-repeat:no-repeat;
|
||
background-position:center center;
|
||
margin-bottom: 7px;
|
||
position: relative;
|
||
}
|
||
.left-equ-qdkqc{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_qdkqc.png);
|
||
}
|
||
.left-equ-czfj{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_czfj.png);
|
||
}
|
||
.left-equ-gylw{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_gylw.png);
|
||
}
|
||
.left-equ-mqby{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_mqby.png);
|
||
}
|
||
.left-equ-mqddc{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_mqddc.png);
|
||
}
|
||
.left-equ-srq{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_srq.png);
|
||
}
|
||
.left-equ-xhfj{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_xhfj.png);
|
||
}
|
||
.left-equ-zyl{
|
||
background-image: url(<%=request.getContextPath()%>/IMG/expo/equ_zyl.png);
|
||
}
|
||
.left-equ-open{
|
||
top: 33px;
|
||
left: 80px;
|
||
width: 50px;
|
||
text-align: center;
|
||
}
|
||
.left-equ-close{
|
||
top: 33px;
|
||
left: 135px;
|
||
width: 50px;
|
||
text-align: center;
|
||
}
|
||
.left-equ-all{
|
||
top: 72px;
|
||
left: 94px;
|
||
}
|
||
.opacity-4{
|
||
opacity: 0.4;
|
||
}
|
||
|
||
.opacity-7{
|
||
opacity: 0.7;
|
||
}
|
||
.p1-data{
|
||
width: 300px;
|
||
height: 300px;
|
||
top: 497px;
|
||
left: 375px;
|
||
}
|
||
.p1-data-element{
|
||
width: 120px;
|
||
height: 40px;
|
||
}
|
||
.now-people-number-element{
|
||
top: 50px;
|
||
left: 25px;
|
||
}
|
||
.max-bear-capacity-element{
|
||
top: 50px;
|
||
left: 155px;
|
||
}
|
||
.p1-temperature{
|
||
top: 210px;
|
||
left: 20px;
|
||
}
|
||
.p1-humidity{
|
||
top: 210px;
|
||
left: 160px;
|
||
}
|
||
.p-data{
|
||
width: 500px;
|
||
height: 315px;
|
||
}
|
||
.p2-data{
|
||
top: 125px;
|
||
left: 275px;
|
||
}
|
||
.p3-data{
|
||
top: 125px;
|
||
left: 795px;
|
||
}
|
||
.p4-data{
|
||
top: 125px;
|
||
left: 1318px;
|
||
}
|
||
.p-data-title{
|
||
width: 500px;
|
||
height: 60px;
|
||
}
|
||
.p-data-pie{
|
||
width: 500px;
|
||
height: 105px;
|
||
position: relative;
|
||
}
|
||
.p-data-pie-number{
|
||
width: 80px;
|
||
height: 28px;
|
||
text-align: center;
|
||
}
|
||
.p-data-pie-number-top{
|
||
top: 28px;
|
||
}
|
||
.p2-temperature,.p3-temperature,.p4-temperature{
|
||
left: 22px;
|
||
}
|
||
.p2-humidity,.p3-humidity,.p4-humidity{
|
||
left: 115px;
|
||
}
|
||
.p2-co2,.p3-co2,.p4-co2{
|
||
left: 210px;
|
||
}
|
||
.p2-windSpeed,.p3-windSpeed,.p4-windSpeed{
|
||
left: 304px;
|
||
}
|
||
.p2-illuminance,.p3-illuminance,.p4-illuminance{
|
||
left: 397px;
|
||
}
|
||
.p-data-line{
|
||
width: 500px;
|
||
height: 150px;
|
||
}
|
||
.p-url{
|
||
width: 155px;
|
||
height: 40px;
|
||
}
|
||
.p2-url{
|
||
top: 557px;
|
||
left: 788px;
|
||
}
|
||
.p3-url{
|
||
top: 515px;
|
||
left: 1180px;
|
||
}
|
||
.p4-url{
|
||
top: 724px;
|
||
left: 1510px;
|
||
}
|
||
.content-left, .content-right{
|
||
float: left;
|
||
padding:0;
|
||
}
|
||
.content-left{
|
||
width: 810px;
|
||
}
|
||
.content-right{
|
||
width: 2380px;
|
||
}
|
||
.content-right-subject{
|
||
min-height: 215px;
|
||
}
|
||
.content-bg-darkblue{
|
||
background: rgba(12,12,12,0.60);
|
||
}
|
||
.homePage-btn{
|
||
cursor:pointer;
|
||
background: rgba(54,167,204,0.70);
|
||
border-radius: 10px;
|
||
}
|
||
.col-lg-1, .col-lg-10, .col-lg-11, .col-lg-12, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9,
|
||
.col-md-1, .col-md-10, .col-md-11, .col-md-12, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9,
|
||
.col-sm-1, .col-sm-10, .col-sm-11, .col-sm-12, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9,
|
||
.col-xs-1, .col-xs-10, .col-xs-11, .col-xs-12, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9,
|
||
.col-xs-1-5 {
|
||
padding-right: 5px;
|
||
padding-left: 5px
|
||
}
|
||
.col-xs-1-5 {
|
||
width: 12%;
|
||
}
|
||
.col-xs-1-5{
|
||
float: left;
|
||
}
|
||
.col-xs-1-5 {
|
||
position: relative;
|
||
min-height: 1px;
|
||
}
|
||
.title-height{
|
||
height:70px;
|
||
}
|
||
.row-10{
|
||
height:10%;
|
||
}
|
||
.row-15{
|
||
height:15%;
|
||
}
|
||
.row-25{
|
||
height:25%;
|
||
}
|
||
.row-30{
|
||
height:30%;
|
||
}
|
||
.row-35{
|
||
height:35%;
|
||
}
|
||
.row-40{
|
||
height:40%;
|
||
}
|
||
.row-50{
|
||
height:50%;
|
||
}
|
||
.row-70{
|
||
height:70%;
|
||
}
|
||
.row-75{
|
||
height:75%;
|
||
}
|
||
.row-100{
|
||
height:100%;
|
||
}
|
||
.content-wrapper-bg-grey{
|
||
background: #eeeeee;
|
||
}
|
||
.content-wrapper-bg-white,.bgcolor-white,.bgcolor-white-light{
|
||
background: #ffffff;
|
||
border-radius: 5px;
|
||
}
|
||
|
||
.content-wrapper-bg-white,.content-wrapper-bg-transparent{
|
||
margin:0 5px;
|
||
border-radius: 5px;
|
||
}
|
||
.bgcolor-blue{
|
||
background: #052941;
|
||
}
|
||
|
||
.margin-bottom-15{
|
||
margin-bottom: 15px;
|
||
}
|
||
.margin-bottom-22{
|
||
margin-bottom: 22px;
|
||
}
|
||
.margin-bottom-25{
|
||
margin-bottom: 25px;
|
||
}
|
||
.margin-bottom-36{
|
||
margin-bottom: 22px;
|
||
}
|
||
.margin-bottom-55{
|
||
margin-bottom: 55px;
|
||
}
|
||
.margin-bottom-75{
|
||
margin-bottom: 75px;
|
||
}
|
||
.padding-topbottom-35{
|
||
padding-top: 35px;
|
||
padding-bottom: 35px;
|
||
}
|
||
.pad-topbottom-60{
|
||
padding-top: 60px;
|
||
padding-bottom: 60px;
|
||
}
|
||
.padding-leftright-15{
|
||
padding-left: 15px;
|
||
padding-right: 15px;
|
||
}
|
||
.padding-left-15{
|
||
padding-left: 15px;
|
||
}
|
||
.padding-left-20{
|
||
padding-left: 20px;
|
||
}
|
||
.pad-leftright-72{
|
||
padding-left: 72px;
|
||
padding-right: 72px;
|
||
}
|
||
.pad-bottom-10{
|
||
padding-bottom: 10px;
|
||
}
|
||
.padding-top-5{
|
||
padding-top:5px;
|
||
}
|
||
.padding-top-10{
|
||
padding-top: 10px;
|
||
}
|
||
.padding-top-15{
|
||
padding-top: 15px;
|
||
}
|
||
.padding-top-27{
|
||
padding-top: 27px;
|
||
}
|
||
.padding-top-90{
|
||
padding-top: 90px;
|
||
}
|
||
.line-height-08{
|
||
line-height: 0.8;
|
||
}
|
||
.line-height-1{
|
||
line-height: 1;
|
||
}
|
||
.line-height-2{
|
||
line-height: 2;
|
||
}
|
||
.line-height-2-3{
|
||
line-height: 2.3;
|
||
}
|
||
.line-height-3{
|
||
line-height: 3;
|
||
}
|
||
.line-height-5{
|
||
line-height: 5;
|
||
}
|
||
.line-height-6{
|
||
line-height: 6;
|
||
}
|
||
.font-size-12{
|
||
font-size: 12px;
|
||
font-weight: 400;
|
||
line-height: 24px;
|
||
}
|
||
.font-size-14{
|
||
font-size: 14px;
|
||
line-height: inherit;
|
||
}
|
||
.font-size-16{
|
||
font-size: 16px;
|
||
}
|
||
.font-size-18{
|
||
font-size: 18px;
|
||
}
|
||
.font-size-20{
|
||
font-size: 20px;
|
||
}
|
||
.font-size-22{
|
||
font-size: 22px;
|
||
}
|
||
.font-size-28{
|
||
font-size: 28px;
|
||
}
|
||
.font-size-33{
|
||
font-size: 33px;
|
||
}
|
||
.font-size-30{
|
||
font-size: 30px;
|
||
}
|
||
.font-size-35{
|
||
font-size: 35px;
|
||
}
|
||
.font-size-36{
|
||
font-size: 36px;
|
||
}
|
||
.font-size-40{
|
||
font-size: 40px;
|
||
}
|
||
.font-size-50{
|
||
font-size: 50px;
|
||
}
|
||
.font-size-60{
|
||
font-size: 60px;
|
||
}
|
||
.font-size-65{
|
||
font-size: 65px;
|
||
}
|
||
.font-size-70{
|
||
font-size: 70px;
|
||
}
|
||
.font-color-white,.font-color-dark-white{
|
||
color: #FFFFFF;
|
||
}
|
||
.font-color-black{
|
||
color: #0d2336;
|
||
font-weight: 600;
|
||
}
|
||
.font-color-red{
|
||
color: #CF0C0C;
|
||
}
|
||
.font-color-yellow{
|
||
color: #FFF700;
|
||
}
|
||
.font-color-redlight{
|
||
color: #CE00FF
|
||
}
|
||
.font-color-blue,.font-color-dark-blue{
|
||
color: #1472FF;
|
||
}
|
||
.font-color-lightBlue,.font-color-light-blue{
|
||
color: #00D2FF;
|
||
}
|
||
.font-color-green{
|
||
color: #00EC1F;
|
||
}
|
||
.border-left{
|
||
border-left: 1px solid #c1c1c1;
|
||
}
|
||
.border-right{
|
||
border-right: 2px solid #ffffff;
|
||
}
|
||
.border-bottom{
|
||
border-bottom: 1px solid #c1c1c1;
|
||
}
|
||
.border-leftAndRight{
|
||
border-left: 1px solid #c1c1c1;border-right: 1px solid #c1c1c1;
|
||
}
|
||
.bgcolor-blue-light{
|
||
background: #192B73;
|
||
}
|
||
.bgcolor-transparent{
|
||
background: transparent;
|
||
border-radius: 5px;
|
||
}
|
||
.img-icon{
|
||
width: 70px;
|
||
height: 70px;
|
||
}
|
||
.img-pump{
|
||
width: 60px;
|
||
height: 97px;
|
||
}
|
||
.progress_bar{
|
||
min-width: 630px;
|
||
height: 25px;
|
||
}
|
||
.polarBarLegend{
|
||
width: 360px;
|
||
height: 200px;
|
||
position: fixed;
|
||
}
|
||
.polarBar{
|
||
min-width: 630px;
|
||
height: 450px;
|
||
}
|
||
.cursor-pointer{
|
||
cursor: pointer;
|
||
}
|
||
.pressure-line{
|
||
width: 1180px;
|
||
height: 560px;
|
||
}
|
||
.rawwater-line{
|
||
width: 2360px;
|
||
height: 560px;
|
||
}
|
||
.instructions-line{
|
||
width: 2360px;
|
||
height: 355px;
|
||
}
|
||
</style>
|
||
|
||
<script type="text/javascript">
|
||
var fontcolor_grey = '#aeaeae';
|
||
var fontcolor_black = '#0d2336';
|
||
var color_blue = '#36FFF9';
|
||
var color_blue_other = '#1D4F6D';
|
||
var img_name = '';
|
||
|
||
var color = ['#649DFF','#64FFFA','#ff2ee3','#2e97ff','#ffb536'];
|
||
$(function () {
|
||
updateNowTime();
|
||
/* 定时器 */
|
||
setInterval(updateNowTime, 1000); //<!--每隔1秒钟刷新一次-->
|
||
/*$("#top-url").attr("src",ext.contextPath + '/expo/top.do' );*/
|
||
$('.top-menu-list').hide();
|
||
$(".top-menu").on("click", function (e) {
|
||
$(".top-menu-list").toggle();
|
||
});
|
||
var data2 = [['00:00',0],['01:00',0],['02:00',0],['03:00',0]];
|
||
var data1 = [['00:00',0],['01:00',0],['02:00',0],['03:00',0]];
|
||
echarts_line('p2_temperature',data1,data2);
|
||
echarts_line('p3_temperature',data1,data2);
|
||
echarts_line('p4_temperature',data1,data2);
|
||
getData();
|
||
//getWeather();
|
||
/*setInterval(getData, 60000);*/ //<!--每隔1分钟钟刷新一次-->
|
||
});
|
||
function updateNowTime(){
|
||
var nowTime = moment().format('YYYY-MM-DD HH:mm:ss');
|
||
$('.top-date').html(nowTime.substring(0,10));
|
||
$('.top-time').html(nowTime.substring(11,19));
|
||
var hour = Number(nowTime.substring(11,13));
|
||
if(hour<7 || hour>17){
|
||
var src = "<%=request.getContextPath()%>/IMG/expo/night.png";
|
||
$('.dayOrNight').attr('src', src);
|
||
}else{
|
||
var src = "<%=request.getContextPath()%>/IMG/expo/day.png";
|
||
$('.dayOrNight').attr('src', src);
|
||
}
|
||
//getData();
|
||
}
|
||
function addAndRemove4Class(one,two){
|
||
$('.'+one).addClass(two);
|
||
$('.'+one).removeClass(one);
|
||
}
|
||
var pageCode = [];
|
||
var pageCodeType = [];
|
||
var p2_temperature_sw_seriesdata = [];
|
||
var p2_temperature_cg_seriesdata = [];
|
||
var p3_temperature_sw_seriesdata = [];
|
||
var p3_temperature_cg_seriesdata = [];
|
||
var p4_temperature_sw_seriesdata = [];
|
||
var p4_temperature_cg_seriesdata = [];
|
||
function getData(){
|
||
var bizid = "021SHSB";
|
||
var jsp_id = $('#jsp_id').val();
|
||
var time_input = $('#time_input').val();
|
||
//var time_input = '2024-03-06 13:00';
|
||
$.post(ext.contextPath + '/expo/getExpoData.do', {bizid:bizid,time:time_input,jsp_id:jsp_id} , function(data) {
|
||
var arr= JSON.parse(data);
|
||
//console.log(arr);
|
||
var windDirection = '0';
|
||
var transition = '0';
|
||
|
||
|
||
if(arr.rows!=null && arr.rows!=undefined && arr.rows!=''){
|
||
for(var i=0;i<arr.rows.length;i++){
|
||
var value =0;
|
||
var numtail=0;
|
||
var dataMax=0;
|
||
var rate = 1;
|
||
if(arr.rows[i].visualCacheConfig!=null
|
||
&& arr.rows[i].visualCacheConfig!=undefined
|
||
&& arr.rows[i].visualCacheConfig!=''){
|
||
var visualCacheConfig = arr.rows[i].visualCacheConfig;
|
||
if(visualCacheConfig.numtail!=null && visualCacheConfig.numtail!=undefined && (visualCacheConfig.numtail!='' || visualCacheConfig.numtail===0)){
|
||
numtail = visualCacheConfig.numtail;
|
||
}
|
||
}
|
||
if(arr.rows[i].visualCacheData!=null
|
||
&& arr.rows[i].visualCacheData!=undefined
|
||
&& arr.rows[i].visualCacheData!=''){
|
||
var visualCacheData = arr.rows[i].visualCacheData;
|
||
if(visualCacheData.inivalue!=null && visualCacheData.inivalue!=undefined && (visualCacheData.inivalue!='' || visualCacheData.inivalue===0)){
|
||
value = visualCacheData.inivalue;
|
||
}else if(visualCacheData.value!=null && visualCacheData.value!=undefined && (visualCacheData.value!='' || visualCacheData.value===0)){
|
||
value = visualCacheData.value;
|
||
}else {
|
||
if(arr.rows[i].mPoint!=null && arr.rows[i].mPoint!=undefined && arr.rows[i].mPoint!=''){
|
||
var mPoint = arr.rows[i].mPoint;
|
||
if(mPoint.parmvalue!=null && mPoint.parmvalue!=undefined && (mPoint.parmvalue!='' || mPoint.parmvalue===0)){
|
||
value = mPoint.parmvalue;
|
||
}
|
||
if(mPoint.alarmmax!=null && mPoint.alarmmax!=undefined && (mPoint.alarmmax!='' || mPoint.alarmmax===0)){
|
||
dataMax = mPoint.alarmmax;
|
||
}
|
||
if(mPoint.numtail!=null && mPoint.numtail!=undefined && (mPoint.numtail!='' || mPoint.numtail===0)){
|
||
numtail = mPoint.numtail;
|
||
}
|
||
}
|
||
}
|
||
if(visualCacheData.numtail!=null && visualCacheData.numtail!=undefined && (visualCacheData.numtail!='' || visualCacheData.numtail===0)){
|
||
numtail = visualCacheData.numtail;
|
||
}
|
||
if(visualCacheData.rate!=null && visualCacheData.rate!=undefined && (visualCacheData.rate!='' || visualCacheData.rate===0)){
|
||
rate = visualCacheData.rate;
|
||
}
|
||
}
|
||
value = parseFloat(value)*rate;
|
||
value = value.toFixed(numtail);
|
||
if(arr.rows[i].visualCacheData!=null
|
||
&& arr.rows[i].visualCacheData!=undefined
|
||
&& arr.rows[i].visualCacheData!='') {
|
||
var visualCacheData = arr.rows[i].visualCacheData;
|
||
//只显示固定数据
|
||
/*if ((visualCacheData.mpcode==null || visualCacheData.mpcode=='') && $("." + arr.rows[i].elementCode).length > 0) {
|
||
$("." + arr.rows[i].elementCode).html(toThousands(value));
|
||
}*/
|
||
if ($("." + arr.rows[i].elementCode).length > 0) {
|
||
$("." + arr.rows[i].elementCode).html(toThousands(value));
|
||
}
|
||
|
||
if (visualCacheData.mpcode!=null && visualCacheData.mpcode!='') {
|
||
|
||
if(pageCode.indexOf(visualCacheData.mpcode)!=-1){
|
||
var pageCodedata = pageCodeType[pageCode.indexOf(visualCacheData.mpcode)];
|
||
pageCodedata.push(arr.rows[i]);
|
||
}else{
|
||
pageCode.push(visualCacheData.mpcode);
|
||
var pageCodedata = [];
|
||
pageCodedata.push(arr.rows[i]);
|
||
pageCodeType.push(pageCodedata);
|
||
}
|
||
}
|
||
}
|
||
/*if($("."+arr.rows[i].elementCode).parent().find('.nowdate').length > 0){
|
||
$("."+arr.rows[i].elementCode).parent().find('.nowdate').html(nowdate.substring(11,16));
|
||
}*/
|
||
/*if(arr.rows[i].elementCode.indexOf("number_open")!= -1){
|
||
if(Number(value)>0){
|
||
$("."+arr.rows[i].elementCode).parent().removeClass("opacity-4");
|
||
}else{
|
||
$("."+arr.rows[i].elementCode).parent().addClass("opacity-4");
|
||
}
|
||
}*/
|
||
|
||
if(arr.rows[i].elementCode=='windDirection'){
|
||
windDirection = value;
|
||
}
|
||
if(arr.rows[i].elementCode=='transition'){
|
||
transition = value;
|
||
}
|
||
|
||
if(arr.rows[i].elementCode=='p2_temperature_sw'){
|
||
p2_temperature_sw_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
|
||
}
|
||
if(arr.rows[i].elementCode=='p2_temperature_cg'){
|
||
p2_temperature_cg_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
|
||
}
|
||
if(arr.rows[i].elementCode=='p3_temperature_sw'){
|
||
p3_temperature_sw_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
|
||
}
|
||
if(arr.rows[i].elementCode=='p3_temperature_cg'){
|
||
p3_temperature_cg_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
|
||
}
|
||
if(arr.rows[i].elementCode=='p4_temperature_sw'){
|
||
p4_temperature_sw_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
|
||
}
|
||
if(arr.rows[i].elementCode=='p4_temperature_cg'){
|
||
p4_temperature_cg_seriesdata = getdataseries(arr.rows[i].mPointHistory,arr.rows[i].visualCacheDataList,numtail);
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
switch(windDirection) {
|
||
case '1':
|
||
windDirection = '北风';
|
||
break;
|
||
case '2':
|
||
windDirection = '东北风';
|
||
break;
|
||
case '3':
|
||
windDirection = '东风';
|
||
break;
|
||
case '4':
|
||
windDirection = '东南风';
|
||
break;
|
||
case '5':
|
||
windDirection = '南风';
|
||
break;
|
||
case '6':
|
||
windDirection = '西南风';
|
||
break;
|
||
case '7':
|
||
windDirection = '西风';
|
||
break;
|
||
case '8':
|
||
windDirection = '西北风';
|
||
break;
|
||
default:
|
||
windDirection = '无';
|
||
}
|
||
|
||
if($("#windDirection").length > 0){
|
||
$("#windDirection").html(windDirection);
|
||
}
|
||
var equEle = [];
|
||
var equEle_hot = ['left-equ-srq','left-equ-mqby','left-equ-mqddc','left-equ-qdkqc','left-equ-czfj'];
|
||
var equEle_transition = ['left-equ-mqby','left-equ-mqddc','left-equ-qdkqc','left-equ-xhfj'];
|
||
var equEle_cold = ['left-equ-zyl','left-equ-gylw','left-equ-mqby','left-equ-mqddc','left-equ-qdkqc','left-equ-xhfj'];
|
||
if($("#transition").length > 0){
|
||
switch(transition) {
|
||
case '0':
|
||
//$("#transition").attr("src",ext.contextPath + "/IMG/expo/cold.png");
|
||
equEle = equEle_cold;
|
||
break;
|
||
case '1':
|
||
//$("#transition").attr("src",ext.contextPath + "/IMG/expo/hot.png");
|
||
equEle = equEle_hot;
|
||
break;
|
||
default:
|
||
//$("#transition").attr("src",ext.contextPath + "/IMG/expo/transition.png");
|
||
equEle = equEle_transition;
|
||
}
|
||
}
|
||
|
||
if(equEle!=null && equEle.length>0) {
|
||
for (var e = 0; e < equEle.length; e++) {
|
||
$("." + equEle[e]).removeClass("opacity-4");
|
||
$("." + equEle[e]).parent().prepend($("." + equEle[e]));
|
||
}
|
||
}
|
||
if(p2_temperature_sw_seriesdata!=null && p2_temperature_cg_seriesdata.length>0){
|
||
echarts_line('p2_temperature',p2_temperature_sw_seriesdata,p2_temperature_cg_seriesdata);
|
||
}
|
||
if(p3_temperature_sw_seriesdata!=null && p3_temperature_cg_seriesdata.length>0){
|
||
echarts_line('p3_temperature',p3_temperature_sw_seriesdata,p3_temperature_cg_seriesdata);
|
||
}
|
||
if(p4_temperature_sw_seriesdata!=null && p4_temperature_cg_seriesdata.length>0){
|
||
echarts_line('p4_temperature',p4_temperature_sw_seriesdata,p4_temperature_cg_seriesdata);
|
||
}
|
||
|
||
try {
|
||
//初始化mqtt
|
||
if ('${mqttStatus}' == '0') {
|
||
initialMqtt('expo_homepage_'+'${cu.id}'+Math.random());
|
||
} else {
|
||
console.log('mq已关闭')
|
||
}
|
||
} catch (err) {
|
||
//处理错误
|
||
}
|
||
});
|
||
|
||
}
|
||
function getdataseries(mPointHistory,visualCacheDataList,numtail){
|
||
var dataseries =[];
|
||
if(mPointHistory!=null
|
||
&& mPointHistory!=undefined
|
||
&& mPointHistory!=''){
|
||
var mPointHistory = mPointHistory;
|
||
for(var m=0;m<mPointHistory.length;m++){
|
||
var dataserie =[];
|
||
dataserie.push(mPointHistory[m].measuredt.substr(0,19));
|
||
dataserie.push(mPointHistory[m].parmvalue.toFixed(numtail));
|
||
dataseries.push(dataserie);
|
||
}
|
||
}else{
|
||
if(visualCacheDataList!=null
|
||
&& visualCacheDataList!=undefined
|
||
&& visualCacheDataList!=''){
|
||
var visualCacheDataList = visualCacheDataList;
|
||
for(var m=0;m<visualCacheDataList.length;m++){
|
||
var dataserie =[];
|
||
dataserie.push(visualCacheDataList[m].insdt.substr(0,16));
|
||
dataserie.push(visualCacheDataList[m].value.toFixed(numtail));
|
||
dataseries.push(dataserie);
|
||
}
|
||
}
|
||
}
|
||
return dataseries;
|
||
}
|
||
function echarts_line_apprend(id,seriesdata1,seriesdata2){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在，就进行销毁。
|
||
|
||
}
|
||
}
|
||
function echarts_line(id,seriesdata1,seriesdata2){
|
||
var lifeChart = echarts.getInstanceByDom(document.getElementById(id));
|
||
//有的话就获取已有echarts实例的DOM节点。
|
||
if (lifeChart != null) { // 如果存在，就进行销毁。
|
||
lifeChart.setOption({
|
||
series: [
|
||
{
|
||
name: '室外温度',
|
||
type: 'line',
|
||
//smooth: true,
|
||
showSymbol: false,
|
||
data: seriesdata1,
|
||
},
|
||
{
|
||
name: '场馆温度',
|
||
type: 'line',
|
||
//smooth: true,
|
||
showSymbol: false,
|
||
data: seriesdata2,
|
||
areaStyle: {
|
||
// 线性渐变，前四个参数分别是 x0, y0, x2, y2, 范围从 0 - 1，相当于在图形包围盒中的百分比，如果 globalCoord 为 `true`，则该四个值是绝对的像素位置
|
||
color: {
|
||
type: 'linear',
|
||
x: 0,
|
||
y: 1,
|
||
x2: 0,
|
||
y2: 0,
|
||
colorStops: [{
|
||
offset: 0, color: 'rgba(255,255,255,0)' // 0% 处的颜色
|
||
}, {
|
||
offset: 1, color: 'rgba(214,255,0,0.7)' // 100% 处的颜色
|
||
}],
|
||
global: false // 缺省为 false
|
||
}
|
||
},
|
||
},
|
||
|
||
]
|
||
})
|
||
}else{
|
||
var option = {
|
||
color:['#00FFDD','#D6FF00'],
|
||
animation: false ,
|
||
tooltip: {
|
||
trigger: 'axis',
|
||
},
|
||
|
||
legend: {
|
||
data: ['场馆温度', '室外温度'],
|
||
right: '5%',
|
||
icon: 'circle',
|
||
textStyle: {
|
||
color: '#70AFD8' ,
|
||
}
|
||
},
|
||
grid: {
|
||
left: '5%',
|
||
right: '5%',
|
||
top: '28',
|
||
bottom: '5%',
|
||
show: true ,
|
||
backgroundColor: 'rgba(24,45,95,0.7)',
|
||
borderColor: '#1D5179' ,
|
||
containLabel: true
|
||
},
|
||
xAxis: {
|
||
type : 'time',
|
||
boundaryGap: false,
|
||
axisLine: {
|
||
show: true,
|
||
lineStyle: {
|
||
color: '#1D5179'
|
||
}
|
||
},
|
||
axisTick: {
|
||
show: false ,
|
||
},
|
||
axisLabel: {
|
||
color: '#70AFD8' ,
|
||
/*formatter: function (value, index) {
|
||
if(value.length>18){
|
||
return value.substring(11,19);
|
||
}else{
|
||
return value;
|
||
}
|
||
}*/
|
||
},
|
||
},
|
||
yAxis: {
|
||
type: 'value',
|
||
splitNumber: 3,
|
||
axisLine: {
|
||
show: true,
|
||
lineStyle: {
|
||
color: '#1D5179'
|
||
}
|
||
},
|
||
axisLabel: {
|
||
color: '#70AFD8' ,
|
||
},
|
||
//网格样式
|
||
splitLine: {
|
||
show: true,
|
||
lineStyle:{
|
||
color: '#1D5179',
|
||
width: 1,
|
||
type: 'dashed'
|
||
}
|
||
}
|
||
},
|
||
progressive: 20000,
|
||
series: [
|
||
{
|
||
name: '室外温度',
|
||
type: 'line',
|
||
//smooth: true,
|
||
showSymbol: false,
|
||
data: seriesdata1,
|
||
//折线图在数据量远大于像素点时候的降采样策略，开启后可以有效的优化图表的绘制效率，默认关闭，也就是全部绘制不过滤数据点。
|
||
// 可选：
|
||
// 'lttb' 采用 Largest-Triangle-Three-Bucket 算法，可以最大程度保证采样后线条的趋势，形状和极值。
|
||
// 'average' 取过滤点的平均值
|
||
// 'min' 取过滤点的最小值
|
||
// 'max' 取过滤点的最大值
|
||
// 'minmax' 取过滤点绝对值的最大极值 (从 v5.5.0 开始支持)
|
||
// 'sum' 取过滤点的和
|
||
sampling: 'lttb',
|
||
//开启大数据量优化，在数据特别多而出现图形卡顿时候开启
|
||
large:true,
|
||
},
|
||
{
|
||
name: '场馆温度',
|
||
type: 'line',
|
||
//smooth: true,
|
||
showSymbol: false,
|
||
data: seriesdata2,
|
||
areaStyle: {
|
||
// 线性渐变，前四个参数分别是 x0, y0, x2, y2, 范围从 0 - 1，相当于在图形包围盒中的百分比，如果 globalCoord 为 `true`，则该四个值是绝对的像素位置
|
||
color: {
|
||
type: 'linear',
|
||
x: 0,
|
||
y: 1,
|
||
x2: 0,
|
||
y2: 0,
|
||
colorStops: [{
|
||
offset: 0, color: 'rgba(255,255,255,0)' // 0% 处的颜色
|
||
}, {
|
||
offset: 1, color: 'rgba(214,255,0,0.7)' // 100% 处的颜色
|
||
}],
|
||
global: false // 缺省为 false
|
||
}
|
||
},
|
||
//折线图在数据量远大于像素点时候的降采样策略，开启后可以有效的优化图表的绘制效率，默认关闭，也就是全部绘制不过滤数据点。
|
||
// 可选：
|
||
// 'lttb' 采用 Largest-Triangle-Three-Bucket 算法，可以最大程度保证采样后线条的趋势，形状和极值。
|
||
// 'average' 取过滤点的平均值
|
||
// 'min' 取过滤点的最小值
|
||
// 'max' 取过滤点的最大值
|
||
// 'minmax' 取过滤点绝对值的最大极值 (从 v5.5.0 开始支持)
|
||
// 'sum' 取过滤点的和
|
||
sampling: 'lttb',
|
||
//开启大数据量优化，在数据特别多而出现图形卡顿时候开启
|
||
large:true,
|
||
},
|
||
|
||
]
|
||
};
|
||
lifeChart = echarts.init(document.getElementById(id));
|
||
lifeChart.setOption(option,true);
|
||
|
||
}
|
||
}
|
||
function homePage() {
|
||
$('.jump-area').hide();
|
||
$('.sub-region').hide();
|
||
$('.homePage').show();
|
||
}
|
||
function jumpArea(el) {
|
||
$('.homePage').hide();
|
||
$('.sub-region').hide();
|
||
$('.jump-area').show();
|
||
$('.'+el).show();
|
||
}
|
||
//添加千分位符合
|
||
function toThousands(num) {
|
||
var nums =num;
|
||
var re=/\d{1,3}(?=(\d{3})+$)/g;
|
||
var n1=0;
|
||
if(nums!=null && nums!='' && nums!=undefined){
|
||
n1=nums.toString().replace(/^(\d+)((\.\d+)?)$/,function(s,s1,s2){return s1.replace(re,"$&,")+s2;});
|
||
}
|
||
return n1;
|
||
}
|
||
|
||
var locationhref = function (url) {
|
||
window.location.href = ext.contextPath + url;
|
||
}
|
||
|
||
var getWeather = function () {
|
||
$.post(ext.contextPath + "/work/weather/getList.do", {page: 1,rows:1,bizid:unitId,type:0}, function(data) {
|
||
if (data.total >0){
|
||
let temp = data.rows[0].temp;
|
||
let weather = data.rows[0].weather;
|
||
let precip = data.rows[0].precip;
|
||
let windSpeed = data.rows[0].windspeed;
|
||
var reg = new RegExp("/h","g");// 加'g'，删除字符串里所有的/h
|
||
windSpeed=windSpeed.replace(reg,"");
|
||
let humidity = data.rows[0].humidity;
|
||
let vis = data.rows[0].vis;
|
||
$("#temperature").html(temp);
|
||
$("#weather").html(weather);
|
||
$("#precip").html(precip);
|
||
$("#windSpeed").html(windSpeed);
|
||
$("#humidity").html(humidity);
|
||
$("#vis").html(vis);
|
||
}else{
|
||
$.post(ext.contextPath + "/work/weather/getList.do", {page: 1,rows:1,bizid:unitId,type:1}, function(data) {
|
||
if (data.total >0){
|
||
let temp = data.rows[0].temp;
|
||
let weather = data.rows[0].weather;
|
||
let precip = data.rows[0].precip;
|
||
let windSpeed = data.rows[0].windspeed;
|
||
var reg = new RegExp("/h","g");// 加'g'，删除字符串里所有的/h
|
||
windSpeed=windSpeed.replace(reg,"");
|
||
let humidity = data.rows[0].humidity;
|
||
let vis = data.rows[0].vis;
|
||
$("#temperature").html(temp);
|
||
$("#weather").html(weather);
|
||
$("#precip").html(precip);
|
||
$("#windSpeed").html(windSpeed);
|
||
$("#humidity").html(humidity);
|
||
$("#vis").html(vis);
|
||
}
|
||
},'json');
|
||
}
|
||
},'json');
|
||
}
|
||
function openExpoHomepage() {
|
||
if('${param.link}'==''){
|
||
window.open(ext.contextPath + "/expo/homepage.do?link=expo");
|
||
}
|
||
}
|
||
var client = null;
|
||
var dataType = 0;
|
||
function initialMqtt(mqttId) {
|
||
const options = {
|
||
clean: true,
|
||
connectTimeout: 10000,
|
||
clientId: mqttId,
|
||
username: "admin",
|
||
password: 'public'
|
||
}
|
||
const connectUrl = '${hostWeb}';
|
||
//console.log(connectUrl);
|
||
client = mqtt.connect(connectUrl, options);
|
||
|
||
//当重新连接启动触发回调
|
||
client.on('reconnect', function () {
|
||
// console.log('正在重连.....');
|
||
});
|
||
//连接断开后触发的回调
|
||
client.on("close", function () {
|
||
console.log('客户端已断开连接.....');
|
||
});
|
||
//从broker接收到断开连接的数据包后发出。MQTT 5.0特性
|
||
client.on("disconnect", function (packet) {
|
||
console.log('从broker接收到断开连接的数据包.....' + packet);
|
||
});
|
||
//客户端脱机下线触发回调
|
||
client.on("offline", function () {
|
||
console.log('客户端脱机下线.....');
|
||
});
|
||
//当客户端无法连接或出现错误时触发回调
|
||
client.on("error", (error) => {
|
||
console.log('客户端出现错误.....' + error);
|
||
});
|
||
//当客户端发送任何数据包时发出。这包括published()包以及MQTT用于管理订阅和连接的包
|
||
client.on("packetsend", (packet) => {
|
||
// console.log('客户端已发出数据包：' + packet);
|
||
});
|
||
//当客户端接收到任何数据包时发出。这包括来自订阅主题的信息包以及MQTT用于管理订阅和连接的信息包
|
||
client.on("packetreceive", (packet) => {
|
||
// console.log('收到：' + packet);
|
||
});
|
||
|
||
//成功连接后触发的回调
|
||
client.on("connect", function (connack) {
|
||
// layer.msg('成功连接上mq服务器');
|
||
console.log('成功连接上mqtt服务器');
|
||
//订阅某主题
|
||
/**
|
||
* client.subscribe(topic/topic array/topic object, [options], [callback])
|
||
* topic:一个string类型的topic或者一个topic数组,也可以是一个对象
|
||
* options
|
||
*/
|
||
client.subscribe('021SHSB_UP_VUE', {qos: 2});
|
||
//每隔2秒发布一次数据
|
||
// setInterval(publish, 2000)
|
||
});
|
||
|
||
function publish() {
|
||
//发布数据
|
||
/**
|
||
* client.publish(topic,message,[options], [callback])
|
||
*
|
||
* message: Buffer or String
|
||
* options:{
|
||
* qos:0, //默认0
|
||
* retain:false, //默认false
|
||
* dup:false, //默认false
|
||
* properties:{}
|
||
* }
|
||
* callback:function (err){}
|
||
*/
|
||
const message = "h5 message " + Math.random() + new Date();
|
||
client.publish("testtopic/123", message, {qos: 2});
|
||
}
|
||
|
||
//当客户端接收到发布消息时触发回调
|
||
/**
|
||
* topic:收到的数据包的topic
|
||
* message:收到的数据包的负载playload
|
||
* packet:收到的数据包
|
||
*/
|
||
client.on('message', (topic, message, packet) => {
|
||
//console.log(topic);
|
||
if (topic == '021SHSB_UP_VUE' && dataType == 0) {
|
||
dataType = 1;
|
||
//秒级数据，保留秒数，当前为6小时
|
||
var dataNumber = 21600;
|
||
var topic_json = JSON.parse(message.toString());
|
||
//console.log(topic_json);
|
||
if(topic_json!=null && topic_json!=undefined && topic_json!=''){
|
||
var windDirection = '0';
|
||
var transition = '0';
|
||
|
||
var p2_temperature_sw = 0;
|
||
var p2_temperature_cg = 0;
|
||
var p2_temperature_date = '';
|
||
var p3_temperature_sw = 0;
|
||
var p3_temperature_cg = 0;
|
||
var p3_temperature_date = '';
|
||
var p4_temperature_sw = 0;
|
||
var p4_temperature_cg = 0;
|
||
var p4_temperature_date = '';
|
||
for(var i=0;i<topic_json.length;i++){
|
||
var mpdata = topic_json[i];
|
||
var value = mpdata.parmvalue;
|
||
var measuredt = mpdata.measuredt.substr(0,19);
|
||
var numtail=0;
|
||
var dataMax=0;
|
||
var rate = 1;
|
||
if(pageCode.indexOf(mpdata.id)!=-1){
|
||
var arrs = pageCodeType[pageCode.indexOf(mpdata.id)];
|
||
//console.log(pageCode);
|
||
//console.log(arrs);
|
||
for(var a=0;a<arrs.length;a++){
|
||
arr = arrs[a];
|
||
//console.log(arr);
|
||
if(arr.visualCacheData!=null
|
||
&& arr.visualCacheData!=undefined
|
||
&& arr.visualCacheData!=''){
|
||
var visualCacheData = arr.visualCacheData;
|
||
if(arr.mPoint!=null && arr.mPoint!=undefined && arr.mPoint!=''){
|
||
var mPoint = arr.mPoint;
|
||
if(mPoint.alarmmax!=null && mPoint.alarmmax!=undefined && (mPoint.alarmmax!='' || mPoint.alarmmax===0)){
|
||
dataMax = mPoint.alarmmax;
|
||
}
|
||
if(mPoint.numtail!=null && mPoint.numtail!=undefined && (mPoint.numtail!='' || mPoint.numtail===0)){
|
||
numtail = mPoint.numtail;
|
||
}
|
||
}
|
||
if(visualCacheData.numtail!=null && visualCacheData.numtail!=undefined && (visualCacheData.numtail!='' || visualCacheData.numtail===0)){
|
||
numtail = visualCacheData.numtail;
|
||
}
|
||
if(visualCacheData.rate!=null && visualCacheData.rate!=undefined && (visualCacheData.rate!='' || visualCacheData.rate===0)){
|
||
rate = visualCacheData.rate;
|
||
}
|
||
}else{
|
||
var mPoint = arr.mPoint;
|
||
if(mPoint!=null && mPoint!=undefined && mPoint!=''){
|
||
if(mPoint.alarmmax!=null && mPoint.alarmmax!=undefined && (mPoint.alarmmax!='' || mPoint.alarmmax===0)){
|
||
dataMax = mPoint.alarmmax;
|
||
}
|
||
if(mPoint.numtail!=null && mPoint.numtail!=undefined && (mPoint.numtail!='' || mPoint.numtail===0)){
|
||
numtail = mPoint.numtail;
|
||
}
|
||
}
|
||
}
|
||
value = parseFloat(value)*rate;
|
||
value = value.toFixed(numtail);
|
||
|
||
if (arr.elementCode=='qdkqc_number_all') {
|
||
console.log(value);
|
||
}
|
||
if ($("." + arr.elementCode).length > 0) {
|
||
$("." + arr.elementCode).html(toThousands(value));
|
||
}
|
||
if($("."+arr.elementCode).parent().find('.nowdate').length > 0){
|
||
$("."+arr.elementCode).parent().find('.nowdate').html(nowdate.substring(11,16));
|
||
}
|
||
/*if(arr.elementCode.indexOf("number_open")!= -1){
|
||
if(Number(value)>0){
|
||
$("."+arr.elementCode).parent().removeClass("opacity-4");
|
||
}else{
|
||
$("."+arr.elementCode).parent().addClass("opacity-4");
|
||
}
|
||
}*/
|
||
if(arr.elementCode=='windDirection'){
|
||
windDirection = value;
|
||
switch(windDirection) {
|
||
case '1':
|
||
windDirection = '北风';
|
||
break;
|
||
case '2':
|
||
windDirection = '东北风';
|
||
break;
|
||
case '3':
|
||
windDirection = '东风';
|
||
break;
|
||
case '4':
|
||
windDirection = '东南风';
|
||
break;
|
||
case '5':
|
||
windDirection = '南风';
|
||
break;
|
||
case '6':
|
||
windDirection = '西南风';
|
||
break;
|
||
case '7':
|
||
windDirection = '西风';
|
||
break;
|
||
case '8':
|
||
windDirection = '西北风';
|
||
break;
|
||
default:
|
||
windDirection = '无';
|
||
}
|
||
|
||
if($("#windDirection").length > 0){
|
||
$("#windDirection").html(windDirection);
|
||
}
|
||
}
|
||
if(arr.elementCode=='transition'){
|
||
transition = value;
|
||
//left-equ-czfj,left-equ-xhfj,left-equ-qdkqc,left-equ-mqddc,left-equ-mqby,left-equ-gylw,left-equ-zyl,left-equ-srq
|
||
var equEle = [];
|
||
var equEle_hot = ['left-equ-srq','left-equ-mqby','left-equ-mqddc','left-equ-qdkqc','left-equ-czfj'];
|
||
var equEle_cold = ['left-equ-mqby','left-equ-mqddc','left-equ-qdkqc','left-equ-xhfj'];
|
||
var equEle_transition = ['left-equ-zyl','left-equ-gylw','left-equ-mqby','left-equ-mqddc','left-equ-qdkqc','left-equ-xhfj'];
|
||
if($("#transition").length > 0){
|
||
switch(transition) {
|
||
case '0':
|
||
//$("#transition").attr("src",ext.contextPath + "/IMG/expo/cold.png");
|
||
equEle = equEle_cold;
|
||
break;
|
||
case '1':
|
||
//$("#transition").attr("src",ext.contextPath + "/IMG/expo/hot.png");
|
||
equEle = equEle_hot;
|
||
break;
|
||
default:
|
||
//$("#transition").attr("src",ext.contextPath + "/IMG/expo/transition.png");
|
||
equEle = equEle_transition;
|
||
}
|
||
}
|
||
|
||
if(equEle!=null && equEle.length>0) {
|
||
$(".left-equ").each(function(i){//i表示下标索引
|
||
if(!$(this).hasClass("opacity-4")){
|
||
$(this).addClass("opacity-4");
|
||
}
|
||
});
|
||
for (var e = 0; e < equEle.length; e++) {
|
||
$("." + equEle[e]).removeClass("opacity-4");
|
||
$("." + equEle[e]).parent().prepend($("." + equEle[e]));
|
||
}
|
||
}
|
||
}
|
||
if(arr.elementCode=='p2_temperature_sw'){
|
||
p2_temperature_sw = value;
|
||
p2_temperature_date = measuredt;
|
||
if(p2_temperature_sw_seriesdata.length>dataNumber){
|
||
p2_temperature_sw_seriesdata.shift();
|
||
}
|
||
p2_temperature_sw_seriesdata.push([p2_temperature_date,p2_temperature_sw]);
|
||
}
|
||
if(arr.elementCode=='p2_temperature_cg'){
|
||
p2_temperature_cg = value;
|
||
p2_temperature_date = measuredt;
|
||
if(p2_temperature_cg_seriesdata.length>dataNumber){
|
||
p2_temperature_cg_seriesdata.shift();
|
||
}
|
||
p2_temperature_cg_seriesdata.push([p2_temperature_date,p2_temperature_cg]);
|
||
}
|
||
if(arr.elementCode=='p3_temperature_sw'){
|
||
p3_temperature_sw = value;
|
||
p3_temperature_date = measuredt;
|
||
if(p3_temperature_sw_seriesdata.length>dataNumber){
|
||
p3_temperature_sw_seriesdata.shift();
|
||
}
|
||
p3_temperature_sw_seriesdata.push([p3_temperature_date,p3_temperature_sw]);
|
||
}
|
||
if(arr.elementCode=='p3_temperature_cg'){
|
||
p3_temperature_cg = value;
|
||
p3_temperature_date = measuredt;
|
||
if(p3_temperature_cg_seriesdata.length>dataNumber){
|
||
p3_temperature_cg_seriesdata.shift();
|
||
}
|
||
p3_temperature_cg_seriesdata.push([p3_temperature_date,p3_temperature_cg]);
|
||
}
|
||
if(arr.elementCode=='p4_temperature_sw'){
|
||
p4_temperature_sw = value;
|
||
p4_temperature_date = measuredt;
|
||
if(p4_temperature_sw_seriesdata.length>dataNumber){
|
||
p4_temperature_sw_seriesdata.shift();
|
||
}
|
||
p4_temperature_sw_seriesdata.push([p4_temperature_date,p4_temperature_sw]);
|
||
}
|
||
if(arr.elementCode=='p4_temperature_cg'){
|
||
p4_temperature_cg = value;
|
||
p4_temperature_date = measuredt;
|
||
if(p4_temperature_cg_seriesdata.length>dataNumber){
|
||
p4_temperature_cg_seriesdata.shift();
|
||
}
|
||
p4_temperature_cg_seriesdata.push([p4_temperature_date,p4_temperature_cg]);
|
||
}
|
||
}
|
||
|
||
}
|
||
}
|
||
|
||
if(p2_temperature_sw_seriesdata!=null && p2_temperature_cg_seriesdata.length>0){
|
||
echarts_line('p2_temperature',p2_temperature_sw_seriesdata,p2_temperature_cg_seriesdata);
|
||
}
|
||
if(p3_temperature_sw_seriesdata!=null && p3_temperature_cg_seriesdata.length>0){
|
||
echarts_line('p3_temperature',p3_temperature_sw_seriesdata,p3_temperature_cg_seriesdata);
|
||
}
|
||
if(p4_temperature_sw_seriesdata!=null && p4_temperature_cg_seriesdata.length>0){
|
||
echarts_line('p4_temperature',p4_temperature_sw_seriesdata,p4_temperature_cg_seriesdata);
|
||
}
|
||
}
|
||
dataType = 0;
|
||
}
|
||
});
|
||
//页面离开自动断开连接
|
||
$(window).bind("beforeunload", () => {
|
||
// console.log("客户端窗口关闭,断开连接");
|
||
client.disconnect();
|
||
})
|
||
}
|
||
</script>
|
||
|
||
</head>
|
||
<body style="overflow-x: auto;">
|
||
<div class="whole-body content-wrapper-bg content-wrapper-bg-darkblue">
|
||
<!-- BEGIN CONTAINER -->
|
||
<input type="hidden" name="jsp_id" id="jsp_id" value="expo_homepage">
|
||
<div class="whole-body content-wrapper-bg content-wrapper-bg-main text-center font-size-36 font-color-white">
|
||
<%--<div class="whole-element top-title"><iframe style="height:100%;width:100%;" frameborder="1" scrolling="no" id="top-url"></iframe></div>--%>
|
||
<div class="whole-element top-title cursor-pointer" onclick="openExpoHomepage()">上海温室花园环境控制系统</div>
|
||
<div class="whole-element top-weather">
|
||
<div class="top-weather-element border-right" style="width: 233.5px;">
|
||
<div class="text-right row-100" style="float: left;width: 120px;">
|
||
<div class="top-date font-size-18"></div>
|
||
<div class="top-time font-size-30"></div>
|
||
</div>
|
||
<div class="row-100" style="float: left;width: 111.4px;">
|
||
<img class="dayOrNight" src="<%=request.getContextPath()%>/IMG/expo/day.png">
|
||
</div>
|
||
</div>
|
||
<div class="top-weather-element border-right" style="width: 221px;">
|
||
<div class="col-xs-6 row-100 line-height-2 font-size-33" id="windDirection"></div>
|
||
<div class="col-xs-6 row-100 text-left ">
|
||
<div class="font-size-14">当前温度</div>
|
||
<div class="font-size-22"><span class="temperature font-size-35">0</span>℃</div>
|
||
</div>
|
||
</div>
|
||
<div class="top-weather-element border-right text-left" style="width: 172px;">
|
||
<div class="col-xs-12 font-size-18 row-50 line-height-2 padding-left-20">降雨量<span class="precip">0</span>mm/h</div>
|
||
<%--<div class="col-xs-12 font-size-18 row-50 line-height-2 padding-left-20">气压<span class="illumination">0</span>hpa</div>--%>
|
||
<div class="col-xs-12 font-size-18 row-50 line-height-2 padding-left-20">光照度<span class="illumination">0</span>lux</div>
|
||
</div>
|
||
<div class="top-weather-element border-right text-left" style="width: 140px;">
|
||
<div class="col-xs-12 font-size-18 row-50 line-height-2 padding-left-15">风速<span class="windSpeed">0</span>m/s</div>
|
||
<div class="col-xs-12 font-size-18 row-50 line-height-2 padding-left-15">湿度<span class="humidity">0</span>%</div>
|
||
</div>
|
||
<div class="top-weather-element padding-leftright-15">
|
||
<img src="<%=request.getContextPath()%>/IMG/expo/weather.png" id="transition">
|
||
</div>
|
||
</div>
|
||
<div class=" whole-element top-menu">温室总览</div>
|
||
<div class="whole-element top-menu-list">
|
||
<div class="top-menu-list-option cursor-pointer" onclick="locationhref('/process/dataVisualFrame/view.do?frameId=d7ba67ff2b124d679c325852811bef3c&unitId=021SHSB')">1号馆海市沙洲</div>
|
||
<div class="top-menu-list-option cursor-pointer" onclick="locationhref('/process/dataVisualFrame/view.do?frameId=d2535488d8934c83b6630279b9c2d547&unitId=021SHSB')">2号馆云上森林</div>
|
||
<div class="top-menu-list-option cursor-pointer" onclick="locationhref('/process/dataVisualFrame/view.do?frameId=52713970e59d42c1959bf2c610ce071a&unitId=021SHSB')">3号馆云雾峡谷</div>
|
||
</div>
|
||
|
||
<div class="whole-element whole-left font-size-28">
|
||
<div class="left-equ left-equ-czfj opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green czfj_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red czfj_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="czfj_number_all">0</span>组</div>
|
||
</div>
|
||
<div class="left-equ left-equ-xhfj opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green xhfj_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red xhfj_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="xhfj_number_all">0</span>组</div>
|
||
</div>
|
||
<div class="left-equ left-equ-qdkqc opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green qdkqc_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red qdkqc_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="qdkqc_number_all">0</span>组</div>
|
||
</div>
|
||
<div class="left-equ left-equ-mqddc opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green mqddc_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red mqddc_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="mqddc_number_all">0</span>组</div>
|
||
</div>
|
||
<div class="left-equ left-equ-mqby opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green mqby_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red mqby_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="mqby_number_all">0</span>组</div>
|
||
</div>
|
||
<div class="left-equ left-equ-gylw opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green gylw_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red gylw_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="gylw_number_all">0</span>组</div>
|
||
</div>
|
||
<div class="left-equ left-equ-zyl opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green zyl_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red zyl_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="zyl_number_all">0</span>组</div>
|
||
</div>
|
||
<div class="left-equ left-equ-srq opacity-4">
|
||
<span class="left-equ-number left-equ-open font-color-green srq_number_open">0</span>
|
||
<span class="left-equ-number left-equ-close font-color-red srq_number_close">0</span>
|
||
<div class="left-equ-number left-equ-all font-size-14">共： <span class="srq_number_all">0</span>组</div>
|
||
</div>
|
||
</div>
|
||
<div class=" whole-element p-data p2-data">
|
||
<div class="p-data-title"></div>
|
||
<div class="p-data-pie font-size-28 line-height-1">
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p2-temperature">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p2-humidity">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p2-co2">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p2-windSpeed">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p2-illuminance">0</div>
|
||
</div>
|
||
<div class="p-data-line" id="p2_temperature"></div>
|
||
</div>
|
||
<div class=" whole-element p-data p3-data">
|
||
<div class="p-data-title"></div>
|
||
<div class="p-data-pie font-size-28 line-height-1">
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p3-temperature">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p3-humidity">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p3-co2">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p3-windSpeed">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p3-illuminance">0</div>
|
||
</div>
|
||
<div class="p-data-line" id="p3_temperature"></div>
|
||
</div>
|
||
<div class=" whole-element p-data p4-data">
|
||
<div class="p-data-title"></div>
|
||
<div class="p-data-pie font-size-28 line-height-1">
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p4-temperature">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p4-humidity">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p4-co2">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p4-windSpeed">0</div>
|
||
<div class="whole-element p-data-pie-number p-data-pie-number-top p4-illuminance">0</div>
|
||
</div>
|
||
<div class="p-data-line" id="p4_temperature"></div>
|
||
</div>
|
||
<div class=" whole-element p1-data">
|
||
<div style="width: 100%;height: 100%;position: relative">
|
||
<div class="whole-element p1-data-element now-people-number-element font-size-14"><span class="now-people-number font-size-30 font-color-lightBlue">0</span>人</div>
|
||
<div class="whole-element p1-data-element max-bear-capacity-element font-size-14"><span class="max-bear-capacity font-size-30 font-color-lightBlue">0</span>人</div>
|
||
<div class="whole-element p1-data-element p1-temperature font-size-40 line-height-1">0</div>
|
||
<div class="whole-element p1-data-element p1-humidity font-size-40 line-height-1">0</div>
|
||
</div>
|
||
</div>
|
||
<div class="whole-element cursor-pointer p-url p2-url" onclick="locationhref('/process/dataVisualFrame/view.do?frameId=d7ba67ff2b124d679c325852811bef3c&unitId=021SHSB&userId=emp01')"></div>
|
||
<div class="whole-element cursor-pointer p-url p3-url" onclick="locationhref('/process/dataVisualFrame/view.do?frameId=d2535488d8934c83b6630279b9c2d547&unitId=021SHSB&userId=emp01')"></div>
|
||
<div class="whole-element cursor-pointer p-url p4-url" onclick="locationhref('/process/dataVisualFrame/view.do?frameId=52713970e59d42c1959bf2c610ce071a&unitId=021SHSB&userId=emp01')"></div>
|
||
</div>
|
||
</div>
|
||
</body>
|
||
</html> |