LK/income_payments_client
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

[bug] 票据打印

Browse Source
This commit is contained in:
zhaoxiao
2021-11-02 11:40:28 +08:00
parent b8d22247b3
commit dbb9c9c3fd
4 changed files with 230 additions and 4 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/development_address_config.js
+8 -2
View File
@@ -13,8 +13,14 @@ window._CONFIG["casPrefixUrl"] = "http://cas.example.org:8443/cas";
window._CONFIG["onlinePreviewDomainURL"] = "http://localhost:8012/onlinePreview";
// 会议管理报名二维码地址
window._CONFIG['singUpQRCodeURL'] = 'http://localhost:3000/signupentrance'
window._CONFIG["singUpQRCodeURL"] = "http://localhost:3000/signupentrance"
// 签到二维码url
window._CONFIG['signInUrl'] = '/meeting/payMeetingSituation/getSignInPage'
window._CONFIG["signInUrl"] = "/meeting/payMeetingSituation/getSignInPage"
// 票据打印--寄件人单位名称
window._CONFIG["sendCompanyName"] = "中汽标准所"
// 票据打印--寄件人地址
window._CONFIG["sendAddress"] = "天津市东丽区先锋东路68号"
// 票据打印--寄件人邮编
window._CONFIG["sendPostCode"] = "300000"
public/production_address_config.js
+7 -1
View File
@@ -12,5 +12,11 @@ window._CONFIG["casPrefixUrl"] = "http://cas.example.org:8443/cas";
window._CONFIG["onlinePreviewDomainURL"] = "http://10.10.10.46:8012/onlinePreview";
// 会议管理报名二维码地址
window._CONFIG['singUpQRCodeURL'] = 'http://10.10.10.46:8055/signupentrance'
window._CONFIG["singUpQRCodeURL"] = "http://10.10.10.46:8055/signupentrance"
// 票据打印--寄件人单位名称
window._CONFIG["sendCompanyName"] = "中汽标准所"
// 票据打印--寄件人地址
window._CONFIG["sendAddress"] = "天津市东丽区先锋东路68号"
// 票据打印--寄件人邮编
window._CONFIG["sendPostCode"] = "300000"
src/views/mailManagement/BillMail.vue
+15 -1
View File
@@ -87,7 +87,7 @@
</template>
<span slot="print" slot-scope="text, record" class="action-span-cell">
<a-button type="primary" :disabled="record.sendMethod === 2 || record.postStatus === 0">打印</a-button>
<a-button type="primary" :disabled="record.sendMethod === 2 || record.postStatus === 0" @click="goPrint(record)">打印</a-button>
</span>
<span slot="action" slot-scope="text, record" class="action-span-cell">
<a @click="handleAdd(record)" v-if="record.postStatus === 0" v-has="'billMail:mail'">邮寄</a>
@@ -233,6 +233,20 @@ export default {
const com = Number(record.sendMethod) === 1 && 'ems' || 'shunfeng'
window.open(`https://www.kuaidi100.com/chaxun?com=${ com }&nu=${ record.postNo }`)
},
/**
* 打印，新标签打开页面，打印页面
* @param record
*/
goPrint(record) {
console.log(record)
let routerUrl = this.$router.resolve({
path: '/mailManagement/PrintPage',
query: {
record: JSON.stringify(record)
}
})
window.open(routerUrl.href, '_blank')
},
handleAdd: function (record) {
this.$refs.modalForm.add(record, 1)
this.$refs.modalForm.title = '邮寄'
src/views/mailManagement/PrintPage.vue
+200
View File
@@ -0,0 +1,200 @@
<template>
<div>
<div id="needPrint">
<div class="sheet-box">
<div class="sendName">{{ userInfo.realname }}</div>
<div class="sendPhone">{{ userInfo.phone }}</div>
<div class="sendCompanyName">{{ sendCompanyName }}</div>
<div class="sendCode"></div>
<div class="sendAddress">{{ sendAddress }}</div>
<div class="sendPostNo">{{ mailDetail.billNo }}</div>
<div class="sendPostCode">{{ sendPostCode }}</div>
<div class="arriveName">{{ mailDetail.contactName }}</div>
<div class="arrivePhone">{{ mailDetail.contactMobile }}</div>
<div class="arriveCompanyName">{{ mailDetail.chargeCompanyName }}</div>
<div class="arriveCode"></div>
<div class="arriveAddress">{{ mailDetail.chargeCompanyName }}</div>
<div class="arriveCity"></div>
<div class="arrivePostNo">{{ mailDetail.postNo }}</div>
</div>
</div>
</div>
</template>
<script>
import Vue from 'vue'
import { USER_INFO } from '../../store/mutation-types'
export default {
name: 'PrintPage',
data() {
return {
// 邮寄项目信息
mailDetail: {},
// 用户信息
userInfo: {},
sendCompanyName: '',
sendAddress: '',
sendPostCode: ''
}
},
created() {
this.sendCompanyName = window._CONFIG['sendCompanyName']
this.sendAddress = window._CONFIG['sendAddress']
this.sendPostCode = window._CONFIG['sendPostCode']
this.userInfo = Vue.ls.get(USER_INFO)
// 从路由参数获取项目信息
this.mailDetail = JSON.parse(this.$route.query.record)
console.log(this.mailDetail)
},
mounted() {
// 打印
this.print()
},
methods: {
/**
* 打印
*/
print() {
// 获取需要打印部分的dom元素
let printDom = document.getElementById('needPrint').innerHTML
// 保留原始页面dom，打印后可以恢复页面展示（更换为路由跳转新页面后就不用了）
let oldDom = window.document.body.innerHTML
// 将整体dom替换为需要打印的部分
window.document.body.innerHTML = printDom
// 调用页面的打印方法打印整个页面
window.print()
// 恢复原页面显示
window.document.body.innerHTML = oldDom
// 关闭本标签页
window.close()
}
}
}
</script>
<style scoped lang="less">
.sheet-box {
position: relative;
font-size: 10px;
line-height: 12px;
}
#needPrint {
border: black 1px solid;
}
.mail-content {
white-space: pre-wrap;
word-break: break-all;
}
.sendName {
position: absolute;
left: 57pt;
top: 74pt;
}
.sendPhone {
position: absolute;
top: 74pt;
left: 181pt;
}
.sendCompanyName {
position: absolute;
left: 65pt;
top: 94pt;
}
.sendCode {
position: absolute;
left: 236pt;
top: 96pt;
}
.sendAddress {
position: absolute;
left: 48pt;
top: 110pt;
width: 236pt;
word-break: break-all;
white-space: pre-wrap;
}
.sendPostNo {
position: absolute;
left: 64pt;
top: 135pt;
}
.sendPostCode {
position: absolute;
left: 218pt;
top: 134pt;
font-size: 16px;
letter-spacing: 9pt;
}
.arriveName {
position: absolute;
left: 53pt;
top: 163pt;
word-break: break-all;
white-space: pre-wrap;
width: 97pt;
}
.arrivePhone {
position: absolute;
top: 163pt;
left: 183pt;
}
.arriveCompanyName {
position: absolute;
left: 66pt;
top: 180pt;
width: 138pt;
word-break: break-all;
white-space: pre-wrap;
}
.arriveCode {
position: absolute;
left: 240pt;
top: 180pt;
}
.arriveAddress {
position: absolute;
left: 48pt;
top: 195pt;
width: 270pt;
word-break: break-all;
white-space: pre-wrap;
}
.arriveCity {
position: absolute;
left: 69pt;
top: 247pt;
}
.arrivePostNo {
position: absolute;
left: 218pt;
top: 246pt;
font-size: 16px;
letter-spacing: 9pt;
}
</style>