<!DOCTYPE html>
|
<html>
|
<head>
|
<meta charset="utf-8" />
|
<title>降雨</title>
|
<link rel="stylesheet" href="./css/style.css">
|
</head>
|
<body>
|
<div class="river-course">
|
<div class="river-top">
|
<div class="rain-menu">
|
<ul>
|
<li class="on" id="rainBtnOne">时段雨量</li>
|
<li id="rainBtnTwo">逐日雨量</li>
|
<li id="rainBtnThr">特征雨量</li>
|
<li id="rainBtnFou">基础信息</li>
|
</ul>
|
</div>
|
</div>
|
<div class="rain-box">
|
<!-- 时段雨量 -->
|
<div class="river-one river-con">
|
<div class="river-box-top">
|
<div class="river-data">
|
<input type="text" class="datainp time-icon" id="timestart" placeholder="开始日期"><span>至</span>
|
<input type="text" class="datainp time-icon" id="timeend" placeholder="结束日期">
|
</div>
|
|
<div class="selectsd">
|
<div class="input_insd">
|
<input type="text" value="时段" readonly="readonly"/>
|
</div>
|
<div class="city hide" id="RainSd">
|
<ul>
|
<li data="1">1</li>
|
<li data="2">2</li>
|
<li data="3">3</li>
|
<li data="6">6</li>
|
</ul>
|
</div>
|
</div>
|
|
<input type="button" value="查询" class="river-btn" id="riverBtn"/>
|
<div class="select">
|
<div class="input_in">
|
<input type="text" value="快速查询" readonly="readonly"/>
|
</div>
|
<div class="city hide" id="RainSel">
|
<ul>
|
<li data="2">最近2小时</li>
|
<li data="12">最近12小时</li>
|
<li data="24">最近24小时</li>
|
<li data="36">最近36小时</li>
|
<li data="72">最近72小时</li>
|
</ul>
|
</div>
|
</div>
|
</div>
|
<div class="rain-pei" id="rainPei"></div>
|
<div class="rain-tab">
|
<table class="table-thead rain-thead">
|
<thead>
|
<tr>
|
<th><div>序号</div></th>
|
<th><div>时间</div></th>
|
<th><div>雨量(mm)</div></th>
|
<th><div></div></th>
|
</tr>
|
</thead>
|
</table>
|
<div class="comTbody">
|
<table class="table-tbody rain-tbody" style="border-top: 0;">
|
<tbody id="rainTable">
|
</tbody>
|
</table>
|
</div>
|
</div>
|
</div>
|
<!-- 逐日雨量 -->
|
<div class="river-two none river-con">
|
<div class="river-box-top">
|
<div class="river-data">
|
<input class="datainp time-icon" id="inpstart_zr" type="text" placeholder="开始日期" value="" readonly ><span>至</span><input class="datainp time-icon" id="inpend_zr" type="text" placeholder="结束日期" readonly>
|
</div>
|
<input type="button" value="查询" class="river-btn" id="dailyRainBtn"/>
|
<div class="select">
|
<div class="input_in">
|
<input type="text" value="快速查询" readonly="readonly"/>
|
</div>
|
<div class="city hide" id="dailyRiverSel">
|
<ul>
|
<li data="3">近3天</li>
|
<li data="7">近7天</li>
|
<li data="15">近15天</li>
|
</ul>
|
</div>
|
</div>
|
</div>
|
<div class="rain-pei" id="dailyPei"></div>
|
<div class="rain-tab">
|
<table class="table-thead rain-thead">
|
<thead>
|
<tr>
|
<th><div>序号</div></th>
|
<th><div>时间</div></th>
|
<th><div>雨量(mm)</div></th>
|
<th><div></div></th>
|
</tr>
|
</thead>
|
</table>
|
<div class="comTbody">
|
<table class="table-tbody rain-tbody" style="border-top: 0;">
|
<tbody id="dailyRainTable">
|
</tbody>
|
</table>
|
</div>
|
</div>
|
</div>
|
<!-- 特征雨量 -->
|
<div class="river-thr none river-con">
|
<table class="table-thead rain-thead-box">
|
<thead>
|
<tr>
|
<th><div>序号</div></th>
|
<th><div>年份/时间</div></th>
|
<th><div>1小时</div></th>
|
<th><div>2小时</div></th>
|
<th><div>3小时</div></th>
|
<th><div>6小时</div></th>
|
<th><div>12小时</div></th>
|
<th><div>24小时</div></th>
|
<th><div>48小时</div></th>
|
<th><div>72小时</div></th>
|
<th><div></div></th>
|
</tr>
|
</thead>
|
</table>
|
<div class="comTbody">
|
<table class="table-tbody rain-tbody-box" style="border-top: 0;">
|
<tbody id="rainTbodyBox">
|
|
</tbody>
|
</table>
|
</div>
|
</div>
|
<!-- 基础信息 -->
|
<div class="river-fou river-con none">
|
<div class="river-fou-box">
|
<ul id="rainInfo">
|
</ul>
|
|
</div>
|
</div>
|
<div class="load-box-list">
|
<div class="rote-load">
|
<img src="./img/rote.jpg" alt="">
|
<span>正在加载</span>
|
</div>
|
</div>
|
</div>
|
</div>
|
<script src="../../../libs/jquery/jquery-3.3.1.min.js"></script>
|
<script src="../../../libs/echarts/v4/echarts.min.js"></script>
|
<script src="../../../libs/laydate/laydate.js"></script>
|
<script src="./js/rain.js"></script>
|
<script src="./js/start.js"></script>
|
<script src="./js/end.js"></script>
|
</body>
|
</html>
|
