update: 门店角色权限配置

src/views/enterprise/edit-store-role.vue

@@ -89,8 +89,8 @@ export default {
       // 权限菜单列表
       tabList: [
         // 1好办后台2应用后台3好办小程序4小程序应用
-        { label: '好办小程序', appType: 3, menuList: [], checkedId: {}, appIds: [] },
-        { label: '小程序应用', appType: 4, menuList: [], checkedId: {}, appIds: [] },
+        { label: '好办小程序', appType: 3, flatMenu: [], menuList: [], checkedId: {}, appIds: [] },
+        { label: '小程序应用', appType: 4, flatMenu: [], menuList: [], checkedId: {}, appIds: [] },
       ],
     };
   },
@@ -113,6 +113,7 @@ export default {
         // appType 1好办后台2应用后台3好办小程序4小程序应用
         // roleType 1管理员角色 2门店角色
         prom.push(menuList({ wxEnterpriseId: this.wxEnterpriseId, roleType: 2, appType: el.appType }).then(res => {
+          el.flatMenu = res.result || [];
           el.menuList = this.flatDataToTree(res.result || []);
           el.menuList.forEach(item => {
             this.$set(el.checkedId, item.menuId, []);
@@ -126,15 +127,17 @@ export default {
     getRoleDetail(roleId) {
       // 获取角色权限配置、资源范围等数据
       roleDetail({ roleId }).then(res => {
-        let { roleId, roleName, menuIds } = res.result || {};
+        let { roleId, roleName, menuIds } = res.result;
         menuIds = typeof menuIds == 'string' ? menuIds.split(',') : [];
+        // roleData中存一份包含父节点的menuId
+        // tabList中存一份不包含父节点的menuId
         Object.assign(this.roleData, { roleId, roleName });
         // 将menuIds分配到相应同的tab下的checkedId中
         this.tabList.forEach(el => {
           let checkedId = [];
           el.menuList.forEach(item => {
-            el.checkedId[item.menuId] = getAllMenuId([ item ], menuIds);
-            checkedId = checkedId.concat(el.checkedId[item.menuId]);
+            el.checkedId[item.menuId] = getLeafMenuId([ item ], menuIds);
+            checkedId = checkedId.concat(getAllMenuId([ item ], menuIds));
           });
           this.roleData.menuIds.push({ appType: el.appType, menuIds: checkedId });
         });
@@ -169,6 +172,36 @@ export default {
         });
         return result;
       }
+      function getLeafMenuId(menuList, allMenuIds) {
+        let result = [];
+        // 所有子节点被选中，才算父节点被选中
+        menuList.map(el => {
+          if (allMenuIds.some(item => item == el.menuId)) {
+            let allSubId = [];
+            if (Array.isArray(el.children)) {
+              allSubId = getAllSubMenuIds(el.children);
+            }
+            // 如果el的allSubId都在allMenuIds中，则认为el需要被勾选，需要把el.menuId放入result中
+            if (allSubId.length == 0 || allSubId.every(el => allMenuIds.some(item => item == el))) {
+              result.push(el.menuId);
+            }
+            if (Array.isArray(el.children)) {
+              result = result.concat(getLeafMenuId(el.children, allMenuIds));
+            }
+          }
+        });
+        return result;
+      }
+      function getAllSubMenuIds(menuList) {
+        let result = [];
+        menuList.forEach(el => {
+          result.push(el.menuId);
+          if (Array.isArray(el.children)) {
+            result = result.concat(getAllSubMenuIds(el.children));
+          }
+        });
+        return result;
+      }
     },
     getActiveMenuList() {
       const result = this.tabList.filter(el => el.appType == this.activeType);
@@ -198,24 +231,42 @@ export default {
     // 同时更新roleData中menuIds的数据
     onCheckedChange(checkedId) {
       let menuIds = [];
+      let flatMenu = [];
+      let allMenuIds = [];
       for(let key in checkedId) {
         menuIds = menuIds.concat(checkedId[key]);
       }
       this.tabList = this.tabList.map(el => {
         if (el.appType == this.activeType) {
           el.checkedId = checkedId;
+          flatMenu = el.flatMenu;
         }
         return el;
       });
+      // 根据任意层级的子节点向上查找全部的父节点，存入allMenuIds中，然后过滤掉重复的menuId
+      menuIds.map(el => {
+        allMenuIds = allMenuIds.concat(getParentIds(el, flatMenu));
+      });
+      allMenuIds = allMenuIds.filter((el, index) => index == allMenuIds.findIndex(item => item == el));
 
       if (this.roleData.menuIds.some(el => el.appType == this.activeType)) {
         this.roleData.menuIds.forEach(el => {
           if (el.appType == this.activeType) {
-            el.menuIds = menuIds;
+            el.menuIds = allMenuIds;
           }
         });
       } else {
-        this.roleData.menuIds.push({ appType: this.activeType, menuIds });
+        this.roleData.menuIds.push({ appType: this.activeType, menuIds: allMenuIds });
+      }
+      function getParentIds(menuId, menuList) {
+        let result = [ menuId ];
+        menuList.some(el => {
+          if (el.menuId == menuId && el.parentId > 0) {
+            result = result.concat(getParentIds(el.parentId, menuList));
+          }
+          return el.menuId == menuId;
+        });
+        return result;
       }
     },
     onAppOpenChange(appIds) {