order.jsp 8.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"
  2. pageEncoding="UTF-8"%>
  3. <%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
  4. <c:set value="<%=request.getContextPath()%>" var="ctx"></c:set>
  5. <!DOCTYPE html>
  6. <html>
  7. <head>
  8. <meta charset="utf-8">
  9. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  10. <title>表单</title>
  11. <meta name="keywords" content="关键字台">
  12. <meta name="description" content="描述">
  13. <link href="${ctx}/css/bootstrap.min.css?v=3.3.6" rel="stylesheet">
  14. <link href="${ctx}/css/font-awesome.css?v=4.4.0" rel="stylesheet">
  15. <link href="${ctx}/css/bootstrap-select.min.css" rel="stylesheet">
  16. <link href="${ctx}/css/plugins/bootstrap-table/bootstrap-table.min.css" rel="stylesheet">
  17. <link href="${ctx}/css/animate.css" rel="stylesheet">
  18. <link href="${ctx}/css/style.css?v=4.1.0" rel="stylesheet">
  19. </head>
  20. <body class="gray-bg">
  21. <div class="wrapper wrapper-content animated fadeInRight">
  22. <div class="row">
  23. <div class="col-sm-12">
  24. <div class="ibox">
  25. <div class="ibox-title">
  26. <div class="row">
  27. <div class="col-sm-10">
  28. <h3>发货查询</h3>
  29. </div>
  30. <div class="col-sm-2">
  31. <div class="ibox-tools">
  32. <!-- <button class="btn btn-success" onclick="addUser();"> -->
  33. <!-- <i class="glyphicon glyphicon-plus"></i> 添加用户 -->
  34. <!-- </button> -->
  35. </div>
  36. </div>
  37. </div>
  38. </div>
  39. <div class="ibox-content">
  40. <div class="row row-lg">
  41. <form class="form-horizontal m-t" >
  42. <div id="condition">
  43. <div>
  44. <label class="col-sm-1 control-label"><span class="text-danger"></span>发货日期:</label>
  45. <div class="col-sm-2">
  46. <input id="startdate" class="form-control form_datetime" placeholder="请输入开始日期"/>
  47. </div>
  48. <div class="col-sm-2">
  49. <input id="enddate" class="form-control form_datetime" placeholder="请输入结束日期"/>
  50. </div>
  51. </div>
  52. <div>
  53. <label class="col-sm-1 control-label"><span class="text-danger"></span>出库单号:</label>
  54. <div class="col-sm-2">
  55. <input id="OrderNo" class="form-control" placeholder="出库单号"/>
  56. </div>
  57. </div>
  58. <div>
  59. <label class="col-sm-1 control-label"><span class="text-danger"></span>车牌号:</label>
  60. <div class="col-sm-2">
  61. <input id="LicensePlate" class="form-control " placeholder="车牌号"/>
  62. </div>
  63. </div>
  64. </div>
  65. <button style="" type="button" id="searchBtn" class="btn btn-success" onclick="search();return false;">搜索</button>
  66. </form>
  67. </div>
  68. <div class="row row-lg">
  69. <div class="col-sm-12">
  70. <table id="table" data-toggle="table" data-mobile-responsive="true">
  71. </table>
  72. </div>
  73. </div>
  74. </div>
  75. </div>
  76. </div>
  77. </div>
  78. </div>
  79. <!-- 全局js -->
  80. <script src="${ctx}/js/jquery.min.js?v=2.1.4"></script>
  81. <script src="${ctx}/js/bootstrap.min.js?v=3.3.6"></script>
  82. <script src="${ctx}/js/bootstrap-select.min.js"></script>
  83. <!-- 自定义js -->
  84. <script src="${ctx}/js/content.js?v=1.0.0"></script>
  85. <!-- jQuery Validation plugin javascript-->
  86. <script src="${ctx}/js/plugins/validate/jquery.validate.min.js"></script>
  87. <script src="${ctx}/js/plugins/validate/messages_zh.min.js"></script>
  88. <script src="${ctx}/js/plugins/bootstrap-table/bootstrap-table.min.js"></script>
  89. <script src="${ctx}/js/plugins/bootstrap-table/bootstrap-table-mobile.min.js"></script>
  90. <script src="${ctx}/js/plugins/bootstrap-table/locale/bootstrap-table-zh-CN.min.js"></script>
  91. <script src="${ctx}/js/common.js"></script>
  92. <script src="${ctx}/js/plugins/layer/layer.min.js"></script>
  93. <script src="${ctx}/js/Math.uuid.js"></script>
  94. <script src="${ctx}/js/laydate/laydate.js"></script>
  95. </body>
  96. <script>
  97. var table = null;
  98. $(document).ready(function(){
  99. var doms = $(".form_datetime");
  100. for(let i =0;i<doms.length;i++){
  101. let dom = doms[i];
  102. let id = dom.id;
  103. console.log(id);
  104. let end = {
  105. elem : '#'+id,
  106. format : 'YYYY-MM-DD',
  107. istime : false,
  108. istoday : true,
  109. };
  110. laydate(end);
  111. }
  112. // $.ajax({
  113. // url : "${ctx}/jinzaiOrder/orderQuery",
  114. // success : function(list){
  115. table = $('#table').bootstrapTable("destroy");//通过AJAX必须先destroy不知道为啥
  116. initTable();
  117. // }
  118. // });
  119. });
  120. function queryParams(param){
  121. let startdate = $("#startdate").val();
  122. let enddate = $("#enddate").val();
  123. let OrderNo = $("#OrderNo").val();
  124. let LicensePlate = $("#LicensePlate").val();
  125. if(startdate){
  126. param['startdate'] = startdate;
  127. }
  128. if(enddate){
  129. param['enddate'] = enddate;
  130. }
  131. if(OrderNo){
  132. param['OrderNo'] = OrderNo;
  133. }
  134. if(LicensePlate){
  135. param['LicensePlate'] = LicensePlate;
  136. }
  137. return param;
  138. }
  139. function search(){
  140. table = $('#table').bootstrapTable("destroy");
  141. initTable();
  142. }
  143. function initTable(){
  144. var index = 1;
  145. table = $('#table').bootstrapTable({
  146. method: 'get',
  147. sortable : true,
  148. toolbar: '#toolbar', //工具按钮用哪个容器
  149. striped: true, //是否显示行间隔色
  150. cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)
  151. pagination: true, //是否显示分页(*)
  152. pageNumber:1, //初始化加载第一页,默认第一页
  153. pageSize: 10, //每页的记录行数(*)
  154. pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)
  155. url: "${ctx}/jinzaiOrder/orderQuery",//这个接口需要处理bootstrap table传递的固定参数
  156. queryParamsType:'', //默认值为 'limit' ,在默认情况下 传给服务端的参数为:offset,limit,sort
  157. // 设置为 '' 在这种情况下传给服务器的参数为:pageSize,pageNumber
  158. queryParams: queryParams,//前端调用服务时,会默认传递上边提到的参数,如果需要添加自定义参数,可以自定义一个函数返回请求参数
  159. sidePagination: "server", //分页方式:client客户端分页,server服务端分页(*)
  160. search: true, //是否显示表格搜索,此搜索是客户端搜索,不会进服务端,所以,个人感觉意义不大
  161. strictSearch: false,
  162. //showColumns: true, //是否显示所有的列
  163. // showRefresh: true, //是否显示刷新按钮
  164. minimumCountColumns: 2, //最少允许的列数
  165. clickToSelect: true, //是否启用点击选中行
  166. searchOnEnterKey: true,
  167. idField : "OrderNo",
  168. columns: [{
  169. title: '单号',
  170. align: 'center',
  171. field: 'OrderNo',
  172. width:"3%"
  173. },{
  174. field: 'OutWarehouse',
  175. title: '工厂名称',
  176. align: 'center',
  177. width:"5%"
  178. },{
  179. field: 'DeliveryTime',
  180. title: '出库时间',
  181. align: 'center',
  182. width:"5%"
  183. },{
  184. field: 'CaseCode',
  185. title: '箱码',
  186. align: 'center',
  187. width:"5%"
  188. },{
  189. field: 'PalletCode',
  190. title: '垛码',
  191. align: 'center',
  192. width:"5%"
  193. },{
  194. field: 'ProductName',
  195. title: '产品名称',
  196. align: 'center',
  197. width:"5%"
  198. },{
  199. field: 'SKU',
  200. title: 'SKU',
  201. align: 'center',
  202. width:"5%"
  203. },{
  204. field: 'CustomerName',
  205. title: '客户名称',
  206. align: 'center',
  207. width:"5%"
  208. },{
  209. field: 'LicensePlate',
  210. title: '车牌号',
  211. align: 'center',
  212. width:"5%"
  213. }
  214. ],
  215. });
  216. }
  217. </script>
  218. <script type="text/javascript">
  219. function isEmpty(obj){
  220. if(obj == undefined || obj == null || obj == ''){
  221. return true;
  222. }else{
  223. return false;
  224. }
  225. }
  226. </script>
  227. </html>