组织模块-部分前端页面

2020-06-11 15:40:22 +08:00 · 2020-06-11 15:40:22 +08:00 · 49dd7dcde0
parent 6f08cf4a73
commit 49dd7dcde0
23 changed files with 991 additions and 46 deletions
--- a/public/css/edu-purge.css
+++ b/public/css/edu-purge.css
@ -538,10 +538,6 @@ a:hover.leftnav-box-inner .btn-cir {

 /*右侧头部*/

-/*右侧内容*/
-.content {
-  min-width: 1000px;
-}

 /* tab */

--- a/src/forge/Component/Cards.jsx
+++ b/src/forge/Component/Cards.jsx
@ -0,0 +1,19 @@
+import React from 'react';
+import './Component.scss';
+
+export default (({img , title, desc , rightBtn})=>{
+  return(
+    <div className="cards">
+      <div className="img"><img src={img} alt=""/></div>
+      <div className="content">
+        <p className="titles">
+          <span>{title}</span>
+          {rightBtn}
+        </p>
+        <div className="desc">
+          {desc}
+        </div>
+      </div>
+    </div>
+  )
+})
--- a/src/forge/Component/Component.scss
+++ b/src/forge/Component/Component.scss
@ -1,10 +1,66 @@
-  ul.ant-menu{
-    border-right: none;
+ul.ant-menu{
+  border-right: none;
+}
+ul.ant-menu li:last-child{
+  border-bottom: none;
+}
+li.ant-menu-item{
+  margin:0px!important;
+  border-bottom: 1px solid #eee;
+}
+// Cards
+.cards{
+  display: flex;
+  align-items: center;
+  padding:20px 34px;
+  background-color: #fff;
+  margin:18px 0px;
+  .img{
+    margin-right: 20px;
+    width: 190px;
+    height: 90px;
+    border:1px solid rgba(238,238,238,1);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    img{
+      max-width: 100%;
+    }
  }
-  ul.ant-menu li:last-child{
-    border-bottom: none;
+  .content{
+    flex:1;
+    width: 0;
+    .titles{
+      display: flex;
+      justify-content: space-between;
+      margin-bottom: 10px!important;
+      align-items: center;
+      &>span{
+        font-size:18px ;
+        color: #333;
+      }
+    }
+    .desc{
+      overflow: hidden;
+      text-overflow: ellipsis;
+      display: -webkit-box;
+      -webkit-box-orient: vertical;
+      -webkit-line-clamp: 2;
+    }
  }
-  li.ant-menu-item{
-    margin:0px!important;
-    border-bottom: 1px solid #eee;
-  }
+}
+// Tabs
+.tabsStyle{
+  .ant-tabs-bar.ant-tabs-top-bar{
+    padding-left: 35px;
+    margin-bottom: 0px;
+  }
+  .ant-tabs-nav .ant-tabs-tab{
+    padding:19px 0px;
+    margin-right: 40px;
+  }
+  .ant-tabs-ink-bar{
+    width:25px!important;
+    bottom: 10px;
+  }
+}
--- a/src/forge/Component/ListCount.jsx
+++ b/src/forge/Component/ListCount.jsx
@ -0,0 +1,41 @@
+import React from 'react';
+import styled from 'styled-components';
+
+export default (({fork,parise})=>{
+  const DivStyle = styled.div`{
+    display:flex;
+    align-item:center;
+  }`;
+  const SpanStylefork = styled.span`{
+    display:flex;
+    align-item:center;
+    margin-left:30px;
+    padding:0px 12px;
+    border-radius:13px;
+    background-color:#EBF4FE;
+    height:24px;
+    line-height:24px;
+    font-size:12px;
+  }`;
+  const SpanStyleparise = styled.span`{
+    display:flex;
+    align-item:center;
+    margin-left:30px;
+    padding:0px 12px;
+    border-radius:13px;
+    background-color:#FFF3DC;
+    height:24px;
+    line-height:24px;
+    font-size:12px;
+  }`;
+  return(
+    <DivStyle>
+      {
+        fork || fork ===0 ? <SpanStylefork><i className="iconfont icon-fork font-15 mr3" style={{color:"#1B8FFF"}}></i>fork({fork})</SpanStylefork>:""
+      }
+      {
+        parise || parise ===0?<SpanStyleparise><i className="iconfont icon-guanzhu font-14 mr3" style={{color:"#FFA802"}}></i>点赞({parise})</SpanStyleparise>:""
+      }
+    </DivStyle>
+  )
+})
--- a/src/forge/Component/MemberCards.jsx
+++ b/src/forge/Component/MemberCards.jsx
@ -0,0 +1,74 @@
+import React from 'react';
+import './Component.scss';
+import styled from 'styled-components';
+
+const Img = styled.img`{
+  border-radius:50%;
+  width:50px;
+  height:50px;
+  margin-right:14px;
+}`
+const Name = styled.div`{
+  color:#5091FF;
+  font-size:16px;
+  height:22px;
+  line-height:22px;
+  margin-bottom:7px;
+}`
+const Time = styled.div`{
+  color:#888;
+  font-size:12px;
+  height:16px;
+  line-height:16px;
+  margin-bottom:9px;
+  display:flex;
+  align-item:center;
+}`
+const I = styled.i`{
+  font-size:13px!important;
+  color:#60B25E;
+  margin-right:2px;
+}`
+const FocusBtn = styled.a`{
+  display:inline-block;
+  height:30px;
+  line-height:26px;
+  padding:0px 12px;
+  background-color:#fafafa;
+  border:1px solid #eee;
+  border-radius:2px;
+  color:#888!important;
+}`
+const Ifocused = styled.i`{
+  font-size:16px!important;
+  color:#FFA802;
+  margin-right:4px;
+}`
+const Ifocus = styled.i`{
+  font-size:16px!important;
+  color:#BBBBBB;
+  margin-right:4px;
+}`
+const Div = styled.div`{
+  margin-bottom: 18px;
+  padding:20px 16px;
+  display: flex;
+  align-items: center;
+  border:1px solid #eee;
+}`
+export default (({img,name,time, focusStatus})=>{
+  return(
+    <Div>
+      <Img src={img}/>
+      <div className="m-infos">
+        <Name>{name}</Name>
+        <Time><I className="iconfont icon-shijian"></I>加入时间:{time}</Time>
+        {
+          focusStatus ? 
+          <FocusBtn><Ifocused className="iconfont icon-shixing"></Ifocused>已关注</FocusBtn> : 
+          <FocusBtn><Ifocus className="iconfont icon-kongxing"></Ifocus>关注</FocusBtn>
+        }
+      </div>
+    </Div>
+  )
+})
--- a/src/forge/Component/Tabs.jsx
+++ b/src/forge/Component/Tabs.jsx
@ -0,0 +1,20 @@
+import React from 'react';
+import { Tabs } from 'antd';
+import './Component.scss';
+
+const { TabPane } = Tabs;
+
+export default (({ nav, index , onChange , children })=>{
+  return(
+    nav && nav.length > 0 ?
+    <Tabs className="tabsStyle" animated={false} activeKey={index} onChange={onChange}>
+      {
+        nav.map((item,key)=>{
+          return(
+            <TabPane tab={item} key={`${key}`}>{children}</TabPane>
+          )
+        })
+      }
+    </Tabs>:""
+  )
+})
--- a/src/forge/Component/layout.jsx
+++ b/src/forge/Component/layout.jsx
@ -0,0 +1,44 @@
+import styled from 'styled-components';
+
+export const Banner = styled.div`{
+  padding:20px 25px;
+  color:#333;
+  font-size:18px;
+  border-bottom:1px solid #eee;
+  background-color:#fff;
+  border-radius:5px 5px 0px 0px;
+}`
+export const AlignCenterBetween = styled.div`{
+  display:flex;
+  align-items: center;
+  padding: 14px 14px 14px 20px;
+  justify-content: space-between;
+  border-bottom:1px solid #eee;
+}`
+export const AlignCenter = styled.div`{
+  display:flex;
+  align-items: center;
+}`
+// 左右结构
+export const Box = styled.div`{
+  display:flex;
+  align-item:flex-start;
+}`
+export const Long = styled.div`{
+  width:72%;
+  border-radius:5px;
+  margin-bottom:30px;
+}`
+export const Short = styled.div`{
+  width:28%;
+  border-radius:5px;
+  margin-bottom:30px;
+}`
+export const Gap = styled.div`{
+  padding-left:20px;
+  box-sizing:border-box;
+}`
+export const WhiteBack = styled.div`{
+  background-color:#fff;
+  border-radius:5px;
+}`
--- a/src/forge/Main/Detail.js
+++ b/src/forge/Main/Detail.js
@ -1,6 +1,6 @@
 import React, { Component } from 'react';
 import { Spin, Tooltip } from 'antd';
-import { Link, Route, Switch, withRouter } from 'react-router-dom';
+import { Link, Route, Switch } from 'react-router-dom';

 import '../css/index.css'
 import './list.css';
@ -605,4 +605,4 @@ class Detail extends Component {
  }
 }

-export default withRouter(Detail);
+export default Detail;
--- a/src/forge/Team/Box.jsx
+++ b/src/forge/Team/Box.jsx
@ -0,0 +1,23 @@
+import React from 'react';
+
+
+export default (({ name , count , bottom , children })=>{
+  return(
+    <div className="box">
+      <div className="head">
+        <span>{name}</span>
+        <span>{count}<i className="iconfont icon-youjiantou font-12 ml3"></i></span>
+      </div>
+      <div className="content">
+        {children}
+      </div>
+      {
+        bottom ? 
+        <div className="foot">
+          {bottom}
+        </div>
+        :""
+      }
+    </div>
+  )
+})
--- a/src/forge/Team/Detail.jsx
+++ b/src/forge/Team/Detail.jsx
@ -0,0 +1,33 @@
+import React , { useEffect , useState } from 'react';
+import { Route, Switch } from "react-router-dom";
+import Loadable from "react-loadable";
+import Loading from "../../Loading";
+
+import Cards from '../Component/Cards';
+
+import './Index.scss';
+
+const DetailIndex = Loadable({
+  loader: () => import("./List"),
+  loading: Loading,
+});
+export default ((props)=>{
+  return(
+    <div className="teamDetail">
+      <Cards
+        title="组织名称"
+        desc="组织名称组织名称组织名称组织名称组织名称"
+        rightBtn={<a className="color-blue">设置<i className="iconfont icon-shezhi2 ml3"></i></a>}
+        img={`https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=4193840146,2109186388&fm=26&gp=0.jpg`}
+      />
+      <Switch {...props}>
+        <Route
+          path="/organize/:organizeId"
+          render={(props) => {
+            return <DetailIndex {...props} />
+          }}
+        ></Route>
+      </Switch>
+    </div>
+  )
+})
--- a/src/forge/Team/GroupDetailMember.jsx
+++ b/src/forge/Team/GroupDetailMember.jsx
@ -0,0 +1,35 @@
+import React from 'react';
+import Cards from '../Component/MemberCards';
+
+export default (()=>{
+  return(
+    <div>
+      <div className="MemberBoxThree">
+        <Cards 
+          img="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"
+          name="陈教授"
+          time="2020-04-29"
+          focusStatus={true}
+        />
+        <Cards 
+          img="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"
+          name="陈教授"
+          time="2020-04-29"
+          focusStatus={true}
+        />
+        <Cards 
+          img="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"
+          name="陈教授"
+          time="2020-04-29"
+          focusStatus={true}
+        />
+        <Cards 
+          img="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"
+          name="陈教授"
+          time="2020-04-29"
+          focusStatus={true}
+        />
+      </div>
+    </div>
+  )
+})
--- a/src/forge/Team/GroupDetailProject.jsx
+++ b/src/forge/Team/GroupDetailProject.jsx
@ -0,0 +1,35 @@
+import React from 'react';
+import styled from 'styled-components';
+import { Link } from 'react-router-dom';
+
+const Box=styled.div`{
+  padding:0px 38px;
+}`
+const Div = styled.div`{
+  display:flex;
+  align-items: center;
+  margin-left:10px;
+  padding:25px 0px;
+  border-bottom:1px solid #eee;
+}`
+const Imgs = styled.img`{
+  width:30px;
+  height:30px;
+  margin-right:12px;
+  border-radius:50%;
+}`
+
+export default (()=>{
+  return(
+    <Box>
+      <Div>
+        <Imgs src="https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3025493530,1989042357&fm=26&gp=0.jpg"/>
+        <Link to={""}>ajdfwkerijwirjklsf</Link>
+      </Div>
+      <Div>
+        <Imgs src="https://dss3.bdstatic.com/70cFv8Sh_Q1YnxGkpoWK1HF6hhy/it/u=3025493530,1989042357&fm=26&gp=0.jpg"/>
+        <Link to={""}>ajdfwkerijwirjklsf</Link>
+      </Div>
+    </Box>
+  )
+})
--- a/src/forge/Team/GroupDetails.jsx
+++ b/src/forge/Team/GroupDetails.jsx
@ -0,0 +1,50 @@
+import React , {useState} from 'react';
+import { Button } from 'antd';
+import styled from 'styled-components';
+import { Box , Short , Long , Gap , WhiteBack , AlignCenterBetween } from '../Component/layout';
+import Tabs from '../Component/Tabs';
+
+import Memberlist from './GroupDetailMember';
+import Grouplist from './GroupDetailProject';
+
+const Leave = styled.a`{
+  display:block;
+  border-radius:5px;
+  border:1px solid rgba(40,189,108,1);
+  color:rgba(40,189,108,1);  
+  padding:0px 14px;
+  height:30px;
+  line-height:30px;
+}`
+export default ((props)=>{
+  const [ nav , setNav ] = useState('0');
+
+  return(
+    <Box className="GroupSubLevel">
+      <Short className="g-sub-left">
+        <AlignCenterBetween>
+          <span className="color-grey-3">Owndsknamename</span>
+          <Leave>离开团队</Leave>
+        </AlignCenterBetween>
+        <div className="g-desc">该团队暂无描述</div>
+        <div className="g-tip">
+          <p>管理员团队对 <span>所有仓库</span> 具有操作权限，且对组织具有 <span>管理员权限</span>。 </p>
+          <p>此外，该团队拥有了 <span>创建仓库</span>  的权限：成员可以在组织中创建新的仓库。 </p>
+          <Button type="primary">团队设置</Button>
+        </div>
+      </Short>
+      <Long>
+        <Gap>
+          <WhiteBack>
+            <Tabs nav={['团队成员','团队项目']} index={nav} onChange={setNav}>
+              {
+                nav === "0" ?
+                <Memberlist />:<Grouplist />
+              }
+            </Tabs>
+          </WhiteBack>
+        </Gap>
+      </Long>
+    </Box>
+  )
+})
--- a/src/forge/Team/Index.jsx
+++ b/src/forge/Team/Index.jsx
@ -1,13 +1,13 @@
 import React from 'react';

 import { Route, Switch } from "react-router-dom";
+import Loadable from "react-loadable";
+import Loading from "../../Loading";

 import { SnackbarHOC } from "educoder";
 import { CNotificationHOC } from "../../modules/courses/common/CNotificationHOC";
 import { TPMIndexHOC } from "../../modules/tpm/TPMIndexHOC";

-import Loadable from "react-loadable";
-import Loading from "../../Loading";

 import '../css/index.css';

@ -15,17 +15,39 @@ const New = Loadable({
  loader: () => import("./New"),
  loading: Loading,
 });
+const DetailIndex = Loadable({
+  loader: () => import("./Detail"),
+  loading: Loading,
+});
+const SubDetail = Loadable({
+  loader: () => import("./SubDetail"),
+  loading: Loading,
+});
 export default CNotificationHOC()(SnackbarHOC()(TPMIndexHOC(
  ((props)=>{
    return (
-      <Switch {...props}>
-        <Route
-          path="/organize/new"
-          render={(props) => {
-            return <New {...props} />;
-          }}
-        ></Route>
-      </Switch>
+      <div className="newMain">
+        <Switch {...props}>
+          <Route
+            path="/organize/:organizeId/member"
+            render={(props) => {
+              return <SubDetail {...props} />
+            }}
+          ></Route>
+          <Route
+            path="/organize/new"
+            render={(props) => {
+              return <New {...props} />
+            }}
+          ></Route>
+          <Route
+            path="/organize/:organizeId"
+            render={(props) => {
+              return <DetailIndex {...props} />
+            }}
+          ></Route>
+        </Switch>
+      </div>
    )
  })
 )))
--- a/src/forge/Team/Index.scss
+++ b/src/forge/Team/Index.scss
@ -12,13 +12,14 @@
    font-size: 18px;
  }
  .teamBox-form{
-    padding:24px 40px;
+    padding:24px 40px 0px 40px;
  }
  .lables{
    position: relative;
    color:#333;
    margin-bottom: 5px;
    display: block;
+    font-size: 16px;
  }
  .lables.must::before{
    content: "*";
@ -28,4 +29,247 @@
    left: -15px;
    height: 100%;
  }
-}
+}
+.ant-btn.grey{
+  background: #bbb;
+  color: #fff;
+  border: 1px solid #bbb;
+}
+.teamDetail{
+  width: 1200px;
+  margin:0px auto;
+}
+.list{
+  display: flex;
+  align-items: flex-start;
+  .list-l{
+    background-color: #fff;
+    max-width: 860px;
+    width: 72%;
+    .head{
+      padding:16px 32px;
+      border-bottom: 1px solid #eee;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .addBtn{
+        display: inline-block;
+        border-radius: 5px;
+        border:1px solid #5091FF;
+        color: #5091FF;
+        height: 30px;
+        line-height: 30px;
+        padding:0px 10px;
+      }
+    }
+    .team{
+      padding:0px 32px;
+      .team_project{
+        padding:22px 0px;
+        border-bottom: 1px solid #eee;
+        .t_p_title{
+          display: flex;
+          align-items: center;
+          justify-content: space-between;
+          .name{
+            overflow: hidden;
+            white-space: nowrap;
+            text-overflow: ellipsis;
+            font-size: 18px;
+            max-width: 500px;
+            float: left;
+          }
+        }
+        .desc{
+          color: #333;
+          margin-top: 6px;
+          margin-bottom: 3px;
+          overflow: hidden;
+          text-overflow: ellipsis;
+          display: -webkit-box;
+          -webkit-box-orient: vertical;
+          -webkit-line-clamp: 2;
+        }
+        &:last-child{
+          border-bottom: none;;
+        }
+      }
+    }
+  }
+  .list-r{
+    width: 28%;
+    max-width: 340px;
+    padding-left: 20px;
+    box-sizing: border-box;
+  }
+  .box{
+    background:rgba(255,255,255,1);
+    border-radius:5px;
+    margin-bottom: 20px;
+    .head{
+      padding:25px 20px;
+      display: flex;
+      border-bottom: 1px solid #eee;
+      justify-content: space-between;
+      color: #333;
+    }
+    .content{
+      padding:13px 0px;
+      .teammembers{
+        display: flex;
+        align-items: center;
+        padding:13px 20px;
+        .m-img{
+          border-radius: 50%;
+          width:45px;
+          height: 45px;
+          margin-right: 12px;
+        }
+      }
+    }
+    .foot{
+      padding:15px 20px;
+      border-top: 1px solid #eee;
+    }
+  }
+}
+.subNavs{
+  display: flex;
+  a{
+    display: block;
+    margin-left: 14px;
+    height: 40px;
+    padding:0px 22px;
+    border-radius: 2px;
+    border:1px solid #eee;
+    background-color: #fafafa;
+    color:#333;
+    display: flex;
+    align-items: center;
+    font-size: 14px;
+    span{
+      display: block;
+      height: 18px;
+      line-height: 18px;
+    }
+    lable{
+      display: block;
+      padding:0px 7px;
+      background-color:#eee;
+      height: 18px;
+      line-height: 18px;
+      font-size: 12px;
+      border-radius: 10px;
+      margin-left: 5px;
+    }
+    &.active{
+      border:1px solid #5091FF;
+      color: #5091FF;
+      lable{
+        background-color: #F1F8FF;
+        color: #5091FF;
+      }
+    }
+  }
+}
+// 组织团队
+.groupBox{
+  display: flex;
+  flex-wrap: wrap;
+  align-items: flex-start;
+  background-color: #fff;
+  padding:30px 35px;
+  margin-bottom: 30px;
+  &>div{
+    border:1px solid #eee;
+    background-color: #fff;
+    width: 48.5%;
+    margin-right: 3%;
+    margin-bottom: 30px;
+    .g-head,.g-foot{
+      display: flex;
+      justify-content: space-between;
+      background-color: #F1F8FF;
+      padding:10px 10px 10px 25px;
+      align-items: center;
+    }
+    .g-foot{
+      background-color: #fafafa;
+      justify-content: left;
+    }
+    .g-body{
+      padding:15px 25px;
+    }
+  }
+  &>div:nth-child(2n){
+    margin-right: 0px;
+  }
+}
+// 组织成员-一行四个
+.memberBox{
+  display: flex;
+  align-items: flex-start;
+  flex-wrap: wrap;
+  background-color: #fff;
+  padding:24px 35px;
+  margin-bottom: 30px;
+  min-height: 400px;
+  align-content: flex-start;
+  &>div{
+    width:22.75% ;
+    margin-right: 3%;
+    .m-infos{
+      flex:1;
+    }
+  }
+  &>div:nth-child(4n){
+    margin-right: 0px;
+  }
+}
+// 团队成员-一行三个
+.MemberBoxThree{
+  display: flex;
+  align-items: flex-start;
+  flex-wrap: wrap;
+  background-color: #fff;
+  padding:24px 35px;
+  margin-bottom: 30px;
+  min-height: 400px;
+  align-content: flex-start;
+  &>div{
+    width:31% ;
+    margin-right: 3.5%;
+    .m-infos{
+      flex:1;
+    }
+  }
+  &>div:nth-child(3n){
+    margin-right: 0px;
+  }
+}
+// 团队详情（成员、项目）
+.GroupSubLevel{
+  display: flex;
+  align-items: flex-start;
+  .g-sub-left{
+    background-color: #fff;
+    .g-desc{
+      padding:18px 20px;
+      color:#333;
+      min-height: 100px;
+    }
+    .g-tip{
+      padding:28px 20px;
+      border-top: 1px solid #eee;
+      &>p{
+        margin-bottom: 10px!important;
+      }
+      &>p>span{
+        color:#333;
+      }
+      &>button{
+        margin-top: 10px;
+      }
+    }
+  }
+}
--- a/src/forge/Team/List.jsx
+++ b/src/forge/Team/List.jsx
@ -0,0 +1,124 @@
+import React from 'react';
+import { Button } from 'antd';
+import Search from '../Component/Search';
+import Sort from '../Component/Sort';
+import ListCount from '../Component/ListCount';
+import Box from './Box';
+import './Index.scss';
+import styled from 'styled-components';
+
+import { Menu } from 'antd';
+
+const Span = styled.span`{
+  color:#888;
+  font-size:12px;
+  margin-right:10px;
+}`
+const Align = styled.div`{
+  display:flex;
+  aligin:center;
+}`
+const ListName = styled.div`{
+  font-size:14px;
+  color:#333;
+  margin-bottom:8px;
+  height:18px;
+  line-height:18px;
+}`;
+const ColorListName = styled.div`{
+  color:#5091FF;
+  font-size:14px;
+  margin-bottom:8px;
+  height:18px;
+  line-height:18px;
+}`
+const Img = styled.img`{
+  border-radius:50%;
+  width:45px;
+  height:45px;
+  margin-right:12px;
+}`
+export default (()=>{
+  function onSearch(value){
+
+  }
+  const menu=(
+    <Menu>
+      <Menu.Item key="updated_on">更新时间排序</Menu.Item>
+      <Menu.Item key="created_on">项目数排序</Menu.Item>
+    </Menu>
+  )
+  const menu_new=(
+    <Menu>
+      <Menu.Item key="updated_on">新建托管项目</Menu.Item>
+      <Menu.Item key="created_on">新建镜像项目</Menu.Item>
+    </Menu>
+  )
+  const leftList = (
+    <div className="team_project">
+      <p className="t_p_title">
+        <span className="flex1">
+          <span className="name">react项目react项目react项目react项目</span>
+          <i className="iconfont icon-banbenku font-20 color-green" />
+          <i className="iconfont icon-jingxiang font-18 color-green" />
+          <i className="iconfont icon-fork font-18 color-orange" />
+        </span>
+        <ListCount fork={1} parise={0}/>
+      </p>
+      <div className="desc">
+      用于构建用户界面的 JavaScript 库
+      </div>
+      <div className="infos">
+        <span className="font-12 color-grey-8">更新于1天前</span>
+      </div>
+    </div>
+  )
+  return(
+    <div className="list">
+      <div className="list-l">
+        <div className="head">
+          <div style={{width:"370px"}}>
+            <Search placeholder="输入仓库名称进行搜索" onSearch={onSearch}/>
+          </div>
+          <p>
+            <Sort menu={menu_new}>
+              <a className="addBtn mr30">+&nbsp;新建项目</a>
+            </Sort>
+            <Sort menu={menu}>
+              <a className="color-blue">排序<i className="iconfont icon-sanjiaoxing-down ml3 font-14"></i></a>
+            </Sort>
+          </p>
+        </div>
+        <div className="team">
+         {leftList}
+        </div>
+      </div>
+      <div className="list-r">
+        <Box name="组织成员" count={8}>
+          <div className="teammembers">
+            <Img src="https://dss0.bdstatic.com/70cFvHSh_Q1YnxGkpoWK1HF6hhy/it/u=1990625098,3468619056&fm=111&gp=0.jpg" alt="" className="m-img"/>
+            <div>
+              <ListName>陈Professer</ListName>
+              <Align><i className="iconfont icon-shijian color-green mr3 font-13"></i><Span>加入时间：2020-04-28</Span></Align>
+            </div>
+          </div>
+        </Box>
+        <Box 
+          name="组织团队" 
+          count={3} 
+          bottom={<Button type={'primary'} to={``}>新建团队</Button>}
+        >
+          <div className="teammembers">
+            <div>
+              <ColorListName>陈Professer</ColorListName>
+              <Align>
+                <Span>2名成员</Span>
+                <Span>1个仓库</Span>
+              </Align>
+            </div>
+          </div>
+        </Box>
+      </div>
+    </div>
+  )
+})
--- a/src/forge/Team/New.jsx
+++ b/src/forge/Team/New.jsx
@ -1,13 +1,17 @@
 import React,{ forwardRef , useCallback } from 'react';
 import './Index.scss';
-import { Form , Input , Cascader , Checkbox , Upload } from "antd";
+import { Form , Input , Cascader , Radio , Checkbox , Upload , Button } from "antd";
 import { locData } from "../Utils/locData";


 export default Form.create()(
  forwardRef(({form})=>{
    const { getFieldDecorator, validateFields, setFieldsValue } = form;
-
+    const radioStyle = {
+      display: 'block',
+      height: '30px',
+      lineHeight: '30px',
+    }
    const helper = useCallback(
      (label, name, rules, widget, isRequired = true) => (
        <React.Fragment>
@ -52,11 +56,11 @@ export default Form.create()(
                '可见性',
                "exposure",
                [{ required: true, message: "请选择可见性" }],
-                <Checkbox.Group>
-                  <Checkbox value="1" key={1}>公开</Checkbox>
-                  <Checkbox value="2" key={2}>受限<span className="color-grey-8">（仅对登录用户可见）</span></Checkbox>
-                  <Checkbox value="3" key={3}>公开<span className="color-grey-8">（仅对组织成员可见）</span></Checkbox>
-                </Checkbox.Group>
+                <Radio.Group name="exposure">
+                  <Radio style={radioStyle} value="1" key={1}>公开</Radio>
+                  <Radio style={radioStyle} value="2" key={2}>受限<span className="color-grey-8">（仅对登录用户可见）</span></Radio>
+                  <Radio style={radioStyle} value="3" key={3}>公开<span className="color-grey-8">（仅对组织成员可见）</span></Radio>
+                </Radio.Group>
              )}
              {helper(
                '选择头像',
@ -72,6 +76,10 @@ export default Form.create()(
              )}
            </Form>
          </div>
+          <p className="mt20">
+            <Button type="primary" className="mr30">创建组织</Button>
+            <Button className="grey">取消</Button>
+          </p>
        </div>
      </div>
    )
--- a/src/forge/Team/SubDetail.jsx
+++ b/src/forge/Team/SubDetail.jsx
@ -0,0 +1,57 @@
+import React from 'react';
+import { Route, Switch , Link } from "react-router-dom";
+import Loadable from "react-loadable";
+import Loading from "../../Loading";
+import './Index.scss';
+
+import Cards from '../Component/Cards';
+
+const Group = Loadable({
+  loader: () => import("./TeamGroup"),
+  loading: Loading,
+});
+const Member = Loadable({
+  loader: () => import("./TeamMember"),
+  loading: Loading,
+});
+const GroupDetails = Loadable({
+  loader: () => import("./GroupDetails"),
+  loading: Loading,
+});
+
+export default ((props)=>{
+  return(
+    <div className="teamDetail">
+      <Cards
+        title="组织名称"
+        rightBtn={
+          <span className="subNavs">
+            <Link to={``} className="active"><span>组织成员</span><lable>13</lable></Link>
+            <Link to={``}><span>组织团队</span><lable>13</lable></Link>
+          </span>
+        }
+        img={`https://dss0.bdstatic.com/70cFuHSh_Q1YnxGkpoWK1HF6hhy/it/u=4193840146,2109186388&fm=26&gp=0.jpg`}
+      />
+      <Switch {...props}>
+        <Route
+          path="/organize/:organizeId/member/:memberId"
+          render={(props) => {
+            return <GroupDetails {...props} />
+          }}
+        ></Route>
+        <Route
+          path="/organize/:organizeId/member"
+          render={(props) => {
+            return <Member {...props} />
+          }}
+        ></Route>
+        <Route
+          path="/organize/:organizeId/group"
+          render={(props) => {
+            return <Group {...props} />
+          }}
+        ></Route>
+      </Switch>
+    </div>
+  )
+})
--- a/src/forge/Team/TeamGroup.jsx
+++ b/src/forge/Team/TeamGroup.jsx
@ -0,0 +1,49 @@
+import React from 'react';
+import { Banner } from '../Component/layout';
+import styled from 'styled-components';
+
+const SpanName = styled.span`{
+  font-size:16px;
+  color:#333;
+}`
+const SpanFoot = styled.span`{
+  margin-right:5px;
+  color:#333
+}`
+const ALink = styled.a`{
+  border:1px solid #F73030;
+  color:#F73030!important;
+  height:30px;
+  line-height:30px;
+  padding:0px 15px;
+  border-radius:5px;
+}`
+const ImgContent = styled.img`{
+  height:44px;
+  width:44px;
+  border-radius:50%;
+  margin:5px 20px 5px 0px;
+}`
+export default (()=>{
+  return(
+    <div>
+      <Banner>组织团队</Banner>
+      <div className="groupBox">
+        <div>
+          <p className="g-head">
+            <SpanName>oweners</SpanName>
+            <ALink>离开团队</ALink>
+          </p>
+          <div className="g-body">
+            <ImgContent src="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"/>
+            <ImgContent src="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"/>
+          </div>
+          <p className="g-foot">
+            <SpanFoot>2&nbsp;名成员</SpanFoot>
+            <SpanFoot>1&nbsp;个项目</SpanFoot>
+          </p>
+        </div>
+      </div>
+    </div>
+  )
+})
--- a/src/forge/Team/TeamMember.jsx
+++ b/src/forge/Team/TeamMember.jsx
@ -0,0 +1,25 @@
+import React from 'react';
+import { Banner } from '../Component/layout';
+import Cards from '../Component/MemberCards';
+
+export default (()=>{
+  return(
+    <div>
+      <Banner>组织成员</Banner>
+      <div className="memberBox">
+        <Cards 
+          img="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"
+          name="陈教授"
+          time="2020-04-29"
+          focusStatus={true}
+        />
+        <Cards 
+          img="https://dss2.bdstatic.com/70cFvnSh_Q1YnxGkpoWK1HF6hhy/it/u=3331079987,1190181307&fm=111&gp=0.jpg"
+          name="陈教授"
+          time="2020-04-29"
+          focusStatus={false}
+        />
+      </div>
+    </div>
+  )
+})
--- a/src/forge/Version/New.jsx
+++ b/src/forge/Version/New.jsx
@ -26,6 +26,9 @@ export default Form.create()(
      const [attachment, setAttachment] = useState(undefined);
      const [options , setOptions] = useState(undefined);

+
+      const repo_id = projectDetail && projectDetail.repo_id;
+      const { projectsId, versionId } = match.params;
      useEffect(()=>{
        getBranchs(projectsId);
      },[projectsId])
@ -41,9 +44,6 @@ export default Form.create()(
        line-height: 35px;
      `;

-      const repo_id = projectDetail && projectDetail.repo_id;
-      const { projectsId, versionId } = match.params;
-

      useEffect(() => {
        if (versionId) {
--- a/src/modules/courses/css/Courses.css
+++ b/src/modules/courses/css/Courses.css
@ -1338,15 +1338,6 @@ samp {
  padding: 16px 0px;
 }

-/* FORM START */
-.ant-form label {
-  /* 为了覆盖antd的样式，这里使用了important，TODO */
-  font-size: 16px !important;
-}
-
-.ant-form label.font-18 {
-  font-size: 18px !important;
-}

 .ant-form label.font-14 {
  font-size: 14px !important;
--- a/src/modules/recruitment/routePage/EditResumePage.js
+++ b/src/modules/recruitment/routePage/EditResumePage.js
@ -7,7 +7,6 @@ import { CenterBtnGrp, SaveBtn, CancelBtn } from "../util/GeneralButton";
 import { useLoaded } from "../util/hooks";
 import { updateResume } from "../data/updateResume";
 import { getResume } from "../data/getResume";
-import Nav from "../util/Nav";

 const Backgroud = styled(FullScreen)`
  background: rgba(245, 246, 249, 1);