Browse Source

复制图片异常提示 兼容写法之后提了需求再说吧

Karsa 1 year ago
parent
commit
d2695cafc3

+ 17 - 14
src/utils/svgToblob.js

@@ -15,20 +15,23 @@
       ctx.scale(ratio,ratio)
 
       callback && callback();
-      
-      canvas.toBlob(async(blob) => {
-        console.log('toblob')
-        console.log(blob)   
-        const data = [new ClipboardItem({ [blob.type]: blob })];
-        await navigator.clipboard.write(data).then(
-          () => {
-            bus.$message.success('复制成功!')
-          },
-          () => {
-            bus.$message.success('浏览器暂不支持')
-          }
-        );
-      })
+      if(window.ClipboardItem) {
+        canvas.toBlob(async(blob) => {
+          console.log('toblob')
+          console.log(blob)   
+          const data = [new ClipboardItem({ [blob.type]: blob })];
+          await navigator.clipboard.write(data).then(
+            () => {
+              bus.$message.success('复制成功!')
+            },
+            () => {
+              bus.$message.success('浏览器暂不支持')
+            }
+          );
+        })
+      }else {
+        bus.$message.success('浏览器暂不支持')
+      }
     }	
  
   }

+ 15 - 11
src/views/dataEntry_manage/mixins/chartPublic.js

@@ -1872,17 +1872,21 @@ export const chartSetMixin = {
         }
         ctx.scale(zoomX,zoomY)
         ctx.drawImage(img, 0, 0); // 将canvas转为blob
-        canvas.toBlob(async (blob) => {
-          const data = [new ClipboardItem({ [blob.type]: blob })]; 
-          await navigator.clipboard.write(data).then(
-            () => {
-             this.$message.success('复制成功!')
-            },
-            () => {
-              this.$message.success('复制失败,稍后再试')
-            }
-          );
-        });
+        if(window.ClipboardItem) {
+          canvas.toBlob(async (blob) => {
+            const data = [new ClipboardItem({ [blob.type]: blob })]; 
+            await navigator.clipboard.write(data).then(
+              () => {
+               this.$message.success('复制成功!')
+              },
+              () => {
+                this.$message.success('复制失败,稍后再试')
+              }
+            );
+          });
+        }else {
+          this.$message.success('浏览器暂不支持')
+        }
       };
     },
 

+ 18 - 13
src/views/sandbox_manage/index.vue

@@ -521,19 +521,24 @@ export default {
         ctx.fillStyle="#fff";
         ctx.fillRect(0, 0, img.width, img.height);
         ctx.drawImage(img, 0, 0);
-        canvas.toBlob(async (blob) => {
-          const data = [new ClipboardItem({ [blob.type]: blob })]; 
-          await navigator.clipboard.write(data).then(
-            () => {
-             this.$message.success('复制成功!')
-            },
-            () => {
-              this.$message.success('复制失败,稍后再试')
-            }
-          ).finally(()=>{
-                        this.lockLoding && this.lockLoding.close();
-                    });
-        });
+        if(window.ClipboardItem) {
+          canvas.toBlob(async (blob) => {
+            const data = [new ClipboardItem({ [blob.type]: blob })]; 
+            await navigator.clipboard.write(data).then(
+              () => {
+               this.$message.success('复制成功!')
+              },
+              () => {
+                this.$message.success('复制失败,稍后再试')
+              }
+            ).finally(()=>{
+                          this.lockLoding && this.lockLoding.close();
+                      });
+          });
+        }else {
+          this.lockLoding && this.lockLoding.close();
+          this.$message.success('浏览器暂不支持')
+        }
       }
     }, 500),
     /* 排序 */

+ 26 - 21
src/views/sandbox_manage/sandFlow/index.vue

@@ -262,27 +262,32 @@ export default {
                 img.crossOrigin = "Anonymous";
                 img.src = svgToBase64(dataUri);
                 img.onload = ()=>{
-                canvas.width = img.width;
-                canvas.height = img.height;
-                console.log('width',img.width)
-                console.log('height',img.height)
-                ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
-                ctx.fillStyle="#fff";
-                ctx.fillRect(0, 0, img.width, img.height);
-                ctx.drawImage(img, 0, 0);
-                canvas.toBlob(async (blob) => {
-                    const data = [new ClipboardItem({ [blob.type]: blob })]; 
-                    await navigator.clipboard.write(data).then(
-                    () => {
-                        this.$message.success('复制成功!')
-                    },
-                    () => {
-                        this.$message.success('复制失败,稍后再试')
-                    }
-                    ).finally(()=>{
-                        this.lockLoding && this.lockLoding.close();
-                    });
-                });
+									canvas.width = img.width;
+									canvas.height = img.height;
+									console.log('width',img.width)
+									console.log('height',img.height)
+									ctx.clearRect(0, 0, ctx.canvas.width, ctx.canvas.height);
+									ctx.fillStyle="#fff";
+									ctx.fillRect(0, 0, img.width, img.height);
+									ctx.drawImage(img, 0, 0);
+									if(window.ClipboardItem) {
+										canvas.toBlob(async (blob) => {
+												const data = [new ClipboardItem({ [blob.type]: blob })]; 
+												await navigator.clipboard.write(data).then(
+												() => {
+														this.$message.success('复制成功!')
+												},
+												() => {
+														this.$message.success('复制失败,稍后再试')
+												}
+												).finally(()=>{
+														this.lockLoding && this.lockLoding.close();
+												});
+										});
+									}else {
+										this.lockLoding && this.lockLoding.close();
+										this.$message.success('浏览器暂不支持')
+									}	
                 }
 			},{
 				preserveDimensions:true,//让svg为实际图片大小