1
0

orderPrint.html 4.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <title>商城票据</title>
  5. #parse("sys/header.html")
  6. </head>
  7. <body class="gray-bg">
  8. <div id="rrapp" v-cloak class="wrapper wrapper-content animated fadeInRight">
  9. <div class="row">
  10. <div class="col-sm-12">
  11. <div class="ibox-content p-xl">
  12. <div class="row">
  13. <div class="col-sm-6">
  14. <address>
  15. <strong>{{order.consignee}}</strong><br>
  16. {{order.address}}<br>
  17. <abbr title="Phone">联系方式:</abbr> {{order.mobile}}<br>
  18. 客户留言:{{order.postscript}}<br>
  19. 送达时间:{{null!=order.deliveryDate?order.deliveryDate:""}} {{null!=order.deliveryRemark?order.deliveryRemark:""}}
  20. </address>
  21. </div>
  22. <div class="col-sm-6 text-right">
  23. <h4>单据编号:</h4>
  24. <h4 class="text-navy">{{order.orderSn}}</h4>
  25. <address>
  26. <strong>商城</strong><br>
  27. 商城地址<br>
  28. <abbr title="Phone">总机:</abbr> (86) xxxxxxxx
  29. </address>
  30. <p>
  31. <span><strong>日期:</strong> {{nowDate}}</span>
  32. </p>
  33. </div>
  34. </div>
  35. <div class="table-responsive m-t">
  36. <table class="table table-hover table-responsive table-bordered">
  37. <thead>
  38. <tr>
  39. <th>清单</th>
  40. <th>数量</th>
  41. <th>单价</th>
  42. <th>总价</th>
  43. </tr>
  44. </thead>
  45. <tbody>
  46. <tr v-for="goods in orderGoods">
  47. <td>
  48. <div><strong>{{goods.goodsName}}</strong>
  49. </div>
  50. </td>
  51. <td>{{goods.number}}</td>
  52. <td>&yen;{{goods.retailPrice}}</td>
  53. <td>&yen;{{goods.retailPrice*goods.number}}</td>
  54. </tr>
  55. </tbody>
  56. </table>
  57. </div>
  58. <table class="table invoice-total">
  59. <tbody>
  60. <tr>
  61. <td><strong>总计</strong>
  62. </td>
  63. <td>&yen;{{sumRetailPrice}}</td>
  64. </tr>
  65. </tbody>
  66. </table>
  67. <div style="float: right;">
  68. <i-button v-if="showBtn" class="btn btn-warning dim" @click="print"><i class="fa fa-print"></i>打印
  69. </i-button>
  70. </div>
  71. </div>
  72. </div>
  73. </div>
  74. </div>
  75. <script type="text/javascript">
  76. let orderId = getQueryString("orderId");
  77. var vm = new Vue({
  78. el: '#rrapp',
  79. data: {
  80. showBtn: true,
  81. order: {},
  82. orderGoods: {},
  83. sumRetailPrice: 0,
  84. nowDate: transDate(new Date())
  85. },
  86. methods: {
  87. print: function () {
  88. confirm('确定连接打票机打印出票?', function () {
  89. $.ajax({
  90. type: "POST",
  91. url: "../order/printMsg",
  92. contentType: "application/json",
  93. data: JSON.stringify(orderId),
  94. success: function (r) {
  95. if (r.ticket != null) {
  96. alert('打印小票完成');
  97. }
  98. }
  99. });
  100. })
  101. }
  102. },
  103. created: function () {
  104. $.get("../order/info/" + orderId, function (r) {
  105. vm.order = r.order;
  106. });
  107. $.get("../ordergoods/queryAll?orderId=" + orderId, function (r) {
  108. vm.orderGoods = r.list;
  109. // debugger;
  110. for (let i = 0; i < r.list.length; i++) {
  111. vm.sumRetailPrice += r.list[i].retailPrice * r.list[i].number
  112. }
  113. });
  114. }
  115. });
  116. </script>
  117. </body>
  118. </html>