优化字典数据使用store存取

RuoYi

2022-07-20 5ec5e1a65d678d441cd03d1b775423c77dbc8b00

优化字典数据使用store存取

 ruoyi-ui/src/components/DictData/index.js

@@ -1,6 +1,22 @@
import Vue from 'vue'

import store from '@/store'

import DataDict from '@/utils/dict'

import { getDicts as getDicts } from '@/api/system/dict/data'



function searchDictByKey(dict, key) {

  if (key == null && key == "") {

    return null

  }

  try {

    for (let i = 0; i < dict.length; i++) {

      if (dict[i].key == key) {

        return dict[i].value

      }

    }

  } catch (e) {

    return null

  }

}



function install() {

  Vue.use(DataDict, {

@@ -9,7 +25,19 @@
        labelField: 'dictLabel',

        valueField: 'dictValue',

        request(dictMeta) {

          return getDicts(dictMeta.type).then(res => res.data)

          const storeDict = searchDictByKey(store.getters.dict, dictMeta.type)

          if (storeDict) {

            return new Promise(resolve => { resolve(storeDict) })

          } else {

            return new Promise((resolve, reject) => {

              getDicts(dictMeta.type).then(res => {

                store.dispatch('dict/setDict', { key: dictMeta.type, value: res.data })

                resolve(res.data)

              }).catch(error => {

                reject(error)

              })

            })

          }

        },

      },

    },


 ruoyi-ui/src/store/getters.js

@@ -2,6 +2,7 @@
  sidebar: state => state.app.sidebar,

  size: state => state.app.size,

  device: state => state.app.device,

  dict: state => state.dict.dict,

  visitedViews: state => state.tagsView.visitedViews,

  cachedViews: state => state.tagsView.cachedViews,

  token: state => state.user.token,


 ruoyi-ui/src/store/index.js

@@ -1,6 +1,7 @@
import Vue from 'vue'

import Vuex from 'vuex'

import app from './modules/app'

import dict from './modules/dict'

import user from './modules/user'

import tagsView from './modules/tagsView'

import permission from './modules/permission'

@@ -12,6 +13,7 @@
const store = new Vuex.Store({

  modules: {

    app,

    dict,

    user,

    tagsView,

    permission,


 ruoyi-ui/src/store/modules/dict.js

对比新文件
@@ -0,0 +1,50 @@
const state = {

  dict: new Array()

}

const mutations = {

  SET_DICT: (state, { key, value }) => {

    if (key !== null && key !== "") {

      state.dict.push({

        key: key,

        value: value

      })

    }

  },

  REMOVE_DICT: (state, key) => {

    try {

      for (let i = 0; i < state.dict.length; i++) {

        if (state.dict[i].key == key) {

          state.dict.splice(i, i)

          return true

        }

      }

    } catch (e) {

    }

  },

  CLEAN_DICT: (state) => {

    state.dict = new Array()

  }

}



const actions = {

  // 设置字典

  setDict({ commit }, data) {

    commit('SET_DICT', data)

  },

  // 删除字典

  removeDict({ commit }, key) {

    commit('REMOVE_DICT', key)

  },

  // 清空字典

  cleanDict({ commit }) {

    commit('CLEAN_DICT')

  }

}



export default {

  namespaced: true,

  state,

  mutations,

  actions

}




 ruoyi-ui/src/views/system/dict/data.vue

@@ -364,12 +364,14 @@
        if (valid) {

          if (this.form.dictCode != undefined) {

            updateData(this.form).then(response => {

              this.$store.dispatch('dict/removeDict', this.queryParams.dictType);

              this.$modal.msgSuccess("修改成功");

              this.open = false;

              this.getList();

            });

          } else {

            addData(this.form).then(response => {

              this.$store.dispatch('dict/removeDict', this.queryParams.dictType);

              this.$modal.msgSuccess("新增成功");

              this.open = false;

              this.getList();

@@ -386,6 +388,7 @@
      }).then(() => {

        this.getList();

        this.$modal.msgSuccess("删除成功");

        this.$store.dispatch('dict/removeDict', this.queryParams.dictType);

      }).catch(() => {});

    },

    /** 导出按钮操作 */


 ruoyi-ui/src/views/system/dict/index.vue

@@ -339,6 +339,7 @@
    handleRefreshCache() {

      refreshCache().then(() => {

        this.$modal.msgSuccess("刷新成功");

        this.$store.dispatch('dict/cleanDict');

      });

    }

  }