Commit 5bf31a42 authored by ι™ˆεΈ…'s avatar ι™ˆεΈ…

add change lang button

parent c035a5fc
const path = require('path');
export default {
entry: 'src/index.js',
extraBabelPlugins: [['import', { libraryName: 'antd', libraryDirectory: 'es', style: true }]],
env: {
development: {
extraBabelPlugins: ['dva-hmr'],
},
},
externals: {
'@antv/data-set': 'DataSet',
bizcharts: 'BizCharts',
rollbar: 'rollbar',
},
alias: {
components: path.resolve(__dirname, 'src/components/'),
},
ignoreMomentLocale: true,
theme: './src/theme.js',
html: {
template: './src/index.ejs',
},
publicPath: '/',
hash: true,
lessLoaderOptions: {
javascriptEnabled: true,
},
disableDynamicImport: true,
cssLoaderOptions: {
modules: true,
getLocalIdent: (context, localIdentName, localName) => {
if (
context.resourcePath.includes('node_modules') ||
context.resourcePath.includes('ant.design.pro.less')
) {
return localName;
}
const antdProPath = context.resourcePath.match(/src(.*)/)[1].replace('.less', '');
const arr = antdProPath
.split('/')
.map(a => a.replace(/([A-Z])/g, '-$1'))
.map(a => a.toLowerCase());
return `antd-pro${arr.join('-')}-${localName}`.replace(/--/g, '-');
},
},
};
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { FormattedMessage } from 'react-intl'; import { FormattedMessage } from 'react-intl';
import { Spin, Tag, Menu, Icon, Dropdown, Avatar, Tooltip } from 'antd'; import { Spin, Tag, Menu, Icon, Dropdown, Avatar, Tooltip, Button } from 'antd';
import moment from 'moment'; import moment from 'moment';
import groupBy from 'lodash/groupBy'; import groupBy from 'lodash/groupBy';
import NoticeIcon from '../NoticeIcon'; import NoticeIcon from '../NoticeIcon';
...@@ -40,6 +40,16 @@ export default class GlobalHeaderRight extends PureComponent { ...@@ -40,6 +40,16 @@ export default class GlobalHeaderRight extends PureComponent {
return groupBy(newNotices, 'type'); return groupBy(newNotices, 'type');
} }
changLang = () => {
const locale = localStorage.getItem('locale');
if (!locale || locale === 'zh-CN') {
localStorage.setItem('locale', 'en-US');
} else {
localStorage.setItem('locale', 'zh-CN');
}
location.reload();
};
render() { render() {
const { const {
currentUser, currentUser,
...@@ -141,8 +151,11 @@ export default class GlobalHeaderRight extends PureComponent { ...@@ -141,8 +151,11 @@ export default class GlobalHeaderRight extends PureComponent {
</span> </span>
</Dropdown> </Dropdown>
) : ( ) : (
<Spin size="small" style={{ marginLeft: 8 }} /> <Spin size="small" style={{ marginLeft: 8, marginRight: 8 }} />
)} )}
<Button size="small" onClick={this.changLang}>
<FormattedMessage id="navbar.lang" />
</Button>
</div> </div>
); );
} }
......
...@@ -7,6 +7,7 @@ export default { ...@@ -7,6 +7,7 @@ export default {
data: appLocaleData, data: appLocaleData,
antd: antdEn, antd: antdEn,
messages: { messages: {
'navbar.lang': 'English',
'menu.home': 'Home', 'menu.home': 'Home',
'menu.dashboard': 'Dashboard', 'menu.dashboard': 'Dashboard',
'menu.dashboard.analysis': 'Analysis', 'menu.dashboard.analysis': 'Analysis',
......
...@@ -7,6 +7,7 @@ export default { ...@@ -7,6 +7,7 @@ export default {
data: appLocaleData, data: appLocaleData,
antd: antdZh, antd: antdZh,
messages: { messages: {
'navbar.lang': 'δΈ­ζ–‡',
'menu.home': 'ι¦–ι‘΅', 'menu.home': 'ι¦–ι‘΅',
'menu.dashboard': 'Dashboard', 'menu.dashboard': 'Dashboard',
'menu.dashboard.analysis': 'εˆ†ζžι‘΅', 'menu.dashboard.analysis': 'εˆ†ζžι‘΅',
......
...@@ -322,6 +322,7 @@ class Analysis extends Component { ...@@ -322,6 +322,7 @@ class Analysis extends Component {
<Col {...topColResponsiveProps}> <Col {...topColResponsiveProps}>
<ChartCard <ChartCard
bordered={false} bordered={false}
loading={loading}
title={<FormattedMessage id="app.analysis.visits" defaultMessage="visits" />} title={<FormattedMessage id="app.analysis.visits" defaultMessage="visits" />}
action={ action={
<Tooltip <Tooltip
...@@ -349,6 +350,7 @@ class Analysis extends Component { ...@@ -349,6 +350,7 @@ class Analysis extends Component {
<Col {...topColResponsiveProps}> <Col {...topColResponsiveProps}>
<ChartCard <ChartCard
bordered={false} bordered={false}
loading={loading}
title={<FormattedMessage id="app.analysis.payments" defaultMessage="Payments" />} title={<FormattedMessage id="app.analysis.payments" defaultMessage="Payments" />}
action={ action={
<Tooltip <Tooltip
......
...@@ -18,11 +18,10 @@ dynamic.setDefaultLoadingComponent(() => { ...@@ -18,11 +18,10 @@ dynamic.setDefaultLoadingComponent(() => {
}); });
function getLang() { function getLang() {
if (window) { if (window.localStorage && localStorage.getItem('locale')) {
return 'en-US'; return localStorage.getItem('locale');
} }
return (window.localStorage && localStorage.getItem('locale')) || return (navigator.language || navigator.browserLanguage).toLowerCase() === 'en-us'
(navigator.language || navigator.browserLanguage).toLowerCase() === 'en-us'
? 'en-US' ? 'en-US'
: 'zh-CN'; : 'zh-CN';
} }
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment