materio-d9/web/themes/custom/materiotheme/vuejs/store/index.js

153 lines
5.8 KiB
JavaScript

import Vue from 'vue'
import Vuex from 'vuex'
import { createStore } from 'vuex-extensions'
// import JSONAPI from 'vuejs/api/json-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 materiauFields from 'vuejs/api/gql/materiau.fragment.gql'
import Common from './modules/common'
import User from './modules/user'
import Search from './modules/search'
import Blabla from './modules/blabla'
import Showrooms from './modules/showrooms'
import Pages from './modules/pages'
// https://github.com/vuejs/vuex/tree/dev/examples/shopping-cart
Vue.use(Vuex)
// export default new Vuex.Store({
export default createStore(Vuex.Store, {
modules: {
Common,
User,
Search,
Blabla,
Showrooms,
Pages
},
// https://github.com/huybuidac/vuex-extensions
mixins: {
actions: {
loadMaterialsGQL ({ dispatch }, { ids, gqlfragment, callBack, callBackArgs }) {
console.log('loadMaterialsGQL ids', ids)
const ast = gql`{
materiaux(ids: [${ids}]) {
...MateriauFields
}
}
${gqlfragment}
`
MGQ.post('', { query: print(ast) })
.then((resp) => {
console.log('loadMaterialsGQL resp', resp)
// dispatch('parseMaterialsGQL', {
// items: resp.data.data.materiaux,
// callBack: callBack,
// callBackArgs: callBackArgs
// })
dispatch(callBack, {
items: resp.data.data.materiaux,
callBackArgs: callBackArgs
})
})
.catch(error => {
console.warn('Issue with loadMaterials', error)
Promise.reject(error)
})
}
// parseMaterialsGQL ({ dispatch }, { items, callBack, callBackArgs }) {
// dispatch(callBack, { items: items, callBackArgs: callBackArgs })
// }
// loadMaterials ({ dispatch }, { uuids, imgStyle, callBack, callBackArgs }) {
// const params = {
// // include: 'images', // no needs to include thanks to consumers_image_styles module
// // include: 'drupal_internal__nid',
// 'filter[uuids-groupe][group][conjunction]': 'OR'
// }
// for (let i = 0; i < uuids.length; i++) {
// const uuid = uuids[i]
// params[`filter[${uuid}][condition][path]`] = 'id'
// params[`filter[${uuid}][condition][value]`] = uuid
// params[`filter[${uuid}][condition][operator]`] = '='
// params[`filter[${uuid}][condition][memberOf]`] = 'uuids-groupe'
// }
// // console.log('search JSONAPI params', params)
// const q = qs.stringify(params)
// return JSONAPI.get('node/materiau?' + q)
// .then(({ data }) => {
// console.log('mixin getMaterials data', data)
// dispatch('parseMaterials', { data: data.data, uuids: uuids, imgStyle: imgStyle, callBack: callBack, callBackArgs: callBackArgs })
// // commit('setItems', data.items)
// })
// .catch((error) => {
// console.warn('Issue with getItems', error)
// Promise.reject(error)
// })
// },
// parseMaterials ({ dispatch }, { data, uuids, imgStyle, callBack, callBackArgs }) {
// // data comes from jsonapi query
// // uuids comes from original query (solr, FlagCollection, etc)
// // so we loop from uuids to conserve the original order
// console.log('mixin parseMaterials', data, uuids, callBack, callBackArgs)
// const items = []
// // for (let i = 0; i < data.length; i++) {
// for (let i = 0; i < uuids.length; i++) {
// const uuid = uuids[i]
// // https://stackoverflow.com/questions/11258077/how-to-find-index-of-an-object-by-key-and-value-in-an-javascript-array
// const item_index = data.findIndex(p => p.id === uuid)
// // console.log('item_index', item_index)
// if (item_index === -1) continue
//
// const item_src = data[item_index]
// const attrs = item_src.attributes
// const relations = item_src.relationships
//
// // get field values
// const item = {
// uuid: uuid,
// title: attrs.title,
// field_short_description: attrs.field_short_description,
// body: attrs.body,
// field_reference: attrs.field_reference
// }
//
// // get images included values
// const img_src = relations.images.data
// // console.log('img_src', img_src)
// // this is a temporary deactivation of images
// // img_src = [];
// item.images = []
// for (let j = 0; j < img_src.length; j++) {
// if (img_src[j].meta.imageDerivatives) {
// let img_styles = {}
// for (let k = 0; k < imgStyle.length; k++) {
// img_styles[imgStyle[k]] = img_src[j].meta.imageDerivatives.links.[imgStyle[k]].href
// }
// item.images.push({
// title: img_src[j].meta.title,
// src: img_src[j].meta.imageDerivatives.links.hd.href,
// // meta.imageDerivatives.style.href link is provided by drupal consumers_image_styles module
// // BUG: missing all image derivative but first
// img_styles: img_styles
// })
// } else {
// console.warn('missing image derivative ' + j + '/' + img_src.length + ' for ' + attrs.title)
// }
// }
//
// items.push(item)
// }
// console.log('items', items)
// dispatch(callBack, { items: items, callBackArgs: callBackArgs })
// }
}
}
})