forgeplus-react/src/forge/Team/TeamMember.jsx

import React ,{ useEffect , useState } from 'react';
import { Banner , WhiteBack } from '../Component/layout';
import Cards from '../Component/MemberCards';
import axios from 'axios';
import Nodata from '../Nodata';
import { Pagination } from 'antd';

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

  useEffect(()=>{
    if(organizeDetail){
      getData();
    }
  },[organizeDetail,page]);

  function getData(){
    const url = `/organizations/${organizeDetail.id}/organization_users.json`;
    axios.get(url,{
      page,limit
    }).then(result=>{
      if(result && result.data){
        setList(result.data.organization_users);
        setTotal(result.data.total_count);
      }
    })
  }

  return(
    <WhiteBack style={{marginBottom:"30px"}}>
      <Banner>组织成员</Banner>
      {
        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>
        :<Nodata _html="暂无数据"/>
      }
      {
        total >limit &&
        <div className="mt20 pb20 edu-txt-center">
          <Pagination simple current={page} pageSize={limit} total={total} onChange={(page)=>setPage(page)}/>
        </div>
      }
    </WhiteBack>
  )
}export default TeamMember;