gancio-upstream/pages/place/_place.vue
2023-04-05 16:14:55 +02:00

48 lines
1.6 KiB
Vue

<template>
<v-container id='home' class='px-2 px-sm-6 pt-0'>
<h1 class='d-block text-h4 font-weight-black text-center text-uppercase mt-10 mx-auto w-100 text-underline'>
<u>{{ place.name }}</u>
</h1>
<span v-if='place.name!=="online"' class="d-block text-subtitle text-center w-100">{{ place.address }}</span>
<!-- Events -->
<div id="events" class='mt-14'>
<v-lazy class='event v-card' :value='idx<9' v-for='(event, idx) in events' :key='event.id' :min-height='hide_thumbs ? 105 : undefined' :options="{ threshold: .5, rootMargin: '500px' }" :class="{ 'theme--dark': is_dark }">
<Event :event='event' :lazy='idx > 9' />
</v-lazy>
</div>
</v-container>
</template>
<script>
import { mapState, mapGetters } from 'vuex'
import Event from '@/components/Event'
export default {
name: 'Place',
components: { Event },
head() {
const title = `${this.settings.title} - ${this.place.name}`
return {
title,
link: [
{ rel: 'alternate', type: 'application/rss+xml', title, href: this.settings.baseurl + `/feed/rss/place/${this.place.name}` },
{ rel: 'alternate', type: 'text/calendar', title, href: this.settings.baseurl + `/feed/ics/place/${this.place.name}` }
]
}
},
computed: {
...mapState(['settings']),
...mapGetters(['hide_thumbs', 'is_dark']),
},
asyncData({ $axios, params, error }) {
try {
const place = params.place
return $axios.$get(`/place/${encodeURIComponent(place)}`)
} catch (e) {
error({ statusCode: 400, message: 'Error!' })
}
}
}
</script>