forgeplus-react/src/forge/UsersList/common_users.js

109 lines
2.6 KiB
JavaScript

import React, { Component } from "react";
import axios from "axios";
import { Spin, Pagination } from "antd";
import "./list.css";
import NoneData from "../Nodata";
import UserList from "./user_list"
class CommonUsers extends Component {
constructor(props) {
super(props);
this.state = {
user_type: this.props.user_type,
type_title: this.props.type_title,
project_id: this.props.project_id,
owner:this.props.owner,
users: null,
count: 0,
limit: 20,
page: 1,
isSpin: false,
};
}
componentDidMount = () => {
this.getUsersList();
};
getUsersList = (page, limit) => {
this.setState({
isSpin: true,
});
const { user_type, project_id ,owner } = this.state;
const url = `/${owner}/${project_id}/${user_type}.json`;
axios.get(url, {
params: {
page,
limit,
},
}).then((result) => {
if (result) {
this.setState({
count: result.data.count,
users: result.data.users,
isSpin: false,
});
}
})
.catch((error) => {
console.log(error);
});
};
// 翻页
ChangePage = (page) => {
this.setState({
page,
isSpin: true,
});
const { limit } = this.state;
this.getUsersList(page, limit);
};
Paginations =() => {
const { count, page, limit } = this.state;
return(
<React.Fragment>
{count > limit ? (
<div className="mt50 mb30 edu-txt-center">
<Pagination
simple
defaultCurrent={page}
total={count}
pageSize={limit}
onChange={this.ChangePage}
></Pagination>
</div>
) : (
""
)}
</React.Fragment>
)
};
render() {
const { users, count , isSpin, type_title } = this.state;
return (
<div className="pbt15">
<div className="main background-f minH-670">
<div className="plr-20 user-list-items">
<div className="font-18 pb-10 border-b-line">{type_title}</div>
<Spin spinning={isSpin}>
<div className="w-100 inline-block">
{count === 0 ? (
<NoneData _html="暂时还没有相关数据!" />
) : (
<UserList users={users} userClass={'w-25'} successFunc={this.getUsersList} {...this.props}></UserList>
)}
</div>
</Spin>
{this.Paginations()}
</div>
</div>
</div>
);
}
}
export default CommonUsers;