live search

This commit is contained in:
lesion 2022-11-24 17:28:00 +01:00
parent 0d9f2db908
commit 3125276508
No known key found for this signature in database
GPG key ID: 352918250B012177

View file

@ -1,6 +1,6 @@
<template lang="pug"> <template lang="pug">
#navsearch.mt-2.mt-sm-4 #navsearch.mt-2.mt-sm-4
v-text-field.mx-2(outlined dense hide-details :placeholder='$t("common.search")' :append-icon='mdiMagnify') v-text-field.mx-2(outlined dense hide-details :placeholder='$t("common.search")' :append-icon='mdiMagnify' @input='search' clearable :clear-icon='mdiClose')
template(v-slot:prepend-inner) template(v-slot:prepend-inner)
Calendar(v-if='!settings.hide_calendar') Calendar(v-if='!settings.hide_calendar')
v-btn.ml-2.mt-2.gap-2(small outlined v-for='collection in collections' color='primary' :key='collection.id' :to='`/collection/${encodeURIComponent(collection.name)}`') {{collection.name}} v-btn.ml-2.mt-2.gap-2(small outlined v-for='collection in collections' color='primary' :key='collection.id' :to='`/collection/${encodeURIComponent(collection.name)}`') {{collection.name}}
@ -8,18 +8,23 @@
<script> <script>
import { mapState } from 'vuex' import { mapState } from 'vuex'
import Calendar from '@/components/Calendar' import Calendar from '@/components/Calendar'
import { mdiMagnify } from '@mdi/js' import { mdiMagnify, mdiClose } from '@mdi/js'
export default { export default {
data: () => ({ data: () => ({
mdiMagnify, mdiMagnify, mdiClose,
collections: [] collections: []
}), }),
async fetch () { async fetch () {
this.collections = await this.$axios.$get('collections').catch(_e => []) this.collections = await this.$axios.$get('collections').catch(_e => [])
}, },
components: { Calendar }, components: { Calendar },
computed: mapState(['settings']) computed: mapState(['settings']),
methods: {
search (ev) {
this.$root.$emit('search', ev)
}
}
} }
</script> </script>
<style> <style>