add language switch in settings page

src/pages/user/settings/settings.tsx

@@ -1,10 +1,36 @@
-import { AtButton } from 'taro-ui';
+import { AtButton, AtList, AtListItem } from 'taro-ui';
 import { Component, ReactNode } from 'react';
 import './settings.scss';
 import Taro from '@tarojs/taro';
-import { View } from '@tarojs/components';
+import { View, Picker } from '@tarojs/components';
+import pt, { Lang } from '@/plain-text';
 
 export default class SettingsPage extends Component {
+  showLangDict: Record<string, Lang> = {
+    简体中文: 'zh_CN',
+    English: 'en_US',
+  };
+
+  reversedShowLangDict: Record<Lang, string> = {
+    zh_CN: '简体中文',
+    en_US: 'English',
+  };
+
+  state = {
+    selector: ['简体中文', 'English'],
+    selectorChecked: this.reversedShowLangDict[pt.getCurLang()],
+  };
+
+  onSelect = (e: { detail: { value: string | number } }) => {
+    this.setState({
+      selectorChecked: this.state.selector[e.detail.value],
+    });
+    pt.setLang(this.showLangDict[this.state.selector[e.detail.value]]);
+    Taro.reLaunch({
+      url: '/pages/index/index',
+    });
+  };
+
   handleQuit() {
     console.log('Quit');
   }
@@ -17,6 +43,20 @@ export default class SettingsPage extends Component {
   render(): ReactNode {
     return (
       <View>
+        <View>
+          <Picker
+            mode='selector'
+            range={this.state.selector}
+            onChange={this.onSelect}
+          >
+            <AtList>
+              <AtListItem
+                title='语言 / Language'
+                extraText={this.state.selectorChecked}
+              />
+            </AtList>
+          </Picker>
+        </View>
         <AtButton type='secondary' onClick={this.handleAbout.bind(this)}>
           关于 EVA Notify
         </AtButton>

src/plain-text/index.ts

@@ -46,6 +46,10 @@ class PlainText {
     }
     return this.textZhCn;
   }
+
+  getCurLang(): Lang {
+    return this.lang;
+  }
 }
 
 const pt = new PlainText();