--no commit message
Showing
9 changed files
with
929 additions
and
11 deletions
... | @@ -11,7 +11,7 @@ | ... | @@ -11,7 +11,7 @@ |
11 | import { mapGetters } from 'vuex' | 11 | import { mapGetters } from 'vuex' |
12 | import { getSzRecordList } from "@/api/bdcqz.js"; | 12 | import { getSzRecordList } from "@/api/bdcqz.js"; |
13 | import table from "@/utils/mixin/table"; | 13 | import table from "@/utils/mixin/table"; |
14 | import { datas } from "../../javascript/szxxdata"; | 14 | import { szxxdatas } from "../../javascript/szxxdata"; |
15 | export default { | 15 | export default { |
16 | components: { | 16 | components: { |
17 | 17 | ||
... | @@ -34,7 +34,7 @@ | ... | @@ -34,7 +34,7 @@ |
34 | details: {}, | 34 | details: {}, |
35 | tableData: { | 35 | tableData: { |
36 | total: 0, | 36 | total: 0, |
37 | columns: datas.columns(), | 37 | columns: szxxdatas.columns(), |
38 | data: [], | 38 | data: [], |
39 | }, | 39 | }, |
40 | } | 40 | } | ... | ... |
1 | <!-- | ||
2 | * @Description: | ||
3 | * @Autor: miaofang | ||
4 | * @LastEditTime: 2023-09-19 14:04:13 | ||
5 | --> | ||
6 | <template> | ||
7 | <div | ||
8 | class="from-clues loadingtext" | ||
9 | v-Loading="loading" | ||
10 | element-loading-text="拼命加载中..." | ||
11 | style="height: 720px; text-align: center" | ||
12 | > | ||
13 | <!-- 表单部分 --> | ||
14 | <el-tabs v-model="activeName" @tab-click="handleClick"> | ||
15 | <el-tab-pane label="证书预览" name="zsyl"> | ||
16 | <el-empty | ||
17 | description="暂无数据" | ||
18 | v-if="headTabBdcqz.length == 0 && noData" | ||
19 | ></el-empty> | ||
20 | <div class="zsys"> | ||
21 | <canvas | ||
22 | ref="zs" | ||
23 | width="1000" | ||
24 | v-show="this.bdcqz.bdcqzlx == 1" | ||
25 | height="700" | ||
26 | ></canvas> | ||
27 | <canvas | ||
28 | ref="zm" | ||
29 | width="1180" | ||
30 | v-show="this.bdcqz.bdcqzlx == 2" | ||
31 | height="780" | ||
32 | ></canvas> | ||
33 | </div> | ||
34 | </el-tab-pane> | ||
35 | <el-tab-pane label="证书详情" name="lcjl"> | ||
36 | <div class="slxx_title title-block"> | ||
37 | 证书详情信息 | ||
38 | <div class="triangle"></div> | ||
39 | </div> | ||
40 | <el-form :rules="rules" ref="ruleForm" label-width="120px"> | ||
41 | <el-row> | ||
42 | <el-col :span="8"> | ||
43 | <el-form-item label="权利人" prop="cyxm"> | ||
44 | <el-input disabled v-model="bdcqz.qlr" maxlegth="15"></el-input> | ||
45 | </el-form-item> | ||
46 | </el-col> | ||
47 | <el-col :span="8"> | ||
48 | <el-form-item label="义务人" prop="jtgxdm"> | ||
49 | <el-input disabled v-model="bdcqz.qlr" maxlegth="15"></el-input> | ||
50 | </el-form-item> | ||
51 | </el-col> | ||
52 | <el-col :span="8"> | ||
53 | <el-form-item label="坐落" prop="cbfdm"> | ||
54 | <el-input disabled v-model="bdcqz.zl" maxlegth="15"></el-input> | ||
55 | </el-form-item> | ||
56 | </el-col> | ||
57 | |||
58 | </el-row> | ||
59 | <el-row> | ||
60 | <el-col :span="8"> | ||
61 | <el-form-item label="不动产单元号" prop="cyxm"> | ||
62 | <el-input disabled v-model="bdcqz.bdcdyh" maxlegth="15"></el-input> | ||
63 | </el-form-item> | ||
64 | </el-col> | ||
65 | <el-col :span="8"> | ||
66 | <el-form-item label="印刷序列号" prop="jtgxdm"> | ||
67 | <el-input disabled v-model="bdcqz.ysxlh" maxlegth="15"></el-input> | ||
68 | </el-form-item> | ||
69 | </el-col> | ||
70 | <el-col :span="8"> | ||
71 | <el-form-item label="不动产权证号" prop="cbfdm"> | ||
72 | <el-input disabled v-model="bdcqz.bdcqzh" maxlegth="15"></el-input> | ||
73 | </el-form-item> | ||
74 | </el-col> | ||
75 | |||
76 | </el-row> | ||
77 | </el-form> | ||
78 | <div class="slxx_title title-block"> | ||
79 | 缮证记录信息 | ||
80 | <div class="triangle"></div> | ||
81 | </div> | ||
82 | <div class="from-clues-content"> | ||
83 | <lb-table | ||
84 | class="sz" | ||
85 | :column="szxxtableData.columns" | ||
86 | heightNumSetting | ||
87 | :pagination="false" | ||
88 | :key="key" | ||
89 | :data="szxxtableData.data" | ||
90 | > | ||
91 | </lb-table> | ||
92 | </div> | ||
93 | <div class="slxx_title title-block"> | ||
94 | 发证记录信息 | ||
95 | <div class="triangle"></div> | ||
96 | </div> | ||
97 | <lb-table | ||
98 | border | ||
99 | :column="tableDatas.columns" | ||
100 | :heightNum="100" | ||
101 | :data="tableDatas.data" | ||
102 | :pagination="false" | ||
103 | > | ||
104 | </lb-table> | ||
105 | </el-tab-pane> | ||
106 | <el-tab-pane label="电子证照" name="third"> 等一个照片 </el-tab-pane> | ||
107 | </el-tabs> | ||
108 | </div> | ||
109 | </template> | ||
110 | |||
111 | <script> | ||
112 | // import { zsyldatas } from "../../javascript/zsyl.js"; | ||
113 | import { getSlsqBdcqzList } from "@/api/bdcqz.js"; | ||
114 | import { getCertificateList } from "@/api/bdcqz.js"; | ||
115 | import { getSzRecordList } from "@/api/bdcqz.js"; | ||
116 | import { szxxdatas } from "../../javascript/szxxdatapart"; | ||
117 | import { datas } from "../../javascript/fzxxdatapart"; | ||
118 | export default { | ||
119 | name: "zsyl", | ||
120 | props: { | ||
121 | formData: { | ||
122 | type: Object, | ||
123 | default: {}, | ||
124 | }, | ||
125 | }, | ||
126 | data() { | ||
127 | return { | ||
128 | key: 0, | ||
129 | noData: false, | ||
130 | imgSrc: require("@/image/bdcqz/bdcqzs2.jpg"), | ||
131 | bdczmSrc: require("@/image/bdcqz/bdczm.jpg"), | ||
132 | loading: false, | ||
133 | //印刷序列号集合 | ||
134 | ysxlh: [], | ||
135 | //列名称对象 | ||
136 | columns: [], | ||
137 | //选择的不动产权证文件 | ||
138 | bdcqz: "", | ||
139 | //证书打开类型 是否需要展示打印按钮 | ||
140 | isToPrint: false, | ||
141 | //tab切换栏数组 | ||
142 | tabslist: [], | ||
143 | headTabBdcqz: [], | ||
144 | //tab选择绑定值 | ||
145 | activeName: "zsyl", | ||
146 | //证书图片预览 | ||
147 | previewImage: "", | ||
148 | ruleForm: { | ||
149 | bsmBdcqz: "", | ||
150 | szmc: "不动产权证书", | ||
151 | bsmBdcqz: "", | ||
152 | szzh: "", | ||
153 | ysxlh: "", | ||
154 | }, | ||
155 | formdata: {}, | ||
156 | szxxtableData: { | ||
157 | total: 0, | ||
158 | columns: szxxdatas.columns(), | ||
159 | data: [], | ||
160 | }, | ||
161 | tableDatas: { | ||
162 | total: 0, | ||
163 | columns: datas.columns().fzgrid, | ||
164 | data: [], | ||
165 | }, | ||
166 | }; | ||
167 | }, | ||
168 | mounted() { | ||
169 | this.queryClick(); | ||
170 | this.query(); | ||
171 | if (this.formData.bdcqz) { | ||
172 | //从缮证进入 | ||
173 | this.bdcqz = this.formData.bdcqz; | ||
174 | } else { | ||
175 | //从按钮进入 | ||
176 | this.getHeadTabBdcqz(); | ||
177 | } | ||
178 | }, | ||
179 | methods: { | ||
180 | /** | ||
181 | * @description: queryClick | ||
182 | * @author: miaofang | ||
183 | */ | ||
184 | queryClick() { | ||
185 | this.formdata.bsmSlsq = this.formData.bsmSlsq; | ||
186 | getCertificateList(this.formdata).then((res) => { | ||
187 | if (res.code === 200) { | ||
188 | this.tableDatas.data = res.result ? res.result : []; | ||
189 | console.log("this.tableDatas",this.tableDatas); | ||
190 | } | ||
191 | }); | ||
192 | }, | ||
193 | /** | ||
194 | * @description: query | ||
195 | * @author: miaofang | ||
196 | */ | ||
197 | query() { | ||
198 | getSzRecordList({ bsmBdcqz: this.formData.bsmBdcqz }).then((res) => { | ||
199 | if (res.code == 200) { | ||
200 | this.szxxtableData.data = res.result; | ||
201 | this.key++; | ||
202 | } | ||
203 | }); | ||
204 | }, | ||
205 | /** | ||
206 | * @description: 获取证书内容 | ||
207 | * @param {*} code | ||
208 | * @author: miaofang | ||
209 | */ | ||
210 | getRowValue(code) { | ||
211 | var value = this.bdcqz[code]; | ||
212 | return value; | ||
213 | }, | ||
214 | /** | ||
215 | * @description: 获取受理申请下全部不动产权证 | ||
216 | * @author: miaofang | ||
217 | */ | ||
218 | getHeadTabBdcqz() { | ||
219 | console.log("formData", this.formData); | ||
220 | this.loading = true; | ||
221 | getSlsqBdcqzList({ bsmSlsq: this.formData.bsmSlsq }).then((res) => { | ||
222 | if (res.code == 200) { | ||
223 | this.noData = true; | ||
224 | if (res.result && res.result.length > 0) { | ||
225 | console.log("res.resultttttttttttttttttttt", res.result); | ||
226 | this.bdcqz = res.result[0]; | ||
227 | this.headTabBdcqz = res.result; | ||
228 | if (this.bdcqz.bdcqzlx == 1) { | ||
229 | this.drawTextOnImage(); | ||
230 | } else { | ||
231 | this.drawTextzmImage(); | ||
232 | } | ||
233 | } | ||
234 | } | ||
235 | this.loading = false; | ||
236 | }); | ||
237 | }, | ||
238 | /** | ||
239 | * @description: tab表头切换方法 | ||
240 | * @param {*} e | ||
241 | * @author: miaofang | ||
242 | */ | ||
243 | handleClick(tab, event) { | ||
244 | console.log(tab, event); | ||
245 | this.bdcqz = this.headTabBdcqz[0]; | ||
246 | if (this.bdcqz.bdcqzlx == 1) { | ||
247 | this.drawTextOnImage(); | ||
248 | } else { | ||
249 | this.drawTextzmImage(); | ||
250 | } | ||
251 | }, | ||
252 | /** | ||
253 | * @description: 不动产证书 | ||
254 | * @author: miaofang | ||
255 | */ | ||
256 | drawTextOnImage() { | ||
257 | function getByteLen(val) { | ||
258 | var len = 0; | ||
259 | if (!val) return len; | ||
260 | for (var i = 0; i < val.length; i++) { | ||
261 | var length = val.charCodeAt(i); | ||
262 | if (length >= 0 && length <= 128) { | ||
263 | len += 1; | ||
264 | } else { | ||
265 | len += 2; | ||
266 | } | ||
267 | } | ||
268 | return len; | ||
269 | } | ||
270 | const canvas = this.$refs.zs; | ||
271 | const context = canvas.getContext("2d"); | ||
272 | const image = new Image(); | ||
273 | image.onload = () => { | ||
274 | context.drawImage(image, 0, 0); | ||
275 | context.font = "18px 楷体"; | ||
276 | context.fillStyle = "#000000"; | ||
277 | context.fillText(this.bdcqz.sjjc ? this.bdcqz.sjjc : "", 60, 56); | ||
278 | context.fillText(this.bdcqz.djnd ? this.bdcqz.djnd : "", 113, 56); | ||
279 | context.fillText(this.bdcqz.sxqc ? this.bdcqz.sxqc : "", 180, 56); | ||
280 | context.fillText(this.bdcqz.sxh ? this.bdcqz.sxh : "", 370, 56); | ||
281 | context.fillText(this.bdcqz.qlr ? this.bdcqz.qlr : "", 129, 97); | ||
282 | context.fillText(this.bdcqz.gyqk ? this.bdcqz.gyqk : "", 129, 136); | ||
283 | |||
284 | this.bdcdyh = | ||
285 | this.bdcqz.bdcdyh.slice(0, 6) + | ||
286 | " " + | ||
287 | this.bdcqz.bdcdyh.slice(6, 12) + | ||
288 | " " + | ||
289 | this.bdcqz.bdcdyh.slice(12, 19) + | ||
290 | " " + | ||
291 | this.bdcqz.bdcdyh.slice(19, this.bdcqz.bdcdyh.length); | ||
292 | context.fillText(this.bdcdyh ? this.bdcdyh : "", 129, 223); | ||
293 | |||
294 | context.fillText(this.bdcqz.qllx ? this.bdcqz.qllx : "", 129, 263); | ||
295 | context.fillText(this.bdcqz.qlxz ? this.bdcqz.qlxz : "", 129, 303); | ||
296 | context.fillText(this.bdcqz.yt ? this.bdcqz.yt : "", 129, 346); | ||
297 | // context.fillText(this.bdcqz.mj ? this.bdcqz.mj : '', 129, 386); | ||
298 | let lines6 = this.bdcqz.mj ? this.bdcqz.mj.split(" ") : []; | ||
299 | if (getByteLen(this.bdcqz.mj) > 41) { | ||
300 | lines6.forEach((line, index) => { | ||
301 | const y = 378 + index * 27; // 每行文本的垂直位置 | ||
302 | let currentLine = ""; | ||
303 | let arr = []; | ||
304 | for (let word of line) { | ||
305 | const testLine = currentLine + word; | ||
306 | const lineWidth = context.measureText(testLine).width; | ||
307 | if (lineWidth <= 330) { | ||
308 | currentLine = testLine; | ||
309 | } else { | ||
310 | arr.push(currentLine); | ||
311 | currentLine = word; | ||
312 | } | ||
313 | } | ||
314 | arr.push(currentLine); | ||
315 | arr.forEach((line, index) => { | ||
316 | context.fillText(line, 129, y + index * 20); // 调整行高 | ||
317 | }); | ||
318 | }); | ||
319 | } else { | ||
320 | lines6.forEach((line, index) => { | ||
321 | const y = 386 + index * 27; // 每行文本的垂直位置 | ||
322 | let currentLine = ""; | ||
323 | let arr = []; | ||
324 | for (let word of line) { | ||
325 | const testLine = currentLine + word; | ||
326 | const lineWidth = context.measureText(testLine).width; | ||
327 | if (lineWidth <= 330) { | ||
328 | currentLine = testLine; | ||
329 | } else { | ||
330 | arr.push(currentLine); | ||
331 | currentLine = word; | ||
332 | } | ||
333 | } | ||
334 | arr.push(currentLine); | ||
335 | arr.forEach((line, index) => { | ||
336 | context.fillText(line, 129, y + index * 20); // 调整行高 | ||
337 | }); | ||
338 | }); | ||
339 | } | ||
340 | // 权利其他状态 | ||
341 | let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split("\n") : []; | ||
342 | for (let i = 0; i < lines.length; i++) { | ||
343 | let num = Math.ceil(getByteLen(lines[i]) / 38); | ||
344 | if (getByteLen(lines[i]) > 38) { | ||
345 | let currentLine = ""; | ||
346 | let arr = []; | ||
347 | for (let word of lines[i]) { | ||
348 | const testLine = currentLine + word; | ||
349 | const lineWidth = context.measureText(testLine).width; | ||
350 | if (lineWidth <= 323) { | ||
351 | currentLine = testLine; | ||
352 | } else { | ||
353 | arr.push(currentLine); | ||
354 | currentLine = word; | ||
355 | } | ||
356 | } | ||
357 | arr.push(currentLine); | ||
358 | if (i > 0) { | ||
359 | arr.forEach((line, index) => { | ||
360 | context.fillText( | ||
361 | line, | ||
362 | 129, | ||
363 | 490 + 26 * (i - 1) + 4 * num + index * 14 | ||
364 | ); // 调整行高 | ||
365 | }); | ||
366 | } else { | ||
367 | arr.forEach((line, index) => { | ||
368 | context.fillText(line, 129, 500 + 26 * (i - 1) + index * 14); // 调整行高 | ||
369 | }); | ||
370 | } | ||
371 | } else { | ||
372 | if (i > 0) { | ||
373 | context.fillText( | ||
374 | lines[i] ? lines[i] : "", | ||
375 | 129, | ||
376 | 500 + 4 * num + 24 * (i - 1) | ||
377 | ); | ||
378 | } else { | ||
379 | context.fillText( | ||
380 | lines[i] ? lines[i] : "", | ||
381 | 129, | ||
382 | 505 + 24 * (i - 1) | ||
383 | ); | ||
384 | } | ||
385 | } | ||
386 | } | ||
387 | |||
388 | let lines1 = this.bdcqz.fj ? this.bdcqz.fj.split("\n") : []; | ||
389 | lines1.forEach((line, index) => { | ||
390 | const y = 100 + index * 30; // 每行文本的垂直位置 | ||
391 | let currentLine = ""; | ||
392 | let arr = []; | ||
393 | for (let word of line) { | ||
394 | const testLine = currentLine + word; | ||
395 | const lineWidth = context.measureText(testLine).width; | ||
396 | if (lineWidth <= 395) { | ||
397 | currentLine = testLine; | ||
398 | } else { | ||
399 | arr.push(currentLine); | ||
400 | currentLine = word; | ||
401 | } | ||
402 | } | ||
403 | arr.push(currentLine); | ||
404 | arr.forEach((line, index) => { | ||
405 | context.fillText(line, 580, y + index * 30); // 调整行高 | ||
406 | }); | ||
407 | }); | ||
408 | let lines3 = this.bdcqz.syqx ? this.bdcqz.syqx.split(" ") : []; | ||
409 | if (getByteLen(this.bdcqz.syqx) > 41) { | ||
410 | lines3.forEach((line, index) => { | ||
411 | const y = 423 + index * 27; // 每行文本的垂直位置 | ||
412 | let currentLine = ""; | ||
413 | let arr = []; | ||
414 | for (let word of line) { | ||
415 | const testLine = currentLine + word; | ||
416 | const lineWidth = context.measureText(testLine).width; | ||
417 | if (lineWidth <= 330) { | ||
418 | currentLine = testLine; | ||
419 | } else { | ||
420 | arr.push(currentLine); | ||
421 | currentLine = word; | ||
422 | } | ||
423 | } | ||
424 | arr.push(currentLine); | ||
425 | arr.forEach((line, index) => { | ||
426 | context.fillText(line, 129, y + index * 20); // 调整行高 | ||
427 | }); | ||
428 | }); | ||
429 | } else { | ||
430 | lines3.forEach((line, index) => { | ||
431 | const y = 430 + index * 27; // 每行文本的垂直位置 | ||
432 | let currentLine = ""; | ||
433 | let arr = []; | ||
434 | for (let word of line) { | ||
435 | const testLine = currentLine + word; | ||
436 | const lineWidth = context.measureText(testLine).width; | ||
437 | if (lineWidth <= 315) { | ||
438 | currentLine = testLine; | ||
439 | } else { | ||
440 | arr.push(currentLine); | ||
441 | currentLine = word; | ||
442 | } | ||
443 | } | ||
444 | arr.push(currentLine); | ||
445 | arr.forEach((line, index) => { | ||
446 | context.fillText(line, 129, y + index * 20); // 调整行高 | ||
447 | }); | ||
448 | }); | ||
449 | } | ||
450 | |||
451 | let lines2 = this.bdcqz.zl ? this.bdcqz.zl.split(" ") : []; | ||
452 | if (getByteLen(this.bdcqz.zl) > 41) { | ||
453 | lines2.forEach((line, index) => { | ||
454 | const y = 170 + index * 20; // 每行文本的垂直位置 | ||
455 | let currentLine = ""; | ||
456 | let arr = []; | ||
457 | for (let word of line) { | ||
458 | const testLine = currentLine + word; | ||
459 | const lineWidth = context.measureText(testLine).width; | ||
460 | if (lineWidth <= 336) { | ||
461 | currentLine = testLine; | ||
462 | } else { | ||
463 | arr.push(currentLine); | ||
464 | currentLine = word; | ||
465 | } | ||
466 | } | ||
467 | arr.push(currentLine); | ||
468 | arr.forEach((line, index) => { | ||
469 | context.fillText(line, 129, y + index * 20); // 调整行高 | ||
470 | }); | ||
471 | }); | ||
472 | } else { | ||
473 | lines2.forEach((line, index) => { | ||
474 | const y = 180 + index * 20; // 每行文本的垂直位置 | ||
475 | let currentLine = ""; | ||
476 | let arr = []; | ||
477 | for (let word of line) { | ||
478 | const testLine = currentLine + word; | ||
479 | const lineWidth = context.measureText(testLine).width; | ||
480 | if (lineWidth <= 336) { | ||
481 | currentLine = testLine; | ||
482 | } else { | ||
483 | arr.push(currentLine); | ||
484 | currentLine = word; | ||
485 | } | ||
486 | } | ||
487 | arr.push(currentLine); | ||
488 | arr.forEach((line, index) => { | ||
489 | context.fillText(line, 129, y + index * 20); // 调整行高 | ||
490 | }); | ||
491 | }); | ||
492 | } | ||
493 | }; | ||
494 | image.src = this.imgSrc; | ||
495 | }, | ||
496 | /** | ||
497 | * @description: 不动产证明 | ||
498 | * @author: miaofang | ||
499 | */ | ||
500 | drawTextzmImage() { | ||
501 | function getByteLen(val) { | ||
502 | var len = 0; | ||
503 | if (!val) return len; | ||
504 | for (var i = 0; i < val.length; i++) { | ||
505 | var length = val.charCodeAt(i); | ||
506 | if (length >= 0 && length <= 128) { | ||
507 | len += 1; | ||
508 | } else { | ||
509 | len += 2; | ||
510 | } | ||
511 | } | ||
512 | return len; | ||
513 | } | ||
514 | |||
515 | const canvas = this.$refs.zm; | ||
516 | const context = canvas.getContext("2d"); | ||
517 | const image = new Image(); | ||
518 | image.onload = () => { | ||
519 | context.drawImage(image, 0, 0); | ||
520 | context.font = "18px 楷体"; | ||
521 | context.fillStyle = "#000000"; | ||
522 | // ysxlh | ||
523 | context.fillText(this.bdcqz.ysxlh ? this.bdcqz.ysxlh : "", 280, 712); | ||
524 | // djsj | ||
525 | if (this.bdcqz.djsj) { | ||
526 | let djsjList = this.bdcqz.djsj.split(" ")[0].split("/"); | ||
527 | context.fillText(djsjList[0] ? djsjList[0] : "", 327, 580); | ||
528 | context.fillText(djsjList[1] ? djsjList[1] : "", 393, 580); | ||
529 | context.fillText(djsjList[2] ? djsjList[2] : "", 443, 580); | ||
530 | } | ||
531 | context.fillText(this.bdcqz.sjjc ? this.bdcqz.sjjc : "", 620, 125); | ||
532 | context.fillText(this.bdcqz.djnd ? this.bdcqz.djnd : "", 665, 125); | ||
533 | context.fillText(this.bdcqz.sxqc ? this.bdcqz.sxqc : "", 750, 125); | ||
534 | context.fillText(this.bdcqz.sxh ? this.bdcqz.sxh : "", 960, 123); | ||
535 | context.fillText( | ||
536 | this.bdcqz.zmqlhsx ? this.bdcqz.zmqlhsx : "", | ||
537 | 775, | ||
538 | 180 | ||
539 | ); | ||
540 | context.fillText(this.bdcqz.qlr ? this.bdcqz.qlr : "", 775, 228); | ||
541 | // 义务人 | ||
542 | context.fillText(this.bdcqz.ywr ? this.bdcqz.ywr : "", 775, 275); | ||
543 | // context.fillText(this.bdcqz.zl ? this.bdcqz.zl : '', 775, 325); | ||
544 | |||
545 | let lines2 = this.bdcqz.zl ? this.bdcqz.zl.split(" ") : []; | ||
546 | if (getByteLen(this.bdcqz.zl) > 41) { | ||
547 | lines2.forEach((line, index) => { | ||
548 | const y = 315 + index * 20; // 每行文本的垂直位置 | ||
549 | let currentLine = ""; | ||
550 | let arr = []; | ||
551 | for (let word of line) { | ||
552 | const testLine = currentLine + word; | ||
553 | const lineWidth = context.measureText(testLine).width; | ||
554 | if (lineWidth <= 295) { | ||
555 | currentLine = testLine; | ||
556 | } else { | ||
557 | arr.push(currentLine); | ||
558 | currentLine = word; | ||
559 | } | ||
560 | } | ||
561 | arr.push(currentLine); | ||
562 | arr.forEach((line, index) => { | ||
563 | context.fillText(line, 775, y + index * 20); // 调整行高 | ||
564 | }); | ||
565 | }); | ||
566 | } else { | ||
567 | lines2.forEach((line, index) => { | ||
568 | const y = 325 + index * 20; // 每行文本的垂直位置 | ||
569 | let currentLine = ""; | ||
570 | let arr = []; | ||
571 | for (let word of line) { | ||
572 | const testLine = currentLine + word; | ||
573 | const lineWidth = context.measureText(testLine).width; | ||
574 | if (lineWidth <= 295) { | ||
575 | currentLine = testLine; | ||
576 | } else { | ||
577 | arr.push(currentLine); | ||
578 | currentLine = word; | ||
579 | } | ||
580 | } | ||
581 | arr.push(currentLine); | ||
582 | arr.forEach((line, index) => { | ||
583 | context.fillText(line, 775, y + index * 20); // 调整行高 | ||
584 | }); | ||
585 | }); | ||
586 | } | ||
587 | |||
588 | // bdcdyh | ||
589 | this.bdcdyh = | ||
590 | this.bdcqz.bdcdyh.slice(0, 6) + | ||
591 | " " + | ||
592 | this.bdcqz.bdcdyh.slice(6, 12) + | ||
593 | " " + | ||
594 | this.bdcqz.bdcdyh.slice(12, 19) + | ||
595 | " " + | ||
596 | this.bdcqz.bdcdyh.slice(19, this.bdcqz.bdcdyh.length); | ||
597 | context.fillText(this.bdcdyh ? this.bdcdyh : "", 775, 373); | ||
598 | // qlqtzk | ||
599 | const maxWidth = 295; // 最大宽度限制 | ||
600 | let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split("\n") : []; | ||
601 | for (let i = 0; i < lines.length; i++) { | ||
602 | let num = Math.ceil(getByteLen(lines[i]) / 37); | ||
603 | if (getByteLen(lines[i]) > 37) { | ||
604 | let currentLine = ""; | ||
605 | let arr = []; | ||
606 | for (let word of lines[i]) { | ||
607 | const testLine = currentLine + word; | ||
608 | const lineWidth = context.measureText(testLine).width; | ||
609 | if (lineWidth <= maxWidth) { | ||
610 | currentLine = testLine; | ||
611 | } else { | ||
612 | arr.push(currentLine); | ||
613 | currentLine = word; | ||
614 | } | ||
615 | } | ||
616 | arr.push(currentLine); | ||
617 | if (i > 0) { | ||
618 | arr.forEach((line, index) => { | ||
619 | context.fillText( | ||
620 | line, | ||
621 | 770, | ||
622 | 428 + 25 * (i - 1) + 5 * num + index * 15 | ||
623 | ); // 调整行高 | ||
624 | }); | ||
625 | } else { | ||
626 | arr.forEach((line, index) => { | ||
627 | context.fillText(line, 770, 435 + 25 * (i - 1) + index * 14); // 调整行高 | ||
628 | }); | ||
629 | } | ||
630 | } else { | ||
631 | if (i > 0) { | ||
632 | context.fillText( | ||
633 | lines[i] ? lines[i] : "", | ||
634 | 770, | ||
635 | 440 + 5 * num + 24 * (i - 1) | ||
636 | ); | ||
637 | } else { | ||
638 | context.fillText( | ||
639 | lines[i] ? lines[i] : "", | ||
640 | 770, | ||
641 | 440 + 24 * (i - 1) | ||
642 | ); | ||
643 | } | ||
644 | } | ||
645 | } | ||
646 | // fj | ||
647 | let lines1 = this.bdcqz.fj ? this.bdcqz.fj.split("\n") : []; | ||
648 | for (let i = 0; i < lines1.length; i++) { | ||
649 | let num = Math.ceil(getByteLen(lines1[i]) / 37); | ||
650 | if (getByteLen(lines1[i]) > 37) { | ||
651 | let currentLine = ""; | ||
652 | let arr = []; | ||
653 | for (let word of lines1[i]) { | ||
654 | const testLine = currentLine + word; | ||
655 | const lineWidth = context.measureText(testLine).width; | ||
656 | if (lineWidth <= maxWidth) { | ||
657 | currentLine = testLine; | ||
658 | } else { | ||
659 | arr.push(currentLine); | ||
660 | currentLine = word; | ||
661 | } | ||
662 | } | ||
663 | arr.push(currentLine); | ||
664 | if (i > 0) { | ||
665 | arr.forEach((line, index) => { | ||
666 | context.fillText( | ||
667 | line, | ||
668 | 770, | ||
669 | 610 + 25 * (i - 1) + 5 * num + index * 15 | ||
670 | ); // 调整行高 | ||
671 | }); | ||
672 | } else { | ||
673 | arr.forEach((line, index) => { | ||
674 | context.fillText(line, 770, 610 + 25 * (i - 1) + index * 15); // 调整行高 | ||
675 | }); | ||
676 | } | ||
677 | } else { | ||
678 | if (i > 0) { | ||
679 | context.fillText( | ||
680 | lines1[i] ? lines1[i] : "", | ||
681 | 770, | ||
682 | 610 + 5 * num + 23 * (i - 1) | ||
683 | ); | ||
684 | } else { | ||
685 | context.fillText( | ||
686 | lines1[i] ? lines1[i] : "", | ||
687 | 770, | ||
688 | 610 + 23 * (i - 1) | ||
689 | ); | ||
690 | } | ||
691 | } | ||
692 | } | ||
693 | }; | ||
694 | |||
695 | image.src = this.bdczmSrc; | ||
696 | }, | ||
697 | }, | ||
698 | computed: { | ||
699 | hdiffHeight() { | ||
700 | return 0; | ||
701 | // return this.headTabBdcqz.length > 1 ? 54 : 0 | ||
702 | }, | ||
703 | }, | ||
704 | }; | ||
705 | </script> | ||
706 | <style scoped lang="scss"> | ||
707 | @import "~@/styles/mixin.scss"; | ||
708 | |||
709 | .imgClass { | ||
710 | display: inline-block; | ||
711 | height: auto; | ||
712 | max-width: 100%; | ||
713 | } | ||
714 | |||
715 | .middle_padding { | ||
716 | padding-bottom: 10px; | ||
717 | } | ||
718 | |||
719 | .zsyl-button { | ||
720 | text-align: center; | ||
721 | margin-top: 20px; | ||
722 | |||
723 | .operation_button { | ||
724 | width: 100px; | ||
725 | border: 1px solid rgb(0, 121, 254); | ||
726 | } | ||
727 | |||
728 | .dy-button { | ||
729 | color: white; | ||
730 | background-color: rgb(0, 121, 254); | ||
731 | } | ||
732 | } | ||
733 | |||
734 | .table-column { | ||
735 | border-spacing: 1px; | ||
736 | width: 100%; | ||
737 | |||
738 | tr td { | ||
739 | border: 1px solid #ccc; | ||
740 | text-align: center; | ||
741 | height: 40px; | ||
742 | padding: 4px; | ||
743 | font-size: 13px; | ||
744 | background: rgb(251, 249, 229); | ||
745 | } | ||
746 | } | ||
747 | |||
748 | .zsyl-title { | ||
749 | background: #fafbe5; | ||
750 | text-align: center; | ||
751 | padding: 5px 0px; | ||
752 | font-size: 20px; | ||
753 | } | ||
754 | |||
755 | .no-data { | ||
756 | font-size: 18px; | ||
757 | display: flex; | ||
758 | text-align: center; | ||
759 | justify-content: center; | ||
760 | } | ||
761 | .el-tab-pane { | ||
762 | width: 1190px; | ||
763 | height: 670px; | ||
764 | overflow-y: auto; | ||
765 | } | ||
766 | .zsys { | ||
767 | width: 1180px; | ||
768 | height: 670px; | ||
769 | } | ||
770 | /deep/.el-table { | ||
771 | height: 100px !important; | ||
772 | } | ||
773 | /deep/.sz { | ||
774 | height: 340px !important; | ||
775 | } | ||
776 | .el-form{ | ||
777 | margin-top: 20px; | ||
778 | } | ||
779 | </style> |
... | @@ -102,9 +102,8 @@ export default { | ... | @@ -102,9 +102,8 @@ export default { |
102 | handler(val) { | 102 | handler(val) { |
103 | this.propsParam = this.$attrs; | 103 | this.propsParam = this.$attrs; |
104 | this.dataset() | 104 | this.dataset() |
105 | if(this.$parent.dqhj){ | ||
106 | this.getShList(); | 105 | this.getShList(); |
107 | } | 106 | |
108 | }, | 107 | }, |
109 | deep: true, | 108 | deep: true, |
110 | immediate: true, | 109 | immediate: true, | ... | ... |
... | @@ -104,7 +104,6 @@ export default { | ... | @@ -104,7 +104,6 @@ export default { |
104 | watch: { | 104 | watch: { |
105 | workFresh: { | 105 | workFresh: { |
106 | handler(newVal, oldVal) { | 106 | handler(newVal, oldVal) { |
107 | console.log(newVal, "newVal"); | ||
108 | if (newVal) this.list(); | 107 | if (newVal) this.list(); |
109 | }, | 108 | }, |
110 | }, | 109 | }, |
... | @@ -146,7 +145,7 @@ export default { | ... | @@ -146,7 +145,7 @@ export default { |
146 | "证书证明预览", | 145 | "证书证明预览", |
147 | "workflow/components/dialog/zsyl", | 146 | "workflow/components/dialog/zsyl", |
148 | { bdcqz: item, bsmSlsq: this.$route.query.bsmSlsq }, | 147 | { bdcqz: item, bsmSlsq: this.$route.query.bsmSlsq }, |
149 | "76%", | 148 | '1230px', |
150 | true | 149 | true |
151 | ); | 150 | ); |
152 | } else { | 151 | } else { | ... | ... |
1 | /* | ||
2 | * @Description: | ||
3 | * @Autor: renchao | ||
4 | * @LastEditTime: 2023-08-29 12:55:07 | ||
5 | */ | ||
6 | import filter from '@/utils/filter.js' | ||
7 | let vm = null | ||
8 | |||
9 | const sendThis = (_this) => { | ||
10 | vm = _this | ||
11 | } | ||
12 | class data extends filter { | ||
13 | constructor() { | ||
14 | super() | ||
15 | } | ||
16 | columns () { | ||
17 | return { | ||
18 | //发证列表 | ||
19 | fzgrid: [ | ||
20 | { | ||
21 | label: '序号', | ||
22 | type: 'index', | ||
23 | width: '50' | ||
24 | }, | ||
25 | { | ||
26 | prop: "fzrmc", | ||
27 | label: "发证人" | ||
28 | }, | ||
29 | { | ||
30 | prop: "bdcqzlx", | ||
31 | label: "不动产权证类型", | ||
32 | width: '130', | ||
33 | render: (h, scope) => { | ||
34 | return ( | ||
35 | <div> | ||
36 | <span v-show={scope.row.bdcqzlx == '1'}>不动产权证书</span> | ||
37 | <span v-show={scope.row.bdcqzlx == '2'}>不动产登记证明</span> | ||
38 | </div> | ||
39 | ) | ||
40 | } | ||
41 | }, | ||
42 | { | ||
43 | label: "权利类型", | ||
44 | width: '100', | ||
45 | render: (h, scope) => { | ||
46 | return ( | ||
47 | <el-tooltip effect="dark" content={scope.row.qllx} placement="top" popper-class="tooltip-width "> | ||
48 | <span class="ellipsis-table"> {scope.row.qllx}</span> | ||
49 | </el-tooltip> | ||
50 | ) | ||
51 | } | ||
52 | }, | ||
53 | { | ||
54 | label: "面积(㎡)", | ||
55 | width: '100', | ||
56 | render: (h, scope) => { | ||
57 | return ( | ||
58 | <el-tooltip effect="dark" content={scope.row.mj} placement="top" popper-class="tooltip-width "> | ||
59 | <span class="ellipsis-table"> {scope.row.mj}</span> | ||
60 | </el-tooltip> | ||
61 | ) | ||
62 | } | ||
63 | }, | ||
64 | { | ||
65 | prop: "fzsj", | ||
66 | label: "发证时间", | ||
67 | width: '140', | ||
68 | }, | ||
69 | { | ||
70 | prop: "lzrxm", | ||
71 | label: "领证人姓名" | ||
72 | }, | ||
73 | ], | ||
74 | } | ||
75 | } | ||
76 | } | ||
77 | let datas = new data() | ||
78 | export { | ||
79 | datas, | ||
80 | sendThis | ||
81 | } |
... | @@ -16,6 +16,7 @@ class data extends filter { | ... | @@ -16,6 +16,7 @@ class data extends filter { |
16 | columns () { | 16 | columns () { |
17 | return [ | 17 | return [ |
18 | { | 18 | { |
19 | width:"50px", | ||
19 | label: '序号', | 20 | label: '序号', |
20 | type: 'index', | 21 | type: 'index', |
21 | render: (h, scope) => { | 22 | render: (h, scope) => { |
... | @@ -59,8 +60,8 @@ class data extends filter { | ... | @@ -59,8 +60,8 @@ class data extends filter { |
59 | ] | 60 | ] |
60 | } | 61 | } |
61 | } | 62 | } |
62 | let datas = new data() | 63 | let szxxdatas = new data() |
63 | export { | 64 | export { |
64 | datas, | 65 | szxxdatas, |
65 | sendThis | 66 | sendThis |
66 | } | 67 | } | ... | ... |
1 | /* | ||
2 | * @Description: | ||
3 | * @Autor: renchao | ||
4 | * @LastEditTime: 2023-05-17 10:39:03 | ||
5 | */ | ||
6 | import filter from '@/utils/filter.js' | ||
7 | let vm = null | ||
8 | |||
9 | const sendThis = (_this) => { | ||
10 | vm = _this | ||
11 | } | ||
12 | class data extends filter { | ||
13 | constructor() { | ||
14 | super() | ||
15 | } | ||
16 | columns () { | ||
17 | return [ | ||
18 | { | ||
19 | width:"50px", | ||
20 | label: '序号', | ||
21 | type: 'index', | ||
22 | render: (h, scope) => { | ||
23 | return ( | ||
24 | <div> | ||
25 | {scope.$index + 1} | ||
26 | </div> | ||
27 | ) | ||
28 | } | ||
29 | }, | ||
30 | { | ||
31 | prop: "szry", | ||
32 | label: "缮证人员", | ||
33 | }, | ||
34 | { | ||
35 | prop: "szsj", | ||
36 | label: "缮证时间", | ||
37 | }, | ||
38 | { | ||
39 | label: "是否作废", | ||
40 | render: (h, scope) => { | ||
41 | if (scope.row.sfzf == '0') { | ||
42 | return <div>否</div> | ||
43 | } else { | ||
44 | return <div>已作废</div> | ||
45 | } | ||
46 | } | ||
47 | }, | ||
48 | { | ||
49 | prop: "bz", | ||
50 | label: "备注信息", | ||
51 | }, | ||
52 | ] | ||
53 | } | ||
54 | } | ||
55 | let szxxdatas = new data() | ||
56 | export { | ||
57 | szxxdatas, | ||
58 | sendThis | ||
59 | } |
... | @@ -126,7 +126,7 @@ export default { | ... | @@ -126,7 +126,7 @@ export default { |
126 | this.$popupDialog("证书证明预览", "workflow/components/dialog/zsyl", { | 126 | this.$popupDialog("证书证明预览", "workflow/components/dialog/zsyl", { |
127 | bsmSlsq: this.bsmSlsq, | 127 | bsmSlsq: this.bsmSlsq, |
128 | entryType: '1' | 128 | entryType: '1' |
129 | }, '1210px', true) | 129 | }, '1230px', true) |
130 | break; | 130 | break; |
131 | case "B6": | 131 | case "B6": |
132 | //根据编号获取对应信息 | 132 | //根据编号获取对应信息 | ... | ... |
... | @@ -104,10 +104,10 @@ | ... | @@ -104,10 +104,10 @@ |
104 | */ | 104 | */ |
105 | openDialog (item) { | 105 | openDialog (item) { |
106 | bdcqzPreview(item).then(res => { | 106 | bdcqzPreview(item).then(res => { |
107 | this.$popupDialog("证书证明预览", "workflow/components/dialog/zsyl", { | 107 | this.$popupDialog("证书证明预览", "workflow/components/dialog/zsylxq", { |
108 | bsmSlsq: item.bsmSlsq, | 108 | bsmSlsq: item.bsmSlsq, |
109 | bsmBdcqz: item.bsmBdcqz | 109 | bsmBdcqz: item.bsmBdcqz |
110 | }, '1210px', true) | 110 | }, '1230px', true) |
111 | }) | 111 | }) |
112 | }, | 112 | }, |
113 | /** | 113 | /** | ... | ... |
-
Please register or sign in to post a comment