From 901c11e6ccd6a0eea362729ae50c049555df5315 Mon Sep 17 00:00:00 2001
From: lesion <lesion@autistici.org>
Date: Mon, 9 Jan 2023 16:56:01 +0100
Subject: [PATCH] calendar loading..

---
 components/Calendar.vue  |  9 +++++----
 components/DateInput.vue | 21 ++++++++++-----------
 2 files changed, 15 insertions(+), 15 deletions(-)

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