会员申请

src/forge/Information/Component/memberApply.jsx

@@ -0,0 +1,82 @@
+import React , {forwardRef, useEffect} from 'react';
+import { Modal , Form , Input , Button } from 'antd';
+import UploadImage from '../../Team/Component/UploadImage';
+import { getImageUrl } from 'educoder';
+
+const { TextArea } = Input;
+
+function MemberApply(props){
+  const { getFieldDecorator, validateFields , setFieldsValue } = props.form;
+  const { current_user, onOk, visible, onCancel } = props
+
+  useEffect(()=>{
+    // if(email){
+    //   setFieldsValue({email})
+    // }
+  },[current_user])
+
+  function onSure(){
+    validateFields((error,values)=>{
+      if(!error){
+        console.log(values)
+      }
+    })
+  }
+
+  function getImageId(id){
+    console.log(image)
+  }
+
+  const layout = {
+    labelCol: { span: 5 },
+    wrapperCol: { span: 18 },
+  };
+  return(
+    <Modal 
+      visible={visible}
+      title="加入专区会员"
+      width="650px"
+      closable={false}
+      footer={
+        <div className="flexCenterJustify">
+          <Button className="mr20" type="default" onClick={onCancel}>取消</Button>
+          <Button type="primary" onClick={onSure}>确定</Button>
+        </div>
+      }
+      centered
+    >
+      <div>
+        <p className="mb15 edu-txt-center" style={{maxWidth:"600px",margin:"0px auto"}}>
+        若您未填写会员头像，会员名称，我们会将您的GitLink用户头像及昵称自动填入，请知悉
+        </p>
+        <Form {...layout }>
+          <Form.Item label="会员名称" name="name">
+            {getFieldDecorator("name", {
+              initialValue: current_user.nickname
+            })(
+              <Input placeholder="请输入会员名称" width="220px"/>
+            )}
+          </Form.Item>
+          <Form.Item label="会员头像" name="imageUrl">
+            <UploadImage getImageId={ getImageId } url={ getImageUrl(`/${current_user.image_url}`) }/>
+          </Form.Item>
+          <Form.Item label="会员简介" name="introduction">
+            {getFieldDecorator("introduction",{
+              rules:[{ required:true,message:"请输入会员简介" }]
+            })(
+              <TextArea autoSize={{ minRows: 2, maxRows: 6 }} placeholder="请输入会员简介" width="220px"/>
+            )}
+          </Form.Item>
+          <Form.Item label="申请原因" name="remark">
+            {getFieldDecorator("remark",{
+              rules:[{ required:true,message:"请输入申请原因" }]
+            })(
+              <TextArea autoSize={{ minRows: 2, maxRows: 6 }} placeholder="请输入申请原因" width="220px"/>
+            )}
+          </Form.Item>
+        </Form>
+      </div>
+    </Modal>
+  )
+}
+export default Form.create()(forwardRef(MemberApply));

src/forge/Information/Pages/zoneVIP.jsx

@@ -2,10 +2,12 @@ import React , { useState , useEffect } from 'react';
 import Crown from '../img/crown.png';
 import Nodata from '../../Nodata';
 import { Link } from 'react-router-dom';
-import { Spin } from 'antd';
+import { Spin, Button } from 'antd';
 import { httpUrl } from '../fetch';
 import axios from 'axios';
 import { tempConfig } from '../tempInfo'
+import MemberApply from '../Component/memberApply';
+
 import '../indexZone1.scss'
 
 
@@ -13,6 +15,7 @@ function ZoneVIP(props){
   const { deptId } = props.match.params;
   const [ vipLists , setVIPLists ] = useState(undefined);
   const [ isSpin , setIsSpin ] = useState(true);
+  const [ applyVisible , setApplyVisible ] = useState(false);
   const { id } = props;
   const temp = props.pathName
 
@@ -33,10 +36,17 @@ function ZoneVIP(props){
     }).catch(error=>{setIsSpin(false);})
   }
 
+  function onOk(e) {
+    console.log(e)
+  }
+
   return(
     <div className={`boxmain ${temp}_VIP_box`}>
       <p className="in_title">{ tempConfig[temp].member }</p>
       <p className="vip_sub_title">{ tempConfig[temp].vipDesc }</p>
+      <Button onClick={() => setApplyVisible(!applyVisible)}>日期</Button>
+      <MemberApply visible={applyVisible}  onOk={onOk} onCancel={() => setApplyVisible(!applyVisible)} current_user={props.current_user}/>
+
       <Spin spinning={isSpin}>
         <div style={{minHeight:400}}>
         {

src/forge/Information/index.jsx

@@ -52,6 +52,9 @@ function Index(props){
   const { deptId } = props.match.params;
   const [ id , setId ] = useState(undefined);
   const temp = props.pathName
+  const current_user = props.current_user
+  console.log(current_user)
+  console.log(props)
 
   useEffect(()=>{
     if(deptId){

src/forge/Information/index.scss

@@ -409,6 +409,10 @@
   display: flex;
   align-items: center;
 }
+.flexCenterJustify{
+  display: flex;
+  justify-content: center;
+}
 .detail_news_all{
   .detail_banners{
     background-image: url(./img/subbanner.png);