|
@@ -4,21 +4,22 @@
|
|
|
* https://github.com/ant-design/ant-design-pro-layout
|
|
|
*/
|
|
|
import ProLayout, {
|
|
|
- MenuDataItem,
|
|
|
BasicLayoutProps as ProLayoutProps,
|
|
|
- Settings,
|
|
|
DefaultFooter,
|
|
|
+ MenuDataItem,
|
|
|
+ Settings,
|
|
|
} from '@ant-design/pro-layout';
|
|
|
-import React from 'react';
|
|
|
-import { Link, useIntl, connect, Dispatch } from 'umi';
|
|
|
+import React, {useEffect, useState} from 'react';
|
|
|
+import {connect, Dispatch, Link, useIntl} from 'umi';
|
|
|
// import { GithubOutlined } from '@ant-design/icons';
|
|
|
-import { Result, Button } from 'antd';
|
|
|
+import {Button, Result} from 'antd';
|
|
|
import Authorized from '@/utils/Authorized';
|
|
|
import RightContent from '@/components/GlobalHeader/RightContent';
|
|
|
-import { ConnectState } from '@/models/connect';
|
|
|
-import { getAuthorityFromRouter } from '@/utils/utils';
|
|
|
+import {ConnectState} from '@/models/connect';
|
|
|
+import {getAuthorityFromRouter} from '@/utils/utils';
|
|
|
import logo from '../assets/logo.svg';
|
|
|
|
|
|
+
|
|
|
const noMatch = (
|
|
|
<Result
|
|
|
status={403}
|
|
@@ -31,6 +32,7 @@ const noMatch = (
|
|
|
}
|
|
|
/>
|
|
|
);
|
|
|
+
|
|
|
export interface BasicLayoutProps extends ProLayoutProps {
|
|
|
breadcrumbNameMap: {
|
|
|
[path: string]: MenuDataItem;
|
|
@@ -41,6 +43,7 @@ export interface BasicLayoutProps extends ProLayoutProps {
|
|
|
settings: Settings;
|
|
|
dispatch: Dispatch;
|
|
|
}
|
|
|
+
|
|
|
export type BasicLayoutContext = { [K in 'location']: BasicLayoutProps[K] } & {
|
|
|
breadcrumbNameMap: {
|
|
|
[path: string]: MenuDataItem;
|
|
@@ -52,7 +55,7 @@ export type BasicLayoutContext = { [K in 'location']: BasicLayoutProps[K] } & {
|
|
|
|
|
|
const menuDataRender = (menuList: MenuDataItem[]): MenuDataItem[] =>
|
|
|
menuList.map((item) => {
|
|
|
- const localItem = { ...item, children: item.children ? menuDataRender(item.children) : [] };
|
|
|
+ const localItem = {...item, children: item.children ? menuDataRender(item.children) : []};
|
|
|
return Authorized.check(item.authority, localItem, null) as MenuDataItem;
|
|
|
});
|
|
|
|
|
@@ -97,11 +100,21 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
|
|
|
const authorized = getAuthorityFromRouter(props.route.routes, location.pathname || '/') || {
|
|
|
authority: undefined,
|
|
|
};
|
|
|
- const { formatMessage } = useIntl();
|
|
|
+ const {formatMessage} = useIntl();
|
|
|
+
|
|
|
+ // 设置header是否展示,通过判断是否是手机端
|
|
|
+ const [isPhone, setPhone] = useState<any>(false);
|
|
|
+ useEffect(()=>{
|
|
|
+ if (/mobile/i.test(navigator.userAgent) || /android/i.test(navigator.userAgent)) {
|
|
|
+ setPhone(undefined);
|
|
|
+ } else {
|
|
|
+ setPhone(false);
|
|
|
+ }
|
|
|
+ },[]);
|
|
|
|
|
|
return (
|
|
|
<ProLayout
|
|
|
- headerRender={false}
|
|
|
+ headerRender={isPhone}
|
|
|
logo={logo}
|
|
|
formatMessage={formatMessage}
|
|
|
menuHeaderRender={(logoDom, titleDom) => (
|
|
@@ -121,7 +134,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
|
|
|
breadcrumbRender={(routers = []) => [
|
|
|
{
|
|
|
path: '/',
|
|
|
- breadcrumbName: formatMessage({ id: 'menu.home' }),
|
|
|
+ breadcrumbName: formatMessage({id: 'menu.home'}),
|
|
|
},
|
|
|
...routers,
|
|
|
]}
|
|
@@ -135,7 +148,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
|
|
|
}}
|
|
|
footerRender={() => defaultFooterDom}
|
|
|
menuDataRender={menuDataRender}
|
|
|
- rightContentRender={() => <RightContent />}
|
|
|
+ rightContentRender={() => <RightContent/>}
|
|
|
{...props}
|
|
|
{...settings}
|
|
|
>
|
|
@@ -146,7 +159,7 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
|
|
|
);
|
|
|
};
|
|
|
|
|
|
-export default connect(({ global, settings }: ConnectState) => ({
|
|
|
+export default connect(({global, settings}: ConnectState) => ({
|
|
|
collapsed: global.collapsed,
|
|
|
settings,
|
|
|
}))(BasicLayout);
|