import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)

let state = {
	currentTabBar: 0,
	tabbars: [
		{
		  name: 'home',
		  text: '首页',
		  icon: 'icon-xianxingicon-03',
		  path: '/pages/index/index/index'
		},
		{
		  name: 'brand',
		  text: '品牌',
		  icon: 'icon-pinpailiebiao',
		  path: '/pages/index/category/category'
		},
		{
		  name: 'find',
		  text: '发现',
		  icon: 'icon-faxian',
		  path: '/pages/discover/discover'
		},
		{
		  name: 'my',
		  text: '会员中心',
		  icon: 'icon-icon',
		  path: '/pages/user/my/center'
		}
	],
	isShowTabBar: true
}

let mutations = {
	// 修改tabbar当前选中的item
	setCurrentTabBar(state, data){
		state.currentTabBar = data;
	},
	// 显示tabbar
	showTabBar(state, data){
		state.isShowTabBar = true;
	},
	// 隐藏tabbar
	hideTabBar(state, data){
		state.isShowTabBar = false;
	}
}

let actions = {
	// 异步调用修改tabbar当前选中的item
	setCurrentTabBarAsync(context, args){
		context.commit('setCurrentTabBar', args);
	}
}

let getters = {
	currentTabBar: state => state.currentTabBar,
	tabbars: state => state.tabbars,
	isShowTabBar: state => state.isShowTabBar
}

export default new Vuex.Store({
	state,
	mutations,
	actions,
	getters
})

/*
	getters：可以认为是 store 的计算属性，然后在组件的计算属性中使用：...mapGetters([])
	mutations: 修改state的值，调用：store.commit('test', 'hello')
	actions: 异步提交mutations
	module：区分模块，每个模块都有自己的 state、mutation、action、getter、甚至是嵌套子模块(项目大时可能需要用到)
*/