2BChannelCmsBrowser/src/layouts/UserLayout.js

import React from 'react';
import { Link, Route } from 'dva/router';
import DocumentTitle from 'react-document-title';
import { Icon } from 'antd';
import GlobalFooter from '../components/GlobalFooter';
import styles from './UserLayout.less';
import logo from '../assets/logo.svg';
import { getRoutes } from '../utils/utils';

const links = [{
  title: '帮助',
  href: '',
}, {
  title: '隐私',
  href: '',
}, {
  title: '条款',
  href: '',
}];

const copyright = <div>Copyright <Icon type="copyright" /> 2017-2020 领教信息科技有限公司</div>;

class UserLayout extends React.PureComponent {
  getPageTitle() {
    const { routerData, location } = this.props;
    const { pathname } = location;
    let title = '渠道管理平台';
    if (routerData[pathname] && routerData[pathname].name) {
      title = `${routerData[pathname].name} - 渠道管理平台`;
    }
    return title;
  }
  render() {
    const { routerData, match } = this.props;
    return (
      <DocumentTitle title={this.getPageTitle()}>
        <div className={styles.outer}>
          <div className={styles.inner}>
            <div className={styles.container}>
              <div className={styles.top}>
                <div className={styles.header}>
                  <Link to="/">
                    <img alt="logo" className={styles.logo} src={logo} />
                    <span className={styles.title}>CMS Browser</span>
                  </Link>
                </div>
                <div className={styles.desc}>ChannelCMSBrowser - 渠道管理平台</div>
              </div>
              {
                getRoutes(match.path, routerData).map(item =>
                  (
                    <Route
                      key={item.key}
                      path={item.path}
                      component={item.component}
                      exact={item.exact}
                    />
                  )
                )
              }
              <GlobalFooter colorInverse className={styles.footer} links={links} copyright={copyright} />
            </div>
          </div>
        </div>
      </DocumentTitle>
    );
  }
}

export default UserLayout;