crbtc.org/pages/event/[slug].vue

34 lines
831 B
Vue

<script setup>
const { path } = useRoute()
const { data, error } = await useAsyncData(`content-${path}`, () => {
return queryContent().where({ _path: path }).findOne()
})
if (error.value) {
showError(
createError({
statusCode: 404,
statusMessage: 'Not Found',
})
)
}
import { format, addMinutes, parseISO } from "date-fns";
let date = parseISO(data.value.date)
data.value.date = format(addMinutes(date, 240), 'EEE, MMMM do')
</script>
<template>
<div class="event" :id="data.slug">
<div class="hero">
<h3>{{ data.title }}</h3>
<h4><b>Location</b>: {{ data.location}}</h4>
<h4><b>Address</b>: {{ data.address }}</h4>
<h4><b>Date</b>: {{ data.date }} · {{ data.time }}</h4>
</div>
<ContentDoc class="details" />
</div>
</template>