打印机显示自定义流水号

src/api/property/pay.js

@@ -79,4 +79,13 @@ export function getCountMoney (params) {
 		method: 'get',
 		params: params
 	})
+}
+
+// 获取顺序号
+export function getNextsnr(params){
+  return request({
+		url: '/admin/snrtab/nextsnr',
+		method: 'get',
+		params: params
+	})
 }

src/components/receiptPrinting.vue

@@ -2,6 +2,7 @@
   <div id="app">
     <p id="title"><e>物业费收款收据</e></p>
     <p class="serialnumber">{{ data.contracttab.serialnumber }}</p>
+    <p class="printSerialNumber">{{ printSerialNumber }}</p>
     <p id="details-wrap">
       <span style="width: 181px"><e>小区楼名称：</e>{{ data.cidName }}</span>
       <span style="width: 113px"><e>楼楼号：</e>{{ data.propertyid }}</span>
@@ -89,12 +90,15 @@ export default {
       default: {
         contracttab: {}
       }
+    },
+    printSerialNumber:{
+      default:''
     }
   },
   watch: {
     data: {
       handler(newData) {
-        console.log(JSON.stringify(newData));
+        console.log(newData);
       },
       immediate: true,
       deep: true
@@ -180,6 +184,11 @@ span {
   top: 70px;
   left: 70px;
 }
+.printSerialNumber {
+  position: absolute;
+  top: 70px;
+  right: 70px;
+}
 #details-wrap {
   margin-top: 37px;
   margin-bottom: 5px;

src/views/property/otherPay.vue

@@ -102,7 +102,7 @@
                    :disabled="!data.charge_money > 0"
                    :loading="loading"
                    @click="payEvent">缴费</el-button>
-        <el-button v-print="'#data'"
+        <el-button @click="getNextsnr" v-print="'#data'"
                    style="margin-left:80px"
                    type="primary"> 打印 </el-button>
       </div>
@@ -117,14 +117,15 @@
       </mailtable>
     </div>
     <div id="data">
-      <ReceiptPrinting :data="receiptDetails" />
+      <ReceiptPrinting :printSerialNumber="printSerialNumber" :data="receiptDetails" />
     </div>
   </div>
 </template>
 <script>
 import mailTable from '@/components/ColumnTable/tableComponent'
 import ReceiptPrinting from '@/components/receiptPrinting.vue';
-import { getCharge, addCharge } from '@/api/property/otherPay'
+import { getCharge, addCharge } from '@/api/property/otherPay';
+import { getNextsnr } from '@/api/property/pay'
 export default {
   name: 'OtherPay',
   components: {
@@ -133,6 +134,7 @@ export default {
   },
   data() {
     return {
+      printSerialNumber:'',
       receiptDetails:{},
       // 查询参数
       queryParams: {
@@ -169,8 +171,14 @@ export default {
     this.getStanderOne({ statid: 'FEE_TYPE' }).then((res) => {
       this.typeArray = res.data
     })
+    this.getNextsnr();
   },
   methods: {
+    getNextsnr(){
+      getNextsnr({snrid:'printId'}).then(({data})=>{
+        this.printSerialNumber=data;
+      })
+    },
     handleQuery() {
       getCharge(this.queryParams).then((res) => {
         this.getTableData(res.data)

src/views/property/pay.vue

@@ -340,7 +340,7 @@
           @click="payEvent"
           >缴费</el-button
         >
-        <el-button v-print="'#data'" style="margin-left: 80px" :disabled="!receiptDetails.contracttab || !receiptDetails.contracttab.serialnumber" type="primary">
+        <el-button @click="getNextsnr" v-print="'#data'" style="margin-left: 80px" :disabled="!receiptDetails.contracttab || !receiptDetails.contracttab.serialnumber" type="primary">
           打印
         </el-button>
       </div>
@@ -369,7 +369,7 @@
       </mailTable>
     </div>
     <div id="data">
-      <ReceiptPrinting v-if="receiptDetails && receiptDetails.contracttab && receiptDetails.contracttab.serialnumber" :data="receiptDetails" />
+      <ReceiptPrinting v-if="receiptDetails && receiptDetails.contracttab && receiptDetails.contracttab.serialnumber" :printSerialNumber="printSerialNumber" :data="receiptDetails" />
     </div>
   </div>
 </template>
@@ -382,7 +382,8 @@ import {
   getAccesscardTab,
   getCarportTab,
   addContract,
-	getCountMoney
+	getCountMoney,
+  getNextsnr
 } from '@/api/property/pay'
 export default {
   name: 'Pay',
@@ -392,6 +393,7 @@ export default {
   },
   data() {
     return {
+      printSerialNumber:'',
 			fewMonths: 0, // 月数
 			fewDays: '', // 天数
 			ratesDay: '', // 收费标准-1天-1平米
@@ -489,6 +491,12 @@ export default {
     //     this.ratesDay = '' // input 框绑定的内容为空
     //   }
 		// },
+    getNextsnr(){
+      getNextsnr({snrid:'printId'}).then(({data})=>{
+        this.printSerialNumber=data;
+      })
+    },
+    
 		handleBeginChange(value) {
 			let endTime = this.createBeginDate(this.queryParams.begindate,parseInt(this.fewMonths))
 			let newEndTime = moment(endTime).add(this.fewDays,'d').format('YYYY-MM-DD')
@@ -761,6 +769,9 @@ export default {
       })
     }
   },
+  created(){
+    this.getNextsnr();
+  }
 }
 </script>
 

src/views/property/payCopy.vue

@@ -327,7 +327,7 @@
           @click="payEvent"
           >缴费</el-button
         >
-        <el-button v-print="'#data'" style="margin-left: 80px" :disabled="!receiptDetails.contracttab || !receiptDetails.contracttab.serialnumber" type="primary">
+        <el-button  @click="getNextsnr" v-print="'#data'" style="margin-left: 80px" :disabled="!receiptDetails.contracttab || !receiptDetails.contracttab.serialnumber" type="primary">
           打印
         </el-button>
       </div>
@@ -356,13 +356,14 @@
       </mailTable>
     </div>
     <div id="data">
-      <ReceiptPrinting :data="receiptDetails" />
+      <ReceiptPrinting :printSerialNumber="printSerialNumber" :data="receiptDetails" />
     </div>
   </div>
 </template>
 <script>
 import mailTable from '@/components/ColumnTable/tableComponent';
 import ReceiptPrinting from '@/components/receiptPrinting.vue';
+import { getNextsnr } from '@/api/property/pay'
 import moment from 'moment'
 import {
   getPropertyTab,
@@ -379,6 +380,7 @@ export default {
   },
   data() {
     return {
+      printSerialNumber:'',
 			fewMonths: 0, // 月数
 			fewDays: '', // 天数
 			ratesDay: '', // 收费标准-1天-1平米
@@ -476,6 +478,11 @@ export default {
     //     this.ratesDay = '' // input 框绑定的内容为空
     //   }
 		// },
+    getNextsnr(){
+      getNextsnr({snrid:'printId'}).then(({data})=>{
+        this.printSerialNumber=data;
+      })
+    },
 		handleBeginChange(value) {
 			let endTime = this.createBeginDate(this.queryParams.begindate,parseInt(this.fewMonths))
 			let newEndTime = moment(endTime).add(this.fewDays,'d').format('YYYY-MM-DD')
@@ -724,6 +731,9 @@ export default {
       })
     }
   },
+  created(){
+    this.getNextsnr();
+  }
 }
 </script>