minor on export search

components/Search.vue

@@ -1,12 +1,15 @@
 <template lang="pug">
-v-container.pt-0.pt-md-2
+v-row
-  v-switch.mt-0(
+  v-col(cols=12)
+    v-switch(
       v-if='settings.allow_recurrent_event'
-    v-model='showRecurrent'
+      v-model='show_recurrent'
+      @change='change'
       inset color='primary'
       hide-details
       :label="$t('event.show_recurrent')")
-  v-autocomplete(
+  v-col.mb-4(cols=12)
+    v-autocomplete.p-0(
       v-model='meta'
       :label='$t("common.search")'
       :filter='filter'
@@ -15,6 +18,8 @@ v-container.pt-0.pt-md-2
       color='primary'
       hide-selected
       small-chips
+      @focus='search'
+      :menu-props="{ maxWidth: '400' }"
       :items='items'
       @change='change'
       hide-no-data
@@ -48,26 +53,17 @@ import debounce from 'lodash/debounce'
 export default {
   name: 'Search',
   props: {
-    filters: { type: Object, default: () => ({}) }
+    filters: { type: Object, default: () => ({ }) }
   },
   data () {
     return {
       mdiTag, mdiMapMarker, mdiCloseCircle,
       meta: [],
       items: [],
+      show_recurrent: this.filters.show_recurrent || false
     }
   },
-  computed: {
+  computed: mapState(['settings']),
-    ...mapState(['settings']),
-    showRecurrent: {
-      get () {
-        return this.filters.show_recurrent
-      },
-      set (v) {
-        this.change(v)
-      }
-    },
-  },
   methods: {
     filter (item, queryText, itemText) {
       return itemText.toLocaleLowerCase().indexOf(queryText.toLocaleLowerCase()) > -1 || 
@@ -80,11 +76,11 @@ export default {
       this.meta = this.meta.filter(m => m.type !== item.type || m.type === 'place' ? m.id !== item.id : m.label !== item.label)
       this.change()
     },
-    change (show_recurrent) {
+    change () {
       const filters = {
         tags: this.meta.filter(t => t.type === 'tag').map(t => t.label),
         places: this.meta.filter(p => p.type === 'place').map(p => p.id),
-        show_recurrent: typeof show_recurrent !== 'undefined' ? show_recurrent : this.filters.show_recurrent
+        show_recurrent: this.show_recurrent
       }
       this.$emit('update', filters)
     }