import React from 'react'
import { Modal, Icon, Button } from 'antd'
import { Redirect } from 'dva/router'
import './rootLayout.less'

class RootLayout extends React.Component {
    constructor(props) {
        super(props);
        this.state = ({
            goLogin: false
        });
    }

    setGoLogin = () => {
        this.setState({
            goLogin: true
        });
    }

    render() {
        const { location, isAuthenticated, children } = this.props;
        const { goLogin } = this.state;
        return (<div className='root-layout'>
            { children }
            <Modal
                className='confirm-box'
                visible={location !=='/login' && !isAuthenticated}
                footer={null}
                closable={false}
                centered={true}
            >
                <div className='confirm-body'>
                    <div className='confirm-icon'><Icon type="info-circle" /></div>
                    <div className='confirm-label'>登录已过期</div>
                    <div className='confirm-text'>距离上次登录已经超过30分钟，请重新登录</div>
                    <div className='confirm-button'>
                        <Button type="primary" onClick={this.setGoLogin}>重新登录</Button>
                    </div>
                </div>
            </Modal>
            {goLogin && <Redirect
                to={{
                    pathname: "/login",
                    state: { from: location }
                }}
            />}
        </div>)
    }
}

export default RootLayout;