/**
 * 根应用
 * User: bjyangxiuwu
 * Date: 2018/12/17
 * Time: 16:23
 */

import React, { Component } from 'react';
import Header from 'COMPONENT/container/Header';
import Sidebar from 'COMPONENT/container/Sidebar';
import Footer from 'COMPONENT/container/Footer';
import Watermark from 'COMPONENT/container/Watermark';
import routes from 'ROUTE';
import Transition from 'react-transition-group/Transition';
import PropTypes from 'prop-types';
import projectConfig from 'CONFIG/projectConfig.json';

import { withRouter } from 'react-router';
import classNames from 'classnames';
import './index.scss';

const App = class extends Component {
    propTypes = {
        history: PropTypes.string.isRequired,
        children: PropTypes.objectOf.isRequired
    }

    constructor(props, context) {
        super(props, context);
        this.state = {
            loading: true
        }
    }

    componentDidMount() {
        setTimeout(() => {
            this.setState({
                loading: false
            });
        }, 1000);
    }

    render() {
        const { loading } = this.state;
        const { children, history } = this.props;
        return (
            <Transition timeout={500} in={!loading}>
                {status => (
                    <div className="main-body">
                        <div className={`body-warp fadeIn fadeIn-${status}`}>
                            { projectConfig.noHeader ? '' : <Header className="header" history={history} /> }
                            <main className="content">{children}</main>
                            { projectConfig.noFooter ? '' : <Footer /> }
                        </div>
                        <Sidebar
                            history={history}
                            className={classNames(`slideRight slideRight-${status}`)}
                            routePaths={routes}
                        />
                        <Watermark />
                    </div>
                )}
            </Transition>
        )
    }
}

export default withRouter(App);