Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
59941756 by renchao@pashanhoo.com
Options

style:证书预览打印

1 parent c47d1fe2
Inline Side-by-side
Showing 3 changed files with 74 additions and 118 deletions
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-30 10:36:11
* @LastEditTime: 2023-08-30 17:18:41
-->
<template>
<div>
......@@ -22,17 +22,9 @@
</el-select>
</el-form-item>
</el-form>
<el-tabs v-model="activeName" @tab-click="handleClick" v-if="headTabBdcqz.length >1">
<el-tab-pane :label="item.qlr + (item.bdcqzh !== null ? '(' + item.bdcqzh + ')' : '')" :name="item.bsmBdcqz"
v-for="(item, index) in headTabBdcqz" :key="index">
</el-tab-pane>
</el-tabs>
<el-empty description="暂无数据" v-if="headTabBdcqz.length == 0 && noData"></el-empty>
<div class="zs-content">
<canvas ref="zs" width="1000" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx==1" height="700"></canvas>
<canvas ref="zm" width="1180" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx!=1" height="780"></canvas>
<canvas ref="zs" width="1000" v-show="this.formData.bdcqz.bdcqzlx==1" height="700"></canvas>
<canvas ref="zm" width="1180" v-show="this.formData.bdcqz.bdcqzlx==2" height="780"></canvas>
</div>
</div>
<!-- 打印模板需要此模块 -->
......@@ -65,7 +57,6 @@
return {
key: 0,
// 不动产证书图片地址
noData: false,
imgSrc: require('@/image/bdcqz/bdcqzs2.jpg'),
bdczmSrc: require('@/image/bdcqz/bdczm.jpg'),
loading: false,
......@@ -74,8 +65,6 @@
ysxlh: [],
//列名称对象
columns: [],
//tab切换栏数组
headTabBdcqz: [],
//tab选择绑定值
activeName: '',
ruleForm: {
......@@ -92,11 +81,15 @@
}
}
},
created () {
mounted () {
store.dispatch('user/refreshPage', false)
this.columns = datas.columns()
this.ysxlhList()
this.getHeadTabBdcqz()
if (this.formData.bdcqz.bdcqzlx == 1) {
this.drawTextOnImage()
} else {
this.drawTextzmImage()
}
},
methods: {
/**
......@@ -111,43 +104,6 @@
})
},
/**
* @description: 获取受理申请下全部不动产权证
* @author: renchao
*/
getHeadTabBdcqz () {
this.loading = true
getSlsqBdcqzList({ bsmSlsq: this.formData.bsmSlsq }).then(res => {
if (res.code == 200) {
this.noData = true
if (res.result && res.result.length > 0) {
this.activeName = res.result[0].bsmBdcqz
this.bdcqz = res.result[0]
this.headTabBdcqz = res.result
if (res.result[0].bdcqzlx == 1) {
this.drawTextOnImage()
} else {
this.drawTextzmImage()
}
}
}
this.loading = false
})
},
/**
* @description: tab表头切换方法
* @param {*} e
* @author: renchao
*/
handleClick (e) {
this.bdcqz = this.headTabBdcqz[e.index - 0]
this.activeName = this.headTabBdcqz.bsmBdcqz
if (this.bdcqz.bdcqzlx == 1) {
this.drawTextOnImage()
} else {
this.drawTextzmImage()
}
},
/**
* @description: 不动产证书
* @author: renchao
*/
......@@ -172,25 +128,25 @@
context.drawImage(image, 0, 0);
context.font = '16px 楷体';
context.fillStyle = '#000000';
context.fillText(this.bdcqz.sjjc ? this.bdcqz.sjjc : '', 60, 56);
context.fillText(this.bdcqz.djnd ? this.bdcqz.djnd : '', 113, 56);
context.fillText(this.bdcqz.sxqc ? this.bdcqz.sxqc : '', 180, 56);
context.fillText(this.bdcqz.sxh ? this.bdcqz.sxh : '', 370, 56);
context.fillText(this.bdcqz.qlr ? this.bdcqz.qlr : '', 129, 97);
context.fillText(this.bdcqz.gyqk ? this.bdcqz.gyqk : '', 129, 136);
context.fillText(this.formData.bdcqz.sjjc ? this.formData.bdcqz.sjjc : '', 60, 56);
context.fillText(this.formData.bdcqz.djnd ? this.formData.bdcqz.djnd : '', 113, 56);
context.fillText(this.formData.bdcqz.sxqc ? this.formData.bdcqz.sxqc : '', 180, 56);
context.fillText(this.formData.bdcqz.sxh ? this.formData.bdcqz.sxh : '', 370, 56);
context.fillText(this.formData.bdcqz.qlr ? this.formData.bdcqz.qlr : '', 129, 97);
context.fillText(this.formData.bdcqz.gyqk ? this.formData.bdcqz.gyqk : '', 129, 136);
this.bdcdyh = this.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.bdcqz.bdcdyh.slice(19, this.bdcqz.bdcdyh.length)
this.bdcdyh = this.formData.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.formData.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.formData.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.formData.bdcqz.bdcdyh.slice(19, this.formData.bdcqz.bdcdyh.length)
context.fillText(this.bdcdyh ? this.bdcdyh : '', 129, 223);
context.fillText(this.bdcqz.qllx ? this.bdcqz.qllx : '', 129, 263);
context.fillText(this.bdcqz.qlxz ? this.bdcqz.qlxz : '', 129, 303);
context.fillText(this.bdcqz.yt ? this.bdcqz.yt : '', 129, 346);
// context.fillText(this.bdcqz.mj ? this.bdcqz.mj : '', 129, 386);
let lines6 = this.bdcqz.mj ? this.bdcqz.mj.split(' ') : [];
if (getByteLen(this.bdcqz.mj) > 41) {
context.fillText(this.formData.bdcqz.qllx ? this.formData.bdcqz.qllx : '', 129, 263);
context.fillText(this.formData.bdcqz.qlxz ? this.formData.bdcqz.qlxz : '', 129, 303);
context.fillText(this.formData.bdcqz.yt ? this.formData.bdcqz.yt : '', 129, 346);
// context.fillText(this.formData.bdcqz.mj ? this.formData.bdcqz.mj : '', 129, 386);
let lines6 = this.formData.bdcqz.mj ? this.formData.bdcqz.mj.split(' ') : [];
if (getByteLen(this.formData.bdcqz.mj) > 41) {
lines6.forEach((line, index) => {
const y = 378 + (index * 27); // 每行文本的垂直位置
let currentLine = '';
......@@ -233,7 +189,7 @@
}
// 权利其他状态
const maxWidth = 332; // 最大宽度限制
let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split('\n') : [];
let lines = this.formData.bdcqz.qlqtzk ? this.formData.bdcqz.qlqtzk.split('\n') : [];
for (let i = 0; i < lines.length; i++) {
let num = Math.ceil(getByteLen(lines[i]) / 41)
if (getByteLen(lines[i]) > 41) {
......@@ -268,7 +224,7 @@
}
}
let lines1 = this.bdcqz.fj ? this.bdcqz.fj.split('\n') : [];
let lines1 = this.formData.bdcqz.fj ? this.formData.bdcqz.fj.split('\n') : [];
lines1.forEach((line, index) => {
const y = 100 + (index * 30); // 每行文本的垂直位置
let currentLine = '';
......@@ -288,8 +244,8 @@
context.fillText(line, 580, y + (index * 30)); // 调整行高
})
})
let lines3 = this.bdcqz.syqx ? this.bdcqz.syqx.split(' ') : [];
if (getByteLen(this.bdcqz.syqx) > 41) {
let lines3 = this.formData.bdcqz.syqx ? this.formData.bdcqz.syqx.split(' ') : [];
if (getByteLen(this.formData.bdcqz.syqx) > 41) {
lines3.forEach((line, index) => {
const y = 423 + (index * 27); // 每行文本的垂直位置
let currentLine = '';
......@@ -331,8 +287,8 @@
})
}
let lines2 = this.bdcqz.zl ? this.bdcqz.zl.split(' ') : [];
if (getByteLen(this.bdcqz.zl) > 41) {
let lines2 = this.formData.bdcqz.zl ? this.formData.bdcqz.zl.split(' ') : [];
if (getByteLen(this.formData.bdcqz.zl) > 41) {
lines2.forEach((line, index) => {
const y = 170 + (index * 20); // 每行文本的垂直位置
let currentLine = '';
......@@ -403,25 +359,25 @@
context.font = '16px 楷体';
context.fillStyle = '#000000';
// ysxlh
context.fillText(this.bdcqz.ysxlh ? this.bdcqz.ysxlh : '', 280, 712);
context.fillText(this.formData.bdcqz.ysxlh ? this.formData.bdcqz.ysxlh : '', 280, 712);
// djsj
if (this.bdcqz.djsj) {
let djsjList = this.bdcqz.djsj.split(' ')[0].split('/')
if (this.formData.bdcqz.djsj) {
let djsjList = this.formData.bdcqz.djsj.split(' ')[0].split('/')
context.fillText(djsjList[0] ? djsjList[0] : '', 327, 580);
context.fillText(djsjList[1] ? djsjList[1] : '', 393, 580);
context.fillText(djsjList[2] ? djsjList[2] : '', 443, 580);
}
context.fillText(this.bdcqz.sjjc ? this.bdcqz.sjjc : '', 620, 125);
context.fillText(this.bdcqz.djnd ? this.bdcqz.djnd : '', 665, 125);
context.fillText(this.bdcqz.sxqc ? this.bdcqz.sxqc : '', 750, 125);
context.fillText(this.bdcqz.sxh ? this.bdcqz.sxh : '', 960, 123);
context.fillText(this.bdcqz.zmqlhsx ? this.bdcqz.zmqlhsx : '', 775, 180);
context.fillText(this.bdcqz.qlr ? this.bdcqz.qlr : '', 775, 228);
context.fillText(this.formData.bdcqz.sjjc ? this.formData.bdcqz.sjjc : '', 620, 125);
context.fillText(this.formData.bdcqz.djnd ? this.formData.bdcqz.djnd : '', 665, 125);
context.fillText(this.formData.bdcqz.sxqc ? this.formData.bdcqz.sxqc : '', 750, 125);
context.fillText(this.formData.bdcqz.sxh ? this.formData.bdcqz.sxh : '', 960, 123);
context.fillText(this.formData.bdcqz.zmqlhsx ? this.formData.bdcqz.zmqlhsx : '', 775, 180);
context.fillText(this.formData.bdcqz.qlr ? this.formData.bdcqz.qlr : '', 775, 228);
// 义务人
context.fillText(this.bdcqz.ywr ? this.bdcqz.ywr : '', 775, 275);
// context.fillText(this.bdcqz.zl ? this.bdcqz.zl : '', 775, 325);
let lines2 = this.bdcqz.zl ? this.bdcqz.zl.split(' ') : [];
if (getByteLen(this.bdcqz.zl) > 41) {
context.fillText(this.formData.bdcqz.ywr ? this.formData.bdcqz.ywr : '', 775, 275);
// context.fillText(this.formData.bdcqz.zl ? this.formData.bdcqz.zl : '', 775, 325);
let lines2 = this.formData.bdcqz.zl ? this.formData.bdcqz.zl.split(' ') : [];
if (getByteLen(this.formData.bdcqz.zl) > 41) {
lines2.forEach((line, index) => {
const y = 315 + (index * 20); // 每行文本的垂直位置
let currentLine = '';
......@@ -463,12 +419,12 @@
})
}
// bdcdyh
this.bdcdyh = this.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.bdcqz.bdcdyh.slice(19, this.bdcqz.bdcdyh.length)
this.bdcdyh = this.formData.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.formData.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.formData.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.formData.bdcqz.bdcdyh.slice(19, this.formData.bdcqz.bdcdyh.length)
context.fillText(this.bdcdyh ? this.bdcdyh : '', 775, 373);
// qlqtzk
const maxWidth = 295; // 最大宽度限制
let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split('\n') : [];
let lines = this.formData.bdcqz.qlqtzk ? this.formData.bdcqz.qlqtzk.split('\n') : [];
for (let i = 0; i < lines.length; i++) {
let num = Math.ceil(getByteLen(lines[i]) / 41)
if (getByteLen(lines[i]) > 41) {
......@@ -503,7 +459,7 @@
}
}
// fj
let lines1 = this.bdcqz.fj ? this.bdcqz.fj.split('\n') : [];
let lines1 = this.formData.bdcqz.fj ? this.formData.bdcqz.fj.split('\n') : [];
for (let i = 0; i < lines1.length; i++) {
let num = Math.ceil(getByteLen(lines1[i]) / 41)
if (getByteLen(lines1[i]) > 41) {
......@@ -560,18 +516,18 @@
certificate(this.ruleForm).then((res) => {
if (res.code === 200) {
that.$popupCacel()
if (this.bdcqz.bdcqzlx == 1) {
if (this.formData.bdcqz.bdcqzlx == 1) {
getPrintTemplateByCode({ tmpno: 'zsdy' }).then(res => {
if (res.code == 200) {
//打开模板设计
let LODOP = getLodop(document.getElementById('LODOP_OB'), document.getElementById('LODOP_EM'));
LODOP.ADD_PRINT_DATA("ProgramData", res.result.tmpcontent); //装载模板
this.bdcqz.bdcdyh1 = this.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.bdcqz.bdcdyh.slice(19, this.bdcqz.bdcdyh.length)
this.formData.bdcqz.bdcdyh1 = this.formData.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.formData.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.formData.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.formData.bdcqz.bdcdyh.slice(19, this.formData.bdcqz.bdcdyh.length)
//todo 调取后端接口获取数据 循环set
for (let key in this.bdcqz) {
LODOP.SET_PRINT_STYLEA(key, "CONTENT", this.bdcqz[key]);
for (let key in this.formData.bdcqz) {
LODOP.SET_PRINT_STYLEA(key, "CONTENT", this.formData.bdcqz[key]);
}
LODOP.PREVIEW();
that.$popupCacel()
......@@ -587,14 +543,14 @@
LODOP.ADD_PRINT_DATA("ProgramData", res.result.tmpcontent); //装载模板
// 年月日
this.bdcqz.nian = this.bdcqz.djsj.split(' ')[0].split('/')[0]
this.bdcqz.yue = this.bdcqz.djsj.split(' ')[0].split('/')[1]
this.bdcqz.ri = this.bdcqz.djsj.split(' ')[0].split('/')[1]
this.bdcqz.bdcdyh1 = this.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.bdcqz.bdcdyh.slice(19, this.bdcqz.bdcdyh.length)
this.formData.bdcqz.nian = this.formData.bdcqz.djsj.split(' ')[0].split('/')[0]
this.formData.bdcqz.yue = this.formData.bdcqz.djsj.split(' ')[0].split('/')[1]
this.formData.bdcqz.ri = this.formData.bdcqz.djsj.split(' ')[0].split('/')[1]
this.formData.bdcqz.bdcdyh1 = this.formData.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.formData.bdcqz.bdcdyh.slice(6, 12) + ' ' +
this.formData.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.formData.bdcqz.bdcdyh.slice(19, this.formData.bdcqz.bdcdyh.length)
//todo 调取后端接口获取数据 循环set
for (let key in this.bdcqz) {
LODOP.SET_PRINT_STYLEA(key, "CONTENT", this.bdcqz[key]);
for (let key in this.formData.bdcqz) {
LODOP.SET_PRINT_STYLEA(key, "CONTENT", this.formData.bdcqz[key]);
}
LODOP.PREVIEW();
that.$popupCacel()
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-30 10:33:52
* @LastEditTime: 2023-08-30 17:07:26
-->
<template>
<div class="from-clues loadingtext" v-Loading="loading" element-loading-text="拼命加载中..." style="height:720px;text-align: center;">
......@@ -13,8 +13,8 @@
</el-tabs>
<el-empty description="暂无数据" v-if="headTabBdcqz.length == 0 && noData"></el-empty>
<div style="width:1180px;">
<canvas ref="zs" width="1000" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx==1" height="700"></canvas>
<canvas ref="zm" width="1180" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx!=1" height="780"></canvas>
<canvas ref="zs" width="1000" v-show="this.bdcqz.bdcqzlx==1" height="700"></canvas>
<canvas ref="zm" width="1180" v-show="this.bdcqz.bdcqzlx==2" height="780"></canvas>
</div>
</div>
</template>
......@@ -93,7 +93,7 @@
this.activeName = res.result[0].bsmBdcqz
this.bdcqz = res.result[0]
this.headTabBdcqz = res.result
if (res.result[0].bdcqzlx == 1) {
if (this.bdcqz.bdcqzlx == 1) {
this.drawTextOnImage()
} else {
this.drawTextzmImage()
......@@ -108,9 +108,8 @@
* @param {*} e
* @author: renchao
*/
handleClick (e) {
this.bdcqz = this.headTabBdcqz[e.index - 0]
this.activeName = this.headTabBdcqz.bsmBdcqz
handleClick (tab, event) {
this.bdcqz = this.headTabBdcqz[tab.index]
if (this.bdcqz.bdcqzlx == 1) {
this.drawTextOnImage()
} else {
......@@ -461,19 +460,20 @@
arr.push(currentLine);
if (i > 0) {
arr.forEach((line, index) => {
context.fillText(line, 770, 438 + (23 * (i - 1)) + 5 * num + (index * 18)); // 调整行高
context.fillText(line, 770, 428 + (23 * (i - 1)) + 5 * num + (index * 14)); // 调整行高
})
} else {
arr.forEach((line, index) => {
context.fillText(line, 770, 438 + (23 * (i - 1)) + (index * 18)); // 调整行高
context.fillText(line, 770, 428 + (23 * (i - 1)) + (index * 14)); // 调整行高
})
}
} else {
if (i > 0) {
context.fillText(lines[i] ? lines[i] : '', 770, 450 + 5 * num + (23 * (i - 1)));
} else {
context.fillText(lines[i] ? lines[i] : '', 770, 450 + (23 * (i - 1)));
}
context.fillText(lines[i] ? lines[i] : '', 770, 440 + 4 * num + (22 * (i - 1)));
// if (i > 0) {
// context.fillText(lines[i] ? lines[i] : '', 770, 440 + 5 * num + (23 * (i - 1)));
// } else {
// context.fillText(lines[i] ? lines[i] : '', 770, 440 + (23 * (i - 1)));
// }
}
}
// fj
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-08-29 10:03:25
* @LastEditTime: 2023-08-30 16:54:26
-->
<template>
<div class="szxx">
......@@ -136,7 +136,7 @@
store.dispatch('user/reWorkFresh', false)
if (type == 1) {
//证书预览
this.$popupDialog("证书预览", "workflow/components/dialog/zsyl", { bdcqz: item, bsmSlsq: this.$route.query.bsmSlsq }, "76%", true);
this.$popupDialog("证书证明预览", "workflow/components/dialog/zsyl", { bdcqz: item, bsmSlsq: this.$route.query.bsmSlsq }, "76%", true);
} else {
this.$popupDialog("证书证明打印", "workflow/components/dialog/zsdy", { bdcqz: item, bsmSlsq: this.$route.query.bsmSlsq }, "76%", true);
}
......