printModel.vue 5.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147
  1. <template>
  2. <!-- 发货打印 -->
  3. <div>
  4. <div id="sendGood-print" v-if="financeBookList&&financeBookList.length">
  5. <div
  6. v-for="(fcItem,index) in financeBookList"
  7. :key="index+'-fcitem'"
  8. style="width: 562pt;margin:0 auto;font-size:14px;"
  9. >
  10. <table
  11. ref="printBox"
  12. cellspacing="0"
  13. cellpadding="0"
  14. style="border-collapse: collapse;width: 562pt;margin:0 auto;font-size:14px;"
  15. <tr>
  16. <td>
  17. <div class="print-box" style="width: 562pt;margin:0 auto;">
  18. <h1 style="text-align:center;margin:0.2cm 0">收款通知单</h1>
  19. <div>
  20. <div>
  21. <table border="1" style="width: 562pt;border-collapse: collapse;text-align: center;">
  22. <tr>
  23. <th style="line-height: 20pt;width: 52pt;background:#f6f6f6;">日期</th>
  24. <th style="line-height: 20pt;width: 80pt;background:#f6f6f6;">客户名称</th>
  25. <th style="line-height: 20pt;width: 60pt;background:#f6f6f6;">订单金额</th>
  26. <th style="line-height: 20pt;width: 60pt;background:#f6f6f6;">收款金额</th>
  27. <th style="line-height: 20pt;width: 60pt;background:#f6f6f6;">使用授信</th>
  28. <th style="line-height: 20pt;width: 60pt;background:#f6f6f6;">余款抵扣</th>
  29. <th style="line-height: 20pt;width: 60pt;background:#f6f6f6;">汇入银行</th>
  30. <th style="line-height: 20pt;width: 60pt;background:#f6f6f6;">足额打款</th>
  31. <th style="line-height: 20pt;width: 70pt;background:#f6f6f6;">说明</th>
  32. </tr>
  33. <tr v-for="item in fcItem.subList" :key="item.bookDetailSn">
  34. <td style="padding:3pt;width: 46pt;">{{ moment(item.receiptDate).format('M月D日') }}</td>
  35. <td style="padding:3pt;width: 74pt;text-align:left;">
  36. {{ item.payerName }}
  37. <div>
  38. {{ item.dealerEntity ? item.dealerEntity.kdMidCustomerFnumber : '' }}
  39. </div>
  40. </td>
  41. <td style="padding:3pt;width: 54pt;text-align:center;">
  42. {{ item.orderAmount?item.orderAmount.toFixed(2):'0.00' }}
  43. </td>
  44. <td style="padding:3pt;width: 54pt;text-align:center;">
  45. {{ item.receiptAmount?item.receiptAmount.toFixed(2):'0.00' }}
  46. </td>
  47. <td style="padding:3pt;width: 54pt;text-align:center;">
  48. {{ getTotal(item.detailItemUseList||[]) }}
  49. </td>
  50. <td style="padding:3pt;width: 54pt;text-align:center;">
  51. {{ item.balanceAmount?item.balanceAmount.toFixed(2):'0.00' }}
  52. </td>
  53. <td style="padding:3pt;width: 54pt;">
  54. {{ item.bankAccount }}<br>
  55. {{ item.bankName }}
  56. </td>
  57. <td style="padding:3pt;width: 54pt;">{{ item.fullPaymentFlagDictValue }}</td>
  58. <td style="padding:3pt;width: 84pt;word-break:break-all;">{{ item.remarks }}</td>
  59. </tr>
  60. </table>
  61. <div style="line-height: 30pt;border-bottom: 1px solid #666;">使用授信明细:{{ fcItem.detail||'--' }}</div>
  62. <div style="line-height: 30pt;" v-if="fcItem.audit&&fcItem.audit.taskVOList">
  63. 审批人员:
  64. <span v-for="audit in fcItem.audit.taskVOList" :key="audit.processInstanceId">
  65. {{ audit.userName }}({{ audit.state }});
  66. </span>
  67. </div>
  68. <div style="line-height: 30pt;" v-else>
  69. 审批人员:--
  70. </div>
  71. </div>
  72. </div>
  73. </div>
  74. </td>
  75. </tr>
  76. </table>
  77. <div
  78. style="page-break-after:always"
  79. v-if="(index+1)%2==0">&nbsp;</div>
  80. </div>
  81. </div>
  82. <div class="btn-box" style="display:flex;align-item:center;justify-content: center;">
  83. <a-button @click="handleCommonCancel">取消</a-button>
  84. <a-button :loading="spinning" type="primary" @click="handleCommonOk">立即打印</a-button>
  85. </div>
  86. </div>
  87. </template>
  88. <script>
  89. import { jGPrint } from '@/libs/JGPrint.js'
  90. import moment from 'moment'
  91. export default {
  92. data () {
  93. return {
  94. spinning: false,
  95. detail: null,
  96. financeBookList: [],
  97. printNums: []
  98. }
  99. },
  100. methods: {
  101. moment,
  102. getTotal (data) {
  103. let ret = 0
  104. data.map(item => {
  105. ret = ret + item.itemAmount
  106. delete item.id
  107. })
  108. return ret.toFixed(2)
  109. },
  110. handleCommonOk () {
  111. const _this = this
  112. const html = document.getElementById('sendGood-print').innerHTML
  113. _this.spinning = true
  114. // html, type, callback, printLogParams
  115. jGPrint(html, 'preview', function (res) {
  116. _this.spinning = false
  117. _this.handleCommonCancel()
  118. _this.$emit('printOk')
  119. }, this.printNums)
  120. },
  121. getData (data, list) {
  122. console.log(data)
  123. this.financeBookList = data
  124. list.map(item => {
  125. this.printNums.push({
  126. billType: 'FINANCE_BOOK_DETAIL',
  127. billSn: item.bookDetailSn,
  128. billNo: item.bookNo
  129. })
  130. })
  131. },
  132. handleCommonCancel () {
  133. this.$emit('cancel')
  134. this.clearData()
  135. },
  136. clearData () {
  137. this.detail = null
  138. this.financeBookList = []
  139. this.printNums = []
  140. }
  141. }
  142. }
  143. </script>
  144. <style>
  145. </style>