xieyipdf.html 2.8 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  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>{$info.order_no}</title>
  8. <style>
  9. html, body, div, span, applet, object, iframe,
  10. h1, h2, h3, h4, h5, h6, p, blockquote, pre,
  11. a, abbr, acronym, address, big, cite, code,
  12. del, dfn, em, img, ins, kbd, q, s, samp,
  13. small, strike, sub, sup, tt, var,
  14. u, i, center,
  15. dl, dt, dd, ol, ul, li,
  16. fieldset, form, label, legend,
  17. table, caption, tbody, tfoot, thead, tr, th, td,
  18. article, aside, canvas, details, embed,
  19. figure, figcaption, footer, header, hgroup,
  20. menu, nav, output, ruby, section, summary,
  21. time, mark, audio, video {
  22. margin: 0;
  23. padding: 0;
  24. border: 0;
  25. font-size: 100%;
  26. font: inherit;
  27. vertical-align: baseline;
  28. box-sizing: border-box;
  29. font-family: Source Han Sans CN;
  30. }
  31. .page{
  32. padding: 15px;
  33. font-size: 14px;
  34. line-height: 16px;
  35. color:#333;
  36. }
  37. .hide-on-print {
  38. display: block;
  39. text-align: right;
  40. padding: 15px;
  41. }
  42. .realname {
  43. display: block;
  44. text-align: right;
  45. padding: 15px;
  46. }
  47. /* 打印时隐藏 */
  48. @media print {
  49. .hide-on-print {
  50. display: none;
  51. }
  52. }
  53. </style>
  54. </head>
  55. <body style="width: 760px;margin: 0 auto">
  56. <div class="hide-on-print">
  57. <button type="button" onclick="printPage()" class="btn btn-primary dropdown-toggle">导出PDF</button>
  58. </div>
  59. <div class="page">
  60. {$content}
  61. </div>
  62. <div class="realname">
  63. 姓名:{$info.realname}
  64. </div>
  65. </body>
  66. </html>
  67. <script src="/assets/js/jquery-3.1.1.min.js"></script>
  68. <script>
  69. //打印ctrl+P
  70. function printPage() {
  71. window.print();
  72. }
  73. function replaceDetail(){
  74. var details = $('.page').html();
  75. //newContent仅是details替换后内容;
  76. let newContent = details.replace(/<img[^>]*>/gi, function (match, capture) { //去除三标签
  77. match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, '');
  78. match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, '');
  79. match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, '');
  80. return match;
  81. });
  82. newContent = newContent.replace(/<br[^>]*\/>/gi, '');
  83. newContent = newContent.replace(/<img/gi, '<img style="max-width:100%;height:auto;display:block;margin:0 auto;"');
  84. $('.page').html('');
  85. $('.page').html(newContent);
  86. }
  87. replaceDetail();
  88. </script>