2020-06-30 20:53:25 +00:00
|
|
|
<template>
|
|
|
|
<multiselect
|
2021-06-23 23:24:57 +00:00
|
|
|
:placeholder="$t('namespace.search')"
|
2021-01-06 22:36:31 +00:00
|
|
|
@search="findNamespaces"
|
|
|
|
:search-results="namespaces"
|
2020-09-05 20:35:52 +00:00
|
|
|
@select="select"
|
|
|
|
label="title"
|
2021-07-27 13:36:02 +00:00
|
|
|
:search-delay="10"
|
2021-01-06 22:36:31 +00:00
|
|
|
/>
|
2020-06-30 20:53:25 +00:00
|
|
|
</template>
|
|
|
|
|
|
|
|
<script>
|
2021-07-25 13:27:15 +00:00
|
|
|
import Multiselect from '@/components/input/multiselect.vue'
|
2020-06-30 20:53:25 +00:00
|
|
|
|
2020-09-05 20:35:52 +00:00
|
|
|
export default {
|
|
|
|
name: 'namespace-search',
|
2021-08-23 19:18:12 +00:00
|
|
|
emits: ['selected'],
|
2020-09-05 20:35:52 +00:00
|
|
|
data() {
|
|
|
|
return {
|
2021-07-27 13:36:02 +00:00
|
|
|
query: '',
|
2020-09-05 20:35:52 +00:00
|
|
|
}
|
|
|
|
},
|
|
|
|
components: {
|
2021-01-06 22:36:31 +00:00
|
|
|
Multiselect,
|
2020-09-05 20:35:52 +00:00
|
|
|
},
|
2021-07-27 13:36:02 +00:00
|
|
|
computed: {
|
|
|
|
namespaces() {
|
2021-11-14 20:49:52 +00:00
|
|
|
return this.$store.getters['namespaces/searchNamespace'](this.query)
|
2021-07-27 13:36:02 +00:00
|
|
|
},
|
2020-09-05 20:35:52 +00:00
|
|
|
},
|
|
|
|
methods: {
|
|
|
|
findNamespaces(query) {
|
2021-07-27 13:36:02 +00:00
|
|
|
this.query = query
|
2020-06-30 20:53:25 +00:00
|
|
|
},
|
2020-09-05 20:35:52 +00:00
|
|
|
select(namespace) {
|
|
|
|
this.$emit('selected', namespace)
|
2020-06-30 20:53:25 +00:00
|
|
|
},
|
2020-09-05 20:35:52 +00:00
|
|
|
},
|
|
|
|
}
|
2020-06-30 20:53:25 +00:00
|
|
|
</script>
|