import React, { useState } from 'react';
import { Modal , Menu } from 'antd';
import "./Index.scss";
import Login from './Login';
import Register from './Register';

function LoginModal({visible,onCancel,successFunc}){
  const [ n , setN ] = useState("0");

  return(
    <Modal
      visible={visible}
      closable={true}
      width="440px"
      title={false}
      footer={false}
      className="loginModal"
      centered
      onCancel={onCancel}
    >
      <Menu defaultSelectedKeys={[n]} mode={"horizontal"}>
        <Menu.Item key="0" onClick={(e)=>setN(e.key)}>登录</Menu.Item>
        <Menu.Item key="1" onClick={(e)=>setN(e.key)}>注册</Menu.Item>
      </Menu>
      <div className="content">
        {
          n === "0"?
          <Login successFunc={successFunc} visible={visible}/>
          :
          <Register successFunc={successFunc} visible={visible}/>
        }
      </div>
    </Modal>
  )
}
export default LoginModal;