style：图形定位

 <template>
 <template>
-  <iframe :src="window._config.services.management +'/#/' + formData.bsmZd" frameborder="0" style="width: 100%; height:710px;"></iframe>
+  <iframe :src="ip +'/txdw/#/' + formData.bsmZd" frameborder="0" style="width: 100%; height:710px;"></iframe>
 </template>
 </template>
 <script> 
 <script> 
   export default {
   export default {
@@ -10,6 +10,11 @@
           return {}
           return {}
         }
         }
       }
       }
+    },
+    data () {
+      return {
+        ip: window._config.services.management
+      }
     }
     }
   }
   }
 </script>
 </script>
\ No newline at end of file

+<!--
+ * @Description:
+ * @Autor: renchao
+ * @LastEditTime: 2023-08-10 14:01:09
+-->
+<template>
+  <div class="from-clues loadingtext" v-Loading="loading" element-loading-text="拼命加载中..." style="height:720px;text-align: center;">
+    <el-empty description="暂无数据" v-if="headTabBdcqz.length == 0 && noData"></el-empty>
+    <canvas ref="zs" width="1000" height="700"></canvas>
+  </div>
+</template>
+
+<script>
+  import { getSlsqBdcqzList } from "@/api/bdcqz.js"
+  export default {
+    name: "zsyl",
+    props: {
+      formData: {
+        type: Object,
+        default: {}
+      }
+    },
+    data () {
+      return {
+        noData: false,
+        imgSrc: require('@/image/bdcqz/bdcqzs2.jpg'),
+        loading: false,
+      }
+    },
+    mounted () {
+      this.getHeadTabBdcqz();
+    },
+    methods: {
+      /**
+       * @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.bdcqz = res.result[0]
+              this.drawTextOnImage()
+            }
+          }
+          this.loading = false
+        })
+      },
+      /**
+       * @description: 不动产证书
+       * @author: renchao
+       */
+      drawTextOnImage () {
+        const canvas = this.$refs.zs;
+        const context = canvas.getContext('2d');
+        const image = new Image();
+        image.onload = () => {
+          context.drawImage(image, 0, 0);
+          context.font = '18px 楷体';
+          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 : '', 138, 97);
+          context.fillText(this.bdcqz.gyqk ? this.bdcqz.gyqk : '', 138, 138);
+          context.fillText(this.bdcqz.zl ? this.bdcqz.zl : '', 138, 180);
+          context.fillText(this.bdcqz.bdcdyh ? this.bdcqz.bdcdyh : '', 138, 223);
+          context.fillText(this.bdcqz.qllx ? this.bdcqz.qllx : '', 138, 263);
+          context.fillText(this.bdcqz.qlxz ? this.bdcqz.qlxz : '', 138, 303);
+          context.fillText(this.bdcqz.yt ? this.bdcqz.yt : '', 138, 346);
+          context.fillText(this.bdcqz.mj ? this.bdcqz.mj : '', 138, 386);
+          context.fillText(this.bdcqz.syqx ? this.bdcqz.syqx : '', 138, 429);
+          // qlqtzk
+          const maxWidth = 280; // 最大宽度限制
+          let lines = this.bdcqz.qlqtzk ? this.bdcqz.qlqtzk.split('\n') : [];
+          lines.forEach((line, index) => {
+            const y = 469 + (index * 37); // 每行文本的垂直位置
+            let currentLine = '';
+            let arr = [];
+            for (let word of line) {
+              const testLine = currentLine + word;
+              const lineWidth = context.measureText(testLine).width;
+              if (lineWidth <= maxWidth) {
+                currentLine = testLine;
+              } else {
+                arr.push(currentLine);
+                currentLine = word;
+              }
+            }
+            arr.push(currentLine);
+            arr.forEach((line, index) => {
+              context.fillText(line, 138, y + (index * 20)); // 调整行高
+            })
+          })
+          let lines1 = this.bdcqz.fj ? this.bdcqz.fj.split(' ') : [];
+          lines1.forEach((line, index) => {
+            const y = 100 + (index * 37); // 每行文本的垂直位置
+            let currentLine = '';
+            let arr = [];
+            for (let word of line) {
+              const testLine = currentLine + word;
+              const lineWidth = context.measureText(testLine).width;
+              if (lineWidth <= 395) {
+                currentLine = testLine;
+              } else {
+                arr.push(currentLine);
+                currentLine = word;
+              }
+            }
+            arr.push(currentLine);
+            arr.forEach((line, index) => {
+              context.fillText(line, 580, y + (index * 20)); // 调整行高
+            })
+          })
+
+        }
+        image.src = this.imgSrc
+      },
+    }
+  }
+</script>