RealBull/src/common/router.js

import { createElement } from 'react';
import dynamic from 'dva/dynamic';
import pathToRegexp from 'path-to-regexp';
import { getMenuData } from './menu';

let routerDataCache;

const modelNotExisted = (app, model) => (
  // eslint-disable-next-line
  !app._models.some(({ namespace }) => {
    return namespace === model.substring(model.lastIndexOf('/') + 1);
  })
);

// wrapper of dynamic
const dynamicWrapper = (app, models, component) => {
  // () => require('module')
  // transformed by babel-plugin-dynamic-import-node-sync
  if (component.toString().indexOf('.then(') < 0) {
    models.forEach((model) => {
      if (modelNotExisted(app, model)) {
        // eslint-disable-next-line
        app.model(require(`../models/${model}`).default);
      }
    });
    return (props) => {
      if (!routerDataCache) {
        routerDataCache = getRouterData(app);
      }
      return createElement(component().default, {
        ...props,
        routerData: routerDataCache,
      });
    };
  }
  // () => import('module')
  return dynamic({
    app,
    models: () => models.filter(
      model => modelNotExisted(app, model)).map(m => import(`../models/${m}.js`)
    ),
    // add routerData prop
    component: () => {
      if (!routerDataCache) {
        routerDataCache = getRouterData(app);
      }
      return component().then((raw) => {
        const Component = raw.default || raw;
        return props => createElement(Component, {
          ...props,
          routerData: routerDataCache,
        });
      });
    },
  });
};

function getFlatMenuData(menus) {
  let keys = {};
  menus.forEach((item) => {
    if (item.children) {
      keys[item.path] = { ...item };
      keys = { ...keys, ...getFlatMenuData(item.children) };
    } else {
      keys[item.path] = { ...item };
    }
  });
  return keys;
}

export const getRouterData = (app) => {
  const routerConfig = {
    '/': {
      component: dynamicWrapper(app, ['user', 'login'], () => import('../layouts/BasicLayout')),
    },
    // 厂商管理相关路由注册
    '/merchant/list': {
      component: dynamicWrapper(app, ['merchant'], () => import('../routes/Merchant/MerchantList')),
      name: '商户列表',
    },
    '/merchant/create': {
      component: dynamicWrapper(app, ['merchant'], () => import('../routes/Merchant/MerchantCreate')),
      name: '添加商户',
    },
    '/merchant/edit/:id': {
      component: dynamicWrapper(app, ['merchant'], () => import('../routes/Merchant/MerchantCreate')),
      name: '编辑商户',
    },
    '/merchant/deposit/:id': {
      component: dynamicWrapper(app, ['merchant'], () => import('../routes/Merchant/MerchantDeposit')),
      name: '余额充值',
    },
    // 校区管理相关路由注册
    '/campus/list': {
      component: dynamicWrapper(app, ['campus', 'merchant'], () => import('../routes/Campus/CampusList')),
      name: '校区列表',
    },
    '/campus/create': {
      component: dynamicWrapper(app, ['campus', 'merchant'], () => import('../routes/Campus/CampusCreate')),
      name: '添加校区',
    },
    '/campus/edit/:id': {
      component: dynamicWrapper(app, ['campus', 'merchant'], () => import('../routes/Campus/CampusCreate')),
      name: '编辑校区',
    },
    // 资源管理相关路由注册
    '/resource/picture': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Picture/PictureList')),
    },
    '/resource/picture-upload': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Picture/PictureUpload')),
    },
    '/resource/picture-upload/single': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Picture/PictureSingleUpload')),
      name: '单图上传',
    },
    '/resource/picture-upload/result': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Picture/PictureUploadResult')),
      name: '上传结果',
    },
    '/resource/picture-edit/:id': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Picture/PictureEdit')),
      name: '编辑图片',
    },
    '/resource/video': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Video/VideoList')),
    },
    '/resource/video-create': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Video/VideoCreate')),
      name: '创建视频',
    },
    '/resource/video-edit/:id': {
      component: dynamicWrapper(app, ['resource'], () => import('../routes/Resource/Video/VideoCreate')),
      name: '编辑视频',
    },
    // 系统管理相关路由注册
    '/system/cms-user': {
      component: dynamicWrapper(app, ['cmsUser'], () => import('../routes/System/CmsUser')),
    },
    '/system/cms-user/list': {
      component: dynamicWrapper(app, ['cmsUser'], () => import('../routes/System/CmsUser/CmsUserList')),
    },
    '/system/cms-user/create': {
      component: dynamicWrapper(app, ['cmsUser', 'merchant'], () => import('../routes/System/CmsUser/CmsUserCreate')),
    },
    '/system/cms-user/edit/:id': {
      component: dynamicWrapper(app, ['cmsUser'], () => import('../routes/System/CmsUser/CmsUserEdit')),
    },
    // 终端管理相关路由注册
    '/terminal/user': {
      component: dynamicWrapper(app, ['terminal', 'campus', 'merchant'], () => import('../routes/Terminal/User')),
    },
    '/terminal/user/list': {
      component: dynamicWrapper(app, ['terminal', 'campus', 'merchant'], () => import('../routes/Terminal/User/TerminalList')),
    },
    '/terminal/user/create': {
      component: dynamicWrapper(app, ['terminal', 'campus'], () => import('../routes/Terminal/User/TerminalCreate')),
    },
    '/terminal/user/edit/:id': {
      component: dynamicWrapper(app, ['terminal'], () => import('../routes/Terminal/User/TerminalEdit')),
    },
    '/terminal/whitelist': {
      component: dynamicWrapper(app, ['terminal'], () => import('../routes/Terminal/WhiteList')),
    },
    '/terminal/whitelist/list': {
      component: dynamicWrapper(app, ['terminal'], () => import('../routes/Terminal/WhiteList/WhiteList')),
    },
    '/terminal/whitelist/create': {
      component: dynamicWrapper(app, ['terminal'], () => import('../routes/Terminal/WhiteList/WhiteListCreate')),
    },
    '/terminal/whitelist/edit/:id': {
      component: dynamicWrapper(app, ['terminal'], () => import('../routes/Terminal/WhiteList/WhiteListCreate')),
    },
    // 产品管理相关路由注册
    '/product/courseware': {
      component: dynamicWrapper(app, [], () => import('../routes/Product/Courseware')),
    },
    '/product/courseware/list': {
      component: dynamicWrapper(app, ['courseware'], () => import('../routes/Product/Courseware/CoursewareList')),
    },
    '/product/courseware/create': {
      component: dynamicWrapper(app, ['courseware', 'resource'], () => import('../routes/Product/Courseware/CoursewareCreate')),
    },
    '/product/courseware/edit/:id': {
      component: dynamicWrapper(app, ['courseware', 'resource'], () => import('../routes/Product/Courseware/CoursewareCreate')),
    },
    '/product/lesson': {
      component: dynamicWrapper(app, ['lesson'], () => import('../routes/Product/Lesson')),
    },
    '/product/lesson/list': {
      component: dynamicWrapper(app, ['lesson'], () => import('../routes/Product/Lesson/LessonList')),
    },
    '/product/lesson/create': {
      component: dynamicWrapper(app, ['lesson', 'courseware'], () => import('../routes/Product/Lesson/LessonCreate')),
    },
    '/product/lesson/edit/:id': {
      component: dynamicWrapper(app, ['lesson', 'courseware'], () => import('../routes/Product/Lesson/LessonCreate')),
    },
    '/product/course': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Course')),
    },
    '/product/course/list': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Course/CourseList')),
    },
    '/product/course/create': {
      component: dynamicWrapper(app, ['lesson', 'resource', 'product', 'merchant'], () => import('../routes/Product/Course/CourseCreate')),
    },
    '/product/course/edit/:id': {
      component: dynamicWrapper(app, ['lesson', 'resource', 'product', 'merchant'], () => import('../routes/Product/Course/CourseCreate')),
    },
    '/product/support': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Support')),
    },
    '/product/support/list': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Support/SupportList')),
    },
    '/product/support/create': {
      component: dynamicWrapper(app, ['resource', 'product', 'merchant'], () => import('../routes/Product/Support/SupportCreate')),
    },
    '/product/support/edit/:id': {
      component: dynamicWrapper(app, ['resource', 'product', 'merchant'], () => import('../routes/Product/Support/SupportCreate')),
    },
    '/product/training': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Training')),
    },
    '/product/training/list': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Training/TrainingList')),
    },
    '/product/training/create': {
      component: dynamicWrapper(app, ['resource', 'product', 'merchant'], () => import('../routes/Product/Training/TrainingCreate')),
    },
    '/product/training/edit/:id': {
      component: dynamicWrapper(app, ['resource', 'product', 'merchant'], () => import('../routes/Product/Training/TrainingCreate')),
    },
    '/product/package': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Package')),
    },
    '/product/package/list': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Package/PackageList')),
    },
    '/product/package/create': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Package/PackageCreate')),
    },
    '/product/package/edit/:id': {
      component: dynamicWrapper(app, ['product'], () => import('../routes/Product/Package/PackageCreate')),
    },
    // 产品出售相关路由注册
    '/shelves/course': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves')),
    },
    '/shelves/course/list': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesList')),
    },
    '/shelves/course/create': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesCreate')),
    },
    '/shelves/course/edit': {
      component: dynamicWrapper(app, ['shelves', 'resource'], () => import('../routes/Shelves/ShelvesEdit')),
    },
    '/shelves/support': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves')),
    },
    '/shelves/support/list': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesList')),
    },
    '/shelves/support/create': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesCreate')),
    },
    '/shelves/support/edit': {
      component: dynamicWrapper(app, ['shelves', 'resource'], () => import('../routes/Shelves/ShelvesEdit')),
    },
    '/shelves/training': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves')),
    },
    '/shelves/training/list': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesList')),
    },
    '/shelves/training/create': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesCreate')),
    },
    '/shelves/training/edit': {
      component: dynamicWrapper(app, ['shelves', 'resource'], () => import('../routes/Shelves/ShelvesEdit')),
    },
    '/shelves/package': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves')),
    },
    '/shelves/package/list': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesList')),
    },
    '/shelves/package/create': {
      component: dynamicWrapper(app, ['shelves'], () => import('../routes/Shelves/ShelvesCreate')),
    },
    '/shelves/package/edit': {
      component: dynamicWrapper(app, ['shelves', 'resource'], () => import('../routes/Shelves/ShelvesEdit')),
    },
    // 前端管理相关路由注册
    '/frontend/tagGroup': {
      component: dynamicWrapper(app, ['tagGroup'], () => import('../routes/Frontend/TagGroup')),
    },
    '/frontend/tagGroup/list': {
      component: dynamicWrapper(app, ['tagGroup'], () => import('../routes/Frontend/TagGroup/TagGroupList')),
    },
    '/frontend/tagGroup/create': {
      component: dynamicWrapper(app, ['tagGroup', 'merchant'], () => import('../routes/Frontend/TagGroup/TagGroupCreate')),
    },
    '/frontend/tagGroup/edit/:id': {
      component: dynamicWrapper(app, ['tagGroup', 'merchant'], () => import('../routes/Frontend/TagGroup/TagGroupCreate')),
    },
    '/frontend/tagType': {
      component: dynamicWrapper(app, ['tagType'], () => import('../routes/Frontend/TagType')),
    },
    '/frontend/tagType/list': {
      component: dynamicWrapper(app, ['tagType'], () => import('../routes/Frontend/TagType/TagTypeList')),
    },
    '/frontend/tagType/create': {
      component: dynamicWrapper(app, ['tagType', 'merchant'], () => import('../routes/Frontend/TagType/TagTypeCreate')),
    },
    '/frontend/tagType/edit/:id': {
      component: dynamicWrapper(app, ['tagType', 'merchant'], () => import('../routes/Frontend/TagType/TagTypeCreate')),
    },
    '/frontend/tag': {
      component: dynamicWrapper(app, ['tag'], () => import('../routes/Frontend/Tag')),
    },
    '/frontend/tag/list': {
      component: dynamicWrapper(app, ['tag'], () => import('../routes/Frontend/Tag/TagList')),
    },
    '/frontend/tag/create': {
      component: dynamicWrapper(app, ['tag', 'tagGroup', 'shelves'], () => import('../routes/Frontend/Tag/TagCreate')),
    },
    '/frontend/tag/edit/:id': {
      component: dynamicWrapper(app, ['tag', 'tagGroup', 'shelves'], () => import('../routes/Frontend/Tag/TagCreate')),
    },
    '/frontend/recommend': {
      component: dynamicWrapper(app, ['merchant'], () => import('../routes/Frontend/Recommend')),
    },
    '/frontend/recommend/merchant-list': {
      component: dynamicWrapper(app, ['merchant'], () => import('../routes/Frontend/Recommend/RecommendList')),
    },
    '/frontend/recommend/course-edit/:id': {
      component: dynamicWrapper(app, ['merchant', 'shelves'], () => import('../routes/Frontend/Recommend/RecommendCourse')),
    },
    '/frontend/recommend/poster-edit/:id': {
      component: dynamicWrapper(app, ['merchant', 'shelves'], () => import('../routes/Frontend/Recommend/RecommendPoster')),
    },
    '/frontend/ConfigUser': {
      component: dynamicWrapper(app, ['configUser'], () => import('../routes/Frontend/ConfigUser')),
    },
    '/frontend/ConfigUser/list': {
      component: dynamicWrapper(app, ['configUser', 'terminal'], () => import('../routes/Frontend/ConfigUser/ConfigUserLists')),
    },
    '/frontend/ConfigUser/tag/:id': {
      component: dynamicWrapper(app, ['configUser', 'tag', 'tagType'], () => import('../routes/Frontend/ConfigUser/ConfigTag')),
    },
    '/frontend/ConfigUser/course-edit/:id': {
      component: dynamicWrapper(app, ['configUser', 'tag', 'tagType'], () => import('../routes/Frontend/ConfigUser/ConfigRecommendCourse')),
    },
    '/frontend/ConfigUser/poster-edit/:id': {
      component: dynamicWrapper(app, ['configUser', 'tag', 'tagType'], () => import('../routes/Frontend/ConfigUser/ConfigRecommendPoster')),
    },
    '/trade/shopcart': {
      component: dynamicWrapper(app, [], () => import('../routes/Trade/ShopCart')),
    },
    '/trade/shopcart/list': {
      component: dynamicWrapper(app, ['terminal', 'campus', 'merchant'], () => import('../routes/Trade/ShopCart/ShopCartList')),
    },
    '/trade/shopcart/detail/:id': {
      component: dynamicWrapper(app, ['trade'], () => import('../routes/Trade/ShopCart/ShopCartDetail')),
    },
    '/trade/order': {
      component: dynamicWrapper(app, [], () => import('../routes/Trade/Order')),
    },
    '/trade/order/list': {
      component: dynamicWrapper(app, ['trade'], () => import('../routes/Trade/Order/OrderList')),
    },
    '/trade/order/create': {
      component: dynamicWrapper(app, ['trade', 'terminal', 'shelves'], () => import('../routes/Trade/Order/OrderCreate')),
    },
    '/trade/order/view/:id': {
      component: dynamicWrapper(app, ['trade'], () => import('../routes/Trade/Order/OrderDetail')),
    },
    '/trade/order/sub/:id': {
      component: dynamicWrapper(app, ['trade'], () => import('../routes/Trade/Order/SubOrderDetail')),
    },
    // 统计概览相关路由注册
    // '/dashboard/analysis': {
    //   component: dynamicWrapper(app, ['chart'], () => import('../routes/Dashboard/Analysis')),
    // },
    '/dashboard/sold': {
      component: dynamicWrapper(app, ['trade'], () => import('../routes/Dashboard/SnapshotList')),
    },
    // 异常相关路由注册
    '/exception/403': {
      component: dynamicWrapper(app, [], () => import('../routes/Exception/403')),
    },
    '/exception/404': {
      component: dynamicWrapper(app, [], () => import('../routes/Exception/404')),
    },
    '/exception/500': {
      component: dynamicWrapper(app, [], () => import('../routes/Exception/500')),
    },
    // 登录相关路由注册
    '/user': {
      component: dynamicWrapper(app, [], () => import('../layouts/UserLayout')),
    },
    '/user/login': {
      component: dynamicWrapper(app, ['login'], () => import('../routes/User/Login')),
    },
    // 帮助文档相关路由注册
    '/document/platform': {
      component: dynamicWrapper(app, [], () => import('../routes/Document/DocumentPlatform')),
    },
  };
  // Get name from ./menu.js or just set it in the router data.
  const menuData = getFlatMenuData(getMenuData());

  // Route configuration data
  // eg. {name,authority ...routerConfig }
  const routerData = {};
  // The route matches the menu
  Object.keys(routerConfig).forEach((path) => {
    // Regular match item name
    // eg.  router /user/:id === /user/chen
    const pathRegexp = pathToRegexp(path);
    const menuKey = Object.keys(menuData).find(key => pathRegexp.test(`${key}`));
    let menuItem = {};
    // If menuKey is not empty
    if (menuKey) {
      menuItem = menuData[menuKey];
    }
    let router = routerConfig[path];
    // If you need to configure complex parameter routing,
    // https://github.com/ant-design/ant-design-pro-site/blob/master/docs/router-and-nav.md#%E5%B8%A6%E5%8F%82%E6%95%B0%E7%9A%84%E8%B7%AF%E7%94%B1%E8%8F%9C%E5%8D%95
    // eg . /list/:type/user/info/:id
    router = {
      ...router,
      name: router.name || menuItem.name,
      authority: router.authority || menuItem.authority,
    };
    routerData[path] = router;
  });
  return routerData;
};