详情弹框

src/pages/Competitions/Detail/components/InitGitLink/index.less

@@ -0,0 +1,12 @@
+.formWrap {
+  width: 430px;
+  margin: 0px auto;
+  text-align: center;
+  div[class~='ant-form-item-label'] {
+    width: 70px;
+    text-align: right;
+  }
+  div[class~='ant-form-item-control-input-content'] {
+    text-align: left;
+  }
+}

src/pages/Competitions/Detail/components/InitGitLink/index.tsx

@@ -0,0 +1,139 @@
+import React, { FC , useEffect , useState } from 'react';
+import {
+  GlobalSettingModelState,
+  UserModelState,
+  ConnectProps,
+  Loading,
+  connect,
+  Dispatch,
+} from 'umi';
+import { Modal, Button , Form , Input, Checkbox } from 'antd';
+import styles from './index.less';
+
+
+interface PageProps extends Partial<ConnectProps> {
+  loading: { [key: string]: boolean; };
+  dispatch: Dispatch;
+  visible:boolean,
+  onClose: () => void;
+  user:UserModelState
+}
+const InitGitlink:FC<PageProps>=({
+  visible,
+  user,
+  onClose = () => { },
+})=>{
+  const [form] = Form.useForm();
+  const [ updateEmail , setUpdateEmail ] = useState(false);
+
+  useEffect(()=>{
+    if(user?.userInfo?.email){
+      setUpdateEmail(true);
+      form.setFieldsValue({ email: user?.userInfo?.email });
+    }else{
+      setUpdateEmail(false);
+    }
+  },[user?.userInfo])
+
+  function handleFinish(values:any){
+
+  }
+
+  return(
+    <Modal
+      centered
+      keyboard={false}
+      closable={true}
+      destroyOnClose={true}
+      visible={visible}
+      title="完善用户信息"
+      width="600px"
+      onCancel={onClose}
+      footer={null}
+    >
+      <Form
+        className={styles.formWrap}
+        form={form}
+        layout="horizontal"
+        onFinish={handleFinish}
+      >
+        <Form.Item
+          label="姓名"
+        >
+          <span style={{fontSize:"16px"}}>{user?.userInfo?.real_name}</span>
+        </Form.Item>
+        <Form.Item
+          label="用户名"
+          name="username"
+          rules={[{
+            required: true,
+            message: '请输入用户名',
+          },{
+            
+          }]}
+        >
+          <Input placeholder="请输入4-15位用户名，以字母开头，只能使用字母和数字" size={"large"}/>
+        </Form.Item>
+        {
+          !updateEmail && 
+          <Form.Item
+            label="邮箱"
+            name="email"
+            rules={[{
+              required: true,
+              message: '请输入邮箱',
+            }]}
+          >
+            <Input placeholder="请输入邮箱" size={"large"}/>
+          </Form.Item>
+        }
+        <Form.Item
+          label="密码"
+          name="password"
+          rules={[{
+            required: true,
+            message: '请输入密码',
+          }]}
+        >
+          <Input.Password placeholder="请输入密码" size={"large"}/>
+        </Form.Item>
+        <Form.Item
+          label=" "
+          colon={false}
+        >
+          <Button
+            size="large"
+            type="default"
+            onClick={onClose}
+            style={{marginRight:"30px",width:"80px"}}
+          >
+            取消
+          </Button>
+          <Button
+            size="large"
+            type="primary"
+            htmlType="submit"
+            style={{marginRight:"30px",width:"80px"}}
+          >
+            保存
+          </Button>
+        </Form.Item>
+      </Form>
+    </Modal>
+  )
+}
+export default connect(
+  ({
+    loading,
+    globalSetting,
+    user,
+  }: {
+    loading: Loading;
+    globalSetting: GlobalSettingModelState;
+    user:UserModelState
+  }) => ({
+    globalSetting,
+    loading: loading.effects,
+    user
+  }),
+)(InitGitlink);

src/pages/Competitions/Detail/index.tsx

@@ -28,6 +28,7 @@ import { isSuperAdmin } from '@/utils/authority';
 import SubmitResult from './SubmitResult';
 import SubCompetition from './components/SubCompetition';
 import QR from './mCode.png';
+import InitGitLink from './components/InitGitLink';
 
 interface PageProps extends ConnectProps {
   globalSetting: GlobalSettingModelState;
@@ -75,9 +76,15 @@ const competitionDetails: FC<PageProps> = ({
   const [isshowType, setisshowType] = useState<any>();
 
   const [ subComShow , setSubComShow ]  = useState<any>(false);
+  const [ subGitlinkShow , setSubGitlinkShow ]  = useState<any>(false);
   const [ subComList , setSubComList]  = useState<any>([]);
   const loction = useLocation();
-  const see = useRef(null)
+  const see = useRef(null);
+
+  useEffect(()=>{
+    setSubGitlinkShow(true);
+  },[])
+
   useEffect(() => {
     async function init() {
       setStaffDetail(await dispatch({
@@ -315,6 +322,7 @@ const competitionDetails: FC<PageProps> = ({
   return (
     <div className={"edu-container minH500"}>
       <SubCompetition visible={subComShow} onClose={()=>setSubComShow(false)} filterlist={subComList}/>
+      <InitGitLink visible={subGitlinkShow} onClose={()=>setSubGitlinkShow(false)}/>
       <Breadcrumb className="mt10" separator=">">
         <Breadcrumb.Item><Link to={"/competitions/index"}>在线竞赛</Link></Breadcrumb.Item>
         <Breadcrumb.Item>{HeaderDetail.name}{HeaderDetail.sub_title ? '-' + HeaderDetail.sub_title : null}</Breadcrumb.Item>