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>
|
|
|
|
|
2021-12-04 14:47:32 +00:00
|
|
|
<script lang="ts" setup>
|
|
|
|
import {ref, computed} from 'vue'
|
|
|
|
import {useStore} from 'vuex'
|
2021-07-25 13:27:15 +00:00
|
|
|
import Multiselect from '@/components/input/multiselect.vue'
|
2020-06-30 20:53:25 +00:00
|
|
|
|
2021-12-04 14:47:32 +00:00
|
|
|
const emit = defineEmits(['selected'])
|
|
|
|
|
|
|
|
const query = ref('')
|
|
|
|
|
|
|
|
const store = useStore()
|
|
|
|
const namespaces = computed(() => store.getters['namespaces/searchNamespace'](query.value))
|
|
|
|
|
|
|
|
function findNamespaces(newQuery: string) {
|
|
|
|
query.value = newQuery
|
|
|
|
}
|
|
|
|
|
|
|
|
function select(namespace) {
|
|
|
|
emit('selected', namespace)
|
2020-09-05 20:35:52 +00:00
|
|
|
}
|
2020-06-30 20:53:25 +00:00
|
|
|
</script>
|