= T | false;
35 |
36 | export interface RouterTypes extends Omit {
37 | computedMatch?: match;
38 | route?: Route;
39 | location: BasicRouteProps['location'] | { pathname?: string };
40 | }
41 |
42 | export interface MessageDescriptor {
43 | id: any;
44 | description?: string;
45 | defaultMessage?: string;
46 | }
47 |
--------------------------------------------------------------------------------
/example/tests/PuppeteerEnvironment.js:
--------------------------------------------------------------------------------
1 | // eslint-disable-next-line
2 | const NodeEnvironment = require('jest-environment-node');
3 | const getBrowser = require('./getBrowser');
4 |
5 | class PuppeteerEnvironment extends NodeEnvironment {
6 | // Jest is not available here, so we have to reverse engineer
7 | // the setTimeout function, see https://github.com/facebook/jest/blob/v23.1.0/packages/jest-runtime/src/index.js#L823
8 | setTimeout(timeout) {
9 | if (this.global.jasmine) {
10 | // eslint-disable-next-line no-underscore-dangle
11 | this.global.jasmine.DEFAULT_TIMEOUT_INTERVAL = timeout;
12 | } else {
13 | this.global[Symbol.for('TEST_TIMEOUT_SYMBOL')] = timeout;
14 | }
15 | }
16 |
17 | async setup() {
18 | const browser = await getBrowser();
19 | const page = await browser.newPage();
20 | this.global.browser = browser;
21 | this.global.page = page;
22 | }
23 |
24 | async teardown() {
25 | const { page, browser } = this.global;
26 |
27 | if (page) {
28 | await page.close();
29 | }
30 |
31 | if (browser) {
32 | await browser.disconnect();
33 | }
34 |
35 | if (browser) {
36 | await browser.close();
37 | }
38 | }
39 | }
40 |
41 | module.exports = PuppeteerEnvironment;
42 |
--------------------------------------------------------------------------------
/example/src/pages/user/login/components/Login/LoginTab.tsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect } from 'react';
2 | import { TabPaneProps } from 'antd/es/tabs';
3 | import { Tabs } from 'antd';
4 | import LoginContext, { LoginContextProps } from './LoginContext';
5 |
6 | const { TabPane } = Tabs;
7 |
8 | const generateId = (() => {
9 | let i = 0;
10 | return (prefix = '') => {
11 | i += 1;
12 | return `${prefix}${i}`;
13 | };
14 | })();
15 |
16 | interface LoginTabProps extends TabPaneProps {
17 | tabUtil: LoginContextProps['tabUtil'];
18 | active?: boolean;
19 | }
20 |
21 | const LoginTab: React.FC = (props) => {
22 | useEffect(() => {
23 | const uniqueId = generateId('login-tab-');
24 | const { tabUtil } = props;
25 | if (tabUtil) {
26 | tabUtil.addTab(uniqueId);
27 | }
28 | }, []);
29 | const { children } = props;
30 | return {props.active && children};
31 | };
32 |
33 | const WrapContext: React.FC & {
34 | typeName: string;
35 | } = (props) => (
36 |
37 | {(value) => }
38 |
39 | );
40 |
41 | // 标志位 用来判断是不是自定义组件
42 | WrapContext.typeName = 'LoginTab';
43 |
44 | export default WrapContext;
45 |
--------------------------------------------------------------------------------
/tests/__tests__/defaultSettings.ts:
--------------------------------------------------------------------------------
1 | import { MenuProps } from 'antd/es/menu';
2 |
3 | export type ContentWidth = 'Fluid' | 'Fixed';
4 |
5 | export interface Settings {
6 | /**
7 | * theme for nav menu
8 | */
9 | navTheme: MenuProps['theme'] | undefined;
10 | /**
11 | * nav menu position: `sidemenu` or `topmenu`
12 | */
13 | layout: 'sidemenu' | 'topmenu';
14 | /**
15 | * layout of content: `Fluid` or `Fixed`, only works when layout is topmenu
16 | */
17 | contentWidth: ContentWidth;
18 | /**
19 | * sticky header
20 | */
21 | fixedHeader: boolean;
22 |
23 | /**
24 | * sticky siderbar
25 | */
26 | fixSiderbar: boolean;
27 | menu: { locale: boolean };
28 | title: string;
29 | // Your custom iconfont Symbol script Url
30 | // eg：//at.alicdn.com/t/font_1039637_btcrd5co4w.js
31 | // 注意：如果需要图标多色，Iconfont 图标项目里要进行批量去色处理
32 | // Usage: https://github.com/ant-design/ant-design-pro/pull/3517
33 | iconfontUrl: string;
34 | }
35 |
36 | const defaultSettings: Settings = {
37 | navTheme: 'dark',
38 | layout: 'sidemenu',
39 | contentWidth: 'Fluid',
40 | fixedHeader: false,
41 | fixSiderbar: false,
42 | menu: {
43 | locale: true,
44 | },
45 | title: 'Ant Design Pro',
46 | iconfontUrl: '',
47 | };
48 | export default defaultSettings;
49 |
--------------------------------------------------------------------------------
/docs/example/IconFont.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | // eslint-disable-next-line import/no-unresolved
3 | import ProLayout, { PageContainer } from '@ant-design/pro-layout';
4 |
5 | export default () => (
6 |
12 |
44 |
45 | Hello World
46 |
47 |
48 |
12 |
[
17 | {
18 | path: '/welcome',
19 | name: '欢迎',
20 | },
21 | {
22 | path: '/admin',
23 | name: '管理',
24 | children: [
25 | {
26 | name: '申请单列表',
27 | path: '/admin/process',
28 | },
29 | {
30 | name: '申请单详情',
31 | path: '/admin/process/detail/:id',
32 | hideInMenu: true,
33 | },
34 | {
35 | name: '编辑申请单',
36 | path: '/admin/process/edit/:id',
37 | hideInMenu: true,
38 | },
39 | {
40 | name: '添加申请单',
41 | path: '/admin/process/add',
42 | hideInMenu: true,
43 | },
44 | ],
45 | },
46 | ]}
47 | >
48 |
49 | Hello World
50 |
51 |
52 |
{
18 | return {
19 | title: formatMessage({ id: `app.setting.regionalsettings.${key}` }),
20 | action: (
21 |
28 | changeSetting(
29 | `${key}Render`,
30 | checked === true ? undefined : false,
31 | )
32 | }
33 | />
34 | ),
35 | };
36 | })}
37 | />
38 | );
39 | };
40 |
41 | export default RegionalSetting;
42 |
--------------------------------------------------------------------------------
/docs/demo/materialMenu.tsx:
--------------------------------------------------------------------------------
1 | import React from 'react';
2 | // eslint-disable-next-line import/no-unresolved
3 | import ProLayout, { PageContainer } from '@ant-design/pro-layout';
4 | import List from '@material-ui/core/List';
5 | import ListItemText from '@material-ui/core/ListItemText';
6 | import ListItem from '@material-ui/core/ListItem';
7 |
8 | export default () => (
9 | (
17 |
24 |
32 |
33 |
34 |
35 |
36 |
37 |
38 |
39 |
40 |
41 |
42 |
43 | )}
44 | >
45 | Hello World
46 |
47 | );
48 |
--------------------------------------------------------------------------------
/src/index.tsx:
--------------------------------------------------------------------------------
1 | import BasicLayout, { BasicLayoutProps } from './BasicLayout';
2 | import DefaultHeader, { HeaderViewProps as HeaderProps } from './Header';
3 | import TopNavHeader, { TopNavHeaderProps } from './TopNavHeader';
4 | import SettingDrawer, {
5 | SettingDrawerProps,
6 | SettingDrawerState,
7 | } from './SettingDrawer';
8 |
9 | import DefaultFooter, { FooterProps } from './Footer';
10 | import GridContent from './GridContent';
11 | import PageContainer from './PageContainer';
12 | import RouteContext, { RouteContextType } from './RouteContext';
13 | import getMenuData from './utils/getMenuData';
14 | import getPageTitle from './getPageTitle';
15 | import PageLoading from './PageLoading';
16 | import FooterToolbar from './FooterToolbar';
17 |
18 | export type { ProSettings as Settings, ProSettings } from './defaultSettings';
19 |
20 | export type { MenuDataItem } from './typings';
21 |
22 | const PageHeaderWrapper = PageContainer;
23 |
24 | export {
25 | BasicLayout,
26 | RouteContext,
27 | PageLoading,
28 | GridContent,
29 | DefaultHeader,
30 | TopNavHeader,
31 | DefaultFooter,
32 | SettingDrawer,
33 | getPageTitle,
34 | PageHeaderWrapper,
35 | getMenuData,
36 | PageContainer,
37 | FooterToolbar,
38 | };
39 |
40 | export type {
41 | FooterProps,
42 | TopNavHeaderProps,
43 | BasicLayoutProps,
44 | RouteContextType,
45 | HeaderProps,
46 | SettingDrawerProps,
47 | SettingDrawerState,
48 | };
49 |
50 | export default BasicLayout;
51 |
--------------------------------------------------------------------------------
/src/locales/zh-TW/settingDrawer.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | 'app.setting.pagestyle': '整體風格設置',
3 | 'app.setting.pagestyle.dark': '暗色菜單風格',
4 | 'app.setting.pagestyle.light': '亮色菜單風格',
5 | 'app.setting.content-width': '內容區域寬度',
6 | 'app.setting.content-width.fixed': '定寬',
7 | 'app.setting.content-width.fluid': '流式',
8 | 'app.setting.themecolor': '主題色',
9 | 'app.setting.themecolor.dust': '薄暮',
10 | 'app.setting.themecolor.volcano': '火山',
11 | 'app.setting.themecolor.sunset': '日暮',
12 | 'app.setting.themecolor.cyan': '明青',
13 | 'app.setting.themecolor.green': '極光綠',
14 | 'app.setting.themecolor.daybreak': '拂曉藍（默認）',
15 | 'app.setting.themecolor.geekblue': '極客藍',
16 | 'app.setting.themecolor.purple': '醬紫',
17 | 'app.setting.navigationmode': '導航模式',
18 | 'app.setting.sidemenu': '側邊菜單布局',
19 | 'app.setting.topmenu': '頂部菜單布局',
20 | 'app.setting.mixmenu': '混合菜單布局',
21 | 'app.setting.splitMenus': '自动分割菜单',
22 | 'app.setting.fixedheader': '固定 Header',
23 | 'app.setting.fixedsidebar': '固定側邊菜單',
24 | 'app.setting.fixedsidebar.hint': '側邊菜單布局時可配置',
25 | 'app.setting.hideheader': '下滑時隱藏 Header',
26 | 'app.setting.hideheader.hint': '固定 Header 時可配置',
27 | 'app.setting.othersettings': '其他設置',
28 | 'app.setting.weakmode': '色弱模式',
29 | 'app.setting.copy': '拷貝設置',
30 | 'app.setting.loading': '正在加載主題',
31 | 'app.setting.copyinfo':
32 | '拷貝成功，請到 src/defaultSettings.js 中替換默認配置',
33 | 'app.setting.production.hint':
34 | '配置欄只在開發環境用於預覽，生產環境不會展現，請拷貝後手動修改配置文件',
35 | };
36 |
--------------------------------------------------------------------------------
/docs/demo/customizeMenu.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 | // eslint-disable-next-line import/no-unresolved
3 | import ProLayout, { PageContainer } from '@ant-design/pro-layout';
4 | import { Button } from 'antd';
5 | import defaultProps from './defaultProps';
6 |
7 | export default () => {
8 | const [index, setIndex] = useState(0);
9 | return (
10 | <>
11 |
19 | (
21 |
22 | {index} {dom}
23 |
24 | )}
25 | subMenuItemRender={(_, dom) => (
26 |
27 | {index} {dom}
28 |
29 | )}
30 | title="Remax"
31 | logo="https://gw.alipayobjects.com/mdn/rms_b5fcc5/afts/img/A*1NHAQYduQiQAAAAAAAAAAABkARQnAQ"
32 | menuHeaderRender={(logo, title) => (
33 |
42 | )}
43 | {...defaultProps}
44 | location={{
45 | pathname: '/welcome',
46 | }}
47 | >
48 | Hello World
49 |
50 |
51 | );
52 | };
53 |
--------------------------------------------------------------------------------
/src/SettingDrawer/BlockCheckbox.tsx:
--------------------------------------------------------------------------------
1 | import { CheckOutlined } from '@ant-design/icons';
2 | import { Tooltip } from 'antd';
3 |
4 | import React, { useState, useEffect } from 'react';
5 |
6 | export interface BlockCheckboxProps {
7 | value: string;
8 | onChange: (key: string) => void;
9 | list?: {
10 | title: string;
11 | key: string;
12 | url: string;
13 | }[];
14 | prefixCls: string;
15 | }
16 |
17 | const BlockCheckbox: React.FC = ({
18 | value,
19 | onChange,
20 | list,
21 | prefixCls,
22 | }) => {
23 | const baseClassName = `${prefixCls}-drawer-block-checkbox`;
24 | const [dom, setDom] = useState([]);
25 | useEffect(() => {
26 | const domList = (list || []).map((item) => (
27 | onChange(item.key)}
31 | >
32 |
33 | 
34 |
35 |
41 |
42 |
43 |
54 | {dom}
55 |
56 | );
57 | };
58 |
59 | export default BlockCheckbox;
60 |
--------------------------------------------------------------------------------
/src/GlobalFooter/index.tsx:
--------------------------------------------------------------------------------
1 | import './index.less';
2 |
3 | import React from 'react';
4 | import classNames from 'classnames';
5 | import { WithFalse } from '../typings';
6 |
7 | export interface GlobalFooterProps {
8 | links?: WithFalse<
9 | {
10 | key?: string;
11 | title: React.ReactNode;
12 | href: string;
13 | blankTarget?: boolean;
14 | }[]
15 | >;
16 | copyright?: React.ReactNode;
17 | style?: React.CSSProperties;
18 | prefixCls?: string;
19 | className?: string;
20 | }
21 |
22 | export default ({
23 | className,
24 | prefixCls = 'ant-pro',
25 | links,
26 | copyright,
27 | style,
28 | }: GlobalFooterProps) => {
29 | if (
30 | (links == null ||
31 | links === false ||
32 | (Array.isArray(links) && links.length === 0)) &&
33 | (copyright == null || copyright === false)
34 | ) {
35 | return null;
36 | }
37 | const baseClassName = `${prefixCls}-global-footer`;
38 | const clsString = classNames(baseClassName, className);
39 | return (
40 |
59 | );
60 | };
61 |
--------------------------------------------------------------------------------
/docs/demo/dynamicMenu.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState, useEffect } from 'react';
2 | import ProLayout, {
3 | PageContainer,
4 | MenuDataItem,
5 | // eslint-disable-next-line import/no-unresolved
6 | } from '@ant-design/pro-layout';
7 | import { Button, Spin } from 'antd';
8 | import customMenuDate from './customMenu';
9 |
10 | export default () => {
11 | const [menuData, setMenuData] = useState([]);
12 | const [loading, setLoading] = useState(true);
13 | const [index, setIndex] = useState(0);
14 | useEffect(() => {
15 | setMenuData([]);
16 | setLoading(true);
17 | setTimeout(() => {
18 | setMenuData(customMenuDate);
19 | setLoading(false);
20 | }, 2000);
21 | }, [index]);
22 | return (
23 | <>
24 |
32 |
38 | loading ? (
39 |
44 | {dom}
45 |
46 | ) : (
47 | dom
48 | )
49 | }
50 | location={{
51 | pathname: '/welcome',
52 | }}
53 | menuDataRender={() => menuData}
54 | >
55 | Hello World
56 |
57 |
58 | );
59 | };
60 |
--------------------------------------------------------------------------------
/example/src/locales/en-US/settingDrawer.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | 'app.setting.pagestyle': 'Page style setting',
3 | 'app.setting.pagestyle.dark': 'Dark style',
4 | 'app.setting.pagestyle.light': 'Light style',
5 | 'app.setting.content-width': 'Content Width',
6 | 'app.setting.content-width.fixed': 'Fixed',
7 | 'app.setting.content-width.fluid': 'Fluid',
8 | 'app.setting.themecolor': 'Theme Color',
9 | 'app.setting.themecolor.dust': 'Dust Red',
10 | 'app.setting.themecolor.volcano': 'Volcano',
11 | 'app.setting.themecolor.sunset': 'Sunset Orange',
12 | 'app.setting.themecolor.cyan': 'Cyan',
13 | 'app.setting.themecolor.green': 'Polar Green',
14 | 'app.setting.themecolor.daybreak': 'Daybreak Blue (default)',
15 | 'app.setting.themecolor.geekblue': 'Geek Blue',
16 | 'app.setting.themecolor.purple': 'Golden Purple',
17 | 'app.setting.navigationmode': 'Navigation Mode',
18 | 'app.setting.sidemenu': 'Side Menu Layout',
19 | 'app.setting.topmenu': 'Top Menu Layout',
20 | 'app.setting.fixedheader': 'Fixed Header',
21 | 'app.setting.fixedsidebar': 'Fixed Sidebar',
22 | 'app.setting.fixedsidebar.hint': 'Works on Side Menu Layout',
23 | 'app.setting.hideheader': 'Hidden Header when scrolling',
24 | 'app.setting.hideheader.hint': 'Works when Hidden Header is enabled',
25 | 'app.setting.othersettings': 'Other Settings',
26 | 'app.setting.weakmode': 'Weak Mode',
27 | 'app.setting.copy': 'Copy Setting',
28 | 'app.setting.copyinfo': 'copy success，please replace defaultSettings in src/models/setting.js',
29 | 'app.setting.production.hint':
30 | 'Setting panel shows in development environment only, please manually modify',
31 | };
32 |
--------------------------------------------------------------------------------
/example/src/components/RightContent/index.less:
--------------------------------------------------------------------------------
1 | @import '~antd/es/style/themes/default.less';
2 |
3 | @pro-header-hover-bg: rgba(0, 0, 0, 0.025);
4 |
5 | .menu {
6 | :global(.anticon) {
7 | margin-right: 8px;
8 | }
9 | :global(.ant-dropdown-menu-item) {
10 | min-width: 160px;
11 | }
12 | }
13 |
14 | .right {
15 | display: flex;
16 | float: right;
17 | margin-left: auto;
18 | overflow: hidden;
19 | .action {
20 | display: flex;
21 | align-items: center;
22 | padding: 0 12px;
23 | cursor: pointer;
24 | transition: all 0.3s;
25 |
26 | &:hover {
27 | background: @pro-header-hover-bg;
28 | }
29 | &:global(.opened) {
30 | background: @pro-header-hover-bg;
31 | }
32 | }
33 | .search {
34 | padding: 0 12px;
35 | &:hover {
36 | background: transparent;
37 | }
38 | }
39 | .account {
40 | .avatar {
41 | margin-right: 8px;
42 | color: @primary-color;
43 | vertical-align: top;
44 | background: rgba(255, 255, 255, 0.85);
45 | }
46 | }
47 | }
48 |
49 | .dark {
50 | .action {
51 | &:hover {
52 | background: #252a3d;
53 | }
54 | &:global(.opened) {
55 | background: #252a3d;
56 | }
57 | }
58 | }
59 |
60 | @media only screen and (max-width: @screen-md) {
61 | :global(.ant-divider-vertical) {
62 | vertical-align: unset;
63 | }
64 | .name {
65 | display: none;
66 | }
67 | .right {
68 | position: absolute;
69 | top: 0;
70 | right: 12px;
71 | .account {
72 | .avatar {
73 | margin-right: 0;
74 | }
75 | }
76 | .search {
77 | display: none;
78 | }
79 | }
80 | }
81 |
--------------------------------------------------------------------------------
/docs/example/searchMenu.tsx:
--------------------------------------------------------------------------------
1 | import React, { useState } from 'react';
2 |
3 | import ProLayout, {
4 | PageContainer,
5 | MenuDataItem,
6 | // eslint-disable-next-line import/no-unresolved
7 | } from '@ant-design/pro-layout';
8 | import { Input } from 'antd';
9 | import complexMenu from './complexMenu';
10 |
11 | const filterByMenuDate = (
12 | data: MenuDataItem[],
13 | keyWord: string,
14 | ): MenuDataItem[] =>
15 | data
16 | .map((item) => {
17 | if (
18 | (item.name && item.name.includes(keyWord)) ||
19 | filterByMenuDate(item.children || [], keyWord).length > 0
20 | ) {
21 | return {
22 | ...item,
23 | children: filterByMenuDate(item.children || [], keyWord),
24 | };
25 | }
26 |
27 | return undefined;
28 | })
29 | .filter((item) => item) as MenuDataItem[];
30 |
31 | export default () => {
32 | const [keyWord, setKeyWord] = useState('');
33 | return (
34 |
40 |
45 | !collapsed && (
46 | {
48 | setKeyWord(e);
49 | }}
50 | />
51 | )
52 | }
53 | menuDataRender={() => complexMenu}
54 | postMenuData={(menus) => filterByMenuDate(menus || [], keyWord)}
55 | >
56 |
57 | Hello World
58 |
59 |
60 |
49 |
loopMenuItem(defaultMenus)}
58 | >
59 |
60 |
65 | Hello World
66 |
67 |
68 |
69 |
54 |
loopMenuItem(defaultMenus)}
63 | >
64 |
65 |
70 | Hello World
71 |
72 |
73 |
74 |
9 |
10 | {children}
11 |
12 |
13 | );
14 |
15 | export default (): React.ReactNode => (
16 |
17 |
18 |
28 |
29 |
30 | {useIntl().formatMessage({ id: 'app.welcome.link.block-list' })}
31 |
32 |
33 | npm run ui
34 |
40 |
45 | {useIntl().formatMessage({ id: 'app.welcome.link.fetch-blocks' })}
46 |
47 |
48 | npm run fetch:blocks
49 |
50 |
56 | Want to add more pages? Please refer to{' '}
57 |
58 | use block
59 |
60 | 。
61 |
62 |
63 | );
64 |
--------------------------------------------------------------------------------
/src/locales/en-US/settingDrawer.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | 'app.setting.pagestyle': 'Page style setting',
3 | 'app.setting.pagestyle.dark': 'Dark style',
4 | 'app.setting.pagestyle.light': 'Light style',
5 | 'app.setting.content-width': 'Content Width',
6 | 'app.setting.content-width.fixed': 'Fixed',
7 | 'app.setting.content-width.fluid': 'Fluid',
8 | 'app.setting.themecolor': 'Theme Color',
9 | 'app.setting.themecolor.dust': 'Dust Red',
10 | 'app.setting.themecolor.volcano': 'Volcano',
11 | 'app.setting.themecolor.sunset': 'Sunset Orange',
12 | 'app.setting.themecolor.cyan': 'Cyan',
13 | 'app.setting.themecolor.green': 'Polar Green',
14 | 'app.setting.themecolor.daybreak': 'Daybreak Blue (default)',
15 | 'app.setting.themecolor.geekblue': 'Geek Blue',
16 | 'app.setting.themecolor.purple': 'Golden Purple',
17 | 'app.setting.navigationmode': 'Navigation Mode',
18 | 'app.setting.regionalsettings': 'Regional Settings',
19 | 'app.setting.regionalsettings.header': 'Header',
20 | 'app.setting.regionalsettings.menu': 'Menu',
21 | 'app.setting.regionalsettings.footer': 'Footer',
22 | 'app.setting.regionalsettings.menuHeader': 'Menu Header',
23 | 'app.setting.sidemenu': 'Side Menu Layout',
24 | 'app.setting.topmenu': 'Top Menu Layout',
25 | 'app.setting.mixmenu': 'Mix Menu Layout',
26 | 'app.setting.splitMenus': 'Split Menus',
27 | 'app.setting.fixedheader': 'Fixed Header',
28 | 'app.setting.fixedsidebar': 'Fixed Sidebar',
29 | 'app.setting.fixedsidebar.hint': 'Works on Side Menu Layout',
30 | 'app.setting.hideheader': 'Hidden Header when scrolling',
31 | 'app.setting.hideheader.hint': 'Works when Hidden Header is enabled',
32 | 'app.setting.othersettings': 'Other Settings',
33 | 'app.setting.weakmode': 'Weak Mode',
34 | 'app.setting.copy': 'Copy Setting',
35 | 'app.setting.loading': 'Loading theme',
36 | 'app.setting.copyinfo':
37 | 'copy success，please replace defaultSettings in src/models/setting.js',
38 | 'app.setting.production.hint':
39 | 'Setting panel shows in development environment only, please manually modify',
40 | };
41 |
--------------------------------------------------------------------------------
/tests/__tests__/__snapshots__/footer.test.tsx.snap:
--------------------------------------------------------------------------------
1 | // Jest Snapshot v1, https://goo.gl/fbAQLP
2 |
3 | exports[`DefaultFooter test copyright support false 1`] = `
4 |
57 | `;
58 |
--------------------------------------------------------------------------------
/example/src/locales/zh-CN/menu.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | 'menu.welcome': '欢迎',
3 | 'menu.more-blocks': '更多区块',
4 | 'menu.home': '首页',
5 | 'menu.admin': '管理页',
6 | 'menu.admin.sub-page': '二级管理页',
7 | 'menu.admin.sub-page2': '二级管理页',
8 | 'menu.admin.sub-page3': '三级管理页',
9 | 'menu.list.table-list.sub-page': '二级列表页',
10 | 'menu.list.table-list.sub-page2': '二级列表页',
11 | 'menu.list.table-list.sub-page3': '三级列表页',
12 | 'menu.login': '登录',
13 | 'menu.register': '注册',
14 | 'menu.register.result': '注册结果',
15 | 'menu.dashboard': 'Dashboard',
16 | 'menu.dashboard.analysis': '分析页',
17 | 'menu.dashboard.monitor': '监控页',
18 | 'menu.dashboard.workplace': '工作台',
19 | 'menu.exception.403': '403',
20 | 'menu.exception.404': '404',
21 | 'menu.exception.500': '500',
22 | 'menu.form': '表单页',
23 | 'menu.form.basic-form': '基础表单',
24 | 'menu.form.step-form': '分步表单',
25 | 'menu.form.step-form.info': '分步表单（填写转账信息）',
26 | 'menu.form.step-form.confirm': '分步表单（确认转账信息）',
27 | 'menu.form.step-form.result': '分步表单（完成）',
28 | 'menu.form.advanced-form': '高级表单',
29 | 'menu.list': '列表页',
30 | 'menu.list.table-list': '查询表格',
31 | 'menu.list.basic-list': '标准列表',
32 | 'menu.list.card-list': '卡片列表',
33 | 'menu.list.search-list': '搜索列表',
34 | 'menu.list.search-list.articles': '搜索列表（文章）',
35 | 'menu.list.search-list.projects': '搜索列表（项目）',
36 | 'menu.list.search-list.applications': '搜索列表（应用）',
37 | 'menu.profile': '详情页',
38 | 'menu.profile.basic': '基础详情页',
39 | 'menu.profile.advanced': '高级详情页',
40 | 'menu.result': '结果页',
41 | 'menu.result.success': '成功页',
42 | 'menu.result.fail': '失败页',
43 | 'menu.exception': '异常页',
44 | 'menu.exception.not-permission': '403',
45 | 'menu.exception.not-find': '404',
46 | 'menu.exception.server-error': '500',
47 | 'menu.exception.trigger': '触发错误',
48 | 'menu.account': '个人页',
49 | 'menu.account.center': '个人中心',
50 | 'menu.account.settings': '个人设置',
51 | 'menu.account.trigger': '触发报错',
52 | 'menu.account.logout': '退出登录',
53 | 'menu.editor': '图形编辑器',
54 | 'menu.editor.flow': '流程编辑器',
55 | 'menu.editor.mind': '脑图编辑器',
56 | 'menu.editor.koni': '拓扑编辑器',
57 | };
58 |
--------------------------------------------------------------------------------
/src/SettingDrawer/ThemeColor.tsx:
--------------------------------------------------------------------------------
1 | import './ThemeColor.less';
2 |
3 | import { CheckOutlined } from '@ant-design/icons';
4 |
5 | import { Tooltip } from 'antd';
6 |
7 | import React from 'react';
8 | import { genThemeToString } from '../utils/utils';
9 |
10 | export interface TagProps {
11 | color: string;
12 | check: boolean;
13 | className?: string;
14 | onClick?: () => void;
15 | }
16 |
17 | const Tag: React.FC = React.forwardRef(
18 | ({ color, check, ...rest }, ref) => (
19 |
20 | {check ? : ''}
21 |
22 | ),
23 | );
24 |
25 | export interface ThemeColorProps {
26 | colors?: {
27 | key: string;
28 | color: string;
29 | }[];
30 | value: string;
31 | onChange: (color: string) => void;
32 | formatMessage: (data: { id: any; defaultMessage?: string }) => string;
33 | }
34 |
35 | const ThemeColor: React.ForwardRefRenderFunction<
36 | HTMLDivElement,
37 | ThemeColorProps
38 | > = ({ colors, value, onChange, formatMessage }, ref) => {
39 | const colorList = colors || [];
40 | if (colorList.length < 1) {
41 | return null;
42 | }
43 | return (
44 |
45 |
46 | {colorList.map(({ key, color }) => {
47 | const themeKey = genThemeToString(key);
48 | return (
49 |
59 | onChange && onChange(key)}
64 | />
65 |
66 | );
67 | })}
68 |
69 |
{extra}
45 |
46 | {children}
47 |
48 |
49 | );
50 |
51 | /**
52 | * 告诉 props 是否存在 footerBar
53 | */
54 | useEffect(() => {
55 | if (!value || !value?.setHasFooterToolbar) {
56 | return () => {};
57 | }
58 | value?.setHasFooterToolbar(true);
59 | return () => {
60 | if (!value || !value?.setHasFooterToolbar) {
61 | return;
62 | }
63 | value?.setHasFooterToolbar(false);
64 | };
65 | }, []);
66 |
67 | return (
68 |
73 | {renderContent
74 | ? renderContent(
75 | {
76 | ...props,
77 | ...value,
78 | leftWidth: width,
79 | },
80 | dom,
81 | )
82 | : dom}
83 |
84 | );
85 | };
86 |
87 | export default FooterToolbar;
88 |
--------------------------------------------------------------------------------
/example/src/components/NoticeIcon/NoticeList.less:
--------------------------------------------------------------------------------
1 | @import '~antd/es/style/themes/default.less';
2 |
3 | .list {
4 | max-height: 400px;
5 | overflow: auto;
6 | &::-webkit-scrollbar {
7 | display: none;
8 | }
9 | .item {
10 | padding-right: 24px;
11 | padding-left: 24px;
12 | overflow: hidden;
13 | cursor: pointer;
14 | transition: all 0.3s;
15 |
16 | .meta {
17 | width: 100%;
18 | }
19 |
20 | .avatar {
21 | margin-top: 4px;
22 | background: @component-background;
23 | }
24 | .iconElement {
25 | font-size: 32px;
26 | }
27 |
28 | &.read {
29 | opacity: 0.4;
30 | }
31 | &:last-child {
32 | border-bottom: 0;
33 | }
34 | &:hover {
35 | background: @primary-1;
36 | }
37 | .title {
38 | margin-bottom: 8px;
39 | font-weight: normal;
40 | }
41 | .description {
42 | font-size: 12px;
43 | line-height: @line-height-base;
44 | }
45 | .datetime {
46 | margin-top: 4px;
47 | font-size: 12px;
48 | line-height: @line-height-base;
49 | }
50 | .extra {
51 | float: right;
52 | margin-top: -1.5px;
53 | margin-right: 0;
54 | color: @text-color-secondary;
55 | font-weight: normal;
56 | }
57 | }
58 | .loadMore {
59 | padding: 8px 0;
60 | color: @primary-6;
61 | text-align: center;
62 | cursor: pointer;
63 | &.loadedAll {
64 | color: rgba(0, 0, 0, 0.25);
65 | cursor: unset;
66 | }
67 | }
68 | }
69 |
70 | .notFound {
71 | padding: 73px 0 88px;
72 | color: @text-color-secondary;
73 | text-align: center;
74 | img {
75 | display: inline-block;
76 | height: 76px;
77 | margin-bottom: 16px;
78 | }
79 | }
80 |
81 | .bottomBar {
82 | height: 46px;
83 | color: @text-color;
84 | line-height: 46px;
85 | text-align: center;
86 | border-top: 1px solid @border-color-split;
87 | border-radius: 0 0 @border-radius-base @border-radius-base;
88 | transition: all 0.3s;
89 | div {
90 | display: inline-block;
91 | width: 50%;
92 | cursor: pointer;
93 | transition: all 0.3s;
94 | user-select: none;
95 |
96 | &:only-child {
97 | width: 100%;
98 | }
99 | &:not(:only-child):last-child {
100 | border-left: 1px solid @border-color-split;
101 | }
102 | }
103 | }
104 |
--------------------------------------------------------------------------------
/src/SiderMenu/index.tsx:
--------------------------------------------------------------------------------
1 | import React, { useEffect } from 'react';
2 | import { Drawer } from 'antd';
3 | import classNames from 'classnames';
4 | import Omit from 'omit.js';
5 | import { getFlatMenus } from '@umijs/route-utils';
6 |
7 | import { useDeepCompareEffect } from '../utils/utils';
8 | import SiderMenu, { SiderMenuProps } from './SiderMenu';
9 | import MenuCounter from './Counter';
10 |
11 | const SiderMenuWrapper: React.FC = (props) => {
12 | const {
13 | isMobile,
14 | menuData,
15 | siderWidth,
16 | collapsed,
17 | onCollapse,
18 | style,
19 | className,
20 | hide,
21 | prefixCls
22 | } = props;
23 | const { setFlatMenuKeys } = MenuCounter.useContainer();
24 |
25 | useDeepCompareEffect(() => {
26 | if (!menuData || menuData.length < 1) {
27 | return () => null;
28 | }
29 | // // 当 menu data 改变的时候重新计算这两个参数
30 | const newFlatMenus = getFlatMenus(menuData);
31 | const animationFrameId = requestAnimationFrame(() => {
32 | setFlatMenuKeys(Object.keys(newFlatMenus));
33 | });
34 | return () =>
35 | window.cancelAnimationFrame &&
36 | window.cancelAnimationFrame(animationFrameId);
37 | }, [menuData]);
38 |
39 | useEffect(() => {
40 | if (isMobile === true) {
41 | if (onCollapse) {
42 | onCollapse(true);
43 | }
44 | }
45 | }, [isMobile]);
46 |
47 | const omitProps = Omit(props, ['className', 'style']);
48 |
49 | if (hide) {
50 | return null;
51 | }
52 |
53 | return isMobile ? (
54 | onCollapse && onCollapse(true)}
59 | style={{
60 | padding: 0,
61 | height: '100vh',
62 | ...style,
63 | }}
64 | width={siderWidth}
65 | bodyStyle={{ height: '100vh', padding: 0 }}
66 | >
67 |
72 |
73 | ) : (
74 |
79 | );
80 | };
81 |
82 | SiderMenuWrapper.defaultProps = {
83 | onCollapse: () => undefined,
84 | };
85 |
86 | export default SiderMenuWrapper;
87 |
--------------------------------------------------------------------------------
/example/src/locales/en-US/menu.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | 'menu.welcome': 'Welcome',
3 | 'menu.more-blocks': 'More Blocks',
4 | 'menu.home': 'Home',
5 | 'menu.admin': 'Admin',
6 | 'menu.admin.sub-page': 'Subpage',
7 | 'menu.admin.sub-page2': 'Subpage 2',
8 | 'menu.admin.sub-page3': 'Subpage 3',
9 | 'menu.list.table-list.sub-page': 'Subpage',
10 | 'menu.list.table-list.sub-page2': 'Subpage 2',
11 | 'menu.list.table-list.sub-page3': 'Subpage 3',
12 | 'menu.login': 'Login',
13 | 'menu.register': 'Register',
14 | 'menu.register.result': 'Register Result',
15 | 'menu.dashboard': 'Dashboard',
16 | 'menu.dashboard.analysis': 'Analysis',
17 | 'menu.dashboard.monitor': 'Monitor',
18 | 'menu.dashboard.workplace': 'Workplace',
19 | 'menu.exception.403': '403',
20 | 'menu.exception.404': '404',
21 | 'menu.exception.500': '500',
22 | 'menu.form': 'Form',
23 | 'menu.form.basic-form': 'Basic Form',
24 | 'menu.form.step-form': 'Step Form',
25 | 'menu.form.step-form.info': 'Step Form(write transfer information)',
26 | 'menu.form.step-form.confirm': 'Step Form(confirm transfer information)',
27 | 'menu.form.step-form.result': 'Step Form(finished)',
28 | 'menu.form.advanced-form': 'Advanced Form',
29 | 'menu.list': 'List',
30 | 'menu.list.table-list': 'Search Table',
31 | 'menu.list.basic-list': 'Basic List',
32 | 'menu.list.card-list': 'Card List',
33 | 'menu.list.search-list': 'Search List',
34 | 'menu.list.search-list.articles': 'Search List(articles)',
35 | 'menu.list.search-list.projects': 'Search List(projects)',
36 | 'menu.list.search-list.applications': 'Search List(applications)',
37 | 'menu.profile': 'Profile',
38 | 'menu.profile.basic': 'Basic Profile',
39 | 'menu.profile.advanced': 'Advanced Profile',
40 | 'menu.result': 'Result',
41 | 'menu.result.success': 'Success',
42 | 'menu.result.fail': 'Fail',
43 | 'menu.exception': 'Exception',
44 | 'menu.exception.not-permission': '403',
45 | 'menu.exception.not-find': '404',
46 | 'menu.exception.server-error': '500',
47 | 'menu.exception.trigger': 'Trigger',
48 | 'menu.account': 'Account',
49 | 'menu.account.center': 'Account Center',
50 | 'menu.account.settings': 'Account Settings',
51 | 'menu.account.trigger': 'Trigger Error',
52 | 'menu.account.logout': 'Logout',
53 | 'menu.editor': 'Graphic Editor',
54 | 'menu.editor.flow': 'Flow Editor',
55 | 'menu.editor.mind': 'Mind Editor',
56 | 'menu.editor.koni': 'Koni Editor',
57 | };
58 |
--------------------------------------------------------------------------------
/example/src/components/RightContent/index.tsx:
--------------------------------------------------------------------------------
1 | import { Tooltip, Tag, Space } from 'antd';
2 | import { QuestionCircleOutlined } from '@ant-design/icons';
3 | import React from 'react';
4 | import { useModel, SelectLang } from 'umi';
5 | import Avatar from './AvatarDropdown';
6 | import HeaderSearch from '../HeaderSearch';
7 | import styles from './index.less';
8 | import { useIntl } from 'umi';
9 |
10 | export type SiderTheme = 'light' | 'dark';
11 |
12 | const ENVTagColor = {
13 | dev: 'orange',
14 | test: 'green',
15 | pre: '#87d068',
16 | };
17 |
18 | const GlobalHeaderRight: React.FC<{}> = () => {
19 | const { initialState } = useModel('@@initialState');
20 |
21 | if (!initialState || !initialState.settings) {
22 | return null;
23 | }
24 |
25 | const { navTheme, layout } = initialState.settings;
26 | let className = styles.right;
27 |
28 | if ((navTheme === 'dark' && layout === 'top') || layout === 'mix') {
29 | className = `${styles.right} ${styles.dark}`;
30 | }
31 | return (
32 |
33 | umi ui, value: 'umi ui' },
39 | {
40 | label: Ant Design,
41 | value: 'Ant Design',
42 | },
43 | {
44 | label: Pro Table,
45 | value: 'Pro Table',
46 | },
47 | {
48 | label: Pro Layout,
49 | value: 'Pro Layout',
50 | },
51 | ]}
52 | // onSearch={value => {
53 | // //console.log('input', value);
54 | // }}
55 | />
56 |
57 | {
60 | window.location.href = 'https://pro.ant.design/docs/getting-started';
61 | }}
62 | >
63 |
64 |
65 |
66 |
67 | {REACT_APP_ENV && (
68 |
69 | {REACT_APP_ENV}
70 |
71 | )}
72 |
73 |
74 | );
75 | };
76 | export default GlobalHeaderRight;
77 |
--------------------------------------------------------------------------------
/example/src/locales/pt-BR/menu.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | 'menu.welcome': 'Bem-vinda',
3 | 'menu.more-blocks': 'Mais blocos',
4 | 'menu.home': 'Início',
5 | 'menu.admin': 'Admin',
6 | 'menu.admin.sub-page': 'Subpágina',
7 | 'menu.admin.sub-page2': 'Subpágina 2',
8 | 'menu.admin.sub-page3': 'Subpágina 3',
9 | 'menu.list.table-list.sub-page': 'Subpágina',
10 | 'menu.list.table-list.sub-page2': 'Subpágina 2',
11 | 'menu.list.table-list.sub-page3': 'Subpágina 3',
12 | 'menu.login': 'Login',
13 | 'menu.register': 'Registro',
14 | 'menu.register.result': 'Resultado de registro',
15 | 'menu.dashboard': 'Dashboard',
16 | 'menu.dashboard.analysis': 'Análise',
17 | 'menu.dashboard.monitor': 'Monitor',
18 | 'menu.dashboard.workplace': 'Ambiente de Trabalho',
19 | 'menu.exception.403': '403',
20 | 'menu.exception.404': '404',
21 | 'menu.exception.500': '500',
22 | 'menu.form': 'Formulário',
23 | 'menu.form.basic-form': 'Formulário Básico',
24 | 'menu.form.step-form': 'Formulário Assistido',
25 | 'menu.form.step-form.info': 'Formulário Assistido(gravar informações de transferência)',
26 | 'menu.form.step-form.confirm': 'Formulário Assistido(confirmar informações de transferência)',
27 | 'menu.form.step-form.result': 'Formulário Assistido(finalizado)',
28 | 'menu.form.advanced-form': 'Formulário Avançado',
29 | 'menu.list': 'Lista',
30 | 'menu.list.table-list': 'Tabela de Busca',
31 | 'menu.list.basic-list': 'Lista Básica',
32 | 'menu.list.card-list': 'Lista de Card',
33 | 'menu.list.search-list': 'Lista de Busca',
34 | 'menu.list.search-list.articles': 'Lista de Busca(artigos)',
35 | 'menu.list.search-list.projects': 'Lista de Busca(projetos)',
36 | 'menu.list.search-list.applications': 'Lista de Busca(aplicações)',
37 | 'menu.profile': 'Perfil',
38 | 'menu.profile.basic': 'Perfil Básico',
39 | 'menu.profile.advanced': 'Perfil Avançado',
40 | 'menu.result': 'Resultado',
41 | 'menu.result.success': 'Sucesso',
42 | 'menu.result.fail': 'Falha',
43 | 'menu.exception': 'Exceção',
44 | 'menu.exception.not-permission': '403',
45 | 'menu.exception.not-find': '404',
46 | 'menu.exception.server-error': '500',
47 | 'menu.exception.trigger': 'Disparar',
48 | 'menu.account': 'Conta',
49 | 'menu.account.center': 'Central da Conta',
50 | 'menu.account.settings': 'Configurar Conta',
51 | 'menu.account.trigger': 'Disparar Erro',
52 | 'menu.account.logout': 'Sair',
53 | 'menu.editor': 'Graphic Editor',
54 | 'menu.editor.flow': 'Flow Editor',
55 | 'menu.editor.mind': 'Mind Editor',
56 | 'menu.editor.koni': 'Koni Editor',
57 | };
58 |
--------------------------------------------------------------------------------
/docs/menu.md:
--------------------------------------------------------------------------------
1 | ---
2 | title: 菜单能力
3 | order: 9
4 | side: false
5 | nav:
6 | title: 菜单能力
7 | order: 1
8 | ---
9 |
10 | # menu 的各种操作
11 |
12 | ProLayout 提供了强大的 menu，但是这样必然会封装很多行为，导致需要一些特殊逻辑的用户感到不满。所以我们提供了很多的 API，期望可以满足绝大部分客户的方式。
13 |
14 | ## 从服务器加载 menu
15 |
16 | 从服务器加载 menu 主要使用的 API 是 `menuDataRender` 和 `menuRender`,`menuDataRender`可以控制当前的菜单数据，`menuRender`可以控制菜单的 dom 节点。
17 |
18 | {
54 | setSearchMode(true);
55 | if (searchMode && inputRef.current) {
56 | inputRef.current.focus();
57 | }
58 | }}
59 | onTransitionEnd={({ propertyName }) => {
60 | if (propertyName === 'width' && !searchMode) {
61 | if (onVisibleChange) {
62 | onVisibleChange(searchMode);
63 | }
64 | }
65 | }}
66 | >
67 |
73 |
80 | {
87 | if (e.key === 'Enter') {
88 | if (restProps.onSearch) {
89 | restProps.onSearch(value);
90 | }
91 | }
92 | }}
93 | onBlur={() => {
94 | setSearchMode(false);
95 | }}
96 | />
97 |
98 |
36 |
41 |
{
43 | if (!width) {
44 | return;
45 | }
46 | setRightSize(width);
47 | }}
48 | >
49 | {rightContentRender && (
50 |
51 | {rightContentRender({
52 | ...props,
53 | })}
54 |
55 | )}
56 |
57 |
58 |
84 |
90 | {headerDom && (
91 |
95 |
96 | {headerDom}
97 |
98 |
99 | )}
100 |
101 |
102 |
103 | {rightContentRender && (
104 |
105 | )}
106 |
107 |
40 |
(
49 | {
51 | setPathname(item.path || '/welcome');
52 | }}
53 | >
54 | {dom}
55 |
56 | )}
57 | rightContentRender={() => (
58 |
61 | )}
62 | {...settings}
63 | >
64 | 操作,
78 | ,
79 | ,
82 | ]}
83 | footer={[, ]}
84 | >
85 |
90 | Back Home}
99 | />
100 |
101 |
102 |
103 |
document.getElementById('test-pro-layout')}
105 | settings={settings}
106 | onSettingChange={(changeSetting) => setSetting(changeSetting)}
107 | />
108 |
40 |
44 |
{emptyText}
45 |
50 |
51 | className={styles.list}
52 | dataSource={data}
53 | renderItem={(item, i) => {
54 | const itemCls = classNames(styles.item, {
55 | [styles.read]: item.read,
56 | });
57 | // eslint-disable-next-line no-nested-ternary
58 | const leftIcon = item.avatar ? (
59 | typeof item.avatar === 'string' ? (
60 |
61 | ) : (
62 | {item.avatar}
63 | )
64 | ) : null;
65 |
66 | return (
67 | onClick && onClick(item)}
71 | >
72 |
77 | {item.title}
78 | {item.extra}
79 |
83 |
{item.description}
84 |
{item.datetime}
85 |
93 | {showClear ? (
94 |
95 | {clearText} {title}
96 |
97 | ) : null}
98 | {showViewMore ? (
99 |
{
101 | if (onViewMore) {
102 | onViewMore(e);
103 | }
104 | }}
105 | >
106 | {viewMoreText}
107 |
108 | ) : null}
109 |
95 |
96 | (menu ? dom : null)}
105 | breakpoint={false}
106 | collapsed={collapsed}
107 | loading={loading}
108 | onCollapse={setCollapsed}
109 | rightContentRender={() =>
110 | right ? (
111 |
114 | ) : null
115 | }
116 | location={{
117 | pathname: '/welcome',
118 | }}
119 | pure={pure}
120 | footerRender={() => (footer ? : null)}
121 | >
122 | Hello World
123 |
124 |
125 | );
126 | };
127 |
--------------------------------------------------------------------------------
/example/src/locales/pt-BR/settings.ts:
--------------------------------------------------------------------------------
1 | export default {
2 | 'app.settings.menuMap.basic': 'Configurações Básicas',
3 | 'app.settings.menuMap.security': 'Configurações de Segurança',
4 | 'app.settings.menuMap.binding': 'Vinculação de Conta',
5 | 'app.settings.menuMap.notification': 'Mensagens de Notificação',
6 | 'app.settings.basic.avatar': 'Avatar',
7 | 'app.settings.basic.change-avatar': 'Alterar avatar',
8 | 'app.settings.basic.email': 'Email',
9 | 'app.settings.basic.email-message': 'Por favor insira seu email!',
10 | 'app.settings.basic.nickname': 'Nome de usuário',
11 | 'app.settings.basic.nickname-message': 'Por favor insira seu nome de usuário!',
12 | 'app.settings.basic.profile': 'Perfil pessoal',
13 | 'app.settings.basic.profile-message': 'Por favor insira seu perfil pessoal!',
14 | 'app.settings.basic.profile-placeholder': 'Breve introdução sua',
15 | 'app.settings.basic.country': 'País/Região',
16 | 'app.settings.basic.country-message': 'Por favor insira país!',
17 | 'app.settings.basic.geographic': 'Província, estado ou cidade',
18 | 'app.settings.basic.geographic-message': 'Por favor insira suas informações geográficas!',
19 | 'app.settings.basic.address': 'Endereço',
20 | 'app.settings.basic.address-message': 'Por favor insira seu endereço!',
21 | 'app.settings.basic.phone': 'Número de telefone',
22 | 'app.settings.basic.phone-message': 'Por favor insira seu número de telefone!',
23 | 'app.settings.basic.update': 'Atualizar Informações',
24 | 'app.settings.security.strong': 'Forte',
25 | 'app.settings.security.medium': 'Média',
26 | 'app.settings.security.weak': 'Fraca',
27 | 'app.settings.security.password': 'Senha da Conta',
28 | 'app.settings.security.password-description': 'Força da senha',
29 | 'app.settings.security.phone': 'Telefone de Seguraça',
30 | 'app.settings.security.phone-description': 'Telefone vinculado',
31 | 'app.settings.security.question': 'Pergunta de Segurança',
32 | 'app.settings.security.question-description':
33 | 'A pergunta de segurança não está definida e a política de segurança pode proteger efetivamente a segurança da conta',
34 | 'app.settings.security.email': 'Email de Backup',
35 | 'app.settings.security.email-description': 'Email vinculado',
36 | 'app.settings.security.mfa': 'Dispositivo MFA',
37 | 'app.settings.security.mfa-description':
38 | 'O dispositivo MFA não vinculado, após a vinculação, pode ser confirmado duas vezes',
39 | 'app.settings.security.modify': 'Modificar',
40 | 'app.settings.security.set': 'Atribuir',
41 | 'app.settings.security.bind': 'Vincular',
42 | 'app.settings.binding.taobao': 'Vincular Taobao',
43 | 'app.settings.binding.taobao-description': 'Atualmente não vinculado à conta Taobao',
44 | 'app.settings.binding.alipay': 'Vincular Alipay',
45 | 'app.settings.binding.alipay-description': 'Atualmente não vinculado à conta Alipay',
46 | 'app.settings.binding.dingding': 'Vincular DingTalk',
47 | 'app.settings.binding.dingding-description': 'Atualmente não vinculado à conta DingTalk',
48 | 'app.settings.binding.bind': 'Vincular',
49 | 'app.settings.notification.password': 'Senha da Conta',
50 | 'app.settings.notification.password-description':
51 | 'Mensagens de outros usuários serão notificadas na forma de uma estação de letra',
52 | 'app.settings.notification.messages': 'Mensagens de Sistema',
53 | 'app.settings.notification.messages-description':
54 | 'Mensagens de sistema serão notificadas na forma de uma estação de letra',
55 | 'app.settings.notification.todo': 'Notificação de To-do',
56 | 'app.settings.notification.todo-description':
57 | 'A lista de to-do será notificada na forma de uma estação de letra',
58 | 'app.settings.open': 'Aberto',
59 | 'app.settings.close': 'Fechado',
60 | };
61 |
--------------------------------------------------------------------------------