1.添加站间互售入口
对应的html代码
<button onclick="otherStation()">站间互售</button>
对应的js发送函数
function otherStation(){
//进入进入站间互售页面列表
window.location.href="/otherTicket/index";
}
对应的控制层代码:
/**
* 站间互售页面
* @return
*/
@RequestMapping("/index")
public String listPage() {
return "/WEB-INF/views/listOther.jsp";
}
2.站间互售列表页面listOther.jsp代码
站间互售的页面与本站的页面完全一样,其实站间互售的本质与本站售票的逻辑几乎完全一样,唯一的不同是数据来源不同
<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<html>
<head>
<title>车票列表</title>
<%--引入jquery--%>
<script type="text/javascript" src="/static/jquery-2.1.3.min.js"></script>
<script type="text/javascript" src="/static/My97DatePicker/WdatePicker.js"></script>
</head>
<body>
<br/>
<button onclick="loginout()">注销</button>
<button onclick="orderDetail()">订单明细</button>
<br/>
<br/>
<div align="center">
开始车站:<input id="startStation" type="text" value="" /> 到
到达车站:<input id="stopStation" type="text" value="" />
<br/>
开始时间:<input id="startTimeMin" onclick="WdatePicker()" value=""/>
结束时间:<input id="startTimeMax" onclick="WdatePicker()" value=""/>
<button onclick="query(5,1)">查询</button> <table id="ticketList" width="50%" border="1" cellspacing="1">
<tr>
<td>编号</td>
<td>开始车站</td>
<td>到达车站</td>
<td>操作</td>
</tr>
<%--模拟假数据--%>
<tr>
<td>1</td>
<td>北京</td>
<td>成都</td>
<td><button>购买</button></td>
</tr>
</table>
<button onclick="firstPage()">首页</button>
<button onclick="upPage()">上页</button>
<button onclick="nextPage()">下页</button>
<button onclick="lastPage()">末页</button>
跳转到<input id="currentPage1" value="" size="1"/>页 <button onclick="jumpPage()">跳转</button>,
每页显示<span id="pageSize">10</span>条,
当前<span id="currentPage">5</span>/<span id="totalPage">10</span>页,
总共<span id="count">48</span>条
</div>
</body>
<script type="text/javascript"> function orderDetail(){
//进入订单明细页面
window.location.href="/order/index";
}
function loginout(){
//进入注销处理控制层
window.location.href="/login/loginout";
}
//首页
function firstPage(){
alert("--firstPage--");
//获取每页显示条数
var _pageSize = $("#pageSize").html();
query(_pageSize,1);
}
//上页
function upPage(){
alert("--upPage--");
var _pageSize = $("#pageSize").html();
//当前页
var currentPage=$("#currentPage").html();
var _currentPage=currentPage-1;
query(_pageSize,_currentPage);
}
//下页
function nextPage(){
alert("--nextPage--");
var _pageSize = $("#pageSize").html();
//当前页
var currentPage=$("#currentPage").html();
//var _currentPage=currentPage+1;//不能这样直接加必须使用函数
var _currentPage= parseInt(currentPage)+1;
query(_pageSize,_currentPage);
}
//末页
function lastPage(){
alert("--lastPage--");
var _pageSize = $("#pageSize").html();
//当前页
var _currentPage=$("#totalPage").html();
query(_pageSize,_currentPage);
}
//跳转到
function jumpPage(){
alert("--jumpPage--");
var _pageSize = $("#pageSize").html();
//当前页
var _currentPage=$("#currentPage1").val();
query(_pageSize,_currentPage);
}
/**
* 注意在调用该函数时必须输入参数
* 查询+ 分页
* */
function query(_pageSize,_currentPage){
// alert("------query------");
//1.获取参数
var startStation = $("#startStation").val();
var stopStation = $("#stopStation").val();
//查询时间范围获取
var startTimeMin = $("#startTimeMin").val();
var startTimeMax = $("#startTimeMax").val();
//2.发送请求
var params = {
// startStation:startStation,
stopStation:stopStation,
_pageSize:_pageSize,//分页需要的数据
_currentPage:_currentPage//分页需要的数据
};
if (null!=startStation && ''!=startStation){//开始车站有值的时候才传递参数
params['startStation']=startStation; //动态向json中添加参数
}
if (null!=startTimeMin && ''!=startTimeMin){//最小时间
params['startTimeMin']=startTimeMin;
}
if (null!=startTimeMax && ''!=startTimeMax){//最大时间
params['startTimeMax']=startTimeMax;
}
var url = '/otherTicket/data';
jQuery.ajax({
type: 'POST',
contentType: 'application/x-www-form-urlencoded',
url: url,
data: params,
dataType: 'json',
success: function (data) {
//取出列表
var ticketList = data.list;
//取出分页数据
var currentPage= data.currentPage;
var count= data.count;
var pageSize= data.pageSize;
var totalPage= data.totalPage;
var html='<tr>'+
'<td>编号</td>'+
'<td>开始车站</td>'+
'<td>到达车站</td>'+
'<td>发车时间</td>'+
'<td>余票数</td>'+
'<td>线路类型</td>'+
'<td>操作</td>'+ //添加购票按钮
'</tr>';
//解析数据到table表中
for (var i=0;i<ticketList.length;i++){
//取出一个对象 java里面的内省机制
var ticket = ticketList[i];
var id = ticket.id;
var startStation= ticket.startStation;
var stopStation= ticket.stopStation;
//发车时间
var startTime = ticket.startTime;
var standby = ticket.standby;
var typeName = ticket.typeName;
html+='<tr>'+
'<td>'+id+'</td>'+
'<td>'+startStation+'</td>'+
'<td>'+stopStation+'</td>'+
'<td>'+startTime+'</td>'+
'<td>'+standby+'</td>'+
'<td>'+typeName+'</td>'+
'<td><button onclick="buyTicket('+id+')">购买</button></td>'+ //添加购票按钮
'</tr>';
}
//3.填充数据
//填充列表
$("#ticketList").html(html);
//填充分页数据
$("#totalPage").html(totalPage);
$("#pageSize").html(pageSize);
$("#count").html(count);
$("#currentPage").html(currentPage);
},
error: function (data) {
alert("失败啦");
}
});
} function buyTicket(id){
alert("buyTicket----"+id);
//2.发送请求
var params = {
id:id
};
var url = '/ticket2/buyTicket';
jQuery.ajax({
type: 'POST',
contentType: 'application/x-www-form-urlencoded',
url: url,
data: params,
dataType: 'json',
success: function (data) {
alert("成功");
//刷新数据
query(5,1);
},
error: function (data) {
alert("失败啦");
}
});
}
//执行js函数
query(5,1);
</script>
</html>
listOther.jsp
3.获取列表的控制层代码
与本站售票逻辑一模一样
/**
* 获取车票数据 高级查询 + 分页
*/
@RequestMapping("/data")
@ResponseBody //请求数据必须写这个
public ResultPage getData3(TicketQueryObj ticketQueryObj, String _pageSize, String _currentPage) {
//接收参数 可以将分页数据直接用TicketQueryObj对象就收,这里单独写出来是为了更好的理解 分页前端需要传的两个重要参数
if (_pageSize != null && !_pageSize.equals("")) {
ticketQueryObj.setPageSize(Integer.valueOf(_pageSize));
}
if (_currentPage != null && !_currentPage.equals("")) {
ticketQueryObj.setCurrentPage(Integer.valueOf(_currentPage));
}
//调用方法
ResultPage pageOther = ticketService.getPageOther(ticketQueryObj);
//控制跳转
return pageOther;
}
4.业务层代码
业务层逻辑与本站逻辑一样,都是在封装分页对象,不同的是本站的数据来自自己的dao获取,而站间互售来自接口调用返回的数据并解析
@Override
public ResultPage getPageOther(TicketQueryObj ticketQueryObj) {
List<Ticket> tickets = new ArrayList<>();
Integer count=0;
//发送httpClient请求
try {
//发送请求获取分页对象数据
String strRe = HttpClientUtil2.post("http://10.3.2.149:8080/ticket/data?s=cbsjh");
//解析数据
JSONObject jsonObject = JSONObject.fromObject(strRe);
//获取分页对象的列表
JSONArray list = jsonObject.getJSONArray("list");
//获取分页对象中的总共条数
count = jsonObject.getInt("totalSize");
//循环取出 列表的中对象将其转变为本站需要的对象属性
for (int i=0;i<list.size();i++){
JSONObject jsonObject1 = list.getJSONObject(i);
TicketOTher ticketOther = (TicketOTher)JSONObject.toBean(jsonObject1, TicketOTher.class);
Ticket ticket = new Ticket();
ticket.setId(ticketOther.getId());
ticket.setStartStation(ticketOther.getStartStation());
ticket.setStopStation(ticketOther.getStopStation());
ticket.setStartTime(ticketOther.getMoveTime());
//将解析完成后的对象装进列表中
tickets.add(ticket);
}
} catch (IOException e) {
e.printStackTrace();
}
ResultPage resultPage =new ResultPage();
//获取数据列表
resultPage.setList(tickets);
//总共条数查询数据库
resultPage.setCount(count);
//当前页
Integer currentPage = ticketQueryObj.getCurrentPage();
resultPage.setCurrentPage(currentPage);
//每页显示条数
Integer pageSize = ticketQueryObj.getPageSize();
resultPage.setPageSize(pageSize);
//总共页数
Integer totalPage=((count-1)/pageSize)+1;
resultPage.setTotalPage(totalPage);
return resultPage;
}
5.用到的HttpClientUtil2.java简单工具类如下:
//发送请求
public static String post(String url) throws IOException {
//1.发送对象
HttpPost httpPost = new HttpPost(url);
//2.创建客户端
DefaultHttpClient defaultHttpClient = new DefaultHttpClient();
//3.使用客户端发送请求
CloseableHttpResponse execute = defaultHttpClient.execute(httpPost);
//4.解析结果
HttpEntity entity = execute.getEntity();
String s = EntityUtils.toString(entity);
System.out.println("s="+s);
return s;
}
站间售票获取列表完成!重启项目查看站间互售列表吧!