SearchBlock.vue 1.4 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <template v-slot="default">
  2. <div v-bind:id="blockid">
  3. <SearchForm
  4. v-if="displayform"
  5. v-bind:form="form"></SearchForm>
  6. </div>
  7. </template>
  8. <script>
  9. import SearchForm from 'vuejs/components/Form/SearchForm'
  10. import { mapState, mapActions } from 'vuex'
  11. import { MA } from 'vuejs/api/ma-axios'
  12. export default {
  13. props: ['blockid', 'formhtml'],
  14. data(){
  15. return {
  16. form: null
  17. }
  18. },
  19. computed: {
  20. ...mapState({
  21. canSearch: state => state.User.canSearch
  22. }),
  23. displayform(){
  24. // console.log('computed displayform')
  25. return this.canSearch && this.form
  26. }
  27. },
  28. beforeMount() {
  29. // console.log('SearchBlock beforeMount')
  30. this.form = this.formhtml
  31. },
  32. watch: {
  33. canSearch(new_value, old_value) {
  34. // console.log('canSearch changed, old: '+old_value+", new: "+new_value)
  35. if (new_value && !this.form) {
  36. this.getSearchForm()
  37. }
  38. if (!new_value && this.form) {
  39. this.form = null
  40. }
  41. }
  42. },
  43. methods: {
  44. getSearchForm(){
  45. MA.get(`/materio_sapi/search_form`)
  46. .then(({data}) => {
  47. // console.log('getSearchForm')
  48. this.form = data.rendered
  49. })
  50. .catch((error) => {
  51. console.warn('Issue with get searchform', error)
  52. })
  53. }
  54. },
  55. components: {
  56. SearchForm
  57. }
  58. }
  59. </script>
  60. <style lang="scss" scoped>
  61. </style>