react: menuService

Posted 2020-12-05 nyan-workflow-fc

1、获取菜单对象

static findCurrentItem(items, currentState, currentItem) {
        _.forEach(items, function (item) {
            if (item.state === currentState) {
                currentItem.push(item);
            } else if (MenuService.hasChildItems(item)) {
                MenuService.findCurrentItem(item.childItems, currentState, currentItem);
            }
        })
    }

    static findParentItem(items, currentItem, parentItem) {
        const fatherItem = _.find(items, {id: currentItem.fatherId});
        if (_.isEmpty(fatherItem)) {
            _.forEach(items, function (item) {
                if (MenuService.hasChildItems(item)) {
                    MenuService.findParentItem(item.childItems, currentItem, parentItem);
                }
            })
        } else {
            parentItem.push(fatherItem);
        }
    }

    static hasChildItems(item) {
        return !!item.childItems && item.childItems.length > 0;
    }

getCurrentItem(menus, currentState) {
        const currentItem = [];
        MenuService.findCurrentItem(menus, currentState, currentItem);
        return currentItem[0];
    }

    getParentItem(menus, currentItem) {
        const parentItem = [];
        MenuService.findParentItem(menus, currentItem, parentItem);
        return parentItem[0];
    }

2、获取实际页面module

getModules(menuTree) {
        const modules = [];
        _.forIn(menuTree, function (value, key) {
            if (!_.isEmpty(value)) {
                const moduleItem = {};
                const moduleItems = [];
                _.set(moduleItem, ‘type‘, key);
                MenuService.findModuleItem(moduleItems, value);
                _.set(moduleItem, ‘state‘, moduleItems[0]);
                modules.push(moduleItem);
            }
        });
        return modules;
    }

    static findModuleItem(moduleItems, menuTreeValue) {
        _.forEach(menuTreeValue, function (item) {
            if (item.state.indexOf(‘.‘) !== -1) {
                moduleItems.push(_.get(item, ‘state‘));
            } else if (MenuService.hasChildItems(item)) {
                MenuService.findModuleItem(moduleItems, item.childItems);
            }
        })
    }

3、获取默认路由

getDefaultState(menuTree) {
        const modules = this.getModules(menuTree);
        if (!_.isEmpty(modules)) {
            return _.get(modules[0], ‘state‘);
        }
    }

4、获取menus

getMenu() {
        return new Promise((resolve, reject) => {
            axiosService.request({
                url: ‘/api/menus‘,
                method: ‘GET‘
            }).then(res => {
                const menuTree = {};
                const navigators = {};
                _.forEach(res.data, function (item) {
                    _.set(menuTree, item.state, item.childItems);
                    _.set(navigators, item.state, item.name);
                });
                const menu = {
                    menuTree,
                    navigators,
                    defaultState: this.getDefaultState(menuTree),
                    modules: this.getModules(menuTree)
                };
                typeof resolve === ‘function‘ && resolve(menu);
            }).catch(error => {
                typeof reject === ‘function‘ && reject(error);
            })
        })
    }

    getSidebarMenu(menuTree, nav) {
        return _.result(menuTree, nav);
    }

menuTree: 集合，里面包含一个nav,一个对应该nav的菜单item

[{"nav01": [nav01.menus01]},{"nav02": [nav01.menus02]}];

navigators: 一个nav，一个对应nav的名字

[{"nav01": "nav01.name"},{"nav02": "nav01.name"}];

modules: 一个nav，一个对应nav的第一个路由

[{"nav01": "nav01.defaultState01"},{"nav02": "nav01.defaultState02"}];