<!DOCTYPE html>
|
<html lang="zh-CN">
|
<head>
|
<meta charset="UTF-8">
|
<title>监测点</title>
|
<!--[if IE 8]>
|
<html lang="en" class="ie8 no-js"> <![endif]-->
|
<!--[if IE 9]>
|
<html lang="en" class="ie9 no-js"> <![endif]-->
|
<!--[if !IE]><!-->
|
|
<!--<![endif]-->
|
<!-- BEGIN HEAD -->
|
<!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
|
<!--[if lt IE 9]>
|
<script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script>
|
<script src="http://apps.bdimg.com/libs/respond.js/1.4.2/respond.min.js"></script>
|
<![endif]-->
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,Chrome=1"/>
|
<meta http-equiv="X-UA-Compatible" content="IE=9"/>
|
<link rel="stylesheet" href="css/reset.css">
|
<link rel="stylesheet" href="js/layui/css/layui.css">
|
<link rel="stylesheet" href="css/jquery.mCustomScrollbar.css">
|
<link rel="stylesheet" href="css/zTreeStyle/zTreeStyle.css" type="text/css"/>
|
<link rel="stylesheet" href="css/jedate.css">
|
<link rel="stylesheet" href="css/index.css">
|
<style>
|
.layui-edge{display: none;}
|
.layui-form-select .layui-input{padding-right:16px;}
|
.search-input .layui-input-inline{width:100%;}
|
.layui-input, .layui-select, .layui-textarea{border-width: 0px;}
|
.search-box .layui-form-select .layui-input{color:#1ad0ad;background: url(images/search.png) no-repeat right center;}
|
.search-box .layui-form-select input::-webkit-input-placeholder{color:#1ad0ad;}
|
.search-box .layui-form-select input::-moz-input-placeholder{color:#1ad0ad;}
|
.search-box .layui-form-select input::-ms-input-placeholder{color:#1ad0ad;}
|
.search-box .layui-form-select dl{background-color:rgba(255, 255, 255, .2); border-color:rgba(255, 255, 255, .2);}
|
.search-box .layui-form-select dl dd.layui-this{background-color: #17395f !important;}
|
.search-box .layui-form-select dl dd:hover{background-color:rgba(23, 57, 95, .7)}
|
.air-widget, .water-widget{width:320px; height:calc(67% - 20px); position: absolute; z-index: 1000;position: absolute; }
|
.layui-form-select dl{max-height: 200px;}
|
|
.actual-form{width:80px; height:26px; position:absolute; z-index: 1000; background: url(images/select-btn.png) no-repeat; background-size:100% 100%; right:10px; margin-top:10px;}
|
.actual-form .layui-form-select .layui-input{color:#1ad0ad;background: url(images/sel.png) no-repeat 60px center; text-align: center; height:26px; line-height: 26px;}
|
.actual-form .layui-input-block{margin-left:0px;}
|
.actual-form .layui-form-select input::-webkit-input-placeholder{color:#1ad0ad;}
|
.actual-form .layui-form-select input::-moz-input-placeholder{color:#1ad0ad;}
|
.actual-form .layui-form-select input::-ms-input-placeholder{color:#1ad0ad;}
|
.actual-form .layui-form-select dl{background-color:rgba(255, 255, 255, .2); border-color:rgba(255, 255, 255, .2); top:32px;}
|
.actual-form .layui-form-select dl dd, .actual-form .layui-form-select dl dt{line-height:26px; color:#1ad0ad;}
|
.actual-form .layui-form-select dl dd.layui-this{background-color: #17395f !important; color:#fff;}
|
.actual-form .layui-form-select dl dd:hover{background-color:rgba(23, 57, 95, .7)}
|
.actual-form .layui-form-select .layui-edge{border-top-color:#12ceae;}
|
#citySel{width:calc(100% - 10px); height:100%; color:#1ad0ad;background: transparent; border:0px; padding:0 5px;}
|
#menuContent{width:350px; max-height: 300px; background-color:rgba(17, 108, 154, .8); color:#fff; margin-top:5px;overflow-y: auto; position: absolute; left:0px; top:40px; display:none;}
|
.ztree, .ztree li a{color:#1ad0ad !important; }
|
#historyQueryEchart{clear: both;}
|
</style>
|
</head>
|
<body>
|
<div class="tes">
|
<div><img src="images/loading.gif">数据加载中...</div>
|
</div>
|
<div class="main-left">
|
<div class="main-box main-acreage">
|
<div class="main-title"><span>湿地生态状况</span></div>
|
<div class="quality" id="quality">
|
<b></b>
|
<p>生态状况</p>
|
</div>
|
<div class="histor-tip" style="font-size:16px;">不满足分析条件</div>
|
<div class="main-area-ratio-con" id="areaRatio"></div>
|
</div>
|
<div class="main-box main-area-ratio">
|
<div class="main-title"><span>指标状态</span></div>
|
<div class="main-survey-menu-spot">
|
<ul>
|
<li>
|
<b>指标</b>
|
<span><i id="zonCont"></i>个</span>
|
</li>
|
<li>
|
<b>正常</b>
|
<span><i id="zcCont"></i>个</span>
|
</li>
|
<li id="ycBtn">
|
<b>异常</b>
|
<span><i id="ycCont"></i>个</span>
|
</li>
|
</ul>
|
</div>
|
<div class="survey-tip">暂无数据</div>
|
<div class="main-survey-echart" id="mainSurveyEchart"></div>
|
<a class="survey-close" style="display:none">返回</a>
|
<div class="survey-list-top" style="display:none">
|
<ul>
|
<li><span>名称</span><span>值</span><span>阈值</span><span>类型</span><span>时间</span></li>
|
</ul>
|
</div>
|
<div class="survey-list-box" style="display:none"></div>
|
</div>
|
</div>
|
<div class="main-cen main-box">
|
<div class="search-box">
|
<input type="hidden" value="" id="searchScid"/>
|
<input type="hidden" value="" id="searchScName"/>
|
<input id="citySel" type="text" placeholder="" autocomplete="off" />
|
<div id="menuContent" class="menuContent">
|
<ul id="treeDemo" class="ztree"></ul>
|
</div>
|
</div>
|
<div id="map"></div>
|
<div class="history-query">
|
<div class="history-query-title">
|
<h3>水文与水环境历史数据</h3>
|
<a class="his-close"><img src="images/close-1.png" width="16" ></a>
|
<input type="hidden" id="historyType" />
|
</div>
|
<div class="history-query-control">
|
<div class="history-query-time">
|
<label>时间：</label>
|
<div class="time-input">
|
<input type="text" value="" id="historyStratTime" readonly="readonly"/>
|
<span>——</span>
|
<input type="text" value="" id="historyEndTime" readonly="readonly"/>
|
</div>
|
</div>
|
<div class="history-query-date">
|
<span data-txt="day" class="on">本日</span>
|
<span data-txt="week">本周</span>
|
<span data-txt="month">本月</span>
|
</div>
|
<div class="history-query-btn">
|
<button id="hisToryQueryBtn">搜索</button>
|
<button id="hisToryClearBtn">清空</button>
|
<button id="hisToryDownLoadBtn">下载</button>
|
</div>
|
</div>
|
<div class="histor-tip">暂无数据</div>
|
<div class="his-loding"><img src="images/lodin.gif" width="50"/></div>
|
<div class="history-query-echart" id="historyQueryEchart"></div>
|
</div>
|
<span class="parnoBtn" data-url=""></span>
|
<span class="videoBtn" data-url=""></span>
|
</div>
|
<div class="main-box main-right">
|
<div class="main-title"><span>实时数据</span></div>
|
<div class="actual-list" id="actualList">
|
<div class="soil-tip">暂无数据</div>
|
<div class="title title-sw"><span></span>水文与水环境</div>
|
<div class="water-list" id="waterList"></div>
|
<div class="title title-kq"><span></span>空气环境</div>
|
<div class="water-list" id="airList"></div>
|
<div class="title title-tr"><span></span>土壤</div>
|
<div class="water-list" id="soilList"></div>
|
<div class="title title-qx"><span></span>气象</div>
|
<div class="water-list" id="weatherList"></div>
|
</div>
|
<div class="actual-form">
|
<form class="layui-form" action="">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest" lay-filter="aihao" id="interestAihao">
|
<!--<option value="1" selected="">水文</option>
|
<option value="2">空气</option>
|
<option value="3">土壤</option>
|
<option value="4">气象</option>-->
|
</select>
|
</div>
|
</div>
|
</form>
|
</div>
|
<div id="leftposition" class="on"><img src="images/shensuo-on.png"></div>
|
<div id="rightposition"><img src="images/shensuo.png"></div>
|
<div class="actual-time">
|
<div id="actualTime"></div>
|
</div>
|
</div>
|
<div class="main-bottom">
|
<div class="monit-history">
|
<div class="monit-history-top">
|
<h5>水文与水环境历史数据</h5>
|
<span><i></i></span>
|
<a class="history-more" data-id="host1">更多></a>
|
</div>
|
<div class="soil-tip">暂无数据</div>
|
<div class="monit-history-box" id="waterHistory"></div>
|
</div>
|
<div class="monit-history">
|
<div class="monit-history-top">
|
<h5>空气环境历史数据</h5>
|
<span><i></i></span>
|
<a class="history-more" data-id="host2">更多></a>
|
</div>
|
<div class="soil-tip">暂无数据</div>
|
<div class="monit-history-box" id="airHistory"></div>
|
</div>
|
<div class="monit-history">
|
<div class="monit-history-top">
|
<h5>气象历史数据</h5>
|
<span><i></i></span>
|
<a class="history-more" data-id="host4">更多></a>
|
</div>
|
<div class="soil-tip">暂无数据</div>
|
<div class="monit-history-box" id="weatherHistory"></div>
|
</div>
|
<div class="monit-history">
|
<div class="monit-history-top">
|
<h5>土壤历史数据</h5>
|
<span><i></i></span>
|
<a class="history-more" data-id="host3">更多></a>
|
</div>
|
<div class="soil-tip">暂无数据</div>
|
<div class="monit-history-box" id="soilHistory"></div>
|
</div>
|
</div>
|
<div class="Explain-window"></div>
|
<div class="video-pup"></div>
|
</body>
|
<script type="text/javascript" src="js/jquery-3.2.1.js"></script>
|
<script src="http://api.map.baidu.com/api?v=2.0&ak=TaIo2F3hwGsBXvuYsNzQ8r5jYZYgcfGm"></script>
|
<script src="js/infobox.js"></script>
|
<script src="js/echarts.min.js"></script>
|
<script src="js/jquery.mCustomScrollbar.concat.min.js"></script>
|
<script src="js/jquery.bridget.js"></script>
|
<script src="js/jquery.mousewheel.min.js"></script>
|
<script src="js/jquery.event.drag.js"></script>
|
<script src="js/screenfull.js"></script>
|
<script src="js/hammer.min.js"></script>
|
<script src="js/PreventGhostClick.js"></script>
|
<script src="js/bmap.js"></script>
|
<script src="js/jquery.jedate.js"></script>
|
<script src="js/layui/layui.js"></script>
|
<script src="js/jquery.ztree.all.min.js"></script>
|
<script src="js/jquery.ztree.exhide.js"></script>
|
<script src="js/fuzzysearch.js"></script>
|
<script src="js/jquery.nicescroll.min.js"></script>
|
<script src="js/dataShow.js"></script>
|
<script src="js/monitoringPoint.js"></script>
|
</html>
|
