用户信息缓存展示

components/page/user.vue

@@ -2,22 +2,20 @@
   <Poptip placement="bottom-start" trigger="hover" width="240" transfer>
     <label :class="css">{{ user.name }}</label>
     <div slot="content">
-      <Avatar
-        v-if="user.face"
-        size="large"
-       :src="user.face"
-      ></Avatar>
+      <Avatar v-if="user.face" size="large" :src="user.face"></Avatar>
       <Avatar
         v-else
         size="large"
         style="color: #f56a00;background-color: #fde3cf; text-align:center"
         :icon="user.gender=='男'?'md-person':'md-woman'"
       ></Avatar>
-      <div>姓名：{{ user.name }}
+      <div>
+        姓名：{{ user.name }}
         <tag v-if="user.isDeleted">已删除</tag>
       </div>
-      <div>状态：
-        <state :value="user.status" type="tag" code="User.base.status"/>
+      <div>
+        状态：
+        <state :value="user.status" type="tag" code="User.base.status" />
       </div>
       <div>性别：{{ user.gender }}</div>
       <div>部门：{{ user.department }}</div>
@@ -27,7 +25,7 @@
 </template>
 <script>
 export default {
-  name: 'User',
+  name: "User",
   props: {
     value: {
       type: [Number, String],
@@ -38,58 +36,55 @@ export default {
     return {
       user: {
         name: this.value,
-        face: '',
-        gender: '',
-        roles: '',
-        department: '',
-        loginName: '',
+        face: "",
+        gender: "",
+        roles: "",
+        status:0,
+        department: "",
+        loginName: "",
         id: 0
       },
-      css:"s0"
-    }
+      css: "s0"
+    };
   },
+
   mounted() {
     //{"id":77,"name":"杨华馥","gender":"男","department":"北京生产车间","roles":"admin","status":1,"isDeleted":false}
-    this.load()
+    this.load();
   },
   methods: {
     load() {
       if (this.value) {
-        var user = this.$store.getters.getUser(this.value)
+        var user = this.$store.getters.getUser(this.value);
         if (user) {
-          this.user = user
-        } else {
-          this.$api
-            .get(`${systemUrl}/user/getuser`, { id: this.value })
-            .then((r) => {
-              // alert(JSON.stringify( r.result))
-              if (r.success) {
-                this.user = r.result
-                if(this.user.isDeleted){
-                  this.css="s2"
-                }else if(this.user.status==1){
-                  this.css="s1"
-                }
-                if(this.user.face){
-                   this.user.face=fileUrlDown+this.user.face;
-                }
-               
-                // this.$store.commit('addUser', r.result)
-              }
-            })
+          this.user = user;
+          if (this.user.isDeleted) {
+            this.css = "s2";
+          } else if (this.user.status == 1) {
+            this.css = "s1";
+          }
+          if (this.user.face) {
+            this.user.face = fileUrlDown + this.user.face;
+          }
         }
       }
     }
   },
   watch: {
     value(v) {
-      if (v > 0) this.load()
+      if (v > 0) this.load();
     }
   }
-}
+};
 </script>
 <style lang="less">
-   .s2{color: red;}
-   .s1{color: #333}
-   .s0{color:#ddd}
+.s2 {
+  color: red;
+}
+.s1 {
+  color: #333;
+}
+.s0 {
+  color: #ddd;
+}
 </style>
\ No newline at end of file

store/index.js

 import createVuexAlong from 'vuex-along'
 import Api from '@/plugins/request'
-export const state = () => ({
-  counter: 0,
-  dictionary: new Map(), //所有字典项
-  userMap: [], //所有用户缓存;
-  userInfo: {
-    userId: 0,
-    userName: ""
-  },
-  cart:[],
-  count: 0,
-  countAps:0,//aps排产
-  countAi:0,//智能排产
-  countAll:0,//整机排产
-  countRun:0,//流水排产
+export const state=()=>({
+    counter:0,
+    dictionary: new Map(),//所有字典项
+    userMap:new Map(),//所有用户缓存;
+    userInfo:{
+      userId:0,
+      userName:""
+    }
 })
-export const getters = {
+export const getters={
   dictionaryByKey: (state) => (key) => {
+    if(state.dictionary){
+      return;
+    }
     let result = [];
     let items = state.dictionary.get(key);
     if (items) {
@@ -25,79 +22,51 @@ export const getters = {
     }
     return result;
   },
-  getUser: state => key => {
-    // try{
-    //   if(state.userMap.has(key)){
-    //     return state.userMap.get(key);
-    //   }  
-    // }catch(e){
-    //   console.log(e);
-    // }
-    let user = state.userMap.filter(u => {
-      return u.id == key
-    });
-    if (user.length > 0) {
-      return user[0]
-    } else {
-      return null;
+  getUser:(state)=>key=>{   
+    // debugger 
+    if(state.userMap&&state.userMap.get){
+      return state.userMap.get(key);
     }
   }
 }
-export const mutations = {
-  increment(state) {
-    state.counter++
-  },
-  setUserInfo(state, userInfo) {
-    state.userInfo = userInfo;
-    // sessionStorage.setItem("userInfo", JSON.stringify(userInfo));
-    // sessionStorage.setItem("token", userInfo.token);
-  },
-  addUser(state, user) {
-    state.userMap.push(user);
-  },
-  setDictionary(state, dictionary) {
-    state.dictionary = dictionary;
-  },
-  setCart(state, cart) {
-    state.cart = cart;
-  },
-  setCartCount(state, count) {
-    state.count = count;
-  },
-  setCountAps(state, count) {//设置aps排产数量
-    state.countAps = count;
-  },
-  setCountAi(state, count) {//设置智能排产数量
-    state.countAi = count;
-  },
-  setCountAll(state, count) {//设置整机排产数量
-    state.countAll = count;
-  },
-  setCountRun(state, count) {//设置流水排产数量
-    state.countRun = count;
-  }
+export const mutations={
+    increment(state){
+        state.counter++
+    },
+    setUserInfo(state, userInfo) {
+      state.userInfo = userInfo;
+      // sessionStorage.setItem("userInfo", JSON.stringify(userInfo));
+      // sessionStorage.setItem("token", userInfo.token);
+    },
+    setUsers(state,users){
+      state.userMap=users;
+    },
+    addUser(state,user){
+      state.userMap.push(user);
+    },
+    setDictionary(state, dictionary) {
+      state.dictionary = dictionary;
+    },
 }
 
-export const actions = {
-  async loadUser({
-    commit
-  }, key) {
-
-    let {
-      result
-    } = await this.$api.get(`${systemUrl}/user/getuser`, {
-      id: key
+export const actions={
+  async loadUser({commit},key){
+        
+    let { result } =  await   Api.get(`${systemUrl}/user/getuser`,{id:key});
+    console.warn("result",result)
+    commit("addUser",result);
+  },
+  async loadUsers({commit}){
+    let { result } =  await   Api.get(`${systemUrl}/user/getuserlist`);
+    var map=new Map();
+    result.map(u=>{
+      map.set(u.id,u);
     });
-    console.warn("result", result)
-    commit("addUser", result);
+    commit("setUsers",map)
   },
-  async loadDictionary({
-    commit
-  }) {
+  async loadDictionary({ commit }) {
     let url = `${systemUrl}/Dictionary/GetAll`
-    let {
-      result
-    } = await Api.get(url);
+    let { result } = await Api.get(url);
 
     var map = new Map();
 
@@ -110,20 +79,20 @@ export const actions = {
   }
 }
 
-export const plugins = [
-  createVuexAlong({
-    // 设置保存的集合名字，避免同站点下的多项目数据冲突
-    name: "hyhmes",
-    local: {
-      list: ["hyhmes"],
-      // 过滤模块 ma 数据， 将其他的存入 localStorage
-      isFilter: true,
-    },
-    session: {
-      // 保存模块 ma 中的 a1 到 sessionStorage
-      list: ["hyhmes.session"],
-    },
-  }),
-]
-//设置 strict 为不严格模式，即可在actions中修改state 
-export const strict = false;
+export const plugins= [
+    createVuexAlong({
+      // 设置保存的集合名字，避免同站点下的多项目数据冲突
+      name: "hyhmes",
+      local: {
+        list: ["hyhmes"],
+        // 过滤模块 ma 数据， 将其他的存入 localStorage
+        isFilter: true,
+      },
+      session: {
+        // 保存模块 ma 中的 a1 到 sessionStorage
+        list: ["hyhmes.session"],
+      },
+    }),
+  ]
+  //设置 strict 为不严格模式，即可在actions中修改state 
+  export const strict=false;
\ No newline at end of file