customer_list_export.html 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6. <meta name="viewport" content="width=device-width, initial-scale=1.0">
  7. <title>客户列表导出</title>
  8. <link rel="stylesheet" href="/static/layuiadmin/layui/css/layui.css">
  9. <style>
  10. #loading {
  11. width: 100%;
  12. height: 100%;
  13. background-color: #cdcdcd;
  14. z-index: 99999;
  15. position: fixed;
  16. top: 0px;
  17. opacity: 50%;
  18. text-align: center;
  19. padding-top: 300px;
  20. }
  21. #loading i {
  22. font-size: 50px;
  23. }
  24. table {
  25. display: block;
  26. overflow: auto;
  27. position: relative;
  28. border-collapse: collapse;
  29. }
  30. table thead tr th {
  31. text-align: center;
  32. white-space: nowrap;
  33. }
  34. </style>
  35. </head>
  36. <body>
  37. <div>
  38. <table class="layui-table table_box" id="data-table">
  39. <thead class="tableHeader">
  40. <tr>
  41. {volist name="header" id="h1"}
  42. <th rowspan="{$h1.rowspan??1}" colspan="{$h1.colspan??1}" class="{$h1.class}">{$h1.title|raw}</th>
  43. {/volist}
  44. </tr>
  45. </thead>
  46. <tbody class="table_tbody">
  47. </tbody>
  48. </table>
  49. </div>
  50. <div id="loading">
  51. <i class="layui-icon layui-icon-loading layui-anim layui-anim-rotate layui-anim-loop"></i>
  52. </div>
  53. <script src="/static/layuiadmin/layui/layui.js"></script>
  54. <script>
  55. //IE方法
  56. function getXlsFromTbl(inTblId, inWindow) {
  57. try {
  58. var allStr = "";
  59. var curStr = "";
  60. if (inTblId != null && inTblId != "" && inTblId != "null") {
  61. curStr = getTblData(inTblId, inWindow);
  62. }
  63. if (curStr != null) {
  64. allStr += curStr;
  65. }
  66. else {
  67. alert("你要导出的表不存在");
  68. return;
  69. }
  70. var fileName = getExcelFileName();
  71. doFileExport(fileName, allStr);
  72. }
  73. catch (e) {
  74. alert("导出发生异常:" + e.name + "->" + e.description + "!");
  75. }
  76. }
  77. function getTblData(inTbl, inWindow) {
  78. var rows = 0;
  79. var tblDocument = document;
  80. if (!!inWindow && inWindow != "") {
  81. if (!document.all(inWindow)) {
  82. return null;
  83. }
  84. else {
  85. tblDocument = eval(inWindow).document;
  86. }
  87. }
  88. var curTbl = tblDocument.getElementById(inTbl);
  89. var outStr = "";
  90. if (curTbl != null) {
  91. for (var j = 0; j < curTbl.rows.length; j++) {
  92. for (var i = 0; i < curTbl.rows[j].cells.length; i++) {
  93. if (i == 0 && rows > 0) {
  94. outStr += " t";
  95. rows -= 1;
  96. }
  97. outStr += curTbl.rows[j].cells[i].innerText + "t";
  98. if (curTbl.rows[j].cells[i].colSpan > 1) {
  99. for (var k = 0; k < curTbl.rows[j].cells[i].colSpan - 1; k++) {
  100. outStr += " t";
  101. }
  102. }
  103. if (i == 0) {
  104. if (rows == 0 && curTbl.rows[j].cells[i].rowSpan > 1) {
  105. rows = curTbl.rows[j].cells[i].rowSpan - 1;
  106. }
  107. }
  108. }
  109. outStr += "rn";
  110. }
  111. }
  112. else {
  113. outStr = null;
  114. alert(inTbl + "不存在 !");
  115. }
  116. return outStr;
  117. }
  118. function getExcelFileName() {
  119. var d = new Date();
  120. var curYear = d.getYear();
  121. var curMonth = "" + (d.getMonth() + 1);
  122. var curDate = "" + d.getDate();
  123. var curHour = "" + d.getHours();
  124. var curMinute = "" + d.getMinutes();
  125. var curSecond = "" + d.getSeconds();
  126. if (curMonth.length == 1) {
  127. curMonth = "0" + curMonth;
  128. }
  129. if (curDate.length == 1) {
  130. curDate = "0" + curDate;
  131. }
  132. if (curHour.length == 1) {
  133. curHour = "0" + curHour;
  134. }
  135. if (curMinute.length == 1) {
  136. curMinute = "0" + curMinute;
  137. }
  138. if (curSecond.length == 1) {
  139. curSecond = "0" + curSecond;
  140. }
  141. var fileName = "table" + "_" + curYear + curMonth + curDate + "_"
  142. + curHour + curMinute + curSecond + ".csv";
  143. return fileName;
  144. }
  145. function doFileExport(inName, inStr) {
  146. var xlsWin = null;
  147. if (!!document.all("glbHideFrm")) {
  148. xlsWin = glbHideFrm;
  149. }
  150. else {
  151. var width = 6;
  152. var height = 4;
  153. var openPara = "left=" + (window.screen.width / 2 - width / 2)
  154. + ",top=" + (window.screen.height / 2 - height / 2)
  155. + ",scrollbars=no,width=" + width + ",height=" + height;
  156. xlsWin = window.open("", "_blank", openPara);
  157. }
  158. xlsWin.document.write(inStr);
  159. xlsWin.document.close();
  160. xlsWin.document.execCommand('Saveas', true, inName);
  161. xlsWin.close();
  162. }
  163. //Chrome方法
  164. var idTmr;
  165. function getExplorer() {
  166. var explorer = window.navigator.userAgent;
  167. //ie
  168. if (explorer.indexOf("MSIE") >= 0) {
  169. return 'ie';
  170. }
  171. //firefox
  172. else if (explorer.indexOf("Firefox") >= 0) {
  173. return 'Firefox';
  174. }
  175. //Chrome
  176. else if (explorer.indexOf("Chrome") >= 0) {
  177. return 'Chrome';
  178. }
  179. //Opera
  180. else if (explorer.indexOf("Opera") >= 0) {
  181. return 'Opera';
  182. }
  183. //Safari
  184. else if (explorer.indexOf("Safari") >= 0) {
  185. return 'Safari';
  186. }
  187. }
  188. function method5(tableid) {
  189. if (getExplorer() == 'ie') {
  190. var curTbl = document.getElementById(tableid);
  191. var oXL = new ActiveXObject("Excel.Application");
  192. var oWB = oXL.Workbooks.Add();
  193. var xlsheet = oWB.Worksheets(1);
  194. var sel = document.body.createTextRange();
  195. sel.moveToElementText(curTbl);
  196. sel.select();
  197. sel.execCommand("Copy");
  198. xlsheet.Paste();
  199. oXL.Visible = true;
  200. try {
  201. var fname = oXL.Application.GetSaveAsFilename("Excel.xls", "Excel Spreadsheets (*.xls), *.xls");
  202. } catch (e) {
  203. print("Nested catch caught " + e);
  204. } finally {
  205. oWB.SaveAs(fname);
  206. oWB.Close(savechanges = false);
  207. oXL.Quit();
  208. oXL = null;
  209. idTmr = window.setInterval("Cleanup();", 1);
  210. }
  211. }
  212. else {
  213. tableToExcel(tableid)
  214. }
  215. }
  216. function Cleanup() {
  217. window.clearInterval(idTmr);
  218. CollectGarbage();
  219. }
  220. var tableToExcel = (function () {
  221. var uri = 'data:application/vnd.ms-excel;base64,',
  222. template = '<html xmlns:o="urn:schemas-microsoft-com:office:office" xmlns:x="urn:schemas-microsoft-com:office:excel" xmlns="http://www.w3.org/TR/REC-html40"><head><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet><x:Name>{worksheet}</x:Name><x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet></x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]--><meta http-equiv="content-type" content="text/plain; charset=UTF-8"/></head><body><table>{table}</table></body></html>',
  223. base64 = function (s) { return window.btoa(unescape(encodeURIComponent(s))) },
  224. format = function (s, c) {
  225. return s.replace(/{(\w+)}/g,
  226. function (m, p) { return c[p]; })
  227. }
  228. return function (table, name) {
  229. if (!table.nodeType) table = document.getElementById(table)
  230. var ctx = { worksheet: name || 'Worksheet', table: table.innerHTML }
  231. window.location.href = uri + base64(format(template, ctx))
  232. }
  233. })()
  234. layui.config({
  235. base: '/static/layuiadmin/' //静态资源所在路径
  236. }).extend({
  237. index: 'lib/index' //主入口模块
  238. }).use(['form'], function () {
  239. var $ = layui.$;
  240. var row = eval('{$row|raw}');
  241. var getData = function (page) {
  242. $.ajax({
  243. url: location.href,
  244. data: { page },
  245. success: function (rs) {
  246. console.log(rs)
  247. if (rs.code == 1) {
  248. layer.msg(res.msg);
  249. return;
  250. }
  251. rs.data.forEach(function (item) {
  252. let tr = document.createElement('tr');
  253. row.forEach(function (k) {
  254. let td = document.createElement('td');
  255. td.innerText = item[k.field];
  256. tr.appendChild(td);
  257. })
  258. $('.table_tbody').append(tr);
  259. });
  260. if (page < rs.page) {
  261. page++;
  262. getData(page);
  263. } else {
  264. $('#loading').hide();
  265. method5('data-table');
  266. }
  267. }
  268. });
  269. }
  270. getData(1);
  271. });
  272. </script>
  273. </body>
  274. </html>