rpt_test.html 6.8 KB

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