mirror of
https://framagit.org/les/gancio.git
synced 2025-02-01 00:52:01 +01:00
keep-alive index page
This commit is contained in:
parent
c3741238fc
commit
9dc0d3ce16
3 changed files with 41 additions and 39 deletions
|
@ -4,7 +4,7 @@
|
||||||
<v-main>
|
<v-main>
|
||||||
<Snackbar/>
|
<Snackbar/>
|
||||||
<Confirm/>
|
<Confirm/>
|
||||||
<nuxt :keep-alive='$route.name === "index"'/>
|
<nuxt keep-alive :keep-alive-props="{include: ['Index']}"/>
|
||||||
</v-main>
|
</v-main>
|
||||||
<Footer/>
|
<Footer/>
|
||||||
|
|
||||||
|
|
|
@ -21,27 +21,35 @@ export default {
|
||||||
name: 'Index',
|
name: 'Index',
|
||||||
components: { Event, Announcement },
|
components: { Event, Announcement },
|
||||||
middleware: 'setup',
|
middleware: 'setup',
|
||||||
async fetch () {
|
fetch () {
|
||||||
return this.getEvents()
|
return this.getEvents({
|
||||||
|
start: this.start,
|
||||||
|
end: this.end
|
||||||
|
})
|
||||||
},
|
},
|
||||||
activated() {
|
activated() {
|
||||||
if (this.$fetchState.timestamp <= Date.now() - 60000) {
|
if (!this.isCurrentMonth) {
|
||||||
this.$fetch();
|
this.start = dayjs().startOf('month').unix()
|
||||||
|
this.end = null
|
||||||
|
this.$fetch()
|
||||||
|
this.isCurrentMonth = true
|
||||||
|
return
|
||||||
|
}
|
||||||
|
if (this.$fetchState.timestamp <= (Date.now() - 60000)) {
|
||||||
|
this.$fetch()
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data ({ $store }) {
|
data () {
|
||||||
return {
|
return {
|
||||||
mdiMagnify, mdiCloseCircle,
|
mdiMagnify, mdiCloseCircle,
|
||||||
isCurrentMonth: true,
|
isCurrentMonth: true,
|
||||||
now: dayjs().unix(),
|
now: dayjs().unix(),
|
||||||
date: dayjs.tz().format('YYYY-MM-DD'),
|
// date: dayjs.tz().format('YYYY-MM-DD'),
|
||||||
start: dayjs().startOf('month').unix(),
|
start: dayjs().startOf('month').unix(),
|
||||||
end: null,
|
end: null,
|
||||||
searching: false,
|
|
||||||
tmpEvents: [],
|
tmpEvents: [],
|
||||||
selectedDay: null,
|
selectedDay: null,
|
||||||
storeUnsubscribe: null
|
storeUnsubscribe: null
|
||||||
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
head () {
|
head () {
|
||||||
|
@ -80,7 +88,7 @@ export default {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted () {
|
created () {
|
||||||
this.$root.$on('dayclick', this.dayChange)
|
this.$root.$on('dayclick', this.dayChange)
|
||||||
this.$root.$on('monthchange', this.monthChange)
|
this.$root.$on('monthchange', this.monthChange)
|
||||||
this.storeUnsubscribe = this.$store.subscribeAction( { after: (action, state) => {
|
this.storeUnsubscribe = this.$store.subscribeAction( { after: (action, state) => {
|
||||||
|
@ -88,7 +96,8 @@ export default {
|
||||||
if (this.filter.query && this.filter.query.length > 2) {
|
if (this.filter.query && this.filter.query.length > 2) {
|
||||||
this.search()
|
this.search()
|
||||||
} else {
|
} else {
|
||||||
this.updateEvents()
|
this.tmpEvents = []
|
||||||
|
this.$fetch()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}})
|
}})
|
||||||
|
@ -109,34 +118,28 @@ export default {
|
||||||
show_multidate: this.filter.show_multidate,
|
show_multidate: this.filter.show_multidate,
|
||||||
query: this.filter.query
|
query: this.filter.query
|
||||||
})
|
})
|
||||||
}, 100),
|
}, 200),
|
||||||
updateEvents () {
|
|
||||||
return this.getEvents({
|
|
||||||
start: this.start,
|
|
||||||
end: this.end
|
|
||||||
})
|
|
||||||
},
|
|
||||||
async monthChange ({ year, month }) {
|
async monthChange ({ year, month }) {
|
||||||
this.$nuxt.$loading.start()
|
this.$nuxt.$loading.start()
|
||||||
this.$nextTick( async () => {
|
let isCurrentMonth
|
||||||
|
|
||||||
// unselect current selected day
|
// unselect current selected day
|
||||||
this.selectedDay = null
|
this.selectedDay = null
|
||||||
|
|
||||||
// check if current month is selected
|
// check if current month is selected
|
||||||
if (month - 1 === dayjs.tz().month() && year === dayjs.tz().year()) {
|
if (month - 1 === dayjs.tz().month() && year === dayjs.tz().year()) {
|
||||||
this.isCurrentMonth = true
|
isCurrentMonth = true
|
||||||
this.start = dayjs().startOf('month').unix()
|
this.start = dayjs().startOf('month').unix()
|
||||||
this.date = dayjs.tz().format('YYYY-MM-DD')
|
// this.date = dayjs.tz().format('YYYY-MM-DD')
|
||||||
} else {
|
} else {
|
||||||
this.isCurrentMonth = false
|
isCurrentMonth = false
|
||||||
this.date = ''
|
// this.date = ''
|
||||||
this.start = dayjs().year(year).month(month - 1).startOf('month').unix() // .startOf('week').unix()
|
this.start = dayjs().year(year).month(month - 1).startOf('month').unix() // .startOf('week').unix()
|
||||||
}
|
}
|
||||||
this.end = dayjs().year(year).month(month).endOf('month').unix() // .endOf('week').unix()
|
this.end = dayjs().year(year).month(month).endOf('month').unix() // .endOf('week').unix()
|
||||||
await this.updateEvents()
|
await this.$fetch()
|
||||||
this.$nuxt.$loading.finish()
|
this.$nuxt.$loading.finish()
|
||||||
})
|
this.$nextTick( () => this.isCurrentMonth = isCurrentMonth)
|
||||||
|
|
||||||
},
|
},
|
||||||
dayChange (day) {
|
dayChange (day) {
|
||||||
|
|
|
@ -26,7 +26,7 @@ export const state = () => ({
|
||||||
filter: {
|
filter: {
|
||||||
query: '',
|
query: '',
|
||||||
show_recurrent: null,
|
show_recurrent: null,
|
||||||
show_multidate: null
|
show_multidate: null,
|
||||||
},
|
},
|
||||||
announcements: [],
|
announcements: [],
|
||||||
events: []
|
events: []
|
||||||
|
@ -43,7 +43,7 @@ export const mutations = {
|
||||||
state.announcements = announcements
|
state.announcements = announcements
|
||||||
},
|
},
|
||||||
setEvents (state, events) {
|
setEvents (state, events) {
|
||||||
state.events = events
|
state.events = Object.freeze(events)
|
||||||
},
|
},
|
||||||
setFilter (state, { type, value }) {
|
setFilter (state, { type, value }) {
|
||||||
state.filter[type] = value
|
state.filter[type] = value
|
||||||
|
@ -84,6 +84,5 @@ export const actions = {
|
||||||
show_multidate: state.filter.show_multidate
|
show_multidate: state.filter.show_multidate
|
||||||
})
|
})
|
||||||
commit('setEvents', events)
|
commit('setEvents', events)
|
||||||
return events
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in a new issue