乡村相册

src/saas/AppCountryAlbum/Watermark.vue

@@ -1,23 +1,21 @@
 <template>
   <div class="photo" ref="waterMarker" :class="[isHide ? 'home-active' : '']" :style="{height: height + 'px'}">
     <div class="photo-top" data-html2canvas-ignore>
-      <image src="./images/gengduo1.png" />
+      <!-- <image src="./images/gengduo1.png" @click="back" /> -->
+      <u-icon name="close" color="#fff" size="28"  @click="back"></u-icon>
       <div class="photo-top__middle">
         <span>保存至：默认相册</span>
         <image src="./images/gengduo1.png" />
       </div>
       <span @click="save">保存</span>
     </div>
-    <image
-      mode="aspectFit"
-      crossorigin="anonymous"
-      src="https://p3-juejin.byteimg.com/tos-cn-i-k3u1fbpfcp/64f71761d2b04746ad640a43706a92e4~tplv-k3u1fbpfcp-zoom-crop-mark:1304:1304:1304:734.awebp?" />
-    <div class="watermark">
+    <image :src="img" mode="aspectFit" />
+    <div class="watermark" v-if="currIndex > -1">
       <component :is="'Watermark' + (currIndex + 1)"></component>
     </div>
     <div class="photo-bottom" v-if="!isHide">
       <div class="photo-bottom__top">
-        <image src="./images/gengduo1.png" />
+        <image src="./images/gengduo1.png" @click="isHide = true, currIndex = -1" />
         <h2>水印</h2>
         <span>确定</span>
       </div>
@@ -67,7 +65,7 @@
 
     data () {
       return {
-        src: '',
+        img: '',
         config,
         currIndex: 0,
         isHide: false,
@@ -76,7 +74,8 @@
       }
     },
 
-    onLoad () {
+    onLoad (query) {
+      this.img = query.url
       this.height = uni.getSystemInfoSync().windowHeight
     },
 
@@ -88,20 +87,21 @@
           setTimeout(() => {
             html2canvas(this.$refs.waterMarker, {
               allowTaint: true,
-              useCORS: true,
-              backgroundColor: '#fff',
-              width: this.$refs.waterMarker.offsetWidth,
-              height: this.$refs.waterMarker.offsetHeight,
-              scale: 1
+              useCORS: true
             }).then((canvas) => {
-              let dataURL = canvas.toDataURL("image/png");
+              let dataURL = canvas.toDataURL('image/png')
               this.waterSrc = dataURL
-              console.log(dataURL)
             }).catch(e => {
               console.log(e)
             })
           }, 2000)
         })
+      },
+
+      back () {
+        uni.navigateBack({
+          delta: 1
+        })
       }
     }
   }