提交 57c9820e 编写于 作者: 陈帅

Optimization: Remove the use router.js and menu.js

上级 d8ab4925
...@@ -48,75 +48,147 @@ export default { ...@@ -48,75 +48,147 @@ export default {
routes: [ routes: [
// dashboard // dashboard
{ path: '/', redirect: '/dashboard/analysis' }, { path: '/', redirect: '/dashboard/analysis' },
{ path: '/dashboard/analysis', component: './Dashboard/Analysis' }, {
{ path: '/dashboard/monitor', component: './Dashboard/Monitor' }, path: '/dashboard',
{ path: '/dashboard/workplace', component: './Dashboard/Workplace' }, name: 'dashboard',
icon: 'dashboard',
routes: [
{ path: '/dashboard/analysis', name: 'analysis', component: './Dashboard/Analysis' },
{ path: '/dashboard/monitor', name: 'monitor', component: './Dashboard/Monitor' },
{ path: '/dashboard/workplace', name: 'workplace', component: './Dashboard/Workplace' },
],
},
// forms // forms
{ path: '/form/basic-form', component: './Forms/BasicForm' },
{ {
path: '/form/step-form', path: '/form',
component: './Forms/StepForm', icon: 'form',
name: 'form',
routes: [ routes: [
{ path: '/form/step-form', redirect: '/form/step-form/info' }, { path: '/form/basic-form', name: 'basicform', component: './Forms/BasicForm' },
{ path: '/form/step-form/info', component: './Forms/StepForm/Step1' }, {
{ path: '/form/step-form/confirm', component: './Forms/StepForm/Step2' }, name: 'stepform',
{ path: '/form/step-form/result', component: './Forms/StepForm/Step3' }, path: '/form/step-form',
component: './Forms/StepForm',
hideChildren: true,
routes: [
{ path: '/form/step-form/info', name: 'info', component: './Forms/StepForm/Step1' },
{
path: '/form/step-form/confirm',
name: 'confirm',
component: './Forms/StepForm/Step2',
},
{
path: '/form/step-form/result',
name: 'result',
component: './Forms/StepForm/Step3',
},
],
},
{
path: '/form/advanced-form',
name: 'advancedform',
component: './Forms/AdvancedForm',
},
], ],
}, },
{ path: '/form/advanced-form', component: './Forms/AdvancedForm' },
// list // list
{ path: '/list/table-list', component: './List/TableList' },
{ path: '/list/table-list', component: './List/TableList' },
{ path: '/list/basic-list', component: './List/BasicList' },
{ path: '/list/card-list', component: './List/CardList' },
{ {
path: '/list/search', path: '/list',
component: './List/List', icon: 'table',
name: 'list',
routes: [ routes: [
{ path: '/list/search', redirect: '/list/search/projects' }, { path: '/list/table-list', name: 'searchlist', component: './List/TableList' },
{ path: '/list/search/articles', component: './List/Articles' }, { path: '/list/basic-list', name: 'basiclist', component: './List/BasicList' },
{ path: '/list/search/projects', component: './List/Projects' }, { path: '/list/card-list', name: 'cardlist', component: './List/CardList' },
{ path: '/list/search/applications', component: './List/Applications' }, {
path: '/list/search',
name: 'searchlist',
component: './List/List',
routes: [
{ path: '/list/search/articles', name: 'articles', component: './List/Articles' },
{ path: '/list/search/projects', name: 'projects', component: './List/Projects' },
{
path: '/list/search/applications',
name: 'applications',
component: './List/Applications',
},
],
},
], ],
}, },
// profile
{ path: '/profile/basic', component: './Profile/BasicProfile' },
{ path: '/profile/advanced', component: './Profile/AdvancedProfile' },
// result
{ path: '/result/success', component: './Result/Success' },
{ path: '/result/fail', component: './Result/Error' },
// exception
{ path: '/exception/403', component: './Exception/403' },
{ path: '/exception/404', component: './Exception/404' },
{ path: '/exception/500', component: './Exception/500' },
{ path: '/exception/trigger', component: './Exception/triggerException' },
// account
{ {
path: '/account/center', path: '/profile',
component: './Account/Center/Center', name: 'profile',
icon: 'profile',
routes: [ routes: [
{ path: '/account/center', redirect: '/account/center/articles' }, // profile
{ path: '/account/center/articles', component: './Account/Center/Articles' }, { path: '/profile/basic', name: 'basic', component: './Profile/BasicProfile' },
{ path: '/account/center/applications', component: './Account/Center/Applications' }, { path: '/profile/advanced', name: 'advanced', component: './Profile/AdvancedProfile' },
{ path: '/account/center/projects', component: './Account/Center/Projects' },
], ],
}, },
{ {
path: '/account/settings', name: 'result',
component: './Account/Settings/Info', icon: 'check-circle-o',
path: '/result',
routes: [ routes: [
{ path: '/account/settings', redirect: '/account/settings/base' }, // result
{ path: '/account/settings/base', component: './Account/Settings/BaseView' }, { path: '/result/success', name: 'success', component: './Result/Success' },
{ path: '/account/settings/security', component: './Account/Settings/SecurityView' }, { path: '/result/fail', name: 'fail', component: './Result/Error' },
{ path: '/account/settings/binding', component: './Account/Settings/BindingView' }, ],
},
{
name: 'exception',
icon: 'warning',
path: '/exception',
routes: [
// exception
{ path: '/exception/403', name: 'not-permission', component: './Exception/403' },
{ path: '/exception/404', name: 'not-find', component: './Exception/404' },
{ path: '/exception/500', name: 'server-error', component: './Exception/500' },
{
path: '/exception/trigger',
name: 'trigger',
hideInMenu: true,
component: './Exception/triggerException',
},
],
},
{
name: 'account',
icon: 'user',
path: '/account',
routes: [
{
path: '/account/center',
name: 'center',
component: './Account/Center/Center',
routes: [
{ path: '/account/center', redirect: '/account/center/articles' },
{ path: '/account/center/articles', component: './Account/Center/Articles' },
{
path: '/account/center/applications',
component: './Account/Center/Applications',
},
{ path: '/account/center/projects', component: './Account/Center/Projects' },
],
},
{ {
path: '/account/settings/notification', path: '/account/settings',
component: './Account/Settings/NotificationView', name: 'settings',
component: './Account/Settings/Info',
routes: [
{ path: '/account/settings', redirect: '/account/settings/base' },
{ path: '/account/settings/base', component: './Account/Settings/BaseView' },
{
path: '/account/settings/security',
component: './Account/Settings/SecurityView',
},
{ path: '/account/settings/binding', component: './Account/Settings/BindingView' },
{
path: '/account/settings/notification',
component: './Account/Settings/NotificationView',
},
],
}, },
], ],
}, },
......
// TODO:remove // // TODO: authority
// import { isUrl } from '../utils/utils';
// const menuData = [ // const menuData = [
// { // {
// name: 'dashboard', // name: 'dashboard',
...@@ -8,15 +6,15 @@ ...@@ -8,15 +6,15 @@
// path: 'dashboard', // path: 'dashboard',
// children: [ // children: [
// { // {
// name: '分析页', // name: 'analysis',
// path: 'analysis', // path: 'analysis',
// }, // },
// { // {
// name: '监控页', // name: 'monitor',
// path: 'monitor', // path: 'monitor',
// }, // },
// { // {
// name: '工作台', // name: 'workplace',
// path: 'workplace', // path: 'workplace',
// // hideInBreadcrumb: true, // // hideInBreadcrumb: true,
// // hideInMenu: true, // // hideInMenu: true,
...@@ -24,56 +22,57 @@ ...@@ -24,56 +22,57 @@
// ], // ],
// }, // },
// { // {
// name: '表单页', // name: 'form',
// icon: 'form', // icon: 'form',
// path: 'form', // path: 'form',
// children: [ // children: [
// { // {
// name: '基础表单', // name: 'basicform',
// path: 'basic-form', // path: 'basic-form',
// }, // },
// { // {
// name: '分步表单', // name: 'stepform',
// path: 'step-form', // path: 'step-form',
// }, // },
// { // {
// name: '高级表单', // // authority: 'admin',
// name: 'advancedform',
// authority: 'admin', // authority: 'admin',
// path: 'advanced-form', // path: 'advanced-form',
// }, // },
// ], // ],
// }, // },
// { // {
// name: '列表页', // name: 'list',
// icon: 'table', // icon: 'table',
// path: 'list', // path: 'list',
// children: [ // children: [
// { // {
// name: '查询表格', // name: 'searchlist',
// path: 'table-list', // path: 'table-list',
// }, // },
// { // {
// name: '标准列表', // name: 'basiclist',
// path: 'basic-list', // path: 'basic-list',
// }, // },
// { // {
// name: '卡片列表', // name: 'cardlist',
// path: 'card-list', // path: 'card-list',
// }, // },
// { // {
// name: '搜索列表', // name: 'searchlist',
// path: 'search', // path: 'search',
// children: [ // children: [
// { // {
// name: '搜索列表(文章)', // name: 'articles',
// path: 'articles', // path: 'articles',
// }, // },
// { // {
// name: '搜索列表(项目)', // name: 'projects',
// path: 'projects', // path: 'projects',
// }, // },
// { // {
// name: '搜索列表(应用)', // name: 'applications',
// path: 'applications', // path: 'applications',
// }, // },
// ], // ],
...@@ -81,291 +80,73 @@ ...@@ -81,291 +80,73 @@
// ], // ],
// }, // },
// { // {
// name: '详情页', // name: 'profile',
// icon: 'profile', // icon: 'profile',
// path: 'profile', // path: 'profile',
// children: [ // children: [
// { // {
// name: '基础详情页', // name: 'basic',
// path: 'basic', // path: 'basic',
// }, // },
// { // {
// name: '高级详情页', // name: 'advanced',
// path: 'advanced', // path: 'advanced',
// authority: 'admin', // // authority: 'admin',
// }, // },
// ], // ],
// }, // },
// { // {
// name: '结果页', // name: 'result',
// icon: 'check-circle-o', // icon: 'check-circle-o',
// path: 'result', // path: 'result',
// children: [ // children: [
// { // {
// name: '成功', // name: 'success',
// path: 'success', // path: 'success',
// }, // },
// { // {
// name: '失败', // name: 'fail',
// path: 'fail', // path: 'fail',
// }, // },
// ], // ],
// }, // },
// { // {
// name: '异常页', // name: 'exception',
// icon: 'warning', // icon: 'warning',
// path: 'exception', // path: 'exception',
// children: [ // children: [
// { // {
// name: '403', // name: 'not-permission',
// path: '403', // path: '403',
// }, // },
// { // {
// name: '404', // name: 'not-find',
// path: '404', // path: '404',
// }, // },
// { // {
// name: '500', // name: 'server-error',
// path: '500', // path: '500',
// }, // },
// { // {
// name: '触发异常', // name: 'trigger',
// path: 'trigger', // path: 'trigger',
// hideInMenu: true, // hideInMenu: true,
// }, // },
// ], // ],
// }, // },
// { // {
// name: '账户', // name: 'account',
// icon: 'user',
// path: 'user',
// authority: 'guest',
// children: [
// {
// name: '登录',
// path: 'login',
// },
// {
// name: '注册',
// path: 'register',
// },
// {
// name: '注册结果',
// path: 'register-result',
// },
// ],
// },
// {
// name: '个人页',
// icon: 'user', // icon: 'user',
// path: 'account', // path: 'account',
// children: [ // children: [
// { // {
// name: '个人中心', // name: 'center',
// path: 'center', // path: 'center',
// }, // },
// { // {
// name: '个人设置', // name: 'settings',
// path: 'settings', // path: 'settings',
// }, // },
// ], // ],
// }, // },
// ]; // ];
// function formatter(data, parentPath = '/', parentAuthority) {
// return data.map(item => {
// let { path } = item;
// if (!isUrl(path)) {
// path = parentPath + item.path;
// }
// const result = {
// ...item,
// path,
// authority: item.authority || parentAuthority,
// };
// if (item.children) {
// result.children = formatter(item.children, `${parentPath}${item.path}/`, item.authority);
// }
// return result;
// });
// }
// export const getMenuData = () => formatter(menuData);
import { isUrl } from '../utils/utils';
// TODO: authority
const menuData = [
{
name: 'dashboard',
icon: 'dashboard',
path: 'dashboard',
children: [
{
name: 'analysis',
path: 'analysis',
},
{
name: 'monitor',
path: 'monitor',
},
{
name: 'workplace',
path: 'workplace',
// hideInBreadcrumb: true,
// hideInMenu: true,
},
],
},
{
name: 'form',
icon: 'form',
path: 'form',
children: [
{
name: 'basicform',
path: 'basic-form',
},
{
name: 'stepform',
path: 'step-form',
},
{
// authority: 'admin',
name: 'advancedform',
authority: 'admin',
path: 'advanced-form',
},
],
},
{
name: 'list',
icon: 'table',
path: 'list',
children: [
{
name: 'searchlist',
path: 'table-list',
},
{
name: 'basiclist',
path: 'basic-list',
},
{
name: 'cardlist',
path: 'card-list',
},
{
name: 'searchlist',
path: 'search',
children: [
{
name: 'articles',
path: 'articles',
},
{
name: 'projects',
path: 'projects',
},
{
name: 'applications',
path: 'applications',
},
],
},
],
},
{
name: 'profile',
icon: 'profile',
path: 'profile',
children: [
{
name: 'basic',
path: 'basic',
},
{
name: 'advanced',
path: 'advanced',
// authority: 'admin',
},
],
},
{
name: 'result',
icon: 'check-circle-o',
path: 'result',
children: [
{
name: 'success',
path: 'success',
},
{
name: 'fail',
path: 'fail',
},
],
},
{
name: 'exception',
icon: 'warning',
path: 'exception',
children: [
{
name: 'not-permission',
path: '403',
},
{
name: 'not-find',
path: '404',
},
{
name: 'server-error',
path: '500',
},
{
name: 'trigger',
path: 'trigger',
hideInMenu: true,
},
],
},
{
name: 'account',
icon: 'user',
path: 'account',
children: [
{
name: 'center',
path: 'center',
},
{
name: 'settings',
path: 'settings',
},
],
},
];
function formatter(data, parentPath = '/', parentAuthority, parentName) {
return data.map(item => {
let { path } = item;
const id = parentName ? `${parentName}.${item.name}` : `menu.${item.name}`;
if (!isUrl(path)) {
path = parentPath + item.path;
}
const result = {
...item,
path,
locale: id,
authority: item.authority || parentAuthority,
};
if (item.children) {
result.children = formatter(item.children, `${parentPath}${item.path}/`, item.authority, id);
}
return result;
});
}
export const getMenuData = () => formatter(menuData);
...@@ -80,7 +80,8 @@ export default class BaseMenu extends PureComponent { ...@@ -80,7 +80,8 @@ export default class BaseMenu extends PureComponent {
* get SubMenu or Item * get SubMenu or Item
*/ */
getSubMenuOrItem = item => { getSubMenuOrItem = item => {
if (item.children && item.children.some(child => child.name)) { // doc: add hideChildren
if (item.children && !item.hideChildren && item.children.some(child => child.name)) {
const name = <FormattedMessage defaultMessage={item.name} id={item.locale} />; const name = <FormattedMessage defaultMessage={item.name} id={item.locale} />;
return ( return (
<SubMenu <SubMenu
......
...@@ -8,6 +8,9 @@ export default { ...@@ -8,6 +8,9 @@ export default {
'menu.form': 'Form', 'menu.form': 'Form',
'menu.form.basicform': 'Basic Form', 'menu.form.basicform': 'Basic Form',
'menu.form.stepform': 'Step Form', 'menu.form.stepform': 'Step Form',
'menu.form.stepform.info': 'Step Form(write transfer information)',
'menu.form.stepform.confirm': 'Step Form(confirm transfer information)',
'menu.form.stepform.result': 'Step Form(finished)',
'menu.form.advancedform': 'Advanced Form', 'menu.form.advancedform': 'Advanced Form',
'menu.list': 'List', 'menu.list': 'List',
'menu.list.searchlist': 'Search List', 'menu.list.searchlist': 'Search List',
...@@ -17,8 +20,8 @@ export default { ...@@ -17,8 +20,8 @@ export default {
'menu.list.searchlist.projects': 'Search List(projects)', 'menu.list.searchlist.projects': 'Search List(projects)',
'menu.list.searchlist.applications': 'Search List(applications)', 'menu.list.searchlist.applications': 'Search List(applications)',
'menu.profile': 'Profile', 'menu.profile': 'Profile',
'menu.profile.basic': 'Basic', 'menu.profile.basic': 'Basic Profile',
'menu.profile.advanced': 'Advanced', 'menu.profile.advanced': 'Advanced Profile',
'menu.result': 'Result', 'menu.result': 'Result',
'menu.result.success': 'Success', 'menu.result.success': 'Success',
'menu.result.fail': 'Fail', 'menu.result.fail': 'Fail',
......
...@@ -10,6 +10,9 @@ export default { ...@@ -10,6 +10,9 @@ export default {
'menu.form': '表单页', 'menu.form': '表单页',
'menu.form.basicform': '基础表单', 'menu.form.basicform': '基础表单',
'menu.form.stepform': '分布表单', 'menu.form.stepform': '分布表单',
'menu.form.stepform.info': '分步表单(填写转账信息)',
'menu.form.stepform.confirm': '分步表单(确认转账信息)',
'menu.form.stepform.result': '分步表单(完成)',
'menu.form.advancedform': '高级表单', 'menu.form.advancedform': '高级表单',
'menu.list': '列表页', 'menu.list': '列表页',
'menu.list.searchlist': '搜索列表', 'menu.list.searchlist': '搜索列表',
...@@ -19,8 +22,8 @@ export default { ...@@ -19,8 +22,8 @@ export default {
'menu.list.searchlist.projects': '搜索列表(项目)', 'menu.list.searchlist.projects': '搜索列表(项目)',
'menu.list.searchlist.applications': '搜索列表(应用)', 'menu.list.searchlist.applications': '搜索列表(应用)',
'menu.profile': '详情页', 'menu.profile': '详情页',
'menu.profile.basic': '详情页', 'menu.profile.basic': '基础详情页',
'menu.profile.advanced': '详情页', 'menu.profile.advanced': '高级详情页',
'menu.result': '结果页', 'menu.result': '结果页',
'menu.result.success': '成功页', 'menu.result.success': '成功页',
'menu.result.fail': '失败页', 'menu.result.fail': '失败页',
......
...@@ -8,8 +8,10 @@ ...@@ -8,8 +8,10 @@
<title>Ant Design Pro</title> <title>Ant Design Pro</title>
<link rel="icon" href="/favicon.png" type="image/x-icon"> <link rel="icon" href="/favicon.png" type="image/x-icon">
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script> <script src="https://cdn.polyfill.io/v2/polyfill.min.js"></script>
<!-- rollbar -->
<script src="https://gw.alipayobjects.com/os/rmsportal/nGVBgVyXzzmbAqevIAPy.js"> <script src="https://gw.alipayobjects.com/os/rmsportal/nGVBgVyXzzmbAqevIAPy.js">
</script> </script>
<!-- bizcharts -->
<script src=" https://gw.alipayobjects.com/os/rmsportal/TKSqiyoUxzrHoMwjViwA.js "></script> <script src=" https://gw.alipayobjects.com/os/rmsportal/TKSqiyoUxzrHoMwjViwA.js "></script>
<script src="https://gw.alipayobjects.com/os/antv/assets/data-set/0.8.7/data-set.min.js"></script> <script src="https://gw.alipayobjects.com/os/antv/assets/data-set/0.8.7/data-set.min.js"></script>
</head> </head>
......
/* eslint-disable no-unused-vars */
// TODO remove eslint-disable
import React from 'react'; import React from 'react';
import { Layout } from 'antd'; import { Layout } from 'antd';
import DocumentTitle from 'react-document-title'; import DocumentTitle from 'react-document-title';
import memoizeOne from 'memoize-one'; import memoizeOne from 'memoize-one';
import { connect } from 'dva'; import { connect } from 'dva';
// import { Route, Redirect, Switch } from 'dva/router';
import { ContainerQuery } from 'react-container-query'; import { ContainerQuery } from 'react-container-query';
import classNames from 'classnames'; import classNames from 'classnames';
import pathToRegexp from 'path-to-regexp'; import pathToRegexp from 'path-to-regexp';
import { formatMessage } from 'umi/locale'; import { formatMessage } from 'umi/locale';
import SiderMenu from '../../components/SiderMenu'; import SiderMenu from '../../components/SiderMenu';
// import NotFound from '../Exception/404';
// import { getRoutes } from '../utils/utils';
import Authorized from '../../utils/Authorized'; import Authorized from '../../utils/Authorized';
import SettingDarwer from '../../components/SettingDarwer'; import SettingDarwer from '../../components/SettingDarwer';
import logo from '../../assets/logo.svg'; import logo from '../../assets/logo.svg';
...@@ -26,13 +21,12 @@ const { check } = Authorized; ...@@ -26,13 +21,12 @@ const { check } = Authorized;
/** /**
* 获取面包屑映射 * 获取面包屑映射
* @param {Object} menuData 菜单配置 * @param {Object} menuData 菜单配置
* @param {Object} routerData 路由配置
*/ */
const getBreadcrumbNameMap = memoizeOne((meun, router) => { const getBreadcrumbNameMap = memoizeOne(meun => {
const routerMap = {}; const routerMap = {};
const mergeMeunAndRouter = meunData => { const mergeMeunAndRouter = meunData => {
meunData.forEach(meunItem => { meunData.forEach(meunItem => {
routerMap[meunItem.path] = Object.assign(meunItem, router); routerMap[meunItem.path] = meunItem;
if (meunItem.children) { if (meunItem.children) {
mergeMeunAndRouter(meunItem.children); mergeMeunAndRouter(meunItem.children);
} }
...@@ -70,9 +64,10 @@ const query = { ...@@ -70,9 +64,10 @@ const query = {
class BasicLayout extends React.PureComponent { class BasicLayout extends React.PureComponent {
constructor(props) { constructor(props) {
super(props); super(props);
const { routerData, menuData } = this.props; const { menuData } = this.props;
this.getPageTitle = memoizeOne(this.getPageTitle); this.getPageTitle = memoizeOne(this.getPageTitle);
this.breadcrumbNameMap = getBreadcrumbNameMap(menuData, routerData); console.log(getBreadcrumbNameMap(menuData));
this.breadcrumbNameMap = getBreadcrumbNameMap(menuData);
} }
getContext() { getContext() {
......
...@@ -3,14 +3,30 @@ import { Spin } from 'antd'; ...@@ -3,14 +3,30 @@ import { Spin } from 'antd';
import { connect } from 'dva'; import { connect } from 'dva';
import { enquireScreen, unenquireScreen } from 'enquire-js'; import { enquireScreen, unenquireScreen } from 'enquire-js';
import BasicLayout from './BasicLayout'; import BasicLayout from './BasicLayout';
import { getMenuData } from '../../common/menu'; // TODO: should use this.props.routes
import { getRouterData } from '../../common/router'; import config from '../../../config/config';
const menuData = config['routes'];
// change router to menu.
function formatter(data, parentPath = '', parentAuthority, parentName) {
return data.map(item => {
const id = parentName ? `${parentName}.${item.name}` : `menu.${item.name}`;
const result = {
...item,
locale: id,
authority: item.authority || parentAuthority,
};
if (item.routes) {
result.children = formatter(item.routes, `${parentPath}${item.path}/`, item.authority, id);
}
return result;
});
}
/** /**
* 根据菜单取得重定向地址. * 根据菜单取得重定向地址.
*/ */
const MenuData = formatter(menuData[1].routes);
const MenuData = getMenuData(); const routerData = config.routes;
const routerData = getRouterData({});
const getRedirectData = () => { const getRedirectData = () => {
const redirectData = []; const redirectData = [];
const getRedirect = item => { const getRedirect = item => {
......
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册