rpt_test.html 7.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
  5. <title>Report Demo!</title>
  6. </head>
  7. <body>
  8. <!--
  9. <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
  10. -->
  11. <script src="/lib/jquery/jquery.min.js"></script>
  12. <script type="text/javascript" src="/web/maintain/report/js/jpc_output_value_define.js"></script>
  13. <script type="text/javascript" src="/web/maintain/report/js/jpc_output.js"></script>
  14. <table id="forPrintHide">
  15. <tr>
  16. <td width="5"></td>
  17. <td>
  18. <select name="select1" id="select_k1" onchange="ajaxCall()">
  19. <option value="2">07-1表</option>
  20. <option value="1">08-2表</option>
  21. <option value="3">计量-清单支付09表</option>
  22. <option value="88">多流水测试报表</option>
  23. </select>
  24. <select name="select2" id="select_k2" onchange="ajaxCall()">
  25. <option value="A4">A4</option>
  26. <option value="A3">A3</option>
  27. </select>
  28. </td>
  29. <td>
  30. <input type="button" value="显示报表" onclick="ajaxCall()"/>
  31. <input type="button" value="< 前一页" onclick="showPage(-1)"/>
  32. <input type="button" value="后一页 >" onclick="showPage(1)"/>
  33. <input type="button" value="打印" onclick="printCurrentPage()"/>
  34. <input type="button" value="Excel" onclick="getExcel()"/>
  35. <input type="button" value="ExcelInOneBook" onclick="getExcelInOneBook()"/>
  36. <input type="button" value="PDF" onclick="getPDF()"/>
  37. <label>
  38. <input type="checkbox" id="isOneSheetChk" onclick="isOneSheet = this.checked;">
  39. Excel单页输出
  40. </label>
  41. </td>
  42. </tr>
  43. </table>
  44. <canvas id="myCanvas" width="2000" height="1280">
  45. </canvas>
  46. </body>
  47. <style>
  48. body {
  49. margin: 0px;
  50. padding: 0px;
  51. }
  52. #myCanvas {
  53. border: 0px solid #9C9898;
  54. }
  55. </style>
  56. <script>
  57. let currentPage = 1;
  58. let pageRst = null;
  59. let currentRptTpl = null;
  60. let maxPages = 20;
  61. let rpt_id = null;
  62. let rpt_size = null;
  63. let isOneSheet = false;
  64. function printCurrentPage() {
  65. if (currentRptTpl) {
  66. //$("table#forPrintHide").css
  67. $("table#forPrintHide").css("display","none");
  68. window.print();
  69. //$("canvas#myCanvas").printArea();
  70. }
  71. }
  72. function getScreenDPI() {
  73. let me = this, arrDPI = [];
  74. if (window.screen.deviceXDPI != undefined) {
  75. arrDPI.push(window.screen.deviceXDPI);
  76. arrDPI.push(window.screen.deviceYDPI);
  77. } else {
  78. let tmpNode = document.createElement("DIV");
  79. tmpNode.style.cssText = "width:1in;height:1in;position:absolute;left:0px;top:0px;z-index:99;visibility:hidden";
  80. document.body.appendChild(tmpNode);
  81. arrDPI.push(parseInt(tmpNode.offsetWidth));
  82. arrDPI.push(parseInt(tmpNode.offsetHeight));
  83. tmpNode.parentNode.removeChild(tmpNode);
  84. }
  85. return arrDPI;
  86. }
  87. function setupReport() {
  88. let rst = false;
  89. let rpt = document.getElementById("select_k1");
  90. let size = document.getElementById("select_k2");
  91. if (rpt.selectedIndex >= 0 && size.selectedIndex >= 0) {
  92. rpt_id = rpt.options[rpt.selectedIndex].value;
  93. rpt_size = size.options[size.selectedIndex].value;
  94. rst = true;
  95. }
  96. return rst;
  97. }
  98. function showPage(pageStep, cv) {
  99. if (currentPage + pageStep >= 1 && currentPage + pageStep <= maxPages) {
  100. currentPage = currentPage + pageStep;
  101. let canvas = null;
  102. if (cv) {
  103. canvas = cv;
  104. } else canvas = document.getElementById("myCanvas");
  105. JpcCanvasOutput.cleanCanvas(canvas);
  106. JpcCanvasOutput.drawPageBorder(currentRptTpl, canvas, getScreenDPI());
  107. JpcCanvasOutput.drawToCanvas(pageRst, canvas, currentPage);
  108. }
  109. }
  110. function getDummyExcel() {
  111. let id = "dummy_request_id";
  112. let p1 = "dummy_paramm_2";
  113. let url = "/report_api/getDummyExcel/" + id + "/" + p1;
  114. window.location = url;//这里不能使用get方法跳转,否则下载不成功
  115. }
  116. function getExcel() {
  117. let rpt = document.getElementById("select_k1");
  118. let size = document.getElementById("select_k2");
  119. let rpt_name = rpt.options[rpt.selectedIndex].text;
  120. if (rpt.selectedIndex >= 0 && size.selectedIndex >= 0) {
  121. rpt_id = rpt.options[rpt.selectedIndex].value;
  122. rpt_size = size.options[size.selectedIndex].value;
  123. }
  124. let url = "/report_api/getExcel/" + rpt_id + "/" + rpt_size + "/" + rpt_name + "/" + isOneSheet;
  125. window.location = url;//这里不能使用get方法跳转,否则下载不成功
  126. }
  127. function getExcelInOneBook() {
  128. let rptIds = "2,3";
  129. let size = "A4";
  130. let rpt_name = 'OneBook';
  131. let url = "/report_api/getExcelInOneBook/" + rptIds + "/" + size + "/" + rpt_name;
  132. window.location = url;//这里不能使用get方法跳转,否则下载不成功
  133. }
  134. function getPDF() {
  135. let rpt = document.getElementById("select_k1");
  136. let size = document.getElementById("select_k2");
  137. let rpt_name = rpt.options[rpt.selectedIndex].text;
  138. if (rpt.selectedIndex >= 0 && size.selectedIndex >= 0) {
  139. rpt_id = rpt.options[rpt.selectedIndex].value;
  140. rpt_size = size.options[size.selectedIndex].value;
  141. }
  142. let url = "/report_api/getPDF/" + rpt_id + "/" + rpt_size + "/" + rpt_name;
  143. window.location = url;
  144. }
  145. function ajaxCall() {
  146. if (setupReport()) {
  147. let canvas = document.getElementById("myCanvas");
  148. canvas.style.cursor = "wait";
  149. $.ajax({
  150. type:"POST",
  151. url: 'report_api/getReport',
  152. data: {"ID": rpt_id, "pageSize": rpt_size},
  153. dataType: 'json',
  154. cache: false,
  155. timeout: 15000,
  156. success: function(result){
  157. canvas.style.cursor = "default";
  158. currentPage = 1;
  159. pageRst = result.data;
  160. if (pageRst) {
  161. //console.log(JSON.stringify(pageRst));
  162. maxPages = pageRst.items.length;
  163. currentRptTpl = pageRst;
  164. if (rpt_size === "A4") {
  165. canvas.width = 1200;
  166. canvas.height = 900;
  167. } else if (rpt_size === "A3") {
  168. canvas.width = 1880;
  169. canvas.height = 1200;
  170. }
  171. showPage(0, canvas);
  172. }
  173. },
  174. error: function(jqXHR, textStatus, errorThrown){
  175. canvas.style.cursor = "default";
  176. alert('error ' + textStatus + " " + errorThrown);
  177. }
  178. });
  179. }
  180. }
  181. </script>
  182. </html>