2016-11-09 19:55:14 +08:00
|
|
|
import React, { cloneElement } from 'react';
|
2016-05-27 11:48:08 +08:00
|
|
|
import ReactDOM from 'react-dom';
|
2017-04-12 04:49:08 +08:00
|
|
|
import PropTypes from 'prop-types';
|
2016-05-27 11:48:08 +08:00
|
|
|
import { addLocaleData, IntlProvider } from 'react-intl';
|
|
|
|
import Header from './Header';
|
|
|
|
import Footer from './Footer';
|
2016-09-27 10:06:34 +08:00
|
|
|
import enLocale from '../../en-US';
|
|
|
|
import cnLocale from '../../zh-CN';
|
2016-10-18 11:18:25 +08:00
|
|
|
import * as utils from '../utils';
|
2016-05-27 11:48:08 +08:00
|
|
|
|
2016-11-21 14:39:15 +08:00
|
|
|
if (typeof window !== 'undefined') {
|
|
|
|
/* eslint-disable global-require */
|
|
|
|
require('../../static/style');
|
|
|
|
|
|
|
|
// Expose to iframe
|
|
|
|
window.react = React;
|
|
|
|
window['react-dom'] = ReactDOM;
|
|
|
|
window.antd = require('antd');
|
|
|
|
/* eslint-enable global-require */
|
|
|
|
}
|
2016-05-27 11:48:08 +08:00
|
|
|
|
2016-06-03 15:26:25 +08:00
|
|
|
export default class Layout extends React.Component {
|
|
|
|
static contextTypes = {
|
2017-04-12 04:49:08 +08:00
|
|
|
router: PropTypes.object.isRequired,
|
2016-06-03 15:26:25 +08:00
|
|
|
}
|
|
|
|
|
2016-12-09 13:02:16 +08:00
|
|
|
constructor(props) {
|
|
|
|
super(props);
|
2017-10-09 13:23:20 +08:00
|
|
|
const { pathname } = props.location;
|
2016-12-09 13:02:16 +08:00
|
|
|
const appLocale = utils.isZhCN(pathname) ? cnLocale : enLocale;
|
|
|
|
addLocaleData(appLocale.data);
|
|
|
|
this.state = {
|
|
|
|
isFirstScreen: true,
|
|
|
|
appLocale,
|
|
|
|
};
|
|
|
|
}
|
2016-11-09 19:55:14 +08:00
|
|
|
|
2016-06-03 15:26:25 +08:00
|
|
|
componentDidMount() {
|
2017-01-07 23:30:33 +08:00
|
|
|
if (typeof window.ga !== 'undefined') {
|
2016-06-03 15:26:25 +08:00
|
|
|
this.context.router.listen((loc) => {
|
|
|
|
window.ga('send', 'pageview', loc.pathname + loc.search);
|
|
|
|
});
|
|
|
|
}
|
2016-07-26 17:40:08 +08:00
|
|
|
|
2016-12-09 14:24:38 +08:00
|
|
|
const nprogressHiddenStyle = document.getElementById('nprogress-style');
|
|
|
|
if (nprogressHiddenStyle) {
|
2016-07-26 17:40:08 +08:00
|
|
|
this.timer = setTimeout(() => {
|
2016-12-09 14:24:38 +08:00
|
|
|
nprogressHiddenStyle.parentNode.removeChild(nprogressHiddenStyle);
|
|
|
|
}, 0);
|
2016-06-23 21:10:02 +08:00
|
|
|
}
|
|
|
|
}
|
|
|
|
|
|
|
|
componentWillUnmount() {
|
|
|
|
clearTimeout(this.timer);
|
2016-06-03 15:26:25 +08:00
|
|
|
}
|
|
|
|
|
2016-11-09 19:55:14 +08:00
|
|
|
onEnterChange = (mode) => {
|
|
|
|
this.setState({
|
|
|
|
isFirstScreen: mode === 'enter',
|
|
|
|
});
|
|
|
|
}
|
|
|
|
|
2016-06-03 15:26:25 +08:00
|
|
|
render() {
|
2016-07-26 17:40:08 +08:00
|
|
|
const { children, ...restProps } = this.props;
|
2016-12-09 13:02:16 +08:00
|
|
|
const { appLocale, isFirstScreen } = this.state;
|
2016-06-03 15:26:25 +08:00
|
|
|
return (
|
|
|
|
<IntlProvider locale={appLocale.locale} messages={appLocale.messages}>
|
2017-09-26 23:12:47 +08:00
|
|
|
<div className="page-wrapper">
|
|
|
|
<Header {...restProps} isFirstScreen={isFirstScreen} />
|
|
|
|
{cloneElement(children, { onEnterChange: this.onEnterChange })}
|
|
|
|
<Footer {...restProps} />
|
|
|
|
</div>
|
2016-06-03 15:26:25 +08:00
|
|
|
</IntlProvider>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
}
|