close #288 fix image list arrow
This commit is contained in:
parent
27da363cda
commit
28d52fa6d8
|
@ -6,9 +6,9 @@
|
||||||
<el-button type="text" icon="el-icon-close" @click="close" class="close-button"></el-button>
|
<el-button type="text" icon="el-icon-close" @click="close" class="close-button"></el-button>
|
||||||
</div>
|
</div>
|
||||||
<div class="image-content">
|
<div class="image-content">
|
||||||
<span class="button-area"><el-button type="text" v-show="!isFirst"><i class="el-icon-arrow-left" @click.stop="decrementIndex"></i></el-button></span>
|
<span class="button-area"><el-button type="text" v-show="showLeft"><i class="el-icon-arrow-left" @click.stop="decrementIndex"></i></el-button></span>
|
||||||
<img :src="imageURL">
|
<img :src="imageURL">
|
||||||
<span class="button-area"><el-button type="text" v-show="!isLast"><i class="el-icon-arrow-right" @click.stop="incrementIndex"></i></el-button></span>
|
<span class="button-area"><el-button type="text" v-show="showRight"><i class="el-icon-arrow-right" @click.stop="incrementIndex"></i></el-button></span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
@ -27,11 +27,11 @@ export default {
|
||||||
imageURL () {
|
imageURL () {
|
||||||
return this.$store.getters['TimelineSpace/Modals/ImageViewer/imageURL']
|
return this.$store.getters['TimelineSpace/Modals/ImageViewer/imageURL']
|
||||||
},
|
},
|
||||||
isFirst () {
|
showLeft () {
|
||||||
return this.$store.getters['TimelineSpace/Modals/ImageViewer/isFirst']
|
return this.$store.getters['TimelineSpace/Modals/ImageViewer/showLeft']
|
||||||
},
|
},
|
||||||
isLast () {
|
showRight () {
|
||||||
return this.$store.getters['TimelineSpace/Modals/ImageViewer/isLast']
|
return this.$store.getters['TimelineSpace/Modals/ImageViewer/showRight']
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
updated () {
|
updated () {
|
||||||
|
|
|
@ -44,11 +44,15 @@ const ImageViewer = {
|
||||||
imageURL (state) {
|
imageURL (state) {
|
||||||
return state.mediaList[state.currentIndex]
|
return state.mediaList[state.currentIndex]
|
||||||
},
|
},
|
||||||
isFirst (state) {
|
showLeft (state) {
|
||||||
return state.currentIndex === 0 && state.mediaList.length > 1
|
const notFirst = (state.currentIndex > 0)
|
||||||
|
const isManyItem = (state.mediaList.length > 1)
|
||||||
|
return (notFirst && isManyItem)
|
||||||
},
|
},
|
||||||
isLast (state) {
|
showRight (state) {
|
||||||
return state.currentIndex === (state.mediaList.length - 1) && state.mediaList.length > 1
|
const notLast = (state.currentIndex < (state.mediaList.length - 1))
|
||||||
|
const isManyItem = (state.mediaList.length > 1)
|
||||||
|
return (notLast && isManyItem)
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue