|
|
@@ -41,7 +41,7 @@
|
|
|
<el-row>
|
|
|
<el-col :md="24" class="movie-list">
|
|
|
<div>
|
|
|
- <el-col v-for="image in data.imageUrls" :key="image.thumbnailUrl" :md="6" :sm="12" :xs="12">
|
|
|
+ <el-col v-for="(image, index) in data.imageUrls" :key="image.thumbnailUrl" :md="6" :sm="12" :xs="12">
|
|
|
<el-card :body-style="{ padding: '0px' }" class="card">
|
|
|
<div class="imgs">
|
|
|
<el-image
|
|
|
@@ -49,7 +49,7 @@
|
|
|
fit="cover"
|
|
|
class="coverImg"
|
|
|
:src="image.thumbnailUrl"
|
|
|
- @click="showImages(data.imageUrls)">
|
|
|
+ @click="showImages(index)">
|
|
|
</el-image>
|
|
|
<span style="position: absolute; bottom: 0; left: 0; color:white">
|
|
|
<i v-if="true" class="el-icon-monitor" />
|
|
|
@@ -80,6 +80,11 @@ export default {
|
|
|
// 屏幕宽度, 为了控制分页条的大小
|
|
|
screenWidth: document.body.clientWidth,
|
|
|
currentPage: 1,
|
|
|
+ viewerOptions:{
|
|
|
+ movable: true,
|
|
|
+ fullscreen: false,
|
|
|
+ keyboard: true
|
|
|
+ },
|
|
|
user: null,
|
|
|
data: null,
|
|
|
followButton: {
|
|
|
@@ -115,24 +120,22 @@ export default {
|
|
|
}
|
|
|
},
|
|
|
methods: {
|
|
|
- showImages(imageUrls) {
|
|
|
- const imgs = []
|
|
|
- for (const i of imageUrls) {
|
|
|
- imgs.push(i.originalUrl)
|
|
|
+ showImages(index) {
|
|
|
+ const imageUrls = []
|
|
|
+ for (const i of this.data.imageUrls) {
|
|
|
+ imageUrls.push(i.originalUrl)
|
|
|
}
|
|
|
|
|
|
this.$viewerApi({
|
|
|
- images: imgs,
|
|
|
+ images: imageUrls,
|
|
|
options: {
|
|
|
+ initialViewIndex: index,
|
|
|
movable: true,
|
|
|
fullscreen: false,
|
|
|
keyboard: true
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- showImage() {
|
|
|
- this.$viewerApi()
|
|
|
- },
|
|
|
followUser(userId) {
|
|
|
if (this.followButton.text === '关注') {
|
|
|
followUser(userId).then(res => {
|