| 
					
				 | 
			
			
				@@ -17,8 +17,14 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             调整比例:{{ Math.round(scalVal*100) }}% 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-              <a-button size="small" @click="setScalVal(0)"><a-icon type="minus" /> 缩小</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-              <a-button size="small" @click="setScalVal(1)"><a-icon type="plus" /> 放大</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <a-button :disabled="scalLoading" style="margin-right: 10px;" size="small" @click="setScalVal(0)"><a-icon type="minus" /> 缩小</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <a-button :disabled="scalLoading" size="small" @click="setScalVal(1)"><a-icon type="plus" /> 放大</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            截图: 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            <div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+              <a-button :disabled="scalLoading" size="small" @click="handleDownload()"><a-icon type="copy" /> 复制截图</a-button> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           <div> 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -32,20 +38,18 @@ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        <vue-scroll :ops="ops" :style="{width: Math.round(scalVal*100)+'%',height: '70vh',margin:'0 auto'}"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        <vue-scroll :ops="ops" :style="{width: '100%',height: '70vh',margin:'0 auto'}"> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           <div v-if="loadedRatio > 0 && loadedRatio < 1" style="background-color: green; color: white; text-align: center" :style="{ width: loadedRatio * 100 + '%' }">{{ Math.floor(loadedRatio * 100) }}%</div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           <pdf 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             ref="pdf" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             v-for="(item,index) in pdfList" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             :key="'pdf-'+index" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            :style="{width: '100%'}" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+            :style="{width: Math.round(scalVal*100)+'%',margin:'0 auto'}" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             :src="getUrl('data:application/pdf;base64,' + item)" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             :page="page" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             :rotate="rotate" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            @progress="loadedRatio = $event" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				             @error="error" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            @num-pages="numPages = $event" 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-            @link-clicked="page = $event"></pdf> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          ></pdf> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         </vue-scroll> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       </div> 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       <div class="btn-box"> 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -95,6 +99,8 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   data () { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     return { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      scalLoading: false, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      pdfAllLoad: 0, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       scalVal: 0.75, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       isShow: this.openModal, //  是否打开弹框 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       show: true, 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -134,12 +140,18 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     // 缩放 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     setScalVal (t) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.scalVal = this.scalVal + (t ? 0.05 : -0.05) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      if (this.scalVal > 1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.scalVal = 1 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      if (this.scalVal < 0.5) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-        this.scalVal = 0.5 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if (!this.scalLoading) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.scalLoading = true 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        this.scalVal = this.scalVal + (t ? 0.05 : -0.05) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        if (this.scalVal > 1) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          this.scalVal = 1 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        if (this.scalVal < 0.5) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          this.scalVal = 0.5 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        setTimeout(() => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+          this.scalLoading = false 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        }, 1000) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     getUrl (item) { 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -149,7 +161,6 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     setData (data) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       // console.log(data) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       this.pdfList = data 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      this.src = data[0] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       this.curpage = 1 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       this.total = data.length 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				       // 获取打印机列表 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -185,7 +196,49 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     // 下载 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     handleDownload () { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				-      console.log(this.$refs.pdf[0].pdf) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      if (this.scalLoading) { return } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const pdf = this.$refs.pdf 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const len = pdf.length 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const imgsList = [] 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const canvas = document.createElement('canvas') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      let maxHeight = 0 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const maxWidth = pdf[0].$refs.canvas.width 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      for (let i = 0; i < len; i++) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        const imgs = pdf[i].$refs.canvas 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        maxHeight = maxHeight + imgs.height 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        imgsList.push(imgs) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // 设置画布宽度和高度 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      canvas.width = maxWidth 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      canvas.height = maxHeight 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const ctx = canvas.getContext('2d') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // 开始合并 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      let y = 0 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      imgsList.map(item => { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        ctx.drawImage(item, 0, y, item.width, item.height) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        y = y + item.height 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // 复制图片 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const base64Str = canvas.toDataURL('image/png') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.copyImgBtn(base64Str.split(',')[1]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      // 清除画布 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      ctx.clearRect(0, 0, maxWidth, maxHeight) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    // 将照片复制到剪贴版 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    copyImgBtn (base64Data) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const blobInput = this.convertBase64ToBlob(base64Data, 'image/png') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      const clipboardItemInput = new ClipboardItem({ 'image/png': blobInput }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      navigator.clipboard.write([clipboardItemInput]) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      this.$message.success('复制截图成功!') 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+    convertBase64ToBlob (base64, type) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      var bytes = window.atob(base64) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      var ab = new ArrayBuffer(bytes.length) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      var ua = new Uint8Array(ab) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      for (var i = 0; i < bytes.length; i++) { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        ua[i] = bytes.charCodeAt(i) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+      return new Blob([ab], { type: type }) 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				     } 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   }, 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				   watch: { 
			 | 
		
	
	
		
			
				| 
					
				 | 
			
			
				@@ -216,6 +269,7 @@ export default { 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         align-items: center; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         border-bottom: 1px solid #eee; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         background-color: #f8f8f8; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				+        justify-content: space-between; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				         > div{ 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           display: flex; 
			 | 
		
	
		
			
				 | 
				 | 
			
			
				           align-items: center; 
			 |