seecoder-devcloud-frontend/src/store/modules/workspace.ts

import { ProjectAPI } from '@/api';
import {
  ActionTree, GetterTree, Module, MutationTree,
} from 'vuex';
import {
  WorkspaceState, RootState, ChangeProjectPayload, UserState,
} from '../typings';

const NOT_SELECT_PROJECT_HINT = '未选择项目';

const EMPTY_PROJECT_LIST_HINT = '暂无项目';

const NO_SUCH_PROJECT_HINT = '未知项目';

const DEFAULT: WorkspaceState = {
  currentProjectId: -1,
  currentProjectMembers: [],
  projectList: [],
};

const FROM_LOCAL_STORAGE = JSON.parse(localStorage.getItem('workspace') || '{}');

const INIT = Object.keys(FROM_LOCAL_STORAGE).length > 0 ? FROM_LOCAL_STORAGE : DEFAULT;

const actions: ActionTree<WorkspaceState, RootState> = {
  clearWorkspace({ commit }) {
    commit('updateProjectList', []);
    commit('changeProject', { projectId: -1 });
    commit('updateMembers', []);
  },
  async refreshProjectList({ commit }) {
    const projectList = (await ProjectAPI.getProjectListByUserId()) || [];
    commit('updateProjectList', projectList);
  },
  async changeProject({ commit }, payload: ChangeProjectPayload) {
    const members = (await ProjectAPI.getProjectMembersByProjectId(payload.projectId)) || [];
    commit('updateMembers', members);
    commit('changeProject', payload);
  },
  resetCurrentProject({ commit }) {
    commit('changeProject', { projectId: -1 });
  },
};

const mutations: MutationTree<WorkspaceState> = {
  updateMembers(state, payload: Array<UserState>) {
    state.currentProjectMembers = payload;
  },
  updateProjectList(state, payload: Array<Project>) {
    state.projectList = payload;
  },
  changeProject(state, { projectId }: ChangeProjectPayload) {
    state.currentProjectId = projectId;
  },
};

const getters: GetterTree<WorkspaceState, RootState> = {
  currentProjectInfo(state) {
    if (state.projectList.length === 0) {
      return {
        id: -1,
        name: EMPTY_PROJECT_LIST_HINT,
      };
    }
    if (state.currentProjectId === -1) {
      return {
        id: -1,
        name: NOT_SELECT_PROJECT_HINT,
      };
    }
    const currentProjectInfo = Array.prototype.find.call(state.projectList, (project) => project.id === state.currentProjectId);
    return currentProjectInfo || {
      id: -1,
      name: NO_SUCH_PROJECT_HINT,
    };
  },
  userOptions(state) {
    return state.currentProjectMembers.map((user) => ({
      label: user.username,
      value: user.id,
    }));
  },
};

export const workspace: Module<WorkspaceState, RootState> = {
  state: () => INIT,
  actions,
  mutations,
  getters,
};