online/src/login/Login.js

import React, {Component} from 'react';
import LoginInput from './LoginInput';
import CloudConfig from "./CloudConfig";
import AccountConfig from "./AccountConfig";

import {Layout} from 'antd';
import './index.css';

const {Content} = Layout;
class Login extends Component {
    constructor() {
        super();
        this.state = {
            userID: ''
        }
    }

    getUserId = (id) => {
        this.setState({
            userID: id
        })
    };


    render() {
        return (
            <Layout style={{padding: '24px', zIndex: '0'}}>
                <Content style={{padding: '24px', minHeight: 280, background: '#fff'}}>

                        {
                            this.props.match.params.setting ?
                                this.props.match.params.setting === 'account' ?
                                    <AccountConfig history={this.props.history}/>
                                    :
                                    <CloudConfig userID={this.state.userID} history={this.props.history}/>
                                :
                                <LoginInput history={this.props.history} getUserId={this.getUserId}/>
                        }

                </Content>
            </Layout>
        )
    }
}

export default Login;