68 lines
1.9 KiB
JavaScript
68 lines
1.9 KiB
JavaScript
import React, { useState, useEffect } from 'react';
|
|
import Cards from '../../Component/MemberCards';
|
|
import { getImageUrl } from 'educoder';
|
|
import axios from 'axios';
|
|
import { Spin, Empty,Pagination } from 'antd';
|
|
export default ((props) => {
|
|
const [page, setPage] = useState(1);
|
|
const [limit, setLimit] = useState(15);
|
|
const [total, setTotal] = useState(0);
|
|
const [data, setMembers] = useState(undefined);
|
|
const [isSpin, setIsSpin] = useState(false);
|
|
const { OIdentifier, groupId } = props.match.params;
|
|
const { current_user } = props;
|
|
|
|
useEffect(() => {
|
|
getMember()
|
|
}, [page])
|
|
|
|
function getMember() {
|
|
setIsSpin(true)
|
|
const url = `/organizations/${OIdentifier}/teams/${groupId}/team_users.json`;
|
|
axios
|
|
.get(url, {
|
|
params: {
|
|
page,
|
|
limit
|
|
},
|
|
})
|
|
.then((result) => {
|
|
if (result && result.data) {
|
|
setMembers(result.data.team_users)
|
|
setTotal(result.data.total_count)
|
|
}
|
|
}).catch((error) => { });
|
|
setIsSpin(false)
|
|
};
|
|
|
|
return (
|
|
<Spin spinning={isSpin}>
|
|
<div className="MemberBoxThree">
|
|
{
|
|
data && data.length > 0 ? data.map((item, key) => {
|
|
return (
|
|
<Cards
|
|
img={getImageUrl(`images/${item.user.image_url}`)}
|
|
name={item.user.name}
|
|
time={item.created_at}
|
|
focusStatus={item.user.watched}
|
|
is_current_user={current_user && item.user.login === current_user.login}
|
|
login={item.user.login}
|
|
/>
|
|
)
|
|
})
|
|
:
|
|
<Empty image={Empty.PRESENTED_IMAGE_SIMPLE} />
|
|
}
|
|
</div>
|
|
{
|
|
total > limit ?
|
|
<div className="edu-txt-center mt30 mb20">
|
|
<Pagination simple defaultCurrent={page} total={total} pageSize={limit} onChange={ChangePage}></Pagination>
|
|
</div>
|
|
: ""
|
|
}
|
|
</Spin>
|
|
|
|
)
|
|
}) |