// TODO refactor better state mangement const { localStorage } = window const breadcrumb = { state: { visible: { firstLayer: true, secondLayer: false, thirdLayer: false, fourLayer: false }, data: { firstLayer: JSON.parse(localStorage.getItem('firstLayer')), secondLayer: JSON.parse(localStorage.getItem('secondLayer')), thirdLayer: JSON.parse(localStorage.getItem('thirdLayer')), fourLayer: JSON.parse(localStorage.getItem('fourLayer')) } }, mutations: { SET_VISIBLE: (state, layer) => { switch (layer) { case 1: state.visible = { firstLayer: true, secondLayer: false, thirdLayer: false, fourLayer: false } break case 2: state.visible = { firstLayer: false, secondLayer: true, thirdLayer: false, fourLayer: false } break case 3: state.visible = { firstLayer: false, secondLayer: false, thirdLayer: true, fourLayer: false } break case 4: state.visible = { firstLayer: false, secondLayer: false, thirdLayer: false, fourLayer: true } break } }, SET_DATA: (state, option) => { switch (option.layer) { case 1: localStorage.setItem('firstLayer', JSON.stringify(option.data)) break case 2: localStorage.setItem('secondLayer', JSON.stringify(option.data)) break case 3: localStorage.setItem('thirdLayer', JSON.stringify(option.data)) break case 4: localStorage.setItem('fourLayer', JSON.stringify(option.data)) break } } }, actions: { SetVisible({ commit }, layer) { commit('SET_VISIBLE', layer) }, SetData({ commit }, option) { commit('SET_DATA', option) } } } export default breadcrumb