| 
					
				 | 
			
			
				@@ -6,7 +6,7 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       :model-value="showDialog" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       @close="closeDialog()" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-    <div  class="pdf-main"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    <div class="pdf-main"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       <div class="title" > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         <div class="name" ></div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         <div class="pdf-close cursor-pointer" @click="closeDialog"></div> 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -14,7 +14,7 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       <div id="printTest" class="pdf-dialog-box"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         <div class="pdf-my-body"  > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         <div class="pdfBox" > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-          <div class="a4" > 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div class="a4" id="pdfDom"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             <div class="a4_title">确权单</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             <table class="a4_table" border=1 style="border-collapse: collapse;"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				               <tr> 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -53,7 +53,8 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       <div style="text-align: left"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <el-button size="large" color="#626aef"  v-print="printObj">打印</el-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+         <el-button size="large" color="#626aef"  @click="html2Canvas1('test')">打印</el-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <!-- <el-button size="large" color="#626aef"  v-print="printObj">打印</el-button> --> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         <!--          <el-button size="large" color="#626aef"  @click="closeDialog">关闭</el-button>--> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -62,6 +63,8 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 </template> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 <script setup> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import html2Canvas from 'html2canvas' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+import JsPDF from 'jspdf' 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import {reactive, ref, toRefs, computed, nextTick, onMounted} from "vue"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import {useStore} from "vuex"; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 import {WKT} from "ol/format"; 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -131,6 +134,46 @@ function toImg() { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   // let dataURL = canvas.toDataURL('image/webp'); 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   //   imgUrl.value = dataURL; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+function html2Canvas1(){ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+html2Canvas(document.querySelector('#pdfDom'), {//获取文档中 id="pdfDom" 的元素,返回匹配指定选择器的第一个元素 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        allowTaint: true  //允许跨源图像污染画布 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }).then(function (canvas) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let contentWidth = canvas.width   // 获得容器的宽 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let contentHeight = canvas.height // 获得容器的高 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //一页pdf显示html页面生成的canvas高度; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let pageHeight = contentWidth / 592.28 * 841.89 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let leftHeight = contentHeight  //未生成pdf的html页面高度 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let position = 0   //页面偏移 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //a4纸的尺寸[595.28,841.89],html页面生成的canvas在pdf中图片的宽高 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let imgWidth = 595.28 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let imgHeight = 592.28 / contentWidth * contentHeight 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //图片格式,(0-1,数字越大,代表导出的图片越清晰,默认值:0.92) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let pageData = canvas.toDataURL('image/jpeg', 1.0) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //第一个参数: l:横向  p:纵向 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //第二个参数:测量单位("pt","mm", "cm", "m", "in" or "px") 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //格式,默认为“a4”,如果想用自己的格式例如[595.28, 841.89] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        let PDF = new JsPDF('', 'pt', 'a4') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //有两个高度需要区分,一个是html页面的实际高度,和生成pdf的页面高度(841.89) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        //当内容未超过pdf一页显示的范围,无需分页 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        if (leftHeight < pageHeight) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } else { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          while (leftHeight > 0) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            leftHeight -= pageHeight 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            position -= 841.89 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            //避免添加空白页 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            if (leftHeight > 0) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              PDF.addPage() 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        // 导出pdf文件命名 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        // PDF.save(title + '.pdf') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        PDF.save('test.pdf') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+} 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				  
			 | 
		
	
		
			
				 | 
				 | 
			
			
				 onMounted(()=>{ 
			 |