<!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>
|
.air-widget, .water-widget{width:320px; height:calc(67% - 20px); position: absolute; z-index: 1000;position: absolute; }
|
.main-acreage{height:calc(50% - 13px);}
|
.main-area-ratio{height:calc(50% - 13px); margin-top:25px;}
|
.main-right{border:0px;}
|
.main-survey-echart{height:calc(100% - 20px); margin-top:15px;}
|
.layui-form-switch{min-width: 38px; height:18px; background-color:#7c7c7c;}
|
.layui-form-switch i{background-color:#fff; height:12px; width:12px; top:2px;}
|
.switch-shj{color:#56cedf;}
|
.switch-kq{color:#1bd0ad;}
|
.switch-tr{color:#fca501;}
|
.switch-qx{color:#df5f13;}
|
.switch-shj .layui-form-onswitch{border-color: #56cedf; background-color: #56cedf;}
|
.switch-kq .layui-form-onswitch{border-color: #1bd0ad; background-color: #1bd0ad;}
|
.switch-tr .layui-form-onswitch{border-color: #fca501; background-color: #fca501;}
|
.switch-qx .layui-form-onswitch{border-color: #df5f13; background-color: #df5f13;}
|
.layui-form-select dl{max-height: 200px;}
|
|
.layui-form-select .layui-input{padding-right:20px;}
|
.layui-form-select .layui-edge{right:5px;}
|
.layui-input, .layui-select, .layui-textarea{border-width: 0px;}
|
.actual-form{width:75px; height:24px; 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: transparent; text-align: center; line-height:24px; height:24px; font-size: 12px; padding-left:7px;}
|
.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(35, 69, 104, .9); border-color:rgba(35, 69, 104, .9); }
|
.actual-form .layui-form-select dl dd, .actual-form .layui-form-select dl dt{line-height:24px; color:#1ad0ad;}
|
.actual-form .layui-form-select dl dd.layui-this{background-color: #36635a !important; color:#fff;}
|
.actual-form .layui-form-select dl dd:hover{background-color:#36635a}
|
.actual-form .layui-form-select .layui-edge{border-top-color:#12ceae;}
|
.actual-form-jc{width:100px; height:30px;}
|
.actual-form-jc .layui-form-select .layui-input{line-height:30px; height:30px;}
|
|
|
.water-form{background: url(images/select-btn-blue.png) no-repeat; background-size:100% 100%;}
|
.water-form .layui-form-select .layui-input{color:#3fdced;}
|
.water-form .layui-form-select input::-webkit-input-placeholder{color:#3fdced;}
|
.water-form .layui-form-select input::-moz-input-placeholder{color:#3fdced;}
|
.water-form .layui-form-select input::-ms-input-placeholder{color:#3fdced;}
|
.water-form .layui-form-select .layui-edge{border-top-color:#3fdced;}
|
.water-form .layui-form-select dl dd, .water-form .layui-form-select dl dt{color:#3fdced;}
|
|
.soil-form{background: url(images/select-btn-yellow.png) no-repeat; background-size:100% 100%;}
|
.soil-form .layui-form-select .layui-input{color:#f2a109;}
|
.soil-form .layui-form-select input::-webkit-input-placeholder{color:#f2a109;}
|
.soil-form .layui-form-select input::-moz-input-placeholder{color:#f2a109;}
|
.soil-form .layui-form-select input::-ms-input-placeholder{color:#f2a109;}
|
.soil-form .layui-form-select .layui-edge{border-top-color:#f2a109;}
|
.soil-form .layui-form-select dl dd, .soil-form .layui-form-select dl dt{color:#f2a109;}
|
|
.weather-form{background: url(images/select-btn-red.png) no-repeat; background-size:100% 100%;}
|
.weather-form .layui-form-select .layui-input{color:#e46860;}
|
.weather-form .layui-form-select input::-webkit-input-placeholder{color:#e46860;}
|
.weather-form .layui-form-select input::-moz-input-placeholder{color:#e46860;}
|
.weather-form .layui-form-select input::-ms-input-placeholder{color:#e46860;}
|
.weather-form .layui-form-select .layui-edge{border-top-color:#e46860;}
|
.weather-form .layui-form-select dl dd, .weather-form .layui-form-select dl dt{color:#e46860;}
|
|
.cla-inp-box{width:20%; height:30px; float:left;}
|
.cla-inp-box label{width:70px; text-align: center; padding:8px 0;}
|
.cla-inp-box .actual-form{width:calc(100% - 70px); max-width: 120px; height:30px; position: static; margin-top:0px;}
|
.cla-inp-box .layui-form-select .layui-input{height:30px; line-height: 30px; }
|
.history-query-time{width:40%; height:100%; float:left;line-height: 26px; }
|
.history-query-date{float:right;}
|
#historyQueryEchart{height:calc(100% - 130px); margin-top: 10px; clear: both;}
|
#historyQueryEchartJc{height:calc(100% - 90px); margin-top: 10px; clear: both;}
|
@media (max-width: 1650px){
|
.cla-inp-box label{width:60px;}
|
.cla-inp-box .actual-form{width:calc(100% - 60px);}
|
}
|
@media (max-width: 1550px){
|
.cla-inp-box label{width:50px;}
|
.cla-inp-box .actual-form{width:calc(100% - 50px);}
|
}
|
</style>
|
</head>
|
<body>
|
<div class="tes">
|
<div><img src="images/loading.gif">数据加载中...</div>
|
</div>
|
<div class="main-left">
|
<div class="main-box main-acreage">
|
<a class="acreage-more" data-id="T_DATA_WATER" data-html="水文与环境监测">更多></a>
|
<div class="main-title"><span>水文与环境监测</span></div>
|
<div class="histor-tip-void histor-tip-void1" style="z-index: 1;">暂无数据</div>
|
<div class="main-area-ratio-con" id="areaRatio"></div>
|
</div>
|
<div class="main-box main-area-ratio">
|
<a class="acreage-more" data-id="T_DATA_AIR" data-html="空气环境监测">更多></a>
|
<div class="main-title"><span>空气环境监测</span></div>
|
<div class="histor-tip-void histor-tip-void2" style="z-index: 1;">暂无数据</div>
|
<div class="main-survey-echart" id="waterRatio"></div>
|
</div>
|
</div>
|
<div class="main-cen main-box">
|
<div id="map"></div>
|
<div class="switch-con">
|
<form class="layui-form" action="" lay-filter="example">
|
<div class="layui-form-item" pane="">
|
<div class="switch-box switch-shj"><label>水环境</label>
|
<input type="checkbox" checked="" id="switchWater" name="open" lay-skin="switch" lay-filter="switchWater" lay-text="">
|
</div>
|
<div class="switch-box switch-kq"><label>空气</label>
|
<input type="checkbox" name="close" id="switchAir" lay-skin="switch" lay-filter="switchAir" lay-text="">
|
</div>
|
<div class="switch-box switch-tr"><label>土壤</label>
|
<input type="checkbox" name="close" id="switchSoil" lay-skin="switch" lay-filter="switchSoil" lay-text="">
|
</div>
|
<div class="switch-box switch-qx"><label>气象</label>
|
<input type="checkbox" name="close" id="switchWeater" lay-skin="switch" lay-filter="switchWeater" lay-text="">
|
</div>
|
</div>
|
</form>
|
</div>
|
<div class="history-query-box">
|
<input type="hidden" id="stationInputTitle"/>
|
<div class="history-query-title">
|
<h3>水文与水环境历史数据</h3>
|
<a class="acreage-close"><img src="images/close-1.png" width="16" ></a>
|
</div>
|
<div class="history-query-control his-query-control">
|
<!--<form class="layui-form" action="">
|
<label>行政区：</label>
|
<div class="actual-form actual-form-jc" style="position: static; margin-left:10px; margin-top:0px;">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest8" lay-search="" lay-filter="querySelect5" id="querySelects5"></select>
|
</div>
|
</div>
|
</div>
|
<label>监测点：</label>
|
<input type="hidden" id="stationInputJc"/>
|
<div class="actual-form actual-form-jc" style="position: static; margin-left:10px; margin-top:0px;">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest9" lay-search="" lay-filter="querySelect4" id="querySelects4"></select>
|
</div>
|
</div>
|
</div>
|
</form>-->
|
<!--<div class="history-query-btn jc--query-btn">
|
<!--<button id="hisToryQueryBtnJc">搜索</button>
|
<button id="hisToryClearBtnJc">清空</button>-->
|
<!--<button id="hisToryDownLoadBtnJc">下载</button>-->
|
<!--</div>-->
|
<button id="hisToryDownLoadBtnJc">下载</button>
|
</div>
|
<div class="histor-tip" style="z-index: 1;">暂无数据</div>
|
<div class="his-loding"><img src="images/lodin.gif" width="50"/></div>
|
<div class="history-query-echart" id="historyQueryEchartJc"></div>
|
</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>
|
</div>
|
<div class="history-query-control">
|
<form class="layui-form" action="">
|
<div class="cla-inp-box">
|
<label>行政区：</label>
|
<div class="actual-form">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest6" lay-search="" lay-filter="querySelect1" id="querySelects1"></select>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="cla-inp-box">
|
<label>监测点：</label>
|
<input type="hidden" id="stationInput"/>
|
<div class="actual-form">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest7" lay-search="" lay-filter="querySelect2" id="querySelects2"></select>
|
</div>
|
</div>
|
</div>
|
</div>
|
<div class="cla-inp-box">
|
<label>要素：</label>
|
<input type="hidden" id="actualInput"/>
|
<div class="actual-form">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest5" lay-filter="querySelect3" id="querySelects3"></select>
|
</div>
|
</div>
|
</div>
|
</div>
|
</form>
|
<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-btn" style="float:right; margin-right:5px; margin-top:10px;">
|
<button id="hisToryQueryBtn">搜索</button>
|
<button id="hisToryClearBtn">清空</button>
|
<button id="hisToryDownLoadBtn">下载</button>
|
</div>
|
<div class="history-query-date" style="margin-top:10px;">
|
<span data-txt="day" class="on">本日</span>
|
<span data-txt="week">本周</span>
|
<span data-txt="month">本月</span>
|
</div>
|
</div>
|
<div class="histor-tip" style="z-index: 1;">暂无数据</div>
|
<div class="his-loding"><img src="images/lodin.gif" width="50"/></div>
|
<div class="history-query-echart" id="historyQueryEchart"></div>
|
</div>
|
</div>
|
<div class="main-box main-right">
|
<div class="main-box main-acreage">
|
<a class="acreage-more" data-id="T_DATA_WEATHER" data-html="气象监测">更多></a>
|
<div class="main-title"><span>气象监测</span></div>
|
<div class="histor-tip-void histor-tip-void4" style="z-index: 1;">暂无数据</div>
|
<div class="main-survey-echart" id="airRatio"></div>
|
</div>
|
<div class="main-box main-area-ratio">
|
<a class="acreage-more" data-id="T_DATA_SOIL" data-html="土壤监测">更多></a>
|
<div class="main-title"><span>土壤监测</span></div>
|
<div class="histor-tip-void histor-tip-void3" style="z-index: 1;">暂无数据</div>
|
<div class="main-area-ratio-con" id="soilRatio"></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" data-html="水文与水环境历史数据">更多></a>
|
</div>
|
<!--<select class="monit-select" id="waterSelect"></select>-->
|
<div class="actual-form water-form">
|
<form class="layui-form" action="">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest1" lay-filter="wateraihao" id="waterSelect"></select>
|
</div>
|
</div>
|
</form>
|
</div>
|
<div class="monit-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" data-html="空气环境历史数据">更多></a>
|
</div>
|
<div class="actual-form air-form">
|
<form class="layui-form" action="">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest2" lay-filter="airaihao" id="airSelect"></select>
|
</div>
|
</div>
|
</form>
|
</div>
|
<div class="monit-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" data-html="气象历史数据">更多></a>
|
</div>
|
<div class="actual-form weather-form">
|
<form class="layui-form" action="">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest4" lay-filter="weatheraihao" id="weatherSelect"></select>
|
</div>
|
</div>
|
</form>
|
</div>
|
<div class="monit-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" data-html="土壤历史数据">更多></a>
|
</div>
|
<div class="actual-form soil-form">
|
<form class="layui-form" action="">
|
<div class="layui-form-item">
|
<div class="layui-input-block">
|
<select name="interest3" lay-filter="soilaihao" id="soilSelect"></select>
|
</div>
|
</div>
|
</form>
|
</div>
|
<div class="monit-tip">暂无数据</div>
|
<div class="monit-history-box" id="soilHistory"></div>
|
</div>
|
|
</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.nicescroll.min.js"></script>
|
<script src="js/dataShow.js"></script>
|
<script src="js/map.js"></script>
|
<script src="js/classification.js"></script>
|
</html>
|
