fix: imageviewer sometimes not updating correctly the first time history back is executed after page refresh
This commit is contained in:
parent
fba88be5b2
commit
0853639993
|
@ -74,17 +74,19 @@ export default {
|
||||||
$route () {
|
$route () {
|
||||||
const query = this.$route.query
|
const query = this.$route.query
|
||||||
if (!query || !query.gallery) { return }
|
if (!query || !query.gallery) { return }
|
||||||
const gallery = parseInt(query.gallery)
|
this.$nextTick(() => {
|
||||||
const image = parseInt(query.image) || 0
|
const gallery = parseInt(query.gallery)
|
||||||
|
const image = parseInt(query.image) || 0
|
||||||
|
|
||||||
if (gallery !== this.activeGalleryIndex) {
|
if (gallery !== this.activeGalleryIndex) {
|
||||||
this.activeRow = gallery
|
this.activeRow = gallery
|
||||||
this.activeGalleryIndex = gallery
|
this.activeGalleryIndex = gallery
|
||||||
}
|
}
|
||||||
if (image !== this.activeImageIndex) {
|
if (image !== this.activeImageIndex) {
|
||||||
this.activeImageIndex = image
|
this.activeImageIndex = image
|
||||||
this.showImage = image
|
this.showImage = image
|
||||||
}
|
}
|
||||||
|
})
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
||||||
|
|
|
@ -131,9 +131,7 @@ export default {
|
||||||
methods: {
|
methods: {
|
||||||
// TOOD move logic of getting sizes of elements into getter methods
|
// TOOD move logic of getting sizes of elements into getter methods
|
||||||
scrollToThumb (thumbIndex) {
|
scrollToThumb (thumbIndex) {
|
||||||
console.log('scrollToThumb')
|
|
||||||
if (thumbIndex >= this.galleries[this.activeRow].images.length || thumbIndex < 0) { return }
|
if (thumbIndex >= this.galleries[this.activeRow].images.length || thumbIndex < 0) { return }
|
||||||
console.log('scrollToThumb: executing')
|
|
||||||
const containerWidth = this.$refs.galleryThumbsList.clientWidth
|
const containerWidth = this.$refs.galleryThumbsList.clientWidth
|
||||||
const thumbWidth = this.$refs.thumbContainer[0].clientWidth
|
const thumbWidth = this.$refs.thumbContainer[0].clientWidth
|
||||||
let offset = this.thumbRowOffsets[this.activeRow]
|
let offset = this.thumbRowOffsets[this.activeRow]
|
||||||
|
@ -142,11 +140,9 @@ export default {
|
||||||
|
|
||||||
if (containerWidth < thumbPosition - offset) {
|
if (containerWidth < thumbPosition - offset) {
|
||||||
this.$set(this.thumbRowOffsets, this.activeRow, thumbPosition - containerWidth + 1)
|
this.$set(this.thumbRowOffsets, this.activeRow, thumbPosition - containerWidth + 1)
|
||||||
// console.log(`(${containerWidth + offset}) ${containerWidth} + ${offset} > ${rowWidth}`)
|
|
||||||
this.isLeftDesktopNavActive = containerWidth + offset > rowWidth
|
this.isLeftDesktopNavActive = containerWidth + offset > rowWidth
|
||||||
} else if (thumbPosition <= offset) {
|
} else if (thumbPosition <= offset) {
|
||||||
this.$set(this.thumbRowOffsets, this.activeRow, thumbPosition - thumbWidth)
|
this.$set(this.thumbRowOffsets, this.activeRow, thumbPosition - thumbWidth)
|
||||||
// console.log(`(${containerWidth + offset}) ${containerWidth} + ${offset} > ${rowWidth}`)
|
|
||||||
this.isLeftDesktopNavActive = containerWidth + offset > rowWidth
|
this.isLeftDesktopNavActive = containerWidth + offset > rowWidth
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
Loading…
Reference in New Issue