import Vue from 'vue'
import Vuex from 'vuex'

Vue.use(Vuex)

export default new Vuex.Store({
  state: {
    sessionId: settingParam.sessionId,
    topMainHeight: '',// PAL主页面主体高度，
    navigationQueryVisible: false, // 导航栏输入框的快速搜索结果显示控制
    navigationConditionQueryVisible: false, // 导航栏输入框的快速搜索结果显示控制
    wsId: '',// 资产库id
    teamId: ''// 小组id
  },
  getters: {// 提供获取state相关数据的方法
    getTopMainHeightFn(state) {// 获取PAL主页面主体高度
      //console.log('get height ' + state.topMainHeight);
      return state.topMainHeight;
    },
    getNavigationQueryVisibleFn(state) {// 获取PAL导航栏搜索框结果的显示与隐藏
      return state.navigationQueryVisible;
    },
    getNavigationConditionQueryVisibleFn(state) {// 获取PAL导航栏条件搜索框结果的显示与隐藏
      return state.navigationConditionQueryVisible;
    },
    getTeamIdFn(state) {// 获取小组id
      return state.teamId;
    },
    getWsIdFn(state) {// 获取资产库id
      return state.wsId;
    }
  },
  actions: {// 提供跟后台接口交互的方法，并且调用mutations提供的方法进行更新提交
    setTopMainHeightFn({commit, state}, height) {// 设置PAL主页面主体高度更新
      commit("setTopMainHeightFn", height);
      //console.log('dispatch update height ' + height);
    },
    setNavigationQueryVisibleFn({commit, state}, visible) {// 设置PAL导航栏搜索框结果的显示与隐藏
      commit("setNavigationQueryVisibleFn", visible);
    },
    setNavigationConditionQueryVisibleFn({commit, state}, visible) {// 设置PAL导航栏条件搜索框结果的显示与隐藏
      commit("setNavigationConditionQueryVisibleFn", visible);
    },
    setTeamIdFn({commit, state}, teamId) {
      commit('setTeamIdFn', teamId)
    },
    setWsIdFn({commit, state}, wsId) {
      commit('setWsIdFn', wsId)
    }
  },
  mutations: {// 提供存储设置state数据的方法
    setTopMainHeightFn(state, height) {// 设置PAL主页面主体高度更新
      state.topMainHeight = height;
    },
    setNavigationQueryVisibleFn(state, visible) {// 设置PAL导航栏搜索框结果的显示与隐藏
      state.navigationQueryVisible = visible;
    },
    setNavigationConditionQueryVisibleFn(state, visible) {// 设置PAL导航栏条件搜索框结果的显示与隐藏
      state.navigationConditionQueryVisible = visible;
    },
    setTeamIdFn(state, teamId) {// 设置资产库小组Id
      state.teamId = teamId;
    },
    setWsIdFn(state, wsId) {// 设置资产库Id
      state.wsId = wsId;
    },
    edit(state, data) {
      for (let p in data) {
        state[p] = data[p];
      }
    }
  },
  modules: {
  }
})

/*
在state中定义数据

Getter相当于vue中的computed计算属性，getter 的返回值会根据它的依赖被缓存起来，且只有当它的依赖值发生了改变才会被重新计算，Getters 可以用于监听、state中的值的变化，返回计算后的结果

给action注册事件处理函数，当这个函数被触发时候，将状态提交到mutations中处理。actions里面自定义的函数接收一个context参数和要变化的形参

mutations是一个对象里。面的方法 都是同步事务，是更改state初始状态的唯一合法方法，具体的用法就是给里面的方法传入参数state或额外的参数

代码中设置全局存储方法：

dispatch：含有异步操作，例如向后台提交数据，写法： this.$store.dispatch('action方法名',值)

commit：同步操作，写法：this.$store.commit('mutations方法名',值)

代码中取值方法：
getters: 写法：this.$store.getters.getTopMainHeightFn
 */

/*
多级嵌套组件监听用法
父组件：Main.vue
某子组件：Child.vue
父组件进行变量赋值
  this.$store.commit('setTopMainHeightFn',this.bodyHeight);// 更新主体高度存储
子组件获取并监听父组件设置的变量变化
  computed: {
    listenTopMainHeight() {
      return this.$store.getters.getTopMainHeightFn;
    }
  },
  watch : {
    listenTopMainHeight: function (newd, old) {
      console.log("old " + old);
      console.log("new " + newd);
    }
  }
 */