Skip to content

bdc / bdcdj-web

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

style:证书预览

1 parent f7611a3a
Inline Side-by-side
Showing 1 changed file with 26 additions and 5 deletions
1 <!-- 1 <!--
2 * @Description: 2 * @Description:
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-06-20 15:57:59 4 * @LastEditTime: 2023-06-20 16:09:31
5 --> 5 -->
6 <template> 6 <template>
7 <div class="from-clues loadingtext" v-Loading="loading" element-loading-text="拼命加载中..." style="height:720px"> 7 <div class="from-clues loadingtext" v-Loading="loading" element-loading-text="拼命加载中..." style="height:720px;text-align: center;">
8 <!-- 表单部分 --> 8 <!-- 表单部分 -->
9 <el-tabs v-model="activeName" @tab-click="handleClick" v-if="headTabBdcqz.length >1"> 9 <el-tabs v-model="activeName" @tab-click="handleClick" v-if="headTabBdcqz.length >1">
10 <el-tab-pane :label="item.qlr + '(' + item.bdcqzh + ')'" :name="item.bdcqzlx" 10 <el-tab-pane :label="item.qlr + '(' + item.bdcqzh + ')'" :name="item.bdcqzlx"
11 v-for="(item, index) in headTabBdcqz" :key="index"></el-tab-pane> 11 v-for="(item, index) in headTabBdcqz" :key="index"></el-tab-pane>
12 </el-tabs> 12 </el-tabs>
13 <div class="no-data" v-if="headTabBdcqz.length == 0">暂无数据</div> 13 <div class="no-data" v-if="headTabBdcqz.length == 0">暂无数据</div>
14 <canvas ref="zs" width="860" v-if="activeName==1" height="720"></canvas> 14 <canvas ref="zs" width="1000" v-if="activeName==1" height="700"></canvas>
15 <canvas ref="zm" width="1180" v-else height="780"></canvas> 15 <canvas ref="zm" width="1180" v-else height="780"></canvas>
16 </div> 16 </div>
17 </template> 17 </template>
...@@ -107,7 +107,7 @@ ...@@ -107,7 +107,7 @@
107 const image = new Image(); 107 const image = new Image();
108 image.onload = () => { 108 image.onload = () => {
109 context.drawImage(image, 0, 0); 109 context.drawImage(image, 0, 0);
110 context.font = '15px 楷体'; 110 context.font = '18px 楷体';
111 context.fillStyle = '#000000'; 111 context.fillStyle = '#000000';
112 context.fillText(this.bdcqz.sjjc ? this.bdcqz.sjjc : '', 60, 56); 112 context.fillText(this.bdcqz.sjjc ? this.bdcqz.sjjc : '', 60, 56);
113 context.fillText(this.bdcqz.djnd ? this.bdcqz.djnd : '', 113, 56); 113 context.fillText(this.bdcqz.djnd ? this.bdcqz.djnd : '', 113, 56);
...@@ -122,7 +122,28 @@ ...@@ -122,7 +122,28 @@
122 context.fillText(this.bdcqz.yt ? this.bdcqz.yt : '', 138, 346); 122 context.fillText(this.bdcqz.yt ? this.bdcqz.yt : '', 138, 346);
123 context.fillText(this.bdcqz.mj ? this.bdcqz.mj : '', 138, 386); 123 context.fillText(this.bdcqz.mj ? this.bdcqz.mj : '', 138, 386);
124 context.fillText(this.bdcqz.syqx ? this.bdcqz.syqx : '', 138, 429); 124 context.fillText(this.bdcqz.syqx ? this.bdcqz.syqx : '', 138, 429);
125 context.fillText(this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk : '', 138, 469); 125 // qlqtzk
126 const maxWidth = 280; // 最大宽度限制
127 let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split('\n') : [];
128 lines.forEach((line, index) => {
129 const y = 469 + (index * 37); // 每行文本的垂直位置
130 let currentLine = '';
131 let arr = [];
132 for (let word of line) {
133 const testLine = currentLine + word;
134 const lineWidth = context.measureText(testLine).width;
135 if (lineWidth <= maxWidth) {
136 currentLine = testLine;
137 } else {
138 arr.push(currentLine);
139 currentLine = word;
140 }
141 }
142 arr.push(currentLine);
143 arr.forEach((line, index) => {
144 context.fillText(line, 138, y + (index * 20)); // 调整行高
145 })
146 })
126 context.fillText(this.bdcqz.fj ? this.bdcqz.fj : '', 580, 100); 147 context.fillText(this.bdcqz.fj ? this.bdcqz.fj : '', 580, 100);
127 } 148 }
128 image.src = this.imgSrc 149 image.src = this.imgSrc
......