materio-d9/web/themes/custom/materiotheme/vuejs/components/Block/SearchBlock.vue

66 lines
1.3 KiB
Vue

<template v-slot="default">
<div v-bind:id="blockid">
<SearchForm
v-if="displayform"
v-bind:form="form"></SearchForm>
</div>
</template>
<script>
import SearchForm from 'vuejs/components/Form/SearchForm'
import { mapState, mapActions } from 'vuex'
import MA from 'vuejs/api/ma-axios'
export default {
props: ['blockid', 'formhtml'],
data(){
return {
form: null
}
},
computed: {
...mapState({
canSearch: state => state.User.canSearch
}),
displayform(){
// console.log('computed displayform')
return this.canSearch && this.form
}
},
beforeMount() {
// console.log('SearchBlock beforeMount')
this.form = this.formhtml
},
watch: {
canSearch(new_value, old_value) {
// console.log('canSearch changed, old: '+old_value+", new: "+new_value)
if (new_value && !this.form) {
this.getSearchForm()
}
if (!new_value && this.form) {
this.form = null
}
}
},
methods: {
getSearchForm(){
MA.get(`/materio_sapi/search_form`)
.then(({data}) => {
// console.log('getSearchForm')
this.form = data.rendered
})
.catch((error) => {
console.warn('Issue with get searchform', error)
})
}
},
components: {
SearchForm
}
}
</script>
<style lang="scss" scoped>
</style>