Skip to content

GitLab

A
ant-design-pro
Commit c961cca2 authored by 陈帅's avatar 陈帅
Browse files
Options

add settings drawer i18n

parent 983d737f
Show whitespace changes
Inline Side-by-side
Showing with 53 additions and 20 deletions
src/components/SettingDarwer/ThemeColor.js
View file @ c961cca2
...@@ -15,7 +15,7 @@ const Tag = ({ color, check, ...rest }) => { ...@@ -15,7 +15,7 @@ const Tag = ({ color, check, ...rest }) => {
); );
}; };
const ThemeColor = ({ colors, value, onChange }) => { const ThemeColor = ({ colors, title, value, onChange }) => {
let colorList = colors; let colorList = colors;
if (!colors) { if (!colors) {
colorList = [ colorList = [
...@@ -31,7 +31,7 @@ const ThemeColor = ({ colors, value, onChange }) => { ...@@ -31,7 +31,7 @@ const ThemeColor = ({ colors, value, onChange }) => {
} }
return ( return (
<div className={styles.themeColor}> <div className={styles.themeColor}>
<h3 className={styles.title}>主题色</h3> <h3 className={styles.title}>{title}</h3>
<div className={styles.content}> <div className={styles.content}>
{colorList.map(color => { {colorList.map(color => {
return ( return (
......
src/components/SettingDarwer/index.js
View file @ c961cca2
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { Select, message, Drawer, List, Switch, Divider, Icon, Button } from 'antd'; import { Select, message, Drawer, List, Switch, Divider, Icon, Button } from 'antd';
import { formatMessage } from 'umi/locale';
import { CopyToClipboard } from 'react-copy-to-clipboard'; import { CopyToClipboard } from 'react-copy-to-clipboard';
import { connect } from 'dva'; import { connect } from 'dva';
import styles from './index.less'; import styles from './index.less';
...@@ -26,7 +27,7 @@ class SettingDarwer extends PureComponent { ...@@ -26,7 +27,7 @@ class SettingDarwer extends PureComponent {
} = this.props; } = this.props;
return [ return [
{ {
title: '栅格模式', title: formatMessage({ id: 'app.setting.gridmode' }),
action: [ action: [
<Select <Select
value={grid} value={grid}
...@@ -34,13 +35,17 @@ class SettingDarwer extends PureComponent { ...@@ -34,13 +35,17 @@ class SettingDarwer extends PureComponent {
onSelect={value => this.changeSetting('grid', value)} onSelect={value => this.changeSetting('grid', value)}
style={{ width: 80 }} style={{ width: 80 }}
> >
<Select.Option value="Wide">定宽</Select.Option> <Select.Option value="Wide">
<Select.Option value="Fluid">流式</Select.Option> {formatMessage({ id: 'app.setting.gridmode.wide' })}
</Select.Option>
<Select.Option value="Fluid">
{formatMessage({ id: 'app.setting.gridmode.fluid' })}
</Select.Option>
</Select>, </Select>,
], ],
}, },
{ {
title: '固定 Header', title: formatMessage({ id: 'app.setting.fixedheader' }),
action: [ action: [
<Switch <Switch
size="small" size="small"
...@@ -50,7 +55,7 @@ class SettingDarwer extends PureComponent { ...@@ -50,7 +55,7 @@ class SettingDarwer extends PureComponent {
], ],
}, },
{ {
title: '下滑时隐藏 Header', title: formatMessage({ id: 'app.setting.hideheader' }),
hide: !fixedHeader, hide: !fixedHeader,
action: [ action: [
<Switch <Switch
...@@ -61,7 +66,7 @@ class SettingDarwer extends PureComponent { ...@@ -61,7 +66,7 @@ class SettingDarwer extends PureComponent {
], ],
}, },
{ {
title: '固定 Siderbar', title: formatMessage({ id: 'app.setting.fixedsidebar' }),
hide: layout === 'topmenu', hide: layout === 'topmenu',
action: [ action: [
<Switch <Switch
...@@ -143,7 +148,7 @@ class SettingDarwer extends PureComponent { ...@@ -143,7 +148,7 @@ class SettingDarwer extends PureComponent {
}} }}
> >
<div className={styles.content}> <div className={styles.content}>
<Body title="整体风格设置"> <Body title={formatMessage({ id: 'app.setting.pagestyle' })}>
<BlockChecbox <BlockChecbox
list={[ list={[
{ {
...@@ -161,13 +166,14 @@ class SettingDarwer extends PureComponent { ...@@ -161,13 +166,14 @@ class SettingDarwer extends PureComponent {
</Body> </Body>
<ThemeColor <ThemeColor
title={formatMessage({ id: 'app.setting.themecolor' })}
value={themeColor} value={themeColor}
onChange={color => this.changeSetting('themeColor', color)} onChange={color => this.changeSetting('themeColor', color)}
/> />
<Divider /> <Divider />
<Body title="导航设置 "> <Body title={formatMessage({ id: 'app.setting.navigationmode' })}>
<BlockChecbox <BlockChecbox
list={[ list={[
{ {
...@@ -192,7 +198,7 @@ class SettingDarwer extends PureComponent { ...@@ -192,7 +198,7 @@ class SettingDarwer extends PureComponent {
<Divider /> <Divider />
<Body title="其他设置 "> <Body title={formatMessage({ id: 'app.setting.othersettings' })}>
<List.Item <List.Item
actions={[ actions={[
<Switch <Switch
...@@ -202,17 +208,13 @@ class SettingDarwer extends PureComponent { ...@@ -202,17 +208,13 @@ class SettingDarwer extends PureComponent {
/>, />,
]} ]}
> >
色弱模式 {formatMessage({ id: 'app.setting.weakmode' })}
</List.Item> </List.Item>
</Body> </Body>
<Divider /> <Divider />
<CopyToClipboard <CopyToClipboard
text={JSON.stringify(setting)} text={JSON.stringify(setting)}
onCopy={() => onCopy={() => message.success(formatMessage({ id: 'app.setting.copyinfo' }))}
message.success(
'copy success，please replace defaultSetting in src/models/setting.js'
)
}
> >
<Button <Button
style={{ style={{
...@@ -220,7 +222,7 @@ class SettingDarwer extends PureComponent { ...@@ -220,7 +222,7 @@ class SettingDarwer extends PureComponent {
}} }}
> >
<Icon type="copy" /> <Icon type="copy" />
拷贝配置 {formatMessage({ id: 'app.setting.copy' })}
</Button> </Button>
</CopyToClipboard> </CopyToClipboard>
</div> </div>
......
src/layouts/BasicLayout.js
View file @ c961cca2
...@@ -179,7 +179,12 @@ class BasicLayout extends React.PureComponent { ...@@ -179,7 +179,12 @@ class BasicLayout extends React.PureComponent {
{...this.props} {...this.props}
/> />
)} )}
<Layout style={this.getLayoutStyle()}> <Layout
style={{
...this.getLayoutStyle(),
minHeight: '100vh',
}}
>
<Header handleMenuCollapse={this.handleMenuCollapse} logo={logo} {...this.props} /> <Header handleMenuCollapse={this.handleMenuCollapse} logo={logo} {...this.props} />
<Content style={this.getContentStyle()}>{children}</Content> <Content style={this.getContentStyle()}>{children}</Content>
<Footer /> <Footer />
......
src/locales/en-US.js
View file @ c961cca2
...@@ -155,4 +155,17 @@ export default { ...@@ -155,4 +155,17 @@ export default {
'app.result.success.btn-return': 'Back to list', 'app.result.success.btn-return': 'Back to list',
'app.result.success.btn-project': 'View project', 'app.result.success.btn-project': 'View project',
'app.result.success.btn-print': 'Print', 'app.result.success.btn-print': 'Print',
'app.setting.pagestyle': 'Page style setting',
'app.setting.gridmode': 'Grid Mode',
'app.setting.gridmode.wide': 'Wide',
'app.setting.gridmode.fluid': 'Fluid',
'app.setting.themecolor': 'Theme Color',
'app.setting.navigationmode': 'Navigation Mode',
'app.setting.fixedheader': 'Fixed Header',
'app.setting.fixedsidebar': 'Fixed Sidebar',
'app.setting.hideheader': 'Hidden Header when sliding ',
'app.setting.othersettings': 'Other Settings',
'app.setting.weakmode': 'Weak Mode',
'app.setting.copy': 'Copy Setting',
'app.setting.copyinfo': 'copy success，please replace defaultSetting in src/models/setting.js',
}; };
src/locales/zh-CN.js
View file @ c961cca2
...@@ -150,4 +150,17 @@ export default { ...@@ -150,4 +150,17 @@ export default {
'app.result.success.btn-return': '返回列表', 'app.result.success.btn-return': '返回列表',
'app.result.success.btn-project': '查看项目', 'app.result.success.btn-project': '查看项目',
'app.result.success.btn-print': '打印', 'app.result.success.btn-print': '打印',
'app.setting.pagestyle': '整理风格设置',
'app.setting.gridmode': '栅格模式',
'app.setting.gridmode.wide': '定宽',
'app.setting.gridmode.fluid': '流式',
'app.setting.themecolor': '主题色',
'app.setting.navigationmode': '导航模式',
'app.setting.fixedheader': '固定 Header',
'app.setting.fixedsidebar': '固定 Sidebar',
'app.setting.hideheader': '下滑时隐藏 Header',
'app.setting.othersettings': '其他设置',
'app.setting.weakmode': '色弱模式',
'app.setting.copy': '拷贝设置',
'app.setting.copyinfo': '拷贝成功，请到 src/models/setting.js 中替换 defaultSetting',
}; };
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment