图片懒加载
This commit is contained in:
@@ -35,7 +35,7 @@ export default {
|
|||||||
margin-bottom: 20px;
|
margin-bottom: 20px;
|
||||||
|
|
||||||
.emptyImg {
|
.emptyImg {
|
||||||
width: initial;
|
width: 300px;
|
||||||
height: initial;
|
height: initial;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|||||||
@@ -48,7 +48,7 @@
|
|||||||
<div class="photo-item__wrapper">
|
<div class="photo-item__wrapper">
|
||||||
<div class="photo-item" @click="linkTo('./Photo?id=' + item.id)" v-for="(item, index) in list" :key="index">
|
<div class="photo-item" @click="linkTo('./Photo?id=' + item.id)" v-for="(item, index) in list" :key="index">
|
||||||
<!-- <image :src="item.photoUrl" mode="aspectFill" /> -->
|
<!-- <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">
|
<div class="photo-item__text">
|
||||||
<h2><AiOpenData v-if="item.createUserId" type="userName" :openid="item.createUserId"></AiOpenData></h2>
|
<h2><AiOpenData v-if="item.createUserId" type="userName" :openid="item.createUserId"></AiOpenData></h2>
|
||||||
<p>{{ item.createTime }}</p>
|
<p>{{ item.createTime }}</p>
|
||||||
@@ -206,17 +206,7 @@
|
|||||||
sizeType: ['compressed'],
|
sizeType: ['compressed'],
|
||||||
sourceType: this.info.photoSource === '1' ? ['camera'] : ['album', 'camera'],
|
sourceType: this.info.photoSource === '1' ? ['camera'] : ['album', 'camera'],
|
||||||
success: res => {
|
success: res => {
|
||||||
let formData = new FormData()
|
this.linkTo(`./Watermark?url=${encodeURIComponent(res.tempFilePaths[0])}&albumId=${this.id}`)
|
||||||
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()
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -1,7 +1,7 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="EditAlbum" v-if="pageShow">
|
<div class="EditAlbum" v-if="pageShow">
|
||||||
<div class="img-item" v-for="(item, index) in list" :key="index" @click="choose(index)">
|
<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>
|
<span class="icon" v-if="!item.checked"></span>
|
||||||
<image class="icon" v-else src="./images/img-choose.png" />
|
<image class="icon" v-else src="./images/img-choose.png" />
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -181,7 +181,7 @@
|
|||||||
this.albumId = query.albumId
|
this.albumId = query.albumId
|
||||||
}
|
}
|
||||||
|
|
||||||
this.img = query.url
|
this.img = decodeURIComponent(query.url)
|
||||||
this.height = uni.getSystemInfoSync().windowHeight
|
this.height = uni.getSystemInfoSync().windowHeight
|
||||||
|
|
||||||
this.getLocation()
|
this.getLocation()
|
||||||
@@ -248,11 +248,10 @@
|
|||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
html2canvas(this.$refs.waterMarker, {
|
html2canvas(this.$refs.waterMarker, {
|
||||||
allowTaint: true,
|
allowTaint: true,
|
||||||
useCORS: true,
|
useCORS: true
|
||||||
dpi: 300
|
|
||||||
}).then((canvas) => {
|
}).then((canvas) => {
|
||||||
let dataURL = canvas.toDataURL('image/png')
|
let dataURL = canvas.toDataURL('image/jpg')
|
||||||
const file = this.dataURLtoFile(dataURL, 'photo.png')
|
const file = this.dataURLtoFile(dataURL, 'photo.jpg')
|
||||||
let formData = new FormData()
|
let formData = new FormData()
|
||||||
formData.append('file', file)
|
formData.append('file', file)
|
||||||
this.$http.post('/admin/file/add2?type=image', formData).then(res => {
|
this.$http.post('/admin/file/add2?type=image', formData).then(res => {
|
||||||
|
|||||||
@@ -55,7 +55,7 @@
|
|||||||
<div class="item" v-for="(item, index) in list" :key="index" @click="linkTo('./AlbumDetail?id=' + item.id)">
|
<div class="item" v-for="(item, index) in list" :key="index" @click="linkTo('./AlbumDetail?id=' + item.id)">
|
||||||
<span v-if="item.photoHasRead === 'NO'">未查看</span>
|
<span v-if="item.photoHasRead === 'NO'">未查看</span>
|
||||||
<image src="./../images/icon.png" v-if="!item.lastPhotoUrl" />
|
<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">
|
<div class="item-bottom">
|
||||||
<h2>{{ item.albumName }}</h2>
|
<h2>{{ item.albumName }}</h2>
|
||||||
<div class="item-bottom__info">
|
<div class="item-bottom__info">
|
||||||
@@ -191,18 +191,7 @@
|
|||||||
sizeType: ['compressed'],
|
sizeType: ['compressed'],
|
||||||
sourceType: ['camera'],
|
sourceType: ['camera'],
|
||||||
success: res => {
|
success: res => {
|
||||||
let formData = new FormData()
|
this.linkTo(`./Watermark?url=${encodeURIComponent(res.tempFilePaths[0])}`)
|
||||||
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()
|
|
||||||
})
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user