i18n

i18n.json

@@ -18,12 +18,11 @@
     "moecube": "MoeCube",
     "index-leftbox1": "You can use this account to sign in.",
     "yonghuan": "The Disappearing of Gensokyo",
-    "please-sign-up": "Sign Up",
-    "please-sign-in": "Sign In",
+    "sign-up": "Sign Up",
+    "sign-in": "Sign In",
     "email-address-or-username": "E-Mail or Username",
     "register-now": "register-now!",
     "register":"register",
-    "login": "Login",
     "forgot-password": "Forgot Password",
     "send-email": "Send Email",
     "reset-success": "reset success",
@@ -67,7 +66,13 @@
     "Your email has been updated.": "Your email has been updated. You will receive an verification email. Please check the mail to finish verification. ",
 
     "Please input your account!":"Please input your email or username!",
-    "Please input your Password!":"Please input your Password!"
+    "Please input your Password!":"Please input your Password!",
+
+    "verify email":"verify email",
+    "account-info":"Account Info",
+    "reset-username":"Reset Username",
+    "reset-email":"Reset Email",
+    "reset-password":"Reset Password"
 
   },
   "zh": {
@@ -89,12 +94,11 @@
     "moecube": "萌立方",
     "index-leftbox1": "您可使用以下几种账号登陆",
     "yonghuan": "永远消失的幻想乡",
-    "please-sign-up": "注册",
-    "please-sign-in": "登陆",
+    "sign-up": "注册",
+    "sign-in": "登陆",
     "email-address-or-username": "邮箱或用户名",
     "register-now": "现在注册",
     "register":"注册",
-    "login": "登陆",
     "forgot-password": "忘记密码",
     "send-email": "发送邮件",
     "reset-success": "修改成功",
@@ -139,7 +143,14 @@
 
     "Please input your account!":"请填写你的邮箱或用户名!",
     "Please input your Password!":"请填写你的密码!",
-    "密码至少为8-24位":"密码至少为8-24位"
 
+    "verify email":"验证邮箱",
+    "account-info":"账户信息",
+    "reset-username":"修改用户名",
+    "reset-email":"修改邮箱",
+    "reset-password":"修改密码",
+
+
+    "密码至少为8-24位":"密码至少为8-24位"
   }
 }

src/index.js

+import { message } from 'antd';
 import dva from 'dva';
+import { browserHistory } from 'dva/router';
 import ReactDOM from 'react-dom';
-import { browserHistory } from 'dva/router'
-import { message } from 'antd'
-import './index.css';
 
-import { IntlProvider, addLocaleData } from 'react-intl';
+import { addLocaleData, IntlProvider } from 'react-intl';
+// 5. Start
+import en from 'react-intl/locale-data/en';
+import zh from 'react-intl/locale-data/zh';
+import localeData from '../i18n.json';
+import './index.css';
 
 // 1. Initialize
 const app = dva({
-    onError: (error, dispatch) => {
-      message.destroy();
-      message.error(error.message);
-    },
-    history: browserHistory
+  onError: (error, dispatch) => {
+    message.destroy();
+    message.error(error.message);
+  },
+  history: browserHistory,
 });
 
 
@@ -36,27 +40,22 @@ app.model(require('./models/common'));
 // 4. Router
 app.router(require('./router'));
 
-// 5. Start
-import en from 'react-intl/locale-data/en'
-import zh from 'react-intl/locale-data/zh'
-import localeData from '../i18n.json'
-
 
 addLocaleData([...en, ...zh]);
 /*eslint-disable */
 const language = navigator.language || (navigator.languages && navigator.languages[0]) || navigator.userLanguage;
 /*eslint-enable */
-const languageWithoutRegionCode = language.toLowerCase().split(/[_-]+/)[0];
+const languageWithoutRegionCode = 'zh' || language.toLowerCase().split(/[_-]+/)[0];
 
 const messages = localeData[languageWithoutRegionCode] || localeData[language] || localeData.zh;
 
 const App = app.start();
 ReactDOM.render(
-  <IntlProvider locale={ language } messages={ messages }>
+  <IntlProvider locale={language} messages={messages}>
     <App/>
   </IntlProvider>,
   document.getElementById('root'),
 );
 
 
-console.log(language)
+console.log(language);

src/routes/Activate.js

 import { Button } from 'antd';
 import { connect } from 'dva';
 import React from 'react';
+import { FormattedMessage as Format } from 'react-intl';
 
 class Active extends React.Component {
 
@@ -15,7 +16,7 @@ class Active extends React.Component {
     return (
       <div style={{ display: 'flex', justifyContent: 'center', alignItems: 'center', minHeight: '100%' }}>
         <Button type="primary" icon="poweroff" loading={activateState} onClick={this.handleClick}>
-          激活
+          <Format id={'verify email'} />
         </Button>
       </div>
     );

src/routes/Forgot.js

@@ -60,7 +60,7 @@ class Login extends React.Component {
             <Button type="primary" htmlType="submit" className="login-form-button">
               <Format id={'send-email'} />
             </Button>
-            Or <Link to="/login"><Format id={'login'} /></Link>
+            Or <Link to="/login"><Format id={'sign-in'} /></Link>
           </Form>
         </Spin>
       </div>

src/routes/Login.js

@@ -61,9 +61,9 @@ class Login extends React.Component {
               )}
               <Link to="/forgot" className="login-form-forgot"><Format id={'forgot-password'} /></Link>
               <Button type="primary" htmlType="submit" className="login-form-button">
-                <Format id={'login'} />
+                <Format id={'sign-in'} />
               </Button>
-              Or <Link to="/register"><Format id={'register-now'} /></Link>
+              Or <Link to="/register"><Format id={'sign-up'} /></Link>
             </FormItem>
           </Form>
         </Spin>
@@ -74,11 +74,9 @@ class Login extends React.Component {
 
 function mapStateToProps(state) {
   const {
-    common: { language },
     auth: { isLoginSubmit },
   } = state;
   return {
-    language,
     isLoginSubmit,
   };
 }

src/routes/Profiles.js

 import { Button, Form, Icon, Input, Spin, Tabs } from 'antd';
 import { connect } from 'dva';
-import React from 'react';
+import React, { PropTypes } from 'react';
+import { FormattedMessage as Format } from 'react-intl';
 import EmailForm from '../components/EmailForm';
 import PasswordForm from '../components/PasswordForm';
 import UserNameForm from '../components/UserNameForm';
@@ -17,6 +18,10 @@ const formItemLayout = {
 
 class Profiles extends React.Component {
 
+  static contextTypes = {
+    intl: PropTypes.object.isRequired,
+  }
+
   onUpdateSubmit = (e) => {
     const { form, dispatch, data: { id } } = this.props;
 
@@ -33,27 +38,28 @@ class Profiles extends React.Component {
   };
 
   render() {
-    const { dispatch, form, data, isUpdateSubmit=false, checkUsername, isUserNameExists } = this.props
-    const { getFieldDecorator } = form;    
-    const { username, name, id } = data
+    const { dispatch, form, data, isUpdateSubmit=false, checkUsername, isUserNameExists } = this.props;
+    const { getFieldDecorator } = form;
+    const { username, name, id } = data;
+    const { intl: {messages} } = this.context;
 
     const nameProps = {
       fromItem: {
-        label: "name",
+        label: 'name',
         ...formItemLayout
       },
       decorator: {
-        initialValue: name                        
+        initialValue: name
       },
       input: {
-        placeholder: "name",
+        placeholder: 'name',
       }
     }
 
     return (
       <Spin spinning={isUpdateSubmit} delay={500}>
         <Tabs defaultActiveKey="1" className="app-detail-nav">
-          <TabPane tab={<span><Icon type="setting" /> 基本信息 </span>} key="1">
+          <TabPane tab={<span><Icon type="setting" /><Format id={'user-info'} /> </span>} key="1">
             <Form onSubmit={this.onUpdateSubmit}>
 
               <FormItem {...nameProps.fromItem}>
@@ -64,24 +70,24 @@ class Profiles extends React.Component {
 
               <FormItem>
                 <div className={styles.wrapSubmit}>
-                  <Button type="primary" htmlType="submit" size="large">提交</Button>
+                  <Button type="primary" htmlType="submit" size="large"><Format id={'save'}/></Button>
                 </div>
               </FormItem>
             </Form>
           </TabPane>
 
-          <TabPane tab={<span><Icon type="setting" /> 账户信息 </span>} key="2">
+          <TabPane tab={<span><Icon type="setting" /><Format id={'account-info'}/></span>} key="2">
 
             <Tabs type="card" className="app-detail-nav">
-              <TabPane tab={'修改用户名'} key={0}>
+              <TabPane tab={messages['reset-username']} key={0}>
                 <UserNameForm />
               </TabPane>
 
-              <TabPane tab={'修改邮箱'} key={1}>
+              <TabPane tab={messages['reset-email']}key={1}>
                 <EmailForm />
               </TabPane>
 
-              <TabPane tab={'修改密码'} key={2}>
+              <TabPane tab={messages['reset-password']}key={2}>
                 <PasswordForm />
               </TabPane>
             </Tabs>

src/routes/Register.js

@@ -138,9 +138,9 @@ class Register extends React.Component {
             </FormItem>
 
             <Button type="primary" htmlType="submit" className="login-form-button">
-              <Format id={'register'} />
+              <Format id={'sign-up'} />
             </Button>
-            Or <Link to="/login"><Format id={'login'} /></Link>
+            Or <Link to="/login"><Format id={'sign-in'} /></Link>
           </Form>
         </Spin>
       </div>

src/routes/Reset.js

 import { Button, Form, Icon, Input, Select, Spin } from 'antd';
 import { connect } from 'dva';
+import { FormattedMessage as Format } from 'react-intl';
 import React from 'react';
 const FormItem = Form.Item;
 const Option = Select.Option;

src/services/auth.js

@@ -56,5 +56,3 @@ export async function checkUserExists(params) {
   });
 }
 
-
-