close #288 fix image list arrow

This commit is contained in:
nasum 2018-05-11 17:27:33 +09:00
parent 27da363cda
commit 28d52fa6d8
2 changed files with 14 additions and 10 deletions

View File

@ -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 () {

View File

@ -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)
} }
} }
} }