Browse Source

[WHAT] 增加展覽內容頁多媒體顯示&右邊選單

Dev
berlin-tzen 2 years ago
parent
commit
62973ac032
  1. 38
      FrontEnd/components/exhibition/ExhibitionPhotoVideoGallery.vue
  2. 10
      FrontEnd/pages/exhibition/_id.vue

38
FrontEnd/components/exhibition/ExhibitionPhotoVideoGallery.vue

@ -1,25 +1,25 @@
<template>
<v-spacer class="wrapper width-100vw align-center py-7 mb-13 neutrals darken-1" height="100%">
<v-carousel hide-delimiters class="py-5" width="100%" height="100%">
<template v-for="(video, i) in exhibition.videos">
<v-carousel-item v-if="exhibition.videos.length > 0" :key="i">
<v-row align="center" justify="center">
<iframe :width="$vuetify.breakpoint.smAndUp ? 640 : 320" :height="$vuetify.breakpoint.smAndUp ? 360 : 180"
:src="video" title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen></iframe>
</v-row>
</v-carousel-item>
</template>
<template v-for="(image, index) in exhibition.gallery.images">
<v-carousel-item v-if="exhibition.gallery"
:key="'image'+index">
<v-row align="center" justify="center">
<v-img :src="image" contain :width="$vuetify.breakpoint.smAndUp ? 640 : 320"
:height="$vuetify.breakpoint.smAndUp ? 360 : 180"></v-img>
</v-row>
</v-carousel-item>
</template>
<template v-for="(video, idx) in exhibition.videos">
<v-carousel-item v-if="exhibition.videos.length > 0" :key="'video' + idx">
<v-row align="center" justify="center">
<iframe :width="$vuetify.breakpoint.smAndUp ? 640 : 320" :height="$vuetify.breakpoint.smAndUp ? 360 : 180"
:src="video.VideoLink" title="YouTube video player" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen>
</iframe>
</v-row>
</v-carousel-item>
</template>
<template v-for="(image, index) in exhibition.gallery">
<v-carousel-item v-if="exhibition.gallery" :key="'image' + index">
<v-row align="center" justify="center">
<v-img :src="image.ImageLink" contain :width="$vuetify.breakpoint.smAndUp ? 640 : 320"
:height="$vuetify.breakpoint.smAndUp ? 360 : 180"></v-img>
</v-row>
</v-carousel-item>
</template>
</v-carousel>
</v-spacer>
</template>

10
FrontEnd/pages/exhibition/_id.vue

@ -428,8 +428,8 @@ export default {
this.exhibition.frequency = exhib.Frequency;
this.exhibition.online = exhib.IsVirtualEvent;
this.exhibition.organizers = exhib.Organizers;
this.exhibition.videos = "";
this.exhibition.gallery = "";
this.exhibition.videos = exhib.Videos;
this.exhibition.gallery = exhib.Images;
this.exhibition.venues = exhib.Venues;
this.exhibition.categories = exhib.MainCategories;
this.exhibition.subcategories = exhib.SubCategories;
@ -457,15 +457,15 @@ export default {
},
setSideBarList() {
if (this.relatedservicelist.size > 0) {
if (this.relatedservicelist.length > 0) {
this.fixBarList.push({ id: "relatedServices", title: "Related Services", show: true });
}
if (this.exhibition.videos.size > 0 || this.exhibition.gallery.size > 0) {
if (this.exhibition.videos.length > 0 || this.exhibition.gallery.length > 0) {
this.fixBarList.push({ id: "photoGallery", title: "Photo & Video Gallery", show: true });
}
if (this.exhibition.venues) {
if (this.exhibition.venues.length > 0) {
this.fixBarList.push({ id: "venue", title: "Venue", show: true });
}

Loading…
Cancel
Save