openstack/skyline-console
Code Issues Proposed changes

refactor: Refactor path jump

Browse Source 
Refactor path jump by routeName which is defined in menu as key

Change-Id: I82cda19a2b92b29498238b85c75181848e51e072
This commit is contained in:
Jingwei.Zhang 2021-11-09 17:57:57 +08:00
parent 9d0e402048
commit 6d2ea1bf34
123 changed files with 858 additions and 607 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
docs/en/develop/3-1-BaseList-introduction.md
View File

@ -175,7 +175,7 @@ English | [Chinese](../../zh/develop/3-1-BaseList-introduction.md)
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/compute/${this.getUrl('image')}/detail`,
routeName: this.getRouteName('imageDetail'),
},
{
title: t('Project ID/Name'),
@ -526,7 +526,7 @@ English | [Chinese](../../zh/develop/3-1-BaseList-introduction.md)
- Is the current page a "management platform" page
- `hasAdminRole`
- Whether the logged-in user role has an administrator role
- `getUrl`
- `getRoutePath`
- Function to generate page URL
- For example, it is necessary to provide a jump function to the associated resources of the list page. Using this function, you can jump to the corresponding address of the console in the console, and jump to the corresponding address of the management platform in the management platform.
- `params`

2
docs/en/develop/3-2-BaseTabList-introduction.md
View File

@ -114,7 +114,7 @@ English | [Chinese](../../zh/develop/3-2-BaseTabList-introduction.md)
- Is the current page a "management platform" page
- `hasAdminRole`
- Whether the logged-in user role has an administrator role
- `getUrl`
- `getRoutePath`
- Function to generate page URL
- For example, it is necessary to provide a jump function for the associated resources of the list page. Using this function, you can jump to the corresponding address of the console in the console, and jump to the corresponding address of the management platform in the management platform.

4
docs/en/develop/3-3-BaseDetail-introduction.md
View File

@ -72,7 +72,7 @@ English | [Chinese](../../zh/develop/3-3-BaseDetail-introduction.md)
```javascript
get listUrl() {
return this.getUrl('/storage/volume');
return this.getRoutePath('volume');
}
```
@ -241,7 +241,7 @@ English | [Chinese](../../zh/develop/3-3-BaseDetail-introduction.md)
- `id` in routing information
- `isAdminPage`
- Is the current page a "management platform" page
- `getUrl`
- `getRoutePath`
- Function to generate page URL
- For example, it is necessary to provide a jump function to the associated resource. Using this function, you can jump to the corresponding address of the console in the console, and jump to the corresponding address of the management platform in the management platform.
- `routing`

2
docs/en/develop/3-4-BaseDetailInfo-introduction.md
View File

@ -131,7 +131,7 @@ English | [Chinese](../../zh/develop/3-4-BaseDetailInfo-introduction.md)
- `id` in routing information
- `isAdminPage`
- Is the current page a "management platform" page
- `getUrl`
- `getRoutePath`
- Function to generate page URL
- For example, it is necessary to provide a jump function to the associated resource. Using this function, you can jump to the corresponding address of the console in the console, and jump to the corresponding address of the management platform in the management platform.
- `routing`

4
docs/en/develop/3-6-FormAction-introduction.md
View File

@ -147,7 +147,7 @@ English | [Chinese](../../zh/develop/3-6-FormAction-introduction.md)
```javascript
get listUrl() {
return this.getUrl('/storage/volume');
return this.getRoutePath('volume');
}
```
@ -381,7 +381,7 @@ English | [Chinese](../../zh/develop/3-6-FormAction-introduction.md)
- After the form is successfully validated, the updated form value
- `isAdminPage`
- Is the current page a "management platform" page
- `getUrl`
- `getRoutePath`
- Function to generate page URL
- For example, it is necessary to provide a jump function to the associated resource. Using this function, you can jump to the corresponding address of the console in the console, and jump to the corresponding address of the management platform in the management platform.

2
docs/en/develop/3-9-StepAction-introduction.md
View File

@ -286,7 +286,7 @@ English | [简体中文](../../zh/develop/3-9-StepAction-introduction.md)
- `isAdminPage`
- Whether current page is a "management platform" page
- `getUrl`
- `getRoutePath`
- Generate function of page URL
- Such as: need to provide a ability of jump to the associated resource, use this function, you can jump to the corresponding address of the `console platform` in the `console platform`, and jump to the corresponding address of the `management platform` in the `management platform`.

4
docs/zh/develop/3-1-BaseList-introduction.md
View File

@ -175,7 +175,7 @@
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/compute/${this.getUrl('image')}/detail`,
routeName: this.getRouteName('imageDetail'),
},
{
title: t('Project ID/Name'),
@ -526,7 +526,7 @@
- 当前页面是否是“管理平台”的页面
- `hasAdminRole`
- 登录的用户角色是否具有管理员角色
- `getUrl`
- `getRoutePath`
- 生成页面 Url 的函数
- 如：需要给列表页的关联资源提供跳转功能，使用该函数，可以在控制台跳转到控制台的相应地址，在管理平台跳转到管理平台的相应地址
- `params`

2
docs/zh/develop/3-2-BaseTabList-introduction.md
View File

@ -114,7 +114,7 @@
- 当前页面是否是“管理平台”的页面
- `hasAdminRole`
- 登录的用户角色是否具有管理员角色
- `getUrl`
- `getRoutePath`
- 生成页面 Url 的函数
- 如：需要给列表页的关联资源提供跳转功能，使用该函数，可以在控制台跳转到控制台的相应地址，在管理平台跳转到管理平台的相应地址

4
docs/zh/develop/3-3-BaseDetail-introduction.md
View File

@ -72,7 +72,7 @@
```javascript
get listUrl() {
return this.getUrl('/storage/volume');
return this.getRoutePath('volume');
}
```
@ -241,7 +241,7 @@
- 路由信息中的`id`
- `isAdminPage`
- 当前页面是否是“管理平台”的页面
- `getUrl`
- `getRoutePath`
- 生成页面 Url 的函数
- 如：需要给关联资源提供跳转功能，使用该函数，可以在控制台跳转到控制台的相应地址，在管理平台跳转到管理平台的相应地址
- `routing`

2
docs/zh/develop/3-4-BaseDetailInfo-introduction.md
View File

@ -131,7 +131,7 @@
- 路由信息中的`id`
- `isAdminPage`
- 当前页面是否是“管理平台”的页面
- `getUrl`
- `getRoutePath`
- 生成页面 Url 的函数
- 如：需要给关联资源提供跳转功能，使用该函数，可以在控制台跳转到控制台的相应地址，在管理平台跳转到管理平台的相应地址
- `routing`

4
docs/zh/develop/3-6-FormAction-introduction.md
View File

@ -147,7 +147,7 @@
```javascript
get listUrl() {
return this.getUrl('/storage/volume');
return this.getRoutePath('volume');
}
```
@ -381,7 +381,7 @@
- 表单验证成功后，更新的表单值
- `isAdminPage`
- 当前页面是否是“管理平台”的页面
- `getUrl`
- `getRoutePath`
- 生成页面 Url 的函数
- 如：需要给关联资源提供跳转功能，使用该函数，可以在控制台跳转到控制台的相应地址，在管理平台跳转到管理平台的相应地址

2
docs/zh/develop/3-9-StepAction-introduction.md
View File

@ -282,7 +282,7 @@
- 表单验证成功后，更新的表单值
- `isAdminPage`
- 当前页面是否是“管理平台”的页面
- `getUrl`
- `getRoutePath`
- 生成页面 Url 的函数
- 如：需要给关联资源提供跳转功能，使用该函数，可以在控制台跳转到控制台的相应地址，在管理平台跳转到管理平台的相应地址

15
src/components/Form/index.jsx
View File

@ -22,6 +22,7 @@ import { isAdminPage, firstUpperCase, unescapeHtml } from 'utils/index';
import { parse } from 'qs';
import FormItem from 'components/FormItem';
import { CancelToken } from 'axios';
import { getPath, getLinkRender } from 'utils/route-map';
import styles from './index.less';
export default class BaseForm extends React.Component {
@ -137,6 +138,20 @@ export default class BaseForm extends React.Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
getLinkRender(routeName, value, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getLinkRender({ key: realName, params, query, value });
}
get isStep() {
return false;
}

19
src/components/FormItem/MemberAllocator/index.jsx
View File

@ -18,8 +18,8 @@ import { MinusCircleOutlined, PlusOutlined } from '@ant-design/icons';
import SelectTable from 'components/FormItem/SelectTable';
import { ipValidate } from 'utils/validate';
import { isAdminPage } from 'utils/index';
import { Link } from 'react-router-dom';
import { Address4, Address6 } from 'ip-address';
import { getLinkRender } from 'utils/route-map';
import Item from './Item';
const { isIPv4, isIpv6 } = ipValidate;
@ -34,9 +34,11 @@ const MemberAllocator = ({ componentProps, formItemProps }) => {
onChange && onChange(data);
};
function getUrl(path, adminStr) {
function getLink(routerName, item) {
const { pathname } = window.location;
return isAdminPage(pathname) ? `${path}${adminStr || '-admin'}` : path;
const key = isAdminPage(pathname) ? `${routerName}Admin` : routerName;
const { id } = item;
return getLinkRender({ key, params: { id }, value: id });
}
let addOuter = () => {};
@ -60,16 +62,7 @@ const MemberAllocator = ({ componentProps, formItemProps }) => {
dataIndex: 'name',
render: (n, record) => (
<div>
<div>
<Link
to={`/network/${getUrl(
'virtual_adapter',
'_admin'
)}/detail/${record.id}`}
>
{record.id}
</Link>
</div>
<div>{getLink('virtualAdapterDetail', record)}</div>
<div>{n || '-'}</div>
</div>
),

10
src/components/FormItem/NetworkSelectTable/index.jsx
View File

@ -19,6 +19,7 @@ import { NetworkStore } from 'stores/neutron/network';
import { yesNoOptions } from 'utils/constants';
import { networkColumns, networkSortProps } from 'resources/network';
import { isAdminPage } from 'utils/index';
import { getPath } from 'utils/route-map';
export class NetworkSelectTable extends Component {
constructor(props) {
@ -87,8 +88,13 @@ export class NetworkSelectTable extends Component {
...networkSortProps,
});
getUrl(path, adminStr) {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
getColumns = (tab) => {

2
src/components/FormItem/VolumeSelectTable/index.jsx
View File

@ -67,8 +67,6 @@ export default class VolumeSelectTable extends Component {
...volumeSortProps,
});
getUrl = () => {};
getColumns = (tab) => {
const columns = volumeColumns;
const { key } = tab;

17
src/components/StepForm/index.jsx
View File

@ -20,6 +20,7 @@ import classnames from 'classnames';
import { firstUpperCase, unescapeHtml } from 'utils/index';
import { parse } from 'qs';
import NotFound from 'components/Cards/NotFound';
import { getPath, getLinkRender } from 'utils/route-map';
import styles from './index.less';
export default class BaseStepForm extends React.Component {
@ -92,7 +93,7 @@ export default class BaseStepForm extends React.Component {
}
get listUrl() {
return '/base/tmp';
return '';
}
get checkEndpoint() {
@ -212,6 +213,20 @@ export default class BaseStepForm extends React.Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
getLinkRender(routeName, value, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getLinkRender({ key: realName, params, query, value });
}
getPrevBtn() {
const { current } = this.state;
if (current === 0) {

6
src/components/TableButton/RuleButton.jsx
View File

@ -15,6 +15,7 @@
import React, { Component } from 'react';
import TableButton from 'components/TableButton';
import { getSelfColumns } from 'resources/security-group-rule';
import { getPath } from 'utils/route-map';
export default class RuleButton extends Component {
getUrl(path, adminStr) {
@ -22,7 +23,10 @@ export default class RuleButton extends Component {
}
getDetailUrl(id) {
return `${this.getUrl('/network/security-group')}/detail/${id}`;
const key = this.isAdminPage
? 'securityGroupDetailAdmin'
: 'securityGroupDetail';
return getPath({ key, params: { id } });
}
render() {

89
src/components/Tables/Base/index.jsx
View File

@ -17,7 +17,6 @@ import PropTypes from 'prop-types';
import classnames from 'classnames';
import isEqual from 'react-fast-compare';
import { toJS } from 'mobx';
import { Link } from 'react-router-dom';
import { includes, get, isArray, isString } from 'lodash';
import { Button, Table, Dropdown, Input, Typography, Tooltip } from 'antd';
import MagicInput from 'components/MagicInput';
@ -39,10 +38,13 @@ import {
getStatusRender,
getRender,
getValueRenderFunc,
getNameRenderByRouter,
getNameRender,
columnRender,
} from 'utils/table';
import { getNoValue } from 'utils/index';
import { columnRender } from 'utils/render';
import { getLocalStorageItem, setLocalStorageItem } from 'utils/local-storage';
import { getLinkRender } from 'utils/route-map';
import { inject } from 'mobx-react';
import globalRootStore from 'stores/root';
import CustomColumns from './CustomColumns';
@ -50,6 +52,7 @@ import ItemActionButtons from './ItemActionButtons';
import PrimaryActionButtons from './PrimaryActionButtons';
import BatchActionButtons from './BatchActionButtons';
import Download from './Download';
import styles from './index.less';
@inject('rootStore')
@ -330,16 +333,14 @@ export default class BaseTable extends React.Component {
if (!projectId) {
return '-';
}
const url = `/identity/project-admin/detail/${projectId}`;
const link = getLinkRender({
key: 'projectDetailAdmin',
params: { id: projectId },
value: projectId,
});
return (
<>
<div>
{globalRootStore.hasAdminRole ? (
<Link to={url}>{projectId}</Link>
) : (
projectId
)}
</div>
<div>{globalRootStore.hasAdminRole ? link : projectId}</div>
<div>{value || '-'}</div>
</>
);
@ -353,63 +354,6 @@ export default class BaseTable extends React.Component {
return (value) => getNoValue(value);
};
getLinkUrl = (prefix, id) => {
if (!prefix) {
return null;
}
if (prefix[prefix.length - 1] === '/') {
return `${prefix}${id}`;
}
return `${prefix}/${id}`;
};
getNameRender = (render, column) => {
if (render) {
return render;
}
const {
linkPrefix,
dataIndex,
idKey,
linkPrefixFunc,
linkFunc,
hasNoDetail = false,
} = column;
const { rowKey } = this.props;
return (value, record) => {
const idValue = get(record, idKey || rowKey);
let url = null;
if (linkFunc) {
url = linkFunc(value, record);
} else {
const linkValue = linkPrefixFunc
? linkPrefixFunc(value, record)
: linkPrefix;
url = this.getLinkUrl(linkValue, idValue);
}
const nameValue = value || get(record, dataIndex) || '-';
if (hasNoDetail) {
return (
<div>
<div>{idValue}</div>
<div>{nameValue}</div>
</div>
);
}
if (!url && !hasNoDetail) {
return nameValue;
}
return (
<div>
<div>
<Link to={url}>{idValue}</Link>
</div>
<div>{nameValue}</div>
</div>
);
};
};
// eslint-disable-next-line no-unused-vars
getPriceRender = (render, column) => {
if (render) {
@ -469,6 +413,9 @@ export default class BaseTable extends React.Component {
tip,
isStatus,
isName,
isLink,
routeName,
linkPrefix,
isPrice,
...rest
} = column;
@ -485,8 +432,12 @@ export default class BaseTable extends React.Component {
if (dataIndex === 'project_name') {
newRender = this.getProjectRender(newRender);
}
if (dataIndex === 'name' || isName) {
newRender = this.getNameRender(newRender, column);
if ((dataIndex === 'name' && routeName) || isLink) {
const { rowKey } = this.props;
newRender = getNameRenderByRouter(newRender, column, rowKey);
}
if ((dataIndex === 'name' && linkPrefix) || isName) {
newRender = getNameRender(newRender, column);
}
if (dataIndex === 'cost' || isPrice) {
newRender = this.getPriceRender(newRender, column);

10
src/containers/Action/FormAction/index.jsx
View File

@ -13,6 +13,7 @@
// limitations under the License.
import BaseForm from 'components/Form';
import { getPath } from 'utils/route-map';
export default class FormAction extends BaseForm {
static id = 'formAction';
@ -36,4 +37,13 @@ export default class FormAction extends BaseForm {
getUrl(path, adminStr) {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
}

8
src/containers/Action/StepAction/index.jsx
View File

@ -32,12 +32,4 @@ export default class StepAction extends StepForm {
get hasConfirmStep() {
return true;
}
// get isAdminPage() {
// return this.props.isAdminPage || false;
// }
// getUrl(path, adminStr) {
// return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
// }
}

15
src/containers/BaseDetail/index.jsx
View File

@ -18,6 +18,7 @@ import Card from 'components/DetailCard';
import { toJS } from 'mobx';
import { has } from 'lodash';
import { isAdminPage } from 'utils/index';
import { getPath, getLinkRender } from 'utils/route-map';
import styles from './index.less';
export default class BaseDetail extends React.Component {
@ -86,6 +87,20 @@ export default class BaseDetail extends React.Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
getLinkRender(routeName, value, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getLinkRender({ key: realName, params, query, value });
}
fetchData = (params) => {
if (this.shouldFetchDetail && this.store.fetchDetail) {
this.store

19
src/containers/List/index.jsx
View File

@ -34,6 +34,7 @@ import { checkTimeIn } from 'utils/time';
import checkItemPolicy from 'resources/policy';
import NotFound from 'components/Cards/NotFound';
import { getTags } from 'components/MagicInput';
import { getPath, getLinkRender } from 'utils/route-map';
import styles from './index.less';
const tabOtherHeight = 326;
@ -169,6 +170,20 @@ export default class BaseList extends React.Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
getLinkRender(routeName, value, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getLinkRender({ key: realName, params, query, value });
}
get prefix() {
return this.props.match.url;
}
@ -1064,7 +1079,7 @@ export default class BaseList extends React.Component {
} catch (e) {
// eslint-disable-next-line no-console
console.log(e);
const link = this.getUrl('/base/overview');
const link = this.getRoutePath('overview');
return <NotFound title={this.name} link={link} codeError />;
}
}
@ -1155,7 +1170,7 @@ export default class BaseList extends React.Component {
render() {
if (this.endpointError) {
const link = this.getUrl('/base/overview');
const link = this.getRoutePath('overview');
return <NotFound title={this.name} link={link} endpointError />;
}
const table = this.renderTable();

17
src/containers/TabDetail/index.jsx
View File

@ -26,6 +26,7 @@ import { toJS } from 'mobx';
import checkItemPolicy from 'resources/policy';
import ItemActionButtons from 'components/Tables/Base/ItemActionButtons';
import { emptyActionConfig } from 'utils/constants';
import { getPath, getLinkRender } from 'utils/route-map';
import styles from './index.less';
export default class DetailBase extends React.Component {
@ -71,6 +72,20 @@ export default class DetailBase extends React.Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
getLinkRender(routeName, value, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getLinkRender({ key: realName, params, query, value });
}
get tabs() {
return [];
}
@ -166,7 +181,7 @@ export default class DetailBase extends React.Component {
}
get listUrl() {
return '/base/tmp';
return '';
}
get detailData() {

17
src/containers/TabList/index.jsx
View File

@ -17,6 +17,7 @@ import { parse } from 'qs';
import classnames from 'classnames';
import { Tabs } from 'antd';
import { isAdminPage } from 'utils/index';
import { getPath, getLinkRender } from 'utils/route-map';
import NotFound from 'components/Cards/NotFound';
import styles from './index.less';
@ -67,6 +68,20 @@ export default class TabList extends Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
getLinkRender(routeName, value, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getLinkRender({ key: realName, params, query, value });
}
get tabs() {
const tabs = [
{
@ -137,7 +152,7 @@ export default class TabList extends Component {
return null;
}
if (this.endpointError) {
const link = this.getUrl('/base/overview');
const link = this.getRoutePath('overview');
return <NotFound title={this.name} link={link} endpointError />;
}
// if (this.tabs.length === 1) {

12
src/layouts/Base/Menu.jsx
View File

@ -21,6 +21,7 @@ import { toJS } from 'mobx';
import classnames from 'classnames';
import logoSmall from 'asset/image/logo-small.svg';
import logoExtend from 'asset/image/logo-extend.svg';
import { getPath } from 'utils/route-map';
import styles from './index.less';
const { SubMenu } = Menu;
@ -47,6 +48,15 @@ export class LayoutMenu extends Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
get rootStore() {
return this.props.rootStore;
}
@ -217,7 +227,7 @@ export class LayoutMenu extends Component {
const { collapsed, hover } = this.state;
const isExtend = !collapsed || hover;
const imageSvg = this.getImage(isExtend);
const homeUrl = this.getUrl('/base/overview');
const homeUrl = this.getRoutePath('overview');
return (
<div
className={classnames(

30
src/layouts/Base/Right.jsx
View File

@ -20,6 +20,7 @@ import classnames from 'classnames';
import renderRoutes from 'utils/RouterConfig';
import NotFound from 'components/Cards/NotFound';
import PageLoading from 'components/PageLoading';
import { getPath } from 'utils/route-map';
import styles from './index.less';
const { Content } = Layout;
@ -59,6 +60,15 @@ class Right extends Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
checkHasTab = () => {
const { currentRoutes = [] } = this.props;
if (currentRoutes.length === 0) {
@ -123,21 +133,12 @@ class Right extends Component {
return (
<NotFound
title={t('data')}
link={this.getUrl('/base/overview')}
link={this.getRoutePath('overview')}
codeError
/>
);
}
try {
// const { currentRoutes = [] } = this.props;
// if (currentRoutes.length === 0) {
// return (
// <NotFound
// title={t('data')}
// link={this.getUrl('/base/overview')}
// />
// );
// }
const children = (
<div className={`${styles.main} ${mainBreadcrubClass} ${mainTabClass}`}>
{renderRoutes(this.routes, extraProps)}
@ -147,13 +148,8 @@ class Right extends Component {
} catch (e) {
// eslint-disable-next-line no-console
console.log(e);
return (
<NotFound
title={t('data')}
link={this.getUrl('/base/overview')}
codeError
/>
);
const path = this.getRoutePath('overview');
return <NotFound title={t('data')} link={path} codeError />;
}
};

11
src/layouts/Base/index.jsx
View File

@ -21,6 +21,7 @@ import { BellOutlined } from '@ant-design/icons';
import checkItemPolicy from 'resources/policy';
import { Layout } from 'antd';
import GlobalHeader from 'components/Layout/GlobalHeader';
import { setRouteMap, getPath } from 'utils/route-map';
import renderAdminMenu from '../admin-menu';
import renderMenu from '../menu';
import renderUserMenu from '../user-menu';
@ -100,6 +101,15 @@ export class BaseLayout extends Component {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getRouteName(routeName) {
return this.isAdminPage ? `${routeName}Admin` : routeName;
}
getRoutePath(routeName, params = {}, query = {}) {
const realName = this.getRouteName(routeName);
return getPath({ key: realName, params, query });
}
filterMenuByHidden = (menu = []) => {
if (menu.length === 0) {
return menu;
@ -208,6 +218,7 @@ export class BaseLayout extends Component {
window.location.href = '/base/overview';
}
this.routes = this.props.route.routes;
setRouteMap(this.menu);
}
renderNotice() {

197
src/layouts/admin-menu.jsx
View File

@ -32,7 +32,7 @@ const renderMenu = (t) => {
{
path: '/base/overview-admin',
name: t('Home'),
key: '/home',
key: 'overviewAdmin',
icon: <HomeOutlined />,
level: 0,
hasBreadcrumb: false,
@ -41,19 +41,20 @@ const renderMenu = (t) => {
{
path: '/compute',
name: t('Compute'),
key: '/compute',
key: 'computeAdmin',
icon: <DesktopOutlined />,
children: [
{
path: '/compute/instance-admin',
name: t('Instance'),
key: '/compute/instance-admin',
key: 'instanceAdmin',
level: 1,
children: [
{
path: /^\/compute\/instance-admin\/detail\/.[^/]+$/,
name: t('Instance Detail'),
key: 'instance-detail',
key: 'instanceDetailAdmin',
routePath: '/compute/instance-admin/detail/:id',
level: 2,
},
],
@ -61,19 +62,20 @@ const renderMenu = (t) => {
{
path: '/compute/flavor-admin',
name: t('Flavor'),
key: '/compute/flavor',
key: 'flavorAdmin',
level: 1,
children: [
{
path: '/compute/flavor-admin/create',
name: t('Create Flavor'),
key: 'flavor-create',
key: 'flavorCreateAdmin',
level: 2,
},
{
path: /^\/compute\/flavor-admin\/detail\/[^/]+$/,
name: t('Flavor Detail'),
key: 'flavor-detail',
key: 'flavorDetailAdmin',
routePath: '/compute/flavor-admin/detail/:id',
level: 2,
},
],
@ -81,13 +83,14 @@ const renderMenu = (t) => {
{
path: '/compute/server-group-admin',
name: t('Server Group'),
key: '/compute/server-group-admin',
key: 'serverGroupAdmin',
level: 1,
children: [
{
path: /^\/compute\/server-group-admin\/detail\/.[^/]+$/,
name: t('Server Group Detail'),
key: 'server-group-detail',
key: 'serverGroupDetailAdmin',
routePath: '/compute/server-group-admin/detail/:id',
level: 2,
},
],
@ -95,19 +98,20 @@ const renderMenu = (t) => {
{
path: '/compute/image-admin',
name: t('Image'),
key: '/compute/image-admin',
key: 'imageAdmin',
level: 1,
children: [
{
path: /^\/compute\/image-admin\/detail\/.[^/]+$/,
name: t('Image Detail'),
key: 'image-detail',
key: 'imageDetailAdmin',
routePath: '/compute/image-admin/detail/:id',
level: 2,
},
{
path: '/compute/image-admin/create',
name: t('Create Image'),
key: 'image-create',
key: 'imageCreateAdmin',
level: 2,
},
],
@ -115,13 +119,14 @@ const renderMenu = (t) => {
{
path: '/compute/hypervisors-admin',
name: t('Hypervisors'),
key: '/compute/hypervisors',
key: 'hypervisorAdmin',
level: 1,
children: [
{
path: /^\/compute\/hypervisors-admin\/detail\/.[^/]+$/,
name: t('Hypervisor Detail'),
key: 'hypervisor-detail',
key: 'hypervisorDetailAdmin',
routePath: '/compute/hypervisors-admin/detail/:id',
level: 2,
},
],
@ -129,32 +134,34 @@ const renderMenu = (t) => {
{
path: '/compute/aggregates-admin',
name: t('Host Aggregates'),
key: '/compute/aggregates',
key: 'aggregateAdmin',
level: 1,
children: [],
},
{
path: '/compute/baremetal-node-admin',
name: t('Bare Metal Setting'),
key: '/compute/baremetal-node',
key: 'baremetalNodeAdmin',
level: 1,
children: [
{
path: /^\/compute\/baremetal-node-admin\/detail\/.[^/]+$/,
name: t('Bare Metal Node Detail'),
key: 'baremetal-node-detail',
key: 'baremetaNodeDetailAdmin',
routePath: '/compute/baremetal-node-admin/detail/:id',
level: 2,
},
{
path: /^\/compute\/baremetal-node-admin\/create$/,
name: t('Create Bare Metal Node'),
key: 'baremetal-node-create',
key: 'baremetalNodeCreateAdmin',
level: 2,
},
{
path: /^\/compute\/baremetal-node-admin\/edit\/.[^/]+$/,
name: t('Bare Metal Node Edit'),
key: 'baremetal-node-edit',
key: 'baremetalNodeEditAdmin',
routePath: '/compute/baremetal-node-admin/detail/:id',
level: 2,
},
],
@ -164,75 +171,80 @@ const renderMenu = (t) => {
{
path: '/storage',
name: t('Storage'),
key: '/storage',
key: 'storageAdmin',
icon: <DatabaseOutlined />,
children: [
{
path: '/storage/volume-admin',
name: t('Volume'),
key: '/storage/volume',
key: 'volumeAdmin',
level: 1,
children: [
{
path: /^\/storage\/volume-admin\/detail\/.[^/]+$/,
name: t('Volume Detail'),
key: 'volume-detail',
key: 'volumeDetailAdmin',
level: 2,
routePath: '/storage/volume-admin/detail/:id',
},
],
},
{
path: '/storage/backup-admin',
name: t('Backups'),
key: '/storage/backup',
key: 'backupAdmin',
level: 1,
children: [
{
path: /^\/storage\/backup-admin\/detail\/.[^/]+$/,
name: t('Backup Detail'),
key: 'backup-detail',
key: 'backupDetailAdmin',
level: 2,
routePath: '/storage/backup-admin/detail/:id',
},
],
},
{
path: '/storage/snapshot-admin',
name: t('Volume Snapshot'),
key: '/storage/snapshot',
key: 'snapshotAdmin',
level: 1,
children: [
{
path: /^\/storage\/snapshot-admin\/detail\/.[^/]+$/,
name: t('Snapshot Detail'),
key: 'snapshot-detail',
key: 'snapshotDetailAdmin',
level: 2,
routePath: '/storage/snapshot-admin/detail/:id',
},
],
},
{
path: '/storage/volume-type-admin',
name: t('Volume Type'),
key: '/storage/volume-type',
key: 'volumeTypeAdmin',
level: 1,
children: [
{
path: /^\/storage\/volume-type-admin\/detail\/.[^/]+$/,
name: t('Volume Type Detail'),
key: 'volume-type-detail',
key: 'volumeTypeDetailAdmin',
level: 2,
routePath: '/storage/volume-type-admin/detail/:id',
},
{
path: /^\/storage\/volume-type-admin\/qos\/detail\/.[^/]+$/,
name: t('QoS Detail'),
key: 'volume-type-qos-detail',
key: 'volumeTypeQosDetailAdmin',
level: 2,
routePath: '/storage/volume-type-admin/qos/detail/:id',
},
],
},
{
path: '/storage/storage-admin',
name: t('Storage Backend'),
key: '/storage/storage',
key: 'storageBackendAdmin',
level: 1,
children: [],
},
@ -241,130 +253,141 @@ const renderMenu = (t) => {
{
path: '/network',
name: t('Network'),
key: '/network',
key: '/networkAdmin',
icon: <GlobalOutlined />,
children: [
{
path: '/network/networks-admin',
name: t('Networks'),
key: '/network/networks',
key: 'networkAdmin',
level: 1,
children: [
{
path: /^\/network\/networks-admin\/detail\/.[^/]+$/,
name: t('Network Detail'),
key: 'network_detail',
key: 'networkDetailAdmin',
level: 2,
routePath: '/network/networks-admin/detail/:id',
},
],
},
{
path: '/network/virtual_adapter_admin',
name: t('Virtual Adapter'),
key: '/network/virtual_adapter_admin',
key: 'virtualAdapterAdmin',
level: 1,
children: [
{
path: /^\/network\/virtual_adapter_admin\/detail\/.[^/]+$/,
name: t('Virtual Adapter Detail'),
key: 'virtual_adapter-detail',
key: 'virtualAdapterDetailAdmin',
level: 2,
routePath: '/network/virtual_adapter_admin/detail/:id',
},
],
},
{
path: '/network/qos-policy-admin',
name: t('QoS Policy'),
key: '/network/qos-policy-admin',
key: 'networkQosAdmin',
level: 1,
children: [
{
path: /^\/network\/qos-policy-admin\/detail\/.[^/]+$/,
name: t('QoS Policy Detail'),
key: 'qos-policy-detail',
key: 'networkQosDetailAdmin',
level: 2,
routePath: '/network/qos-policy-admin/detail/:id',
},
],
},
{
path: '/network/router-admin',
name: t('Routers'),
key: '/network/router-admin',
key: 'routerAdmin',
level: 1,
children: [
{
path: /^\/network\/router-admin\/detail\/.[^/]+$/,
name: t('Router Detail'),
key: 'router-detail',
key: 'routerDetailAdmin',
level: 2,
routePath: '/network/router-admin/detail/:id',
},
{
path: /^\/network\/router-admin\/.[^/]+\/port\/.[^/]+$/,
name: t('Port Detail'),
key: 'port-detail',
key: 'routerPortDetailAdmin',
level: 2,
routePath: '/network/router-admin/:routerId/port/:id',
},
],
},
{
path: '/network/floatingip-admin',
name: t('Floating IPs'),
key: '/network/floatingip-admin',
key: 'fipAdmin',
level: 1,
children: [
{
path: /^\/network\/floatingip-admin\/detail\/.[^/]+$/,
name: t('Floating Ip Detail'),
key: 'floatingip-detail',
key: 'fipDetailAdmin',
level: 2,
routePath: '/network/floatingip-admin/detail/:id',
},
],
},
{
path: '/network/load-balancers-admin',
name: t('Load Balancers'),
key: '/network/load-balancers-admin',
key: 'lbAdmin',
level: 1,
children: [
{
path: /^\/network\/load-balancers-admin\/detail\/.[^/]+$/,
name: t('Load Balancer Detail'),
key: 'load-balancer-detail',
key: 'lbDetailAdmin',
level: 2,
routePath: '/network/load-balancers-admin/detail/:id',
},
{
path: /^\/network\/load-balancers-admin\/.[^/]+\/listener\/.[^/]+$/,
name: t('Listener Detail'),
key: 'listener-detail',
key: 'lbListenerDetailAdmin',
level: 2,
routePath:
'/network/load-balancers-admin/:loadBalancerId/listener/:id',
},
],
},
{
path: '/network/vpn-admin',
name: t('VPN'),
key: '/network/vpn-admin',
key: 'vpnAdmin',
level: 1,
children: [
{
path: /^\/network\/ipsec-site-connection-admin\/detail\/.[^/]+$/,
name: t('IPsec site connection Detail'),
key: 'ipsec-site-connection-detail',
key: 'ipsecDetailAdmin',
level: 2,
routePath: '/network/ipsec-site-connection-admin/detail/:id',
},
],
},
{
path: '/network/security-group-admin',
name: t('Security Groups'),
key: '/network/security-group',
key: 'securityGroupAdmin',
level: 1,
children: [
{
path: /^\/network\/security-group-admin\/detail\/.[^/]+$/,
name: t('Security Group Detail'),
key: 'security-group-detail',
key: 'securityGroupDetailAdmin',
level: 2,
routePath: '/network/security-group-admin/detail/:id',
},
],
},
@ -379,118 +402,127 @@ const renderMenu = (t) => {
{
path: '/identity/domain-admin',
name: t('Domains'),
key: '/identity/domain',
key: 'domainAdmin',
level: 1,
children: [
{
path: '/identity/domain-admin/create',
name: t('Create Domain'),
key: 'domain-create',
key: 'domainCreateAdmin',
level: 2,
},
{
path: /^\/identity\/domain-admin\/edit\/.[^/]+$/,
name: t('Domain Edit'),
key: 'domain-edit',
key: 'domainEditAdmin',
level: 2,
routePath: '/identity/domain-admin/edit/:id',
},
{
path: /^\/identity\/domain-admin\/detail\/.[^/]+$/,
name: t('Domain Detail'),
key: 'domain-detail',
key: 'domainDetailAdmin',
level: 2,
routePath: '/identity/domain-admin/detail/:id',
},
],
},
{
path: '/identity/project-admin',
name: t('Projects'),
key: '/identity/project',
key: 'projectAdmin',
level: 1,
children: [
{
path: /^\/identity\/project-admin\/detail\/.[^/]+$/,
name: t('Project Detail'),
key: 'project-detail',
key: 'projectDetailAdmin',
level: 2,
routePath: '/identity/project-admin/detail/:id',
},
{
path: '/identity/project-admin/create',
name: t('Create Project'),
key: 'project-create',
key: 'projectCreateAdmin',
level: 2,
},
{
path: /^\/identity\/project-admin\/edit\/.[^/]+$/,
name: t('Edit Project'),
key: 'project-edit',
key: 'projectEditAdmin',
level: 2,
routePath: '/identity/project-admin/edit/:id',
},
],
},
{
path: '/identity/user-admin',
name: t('Users'),
key: '/identity/user',
key: 'userAdmin',
level: 1,
children: [
{
path: /^\/identity\/user-admin\/detail\/.[^/]+$/,
name: t('User Detail'),
key: 'user-detail',
key: 'userDetailAdmin',
level: 2,
routePath: '/identity/user-admin/detail/:id',
},
{
path: '/identity/user-admin/create',
name: t('Create User'),
key: 'user-create',
key: 'userCreateAdmin',
level: 2,
},
{
path: /^\/identity\/user-admin\/edit\/.[^/]+$/,
name: t('User Edit'),
key: 'user-edit',
key: 'userEditAdmin',
level: 2,
routePath: '/identity/user-admin/edit/:id',
},
],
},
{
path: '/identity/user-group-admin',
name: t('User Groups'),
key: '/identity/user-group',
key: 'userGroupAdmin',
level: 1,
children: [
{
path: /^\/identity\/user-group-admin\/detail\/.[^/]+$/,
name: t('User Group Detail'),
key: 'project-detail',
key: 'userGroupDetailAdmin',
level: 2,
routePath: '/identity/user-group-admin/detail/:id',
},
{
path: '/identity/user-group-admin/create',
name: t('Create User Group'),
key: 'user-group-create',
key: 'userGroupCreateAdmin',
level: 2,
},
{
path: /^\/identity\/user-group-admin\/edit\/.[^/]+$/,
name: t('Edit User Group'),
key: 'user-group-edit',
key: 'userGroupEditAdmin',
level: 2,
routePath: '/identity/user-group-admin/edit/:id',
},
],
},
{
path: '/identity/role-admin',
name: t('Roles'),
key: '/identity/role-admin',
key: 'roleAdmin',
level: 1,
children: [
{
path: /^\/identity\/role-admin\/detail\/.[^/]+$/,
name: t('Role Detail'),
key: 'role-detail',
key: 'roleDetailAdmin',
level: 2,
routePath: '/identity/role-admin/detail/:id',
},
],
},
@ -505,14 +537,15 @@ const renderMenu = (t) => {
// {
// path: '/management/recycle-bin-admin',
// name: t('Recycle Bin'),
// key: '/management/recycle-bin-admin',
// key: 'recycleBinAdmin',
// level: 1,
// children: [
// {
// path: /^\/management\/recycle-bin-admin\/detail\/.[^/]+$/,
// name: t('Instance Detail'),
// key: 'recycle-bin-detail',
// key: 'recycleBinDetailAdmin',
// level: 2,
// routePath: '/management/recycle-bin-admin/detail/:id',
// },
// ],
// },
@ -521,32 +554,34 @@ const renderMenu = (t) => {
{
path: '/heat',
name: t('Orchestration'),
key: '/heat',
key: 'heatAdmin',
icon: <AppstoreOutlined />,
children: [
{
path: '/heat/stack-admin',
name: t('Stacks'),
key: '/heat/stack-admin',
key: 'stackAdmin',
level: 1,
children: [
{
path: /^\/heat\/stack-admin\/detail\/.[^/]+\/.[^/]+$/,
name: t('Stack Detail'),
key: 'stack-detail',
key: 'stackDetailAdmin',
level: 2,
routePath: '/heat/stack-admin/detail/:id/:name',
},
{
path: '/heat/stack-admin/create',
name: t('Create Stack'),
key: 'stack-create',
key: 'stackCreateAdmin',
level: 2,
},
{
path: /^\/heat\/stack-admin\/edit\/.[^/]+\/.[^/]+$/,
name: t('Update Template'),
key: 'stack-edit',
key: 'stackEditAdmin',
level: 2,
routePath: '/heat/stack-admin/edit/:id/:name',
},
],
},
@ -555,40 +590,42 @@ const renderMenu = (t) => {
{
path: '/configuration-admin',
name: t('Global Setting'),
key: '/configuration-admin',
key: 'configurationAdmin',
icon: <SettingOutlined />,
children: [
{
path: '/configuration-admin/info',
name: t('System Info'),
key: '/configuration-admin/info',
key: 'systemInfoAdmin',
level: 1,
children: [
{
path: /^\/configuration-admin\/neutron\/detail\/.[^/]+$/,
name: t('Neutron Agent Detail'),
key: 'neutron-detail',
key: 'neutronAgentDetailAdmin',
level: 2,
routePath: '/configuration-admin/neutron/detail/:id',
},
],
},
{
path: '/configuration-admin/setting',
name: t('System Config'),
key: '/configuration-admin/setting',
key: 'settingAdmin',
level: 1,
},
{
path: '/configuration-admin/metadata',
name: t('Metadata Definitions'),
key: '/configuration-admin/metadata',
key: 'metadataAdmin',
level: 1,
children: [
{
path: /^\/configuration-admin\/metadata\/detail\/.[^/]+$/,
name: t('Metadata Detail'),
key: 'metadata-detail',
key: 'metadataDetailAdmin',
level: 2,
routePath: '/configuration-admin/metadata/detail/:id',
},
],
},

121
src/layouts/menu.jsx
View File

@ -30,7 +30,7 @@ const renderMenu = (t) => {
{
path: '/base/overview',
name: t('Home'),
key: '/home',
key: 'overview',
icon: <HomeOutlined />,
level: 0,
hasBreadcrumb: false,
@ -39,31 +39,32 @@ const renderMenu = (t) => {
{
path: '/compute',
name: t('Compute'),
key: '/compute',
key: 'compute',
icon: <DesktopOutlined />,
children: [
{
path: '/compute/instance',
name: t('Instance'),
key: '/compute/instance',
key: 'instance',
level: 1,
children: [
{
path: /^\/compute\/instance\/detail\/.[^/]+$/,
name: t('Instance Detail'),
key: 'instance-detail',
key: 'instanceDetail',
level: 2,
routePath: '/compute/instance/detail/:id',
},
{
path: '/compute/instance/create',
name: t('Create Instance'),
key: 'instance-create',
key: 'instanceCreate',
level: 2,
},
{
path: '/compute/ironic-instance/create',
name: t('Create Ironic Instance'),
key: 'ironic-instance-create',
key: 'ironicCreate',
level: 2,
},
],
@ -71,47 +72,50 @@ const renderMenu = (t) => {
{
path: '/compute/flavor',
name: t('Flavor'),
key: '/compute/flavor',
key: 'flavor',
level: 1,
children: [
{
path: /^\/compute\/flavor\/detail\/.[^/]+$/,
name: t('Flavor Detail'),
key: 'flavor-detail',
key: 'flavorDetail',
level: 2,
routePath: '/compute/flavor/detail/:id',
},
],
},
{
path: '/compute/server-group',
name: t('Server Group'),
key: '/compute/server-group',
key: 'serverGroup',
level: 1,
children: [
{
path: /^\/compute\/server-group\/detail\/.[^/]+$/,
name: t('Server Group Detail'),
key: 'server-group-detail',
key: 'serverGroupDetail',
level: 2,
routePath: '/compute/server-group/detail/:id',
},
],
},
{
path: '/compute/image',
name: t('Image'),
key: '/compute/image',
key: 'image',
level: 1,
children: [
{
path: /^\/compute\/image\/detail\/.[^/]+$/,
name: t('Image Detail'),
key: 'image-detail',
key: 'imageDetail',
level: 2,
routePath: '/compute/image/detail/:id',
},
{
path: '/compute/image/create',
name: t('Create Image'),
key: 'image-create',
key: 'imageCreate',
level: 2,
},
],
@ -119,14 +123,15 @@ const renderMenu = (t) => {
{
path: '/compute/keypair',
name: t('Key Pairs'),
key: '/compute/keypair',
key: 'keypair',
level: 1,
children: [
{
path: /^\/compute\/keypair\/detail\/.[^/]*$/,
name: t('Keypair Detail'),
key: 'keypair-detail',
key: 'keypairDetail',
level: 2,
routePath: '/compute/keypair/detail/:id',
},
],
},
@ -135,54 +140,57 @@ const renderMenu = (t) => {
{
path: '/storage',
name: t('Storage'),
key: '/storage',
key: 'storage',
icon: <DatabaseOutlined />,
children: [
{
path: '/storage/volume',
name: t('Volume'),
key: '/storage/volume',
key: 'volume',
level: 1,
children: [
{
path: '/storage/volume/create',
name: t('Create Volume'),
key: 'volume-create',
key: 'volumeCreate',
level: 2,
},
{
path: /^\/storage\/volume\/detail\/.[^/]+$/,
name: t('Volume Detail'),
key: 'volume-detail',
key: 'volumeDetail',
level: 2,
routePath: '/storage/volume/detail/:id',
},
],
},
{
path: '/storage/backup',
name: t('Backups'),
key: '/storage/backup',
key: 'backup',
level: 1,
children: [
{
path: /^\/storage\/backup\/detail\/.[^/]+$/,
name: t('Backup Detail'),
key: 'backup-detail',
key: 'backupDetail',
level: 2,
routePath: '/storage/backup/detail/:id',
},
],
},
{
path: '/storage/snapshot',
name: t('Volume Snapshot'),
key: '/storage/snapshot',
key: 'snapshot',
level: 1,
children: [
{
path: /^\/storage\/snapshot\/detail\/.[^/]+$/,
name: t('Snapshot Detail'),
key: 'snapshot-detail',
key: 'snapshotDetail',
level: 2,
routePath: '/storage/snapshot/detail/:id',
},
],
},
@ -197,137 +205,147 @@ const renderMenu = (t) => {
{
path: '/network/networks',
name: t('Networks'),
key: '/network/networks',
key: 'network',
level: 1,
children: [
{
path: /^\/network\/networks\/detail\/.[^/]+$/,
name: t('Network Detail'),
key: 'network_detail',
key: 'networkDetail',
level: 2,
routePath: '/network/networks/detail/:id',
},
],
},
{
path: '/network/virtual_adapter',
name: t('Virtual Adapter'),
key: '/network/virtual_adapter',
key: 'virtualAdapter',
level: 1,
children: [
{
path: /^\/network\/virtual_adapter\/detail\/.[^/]+$/,
name: t('Virtual Adapter Detail'),
key: 'virtual_adapter-detail',
key: 'virtualAdapterDetail',
level: 2,
routePath: '/network/virtual_adapter/detail/:id',
},
],
},
{
path: '/network/qos-policy',
name: t('QoS Policy'),
key: '/network/qos-policy',
key: 'networkQos',
level: 1,
children: [
{
path: /^\/network\/qos-policy\/detail\/.[^/]+$/,
name: t('QoS Policy Detail'),
key: 'qos-policy-detail',
key: 'networkQosDetail',
level: 2,
routePath: '/network/qos-policy/detail/:id',
},
],
},
{
path: '/network/router',
name: t('Routers'),
key: '/network/router',
key: 'router',
level: 1,
children: [
{
path: /^\/network\/router\/detail\/.[^/]+$/,
name: t('Router Detail'),
key: 'router-detail',
key: 'routerDetail',
level: 2,
routePath: '/network/router/detail/:id',
},
{
path: /^\/network\/router\/.[^/]+\/port\/.[^/]+$/,
name: t('Port Detail'),
key: 'port-detail',
key: 'routerPortDetail',
level: 2,
routePath: '/network/router/:routerId/port/:id',
},
],
},
{
path: '/network/floatingip',
name: t('Floating IPs'),
key: '/network/floatingip',
key: 'floatingip',
level: 1,
children: [
{
path: /^\/network\/floatingip\/detail\/.[^/]+$/,
name: t('Floating Ip Detail'),
key: 'floatingip-detail',
key: 'fipDetail',
level: 2,
routePath: '/network/floatingip/detail/:id',
},
],
},
{
path: '/network/topo',
name: t('Topology'),
key: '/network/topo',
key: 'networkTopo',
level: 1,
children: [],
},
{
path: '/network/load-balancers',
name: t('Load Balancers'),
key: '/network/load-balancers',
key: 'lb',
level: 1,
children: [
{
path: '/network/load-balancers/create',
name: t('Create Loadbalancer'),
key: 'load-balancer-create',
key: 'lbCreate',
level: 2,
},
{
path: /^\/network\/load-balancers\/detail\/.[^/]+$/,
name: t('Load Balancer Detail'),
key: 'load-balancer-detail',
key: 'lbDetail',
level: 2,
routePath: '/network/load-balancers/detail/:id',
},
{
path: /^\/network\/load-balancers\/.[^/]+\/listener\/.[^/]+$/,
name: t('Listener Detail'),
key: 'listener-detail',
key: 'lbListenerDetail',
level: 2,
routePath: '/network/load-balancers/:loadBalancerId/listener/:id',
},
],
},
{
path: '/network/vpn',
name: t('VPN'),
key: '/network/vpn',
key: 'vpn',
level: 1,
children: [
{
path: /^\/network\/ipsec-site-connection\/detail\/.[^/]+$/,
name: t('IPsec site connection Detail'),
key: 'ipsec-site-connection-detail',
key: 'ipsecDetail',
level: 2,
routePath: '/network/ipsec-site-connection/detail/:id',
},
],
},
{
path: '/network/security-group',
name: t('Security Groups'),
key: '/network/security-group',
key: 'securityGroup',
level: 1,
children: [
{
path: /^\/network\/security-group\/detail\/.[^/]+$/,
name: t('Security Group Detail'),
key: 'security-group-detail',
key: 'securityGroupDetail',
level: 2,
routePath: '/network/security-group/detail/:id',
},
],
},
@ -342,14 +360,15 @@ const renderMenu = (t) => {
// {
// path: '/management/recycle-bin',
// name: t('Recycle Bin'),
// key: '/management/recycle-bin',
// key: 'recycleBin',
// level: 1,
// children: [
// {
// path: /^\/management\/recycle-bin\/detail\/.[^/]+$/,
// name: t('Instance Detail'),
// key: 'recycle-bin-detail',
// key: 'recycleBinDetail',
// level: 2,
// routePath: '/management/recycle-bin/detail/:id',
// },
// ],
// },
@ -358,32 +377,34 @@ const renderMenu = (t) => {
{
path: '/heat',
name: t('Orchestration'),
key: '/heat',
key: 'heat',
icon: <AppstoreOutlined />,
children: [
{
path: '/heat/stack',
name: t('Stacks'),
key: '/heat/stack',
key: 'stack',
level: 1,
children: [
{
path: /^\/heat\/stack\/detail\/.[^/]+\/.[^/]+$/,
name: t('Stack Detail'),
key: 'stack-detail',
key: 'stackDetail',
level: 2,
routePath: '/heat/stack/detail/:id/:name',
},
{
path: '/heat/stack/create',
name: t('Create Stack'),
key: 'stack-create',
key: 'stackCreate',
level: 2,
},
{
path: /^\/heat\/stack\/edit\/.[^/]+\/.[^/]+$/,
name: t('Update Template'),
key: 'stack-edit',
key: 'stackEdit',
level: 2,
routePath: '/heat/stack/edit/:id/:name',
},
],
},

2
src/pages/compute/containers/BareMetalNode/Detail/index.jsx
View File

@ -34,7 +34,7 @@ export default class Detail extends Base {
}
get listUrl() {
return '/compute/baremetal-node-admin';
return this.getRoutePath('baremetalNode');
}
get actionConfigs() {

2
src/pages/compute/containers/BareMetalNode/actions/Create/index.jsx
View File

@ -42,7 +42,7 @@ export default class Create extends StepAction {
}
get listUrl() {
return '/compute/baremetal-node-admin';
return this.getRoutePath('baremetalNode');
}
get name() {

2
src/pages/compute/containers/BareMetalNode/actions/Edit.jsx
View File

@ -27,7 +27,7 @@ export default class Edit extends Create {
static path = (item) => `/compute/baremetal-node-admin/edit/${item.uuid}`;
get listUrl() {
return '/compute/baremetal-node-admin';
return this.getRoutePath('baremetalNode');
}
get name() {

3
src/pages/compute/containers/BareMetalNode/index.jsx
View File

@ -54,8 +54,7 @@ export default class BareMetalNode extends Base {
{
title: t('Node ID/Name'),
dataIndex: 'name',
idKey: 'uuid',
linkPrefix: '/compute/baremetal-node-admin/detail',
routerName: 'baremetalNodeDetail',
},
{
title: t('Ironic Instance Name'),

2
src/pages/compute/containers/Flavor/Detail/index.jsx
View File

@ -32,7 +32,7 @@ export class Detail extends Base {
}
get listUrl() {
return this.getUrl('/compute/flavor');
return this.getRoutePath('flavor');
}
get actionConfigs() {

8
src/pages/compute/containers/Flavor/actions/StepCreate/index.jsx
View File

@ -50,10 +50,8 @@ class StepCreate extends StepAction {
get listUrl() {
const { architecture } = this.values || {};
if (architecture) {
return `/compute/flavor-admin?tab=${architecture}`;
}
return `/compute/flavor-admin?tab=${this.tab}`;
const tab = architecture || this.tab;
return this.getRoutePath('flavor', null, { tab });
}
get name() {
@ -126,7 +124,7 @@ class StepCreate extends StepAction {
ram: memoryGb * 1024,
disk: 0,
};
const isPublic = accessType === 'public'
const isPublic = accessType === 'public';
body['os-flavor-access:is_public'] = isPublic;
if (categoryHasEphemeral) {
body['OS-FLV-EXT-DATA:ephemeral'] = ephemeral;

2
src/pages/compute/containers/Hypervisors/Hypervisor/Detail/index.jsx
View File

@ -29,7 +29,7 @@ export class HypervisorDetail extends Base {
}
get listUrl() {
return '/compute/hypervisors-admin';
return this.getRoutePath('hypervisor');
}
get detailInfos() {

4
src/pages/compute/containers/Hypervisors/Hypervisor/index.jsx
View File

@ -47,8 +47,8 @@ export class Hypervisors extends Base {
columns[0] = {
title: t('ID/Name'),
dataIndex: 'hypervisor_hostname',
linkPrefix: '/compute/hypervisors-admin/detail',
isName: true,
routeName: 'hypervisorDetailAdmin',
isLink: true,
};
return columns;
};

17
src/pages/compute/containers/Image/Detail/BaseDetail.jsx
View File

@ -12,13 +12,11 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import React from 'react';
import { toJS } from 'mobx';
import { inject, observer } from 'mobx-react';
import { imageProperties, imageVisibility, imageOS } from 'resources/image';
import Base from 'containers/BaseDetail';
import { isObject, isArray } from 'lodash';
import { Link } from 'react-router-dom';
export class BaseDetail extends Base {
get isImageDetail() {
@ -122,15 +120,14 @@ export class BaseDetail extends Base {
return '-';
}
if (value.server_name) {
return (
<Link
to={`${this.getUrl('/compute/instance')}/detail/${
value.server_id
}?tab=snapshots`}
>
{value.server_name}
</Link>
const { server_id, server_name } = value;
const link = this.getLinkRender(
'instanceDetail',
server_name,
{ id: server_id },
{ tab: 'snapshots' }
);
return link;
}
return value.server_id;
},

2
src/pages/compute/containers/Image/Detail/index.jsx
View File

@ -34,7 +34,7 @@ export class ImageDetail extends Base {
}
get listUrl() {
return this.getUrl('/compute/image');
return this.getRoutePath('image');
}
get actionConfigs() {

2
src/pages/compute/containers/Image/Image.jsx
View File

@ -120,7 +120,7 @@ export class Image extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/compute/${this.getUrl('image')}/detail`,
routeName: this.getRouteName('imageDetail'),
},
{
title: t('Project ID/Name'),

2
src/pages/compute/containers/Image/actions/Create.jsx
View File

@ -46,7 +46,7 @@ export class CreateForm extends FormAction {
};
get listUrl() {
return this.getUrl('/compute/image');
return this.getRoutePath('image');
}
get name() {

2
src/pages/compute/containers/Instance/Detail/BaseDetail/index.jsx
View File

@ -146,7 +146,7 @@ export class BaseDetail extends Base {
get imageCard() {
const item = this.detailData.itemInList || {};
const { image, image_name } = item;
const url = `${this.getUrl('/compute/image')}/detail/${image}`;
const url = this.getRoutePath('imageDetail', { id: image });
const options = [
{
label: t('Name'),

10
src/pages/compute/containers/Instance/Detail/SecurityGroup/index.jsx
View File

@ -34,6 +34,7 @@ import { CaretRightOutlined } from '@ant-design/icons';
import ItemActionButtons from 'components/Tables/Base/ItemActionButtons';
import { getSelfColumns } from 'resources/security-group-rule';
import { isAdminPage } from 'utils/index';
import { getPath } from 'utils/route-map';
import styles from './index.less';
import Detach from './action/Detach';
import ManageSecurityGroup from './action/ManageSecurityGroup';
@ -68,12 +69,11 @@ export class SecurityGroup extends React.Component {
return !this.isAdminPage;
}
getUrl(path, adminStr) {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getDetailUrl(id) {
return `${this.getUrl('/network/security-group')}/detail/${id}`;
const key = this.isAdminPage
? 'securityGroupDetailAdmin'
: 'securityGroupDetail';
return getPath({ key, params: { id } });
}
actionCallback = async (first) => {

9
src/pages/compute/containers/Instance/Detail/index.jsx
View File

@ -46,9 +46,9 @@ export class InstanceDetail extends Base {
get listUrl() {
if (this.isRecycleBinDetail) {
return this.getUrl('/management/recycle-bin');
return this.getRoutePath('recycleBin');
}
return this.getUrl('/compute/instance');
return this.getRoutePath('instance');
}
get actionConfigs() {
@ -63,9 +63,8 @@ export class InstanceDetail extends Base {
get detailData() {
const { id, status } = this.store.detail;
if (id && status === 'soft_deleted' && !this.isRecycleBinDetail) {
this.routing.push(
`${this.getUrl('/management/recycle-bin')}/detail/${id}`
);
const path = this.getRoutePath('recycleBinDetail', { id });
this.routing.push(path);
}
return toJS(this.store.detail) || {};
}

8
src/pages/compute/containers/Instance/actions/CreateIronic/index.jsx
View File

@ -88,15 +88,15 @@ export class CreateIronic extends StepAction {
get listUrl() {
const { image, volume, servergroup } = this.locationParams;
if (image) {
return '/compute/image';
return this.getRoutePath('image');
}
if (volume) {
return '/storage/volume';
return this.getRoutePath('volume');
}
if (servergroup) {
return `/compute/server-group/detail/${servergroup}`;
return this.getRoutePath('serverGroupDetail', { id: servergroup });
}
return '/compute/instance';
return this.getRoutePath('instance');
}
get checkEndpoint() {

8
src/pages/compute/containers/Instance/actions/StepCreate/index.jsx
View File

@ -83,15 +83,15 @@ export class StepCreate extends StepAction {
get listUrl() {
const { image, volume, servergroup } = this.locationParams;
if (image) {
return '/compute/image';
return this.getRoutePath('image');
}
if (volume) {
return '/storage/volume';
return this.getRoutePath('volume');
}
if (servergroup) {
return `/compute/server-group/detail/${servergroup}`;
return this.getRoutePath('serverGroupDetail', { id: servergroup });
}
return '/compute/instance';
return this.getRoutePath('instance');
}
get hasConfirmStep() {

2
src/pages/compute/containers/Instance/index.jsx
View File

@ -131,7 +131,7 @@ export class Instance extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/compute/${this.getUrl('instance')}/detail`,
routeName: this.getRouteName('instanceDetail'),
sortKey: 'display_name',
},
{

2
src/pages/compute/containers/Keypair/Detail/index.jsx
View File

@ -30,7 +30,7 @@ export default class KeypairDetail extends Base {
}
get listUrl() {
return '/compute/keypair';
return this.getRoutePath('keypair');
}
get actionConfigs() {

12
src/pages/compute/containers/Keypair/index.jsx
View File

@ -12,11 +12,9 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import React from 'react';
import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import keypairStore from 'stores/nova/keypair';
import { Link } from 'react-router-dom';
import actionConfigs from './actions';
@inject('rootStore')
@ -50,14 +48,8 @@ export default class Keypair extends Base {
{
title: t('Name'),
dataIndex: 'name',
render: (name, record) => {
if (name) {
return (
<Link to={`/compute/keypair/detail/${record.name}`}>{name}</Link>
);
}
return '-';
},
idKey: 'name',
routeName: this.getRouteName('keypairDetail'),
},
{
title: t('Fingerprint'),

2
src/pages/compute/containers/ServerGroup/Detail/index.jsx
View File

@ -31,7 +31,7 @@ export default class ServerGroupDetail extends Base {
}
get listUrl() {
return this.getUrl('/compute/server-group');
return this.getRoutePath('serverGroup');
}
get actionConfigs() {

2
src/pages/compute/containers/ServerGroup/index.jsx
View File

@ -44,7 +44,7 @@ export default class ServerGroup extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/compute/${this.getUrl('server-group')}/detail`,
routeName: this.getRouteName('serverGroupDetail'),
},
{
title: t('Project ID/Name'),

2
src/pages/configuration/containers/Metadata/Detail/index.jsx
View File

@ -30,7 +30,7 @@ export default class MetadataDetail extends Base {
}
get listUrl() {
return '/configuration-admin/metadata';
return this.getRoutePath('metadata');
}
get actionConfigs() {

2
src/pages/configuration/containers/SystemInfo/NeutronAgent/Detail/index.jsx
View File

@ -36,7 +36,7 @@ export default class KeypairDetail extends Base {
}
get listUrl() {
return '/configuration-admin/info?tab=neutronAgent';
return this.getRoutePath('systemInfo', null, { tab: 'neutronAgent' });
}
get actionConfigs() {

4
src/pages/configuration/containers/SystemInfo/NeutronAgent/index.jsx
View File

@ -48,8 +48,8 @@ export default class NeutronAgent extends Base {
{
title: t('ID/Name'),
dataIndex: 'binary',
isName: true,
linkPrefix: '/configuration-admin/neutron/detail',
isLink: true,
routeName: 'neutronAgentDetailAdmin',
},
{
title: t('Type'),

91
src/pages/heat/containers/Stack/Detail/Resource.jsx
View File

@ -12,12 +12,10 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import React from 'react';
import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import { StackResourceStore } from 'stores/heat/resource';
import { stackStatus } from 'resources/stack';
import { Link } from 'react-router-dom';
export class Resource extends Base {
init() {
@ -41,138 +39,112 @@ export class Resource extends Base {
{
key: 'OS::Cinder::EncryptedVolumeType',
isAdmin: true,
getUrl: (value) =>
`${this.getUrl('/storage/volume-type')}/detail/${value}`,
routeName: 'volumeTypeDetail',
},
{
key: 'OS::Cinder::QoSAssociation',
isAdmin: true,
getUrl: (value) =>
`${this.getUrl('/storage/volume-type')}/qos/detail/${value}`,
routeName: 'volumeTypeQosDetail',
},
{
key: 'OS::Cinder::QoSSpecs',
isAdmin: true,
getUrl: (value) =>
`${this.getUrl('/storage/volume-type')}/qos/detail/${value}`,
routeName: 'volumeTypeQosDetail',
},
{
key: 'OS::Cinder::Volume',
getUrl: (value) => `${this.getUrl('/storage/volume')}/detail/${value}`,
routeName: 'volumeDetail',
},
{
key: 'OS::Cinder::VolumeType',
isAdmin: true,
getUrl: (value) =>
`${this.getUrl('/storage/volume-type')}/detail/${value}`,
routeName: 'volumeTypeDetail',
},
{
key: 'OS::Glance::WebImage',
getUrl: (value) => `${this.getUrl('/compute/image')}/detail/${value}`,
},
{
key: 'OS::Glance::WebImage',
getUrl: (value) => `${this.getUrl('/compute/image')}/detail/${value}`,
routeName: 'imageDetail',
},
{
key: 'OS::Heat::Stack',
getUrl: (value) => `${this.getUrl('/heat/stack')}/detail/${value}`,
routeName: 'stackDetail',
},
{
key: 'OS::Ironic::Port',
getUrl: (value) =>
`${this.getUrl(
'/network/virtual_adapter',
'_admin'
)}/detail/${value}`,
routeName: 'virtualAdapterDetail',
},
{
key: 'OS::Keystone::Domain',
routeName: 'domainDetail',
isAdmin: true,
getUrl: (value) => `${this.getUrl('/identity/domain')}/detail/${value}`,
},
{
key: 'OS::Keystone::Group',
routeName: 'userGroupDetail',
isAdmin: true,
getUrl: (value) =>
`${this.getUrl('/identity/user-group')}/detail/${value}`,
},
{
key: 'OS::Keystone::Project',
routeName: 'projectDetail',
isAdmin: true,
getUrl: (value) =>
`${this.getUrl('/identity/project')}/detail/${value}`,
},
{
key: 'OS::Keystone::Role',
routeName: 'roleDetail',
isAdmin: true,
getUrl: (value) => `${this.getUrl('/identity/role')}/detail/${value}`,
},
{
key: 'OS::Keystone::User',
routeName: 'userDetail',
isAdmin: true,
getUrl: (value) => `${this.getUrl('/identity/user')}/detail/${value}`,
},
{
key: 'OS::Neutron::FloatingIP',
getUrl: (value) =>
`${this.getUrl('/network/floatingip')}/detail/${value}`,
routeName: 'fipDetail',
},
{
key: 'OS::Neutron::LBaaS::LoadBalancer',
getUrl: (value) =>
`${this.getUrl('/network/load-balancers')}/detail/${value}`,
routeName: 'lbDetail',
},
{
key: 'OS::Neutron::Net',
getUrl: (value) =>
`${this.getUrl('/network/networks')}/detail/${value}`,
routeName: 'networkDetail',
},
{
key: 'OS::Neutron::Port',
getUrl: (value) =>
`${this.getUrl(
'/network/virtual_adapter',
'_admin'
)}/detail/${value}`,
routeName: 'virtualAdapterDetail',
},
{
key: 'OS::Neutron::QoSPolicy',
getUrl: (value) =>
`${this.getUrl('/network/qos-policy')}/detail/${value}`,
routeName: 'networkQosDetail',
},
{
key: 'OS::Neutron::Router',
getUrl: (value) => `${this.getUrl('/network/router')}/detail/${value}`,
routeName: 'routerDetail',
},
{
key: 'OS::Neutron::SecurityGroup',
getUrl: (value) =>
`${this.getUrl('/network/security-group')}/detail/${value}`,
routeName: 'securityGroupDetail',
},
{
key: 'OS::Nova::Flavor',
isAdmin: true,
getUrl: (value) => `${this.getUrl('/compute/flavor')}/detail/${value}`,
routeName: 'flavorDetail',
},
{
key: 'OS::Nova::KeyPair',
getUrl: (value) => `/compute/keypair/detail/${value}`,
routeName: 'keypairDetail',
},
{
key: 'OS::Nova::Server',
getUrl: (value) =>
`${this.getUrl('/compute/instance')}/detail/${value}`,
routeName: 'instanceDetail',
},
{
key: 'OS::Nova::ServerGroup',
getUrl: (value) =>
`${this.getUrl('/compute/server-group')}/detail/${value}`,
routeName: 'serverGroupDetail',
},
{
key: 'OS::Octavia::LoadBalancer',
getUrl: (value) =>
`${this.getUrl('/network/load-balancers')}/detail/${value}`,
routeName: 'lbDetail',
},
];
}
@ -186,16 +158,13 @@ export class Resource extends Base {
if (!item) {
return value;
}
const { isAdmin, getUrl } = item;
const { isAdmin, routeName } = item;
const link = this.getLinkRender(routeName, value, { id: value });
if (isAdmin) {
return this.isAdminPage ? (
<Link to={getUrl(value, record)}>{value}</Link>
) : (
value
);
return this.isAdminPage ? link : value;
}
if (getUrl) {
return <Link to={getUrl(value, record)}>{value}</Link>;
if (routeName) {
return link;
}
return value;
};

2
src/pages/heat/containers/Stack/Detail/index.jsx
View File

@ -32,7 +32,7 @@ export class StackDetail extends Base {
}
get listUrl() {
return this.getUrl('/heat/stack');
return this.getRoutePath('stack');
}
init() {

2
src/pages/heat/containers/Stack/actions/Create/index.jsx
View File

@ -37,7 +37,7 @@ export class StepCreate extends StepAction {
}
get listUrl() {
return this.getUrl('/heat/stack');
return this.getRoutePath('stack');
}
get name() {

10
src/pages/heat/containers/Stack/actions/Edit.jsx
View File

@ -13,6 +13,7 @@
// limitations under the License.
import { inject, observer } from 'mobx-react';
import { getPath } from 'utils/route-map';
import Create from './Create';
@inject('rootStore')
@ -24,14 +25,13 @@ export default class Edit extends Create {
static path = (item, containerProp) => {
const { isAdminPage } = containerProp;
const prefix = isAdminPage
? '/heat/stack-admin/edit/'
: '/heat/stack/edit/';
return `${prefix}${item.id}/${item.stack_name}`;
const key = isAdminPage ? 'stackEditAdmin' : 'stackEdit';
const { id, stack_name: name } = item;
return getPath({ key, params: { id, name } });
};
get listUrl() {
return this.getUrl('/heat/stack');
return this.getRoutePath('stack');
}
get name() {

11
src/pages/heat/containers/Stack/index.jsx
View File

@ -59,9 +59,14 @@ export class Stack extends Base {
{
title: t('ID/Name'),
dataIndex: 'stack_name',
linkFunc: (value, record) =>
`/heat/${this.getUrl('stack')}/detail/${record.id}/${value}`,
isName: true,
routeName: this.getRouteName('stackDetail'),
routeParamsFunc: (data) => {
return {
id: data.id,
name: data.stack_name,
};
},
isLink: true,
},
{
title: t('Project ID/Name'),

2
src/pages/identity/containers/Domain/Detail/index.jsx
View File

@ -31,7 +31,7 @@ export default class DomainDetail extends Base {
}
get listUrl() {
return '/identity/domain-admin';
return this.getRoutePath('domain');
}
get detailInfos() {

2
src/pages/identity/containers/Domain/actions/Create.jsx
View File

@ -37,7 +37,7 @@ class CreateForm extends FormAction {
}
get listUrl() {
return '/identity/domain-admin';
return this.getRoutePath('domain');
}
get name() {

2
src/pages/identity/containers/Domain/actions/Edit.jsx
View File

@ -46,7 +46,7 @@ class EditForm extends FormAction {
}
get listUrl() {
return '/identity/domain-admin';
return this.getRoutePath('domain');
}
get data() {

3
src/pages/identity/containers/Domain/index.jsx
View File

@ -43,8 +43,7 @@ export default class Domains extends Base {
{
title: t('Domain ID/Name'),
dataIndex: 'name',
// isHideable: true,
linkPrefix: '/identity/domain-admin/detail',
routeName: 'domainDetailAdmin',
},
{
title: t('Member Num'),

2
src/pages/identity/containers/Project/Detail/index.jsx
View File

@ -32,7 +32,7 @@ export class Detail extends Base {
}
get listUrl() {
return this.getUrl('/identity/project');
return this.getRoutePath('project');
}
get actionConfigs() {

2
src/pages/identity/containers/Project/index.jsx
View File

@ -66,7 +66,7 @@ export class Projects extends Base {
{
title: t('Project ID/Name'),
dataIndex: 'name',
linkPrefix: `/identity/${this.getUrl('project')}/detail`,
routeName: 'projectDetailAdmin',
},
{
title: t('Role'),

2
src/pages/identity/containers/Role/Detail/index.jsx
View File

@ -29,7 +29,7 @@ export class RoleDetail extends Base {
}
get listUrl() {
return '/identity/role-admin';
return this.getRoutePath('role');
}
init() {

12
src/pages/identity/containers/Role/index.jsx
View File

@ -12,8 +12,6 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import React from 'react';
import { Link } from 'react-router-dom';
import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import globalRoleStore from 'stores/keystone/role';
@ -45,15 +43,7 @@ export default class Role extends Base {
{
title: t('Role Name'),
dataIndex: 'name',
linkPrefix: '/identity/role-admin/detail',
render: (name, record) => {
if (name) {
return (
<Link to={`/identity/role-admin/detail/${record.id}`}>{name}</Link>
);
}
return '-';
},
routeName: 'roleDetailAdmin',
},
{
title: t('ID'),

2
src/pages/identity/containers/User/Detail/index.jsx
View File

@ -33,7 +33,7 @@ export class UserDetail extends Base {
}
get listUrl() {
return '/identity/user-admin';
return this.getRoutePath('user');
}
get actionConfigs() {

2
src/pages/identity/containers/User/actions/Create.jsx
View File

@ -93,7 +93,7 @@ export class CreateForm extends FormAction {
}
get listUrl() {
return '/identity/user-admin';
return this.getRoutePath('user');
}
get defaultValue() {

2
src/pages/identity/containers/User/index.jsx
View File

@ -81,7 +81,7 @@ export class User extends Base {
{
title: t('User ID/Name'),
dataIndex: 'name',
linkPrefix: `/identity/${this.getUrl('user')}/detail`,
routeName: 'userDetailAdmin',
},
{
title: t('Project Scope'),

2
src/pages/identity/containers/UserGroup/Detail/index.jsx
View File

@ -36,7 +36,7 @@ export default class Detail extends Base {
}
get listUrl() {
return '/identity/user-group-admin';
return this.getRoutePath('userGroup');
}
get actionConfigs() {

2
src/pages/identity/containers/UserGroup/index.jsx
View File

@ -51,7 +51,7 @@ export default class UserGroups extends Base {
{
title: t('User Group ID/Name'),
dataIndex: 'name',
linkPrefix: '/identity/user-group-admin/detail',
routeName: 'userGroupDetailAdmin',
},
{
title: t('Project Scope'),

2
src/pages/management/containers/RecycleBin/index.jsx
View File

@ -60,7 +60,7 @@ export default class RecycleBin extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/management/${this.getUrl('recycle-bin')}/detail`,
routeName: this.getRouteName('recycleBinDetail'),
sortKey: 'display_name',
},
{

13
src/pages/network/containers/FloatingIp/Detail/BaseDetail.jsx
View File

@ -12,10 +12,8 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import React from 'react';
import { inject, observer } from 'mobx-react';
import { FloatingIpStore } from 'stores/neutron/floatingIp';
import { Link } from 'react-router-dom';
import Base from 'containers/BaseDetail';
export class BaseDetail extends Base {
@ -70,12 +68,11 @@ export class BaseDetail extends Base {
if (router_name === '-' && network_name === '-') {
return data;
}
return (
<Link to={`${this.getUrl('/network/router')}/detail/${data}`}>
{`${data}`}
{router_name && `(${router_name})`}
</Link>
);
const value = router_name ? `${data} (${router_name})` : data;
const link = this.getLinkRender('routerDetail', value, {
id: data,
});
return link;
}
return '-';
},

2
src/pages/network/containers/FloatingIp/Detail/index.jsx
View File

@ -31,7 +31,7 @@ export class FloatingIpDetail extends Base {
}
get listUrl() {
return this.getUrl('/network/floatingip');
return this.getRoutePath('floatingip');
}
get actionConfigs() {

13
src/pages/network/containers/FloatingIp/index.jsx
View File

@ -17,7 +17,6 @@ import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import { floatingIpStatus, transitionStatuses } from 'resources/floatingip';
import { FloatingIpStore } from 'stores/neutron/floatingIp';
import { Link } from 'react-router-dom';
import { emptyActionConfig } from 'utils/constants';
import { Col, Popover, Row } from 'antd';
import { FileTextOutlined } from '@ant-design/icons';
@ -122,17 +121,15 @@ export class FloatingIps extends Base {
{
title: t('ID/Floating IP'),
dataIndex: 'floating_ip_address',
isName: true,
linkPrefix: `/network/${this.getUrl('floatingip')}/detail`,
isLink: true,
routeName: this.getRouteName('fipDetail'),
},
{
title: t('QoS Policy'),
dataIndex: 'qos_policy_id',
render: (value) => (
<Link to={`/network/${this.getUrl('qos-policy')}/detail/${value}`}>
{value}
</Link>
),
isLink: true,
routeName: 'qosPolicyDetail',
idKey: 'qos_policy_id',
hidden: !this.qosEndpoint,
},
{

4
src/pages/network/containers/LoadBalancers/Listener/Detail/index.jsx
View File

@ -32,8 +32,8 @@ export default class ListenerDetail extends Base {
}
get listUrl() {
const { loadBalancerId } = this.params;
return `/network/${this.getUrl('load-balancers')}/detail/${loadBalancerId}`;
const { loadBalancerId: id } = this.params;
return this.getRoutePath('lbDetail', { id });
}
get actionConfigs() {

12
src/pages/network/containers/LoadBalancers/Listener/index.jsx
View File

@ -61,11 +61,13 @@ export default class Listeners extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
isName: true,
linkPrefix: `/network/${this.getUrl('load-balancers')}/${
this.id
}/listener/`,
idKey: 'id',
routeName: this.getRouteName('lbDetail'),
routeParamsFunc: (data) => {
return {
loadBalancerId: this.id,
id: data.id,
};
},
},
{
title: t('Status'),

2
src/pages/network/containers/LoadBalancers/LoadBalancerInstance/Detail/index.jsx
View File

@ -42,7 +42,7 @@ export default class LoadBalancerDetail extends Base {
};
get listUrl() {
return this.getUrl('/network/load-balancers');
return this.getRoutePath('lb');
}
get actionConfigs() {

2
src/pages/network/containers/LoadBalancers/LoadBalancerInstance/actions/StepCreate/index.jsx
View File

@ -46,7 +46,7 @@ class StepCreate extends StepAction {
}
get listUrl() {
return '/network/load-balancers';
return this.getRoutePath('lb');
}
get hasConfirmStep() {

4
src/pages/network/containers/LoadBalancers/LoadBalancerInstance/index.jsx
View File

@ -89,9 +89,7 @@ export default class LoadBalancerInstance extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
isName: true,
linkPrefix: `/network/${this.getUrl('load-balancers')}/detail/`,
idKey: 'id',
routeName: this.getRouteName('lbDetail'),
},
{
title: t('Project ID/Name'),

2
src/pages/network/containers/Network/Detail/index.jsx
View File

@ -32,7 +32,7 @@ export class NetworkDetail extends Base {
}
get listUrl() {
return this.getUrl('/network/networks');
return this.getRoutePath('network');
}
get actionConfigs() {

2
src/pages/network/containers/QoSPolicy/Detail/index.jsx
View File

@ -30,7 +30,7 @@ export default class QoSPolicyDetail extends Base {
}
get listUrl() {
return this.getUrl('/network/qos-policy');
return this.getRoutePath('qosPolicy');
}
get actionConfigs() {

2
src/pages/network/containers/Router/Detail/index.jsx
View File

@ -33,7 +33,7 @@ export class RouterDetail extends Base {
}
get listUrl() {
return this.getUrl('/network/router');
return this.getRoutePath('router');
}
get actionConfigs() {

8
src/pages/network/containers/Router/Port/Detail/index.jsx
View File

@ -29,9 +29,11 @@ export class PortDetail extends Base {
get listUrl() {
const { routerId } = this.params;
return `/network/${this.getUrl(
'router'
)}/detail/${routerId}?tab=interfaces`;
return this.getRoutePath(
'routerDetail',
{ id: routerId },
{ tab: 'interfaces' }
);
}
get detailInfos() {

6
src/pages/network/containers/Router/Port/index.jsx
View File

@ -51,8 +51,12 @@ export default class Ports extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/network/${this.getUrl('router')}/${this.id}/port`,
stringify: (name, record) => name || record.id,
routeName: this.getRouteName('routerPortDetail'),
routeParamsFunc: (data) => ({
routeId: this.id,
id: data.id,
}),
},
{
title: t('IP Address'),

6
src/pages/network/containers/SecurityGroup/Detail/Rule/index.jsx
View File

@ -16,6 +16,7 @@ import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import globalSecurityGroupRuleStore from 'stores/neutron/security-rule';
import { filterParams, getSelfColumns } from 'resources/security-group-rule';
import { getPath } from 'utils/route-map';
import actionConfigs from './actions';
export class Rule extends Base {
@ -32,7 +33,10 @@ export class Rule extends Base {
}
getDetailUrl(id) {
return `${this.getUrl('/network/security-group')}/detail/${id}`;
const key = this.isAdminPage
? 'securityGroupDetailAdmin'
: 'securityGroupDetail';
return getPath({ key, params: { id } });
}
getColumns = () => getSelfColumns(this);

2
src/pages/network/containers/SecurityGroup/Detail/index.jsx
View File

@ -29,7 +29,7 @@ export class SecurityGroupDetail extends Base {
}
get listUrl() {
return this.getUrl('/network/security-group');
return this.getRoutePath('securityGroup');
}
get actionConfigs() {

6
src/pages/network/containers/SecurityGroup/index.jsx
View File

@ -60,15 +60,11 @@ export class SecurityGroups extends Base {
return true;
}
get detailLink() {
return `/network/${this.getUrl('security-group')}/detail`;
}
getColumns = () => [
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: this.detailLink,
routeName: this.getRouteName('securityGroupDetail'),
},
{
title: t('Project ID/Name'),

3
src/pages/network/containers/VPN/EndpointGroup/actions/Create.js
View File

@ -165,7 +165,8 @@ export default class Create extends ModalAction {
{
title: t('Name'),
dataIndex: 'name',
isName: true,
// todo: what?
isLink: true,
},
{
title: t('CIDR'),

2
src/pages/network/containers/VPN/IPsecSiteConnection/Detail/index.jsx
View File

@ -34,7 +34,7 @@ export default class IPsecSiteConnection extends Base {
}
get listUrl() {
return `${this.getUrl('/network/vpn')}?tab=ipsec_site_connections`;
return this.getRoutePath('vpn', null, { tab: 'ipsec_site_connections' });
}
get actionConfigs() {

3
src/pages/network/containers/VPN/IPsecSiteConnection/index.jsx
View File

@ -58,8 +58,7 @@ export default class Index extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
isName: true,
linkPrefix: `/network/${this.getUrl('ipsec-site-connection')}/detail`,
routeName: this.getRouteName('ipsecDetail'),
},
{
title: t('Project ID/Name'),

17
src/pages/network/containers/VirtualAdapter/Detail/BaseDetail/index.jsx
View File

@ -43,15 +43,14 @@ export default class BaseDetail extends Base {
const { itemInList: { device_id, device_owner, server_name } = {} } =
record;
if (device_id && device_owner === 'compute:nova') {
return (
<Link
to={`${this.getUrl(
'/compute/instance'
)}/detail/${device_id}?tab=interface`}
>
{`${device_id}`}
{server_name && `(${server_name})`}
</Link>
const value = server_name
? `${device_id} (${server_name})`
: device_id;
return this.getLinkRender(
'instanceDetail',
value,
{ id: device_id },
{ tab: 'interface' }
);
}
return data || '-';

10
src/pages/network/containers/VirtualAdapter/Detail/SecurityGroups/index.jsx
View File

@ -25,6 +25,7 @@ import PrimaryActionButtons from 'components/Tables/Base/PrimaryActionButtons';
import ItemActionButtons from 'components/Tables/Base/ItemActionButtons';
import { getSelfColumns } from 'resources/security-group-rule';
import { isAdminPage } from 'utils/index';
import { getPath } from 'utils/route-map';
import Detach from './actions/Detach';
import styles from './index.less';
@ -40,12 +41,11 @@ export class SecurityGroup extends React.Component {
this.refreshSecurityGroup();
}
getUrl(path, adminStr) {
return this.isAdminPage ? `${path}${adminStr || '-admin'}` : path;
}
getDetailUrl(id) {
return `${this.getUrl('/network/security-group')}/detail/${id}`;
const key = this.isAdminPage
? 'securityGroupDetailAdmin'
: 'securityGroupDetail';
return getPath({ key, params: { id } });
}
get portId() {

2
src/pages/network/containers/VirtualAdapter/Detail/index.jsx
View File

@ -32,7 +32,7 @@ export class VirtualAdapterDetail extends Base {
}
get listUrl() {
return this.getUrl('/network/virtual_adapter', '_admin');
return this.getRoutePath('virtualAdapter');
}
get actionConfigs() {

30
src/pages/network/containers/VirtualAdapter/index.jsx
View File

@ -13,7 +13,6 @@
// limitations under the License.
import React from 'react';
import { Link } from 'react-router-dom';
import { observer, inject } from 'mobx-react';
import Base from 'containers/List';
import { VirtualAdapterStore } from 'stores/neutron/virtual-adapter';
@ -120,10 +119,7 @@ export class VirtualAdapter extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/network/${this.getUrl(
'virtual_adapter',
'_admin'
)}/detail`,
routeName: this.getRouteName('virtualAdapterDetail'),
},
{
title: t('Project ID/Name'),
@ -145,18 +141,22 @@ export class VirtualAdapter extends Base {
`;
},
render: (server_name, item) => {
if (item.device_id && item.device_owner === 'compute:nova') {
const { device_id, device_owner } = item;
if (device_id && device_owner === 'compute:nova') {
const value = server_name
? `${device_id} (${server_name})`
: device_id;
const link = this.getLinkRender(
'instanceDetail',
value,
{ id: item.device_id },
{ tab: 'interface' }
);
return (
<>
{item.device_owner}
<br />
<Link
to={`${this.getUrl('/compute/instance')}/detail/${item.device_id
}?tab=interface`}
>
{`${item.device_id}`}
{server_name && `(${server_name})`}
</Link>
{link}
</>
);
}
@ -174,8 +174,8 @@ export class VirtualAdapter extends Base {
{
title: t('Owned Network'),
dataIndex: 'network_name',
isName: true,
linkPrefix: `/network/${this.getUrl('networks')}/detail`,
isLink: true,
routeName: this.getRouteName('networkDetail'),
idKey: 'network_id',
sorter: false,
},

9
src/pages/storage/containers/Backup/Detail/BaseDetail.jsx
View File

@ -12,10 +12,8 @@
// See the License for the specific language governing permissions and
// limitations under the License.
import React from 'react';
import { inject, observer } from 'mobx-react';
import Base from 'containers/BaseDetail';
import { Link } from 'react-router-dom';
@inject('rootStore')
@observer
@ -33,11 +31,8 @@ export default class BaseDetail extends Base {
copyable: {
text: this.detailData.volume_id,
},
render: (value) => (
<Link to={`${this.getUrl('/storage/volume')}/detail/${value}`}>
{value}
</Link>
),
render: (value) =>
this.getLinkRender('volumeDetail', value, { id: value }),
},
{
label: t('Volume'),

2
src/pages/storage/containers/Backup/Detail/index.jsx
View File

@ -31,7 +31,7 @@ export default class Detail extends Base {
}
get listUrl() {
return this.getUrl('/storage/backup');
return this.getRoutePath('backup');
}
get actionConfigs() {

10
src/pages/storage/containers/Backup/index.jsx
View File

@ -71,7 +71,7 @@ export default class Backup extends Base {
{
title: t('ID/Name'),
dataIndex: 'name',
linkPrefix: `/storage/${this.getUrl('backup')}/detail`,
routeName: this.getRouteName('backupDetail'),
sortKey: 'id',
},
{
@ -83,11 +83,9 @@ export default class Backup extends Base {
{
title: t('Volume ID/Name'),
dataIndex: 'volume_name',
isName: true,
linkFunc: (value, record) =>
`/storage/${this.getUrl('volume')}/detail/${
record.volume_id
}?tab=backup`,
isLink: true,
routeQuery: { tab: 'backup' },
routeName: this.getRouteName('volumeDetail'),
idKey: 'volume_id',
sortKey: 'volume_id',
},

Some files were not shown because too many files have changed in this diff Show More