import { SET_PRODUCTS, SET_FILTERED_PRODUCTS, SET_LOADING_PRODUCTS, SET_SHOW_PRODUCT_FORM, SET_PRODUCT_WITH_VARIANT, ADD_PRODUCT } from '@/constants/mutationTypes' import { INIT_PRODUCTS, FILTER_PRODUCTS, SHOW_PRODUCT_FORM, HIDE_PRODUCT_FORM, SUBMIT_PRODUCT, CREATE_PRODUCT, RECEIVE_PRODUCT, SELECT_PRODUCT, ADD_TO_CART, RESET_PRODUCT } from '@/constants/actionTypes' const initialState = { products: [], filteredProducts: [], loadingProducts: false, showingProductForm: false, showVariants: false, productWithVariant: null } const state = { products: initialState.products, filteredProducts: initialState.filteredProducts, loadingProducts: !initialState.loadingProducts, showingProductForm: initialState.showingProductForm, showVariants: initialState.showVariants, productWithVariant: initialState.productWithVariant } const getters = { /** * * @param {*} state */ products(state) { return state.products }, /** * * @param {*} state */ visibleProducts(state) { return state.filteredProducts.length === 0 ? state.products : state.filteredProducts }, /** * * @param {*} state */ loadingProducts(state) { return state.loadingProducts }, /** * * @param {*} state */ showingProductForm(state) { return state.showingProductForm }, /** * * @param {*} state */ showVariants(state) { return state.showVariants }, /** * * @param {*} state */ productWithVariant(state) { return state.productWithVariant } } const mutations = { /** * * @param {*} state * @param {*} payload */ [SET_PRODUCTS] (state, payload) { state.products = payload }, /** * * @param {*} state * @param {*} payload */ [SET_FILTERED_PRODUCTS] (state, payload) { state.filteredProducts = [...payload] }, /** * * @param {*} state * @param {*} payload */ [SET_LOADING_PRODUCTS] (state, payload) { state.loadingProducts = !!payload }, /** * * @param {*} state * @param {*} payload */ [SET_SHOW_PRODUCT_FORM] (state, payload) { state.showingProductForm = !!payload }, /** * * @param {*} state * @param {*} payload */ [ADD_PRODUCT] (state, payload) { state.products = [payload, ...state.products] }, /** * * @param {*} state * @param {*} payload */ [SET_PRODUCT_WITH_VARIANT] (state, payload) { state.productWithVariant = payload } } const actions = { /** * * @param {*} param0 * @param {*} payload */ [INIT_PRODUCTS] ({ commit }, payload) { commit(SET_PRODUCTS, payload) commit(SET_LOADING_PRODUCTS) }, /** * * @param {*} param0 * @param {*} payload */ [FILTER_PRODUCTS] ({ commit }, payload) { commit(SET_FILTERED_PRODUCTS, payload) }, /** * * @param {*} param0 * @param {*} payload */ [SHOW_PRODUCT_FORM] ({ commit }) { commit(SET_SHOW_PRODUCT_FORM, true) }, /** * * @param {*} param0 */ [HIDE_PRODUCT_FORM] ({ commit }) { commit(SET_SHOW_PRODUCT_FORM, false) }, /** * * @param {*} param0 * @param {*} payload */ [SUBMIT_PRODUCT] ({ commit, dispatch }, payload) { commit(SET_LOADING_PRODUCTS, true) dispatch(CREATE_PRODUCT, payload) dispatch(HIDE_PRODUCT_FORM) }, /** * * @param {*} param0 * @param {*} payload */ [RECEIVE_PRODUCT] ({ commit }, payload) { commit(ADD_PRODUCT, payload) commit(SET_LOADING_PRODUCTS, false) }, /** * * @param {*} param0 * @param {*} payload */ selectProduct({ commit, dispatch }, payload) { if (!payload) { commit(SET_PRODUCT_WITH_VARIANT, null) return } if (payload.variantCount > 1) { commit(SET_PRODUCT_WITH_VARIANT, payload) return } if (!payload.variantCount) { dispatch(ADD_TO_CART, payload) commit(SET_PRODUCT_WITH_VARIANT, null) } else { dispatch(ADD_TO_CART, payload.variants[0]) } }, /** * * @param {*} param0 */ [RESET_PRODUCT] ({ commit }) { commit(SET_LOADING_PRODUCTS, true) commit(SET_PRODUCTS, []) commit(SET_FILTERED_PRODUCTS, []) } } export default { state, getters, mutations, actions }