forgeplus-react/src/forge/Component/EducoderAccount.jsx

import React , {forwardRef, useEffect} from 'react';
import { Modal , Form , Input , Button , message} from 'antd';
import './EAccount.scss';
import axios from 'axios';

function EducoderAccount({form , visible , current_user , onCancel,isCancel,showNotification}){
  const { getFieldDecorator, validateFields , setFieldsValue } = form;

  useEffect(()=>{
    if(current_user && current_user.email){
      setFieldsValue({email:current_user.email})
    }
  },[current_user])

  function onOk(values){
    let url = `/accounts/gitea_register.json`;
    // const { email , is_sync_pwd} = current_user;
    // if(email && !is_sync_pwd){
    //   url = `/users/change_password.json`;
    // }
    axios.post(url,{
      login:current_user && current_user.login,
      ...values
    }).then(result=>{
      if(result && result.data && result.data.status === 0){
        window.location.reload();
      }
    }).catch(error=>{})
  }

  function onSure(){
    validateFields((error,values)=>{
      if(!error){
        let reg = /^[a-zA-Z0-9]+([.\-_\\]*[a-zA-Z0-9])*@([a-z0-9]+[-a-z0-9]*[a-z0-9]+.){1,63}[a-z0-9]+$/;
				if (reg.test(values.email)) {
          onOk(values);
        }else{
          showNotification && showNotification("请输入正确的邮箱账号！");
        }
      }
    })
  }
  const layout = {
    labelCol: { span: 5 },
    wrapperCol: { span: 18 },
  };
  return(
    <Modal 
      visible={visible}
      title="提示"
      width="500px"
      maskClosable={isCancel}
      onCancel={onCancel}
      footer={
        <Button type="primary" onClick={onSure}>确定</Button>
      }
      centered
    >
      <div>
        <p className="mb15 edu-txt-center" style={{maxWidth:"350px",margin:"0px auto"}}>
          { 
          current_user && current_user.email ? 
          `平台已检测到您已绑定邮箱${current_user.email},请您确认如下操作`
          :
          "平台已检测到您未绑定邮箱，为了不影响协同开发部分功能的使用，建议先绑定邮箱"
          }
        </p>
        <Form {...layout}>
          <Form.Item label="邮箱">
            {getFieldDecorator("email",{
              rules:[
                {required:true,message:"请输入邮箱账号"}
              ]
            })(
              <Input placeholder="请输入您的邮箱账号" width="220px" disabled={current_user && current_user.email}/>
            )}
          </Form.Item>
          <Form.Item label="密码">
            {getFieldDecorator("password",{
              rules:[{required:true,message:"请输入您的平台密码"}]
            })(
              <Input.Password placeholder="请输入您的平台密码" width="220px"/>
            )}
          </Form.Item>
        </Form>
      </div>
    </Modal>
  )
}
export default Form.create()(forwardRef(EducoderAccount));