From 663e34aba4fab2db8821b3e3591a718864c8c6e4 Mon Sep 17 00:00:00 2001
From: ddcat1115 <ddcat1115@gmail.com>
Date: Thu, 8 Mar 2018 14:43:57 +0800
Subject: [PATCH] base framework

---
 package.json                    |  1 +
 src/locale/en-US.js             | 14 +++++++++++
 src/locale/zh-CN.js             | 14 +++++++++++
 src/pages/Dashboard/Analysis.js | 25 ++++++++++++++++---
 src/router.js                   | 43 +++++++++++++++++++++------------
 5 files changed, 78 insertions(+), 19 deletions(-)
 create mode 100644 src/locale/en-US.js
 create mode 100644 src/locale/zh-CN.js

diff --git a/package.json b/package.json
index 03ec7e39..be450b75 100755
--- a/package.json
+++ b/package.json
@@ -41,6 +41,7 @@
     "react-copy-to-clipboard": "^5.0.1",
     "react-document-title": "^2.0.3",
     "react-fittext": "^1.0.0",
+    "react-intl": "^2.4.0",
     "rollbar": "^2.3.4",
     "rollup": "^0.62.0",
     "rollup-plugin-json": "^3.0.0",
diff --git a/src/locale/en-US.js b/src/locale/en-US.js
new file mode 100644
index 00000000..a87f0531
--- /dev/null
+++ b/src/locale/en-US.js
@@ -0,0 +1,14 @@
+import appLocaleData from 'react-intl/locale-data/en';
+import antdEn from 'antd/lib/locale-provider/en_US';
+// import enMessages from '../../locales/en.json';
+
+export default {
+  locale: 'en-US',
+  data: appLocaleData,
+  antd: antdEn,
+  messages: {
+    'app.home.introduce': 'introduce',
+    'app.analysis.test': 'Gongzhuan road No.{no} shop',
+  // ...enMessages,
+  },
+};
diff --git a/src/locale/zh-CN.js b/src/locale/zh-CN.js
new file mode 100644
index 00000000..9f5cb223
--- /dev/null
+++ b/src/locale/zh-CN.js
@@ -0,0 +1,14 @@
+import appLocaleData from 'react-intl/locale-data/zh';
+import antdZh from 'antd/lib/locale-provider/zh_CN';
+// import zhMessages from '../../locales/zh.json';
+
+export default {
+  locale: 'zh-CN',
+  data: appLocaleData,
+  antd: antdZh,
+  messages: {
+    'app.home.introduce': '介绍',
+    'app.analysis.test': '工专路 {no} 号店',
+  // ...zhMessages,
+  },
+};
diff --git a/src/pages/Dashboard/Analysis.js b/src/pages/Dashboard/Analysis.js
index 072f79fa..42206e22 100644
--- a/src/pages/Dashboard/Analysis.js
+++ b/src/pages/Dashboard/Analysis.js
@@ -1,5 +1,6 @@
 import React, { Component } from 'react';
 import { connect } from 'dva';
+import { injectIntl } from 'react-intl';
 import {
   Row,
   Col,
@@ -47,7 +48,23 @@ for (let i = 0; i < 7; i += 1) {
   chart,
   loading: loading.effects['chart/fetch'],
 }))
-export default class Analysis extends Component {
+class Analysis extends Component {
+  constructor(props) {
+    super(props);
+    const { intl } = props;
+    this.rankingListData = [];
+    for (let i = 0; i < 7; i += 1) {
+      this.rankingListData.push({
+        title: intl.formatMessage({ id: 'app.analysis.test' }, { no: i }),
+        total: 323234,
+      });
+    }
+    this.state = {
+      salesType: 'all',
+      currentTabKey: '',
+      rangePickerValue: getTimeDistance('year'),
+    };
+  }
   state = {
     salesType: 'all',
     currentTabKey: '',
@@ -354,7 +371,7 @@ export default class Analysis extends Component {
                     <div className={styles.salesRank}>
                       <h4 className={styles.rankingTitle}>门店销售额排名</h4>
                       <ul className={styles.rankingList}>
-                        {rankingListData.map((item, i) => (
+                        {this.rankingListData.map((item, i) => (
                           <li key={item.title}>
                             <span className={i < 3 ? styles.active : ''}>{i + 1}</span>
                             <span>{item.title}</span>
@@ -377,7 +394,7 @@ export default class Analysis extends Component {
                     <div className={styles.salesRank}>
                       <h4 className={styles.rankingTitle}>门店访问量排名</h4>
                       <ul className={styles.rankingList}>
-                        {rankingListData.map((item, i) => (
+                        {this.rankingListData.map((item, i) => (
                           <li key={item.title}>
                             <span className={i < 3 ? styles.active : ''}>{i + 1}</span>
                             <span>{item.title}</span>
@@ -503,3 +520,5 @@ export default class Analysis extends Component {
     );
   }
 }
+
+export default injectIntl(Analysis);
diff --git a/src/router.js b/src/router.js
index 15e2634a..88c83517 100644
--- a/src/router.js
+++ b/src/router.js
@@ -1,12 +1,14 @@
 import React from 'react';
 import { routerRedux, Route, Switch } from 'dva/router';
 import { LocaleProvider, Spin } from 'antd';
-import zhCN from 'antd/lib/locale-provider/zh_CN';
 import dynamic from 'dva/dynamic';
+import { addLocaleData, IntlProvider } from 'react-intl';
 import { getRouterData } from './common/router';
 import Authorized from './utils/Authorized';
 import { getQueryPath } from './utils/utils';
 import styles from './index.less';
+import enLocale from './locale/en-US';
+import cnLocale from './locale/zh-CN';
 
 const { ConnectedRouter } = routerRedux;
 const { AuthorizedRoute } = Authorized;
@@ -14,26 +16,35 @@ dynamic.setDefaultLoadingComponent(() => {
   return <Spin size="large" className={styles.globalSpin} />;
 });
 
+function getLang() {
+  return (window.localStorage && localStorage.getItem('locale')) ||
+    (navigator.language || navigator.browserLanguage).toLowerCase() === 'en-us'
+    ? 'en-US'
+    : 'zh-CN';
+}
+
 function RouterConfig({ history, app }) {
   const routerData = getRouterData(app);
   const UserLayout = routerData['/user'].component;
   const BasicLayout = routerData['/'].component;
+  const appLocale = getLang() === 'zh-CN' ? cnLocale : enLocale;
+  addLocaleData(appLocale.data);
   return (
-    <LocaleProvider locale={zhCN}>
-      <ConnectedRouter history={history}>
-        <Switch>
-          <Route path="/user" component={UserLayout} />
-          <AuthorizedRoute
-            path="/"
-            render={props => <BasicLayout {...props} />}
-            authority={['admin', 'user']}
-            redirectPath={getQueryPath('/user/login', {
-              redirect: window.location.href,
-            })}
-          />
-        </Switch>
-      </ConnectedRouter>
-    </LocaleProvider>
+    <IntlProvider locale={appLocale.locale} messages={appLocale.messages}>
+      <LocaleProvider locale={appLocale.antd}>
+        <ConnectedRouter history={history}>
+          <Switch>
+            <Route path="/user" component={UserLayout} />
+            <AuthorizedRoute
+              path="/"
+              render={props => <BasicLayout {...props} />}
+              authority={['admin', 'user']}
+              redirectPath="/user/login"
+            />
+          </Switch>
+        </ConnectedRouter>
+      </LocaleProvider>
+    </IntlProvider>
   );
 }
 
-- 
GitLab