图片懒加载

src/components/AiEmpty.vue

@@ -35,7 +35,7 @@ export default {
   margin-bottom: 20px;
 
   .emptyImg {
-    width: initial;
+    width: 300px;
     height: initial;
   }
 

src/saas/AppCountryAlbum/AlbumDetail.vue

@@ -48,7 +48,7 @@
       <div class="photo-item__wrapper">
         <div class="photo-item" @click="linkTo('./Photo?id=' + item.id)" v-for="(item, index) in list" :key="index">
           <!-- <image :src="item.photoUrl" mode="aspectFill" /> -->
-          <u-lazy-load :image="item.photoUrl"></u-lazy-load>
+          <u-lazy-load :image="item.photoUrl" img-mode="aspectFill"></u-lazy-load>
           <div class="photo-item__text">
             <h2><AiOpenData v-if="item.createUserId" type="userName" :openid="item.createUserId"></AiOpenData></h2>
             <p>{{ item.createTime }}</p>
@@ -206,17 +206,7 @@
           sizeType: ['compressed'],
           sourceType: this.info.photoSource === '1' ? ['camera'] : ['album', 'camera'],
           success: res => {
-            let formData = new FormData()
-            formData.append('file', res.tempFiles[0])
-            this.$loading()
-            this.$http.post('/admin/file/add2?type=image', formData).then(res => {
-              if (res.code === 0) {
-                this.linkTo(`./Watermark?url=${res.data.url}&albumId=${this.id}`)
-              } else {
-                this.$u.toast(res.msg)
-              }
-              uni.hideLoading()
-            })
+            this.linkTo(`./Watermark?url=${encodeURIComponent(res.tempFilePaths[0])}&albumId=${this.id}`)
           }
         })
       },

src/saas/AppCountryAlbum/EditAlbum.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="EditAlbum" v-if="pageShow">
     <div class="img-item" v-for="(item, index) in list" :key="index" @click="choose(index)">
-      <image class="img" :src="item.photoUrl" mode="aspectFill" />
+      <u-lazy-load class="img" :image="item.photoUrl" img-mode="aspectFill"></u-lazy-load>
       <span class="icon" v-if="!item.checked"></span>
       <image class="icon" v-else src="./images/img-choose.png" />
     </div>

src/saas/AppCountryAlbum/Watermark.vue

@@ -181,7 +181,7 @@
         this.albumId = query.albumId
       }
 
-      this.img = query.url
+      this.img = decodeURIComponent(query.url)
       this.height = uni.getSystemInfoSync().windowHeight
 
       this.getLocation()
@@ -248,11 +248,10 @@
         this.$nextTick(() => {
           html2canvas(this.$refs.waterMarker, {
             allowTaint: true,
-            useCORS: true,
-            dpi: 300
+            useCORS: true
           }).then((canvas) => {
-            let dataURL = canvas.toDataURL('image/png')
-            const file = this.dataURLtoFile(dataURL, 'photo.png')
+            let dataURL = canvas.toDataURL('image/jpg')
+            const file = this.dataURLtoFile(dataURL, 'photo.jpg')
             let formData = new FormData()
             formData.append('file', file)
             this.$http.post('/admin/file/add2?type=image', formData).then(res => {

src/saas/AppCountryAlbum/components/Home.vue

@@ -55,7 +55,7 @@
         <div class="item" v-for="(item, index) in list" :key="index" @click="linkTo('./AlbumDetail?id=' + item.id)">
           <span v-if="item.photoHasRead === 'NO'">未查看</span>
           <image src="./../images/icon.png" v-if="!item.lastPhotoUrl" />
-          <image class="item-img" :src="item.lastPhotoUrl" v-else />
+          <u-lazy-load class="item-img" :image="item.lastPhotoUrl" v-else img-mode="aspectFill"></u-lazy-load>
           <div class="item-bottom">
             <h2>{{ item.albumName }}</h2>
             <div class="item-bottom__info">
@@ -191,18 +191,7 @@
           sizeType: ['compressed'],
           sourceType: ['camera'],
           success: res => {
-            let formData = new FormData()
-            formData.append('file', res.tempFiles[0])
-            this.$loading()
-            this.$http.post('/admin/file/add2?type=image', formData).then(res => {
-              if (res.code === 0) {
-                this.linkTo(`./Watermark?url=${res.data.url}`)
-              } else {
-                this.$u.toast(res.msg)
-              }
-
-              uni.hideLoading()
-            })
+            this.linkTo(`./Watermark?url=${encodeURIComponent(res.tempFilePaths[0])}`)
           }
         })
       }