diff --git a/src/locale/en-US.js b/src/locale/en-US.js index e5d9971dd7f9024e50ce835cd92e1bdedf072a20..a73fb32fa50300ea772fb7ad607ec1cba1e41b42 100644 --- a/src/locale/en-US.js +++ b/src/locale/en-US.js @@ -72,6 +72,42 @@ export default { 'app.analysis.table.search-keyword': 'Keyword', 'app.analysis.table.users': 'Users', 'app.analysis.table.weekly-range': 'Weekly Range', + 'app.settings.menuMap.basic': 'Basic Settings', + 'app.settings.menuMap.security': 'Security Settings', + 'app.settings.menuMap.binding': 'Account Binding', + 'app.settings.menuMap.notification': 'New Message Notification', + 'app.settings.basic.avatar': 'Change avatar', + 'app.settings.basic.email': 'Email', + 'app.settings.basic.email-message': 'Please input your email!', + 'app.settings.basic.nickname': 'Nickname', + 'app.settings.basic.nickname-message': 'Please input your Nickname!', + 'app.settings.basic.profile': 'Personal profile', + 'app.settings.basic.profile-message': 'Please input your personal profile!', + 'app.settings.basic.profile-placeholder': 'Brief introduction to yourself', + 'app.settings.basic.country': 'Country/Region', + 'app.settings.basic.country-message': 'Please input your country!', + 'app.settings.basic.geographic': 'Province or city', + 'app.settings.basic.geographic-message': 'Please input your geographic info!', + 'app.settings.basic.address': 'Street Address', + 'app.settings.basic.address-message': 'Please input your address!', + 'app.settings.basic.phone': 'Phone Number', + 'app.settings.basic.phone-message': 'Please input your phone!', + 'app.settings.basic.update': 'Update Information', + 'app.settings.security.strong': 'Strong', + 'app.settings.security.medium': 'Medium', + 'app.settings.security.weak': 'Weak', + 'app.settings.security.password': 'Account Password', + 'app.settings.security.password-description': 'Current password strength:', + 'app.settings.security.phone': 'Security Phone', + 'app.settings.security.phone-description': 'Bound phone:', + 'app.settings.security.question': 'Security Question', + 'app.settings.security.question-description': + 'The security question is not set, and the security policy can effectively protect the account security', + 'app.settings.security.email': 'Backup Email', + 'app.settings.security.email-description': 'Bound Email:', + 'app.settings.security.mfa': 'MFA Device', + 'app.settings.security.mfa-description': + 'Unbound MFA device, after binding, can be confirmed twice', // ...enMessages, }, }; diff --git a/src/locale/zh-CN.js b/src/locale/zh-CN.js index 852d25422c2998e08046e93abeeda71f67ac8879..c1f7c347d973b065302bff29177d697162f29124 100644 --- a/src/locale/zh-CN.js +++ b/src/locale/zh-CN.js @@ -72,6 +72,39 @@ export default { 'app.analysis.table.search-keyword': '搜索关键词', 'app.analysis.table.users': '用户数', 'app.analysis.table.weekly-range': '周涨幅', + 'app.settings.menuMap.basic': '基本设置', + 'app.settings.menuMap.security': '安全设置', + 'app.settings.menuMap.binding': '账号绑定', + 'app.settings.menuMap.notification': '新消息通知', + 'app.settings.basic.avatar': '更换头像', + 'app.settings.basic.email': '邮箱', + 'app.settings.basic.email-message': '请输入您的邮箱!', + 'app.settings.basic.nickname': '昵称', + 'app.settings.basic.nickname-message': '请输入您的昵称!', + 'app.settings.basic.profile': '个人简介', + 'app.settings.basic.profile-message': '请输入个人简介!', + 'app.settings.basic.profile-placeholder': '个人简介', + 'app.settings.basic.country': '国家/地区', + 'app.settings.basic.country-message': '请输入您的国家或地区!', + 'app.settings.basic.geographic': '所在省市', + 'app.settings.basic.geographic-message': '请输入您的所在省市!', + 'app.settings.basic.address': '街道地址', + 'app.settings.basic.address-message': '请输入您的街道地址!', + 'app.settings.basic.phone': '联系电话', + 'app.settings.basic.phone-message': '请输入您的联系电话!', + 'app.settings.security.strong': '强', + 'app.settings.security.medium': '中', + 'app.settings.security.weak': '弱', + 'app.settings.security.password': '账户密码', + 'app.settings.security.password-description': '当前密码强度:', + 'app.settings.security.phone': '密保手机', + 'app.settings.security.phone-description': '已绑定手机:', + 'app.settings.security.question': '密保问题', + 'app.settings.security.question-description': '未设置密保问题,密保问题可有效保护账户安全', + 'app.settings.security.email': '备用邮箱', + 'app.settings.security.email-description': '已绑定邮箱:', + 'app.settings.security.mfa': 'MFA 设备', + 'app.settings.security.mfa-description': '未绑定 MFA 设备,绑定后,可以进行二次确认', // ...zhMessages, }, }; diff --git a/src/pages/Account/Settings/BaseView.js b/src/pages/Account/Settings/BaseView.js index b6fe2c50dfd3793460535d1296e31979f96c5859..f2dd1cf15b48b97976c314c3174c70db0ff4606b 100644 --- a/src/pages/Account/Settings/BaseView.js +++ b/src/pages/Account/Settings/BaseView.js @@ -1,9 +1,11 @@ import React, { Component, Fragment } from 'react'; +import { injectIntl, FormattedMessage } from 'react-intl'; import { Form, Input, Upload, Select, Button } from 'antd'; import { connect } from 'dva'; import styles from './BaseView.less'; import GeographicView from './GeographicView'; import PhoneView from './PhoneView'; +// import { getTimeDistance } from '../../../utils/utils'; const FormItem = Form.Item; const { Option } = Select; @@ -11,13 +13,15 @@ const { Option } = Select; // 头像组件 方便以后独立,增加裁剪之类的功能 const AvatarView = ({ avatar }) => ( -
头像
+
Avatar
avatar
- +
@@ -49,7 +53,29 @@ const validatorPhone = (rule, value, callback) => { currentUser: user.currentUser, })) @Form.create() -export default class BaseView extends Component { +class BaseView extends Component { + constructor(props) { + super(props); + const { intl } = props; + this.formLabelData = { + email: intl.formatMessage({ id: 'app.settings.basic.email' }, {}), + emailMessage: intl.formatMessage({ id: 'app.settings.basic.email-message' }, {}), + nickname: intl.formatMessage({ id: 'app.settings.basic.nickname' }, {}), + nicknameMessage: intl.formatMessage({ id: 'app.settings.basic.nickname-message' }, {}), + profile: intl.formatMessage({ id: 'app.settings.basic.profile' }, {}), + profileMessage: intl.formatMessage({ id: 'app.settings.basic.profile-message' }, {}), + profilePlaceholder: intl.formatMessage({ id: 'app.settings.basic.profile-placeholder' }, {}), + country: intl.formatMessage({ id: 'app.settings.basic.country' }, {}), + countryMessage: intl.formatMessage({ id: 'app.settings.basic.country-message' }, {}), + geographic: intl.formatMessage({ id: 'app.settings.basic.geographic' }, {}), + geographicMessage: intl.formatMessage({ id: 'app.settings.basic.geographic-message' }, {}), + address: intl.formatMessage({ id: 'app.settings.basic.address' }, {}), + addressMessage: intl.formatMessage({ id: 'app.settings.basic.address-message' }, {}), + phone: intl.formatMessage({ id: 'app.settings.basic.phone' }, {}), + phoneMessage: intl.formatMessage({ id: 'app.settings.basic.phone-message' }, {}), + }; + } + componentDidMount() { this.setBaseInfo(); } @@ -84,36 +110,36 @@ export default class BaseView extends Component {
- + {getFieldDecorator('email', { - rules: [{ required: true, message: 'Please input your email!' }], + rules: [{ required: true, message: this.formLabelData.emailMessage }], })()} - + {getFieldDecorator('name', { - rules: [{ required: true, message: 'Please input your nick name!' }], + rules: [{ required: true, message: this.formLabelData.nicknameMessage }], })()} - + {getFieldDecorator('profile', { - rules: [{ required: true, message: 'Please input personal profile!' }], - })()} + rules: [{ required: true, message: this.formLabelData.profileMessage }], + })()} - + {getFieldDecorator('country', { - rules: [{ required: true, message: 'Please input your country!' }], + rules: [{ required: true, message: this.formLabelData.countryMessage }], })( )} - + {getFieldDecorator('geographic', { rules: [ { required: true, - message: 'Please input your geographic info!', + message: this.formLabelData.geographicMessage, }, { validator: validatorGeographic, @@ -121,20 +147,25 @@ export default class BaseView extends Component { ], })()} - + {getFieldDecorator('address', { - rules: [{ required: true, message: 'Please input your address!' }], + rules: [{ required: true, message: this.formLabelData.addressMessage }], })()} - + {getFieldDecorator('phone', { rules: [ - { required: true, message: 'Please input your phone!' }, + { required: true, message: this.formLabelData.phoneMessage }, { validator: validatorPhone }, ], })()} - +
@@ -144,3 +175,4 @@ export default class BaseView extends Component { ); } } +export default injectIntl(BaseView); diff --git a/src/pages/Account/Settings/Info.js b/src/pages/Account/Settings/Info.js index e59666242db53b0861353f782450bfbb46885840..d817f1ed6cf79cbafc91d86207d73d502da3fd24 100644 --- a/src/pages/Account/Settings/Info.js +++ b/src/pages/Account/Settings/Info.js @@ -1,19 +1,13 @@ import React, { Component } from 'react'; import { connect } from 'dva'; import { routerRedux } from 'dva/router'; +import { FormattedMessage } from 'react-intl'; import { Menu } from 'antd'; import styles from './Info.less'; import GridContent from '../../layouts/GridContent'; const { Item } = Menu; -const menuMap = { - base: '基本设置', - security: '安全设置', - binding: '账号绑定', - notification: '新消息通知', -}; - @connect(({ user }) => ({ currentUser: user.currentUser, })) @@ -21,11 +15,27 @@ export default class Info extends Component { constructor(props) { super(props); const { match, location } = props; - let key = location.pathname.replace(`${match.path}/`, ''); - key = menuMap[key] ? key : 'base'; + const key = location.pathname.replace(`${match.path}/`, ''); + // let key = location.pathname.replace(`${match.path}/`, ''); + // key = this.state.menuMap[key] ? key : 'base'; this.state = { selectKey: key, mode: 'inline', + menuMap: { + base: , + security: ( + + ), + binding: ( + + ), + notification: ( + + ), + }, }; } @@ -41,7 +51,7 @@ export default class Info extends Component { static getDerivedStateFromProps(props, state) { const { match, location } = props; let selectKey = location.pathname.replace(`${match.path}/`, ''); - selectKey = menuMap[selectKey] ? selectKey : 'base'; + selectKey = state.menuMap[selectKey] ? selectKey : 'base'; if (selectKey !== state.selectKey) { return { selectKey }; } @@ -49,11 +59,12 @@ export default class Info extends Component { } getmenu = () => { + const { menuMap } = this.state; return Object.keys(menuMap).map(item => {menuMap[item]}); }; getRightTitle = () => { - const { selectKey } = this.state; + const { selectKey, menuMap } = this.state; return menuMap[selectKey]; }; diff --git a/src/pages/Account/Settings/SecurityView.js b/src/pages/Account/Settings/SecurityView.js index f26f9d6e5b8fbf4354cd4df1513a8a5641d33c81..62cb6caac5c3d9aa18b91191dc5699110b2859b6 100644 --- a/src/pages/Account/Settings/SecurityView.js +++ b/src/pages/Account/Settings/SecurityView.js @@ -1,39 +1,53 @@ import React, { Component, Fragment } from 'react'; +import { FormattedMessage } from 'react-intl'; import { List } from 'antd'; const passwordStrength = { - strong: , - medium: 中文, - weak: , + strong: ( + + + + ), + medium: ( + + + + ), + weak: ( + + Weak + + ), }; export default class SecurityView extends Component { getData = () => { return [ { - title: '账户密码', - description: 当前密码强度:{passwordStrength.strong}, - actions: [修改], + title: 'account password', + description: Current password strength:{passwordStrength.strong}, + actions: [Modify], }, { - title: '密保手机', - description: '已绑定手机:138****8293', - actions: [修改], + title: 'Security phone', + description: 'Bound phone:138****8293', + actions: [Modify], }, { - title: '密保问题', - description: '未设置密保问题,密保问题可有效保护账户安全', - actions: [设置], + title: 'Security Question', + description: + 'The security question is not set, and the security policy can effectively protect the account security', + actions: [Set], }, { - title: '备用邮箱', - description: '已绑定邮箱:ant***sign.com', - actions: [修改], + title: 'Backup Email', + description: 'Bound Email:ant***sign.com', + actions: [Modify], }, { - title: 'MFA 设备', - description: '未绑定 MFA 设备,绑定后,可以进行二次确认', - actions: [绑定], + title: 'MFA Device', + description: 'Unbound MFA device, after binding, can be confirmed twice', + actions: [Bind], }, ]; };