calendar loading..

This commit is contained in:
lesion
2023-01-09 16:56:01 +01:00
parent 2752c8ab07
commit 901c11e6cc
2 changed files with 15 additions and 15 deletions

View File

@@ -15,13 +15,14 @@
aria-label='Calendar' aria-label='Calendar'
is-expanded is-expanded
is-inline) is-inline)
template(v-slot="{ inputValue, inputEvents }") //- template(v-slot="{ inputValue, inputEvents }")
v-btn#calendarButton(v-on='inputEvents' text tile :color='selectedDate ? "primary" : "" ') {{inputValue || $t('common.calendar')}} v-btn#calendarButton(v-on='inputEvents' text tile :color='selectedDate ? "primary" : "" ') {{inputValue || $t('common.calendar')}}
v-icon(v-if='selectedDate' v-text='mdiClose' right small icon @click.prevent.stop='selectedDate = null') v-icon(v-if='selectedDate' v-text='mdiClose' right small icon @click.prevent.stop='selectedDate = null')
v-icon(v-else v-text='mdiChevronDown' right small icon) v-icon(v-else v-text='mdiChevronDown' right small icon)
template(v-slot:placeholder) .calh.d-flex.justify-center.align-center(slot='placeholder')
v-btn#calendarButton(text tile) {{$t('common.calendar')}} v-progress-circular(indeterminate)
v-icon(v-text='mdiChevronDown' right small icon) //- v-btn#calendarButton(text tile) {{$t('common.calendar')}}
//- v-icon(v-text='mdiChevronDown' right small icon)
</template> </template>

View File

@@ -24,8 +24,9 @@ v-col(cols=12)
is-inline is-inline
is-expanded is-expanded
:min-date='type !== "recurrent" && new Date()') :min-date='type !== "recurrent" && new Date()')
template(#placeholder) //- template(#placeholder)
span.calc Loading .d-flex.calh.justify-center(slot='placeholder')
v-progress-circular(indeterminate)
div.text-center.mb-2(v-if='type === "recurrent"') div.text-center.mb-2(v-if='type === "recurrent"')
span(v-if='value.recurrent.frequency !== "1m" && value.recurrent.frequency !== "2m"') {{ whenPatterns }} span(v-if='value.recurrent.frequency !== "1m" && value.recurrent.frequency !== "2m"') {{ whenPatterns }}
@@ -94,7 +95,7 @@ v-col(cols=12)
</template> </template>
<script> <script>
import dayjs from 'dayjs' import dayjs from 'dayjs'
import { mapState } from 'vuex' import { mapState, mapActions } from 'vuex'
import List from '@/components/List' import List from '@/components/List'
import { attributesFromEvents } from '../assets/helper' import { attributesFromEvents } from '../assets/helper'
import { mdiClockTimeFourOutline, mdiClockTimeEightOutline, mdiClose } from '@mdi/js' import { mdiClockTimeFourOutline, mdiClockTimeEightOutline, mdiClose } from '@mdi/js'
@@ -113,7 +114,6 @@ export default {
menuFromHour: false, menuFromHour: false,
menuDueHour: false, menuDueHour: false,
type: this.value.type || 'normal', type: this.value.type || 'normal',
events: [],
frequencies: [ frequencies: [
{ value: '1w', text: this.$t('event.each_week') }, { value: '1w', text: this.$t('event.each_week') },
{ value: '2w', text: this.$t('event.each_2w') }, { value: '2w', text: this.$t('event.each_2w') },
@@ -122,7 +122,7 @@ export default {
} }
}, },
computed: { computed: {
...mapState(['settings']), ...mapState(['settings', 'events']),
fromDate () { fromDate () {
if (this.value.from) { if (this.value.from) {
if (this.value.multidate) { if (this.value.multidate) {
@@ -138,7 +138,7 @@ export default {
return this.events.filter(e => e.start_datetime >= start && e.start_datetime <= end) return this.events.filter(e => e.start_datetime >= start && e.start_datetime <= end)
}, },
attributes() { attributes() {
return attributesFromEvents(this.events) return attributesFromEvents(this.events.filter(e => e.id !== this.event.id))
}, },
whenPatterns() { whenPatterns() {
if (!this.value.from) { return } if (!this.value.from) { return }
@@ -192,13 +192,12 @@ export default {
} else { } else {
this.type = 'normal' this.type = 'normal'
} }
this.events = await this.$api.getEvents({ if (!this.events) {
start: dayjs().unix(), this.getEvents()
show_recurrent: true }
})
this.events = this.events.filter(e => e.id !== this.event.id)
}, },
methods: { methods: {
...mapActions(['getEvents']),
updateRecurrent(value) { updateRecurrent(value) {
this.$emit('input', { ...this.value, recurrent: value || null }) this.$emit('input', { ...this.value, recurrent: value || null })
}, },