admin 菜单管理

全局state 设置

const permissionReflect = {
  '/task': [
    '/task/subTask', // 任务组详情
  ],

  '/activityBox': [
    '/activityBox/pages/selectTpl',
    '/activityBox/pages/baseInfo',
    '/activityBox/pages/detail',
    '/activityBox/pages/resourceLocation',
  ],
};
// reduce 添加菜单权限
setUserPermission(
      state,
      {
        payload: { data },
      },
    ) {
      // 菜单权限
      let permission = [];
      // // 按钮权限
      const btnPermission = [];
      // // 功能权限
      const funPermission = [];
      const permissionOpts = data.value.reduce((accumulator, currentValue) => [...accumulator, currentValue, ...currentValue.subMenus], []);
      permissionOpts.forEach(item => {
        // 按钮权限以btn_开头
        if (item && item.url) {
          if (/^btn_\w+$/.test(item.url)) {
            btnPermission.push(item.url);
          } else if (/^fun_\w+$/.test(item.url)) {
            funPermission.push(item.url);
          } else {
           // 本地附属菜单存在,则合并附属菜单
            const getReflect = permissionReflect[item.url];
            if (getReflect) {
              permission = [...permission, item.url, 
                        ...getReflect];
            } else {
              permission.push(item.url);
            }
          }
        }
      });
      return {
        ...state,
        userPermission: data.value,
        permission,
        btnPermission,
        gotPermissions: true,
      };
    },

设置 左边栏展示菜单

  1. 编写左边栏本地静态菜单 对象
  2. 菜单权限列表请求后,更新菜单
    1. 从本地菜单里删除不在菜单权限列表的 项
    2. 根据 location 判断 菜单 高亮
    3. 新的菜单渲染出左边栏

Leave a Reply

Your email address will not be published. Required fields are marked *