import React,{Component,Fragment} from "react";

import './style.css';

import axios from "axios";

import {Redirect}  from 'react-router-dom';

class Vip extends Component{

    constructor(props) {

        super(props);

        this.state={

            login:false,

            fetchFinish:false

        }

    }

    componentDidMount() {

        const promise=axios.get("http://www.dell-lee.com/react/api/isLogin.json",{

            withCredentials: true

        });

        promise.then((res)=>{

            this.setState({

                login:res.data.data.login,

                fetchFinish:true

            })

        })

    }

    render(){

                if(this.state.login===true){

                    if(this.state.fetchFinish==true){

                        return  <div className='vip'>vip</div>

                    }else{

                        return <div className='vip'>正在判断</div>

                    }

            }else{

                return <Redirect to='/'/>

                }

    }

}

export default Vip;

import React,{Component,Fragment} from "react";

import './style.css';

import {Button} from "antd";

import {Link} from 'react-router-dom';

import axios from 'axios';

import {Modal} from 'antd';

import { Input,message} from 'antd';

import {withRouter} from 'react-router-dom';

class Log extends Component{

    constructor(props) {

        super(props);

        this.state={

           status:false,

           modal:false,

            password:"",

            username:""

        }

    }

    handlebtn(){

    this.setState({

        modal:true

    })

    }

    handleOk(){

        const promise=axios.get("http://www.dell-lee.com/react/api/login.json?user="+this.state.username+"&password="+this.state.password);

promise.then((res)=>{

            if(res.data.data.login==true){

                  message.success("登录成功");

                this.setState({

                    modal:false,

                    status:true

                })

            }else{

                message.error("登录失败")

            }

        })

    }

    handleCancel(){

        this.setState({

            modal:false

        })

    }

    handllogout(){

        const promise=axios.get("http://www.dell-lee.com/react/api/logout.json");

        promise.then((res)=>{

            if(res.data.data.logout==true){

                this.setState({

                    status:false

                })

            }

        })

    }

    judgebtn(){

        if(this.state.status==false){

            return   <Button className='btn' type="primary" onClick={this.handlebtn.bind(this)}>登录</Button>

        }else{

            return   <Button className='btn' type="primary" onClick={this.handllogout.bind(this)}>

                <Link to='/'>

                退出

                </Link>

            </Button>

        }

    }

    componentDidMount() {

        const promise=axios.get("http://www.dell-lee.com/react/api/isLogin.json");

        promise.then((res)=>{

          this.setState({

              status:res.data.data.login

          })

        })

    }

    handleusrename(e){

        this.setState({

            username:e.target.value

        })

    }

    handlepwd(e){

        this.setState({

            password:e.target.value

        })

    }

    render(){

        return(

            <Fragment>

                {

                this.judgebtn()

            }

               <Link to='/vip'>

                <Button className='btn' type="primary">vip</Button>

               </Link>

                <Modal

                    title="登录"

                    visible={this.state.modal}

                    onOk={this.handleOk.bind(this)}

                    onCancel={this.handleCancel.bind(this)}

                >

                    <Input placeholder="请输入账号" className='inputbtn' onChange={this.handleusrename.bind(this)}/>

                    <Input placeholder="请输入密码" onChange={this.handlepwd.bind(this)}/>

                </Modal>

           </Fragment>

        )

    }

}

export default withRouter(Log);

import React,{Component,Fragment} from 'react';

import ReactDOM from 'react-dom';

import 'antd/dist/antd.css';

import {BrowserRouter,Route,Link,Switch,withRouter} from 'react-router-dom';

import { Layout } from 'antd';

import './style.css';

import Headerapp from './component/head';

import Home from './component/container/Home';

import Detail from "./component/container/Detail";

import Log from './component/login';

import Vip from './component/Vip';

const { Header, Footer, Sider, Content } = Layout;

class Entry extends Component{

    render(){

        return(

            <BrowserRouter>

                <Layout>

                    <Header className='header'>

                        <Headerapp/>

                    </Header>

                    <Content className='content'>

                        <Log/>

                    <Switch>

                        <Route path='/vip' component={Vip}></Route>

                        <Route path='/detail/:id' component={Detail}></Route>

                        <Route path='/:id?' component={Home}></Route>

                    </Switch>

                    </Content>

                    <Footer className='footer'>@MengMeng</Footer>

                </Layout>

            </BrowserRouter>

        )

    }

}

ReactDOM.render(

<Entry/>,

  document.getElementById('root')

);