style:证书预览模块功能的完善
Showing
3 changed files
with
61 additions
and
21 deletions
| 1 | <!-- | 1 | <!-- |
| 2 | * @Description: | 2 | * @Description: |
| 3 | * @Autor: renchao | 3 | * @Autor: renchao |
| 4 | * @LastEditTime: 2023-08-21 10:35:58 | 4 | * @LastEditTime: 2023-08-22 16:15:45 |
| 5 | --> | 5 | --> |
| 6 | <template> | 6 | <template> |
| 7 | <div class="from-clues loadingtext" v-Loading="loading" element-loading-text="拼命加载中..." style="height:720px;text-align: center;"> | 7 | <div class="from-clues loadingtext" v-Loading="loading" element-loading-text="拼命加载中..." style="height:720px;text-align: center;"> |
| ... | @@ -12,9 +12,11 @@ | ... | @@ -12,9 +12,11 @@ |
| 12 | </el-tab-pane> | 12 | </el-tab-pane> |
| 13 | </el-tabs> | 13 | </el-tabs> |
| 14 | <el-empty description="暂无数据" v-if="headTabBdcqz.length == 0 && noData"></el-empty> | 14 | <el-empty description="暂无数据" v-if="headTabBdcqz.length == 0 && noData"></el-empty> |
| 15 | <div style="width:1180px;"> | ||
| 15 | <canvas ref="zs" width="1000" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx==1" height="700"></canvas> | 16 | <canvas ref="zs" width="1000" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx==1" height="700"></canvas> |
| 16 | <canvas ref="zm" width="1180" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx!=1" height="780"></canvas> | 17 | <canvas ref="zm" width="1180" v-show="headTabBdcqz[0]&&headTabBdcqz[0].bdcqzlx!=1" height="780"></canvas> |
| 17 | </div> | 18 | </div> |
| 19 | </div> | ||
| 18 | </template> | 20 | </template> |
| 19 | 21 | ||
| 20 | <script> | 22 | <script> |
| ... | @@ -255,7 +257,6 @@ | ... | @@ -255,7 +257,6 @@ |
| 255 | } | 257 | } |
| 256 | image.src = this.imgSrc | 258 | image.src = this.imgSrc |
| 257 | }, | 259 | }, |
| 258 | // 不动产证明 | ||
| 259 | /** | 260 | /** |
| 260 | * @description: 不动产证明 | 261 | * @description: 不动产证明 |
| 261 | * @author: renchao | 262 | * @author: renchao |
| ... | @@ -266,7 +267,7 @@ | ... | @@ -266,7 +267,7 @@ |
| 266 | const image = new Image(); | 267 | const image = new Image(); |
| 267 | image.onload = () => { | 268 | image.onload = () => { |
| 268 | context.drawImage(image, 0, 0); | 269 | context.drawImage(image, 0, 0); |
| 269 | context.font = '18px 楷体'; | 270 | context.font = '16px 楷体'; |
| 270 | context.fillStyle = '#000000'; | 271 | context.fillStyle = '#000000'; |
| 271 | // ysxlh | 272 | // ysxlh |
| 272 | context.fillText(this.bdcqz.ysxlh ? this.bdcqz.ysxlh : '', 280, 712); | 273 | context.fillText(this.bdcqz.ysxlh ? this.bdcqz.ysxlh : '', 280, 712); |
| ... | @@ -287,12 +288,15 @@ | ... | @@ -287,12 +288,15 @@ |
| 287 | context.fillText(this.bdcqz.ywr ? this.bdcqz.ywr : '', 775, 275); | 288 | context.fillText(this.bdcqz.ywr ? this.bdcqz.ywr : '', 775, 275); |
| 288 | context.fillText(this.bdcqz.zl ? this.bdcqz.zl : '', 775, 325); | 289 | context.fillText(this.bdcqz.zl ? this.bdcqz.zl : '', 775, 325); |
| 289 | // bdcdyh | 290 | // bdcdyh |
| 290 | context.fillText(this.bdcqz.bdcdyh ? this.bdcqz.bdcdyh : '', 775, 373); | 291 | this.bdcdyh = this.bdcqz.bdcdyh.slice(0, 6) + ' ' + this.bdcqz.bdcdyh.slice(6, 12) + ' ' + |
| 292 | this.bdcqz.bdcdyh.slice(12, 19) + ' ' + this.bdcqz.bdcdyh.slice(19, this.bdcqz.bdcdyh.length) | ||
| 293 | context.fillText(this.bdcdyh ? this.bdcdyh : '', 775, 373); | ||
| 291 | // qlqtzk | 294 | // qlqtzk |
| 292 | const maxWidth = 280; // 最大宽度限制 | 295 | const maxWidth = 295; // 最大宽度限制 |
| 293 | let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split('\n') : []; | 296 | let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split('\n') : []; |
| 294 | lines.forEach((line, index) => { | 297 | if (lines[0]) { |
| 295 | const y = 415 + (index * 37); // 每行文本的垂直位置 | 298 | lines[0].split(' ').forEach((line, index) => { |
| 299 | const y = 415 + (index * 60); // 每行文本的垂直位置 | ||
| 296 | let currentLine = ''; | 300 | let currentLine = ''; |
| 297 | let arr = []; | 301 | let arr = []; |
| 298 | for (let word of line) { | 302 | for (let word of line) { |
| ... | @@ -307,12 +311,53 @@ | ... | @@ -307,12 +311,53 @@ |
| 307 | } | 311 | } |
| 308 | arr.push(currentLine); | 312 | arr.push(currentLine); |
| 309 | arr.forEach((line, index) => { | 313 | arr.forEach((line, index) => { |
| 310 | context.fillText(line, 775, y + (index * 20)); // 调整行高 | 314 | context.fillText(line, 775, y + (index * 23)); // 调整行高 |
| 311 | }); | 315 | }); |
| 312 | }); | 316 | }); |
| 317 | } | ||
| 318 | |||
| 319 | lines.slice(1).forEach((line, index) => { | ||
| 320 | const y = ((parseInt(lines[0].length) / 19) * 22) + 415 + (index * 30); // 每行文本的垂直位置 | ||
| 321 | let currentLine = ''; | ||
| 322 | let arr = []; | ||
| 323 | for (let word of line) { | ||
| 324 | const testLine = currentLine + word; | ||
| 325 | const lineWidth = context.measureText(testLine).width; | ||
| 326 | if (lineWidth <= maxWidth) { | ||
| 327 | currentLine = testLine; | ||
| 328 | } else { | ||
| 329 | arr.push(currentLine); | ||
| 330 | currentLine = word; | ||
| 331 | } | ||
| 332 | } | ||
| 333 | arr.push(currentLine); | ||
| 334 | arr.forEach((line, index) => { | ||
| 335 | context.fillText(line, 775, y + (index * 16)); // 调整行高 | ||
| 336 | }) | ||
| 337 | }) | ||
| 338 | |||
| 313 | // fj | 339 | // fj |
| 314 | context.fillText(this.bdcqz.fj ? this.bdcqz.fj : '', 775, 600); | 340 | let lines1 = this.bdcqz.fj ? this.bdcqz.fj.split(' ') : []; |
| 315 | }; | 341 | lines1.forEach((line, index) => { |
| 342 | const y = 590 + (index * 27); // 每行文本的垂直位置 | ||
| 343 | let currentLine = ''; | ||
| 344 | let arr = []; | ||
| 345 | for (let word of line) { | ||
| 346 | const testLine = currentLine + word; | ||
| 347 | const lineWidth = context.measureText(testLine).width; | ||
| 348 | if (lineWidth <= maxWidth) { | ||
| 349 | currentLine = testLine; | ||
| 350 | } else { | ||
| 351 | arr.push(currentLine); | ||
| 352 | currentLine = word; | ||
| 353 | } | ||
| 354 | } | ||
| 355 | arr.push(currentLine); | ||
| 356 | arr.forEach((line, index) => { | ||
| 357 | context.fillText(line, 775, y + (index * 20)); // 调整行高 | ||
| 358 | }) | ||
| 359 | }) | ||
| 360 | } | ||
| 316 | 361 | ||
| 317 | image.src = this.bdczmSrc; | 362 | image.src = this.bdczmSrc; |
| 318 | } | 363 | } | ... | ... |
| 1 | <!-- | 1 | <!-- |
| 2 | * @Description: 受理信息 | 2 | * @Description: 受理信息 |
| 3 | * @Autor: renchao | 3 | * @Autor: renchao |
| 4 | * @LastEditTime: 2023-08-17 13:34:51 | 4 | * @LastEditTime: 2023-08-22 14:25:14 |
| 5 | --> | 5 | --> |
| 6 | <template> | 6 | <template> |
| 7 | <div class="slxx"> | 7 | <div class="slxx"> |
| ... | @@ -185,14 +185,13 @@ | ... | @@ -185,14 +185,13 @@ |
| 185 | </el-col> | 185 | </el-col> |
| 186 | <el-col :span="8"> | 186 | <el-col :span="8"> |
| 187 | <el-form-item label="竣工时间:"> | 187 | <el-form-item label="竣工时间:"> |
| 188 | <!-- <el-input v-model="ruleForm.fdcq2.jgsj"></el-input> --> | ||
| 189 | <el-date-picker | 188 | <el-date-picker |
| 190 | v-model="ruleForm.fdcq2.jgsj" | 189 | v-model="ruleForm.fdcq2.jgsj" |
| 191 | class="width100" | 190 | class="width100" |
| 192 | type="date" | 191 | type="date" |
| 193 | placeholder="选择日期" | 192 | placeholder="选择日期" |
| 194 | value-format="yyyy-MM-dd" | 193 | value-format="yyyy-MM-dd" |
| 195 | :disabled="!viewEdit || ableEdit || isJfOperation"></el-date-picker> | 194 | :disabled="!viewEdit"></el-date-picker> |
| 196 | </el-form-item> | 195 | </el-form-item> |
| 197 | </el-col> | 196 | </el-col> |
| 198 | </el-row> | 197 | </el-row> |
| ... | @@ -461,10 +460,8 @@ | ... | @@ -461,10 +460,8 @@ |
| 461 | * @author: renchao | 460 | * @author: renchao |
| 462 | */ | 461 | */ |
| 463 | upDateTdytxxList (val) { | 462 | upDateTdytxxList (val) { |
| 464 | this.ruleForm.tdytqxList && (this.ruleForm.tdytqxList = _.cloneDeep(val)); | 463 | this.ruleForm.tdytqxList = _.cloneDeep(val) |
| 465 | this.key++; | ||
| 466 | }, | 464 | }, |
| 467 | |||
| 468 | /** | 465 | /** |
| 469 | * @description: 更新权利人信息 | 466 | * @description: 更新权利人信息 |
| 470 | * @param {*} val | 467 | * @param {*} val | ... | ... |
| 1 | /* | 1 | /* |
| 2 | * @Description: | 2 | * @Description: |
| 3 | * @Autor: renchao | 3 | * @Autor: renchao |
| 4 | * @LastEditTime: 2023-08-22 09:24:28 | 4 | * @LastEditTime: 2023-08-22 09:28:16 |
| 5 | */ | 5 | */ |
| 6 | import filter from '@/utils/filter.js' | 6 | import filter from '@/utils/filter.js' |
| 7 | let vm = null | 7 | let vm = null |
| ... | @@ -97,16 +97,14 @@ class data extends filter { | ... | @@ -97,16 +97,14 @@ class data extends filter { |
| 97 | render: (h, scope) => { | 97 | render: (h, scope) => { |
| 98 | return ( | 98 | return ( |
| 99 | <div> | 99 | <div> |
| 100 | <el-button type="text" onClick={() => { vm.handleLpbClick(scope.row) }}>楼盘表1</el-button> | 100 | <el-button type="text" onClick={() => { vm.handleLpbClick(scope.row) }}>楼盘表</el-button> |
| 101 | <el-button type="text" icon="el-icon-edit-outline" onClick={() => { vm.openBook(scope.row) }}>登记薄</el-button> | 101 | <el-button type="text" icon="el-icon-edit-outline" onClick={() => { vm.openBook(scope.row) }}>登记薄</el-button> |
| 102 | </div> | 102 | </div> |
| 103 | ) | 103 | ) |
| 104 | } | 104 | } |
| 105 | }, | 105 | } |
| 106 | ] | 106 | ] |
| 107 | } | 107 | } |
| 108 | |||
| 109 | |||
| 110 | } | 108 | } |
| 111 | let datas = new data() | 109 | let datas = new data() |
| 112 | export { | 110 | export { | ... | ... |
-
Please register or sign in to post a comment