forked from Gitlink/forgeplus-react
91 lines
2.8 KiB
JavaScript
91 lines
2.8 KiB
JavaScript
import React, { useEffect, useState } from 'react';
|
|
import { WhiteBack , AlignCenter } from '../../Component/layout';
|
|
import "./sub.scss";
|
|
import axios from 'axios';
|
|
import { Pagination , Spin } from 'antd';
|
|
import NoData from '../../Nodata';
|
|
import { getImageUrl } from 'educoder';
|
|
import { Link } from 'react-router-dom';
|
|
|
|
function Contribute(props){
|
|
console.log('props', props);
|
|
const [ list , setList ] = useState(undefined);
|
|
const [ page , setPage ] = useState(1);
|
|
const [ total , setTotal ] = useState(0);
|
|
const [ isSpin , setIsSpin ] = useState(true);
|
|
|
|
const {project} = props;
|
|
const owner = props.match.params.owner;
|
|
const projectsId = props.match.params.projectsId;
|
|
const LIMIT = 20;
|
|
|
|
useEffect(()=>{
|
|
if(project){
|
|
// 更改网页标题
|
|
const {name, author} = project;
|
|
document.title = `贡献者列表-${author.name}/${name}`;
|
|
}
|
|
}, [project])
|
|
|
|
useEffect(()=>{
|
|
if(owner && projectsId){
|
|
getData();
|
|
}
|
|
},[owner,projectsId,page]);
|
|
|
|
function getData(){
|
|
setIsSpin(true);
|
|
const url = `/${owner}/${projectsId}/contributors.json`;
|
|
axios.get(url,{
|
|
params:{
|
|
limit:LIMIT,page,
|
|
}
|
|
}).then(result=>{
|
|
if(result){
|
|
setList(result.data.list);
|
|
setTotal(result.data.total_count);
|
|
setIsSpin(false);
|
|
}
|
|
}).catch(error=>{})
|
|
}
|
|
|
|
return(
|
|
<WhiteBack>
|
|
<Spin spinning={isSpin}>
|
|
<div className="boxPanel">
|
|
<p className="font-18 padding10-20" style={{borderBottom:"1px solid #eee"}}>贡献者列表</p>
|
|
{
|
|
list && list.length > 0 ?
|
|
<div className="contrbuteList">
|
|
{
|
|
list.map((item,key)=>{
|
|
return(
|
|
<AlignCenter className='mb15'>
|
|
<img alt="" style={{borderRadius:"50%",marginRight:"10px"}} src={getImageUrl(`/${item.image_url}`)} width="50px" height="50px"/>
|
|
<div>
|
|
<a href={item.id ? `/${item.login}` : `mailto:${item.email}`} className="font-16">{item.name}</a>
|
|
<p className="font-12 color-grey-9">提交{item.contributions}次{item.contribution_perc ? ` I 贡献占比${item.contribution_perc}` : ''}</p>
|
|
</div>
|
|
</AlignCenter>
|
|
)
|
|
})
|
|
}
|
|
</div>
|
|
:""
|
|
}
|
|
{
|
|
list && list.length === 0 ? <NoData _html="暂无贡献者" />:""
|
|
}
|
|
{
|
|
total > LIMIT ?
|
|
<div className="mt20 edu-txt-center">
|
|
<Pagination simple pageSize={LIMIT} onChange={(p)=>{setPage(p)}} current={page} total={total}/>
|
|
</div>
|
|
:""
|
|
}
|
|
</div>
|
|
</Spin>
|
|
</WhiteBack>
|
|
)
|
|
}
|
|
export default Contribute; |