This commit is contained in:
les 2020-12-04 17:28:54 +01:00
parent 08292c350d
commit a44712c1f5

View file

@ -4,22 +4,19 @@
//- Announcements //- Announcements
Announcement(v-for='announcement in announcements' :key='`a_${announcement.id}`' :announcement='announcement') Announcement(v-for='announcement in announcements' :key='`a_${announcement.id}`' :announcement='announcement')
//- Calendar and search bar
v-row#calbarmb-2 v-row#calbarmb-2
.col-xl-5.col-lg-5.col-md-6.col-sm-12.col-xs-12 .col-xl-5.col-lg-5.col-md-6.col-sm-12.col-xs-12
v-date-picker( //- this is needed as v-calendar does not support SSR
@update:picker-date='monthChange' //- https://github.com/nathanreyes/v-calendar/issues/336
@click:date='dayChange' client-only
:locale='settings.locale' Calendar(@dayclick='dayChange' @monthchange='monthChange' :events='events')
:events='calendarEvents'
:value='date'
landscape)
.col .col
Search( Search(:filters='filters' @update='updateFilters')
:filters='filters'
@update='updateFilters')
v-chip(v-if='selectedDay' close @click:close='dayChange(selectedDay)') {{selectedDay}} v-chip(v-if='selectedDay' close @click:close='dayChange(selectedDay)') {{selectedDay}}
//- Events
#events #events
Event(v-for='event in events' Event(v-for='event in events'
:key='event.id' :event='event' :key='event.id' :event='event'
@ -33,10 +30,11 @@ import dayjs from 'dayjs'
import Event from '@/components/Event' import Event from '@/components/Event'
import Announcement from '@/components/Announcement' import Announcement from '@/components/Announcement'
import Search from '@/components/Search' import Search from '@/components/Search'
import Calendar from '@/components/Calendar'
export default { export default {
name: 'Index', name: 'Index',
components: { Event, Search, Announcement }, components: { Event, Search, Announcement, Calendar },
async asyncData ({ params, $api }) { async asyncData ({ params, $api }) {
const events = await $api.getEvents({ const events = await $api.getEvents({
start: dayjs().unix() start: dayjs().unix()
@ -55,9 +53,6 @@ export default {
}, },
computed: { computed: {
...mapState(['settings', 'announcements']), ...mapState(['settings', 'announcements']),
calendarEvents () {
return this.events.map(e => dayjs.unix(e.start_datetime).format('YYYY-MM-DD'))
}
}, },
methods: { methods: {
...mapActions(['setFilters']), ...mapActions(['setFilters']),
@ -90,9 +85,8 @@ export default {
this.filters = filters this.filters = filters
this.updateEvents() this.updateEvents()
}, },
monthChange (monthYear) { monthChange ({ year, month }) {
this.selectedDay = null this.selectedDay = null
const [year, month] = monthYear.split('-')
// check if current month is selected // check if current month is selected
if (month - 1 === dayjs().month()) { if (month - 1 === dayjs().month()) {