import Vue from "vue";
import Vuex from "vuex";

Vue.use(Vuex);
// 定义是否菜单可取消选中（true：可取消选中，false：不可取消选中）【取消选中：当菜单已经为选中状态，再次点击会取消选中状态】
const menus = true;
export default new Vuex.Store({
  state: {
    baseMapType:1,  //当前的底图类型 0 - 影像图; 1 - 蓝黑图， 2-街道图
    // 头部菜单选中菜单对象（主要用于元素判断是否显示）
    navSelect: window.localStorage.getItem("navSelect")
      ? JSON.parse(window.localStorage.getItem("navSelect"))
      : { index: "1", name: "首页", subIndex: "" },
    // 左侧菜单选中菜单index（主要用于元素判断是否显示）
    leftMenuTitle: "",
    // 底部菜单选中菜单index，subIndex（主要用于元素判断是否高亮）
    bottomMenuIndexs: { index: -1, subIndex: -1 },
    // 当前浏览器窗口的宽高（优化自适应布局）
    windowsSize: {
      width: document.body.clientWidth,
      height: document.body.clientHeight,
    },
    // 地图常用方法集合
    mapMethodsCollection: new Map(),
    // 自定义模型数组
    customModelsArr: [],
    // 自定义模型状态改变 -- 修改或创建
    modelStatus: "create",
    // 法律法规弹窗
    lawPopupShow:false
  },
  getters: {
    customModelsArr: (state) => state.customModelsArr,
  },
  mutations: {
    // 用户点击头部菜单，更新暂存对象
    changeNavSelect(state, navSelect) {
      state.navSelect = navSelect;
      window.localStorage.setItem("navSelect", JSON.stringify(state.navSelect));
    },
    // 用户点击左侧菜单，更新暂存对象（当menus为true时，点击相同的菜单会取消选中）
    changeLeftMenuTitle(state, leftMenuTitle) {
      state.leftMenuTitle = leftMenuTitle;
    },
    // 用户点击底部菜单，更新暂存对象（当menus为true时，点击相同的菜单会取消选中）
    changeBottomMenu(state, bottomMenuIndex) {
      if (
        bottomMenuIndex.index == state.bottomMenuIndexs.index &&
        bottomMenuIndex.subIndex == state.bottomMenuIndexs.subIndex &&
        menus
      ) {
        state.bottomMenuIndexs = { index: -1, subIndex: -1 };
      } else {
        state.bottomMenuIndexs = bottomMenuIndex;
      }
    },
    changeWindowsSize(state, windowWidth, windowHeight) {
      state.windowsSize = { width: windowWidth, height: windowHeight };
    },
    mapMethods: (state, options) => {
      state.mapMethodsCollection.set(options.name, options.value);
    },
    changeCustomModelsArr: (state, data) => {
      state.customModelsArr = data;
    },
    changeModelStatus: (state, data) => {
      state.modelStatus = data;
    },
  },
  actions: {},
  modules: {},
});