import React from 'react'
import { Redirect } from 'dva/router'
import Relogin from '../components/common/login/relogin'
import { connect } from 'dva'
import './authLayout.less'

class AuthLayout extends React.Component {

    constructor(props) {
        super(props);
        this.state = ({
            checking: true
        });
    }

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

    componentWillUnmount = () => {
        window.clearTimeout(this.t)
    }

    render() {
        const { location, children, main } = this.props;
        const { isLogin, authenticated,  } = main;
        const { checking } = this.state

        return (
            isLogin ? (
                <div style={{ width: '100%', height: '100%' }}>
                    { children }
                    { !checking && !authenticated && (
                        <Relogin
                            visibleBox={true}
                        ></Relogin>
                    ) }
                </div>
            ) : (
                <div style={{ width: '100%', height: '100%' }}>
                    { children }
                    { !checking && <Redirect
                        to={{
                            pathname: '/login',
                            state: { from: location }
                        }}
                    ></Redirect>}
                </div>
            )
        )
    }
}

function mapStateToProps({ present: { main } }) {
    return { main };
}

export default connect(mapStateToProps)(AuthLayout)