保存图片

.eslintrc.js

@@ -19,6 +19,7 @@ module.exports = {
         wx: true,
         SyncStatus: true,
         InstallMode: true,
-        StatusBar: true
+        StatusBar: true,
+        imageSaver: true
     }
 };

src/components/Post.vue

@@ -190,8 +190,20 @@ export default {
             return dataURL;
         },
         save() {
-            // if (window.cordova) {
-            // }
+            if (window.cordova) {
+                let _this = this;
+                imageSaver.saveBase64Image(
+                    { data: this.img },
+                    function (filePath) {
+                        _this.$toast('File saved on ' + filePath);
+                        _this.show = false;
+                        console.log('File saved on ' + filePath);
+                    },
+                    function (msg) {
+                        _this.$toast(msg);
+                    }
+                );
+            }
         }
     }
 };

src/components/product/ProductBanner.vue

@@ -32,10 +32,10 @@
                     {{ info.likes }}
                 </like-button>
 
-                <!-- <div class="share-icon" :class="{ shareLeft: pageType === 'product' }" @click="share" v-if="isShare">
+                <div class="share-icon" :class="{ shareLeft: pageType === 'product' }" @click="share" v-if="isShare">
                     <img src="@assets/svgs/icon-fenxiang.svg" alt="" />
                     <span>分享</span>
-                </div> -->
+                </div>
             </div>
         </div>
 

src/views/account/About.vue

@@ -9,6 +9,8 @@
         <van-overlay :show="show" @click="show = false">
             <div class="code-img" @click.stop>
                 <van-image class="code" width="70vw" :src="codeImg" fit="scale-down" />
+
+                <van-button class="save" @click="save" type="primary" round>点击保存图片</van-button>
             </div>
         </van-overlay>
     </div>
@@ -24,8 +26,45 @@ export default {
     },
     mounted() {
         this.$http.get('/sysConfig/get/customer_group').then(res => {
-            this.codeImg = res.value;
+            this.getImgBase64(res.value, 'codeImg');
         });
+    },
+    methods: {
+        getImgBase64(img2, key) {
+            let img = new Image();
+            img.crossOrigin = 'anonymous';
+            let _this = this;
+            img.onload = function () {
+                let src = _this.image2Base64(img);
+                _this[key] = src;
+            };
+            img.src = img2;
+        },
+        image2Base64(img) {
+            let canvas = document.createElement('canvas');
+            canvas.width = img.width;
+            canvas.height = img.height;
+            let ctx = canvas.getContext('2d');
+            ctx.drawImage(img, 0, 0, img.width, img.height);
+            let dataURL = canvas.toDataURL('image/png');
+            return dataURL;
+        },
+        save() {
+            if (window.cordova) {
+                let _this = this;
+                imageSaver.saveBase64Image(
+                    { data: this.codeImg },
+                    function (filePath) {
+                        _this.$toast('File saved on ' + filePath);
+                        _this.show = false;
+                        console.log('File saved on ' + filePath);
+                    },
+                    function (msg) {
+                        _this.$toast(msg);
+                    }
+                );
+            }
+        }
     }
 };
 </script>
@@ -57,5 +96,11 @@ export default {
     left: 50%;
     top: 50%;
     transform: translate(-50%, -50%);
+    .flex-col();
+    align-items: center;
+
+    .save {
+        margin-top: 30px;
+    }
 }
 </style>

src/views/account/Agreement.vue

@@ -45,6 +45,7 @@ export default {
         font-size: @font2;
         margin: 6px 0 0;
         color: @text3;
+        word-break: break-all;
     }
 
     h4,