组织首页改版

src/forge/Team/Index.jsx

@@ -19,7 +19,7 @@ const New = Loadable({
   loading: Loading,
 });
 const DetailIndex = Loadable({
-  loader: () => import("./Sub/Detail"),
+  loader: () => import("./List"),
   loading: Loading,
 });
 const SubDetailIndex = Loadable({

src/forge/Team/Index.scss

@@ -1,3 +1,47 @@
+.top-orz{
+  background-color:#f9fbfe;
+  box-shadow:0px 8px 20px rgba(17, 35, 146, 0.06);
+  margin-bottom: 40px;
+  .box{
+    width: 1200px;
+    display: flex;
+    margin:0px auto;
+    align-items: center;
+    padding:25px 0px 35px;
+    &>img{
+      margin-right: 27px;
+      // max-width: 140px;
+      height: 112px;
+      border-radius:4px;  
+    }
+    .df{
+      display: flex;
+      align-items: center;
+    }
+    .info-orz{
+      flex: 1;
+      .orz-main{
+        display: flex;
+        justify-content: space-between;
+        width: 100%;
+        align-items: center;
+        margin-bottom: 14px!important;
+        height:30px;
+      }
+      .orz-name{
+        font-weight:700;
+        color:#333333;
+        font-size:22px;
+      }
+      .orz-desc{
+        color:#4c5b76;
+        font-size:15px;
+        line-height:26px;
+        height: 52px;
+      }
+    }
+  }
+}
 .teamBox{
   margin:10px 0px;
   border:1px solid #eee;
@@ -40,9 +84,11 @@
   margin:0px auto;
   padding-top:18px;
 }
-.list{
+.content-orz .list{
   display: flex;
   align-items: flex-start;
+  width: 1200px;
+  margin:0px auto;
   .list-l{
     background-color: #fff;
     max-width: 860px;

src/forge/Team/List.jsx

@@ -8,6 +8,7 @@ import Right from './RightBox';
 import NoData from '../Nodata';
 import CheckProfile from '../Component/ProfileModal/Profile';
 import { Menu , Pagination , Dropdown , Spin } from 'antd';
+import { getImageUrl } from 'educoder';
 import axios from 'axios';
 
 const limit = 15;
@@ -18,9 +19,24 @@ function List(props){
   const [ search , setSearch ] = useState(undefined);
   const [ page , setPage ] = useState(1);
   const [ sortBy , setSortBy ] = useState("updated_on");
+  const [ organizeDetail , setOrganizeDetail ] = useState(undefined);
 
   const OIdentifier = props.match.params.OIdentifier;
-  const organizeDetail = props.organizeDetail;
+
+  useEffect(()=>{
+    if(OIdentifier){
+      getDetail(OIdentifier);
+    }
+  },[OIdentifier]);
+
+  function getDetail(id) {
+    const url = `/organizations/${id}.json`;
+    axios.get(url).then(result=>{
+      if(result && result.data){
+        setOrganizeDetail(result.data);
+      }
+    }).catch(error=>{})
+  }
 
   useEffect(()=>{
     if(organizeDetail){
@@ -78,52 +94,68 @@ function List(props){
   )
   
   return(
-    <div className="list">
-      <div className="list-l">
-          <div>
-            <div className="head">
-              <div style={{width:"370px"}}>
-                <Search placeholder="输入仓库名称进行搜索" onSearch={onSearch}/>
-              </div>
-              <p>
-                { organizeDetail && organizeDetail.can_create_project ?
-                <Sort menu={menu_new} overlayClassName={"newPopUl"}>
-                  <a className="addBtn mr30">+&nbsp;新建项目</a>
-                </Sort>
-                :""}
-                <Dropdown overlay={menu}>
-                  <a className="color-blue">排序<i className="iconfont icon-sanjiaoxing-down ml3 font-14"></i></a>
-                </Dropdown>
-              </p>
-            </div>
-            <Spin spinning={isSpin}>
-              <div className="team">
-                {
-                  list && list.length>0 ? list.map((item,key)=>{
-                    return(
-                      <Item item={item} keu={key} OIdentifier={OIdentifier}/>
-                    )
-                  })
-                  :
-                  <NoData _html="暂无数据"/>
-                }
-              </div>
-            </Spin>
+    <div className="content-orz">
+      <div className="top-orz">
+        <div className="box">
+          <img src={getImageUrl(organizeDetail && organizeDetail.avatar_url)} alt=""/>
+          <div className="info-orz">
+            <p className="orz-main">
+              <span className="orz-name">{organizeDetail && organizeDetail.nickname}</span>
+              {organizeDetail && organizeDetail.is_admin ? 
+                <Link to={`/${OIdentifier}/setting`} className="color-blue ml10 font-14 df"><i className="iconfont icon-shezhi2"></i>设置</Link>
+              :""}
+            </p>
+            <div className="orz-desc task-hide-2">{organizeDetail && organizeDetail.description}</div>
           </div>
-          {
-            totalCount > limit &&
-            <div className="mb20 mt20" style={{textAlign:"center"}}>
-              <Pagination simple current={page} total={totalCount} pageSize={limit} onChange={(page)=>setPage(page)}/>
-            </div>
-          }
         </div>
-      <Right 
-        admin={organizeDetail && organizeDetail.is_admin} 
-        OIdentifier={OIdentifier} 
-        showCompeleteDialog={props.showCompeleteDialog} 
-        completeProfile={props.completeProfile}
-        history={props.history}
-      />
+      </div>
+      <div className="list">
+        <div className="list-l">
+            <div>
+              <div className="head">
+                <div style={{width:"370px"}}>
+                  <Search placeholder="输入仓库名称进行搜索" onSearch={onSearch}/>
+                </div>
+                <p>
+                  { organizeDetail && organizeDetail.can_create_project ?
+                  <Sort menu={menu_new} overlayClassName={"newPopUl"}>
+                    <a className="addBtn mr30">+&nbsp;新建项目</a>
+                  </Sort>
+                  :""}
+                  <Dropdown overlay={menu}>
+                    <a className="color-blue">排序<i className="iconfont icon-sanjiaoxing-down ml3 font-14"></i></a>
+                  </Dropdown>
+                </p>
+              </div>
+              <Spin spinning={isSpin}>
+                <div className="team">
+                  {
+                    list && list.length>0 ? list.map((item,key)=>{
+                      return(
+                        <Item item={item} keu={key} OIdentifier={OIdentifier}/>
+                      )
+                    })
+                    :
+                    <NoData _html="暂无数据"/>
+                  }
+                </div>
+              </Spin>
+            </div>
+            {
+              totalCount > limit &&
+              <div className="mb20 mt20" style={{textAlign:"center"}}>
+                <Pagination simple current={page} total={totalCount} pageSize={limit} onChange={(page)=>setPage(page)}/>
+              </div>
+            }
+          </div>
+        <Right 
+          admin={organizeDetail && organizeDetail.is_admin} 
+          OIdentifier={OIdentifier} 
+          showCompeleteDialog={props.showCompeleteDialog} 
+          completeProfile={props.completeProfile}
+          history={props.history}
+        />
+      </div>
     </div>
   )
 }