vertumnus
/
primevue-mirror
mirror of https://github.com/primefaces/primevue.git
1
0
Fork 0
Code Packages Releases Activity

Fixed #1523 - Thumbnails are not displayed correctly on Galleria if numVisible is greater than the length of value

pull/1527/head
mertsincan 2021-09-08 14:41:51 +03:00
parent f5226f6803
commit e274666d4d
2 changed files with 11 additions and 1 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/galleria/Galleria.vue
View File

@ -286,6 +286,7 @@ export default {
.p-galleria-thumbnail-items-container { .p-galleria-thumbnail-items-container {
overflow: hidden; overflow: hidden;
width: 100%;
} }
.p-galleria-thumbnail-items { .p-galleria-thumbnail-items {

11
src/components/galleria/GalleriaContent.vue
View File

@ -13,7 +13,7 @@
@start-slideshow="startSlideShow" @stop-slideshow="stopSlideShow" /> @start-slideshow="startSlideShow" @stop-slideshow="stopSlideShow" />
<GalleriaThumbnails v-if="$attrs.showThumbnails" :containerId="id" :value="$attrs.value" v-model:activeIndex="activeIndex" :templates="$attrs.templates" <GalleriaThumbnails v-if="$attrs.showThumbnails" :containerId="id" :value="$attrs.value" v-model:activeIndex="activeIndex" :templates="$attrs.templates"
:numVisible="$attrs.numVisible" :responsiveOptions="$attrs.responsiveOptions" :circular="$attrs.circular" :numVisible="numVisible" :responsiveOptions="$attrs.responsiveOptions" :circular="$attrs.circular"
:isVertical="isVertical()" :contentHeight="$attrs.verticalThumbnailViewPortHeight" :showThumbnailNavigators="$attrs.showThumbnailNavigators" :isVertical="isVertical()" :contentHeight="$attrs.verticalThumbnailViewPortHeight" :showThumbnailNavigators="$attrs.showThumbnailNavigators"
v-model:slideShowActive="slideShowActive" @stop-slideshow="stopSlideShow" /> v-model:slideShowActive="slideShowActive" @stop-slideshow="stopSlideShow" />
</div> </div>
@ -39,12 +39,21 @@ export default {
return { return {
id: this.$attrs.id || UniqueComponentId(), id: this.$attrs.id || UniqueComponentId(),
activeIndex: this.$attrs.activeIndex, activeIndex: this.$attrs.activeIndex,
numVisible: this.$attrs.numVisible,
slideShowActive: false slideShowActive: false
} }
}, },
watch: { watch: {
'$attrs.value': function(newVal) {
if (newVal && newVal.length < this.numVisible) {
this.numVisible = newVal.length;
}
},
'$attrs.activeIndex': function(newVal) { '$attrs.activeIndex': function(newVal) {
this.activeIndex = newVal; this.activeIndex = newVal;
},
'$attrs.numVisible': function(newVal) {
this.numVisible = newVal;
} }
}, },
updated() { updated() {