materio-d8/web/themes/custom/materiotheme/vuejs/store/modules/showrooms.js

// import JSONAPI from 'vuejs/api/json-axios'
// import REST from 'vuejs/api/rest-axios'
// import MA from 'vuejs/api/ma-axios'
// import qs from 'querystring-es3'
import MGQ from 'vuejs/api/graphql-axios'
import { print } from 'graphql/language/printer'
import gql from 'graphql-tag'
import ShowroomFields from 'vuejs/api/gql/showroom.fragment.gql'

export default {
  namespaced: true,

  // initial state
  state: {
    items: [],
    showrooms_by_tid: {}
  },

  // getters
  getters: {},

  // mutations
  mutations: {
    setItems (state, items) {
      state.items = items
      items.forEach((item, i) => {
        state.showrooms_by_tid[item.id] = item
      })
      // console.log('Showroom setitems', state.showrooms_by_tid)
    }
  },

  // actions
  actions: {
    getShowrooms ({ dispatch, commit, state }) {
      // REST.get('/showrooms_rest?_format=json', {})
      //   .then(({ data }) => {
      //     console.log('showrooms REST: data', data)
      //     commit('setItems', data)
      //   })
      //   .catch((error) => {
      //     console.warn('Issue with showrooms', error)
      //     Promise.reject(error)
      //   })
      const ast = gql`{
        allshowrooms(lang: "${drupalDecoupled.lang_code}") {
          ...ShowroomFields
        }
      }
      ${ShowroomFields}
      `
      MGQ.post('', { query: print(ast) })
        .then(({ data: { data: { allshowrooms } } }) => {
          console.log('loadshowrooms showrooms loaded', allshowrooms)
          commit('setItems', allshowrooms)
        })
        .catch(error => {
          console.warn('Issue with getShowrooms', error)
          Promise.reject(error)
        })
    }
  }
}