From 1ed6b4f24bc7fe2576c72c6e4fb3bd6d965bae59 Mon Sep 17 00:00:00 2001 From: Seth Ladygo Date: Fri, 3 May 2019 00:03:12 -0700 Subject: [PATCH] tie catalog info ui to vuex catalog data --- cateditor/src/components/CatalogInfo.vue | 64 +++++++-- cateditor/src/pages/editor/store/index.js | 163 +++++++++++----------- 2 files changed, 138 insertions(+), 89 deletions(-) diff --git a/cateditor/src/components/CatalogInfo.vue b/cateditor/src/components/CatalogInfo.vue index b560212..713d393 100644 --- a/cateditor/src/components/CatalogInfo.vue +++ b/cateditor/src/components/CatalogInfo.vue @@ -25,17 +25,18 @@ + - + - + - + - + @@ -53,25 +54,68 @@ export default { data: () => ({ seasons: seasons, regions: regions, - name: null, - ispublic: true }), computed: { + name: { + get() { + return this.$store.getters.catalogProperty('name') + }, + set(name) { + this.$store.dispatch('setCatalogProperty', { key: 'name', value: name }) + } + }, + season: { get() { - return this.$store.getters.catalogSeason + return this.$store.getters.catalogProperty('season') }, set(season) { - this.$store.dispatch('setCatalogSeason', season) + this.$store.dispatch('setCatalogProperty', { key: 'season', value: season }) } }, region: { get() { - return this.$store.getters.catalogRegion + return this.$store.getters.catalogProperty('region') }, set(region) { - this.$store.dispatch('setCatalogRegion', region) + this.$store.dispatch('setCatalogProperty', { key: 'region', value: region }) + } + }, + + master: { + get() { + return this.$store.getters.catalogProperty('master') + }, + set(master) { + this.$store.dispatch('setCatalogProperty', { key: 'master', value: master }) + } + }, + + isPublic: { + get() { + return this.$store.getters.catalogProperty('public') + }, + set(isPublic) { + this.$store.dispatch('setCatalogProperty', { key: 'public', value: isPublic }) + } + }, + + prices: { + get() { + return this.$store.getters.catalogProperty('show_prices') + }, + set(showPrices) { + this.$store.dispatch('setCatalogProperty', { key: 'show_prices', value: showPrices }) + } + }, + + utility: { + get() { + return this.$store.getters.catalogProperty('is_utility') + }, + set(isUtility) { + this.$store.dispatch('setCatalogProperty', { key: 'is_utility', value: isUtility }) } }, diff --git a/cateditor/src/pages/editor/store/index.js b/cateditor/src/pages/editor/store/index.js index 4a47f24..690499d 100644 --- a/cateditor/src/pages/editor/store/index.js +++ b/cateditor/src/pages/editor/store/index.js @@ -84,27 +84,19 @@ export const store = new Vuex.Store({ // // catalog info // - CAT_NAME: state => { - return state.catalog.name - }, - CAT_SECTIONS: state => { - return state.catalog.sections - }, - CAT_SECTION: (state) => (id) => { - return state.catalog.sections.find(s => s.id === id) - }, + // CAT_NAME: state => { + // return state.catalog.name + // }, + // CAT_SECTIONS: state => { + // return state.catalog.sections + // }, + // CAT_SECTION: (state) => (id) => { + // return state.catalog.sections.find(s => s.id === id) + // }, - catalogSeason(state) { + catalogProperty: (state) => (key) => { if (state.catalog != null) { - return state.catalog.season - } else { - return null - } - }, - - catalogRegion(state) { - if (state.catalog != null) { - return state.catalog.region + return state.catalog[key] } else { return null } @@ -113,59 +105,59 @@ export const store = new Vuex.Store({ // // selection info // - SELECTED_SECTION_ID: state => { - return state.selectedSectionID - }, + // SELECTED_SECTION_ID: state => { + // return state.selectedSectionID + // }, // SELECTED_SECTION: state => { // return store.getters.CAT_SECTION(state.selectedSectionID) // }, - SELECTED_FAMILY_ID: state => { - return state.selectedFamilyID - }, - SELECTED_MODEL_ID: state => { - return state.selectedModelID - }, - SELECTED_MATERIAL_ID: state => { - return state.selectedMaterial - }, + // SELECTED_FAMILY_ID: state => { + // return state.selectedFamilyID + // }, + // SELECTED_MODEL_ID: state => { + // return state.selectedModelID + // }, + // SELECTED_MATERIAL_ID: state => { + // return state.selectedMaterial + // }, // // material info // - MATERIAL: (state) => (id) => { - return state.materials[id] - }, + // MATERIAL: (state) => (id) => { + // return state.materials[id] + // }, - getLoadingCatalog(state) { + loadingCatalog(state) { return state.loadingCatalog }, }, mutations: { - SET_CAT_SECTIONS: (state, payload) => { - state.catalog.sections = payload - }, - SET_CAT_SECTION_NAME: (state, payload) => { - var section = state.catalog.sections.find(s => s.id === payload.id) - section.name = payload.name - }, - SET_SELECTED_SECTION_ID: (state, payload) => { - state.selectedSectionID = payload - state.selectedFamilyID = null - state.selectedModelID = null - state.selectedMaterial = null - }, - SET_SELECTED_FAMILY_ID: (state, payload) => { - state.selectedFamilyID = payload - state.selectedModelID = null - state.selectedMaterial = null - }, - SET_SELECTED_MODEL_ID: (state, payload) => { - state.selectedModelID = payload - state.selectedFamilyID = null - state.selectedMaterial = null - }, - SET_SELECTED_MATERIAL_ID: (state, payload) => { - state.selectedMaterial = payload - }, + // SET_CAT_SECTIONS: (state, payload) => { + // state.catalog.sections = payload + // }, + // SET_CAT_SECTION_NAME: (state, payload) => { + // var section = state.catalog.sections.find(s => s.id === payload.id) + // section.name = payload.name + // }, + // SET_SELECTED_SECTION_ID: (state, payload) => { + // state.selectedSectionID = payload + // state.selectedFamilyID = null + // state.selectedModelID = null + // state.selectedMaterial = null + // }, + // SET_SELECTED_FAMILY_ID: (state, payload) => { + // state.selectedFamilyID = payload + // state.selectedModelID = null + // state.selectedMaterial = null + // }, + // SET_SELECTED_MODEL_ID: (state, payload) => { + // state.selectedModelID = payload + // state.selectedFamilyID = null + // state.selectedMaterial = null + // }, + // SET_SELECTED_MATERIAL_ID: (state, payload) => { + // state.selectedMaterial = payload + // }, setCatalog(state, cat) { state.catalog = cat @@ -174,26 +166,34 @@ export const store = new Vuex.Store({ setLoadingCatalog(state, value) { state.loadingCatalog = value }, + + setCatalogProperty(state, { key, value }) { + console.log('mutation set prop', key, value) + if (state.catalog) { + state.catalog[key] = value + } + }, + }, actions: { - SET_CAT_SECTIONS: (context, payload) => { - context.commit('SET_CAT_SECTIONS', payload) - }, - SET_CAT_SECTION_NAME: (context, payload) => { - context.commit('SET_CAT_SECTION_NAME', payload) - }, - SET_SELECTED_SECTION_ID: (context, payload) => { - context.commit('SET_SELECTED_SECTION_ID', payload) - }, - SET_SELECTED_FAMILY_ID: (context, payload) => { - context.commit('SET_SELECTED_FAMILY_ID', payload) - }, - SET_SELECTED_MODEL_ID: (context, payload) => { - context.commit('SET_SELECTED_MODEL_ID', payload) - }, - SET_SELECTED_MATERIAL_ID: (context, payload) => { - context.commit('SET_SELECTED_MATERIAL_ID', payload) - }, + // SET_CAT_SECTIONS: (context, payload) => { + // context.commit('SET_CAT_SECTIONS', payload) + // }, + // SET_CAT_SECTION_NAME: (context, payload) => { + // context.commit('SET_CAT_SECTION_NAME', payload) + // }, + // SET_SELECTED_SECTION_ID: (context, payload) => { + // context.commit('SET_SELECTED_SECTION_ID', payload) + // }, + // SET_SELECTED_FAMILY_ID: (context, payload) => { + // context.commit('SET_SELECTED_FAMILY_ID', payload) + // }, + // SET_SELECTED_MODEL_ID: (context, payload) => { + // context.commit('SET_SELECTED_MODEL_ID', payload) + // }, + // SET_SELECTED_MATERIAL_ID: (context, payload) => { + // context.commit('SET_SELECTED_MATERIAL_ID', payload) + // }, // SAVE_TODO : async (context,payload) => { // let { data } = await Axios.post('http://yourwebsite.com/api/todo') // context.commit('ADD_TODO',payload) @@ -218,5 +218,10 @@ export const store = new Vuex.Store({ commit('setLoadingCatalog', false) } }, + + setCatalogProperty(context, data) { + context.commit('setCatalogProperty', data) + }, + } })