process.jsp 16 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474
  1. <%@ page contentType="text/html; charset=utf-8" session="false" %>
  2. <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN">
  4. <head>
  5. <title>我的工作台</title>
  6. <%@ include file="../common/header.jsp" %>
  7. <script type="text/javascript" src="${contextPath }/js/calendar/WdatePicker.js"></script>
  8. <script type="text/javascript" src="${contextPath}/js/highcharts.js"></script>
  9. <script type="text/javascript" src="${contextPath}/js/exporting.js"></script>
  10. <link type="text/css" rel="stylesheet" href="${contextPath}/css/themes/easyui.css" />
  11. <script type="text/javascript" src="${contextPath }/js/jquery.easyui.min.js"></script>
  12. <script type="text/javascript">
  13. var mydata,minWeight,xStr,Series,Aw,Ll,chart,chartHeight,chartWidth,panelCHeight=0,panelSHeight=0,panelStatus = 1;
  14. $(document).ready( function() {
  15. $("input.datebox").bind("click", function() {WdatePicker();});
  16. setNowDate();
  17. loadList(); //加载jqgrid
  18. $("#list").jqGrid("setGridWidth",$(window).width()*0.32);
  19. $("#p1list").jqGrid("setGridWidth",$(window).width()*0.32);
  20. $("#p2list").jqGrid("setGridWidth",$(window).width()*0.32);
  21. $("#list").jqGrid("setSelection",1);
  22. $("#dl1Result").load("${contextPath }/admin/statistics/process1.html");
  23. $("#dl2Result").load("${contextPath }/admin/statistics/process2.html");
  24. $("body").layout("panel","south").panel({
  25. onClose: function(){
  26. panelC = $("body").layout("panel","center").panel();
  27. $("#list").jqGrid("setGridWidth",$(window).width()*0.33);
  28. $("#p1list").jqGrid("setGridWidth",$(window).width()*0.32);
  29. $("#p2list").jqGrid("setGridWidth",$(window).width()*0.32);
  30. $("#list").jqGrid("setGridHeight",panelC.height()-60);
  31. $("#p1list").jqGrid("setGridHeight",panelC.height()-80);
  32. $("#p2list").jqGrid("setGridHeight",panelC.height()-80);
  33. panelStatus = 0;
  34. },
  35. onOpen: function(){
  36. if(panelCHeight == 0){
  37. panelStatus = 1;
  38. panelC = $("body").layout("panel","center").panel();
  39. panelCHeight = panelC.height();
  40. panelSHeight = $(window).height() - panelC.height();
  41. chartWidth = $(window).width()*0.99;
  42. chartHeight = panelSHeight*0.85;
  43. loadChart(); //加载点线图
  44. }
  45. },
  46. onResize: function(){
  47. panelS = $("body").layout("panel","south").panel();
  48. panelCHeight = $(window).height() - panelS.height();
  49. $("#list").jqGrid("setGridHeight",panelCHeight-110);
  50. $("#p1list").jqGrid("setGridHeight",panelCHeight-130);
  51. $("#p2list").jqGrid("setGridHeight",panelCHeight-130);
  52. $("#list").jqGrid("setGridWidth",$(window).width()*0.33);
  53. $("#p1list").jqGrid("setGridWidth",$(window).width()*0.32);
  54. $("#p2list").jqGrid("setGridWidth",$(window).width()*0.32);
  55. chartWidth = $(window).width()*0.99;
  56. chartHeight = panelS.height()*0.99;
  57. loadChart(); //加载点线图
  58. }
  59. });
  60. });
  61. $(window).resize(function(){
  62. panelS = $("body").layout("panel","south").panel();
  63. $("#list").jqGrid("setGridHeight",panelCHeight-110);
  64. $("#p1list").jqGrid("setGridHeight",panelCHeight-130);
  65. $("#p2list").jqGrid("setGridHeight",panelCHeight-130);
  66. $("#list").jqGrid("setGridWidth",$(window).width()*0.32);
  67. $("#p1list").jqGrid("setGridWidth",$(window).width()*0.32);
  68. $("#p2list").jqGrid("setGridWidth",$(window).width()*0.32);
  69. chartWidth = $(window).width()*0.99;
  70. chartHeight = panelS.height()*0.99;
  71. loadChart(); //加载点线图
  72. });
  73. //jqgrid初始化
  74. function loadList(){
  75. jQuery("#list").jqGrid({
  76. datatype: "local", //从服务器端返回的数据类型,(表格期望接收的数据类型)。可选类型:xml,xmlstring,json,local,function
  77. height: 120, //高度
  78. colNames:["主键","TMR","计划名称", "开始时间", "过程时间", "牛头数", "配方模板", "DataCaptureNo", "lastInTime","ActualWeight"], //列名
  79. colModel:[
  80. {
  81. name: "ID",
  82. index: "ID",
  83. width: 10,
  84. align: "center",
  85. sorttype: "string",
  86. hidden: true
  87. },
  88. {
  89. name: "TNAME",
  90. index: "TNAME",
  91. width: 50,
  92. align: "center",
  93. sorttype: "string"
  94. },
  95. {
  96. name: "ProjName",
  97. index: "ProjName",
  98. width: 70,
  99. align: "center",
  100. sorttype: "string"
  101. },
  102. {
  103. name: "InTime",
  104. index: "InTime",
  105. width: 150,
  106. align: "center",
  107. sorttype: "string"
  108. },
  109. {
  110. name: "processTime",
  111. index: "processTime",
  112. width: 70,
  113. align: "center",
  114. sorttype: "string"
  115. },
  116. {
  117. name: "feedpCount",
  118. index: "feedpCount",
  119. width: 70,
  120. align: "center",
  121. sorttype: "string"
  122. },
  123. {
  124. name: "templetName",
  125. index: "templetName",
  126. width: 70,
  127. align: "center",
  128. sorttype: "string"
  129. },
  130. {
  131. name: "DataCaptureNo",
  132. index: "DataCaptureNo",
  133. width: 10,
  134. align: "center",
  135. sorttype: "string",
  136. hidden: true
  137. },
  138. {
  139. name: "lastInTime",
  140. index: "lastInTime",
  141. width: 10,
  142. align: "center",
  143. sorttype: "string",
  144. hidden: true
  145. },
  146. {
  147. name: "ActualWeight",
  148. index: "ActualWeight",
  149. width: 10,
  150. align: "center",
  151. sorttype: "string",
  152. hidden: true
  153. }
  154. ],
  155. onSelectRow: function(rowid){
  156. var selId = $("#list").jqGrid("getGridParam","selrow"); //获取当前选中行号
  157. var rowData = $("#list").jqGrid("getRowData",selId); //获取当前选中行真实对象
  158. $("#currentpId").val(rowData.ID);
  159. $("#dl1Result").load("${contextPath }/admin/statistics/process1.html");
  160. $("#dl2Result").load("${contextPath }/admin/statistics/process2.html");
  161. panelS = $("body").layout("panel","south").panel();
  162. panelCHeight = $(window).height() - panelS.height();
  163. $("#list").jqGrid("setGridHeight",panelCHeight-110);
  164. $("#p1list").jqGrid("setGridHeight",panelCHeight-130);
  165. $("#p2list").jqGrid("setGridHeight",panelCHeight-130);
  166. $("#list").jqGrid("setGridWidth",$(window).width()*0.33);
  167. $("#p1list").jqGrid("setGridWidth",$(window).width()*0.32);
  168. $("#p2list").jqGrid("setGridWidth",$(window).width()*0.32);
  169. //获取点线图的数据
  170. $.ajax({
  171. async: false,
  172. type: "POST",
  173. dataType: "json", //返回类型json
  174. data: "beginDate="+rowData.InTime+"&endDate="+rowData.lastInTime+"&SrcAddr="+rowData.DataCaptureNo+"&currentpId="+rowData.ID+"&ActualWeight="+rowData.ActualWeight,
  175. url: "${contextPath }/admin/statistics/pdxlist.html",
  176. error: function(){alert("系统错误");},
  177. success: function(json){
  178. if(json.status == "success"){
  179. minWeight = json.minWeight;
  180. xStr = json.MTime;
  181. Series = json.Weight;
  182. Aw = json.AW;
  183. Ll = json.Ll;
  184. }
  185. }
  186. });
  187. loadChart(); //加载点线图
  188. },
  189. /**
  190. * 设置水平滚动条 begin
  191. **/
  192. shrinkToFit:false,
  193. autoScroll: true,
  194. //width: 370,
  195. autowidth: true, //自动调节宽度
  196. rowNum: 1000, //每页显示条数
  197. /**
  198. * 设置水平滚动条 end
  199. **/
  200. altRows: true, //设置表格是否允许行交替变色值
  201. altclass:"tdbgmouseover" //自定义隔行变色的样式
  202. });
  203. //获取数据集
  204. mydata = getLists();
  205. if(mydata!=null){
  206. for(var i=0;i<=mydata.length;i++){
  207. jQuery("#list").jqGrid("addRowData",i+1,mydata[i]);
  208. }
  209. //如果页面上没有分页工具条、就不要自动刷新一次了,不然数据显示不完全,jqgrid可能有默认每页显示的条数,如果想数据完全展示,
  210. //在自动刷新后并且没有页面分页工具条时必须给一个默认页面显示条数才可以。
  211. //rowNum: 10000, //每页显示条数
  212. //jQuery("#list").jqGrid().trigger("reloadGrid"); //添加完数据后客户端自动刷新一次、实现客户端数据与服务器数据的完全分离
  213. }
  214. }
  215. //获取服务器数据
  216. function getLists(){
  217. var beginDate = $("#beginDate").val();
  218. var endDate = $("#endDate").val();
  219. var excelTmrId = $("#excelTmrId").val();
  220. var excelFeedpId = $("#excelFeedpId").val();
  221. var excelWc = $("#excelWc").val();
  222. var planselIds = $('input[name="planselIds"]:checked').val();
  223. $.ajax({
  224. async: false,
  225. type: "POST",
  226. dataType: "json", //返回类型json
  227. data: "beginDate="+beginDate+"&endDate="+endDate+"&excelTmrId="+excelTmrId+"&excelFeedpId="+excelFeedpId+"&excelWc="+excelWc+"&planselIds="+planselIds,
  228. url: "${contextPath }/admin/statistics/processlist.html",
  229. error: function(){alert("系统错误");},
  230. success: function(json){
  231. mydata = json;
  232. }
  233. });
  234. return mydata;
  235. }
  236. //Chart初始化
  237. function loadChart(){
  238. chart = new Highcharts.Chart({
  239. chart: {
  240. backgroundColor:"#FFFFEF",
  241. shadow: true,
  242. renderTo: "container",
  243. type: "line",
  244. zoomType: "x,y",
  245. height: chartHeight,
  246. width: chartWidth
  247. },
  248. navigation: {
  249. buttonOptions: {
  250. enabled: false
  251. }
  252. },
  253. lang: {
  254. loading: "请稍等……",
  255. printButtonTitle: "打印",
  256. resetZoom: "缩放比例",
  257. resetZoomTitle: "缩放比例",
  258. exportButtonTitle: "导出",
  259. downloadPNG: "PNG格式导出",
  260. downloadJPEG: "JPEG格式导出",
  261. downloadPDF: "PDF格式导出",
  262. downloadSVG: "SVG格式导出"
  263. },
  264. title: {
  265. text: ""
  266. },
  267. xAxis: {
  268. categories: xStr,
  269. labels: {
  270. step: 10
  271. }
  272. },
  273. yAxis: {
  274. title: {
  275. text: "重量(kg)"
  276. },
  277. min: minWeight,
  278. tickInterval: 1000 //坐标轴刻度间距:tickPixelInterval像素距离、tickInterval数值距离
  279. },
  280. tooltip: {
  281. crosshairs: true, //鼠标移动x轴显示虚线
  282. formatter: function() {
  283. return "<b>"+ this.series.name +"</b><br/>"+
  284. this.x +" "+ this.y +"kg";
  285. }
  286. },
  287. legend: {
  288. align: "top",
  289. verticalAlign: "top",
  290. x: 100,
  291. y: 1,
  292. borderWidth: 1,
  293. itemMarginBottom: 5
  294. },
  295. plotOptions: {
  296. series: {
  297. animation: false
  298. },
  299. line: {
  300. lineWidth: 1,
  301. states: {
  302. hover: {
  303. lineWidth: 1
  304. }
  305. },
  306. marker: {
  307. enabled: false,
  308. states: {
  309. hover: {
  310. enabled: false,
  311. radius: 1,
  312. lineWidth: 1
  313. }
  314. }
  315. }
  316. }
  317. },
  318. series: [
  319. {
  320. name: "重量",
  321. data: Series
  322. },
  323. {
  324. type: "scatter",
  325. name: "实际重量",
  326. data: Aw,
  327. marker: {
  328. radius: 4
  329. },
  330. color: "#BE77FF"
  331. },
  332. {
  333. name: "设计重量",
  334. step: "right",
  335. data: Ll,
  336. marker: {
  337. radius: 3
  338. },
  339. color: "#EA0000"
  340. }
  341. ]
  342. });
  343. }
  344. //初始化日期
  345. function setNowDate(){
  346. var myDate = new Date();
  347. var year = myDate.getFullYear();
  348. var month = myDate.getMonth()+1;
  349. var day = myDate.getDate();
  350. var nowdate = year + "-" + month + "-" + day;
  351. $("#beginDate").val(nowdate);
  352. $("#endDate").val(nowdate);
  353. }
  354. //查询数据
  355. function queryDate(){
  356. //清空主表数据重新加载一次
  357. $("#list").clearGridData();
  358. loadList();
  359. $("#p1list").clearGridData();
  360. $("#p2list").clearGridData();
  361. }
  362. function leftDate(){
  363. var beginDate = $("#beginDate").val();
  364. var endDate = $("#endDate").val();
  365. var newbDate = checkDate(beginDate,"left");
  366. var neweDate = checkDate(endDate,"left");
  367. $("#beginDate").val(newbDate);
  368. $("#endDate").val(neweDate);
  369. queryDate();
  370. }
  371. function rightDate(){
  372. var beginDate = $("#beginDate").val();
  373. var endDate = $("#endDate").val();
  374. var newbDate = checkDate(beginDate,"");
  375. var neweDate = checkDate(endDate,"");
  376. $("#beginDate").val(newbDate);
  377. $("#endDate").val(neweDate);
  378. queryDate();
  379. }
  380. //导出数据
  381. function excelDate(){
  382. var beginDate = $("#beginDate").val();
  383. var endDate = $("#endDate").val();
  384. var excelTmrId = $("#excelTmrId").val();
  385. var excelFeedpId = $("#excelFeedpId").val();
  386. var excelWc = $("#excelWc").val();
  387. var planselIds = $('input[name="planselIds"]:checked').val();
  388. document.location.href="${contextPath }/admin/statistics/processexcel.html?beginDate="+beginDate+"&endDate="+endDate+"&excelTmrId="+excelTmrId+"&excelFeedpId="+excelFeedpId+"&excelWc="+excelWc+"&planselIds="+planselIds;
  389. }
  390. //导出数据
  391. function excelDateSx(){
  392. var beginDate = $("#beginDate").val();
  393. var endDate = $("#endDate").val();
  394. var excelTmrId = $("#excelTmrId").val();
  395. var excelFeedpId = $("#excelFeedpId").val();
  396. var excelWc = $("#excelWc").val();
  397. var planselIds = $('input[name="planselIds"]:checked').val();
  398. document.location.href="${contextPath }/admin/statistics/processexcelsx.html?beginDate="+beginDate+"&endDate="+endDate+"&excelTmrId="+excelTmrId+"&excelFeedpId="+excelFeedpId+"&excelWc="+excelWc+"&planselIds="+planselIds;
  399. }
  400. </script>
  401. </head>
  402. <body class="easyui-layout">
  403. <div region="center" style="padding:5px;background:#eee;">
  404. <table cellspacing="1" cellpadding="0" border="0" style="width: 100%;">
  405. <tr>
  406. <td colspan="3">
  407. <input type="hidden" id="currentpId" name="currentpId" value="${currentpId }" />
  408. <input id="beginDate" name="beginDate" style="width:100px;" class="datebox" value=""/> -
  409. <input id="endDate" name="endDate" style="width:100px;" class="datebox" value=""/>
  410. <input type="button" value="<" onclick="leftDate();" /><input type="button" value=">" onclick="rightDate();" />
  411. TMR:
  412. <select id="excelTmrId" style="width:70px;">
  413. <option value="">全部</option>
  414. <c:forEach items="${tmrlist }" var="tmr">
  415. <option value="${tmr.ID }">
  416. <c:out value="${tmr.TNAME }" />
  417. </option>
  418. </c:forEach>
  419. </select>
  420. 牛舍:
  421. <select id="excelFeedpId" style="width:70px;">
  422. <option value="">全部</option>
  423. <c:forEach items="${feedplists }" var="feedp">
  424. <option value="${feedp.ID }">
  425. <c:out value="${feedp.BNAME }" />
  426. </option>
  427. </c:forEach>
  428. </select>
  429. 误差:
  430. <select id="excelWc" style="width:70px;">
  431. <option value="">全部</option>
  432. <option value="0">无误差</option>
  433. <option value="1">有误差</option>
  434. </select>
  435. <input id="scjh" name="planselIds" type="radio" value="0" checked="checked"><label for="scjh">生产计划</label></input>
  436. <input id="sljh" name="planselIds" type="radio" value="1"><label for="sljh">剩料计划</label></input>
  437. <input type="button" value="查询" onclick="queryDate()" class="sysub" />
  438. <input type="button" value="导出Excel" onclick="excelDate()" class="sysub" />
  439. <input type="button" value="筛选导出" onclick="excelDateSx()" class="sysub" />
  440. </td>
  441. </tr>
  442. <tr>
  443. <td width="33%"><table id="list"></table></td>
  444. <td width="33%"><div id="dl1Result"></div></td>
  445. <td width="33%"><div id="dl2Result"></div></td>
  446. </tr>
  447. </table>
  448. </div>
  449. <div region="south" split="true" title="监控图" style="height:320px;">
  450. <table cellspacing="1" cellpadding="0" border="0" style="width: 99%;">
  451. <tr>
  452. <td><div id="container"></div></td>
  453. </tr>
  454. </table>
  455. </div>
  456. </body>
  457. </html>