From 00a9e71de91895cf55a9a15bb3630ebc0897b3f9 Mon Sep 17 00:00:00 2001
From: lishuang <ziclax@163.com>
Date: Sat, 20 Jun 2020 14:11:22 +0800
Subject: [PATCH] Ready to refine the global i18n feature.

---
 package.json                      |  2 ++
 src/App.tsx                       |  7 ++---
 src/common/model/global/Moon.ts   | 12 ++++++++
 src/common/model/global/Sun.ts    |  6 ++++
 src/common/util/BrowserUtil.ts    | 15 ++++++++++
 src/pages/Frame.tsx               |  3 +-
 src/pages/index/Index.less        |  5 ----
 src/pages/index/Index.tsx         | 49 -------------------------------
 src/pages/layout/BottomLayout.tsx | 11 ++++++-
 src/pages/preference/Index.tsx    |  2 ++
 10 files changed, 50 insertions(+), 62 deletions(-)
 delete mode 100644 src/pages/index/Index.less
 delete mode 100644 src/pages/index/Index.tsx

diff --git a/package.json b/package.json
index a0d0383..39cd241 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     "@testing-library/react": "^9.3.2",
     "@testing-library/user-event": "^7.1.2",
     "@types/echarts": "^4.6.1",
+    "@types/js-cookie": "^2.2.6",
     "@types/photoswipe": "^4.1.0",
     "antd": "^4.3.1",
     "axios": "^0.19.2",
@@ -17,6 +18,7 @@
     "echarts-for-react": "^2.0.16",
     "fs-extra": "^8.1.0",
     "identity-obj-proxy": "3.0.0",
+    "js-cookie": "^2.2.1",
     "photoswipe": "^4.1.3",
     "qs": "^6.9.4",
     "react": "^16.13.1",
diff --git a/src/App.tsx b/src/App.tsx
index db2c4a4..836c7ac 100644
--- a/src/App.tsx
+++ b/src/App.tsx
@@ -1,19 +1,16 @@
 import React from 'react';
 import './App.less';
-import {Button} from "antd";
 import {BrowserRouter as Router} from "react-router-dom";
 import {ConfigProvider} from 'antd';
 import Frame from "./pages/Frame";
-import zhCN from 'antd/lib/locale-provider/zh_CN';
-
+import en_US from 'antd/es/locale/en_US';
 
 function App() {
   return (
     <Router>
-      <ConfigProvider locale={zhCN}>
+      <ConfigProvider locale={en_US}>
         <Frame/>
       </ConfigProvider>
-
     </Router>
   );
 }
diff --git a/src/common/model/global/Moon.ts b/src/common/model/global/Moon.ts
index be270f5..b03061f 100644
--- a/src/common/model/global/Moon.ts
+++ b/src/common/model/global/Moon.ts
@@ -5,6 +5,8 @@
  */
 import User from "../user/User";
 import Preference from "../preference/Preference";
+import BrowserUtil from "../../util/BrowserUtil";
+import Cookies from "js-cookie";
 
 export default class Moon {
 
@@ -24,6 +26,16 @@ export default class Moon {
   static getSingleton(): Moon {
     if (Moon.singleton == null) {
       Moon.singleton = new Moon();
+
+      //读取默认的语言
+      let lang = BrowserUtil.browserLang()
+      let localLang = Cookies.get("_lang");
+      if (localLang === "zh" || localLang === "en") {
+        lang = localLang
+      }
+      Moon.singleton.lang = lang
+      console.log("当前浏览器默认语言是：", lang)
+
     }
 
     return Moon.singleton
diff --git a/src/common/model/global/Sun.ts b/src/common/model/global/Sun.ts
index 56f5e4d..40d1a19 100644
--- a/src/common/model/global/Sun.ts
+++ b/src/common/model/global/Sun.ts
@@ -3,6 +3,9 @@
  * 这个类不包含Base的子类，比如User, Preference.
  * 和Moon形成姊妹篇
  */
+import BrowserUtil from "../../util/BrowserUtil";
+import Cookies from "js-cookie"
+
 export default class Sun {
 
   //全局的一个store对象
@@ -17,6 +20,8 @@ export default class Sun {
   //全局布局样式，是否展示出左边的菜单.
   showDrawer: boolean = true
 
+
+
   //由于这个类采用单例模式，因此所有属性都是独一份的。
   constructor() {
 
@@ -26,6 +31,7 @@ export default class Sun {
   static getSingleton(): Sun {
     if (Sun.singleton == null) {
       Sun.singleton = new Sun();
+
     }
     return Sun.singleton
   }
diff --git a/src/common/util/BrowserUtil.ts b/src/common/util/BrowserUtil.ts
index 7ab9b66..4e2219e 100644
--- a/src/common/util/BrowserUtil.ts
+++ b/src/common/util/BrowserUtil.ts
@@ -110,4 +110,19 @@ export default class BrowserUtil {
     return window.location.protocol + "//" + window.location.host
   }
 
+
+  //只支持zh和en
+  static browserLang() {
+    //常规浏览器语言和IE浏览器
+    let lang = navigator.language || (navigator as any).userLanguage;
+
+    //截取lang前2位字符
+    lang = lang.substr(0, 2);
+    if (lang === "zh") {
+      return "zh"
+    } else {
+      return "en"
+    }
+  }
+
 }
diff --git a/src/pages/Frame.tsx b/src/pages/Frame.tsx
index 5812028..1080ed8 100644
--- a/src/pages/Frame.tsx
+++ b/src/pages/Frame.tsx
@@ -19,9 +19,9 @@ import InstallIndex from './install/Index';
 import MatterList from './matter/List';
 import MatterDetail from './matter/Detail';
 
+
 import ShareList from './share/List';
 import ShareDetail from './share/Detail';
-import Index from './index/Index';
 import User from '../common/model/user/User';
 import Moon from '../common/model/global/Moon';
 import Sun from '../common/model/global/Sun';
@@ -130,7 +130,6 @@ class RawFrame extends TankComponent<IProps, IState> {
                   <Route exact path="/" render={() =>
                     <Redirect to="/matter/list"/>
                   }/>
-                  <Route path="/index" component={Index}/>
                   <Route path="/user/login" component={UserLogin}/>
                   <Route path="/user/detail/:uuid" component={UserDetail}/>
                   <Route path="/user/list" component={UserList}/>
diff --git a/src/pages/index/Index.less b/src/pages/index/Index.less
deleted file mode 100644
index 13016d9..0000000
--- a/src/pages/index/Index.less
+++ /dev/null
@@ -1,5 +0,0 @@
-
-.index-page {
-
-  padding: 20px;
-}
diff --git a/src/pages/index/Index.tsx b/src/pages/index/Index.tsx
deleted file mode 100644
index 9b27eb6..0000000
--- a/src/pages/index/Index.tsx
+++ /dev/null
@@ -1,49 +0,0 @@
-import React from 'react';
-import { RouteComponentProps } from 'react-router-dom';
-import './Index.less';
-import TankComponent from '../../common/component/TankComponent';
-import Moon from '../../common/model/global/Moon';
-import User from '../../common/model/user/User';
-
-interface IProps extends RouteComponentProps {
-
-}
-
-interface IState {
-
-}
-
-
-export default class Index extends TankComponent<IProps, IState> {
-
-  user: User = Moon.getSingleton().user;
-
-  constructor(props: IProps) {
-    super(props);
-
-    this.state = {};
-  }
-
-
-  componentDidMount() {
-    let that = this;
-
-    that.updateUI();
-  }
-
-
-  render() {
-
-    let that = this;
-
-    return (
-      <div className="index-page">
-
-        <h1>欢迎来到蓝眼博客，这里是首页，内容正在开发中。</h1>
-
-      </div>
-    );
-  }
-}
-
-
diff --git a/src/pages/layout/BottomLayout.tsx b/src/pages/layout/BottomLayout.tsx
index 37fff36..d76692b 100644
--- a/src/pages/layout/BottomLayout.tsx
+++ b/src/pages/layout/BottomLayout.tsx
@@ -4,6 +4,7 @@ import TankComponent from "../../common/component/TankComponent";
 import Preference from "../../common/model/preference/Preference";
 import Moon from "../../common/model/global/Moon";
 import DefaultLogoPng from '../../assets/image/logo.png';
+import Cookies from "js-cookie";
 
 interface IProps {
 
@@ -26,6 +27,14 @@ export default class BottomLayout extends TankComponent <IProps, IState> {
 
   changeLang() {
 
+    if (Moon.getSingleton().lang === 'zh') {
+      Moon.getSingleton().lang = 'en'
+    } else {
+      Moon.getSingleton().lang = 'zh'
+    }
+    Cookies.set('_lang', Moon.getSingleton().lang);
+
+    this.updateUI()
   }
 
   render() {
@@ -43,7 +52,7 @@ export default class BottomLayout extends TankComponent <IProps, IState> {
           <span dangerouslySetInnerHTML={{__html: preference.record}}/>
 		</span>
         <span className="item">
-			<span onClick={this.changeLang.bind(this)}>
+			<span className="link" onClick={this.changeLang.bind(this)}>
         {Moon.getSingleton().lang === 'zh' ? 'English' : '中文'}
       </span>
       </span>
diff --git a/src/pages/preference/Index.tsx b/src/pages/preference/Index.tsx
index c14345d..a6e8f5b 100644
--- a/src/pages/preference/Index.tsx
+++ b/src/pages/preference/Index.tsx
@@ -116,6 +116,8 @@ export default class Index extends TankComponent<IProps, IState> {
               https://tank-doc.eyeblue.cn/zh
             </a>
           </InfoCell>
+
+          
         </TankContentCard>
 
       </div>