import { reactive } from "vue";
import VisitedViewAction from "./modules/visited-view";
import { settingConfig } from "@/config/settings/index.js";
const primaryColor = settingConfig.themeColor;
const originState = {
  isCollapse: false,
  themeOverrides: {
    DataTable: {
      sorterIconColor:'#fff',
      thColorHover: primaryColor,
      thTextColor: "#fff",
      thColor: primaryColor,
      thBackgroundColor: primaryColor,
      itemColorActive:primaryColor,
    },
    Button: {
      textColor: primaryColor,
    },
    common: {
      primaryColorPressed: primaryColor,
      primaryHover:primaryColor,
      primaryDefault: primaryColor,
      primaryActive: primaryColor,
      primarySuppl: primaryColor,
      primaryColor: primaryColor,
      primaryColorHover: primaryColor
    }
  },
  permissionRoutes: [],
  visitedView: [],
  cachedView: [],
};
const store = {
  state: reactive(originState),
  start({ state, actions }) {
    state && (this.state = Object.assign(this.state, state));
    if (actions) {
      for (const key in actions) {
        this[key] = actions[key];
      }
    }
  },

  toggleCollapse(newStatus) {
    this.state.isCollapse = newStatus;
  },

  changeDevice(device) {
    this.state.device = device;
  },
  ...VisitedViewAction
};
export default store;
