springdoc隐藏参数

1.使用准备

前台需要的资源文件，主要有Bootstrap3相关css、js以及bootstrap Table相关css、js：

 

1. <-- 样式 -->  
2. <link rel="stylesheet" href="bootstrap.min.css">  
3. <link rel="stylesheet" href="bootstrap-table.css">  
4.   
5. <script src="jquery.min.js"></script>  
6. <script src="bootstrap.min.js"></script>  
7. <script src="bootstrap-table.js"></script>  
8. <-- 表格汉化js -->  
9. <script src="bootstrap-table-zh-CN.js"></script>  
10.

以上这些插件可以到这里下载http://bootstrap-table.wenzhixin.NET.cn/zh-cn/getting-started/ （官方文档地址）。

 

2.使用方法

对于bootstrap table 可以通过data 属性或者JavaScript 来启用bootstrap table 插件，显示丰富的功能。

这里推荐使用javascript来启用bootstrap table插件来使用bootstrap table，可以实现js和html的分离，代码可以重用，下面我介绍的时候也只介绍这种方法。

 

3.前端代码

页面代码：

 

1. <-- 以下是一些需要的css、js -->  
2. <-- 样式 -->  
3. <link rel="stylesheet" href="bootstrap.min.css">  
4. <link rel="stylesheet" href="bootstrap-table.css">  
5.   
6. <script src="jquery.min.js"></script>  
7. <script src="bootstrap.min.js"></script>  
8. <script src="bootstrap-table.js"></script>  
9. <-- 表格汉化js -->  
10. <script src="bootstrap-table-zh-CN.js"></script>  
11.   
12. <-- 这是html主体代码,只需要这一个就可以了 -->  
13. <div ><table id="tableList" class="table table-striped"></table> </div>

以上代码省略了部分html标签，只粘贴了主要部分。

 

js代码：

 

1. //通过bootstrap Table方法refresh重新加载数据  
2. function showData() {  
3. '#tableList').bootstrapTable('refresh');  
4. }  
5.   
6. //官方使用方法的语法：<code>$('#table').bootstrapTable('method', parameter)</code>  
7. $('#tableList').bootstrapTable({  
8.     columns: [{  
9. 'id',  
10. '序号',  
11.     }, {  
12. 'year',  
13. '年度',  
14.     }, {  
15. 'month',  
16. '月份',  
17.     },{  
18. 'creDate',  
19. '日期',  
20.     },{  
21. 'merBasicId',  
22. '商户id',  
23.     },{  
24. 'merName',  
25. '商户名称',  
26.     },{  
27. 'categoryTypeName',  
28. '商户类型',  
29.     },{  
30. 'city',  
31. '城市',  
32.     },{  
33. 'area',  
34. '区域',  
35.     },{  
36. 'tradeAreaName',  
37. '商圈',  
38. //页面需要展示的列，后端交互对象的属性  
39. true,  //开启分页  
40. 'server',//服务器端分页  
41. //默认加载页  
42. //每页数据  
43. //可选的每页数据  
44. function (params) {  
45. return {  
46. "#txtStartDate").val(),  
47. "#txtEndDate").val(),  
48. "#txtMerName").val(),  
49.             pageSize: params.limit,  
50.             offset: params.offset  
51.         }  
52. //请求服务器数据时的参数  
53. '/console/finance/channelDivideDetails/data' //服务器数据的加载地址  
54. });

对于parameter更多的描述，具体可以参考前面发的官方文档的链接。

4.后端代码

 

1. //根据传入的pageSize，offset参数决定查哪一页,根据其他参数决定查询哪些数据   
2. @RequestMapping( value = "/data", method = RequestMethod.POST, produces = "application/json;charset=UTF-8" )  
3. @ResponseBody  
4. public Object channelDivideDetailsData( HttpServletRequest request, @RequestBody JSONObject jsonObj ) {  
5. "[]";  
6. new HashMap<String, Object>();  
7. "startDate");  
8. "endDate");  
9. "merName");  
10. int pageSize = jsonObj.getIntValue("pageSize");  
11. int offset = jsonObj.getIntValue("offset");  
12. try {  
13. "startDate", startDateStr);  
14. "endDate", endDateStr);  
15. if(merName != null && merName != "") {  
16. "merName", merName);  
17.       }  
18.       PageBounds pageBounds = JSPUtil.getPagerBoundsByParameter(pageSize, offset);  
19.       List<FChannelDivideDetails> list = channelDivideDetailsService.getChannelDivideDetails(map, pageBounds);  
20. if(list != null && list.size() > 0) {  
21.         Map<String, Object> retMap =  
22.             (Map<String, Object>) JSPUtil.pagelistToJSONMapNew((PageList<FChannelDivideDetails>) list);  
23.         html = JSON.toJSONStringWithDateFormat(retMap, DATE_FORMATE_STR);  
24.       }  
25.     }  
26. catch(Exception e) {  
27. "系统异常e:{}", e);  
28. this.buildResponse(ErrorCode.system_1000);  
29.     }  
30. return html;  
31.   }

4.1这里要注意的是前端传过来的参数是json格式的，所以用@RequestBody注解后我们就能将前端传过来的参数取出来。

 

4.2代码里用到了mybatis的一个分页插件mybatis-paginator，我们只需要包装出一个PageBounds，参数传入service层，插件会自动帮我们代理实现分页，就不需要我们自己再写分页代码了， mybatis-paginator的具体使用教程搜索关键字查看相关文章即可。

包装PageBounds的代码：

 

1. /** 
2.    * 取得分页对象 
3.    *  
4.    * @param pageSize 
5.    * @param offset 
6.    * @return 
7.    */  
8. @SuppressWarnings( "unused" )  
9. public static PageBounds getPagerBoundsByParameter( int pageSize, int offset ) {  
10. if(pageSize == 0) {  
11. return null;  
12.     }  
13.   
14. new PageBounds(offset / pageSize + 1, pageSize);  
15. return pageBounds;  
16.   }

 

4.3最后返回前端的json数据包括total、rows两个对象，total表示数据总数，rows表示需要显示的数据。必须按照这种格式返回才行。

包装返回数据的代码：

 

1. @SuppressWarnings( { "rawtypes", "unchecked" } )  
2. public static Object pagelistToJSONMapNew( PageList list ) {  
3. new HashMap<String, Object>();  
4. if(list != null) {  
5.      Paginator paginator = list.getPaginator();  
6. "total", paginator.getTotalCount());  
7. "rows", new ArrayList(list));  
8.    }  
9. return map;  
10.  }

 

以上就实现了从前端到后端的表格分页查询。

目前主要使用到了查询分页，具体其他的操作可以参考查询相关代码。