pn38qy6fk
/
watermonitor_GIt
1
0
Fork 0
Code Issues Pull Requests 1 Projects Releases Wiki Activity

提交

Browse Source
lihaoxiang_branch
李浩翔 2 years ago
parent b3026ac400
commit c9a4afc78d
10 changed files with 3177 additions and 0 deletions
Show Stats Download Patch File Download Diff File

BIN
model/水量水质监测系统“水位数据下载”用例的顺序图.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 10 KiB

BIN
model/水量水质监测系统“水质数据下载”用例的顺序图.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 11 KiB

BIN
model/水量水质监测系统第二次迭代“水位数据下载”用例设计顺序图.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

BIN
model/水量水质监测系统第二次迭代“水质数据下载”用例设计顺序图.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 31 KiB

BIN
model/水量水质监测系统精化用例模型.png
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 43 KiB

BIN
other/200340011 李浩翔 实践总结报告.docx
View File

Binary file not shown.

2057
src/src_qianduan/WEB-INF/viewMap.jsp
View File

File diff suppressed because it is too large Load Diff

112
src/src_qianduan/WEB-INF/waterLevelPage/addWaterLevelData.jsp
Unescape View File

@ -0,0 +1,112 @@
<%--
Created by Yingyong Lao.
User: laoyingyong
Date: 2019-12-12
Time: 16:18
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>添加水位数据</title>
<!-- 2. jQuery导入，建议使用1.9以上的版本 -->
<script src="../js/jquery-3.2.1.min.js"></script>
<!-- 1. 导入CSS的全局样式 -->
<link href="../css/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
<script src="../js/bootstrap.min.js"></script>
<script>
$(function () //入口函数
{
$("#waterLevelForm").submit(function ()
{
$.post("../AddWaterLevelDataServlet",$(this).serialize(),function (data)
{
alert(data.msg);
});
return false;//阻止页面跳转
});
});
function addWaterLevel()
{
$.post("../AddManyWaterLevelServlet",function (data)
{
alert(data.msg);
});
}
</script>
</head>
<body style="background:url('../img/img01.jpg') repeat-x">
<div class="container">
<div class="row">
<div class="col-sm-12">
<form id="waterLevelForm" action="AddWaterQualityDataServlet" method="post">
<table class="table table-bordered">
<caption style="text-align: center;font-size: 24px">添加水位监测数据</caption>
<tr class="success">
<th style="text-align: center">河流</th>
<th style="text-align: center">站名</th>
<th style="text-align: center">日期</th>
<th style="text-align: center">水位（m）</th>
<th style="text-align: center">流量</th>
<th style="text-align: center">超警戒/汛限水位</th>
</tr>
<tr class="info">
<td><input name="riverName" placeholder="海河"></td>
<td><input name="siteName" placeholder="站名"></td>
<td><input type="datetime-local" name="collectionDate"></td>
<td><input type="number" step="0.01" style="width: 80px" name="waterLevel"></td>
<td><input type="number" step="0.1" style="width: 80px" name="flow"></td>
<td><input type="number" step="0.01" style="width: 80px" name="over"></td>
</tr>
<tr class="info">
<td colspan="6" style="text-align: center"><input type="submit" value="添加" class="btn btn-info"></td>
</tr>
</table>
</form>
</div><%--单元格的结尾--%>
</div><%--row end--%>
<div class="row">
<div class="col-sm-4">
<button class="btn btn-info" onclick="addWaterLevel();"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>&nbsp;从水文局同步数据到数据库</button>
</div>
</div>
<div class="row" style="margin-top: 50px">
<div class="col-sm-5">
<form method="post" action="../UploadServlet2" enctype="multipart/form-data">
<table class="table table-bordered">
<caption style="text-align: center;font-size: 24px" >文件上传方式</caption>
<tr>
<td>
<input type="file" name="file" class="btn btn-info" >
</td>
<td>
<input type="submit" value="开始上传水位数据" class="btn btn-info">
</td>
</tr>
</table>
</form>
</div>
</div>
</div>
</body>
</html>

784
src/src_qianduan/WEB-INF/waterLevelPage/viewWaterLevelInfo.jsp
Unescape View File

@ -0,0 +1,784 @@
<%--
Created by Yingyong Lao.
User: laoyingyong
Date: 2019-12-12
Time: 18:49
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>查看水位信息</title>
<script src="../js/jquery-3.2.1.min.js"></script>
<!-- 1. 导入CSS的全局样式 -->
<link href="../css/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
<script src="../js/bootstrap.min.js"></script>
<script>
function dateFormat(fmt, date) //时间格式化
{
var ret;
var opt =
{
"y+": date.getFullYear().toString(), // 年
"M+": (date.getMonth() + 1).toString(), // 月
"d+": date.getDate().toString(), // 日
"H+": date.getHours().toString(), // 时
"m+": date.getMinutes().toString(), // 分
"s+": date.getSeconds().toString() // 秒
// 有其他格式化字符需求可以继续添加，必须转化成字符串
};
for (var k in opt)
{
ret = new RegExp("(" + k + ")").exec(fmt);
if (ret)
{
fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0")))
};
};
return fmt;
}
$(function () //入口函数
{
$.post("../FindAllByPageServlet",{currentPage:1,pageSize:5},function (data)//页面加载完成后初始化界面
{
var totalCount = data.totalCount;
var totalPage=data.totalPage;
var currentPage = data.currentPage;
var array = data.list;
//上一页的图标
if(currentPage==1)
{
var str='<li class="disabled" onclick="findByPage('+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
else
{
var str='<li onclick="findByPage('+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
var beginNum;//分页条第一个数字
var endNum;//分页条最后一个数字
if(totalPage<10)//如果总页数小于10页
{
beginNum=1;
endNum=totalPage;
}
else//如果总页数大于等于10页
{
beginNum=currentPage-5;
endNum=currentPage+4;
if(beginNum<1)//currentPage-5可能会是一个小于等于0的数，也就是用户在浏览1,2,3,4,5页时的情况
{
beginNum=1;//纠正回来
endNum=beginNum+9;
}
if(endNum>totalPage)//用户在浏览倒数1,2,3,4页时的情况
{
endNum=totalPage;//纠正回来，让分页条最后一个数字为总的页数
beginNum=endNum-9;
}
}
for(var i=beginNum;i<=endNum;i++)//中间分页栏的部分
{
if(i==currentPage)
{
var item=' <li class="active" onclick="findByPage('+i+',5);"><a href="#">'+i+'</a></li>';
}
else
{
var item=' <li onclick="findByPage('+i+',5);"><a href="#">'+i+'</a></li>';
}
str=str+item;
}
if(currentPage==totalPage)
{
var endStr='<li class="disabled" onclick="findByPage('+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页</span>';
}
else
{
var endStr='<li onclick="findByPage('+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页</span>';
}
str=str+endStr;
$("#fenyelan").html(str);//初始化分页栏
var tableStr='<caption style="text-align: center;font-size: 24px">水位信息一览表</caption>\n' +
' <tr class="success">\n' +
' <th style="text-align: center">id</th>\n' +
' <th style="text-align: center">河流</th>\n' +
' <th style="text-align: center">站名</th>\n' +
' <th style="text-align: center">水位（m）</th>\n' +
' <th style="text-align: center">超过警戒线（m）</th>\n' +
' <th style="text-align: center">流量</th>\n' +
' <th style="text-align: center">日期</th>\n' +
' <th style="text-align: center">操作</th>\n'+
' </tr>';
for(var i=0;i<array.length;i++)
{
var obj = array[i];
var id = obj.id;
var riverName = obj.riverName;
var siteName = obj.siteName;
var waterLevel = obj.waterLevel;
var over = obj.over;
var flow = obj.flow;
var collectionDate = obj.collectionDate;
var dateTime=dateFormat("yyyy-MM-dd HH:mm",new Date(collectionDate));
var tableItem=' <tr class="info">\n' +
' <td style="text-align: center">'+id+'</td>\n' +
' <td style="text-align: center">'+riverName+'</td>\n' +
' <td style="text-align: center">'+siteName+'</td>\n' +
' <td style="text-align: center">'+waterLevel+'</td>\n' +
' <td style="text-align: center">'+over+'</td>\n' +
' <td style="text-align: center">'+flow+'</td>\n' +
' <td style="text-align: center">'+dateTime+'</td>\n' +
'<td style="text-align: center"><input type="button" onclick="update('+id+',\''+riverName+'\',\''+siteName+'\',\''+waterLevel+'\',\''+over+'\',\''+flow+'\',\''+dateTime+'\');" value="修改" class="btn btn-info">&nbsp;&nbsp;&nbsp;&nbsp;<input onclick="dele('+id+');" type="button" value="删除" class="btn btn-info"></td>\n'+
' </tr>';
tableStr=tableStr+tableItem;
}
$("#waterLevelTable").html(tableStr);
});
});//入口函数end
function findByPage(cuentPage,paSize)//页面按钮被点击时的回调函数
{
$.post("../FindAllByPageServlet",{currentPage:cuentPage,pageSize:paSize},function (data)//页面加载完成后初始化界面
{
var totalCount = data.totalCount;
var totalPage=data.totalPage;
var currentPage = data.currentPage;
var array = data.list;
//上一页的图标
if(currentPage==1)
{
var str='<li class="disabled" onclick="findByPage('+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
else
{
var str='<li onclick="findByPage('+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
var beginNum;//分页条第一个数字
var endNum;//分页条最后一个数字
if(totalPage<10)//如果总页数小于10页
{
beginNum=1;
endNum=totalPage;
}
else//如果总页数大于等于10页
{
beginNum=currentPage-5;
endNum=currentPage+4;
if(beginNum<1)//currentPage-5可能会是一个小于等于0的数，也就是用户在浏览1,2,3,4,5页时的情况
{
beginNum=1;//纠正回来
endNum=beginNum+9;
}
if(endNum>totalPage)//用户在浏览倒数1,2,3,4页时的情况
{
endNum=totalPage;//纠正回来，让分页条最后一个数字为总的页数
beginNum=endNum-9;
}
}
for(var i=beginNum;i<=endNum;i++)
{
if(i==currentPage)
{
var item=' <li class="active" onclick="findByPage('+i+',5);"><a href="#">'+i+'</a></li>';
}
else
{
var item=' <li onclick="findByPage('+i+',5);"><a href="#">'+i+'</a></li>';
}
str=str+item;
}
if(currentPage==totalPage)
{
var endStr='<li class="disabled" onclick="findByPage('+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页</span>';
}
else
{
var endStr='<li onclick="findByPage('+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页</span>';
}
str=str+endStr;
$("#fenyelan").html(str);//初始化分页栏
var tableStr='<caption style="text-align: center;font-size: 24px">水位信息一览表</caption>\n' +
' <tr class="success">\n' +
' <th style="text-align: center">id</th>\n' +
' <th style="text-align: center">河流</th>\n' +
' <th style="text-align: center">站名</th>\n' +
' <th style="text-align: center">水位（m）</th>\n' +
' <th style="text-align: center">超过警戒线（m）</th>\n' +
' <th style="text-align: center">流量</th>\n' +
' <th style="text-align: center">日期</th>\n' +
' <th style="text-align: center">操作</th>\n'+
' </tr>';
for(var i=0;i<array.length;i++)
{
var obj = array[i];
var id = obj.id;
var riverName = obj.riverName;
var siteName=obj.siteName;
var waterLevel = obj.waterLevel;
var over = obj.over;
var flow = obj.flow;
var collectionDate = obj.collectionDate;
var dateTime=dateFormat("yyyy-MM-dd HH:mm",new Date(collectionDate));
var tableItem=' <tr class="info">\n' +
' <td style="text-align: center">'+id+'</td>\n' +
' <td style="text-align: center">'+riverName+'</td>\n' +
' <td style="text-align: center">'+siteName+'</td>\n' +
' <td style="text-align: center">'+waterLevel+'</td>\n' +
' <td style="text-align: center">'+over+'</td>\n' +
' <td style="text-align: center">'+flow+'</td>\n' +
' <td style="text-align: center">'+dateTime+'</td>\n' +
'<td style="text-align: center"><input type="button" onclick="update('+id+',\''+riverName+'\',\''+siteName+'\',\''+waterLevel+'\',\''+over+'\',\''+flow+'\',\''+dateTime+'\');" value="修改" class="btn btn-info">&nbsp;&nbsp;&nbsp;&nbsp;<input onclick="dele('+id+');" type="button" value="删除" class="btn btn-info"></td>\n'+
' </tr>';
tableStr=tableStr+tableItem;
}
$("#waterLevelTable").html(tableStr);
});
}//回调函数的结尾
//更新按钮的回调函数
function update(id,riverName,siteName,waterLevel,over,flow,collectionDate)
{
var str=' <form id="confirmUpdateForm">\n' +
' <table class="table table-bordered table-hover">\n' +
' <caption style="text-align: center;font-size: 24px">修改数据</caption>\n' +
' <tr class="success">\n' +
' <th style="text-align: center">id</th>\n' +
' <th style="text-align: center">河流</th>\n' +
' <th style="text-align: center">站名</th>\n' +
' <th style="text-align: center">水位（m）</th>\n' +
' <th style="text-align: center">超过警戒线（m）</th>\n' +
' <th style="text-align: center">流量</th>\n' +
' <th style="text-align: center">日期</th>\n' +
' <th style="text-align: center">操作</th>\n' +
' </tr>\n' +
' <tr class="info">\n' +
' <td style="text-align: center"><input id="id" name="id" style="width:120px" readonly value="'+id+'"></td>\n' +
' <td style="text-align: center"><input value="'+riverName+'" id="riverName2" style="width:120px"></td>\n' +
' <td style="text-align: center"><input value="'+siteName+'" id="siteName2" style="width:120px"></td>\n' +
' <td style="text-align: center"><input value="'+waterLevel+'" id="shuiwei" type="number" step="0.01" name="shuiwei" placeholder="21.43" style="width:120px" ></td>\n' +
' <td style="text-align: center"><input value="'+over+'" id="chaoguo" type="number" step="0.01" name="chaoguo" placeholder="0" style="width:120px"></td>\n' +
' <td style="text-align: center"><input value="'+flow+'" id="flow" type="number" step="0.1" name="zhuangtai" style="width:120px"></td>\n' +
' <td style="text-align: center"><input value="'+collectionDate+'" id="caijiriqi" name="caijiriqi" type="text"></td>\n' +
' <td style="text-align: center"><input type="button" onclick="updateInfo()" value="确认修改" class="btn btn-info"></td>\n' +
' </tr>\n' +
' </table>\n' +
' </form>';
$("#confirmUpdate_div").html(str);
} //更新按钮的回调函数end
function updateInfo()//确认修改按钮的回调函数
{
var id=$("#id").val();
var riverName=$("#riverName2").val();
var siteName=$("#siteName2").val();
var shuiwei=$("#shuiwei").val();
var chaoguo=$("#chaoguo").val();
var flow=$("#flow").val();
var caijiriqi=$("#caijiriqi").val();
$.get("../UpdateWaterLevelData",{id:id,riverName:riverName,siteName:siteName,shuiwei:shuiwei,chaoguo:chaoguo,flow:flow,caijiriqi:caijiriqi} ,function (data)
{
alert(data.msg);
window.location.href="viewWaterLevelInfo.jsp";
});
}
//删除按钮的回调函数
function dele(id)
{
var b = confirm("您确定要删除吗？");
if(b)
{
$.post("../DeleteInfoServlet",{id:id},function (data)
{
alert(data.msg);
window.location.href="viewWaterLevelInfo.jsp";
});
}
}
//条件查询按钮的回调函数
function searchByCondition()
{
var riverName=$("#riverName").val();
var siteName=$("#siteName").val();
var collectionDate=$("#collectionDate").val();
$.post("../ConditionQueryByPageServlet",{riverName:riverName,siteName:siteName,collectionDate:collectionDate,currentPage2:1,pageSize2:5},function (data)
{
//alert(data);
var totalCount = data.totalCount;
if(totalCount==0)
{
alert("数据库中没有记录！");
}
var totalPage = data.totalPage;
var currentPage = data.currentPage;
var array = data.list;
var tableStr=' <caption style="text-align: center;font-size: 24px">查询结果</caption>\n' +
' <tr class="success">\n' +
' <th style="text-align: center">id</th>\n' +
' <th style="text-align: center">河流</th>\n' +
' <th style="text-align: center">站名</th>\n' +
' <th style="text-align: center">水位（m）</th>\n' +
' <th style="text-align: center">超过警戒线（m）</th>\n' +
' <th style="text-align: center">流量</th>\n' +
' <th style="text-align: center">日期</th>\n' +
' <th style="text-align: center">操作</th>\n' +
' </tr>';
for(var i=0;i<array.length;i++)
{
var obj = array[i];
var id = obj.id;
var riverName2 = obj.riverName;
var siteName2=obj.siteName;
var waterLevel = obj.waterLevel;
var over = obj.over;
var flow= obj.flow;
var collectionDate2 = obj.collectionDate;
var dateStr=dateFormat("yyyy-MM-dd HH:mm",new Date(collectionDate2));
var item=' <tr class="info">\n' +
' <td style="text-align: center">'+id+'</td>\n' +
' <td style="text-align: center">'+riverName2+'</td>\n' +
' <td style="text-align: center">'+siteName2+'</td>\n' +
' <td style="text-align: center">'+waterLevel+'</td>\n' +
' <td style="text-align: center">'+over+'</td>\n' +
' <td style="text-align: center">'+flow+'</td>\n' +
' <td style="text-align: center">'+dateStr+'</td>\n' +
'<td style="text-align: center"><input type="button" onclick="update('+id+',\''+riverName2+'\',\''+siteName2+'\',\''+waterLevel+'\',\''+over+'\',\''+flow+'\',\''+dateStr+'\');" value="修改" class="btn btn-info">&nbsp;&nbsp;&nbsp;&nbsp;<input onclick="dele('+id+');" type="button" value="删除" class="btn btn-info"></td>\n'+
' </tr>';
tableStr+=item;
}
var endStr=' </table>';
tableStr+=endStr;
$("#waterLevelTable").html(tableStr);
if(currentPage==1)
{
var fenyelanStr=' <li class="disabled" onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
else
{
var fenyelanStr=' <li onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
var beginNum;//分页条第一个数字
var endNum;//分页条最后一个数字
if(totalPage<10)//如果总页数小于10页
{
beginNum=1;
endNum=totalPage;
}
else//如果总页数大于等于10页
{
beginNum=currentPage-5;
endNum=currentPage+4;
if(beginNum<1)//currentPage-5可能会是一个小于等于0的数，也就是用户在浏览1,2,3,4,5页时的情况
{
beginNum=1;//纠正回来
endNum=beginNum+9;
}
if(endNum>totalPage)//用户在浏览倒数1,2,3,4页时的情况
{
endNum=totalPage;//纠正回来，让分页条最后一个数字为总的页数
beginNum=endNum-9;
}
}
for(var i=beginNum;i<=endNum;i++)
{
if(i==currentPage)
{
var middleStr='<li class="active" onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+i+',5);"><a href="#">'+i+'</a></li>';
fenyelanStr+=middleStr;
}
else
{
var middleStr='<li onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+i+',5);"><a href="#">'+i+'</a></li>';
fenyelanStr+=middleStr;
}
}
if(currentPage==totalPage)
{
var lastStr='<li class="disabled" onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页&nbsp;&nbsp;' +
'<input type="button" class="btn btn-info btn-sm" value="返回一览表" onclick="fuwei();"></span>';
}
else
{
var lastStr='<li onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页&nbsp;&nbsp;' +
'<input type="button" class="btn btn-info btn-sm" value="返回一览表" onclick="fuwei();"></span>';
}
fenyelanStr+=lastStr;
$("#fenyelan").html(fenyelanStr);
});//异步请求end
}
function fuwei()
{
window.location.href='viewWaterLevelInfo.jsp';
}
function findByPage2(riverName,siteName,collectionDate,currentPage,pageSize)
{
$.post("../ConditionQueryByPageServlet",{riverName:riverName,siteName:siteName,collectionDate:collectionDate,currentPage2:currentPage,pageSize2:pageSize},function (data)
{
var totalCount = data.totalCount;
if(totalCount==0)
{
alert("数据库中没有记录！");
}
var totalPage = data.totalPage;
var currentPage = data.currentPage;
var array = data.list;
var tableStr=' <caption style="text-align: center;font-size: 24px">查询结果</caption>\n' +
' <tr class="success">\n' +
' <th style="text-align: center">id</th>\n' +
' <th style="text-align: center">河流</th>\n' +
' <th style="text-align: center">站名</th>\n' +
' <th style="text-align: center">水位（m）</th>\n' +
' <th style="text-align: center">超过警戒线（m）</th>\n' +
' <th style="text-align: center">流量</th>\n' +
' <th style="text-align: center">日期</th>\n' +
' <th style="text-align: center">操作</th>\n' +
' </tr>';
for(var i=0;i<array.length;i++)
{
var obj = array[i];
var id = obj.id;
var riverName2 = obj.riverName;
var siteName2=obj.siteName;
var waterLevel = obj.waterLevel;
var over = obj.over;
var flow= obj.flow;
var collectionDate2 = obj.collectionDate;
var dateStr=dateFormat("yyyy-MM-dd HH:mm",new Date(collectionDate2));
var item=' <tr class="info">\n' +
' <td style="text-align: center">'+id+'</td>\n' +
' <td style="text-align: center">'+riverName2+'</td>\n' +
' <td style="text-align: center">'+siteName2+'</td>\n' +
' <td style="text-align: center">'+waterLevel+'</td>\n' +
' <td style="text-align: center">'+over+'</td>\n' +
' <td style="text-align: center">'+flow+'</td>\n' +
' <td style="text-align: center">'+dateStr+'</td>\n' +
'<td style="text-align: center"><input type="button" onclick="update('+id+',\''+riverName2+'\',\''+siteName2+'\',\''+waterLevel+'\',\''+over+'\',\''+flow+'\',\''+dateStr+'\');" value="修改" class="btn btn-info">&nbsp;&nbsp;&nbsp;&nbsp;<input onclick="dele('+id+');" type="button" value="删除" class="btn btn-info"></td>\n'+
' </tr>';
tableStr+=item;
}
var endStr=' </table>';
tableStr+=endStr;
$("#waterLevelTable").html(tableStr);
if(currentPage==1)
{
var fenyelanStr=' <li class="disabled" onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
else
{
var fenyelanStr=' <li onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage-1)+',5);">\n' +
' <a href="#" aria-label="Previous">\n' +
' <span aria-hidden="true">&laquo;</span>\n' +
' </a>\n' +
' </li>';
}
var beginNum;//分页条第一个数字
var endNum;//分页条最后一个数字
if(totalPage<10)//如果总页数小于10页
{
beginNum=1;
endNum=totalPage;
}
else//如果总页数大于等于10页
{
beginNum=currentPage-5;
endNum=currentPage+4;
if(beginNum<1)//currentPage-5可能会是一个小于等于0的数，也就是用户在浏览1,2,3,4,5页时的情况
{
beginNum=1;//纠正回来
endNum=beginNum+9;
}
if(endNum>totalPage)//用户在浏览倒数1,2,3,4页时的情况
{
endNum=totalPage;//纠正回来，让分页条最后一个数字为总的页数
beginNum=endNum-9;
}
}
for(var i=beginNum;i<=endNum;i++)
{
if(i==currentPage)
{
var middleStr='<li class="active" onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+i+',5);"><a href="#">'+i+'</a></li>';
fenyelanStr+=middleStr;
}
else
{
var middleStr='<li onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+i+',5);"><a href="#">'+i+'</a></li>';
fenyelanStr+=middleStr;
}
}
if(currentPage==totalPage)
{
var lastStr='<li class="disabled" onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页&nbsp;&nbsp;' +
'<input type="button" class="btn btn-info btn-sm" value="返回一览表" onclick="fuwei();"></span>';
}
else
{
var lastStr='<li onclick="findByPage2(\''+riverName+'\',\''+siteName+'\',\''+collectionDate+'\','+(currentPage+1)+',5);">\n' +
' <a href="#" aria-label="Next">\n' +
' <span aria-hidden="true">&raquo;</span>\n' +
' </a>\n' +
' </li>\n' +
' <span style="font-size: 24px" id="total_sp">共'+totalCount+'条记录，共'+totalPage+'页&nbsp;&nbsp;' +
'<input type="button" class="btn btn-info btn-sm" value="返回一览表" onclick="fuwei();"></span>';
}
fenyelanStr+=lastStr;
$("#fenyelan").html(fenyelanStr);
});
}
</script>
</head>
<body style="background: url('../img/img01.jpg') repeat-x">
<div class="container">
<div class="row">
<div class="col-sm-8" style="margin-top: 20px">
<form class="form-inline">
<div class="form-group">
<label class="sr-only" for="riverName">Email address</label>
<input type="text" class="form-control" id="riverName" name="name2" placeholder="河流、湖泊">
</div>
<div class="form-group">
<label class="sr-only" for="siteName">Password</label>
<input type="text" class="form-control" id="siteName" name="status2" placeholder="站名">
</div>
<div class="form-group">
<label class="sr-only" for="collectionDate">Password</label>
<input type="text" class="form-control" id="collectionDate" name="status2" placeholder="时间">
</div>
<button type="button" onclick="searchByCondition();" class="btn btn-warning">搜索</button>
</form>
</div>
</div><%--row end--%>
<div class="row">
<div class="col-sm-10" id="waterLevelTableDiv">
<table class="table table-bordered table-hover" id="waterLevelTable">
<caption style="text-align: center;font-size: 24px">水位信息一览表</caption>
<tr class="success">
<th style="text-align: center">id</th>
<th style="text-align: center">地点名称</th>
<th style="text-align: center">水位（m）</th>
<th style="text-align: center">超过警戒线（m）</th>
<th style="text-align: center">状态</th>
<th style="text-align: center">采集日期</th>
<th style="text-align: center">操作</th>
</tr>
<tr class="info">
<td style="text-align: center">id</td>
<td style="text-align: center">地点名称</td>
<td style="text-align: center">水位（m）</td>
<td style="text-align: center">超过警戒线（m）</td>
<td style="text-align: center">状态（OK/NO）</td>
<td style="text-align: center">采集日期</td>
<td style="text-align: center"><input type="button" onclick="update(1);" value="修改" class="btn btn-info">&nbsp;&nbsp;&nbsp;&nbsp;<input onclick="dele(1);" type="button" value="删除" class="btn btn-info"></td>
</tr>
</table>
<nav aria-label="Page navigation">
<ul class="pagination" id="fenyelan">
<li>
<a href="#" aria-label="Previous">
<span aria-hidden="true">&laquo;</span>
</a>
</li>
<li><a href="#">1</a></li>
<li>
<a href="#" aria-label="Next">
<span aria-hidden="true">&raquo;</span>
</a>
</li>
<span style="font-size: 24px" id="total_sp">共2条记录，共1页</span>
</ul>
</nav>
</div>
</div>
<div class="row">
<hr style="background-color: silver;border: none;height: 2px">
</div>
<div class="row">
<div class="col-sm-10" id="confirmUpdate_div">
</div>
</div>
</div>
</body>
</html>

224
src/src_qianduan/WEB-INF/waterQualityPage/addWaterQualityData.jsp
Unescape View File

@ -0,0 +1,224 @@
<%--
Created by Yingyong Lao.
User: laoyingyong
Date: 2019-12-11
Time: 18:43
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title>添加水质质量数据</title>
<script src="../js/jquery-ui.js"></script>
<!-- 2. jQuery导入，建议使用1.9以上的版本 -->
<script src="../js/jquery-3.2.1.min.js"></script>
<!-- 1. 导入CSS的全局样式 -->
<link href="../css/bootstrap-3.3.7-dist/css/bootstrap.min.css" rel="stylesheet">
<link rel="stylesheet" href="../css/jquery-ui.min.css">
<script src="../js/bootstrap.min.js"></script>
<script>
$(function ()
{
$.post("../FindAlllStationServlet",function (data)
{
for (var i = 0; i <data.length ; i++)
{
var obj=data[i];
var stationName=obj.stationName;
var optionStr='<option value="'+stationName+'">'+stationName+'</option>';
$("#belongStation").append(optionStr);
}
});
$("#stationForm").submit(function ()
{
$.get("../AddWaterQualityDataServlet",$("#stationForm").serialize(),function (data)//serialize()千万别少写了括号哦
{
var msg=data.msg;
var str='<div class="alert alert-warning alert-dismissible" role="alert">\n' +
' <button type="button" class="close" data-dismiss="alert" aria-label="Close"><span aria-hidden="true">&times;</span></button>\n' +
' <strong>提示：</strong>'+msg+'\n' +
'</div>';
$("#msg_div").html(str);
});
return false;//阻止页面跳转
});
});
function addSomeWaterQuality()
{
$.post("../AddWaterQualityServlet",function (data)
{
var msg=data.msg;
alert(msg);
});
}
function getStation()
{
var belongStation = $("#belongStation").val();
return belongStation;
}
function addOneWaterQuality()
{
var belongStation = getStation();
var waterQuality=getQualityLevel();
var date = $("#date").val();
var ph = $("#ph").val();
var oxygen = $("#oxygen").val();
var nitrogen=$("#nitrogen").val();
var permangan = $("#permangan").val();
var orgacarbon=$("#orgacarbon").val();
$.post("../AddOneWaterQualityServlet",{belongStation:belongStation,date:date,ph:ph,oxygen:oxygen,nitrogen:nitrogen,permangan:permangan,orgacarbon:orgacarbon,waterQuality:waterQuality},function (data)
{
alert(data.msg);
});
}
function getQualityLevel()
{
var a = $("#qualitySelect").val();
return a;
}
</script>
</head>
<body style="background: url('../img/img01.jpg') repeat-x;">
<div class="container">
<div class="row">
<div class="col-sm-8">
<form id="stationForm" action="AddWaterQualityDataServlet" method="post">
<table class="table table-bordered">
<caption style="text-align: center;font-size: 24px">添加水质监测站</caption>
<tr class="success">
<th style="text-align: center">监测站名称</th>
<th style="text-align: center">经度</th>
<th style="text-align: center">纬度</th>
<th style="text-align: center">所属断面</th>
<th style="text-align: center">简介</th>
</tr>
<tr class="info">
<td><input name="stationName" placeholder="安徽宿州杨庄"></td>
<td><input name="longitude" placeholder="经度"></td>
<td><input name="latitude" placeholder="纬度"></td>
<td><input name="section" placeholder="苏-皖省界"></td>
<td><textarea rows="5" cols="20" name="introduction" placeholder="安徽宿州杨庄水质自动监测站位于宿州市杨庄乡伊桥村。点位坐标北纬34度03分43秒，东经117度13分12秒。属淮河流域，奎河（苏-皖省界）。由安徽省宿州环境监测站管理。距水站77公里。建于2006年12月。"></textarea></td>
</tr>
<tr class="info">
<td colspan="2" style="text-align: center"><input id="addStation_Btn" type="submit" value="添加" class="btn btn-info"></td>
<td colspan="3"> <div id="msg_div"></div></td>
</tr>
</table>
</form>
</div><%--单元格的结尾--%>
</div><%--row end--%>
<div class="row" style="padding-top: 50px"><%--第二行--%>
<div class="col-md-12">
<table class="table table-bordered table-responsive table-condensed">
<caption style="text-align: center;font-size: 24px">手动添加水质监测数据</caption>
<tr class="success">
<th style="text-align: center">所属测站名</th>
<th style="text-align: center">PH</th>
<th style="text-align: center">溶解氧</th>
<th style="text-align: center">氨氮</th>
<th style="text-align: center">高猛酸钾指数</th>
<th style="text-align: center">总有机碳</th>
<th style="text-align: center">水质类别</th>
<th style="text-align: center">测量时间</th>
</tr>
<tr class="info">
<td>
<select id="belongStation" onchange="getStation();">
<option>--请选择--</option>
</select>
</td>
<td><input type="number" step="0.01" style="width: 120px" id="ph" name="ph" placeholder="8.02"></td>
<td><input type="number" step="0.01" style="width: 110px" id="oxygen" name="oxygen" placeholder="11.33"></td>
<td><input type="number" step="0.01" style="width: 120px" name="nitrogen" id="nitrogen" placeholder="1.39"></td>
<td><input type="number" step="0.01" style="width: 120px" name="permangan" id="permangan" placeholder="3.5"></td>
<td><input type="number" step="0.01" style="width: 120px" name="orgacarbon" id="orgacarbon" placeholder="0.8"></td>
<td>
<select id="qualitySelect" onchange="getQualityLevel();">
<option>--请选择--</option>
<option value="I">Ⅰ</option>
<option value="II">Ⅱ</option>
<option value="III">Ⅲ</option>
<option value="IV">Ⅳ</option>
<option value="V">Ⅴ</option>
<option value="劣V">劣Ⅴ</option>
</select>
</td>
<td><input type="datetime-local" style="width: 180px" name="date" id="date" placeholder="2019-12-11 12:00"></td>
</tr>
<tr class="info">
<td colspan="4" style="text-align: center"><input onclick="addOneWaterQuality();" type="button" value="添加" class="btn btn-info"></td>
<td colspan="5"></td>
</tr>
</table>
</div><%--单元格的结尾--%>
</div><%--第二行end--%>
<div class="row" style="padding-top:50px">
<div class="col-sm-3 ">
<table class="table table-bordered">
<caption style="text-align: center;font-size: 24px">一键添加多条水质数据</caption>
<tr>
<td><button onclick="addSomeWaterQuality();" class="btn btn-info"><span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>&nbsp;从“中国环境监测总站”同步数据到数据库</button></td>
</tr>
</table>
</div>
<div class="col-sm-5 col-sm-offset-3">
<form method="post" enctype="multipart/form-data" action="../UploadServlet">
<table class="table table-bordered">
<caption style="text-align: center;font-size: 24px">文件上传方式</caption>
<tr>
<td>
<input type="file" class="btn-info btn" name="file">
</td>
<td>
<input type="submit" value="开始上传水质数据" class="btn btn-info" style="float: left">
</td>
</tr>
</table>
</form>
</div>
</div>
</div><%--container容器end--%>
</body>
</html>
Write Preview
Loading…
Cancel
Save