mirror of
https://github.com/aelve/guide.git
synced 2024-12-26 06:11:33 +03:00
46 lines
826 B
Vue
46 lines
826 B
Vue
<template>
|
|
<v-text-field
|
|
dark
|
|
solo
|
|
class="toollbar-search"
|
|
label="Search"
|
|
:value="searchInput"
|
|
@input="setSearchInput"
|
|
@keyup.enter.native="processSearchInput"
|
|
/>
|
|
</template>
|
|
|
|
<script lang="ts">
|
|
import Vue from 'vue'
|
|
import Component from 'vue-class-component'
|
|
|
|
@Component
|
|
export default class SearchField extends Vue {
|
|
|
|
processSearchInput () {
|
|
this.$router.push({ name: 'SearchResults', query: { query: this.searchInput } })
|
|
}
|
|
|
|
get searchInput () {
|
|
return this.$store.state.wiki.searchInput
|
|
}
|
|
|
|
setSearchInput (value: string) {
|
|
this.$store.commit('wiki/setSearchInput', value)
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style scoped>
|
|
.toollbar-search {
|
|
margin-right: 15px;
|
|
}
|
|
|
|
.toollbar-search >>> div {
|
|
margin-bottom: 0 !important;
|
|
}
|
|
.toollbar-search >>> label {
|
|
font-size: 18px;
|
|
}
|
|
</style>
|