small problem

2021-02-24 10:53:17 +08:00 · 2021-02-24 10:53:17 +08:00 · d11cb7fc40
parent 696fb22a58
commit d11cb7fc40
5 changed files with 82 additions and 68 deletions
--- a/src/forge/Team/Group/Setting/GroupMemberSetting.jsx
+++ b/src/forge/Team/Group/Setting/GroupMemberSetting.jsx
@ -1,15 +1,16 @@
 import React, { useState, useEffect } from 'react';
 import { WhiteBack , FlexAJ } from '../../../Component/layout';
-import { Menu, Table, Pagination, Icon, Tooltip, Popconfirm, Dropdown, Spin } from 'antd';
-import Sort from '../../../Component/Sort';
+import { Table, Pagination , Popconfirm , Spin } from 'antd';
 import Title from '../../../Component/Title';
 import Search from '../../../Component/Search';
 import AddMember from '../../../Component/AddMember';
+import './setting.scss';

 import styled from 'styled-components';
 import { getImageUrl } from 'educoder';
 import axios from 'axios';
 import { Link } from 'react-router-dom';
+
 const Img = styled.img`{
  width:30px;
  height:30px;
--- a/src/forge/Team/Group/Setting/setting.scss
+++ b/src/forge/Team/Group/Setting/setting.scss
@ -0,0 +1,5 @@
+
+.ant-btn.ant-input-search-button{
+  margin-top: -1px;
+  margin-right: -1px;
+}
--- a/src/forge/Team/Index.scss
+++ b/src/forge/Team/Index.scss
@ -360,5 +360,5 @@
  }
 }
 .hide{
-  display: none;
+  display: hidden;
 }
--- a/src/forge/Team/TeamGroupItems.jsx
+++ b/src/forge/Team/TeamGroupItems.jsx
@ -19,7 +19,7 @@ const ImgContent = styled.img`{
 }`
 function TeamGroupItems({organizeDetail,limit, count , history}){
  const [ page , setPage ] = useState(1);
-  const [ isSpin , setIsSpin ] = useState(false);
+  const [ isSpin , setIsSpin ] = useState(true);
  const [ total , setTotal ] = useState(0);
  const [ list , setList ] = useState(undefined);

@ -30,6 +30,7 @@ function TeamGroupItems({organizeDetail,limit, count , history}){
  },[organizeDetail]);

  function getData(){
+    setIsSpin(true);
    const url = `/organizations/${organizeDetail.id}/teams.json`;
    axios.get(url,{
      params:{ page ,limit}
@ -43,7 +44,6 @@ function TeamGroupItems({organizeDetail,limit, count , history}){
  }
  // 离开团队
  function outTeam(id){
-    setIsSpin(true);
    const url = `/organizations/${organizeDetail.id}/teams/${id}/team_users/quit.json`;
    axios.delete(url).then(result =>{
      if(result && result.data){
@ -57,7 +57,6 @@ function TeamGroupItems({organizeDetail,limit, count , history}){
  }
  // 解散团队
  function disMissGroup(id){
-    setIsSpin(true);
    const url = `/organizations/${organizeDetail.id}/teams/${id}.json`;
    axios.delete(url).then(result=>{
      if(result && result.data){
@ -67,51 +66,53 @@ function TeamGroupItems({organizeDetail,limit, count , history}){
  }
  return(
    <Spin spinning={isSpin}>
-    {
-      list && list.length > 0 ?
-      <div className="groupBox">
+      <div style={{minHeight:"400px"}}>
        {
-          list.map((item,key)=>{
-            return(
-            <div key={key}>
-              <p className="g-head">
-                <Link to={`/organize/${organizeDetail.name}/group/${item.id}`} className="color-grey-3 font-16">{item.name}</Link>
-                <span>
-                  { item.is_admin && item.authorize!=="owner" && <Popconfirm title={`确定解散团队${item.name}?`} okText="是" cancelText="否" onConfirm={()=>disMissGroup(item.id)}><a className="color-red">解散团队</a></Popconfirm>}
-                  { item.is_member && <LeaveTeam className="ml15" teamID={item.id} onOk={outTeam}/>}
-                  { item.is_admin && <a className="ml15 color-blue" onClick={()=>toGroupSetting(item.id)}>团队设置</a> }
-                </span>
-              </p>
-              <div className="g-body">
-                {
-                  item.users && item.users.map((i,k)=>{
-                    return( 
-                      k < count ? <Link to={`/users/${i.login}`}><ImgContent title={i.name} key={k} src={getImageUrl(`images/${i.image_url}`)}/></Link> 
-                      : 
-                      k === count ? 
-                      <Link to={`/organize/${organizeDetail && organizeDetail.name}/group/${item.id}`} className="moreMember" title="查看更多" ><i className="iconfont icon-zhunbeizhong"></i></Link>
-                      :""
-                    )
-                  })
-                }
-              </div>
-              <p className="g-foot">
-                <SpanFoot>{item.num_users}&nbsp;名成员</SpanFoot>
-                <SpanFoot>{item.num_projects}&nbsp;个项目</SpanFoot>
-              </p>
-            </div>
-            )
-          })
+          list && list.length > 0 && 
+          <div className="groupBox">
+            {
+              list.map((item,key)=>{
+                return(
+                <div key={key}>
+                  <p className="g-head">
+                    <Link to={`/organize/${organizeDetail.name}/group/${item.id}`} className="color-grey-3 font-16">{item.name}</Link>
+                    <span>
+                      { item.is_admin && item.authorize!=="owner" && <Popconfirm title={`确定解散团队${item.name}?`} okText="是" cancelText="否" onConfirm={()=>disMissGroup(item.id)}><a className="color-red">解散团队</a></Popconfirm>}
+                      { item.is_member && <LeaveTeam className="ml15" teamID={item.id} onOk={outTeam}/>}
+                      { item.is_admin && <a className="ml15 color-blue" onClick={()=>toGroupSetting(item.id)}>团队设置</a> }
+                    </span>
+                  </p>
+                  <div className="g-body">
+                    {
+                      item.users && item.users.map((i,k)=>{
+                        return( 
+                          k < count ? <Link to={`/users/${i.login}`}><ImgContent title={i.name} key={k} src={getImageUrl(`images/${i.image_url}`)}/></Link> 
+                          : 
+                          k === count ? 
+                          <Link to={`/organize/${organizeDetail && organizeDetail.name}/group/${item.id}`} className="moreMember" title="查看更多" ><i className="iconfont icon-zhunbeizhong"></i></Link>
+                          :""
+                        )
+                      })
+                    }
+                  </div>
+                  <p className="g-foot">
+                    <SpanFoot>{item.num_users}&nbsp;名成员</SpanFoot>
+                    <SpanFoot>{item.num_projects}&nbsp;个项目</SpanFoot>
+                  </p>
+                </div>
+                )
+              })
+            }
+          </div>
+        }
+        { list && list.length > 0 && <Nodata _html="暂无数据"/> }
+        {
+          total > limit && 
+          <div className="mt20 pb20 edu-txt-center">
+            <Pagination simple current={page} total={total} pageSize={limit} onChange={(page)=>setPage(page)}/>
+          </div>
        }
      </div>
-      :<Nodata _html="暂无数据"/>
-    }
-    {
-      total > limit && 
-      <div className="mt20 pb20 edu-txt-center">
-        <Pagination simple current={page} total={total} pageSize={limit} onChange={(page)=>setPage(page)}/>
-      </div>
-    }
    </Spin>
  )
 }
--- a/src/forge/Team/TeamMember.jsx
+++ b/src/forge/Team/TeamMember.jsx
@ -3,12 +3,13 @@ import { Banner , WhiteBack } from '../Component/layout';
 import Cards from '../Component/MemberCards';
 import axios from 'axios';
 import Nodata from '../Nodata';
-import { Pagination } from 'antd';
+import { Pagination , Spin } from 'antd';

 const limit = 15;
 function TeamMember({organizeDetail,current_user}){
  const [ page , setPage ] = useState(1);
  const [ total , setTotal ] = useState(0);
+  const [ isSpin , setIsSpin ] = useState(true);
  const [ list , setList ] = useState(undefined);

  useEffect(()=>{
@ -18,6 +19,7 @@ function TeamMember({organizeDetail,current_user}){
  },[organizeDetail,page]);

  function getData(){
+    setIsSpin(true);
    const url = `/organizations/${organizeDetail.id}/organization_users.json`;
    axios.get(url,{
      page,limit
@ -25,6 +27,7 @@ function TeamMember({organizeDetail,current_user}){
      if(result && result.data){
        setList(result.data.organization_users);
        setTotal(result.data.total_count);
+        setIsSpin(false);
      }
    })
  }
@ -32,28 +35,32 @@ function TeamMember({organizeDetail,current_user}){
  return(
    <WhiteBack style={{marginBottom:"30px"}}>
      <Banner>组织成员</Banner>
-      {
-        list && list.length > 0 ?
-        <div className="memberBox">
+      <Spin spinning={isSpin}>
+        <div style={{minHeight:"400px"}}>
          {
-            list.map((item,key)=>{
-              return(
-                item.user && <Cards
-                  user={item.user} 
-                  img={item.user.image_url}
-                  name={item.user.name}
-                  time={item.created_at}
-                  focusStatus={item.user.watched}
-                  is_current_user={current_user && current_user.login === item.user.login}
-                  login={item.user && item.user.login}
-                  successFunc={getData}
-                />
-              )
-            })
+            list && list.length > 0 &&
+            <div className="memberBox">
+              {
+                list.map((item,key)=>{
+                  return(
+                    item.user && <Cards
+                      user={item.user} 
+                      img={item.user.image_url}
+                      name={item.user.name}
+                      time={item.created_at}
+                      focusStatus={item.user.watched}
+                      is_current_user={current_user && current_user.login === item.user.login}
+                      login={item.user && item.user.login}
+                      successFunc={getData}
+                    />
+                  )
+                })
+              }
+            </div>
          }
+          { list && list.length === 0 && <Nodata _html="暂无数据"/> }
        </div>
-        :<Nodata _html="暂无数据"/>
-      }
+      </Spin>
      {
        total >limit &&
        <div className="mt20 pb20 edu-txt-center">