mirror of
https://github.com/casdoor/casdoor.git
synced 2025-07-04 05:10:19 +08:00
feat: add server-side pagination (#312)
Signed-off-by: “seriouszyx” <seriouszyx@foxmail.com>
This commit is contained in:
@ -26,28 +26,33 @@ class OrganizationListPage extends React.Component {
|
||||
this.state = {
|
||||
classes: props,
|
||||
organizations: null,
|
||||
total: 0
|
||||
};
|
||||
}
|
||||
|
||||
UNSAFE_componentWillMount() {
|
||||
this.getOrganizations();
|
||||
this.getOrganizations(1, 10);
|
||||
}
|
||||
|
||||
getOrganizations() {
|
||||
OrganizationBackend.getOrganizations("admin")
|
||||
getOrganizations(page, pageSize) {
|
||||
OrganizationBackend.getOrganizations("admin", page, pageSize)
|
||||
.then((res) => {
|
||||
this.setState({
|
||||
organizations: res,
|
||||
});
|
||||
if (res.status === "ok") {
|
||||
this.setState({
|
||||
organizations: res.data,
|
||||
total: res.data2
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
newOrganization() {
|
||||
var randomName = Math.random().toString(36).slice(-6)
|
||||
return {
|
||||
owner: "admin", // this.props.account.organizationname,
|
||||
name: `organization_${this.state.organizations.length}`,
|
||||
name: `organization_${randomName}`,
|
||||
createdTime: moment().format(),
|
||||
displayName: `New Organization - ${this.state.organizations.length}`,
|
||||
displayName: `New Organization - ${randomName}`,
|
||||
websiteUrl: "https://door.casbin.com",
|
||||
favicon: "https://cdn.casbin.com/static/favicon.ico",
|
||||
passwordType: "plain",
|
||||
@ -64,6 +69,7 @@ class OrganizationListPage extends React.Component {
|
||||
Setting.showMessage("success", `Organization added successfully`);
|
||||
this.setState({
|
||||
organizations: Setting.prependRow(this.state.organizations, newOrganization),
|
||||
total: this.state.total + 1
|
||||
});
|
||||
}
|
||||
)
|
||||
@ -78,6 +84,7 @@ class OrganizationListPage extends React.Component {
|
||||
Setting.showMessage("success", `Organization deleted successfully`);
|
||||
this.setState({
|
||||
organizations: Setting.deleteRow(this.state.organizations, i),
|
||||
total: this.state.total - 1
|
||||
});
|
||||
}
|
||||
)
|
||||
@ -197,9 +204,18 @@ class OrganizationListPage extends React.Component {
|
||||
},
|
||||
];
|
||||
|
||||
const paginationProps = {
|
||||
total: this.state.total,
|
||||
showQuickJumper: true,
|
||||
showSizeChanger: true,
|
||||
showTotal: () => i18next.t("general:{total} in total").replace("{total}", this.state.total),
|
||||
onChange: (page, pageSize) => this.getOrganizations(page, pageSize),
|
||||
onShowSizeChange: (current, size) => this.getOrganizations(current, size),
|
||||
};
|
||||
|
||||
return (
|
||||
<div>
|
||||
<Table scroll={{x: 'max-content'}} columns={columns} dataSource={organizations} rowKey="name" size="middle" bordered pagination={{pageSize: 100}}
|
||||
<Table scroll={{x: 'max-content'}} columns={columns} dataSource={organizations} rowKey="name" size="middle" bordered pagination={paginationProps}
|
||||
title={() => (
|
||||
<div>
|
||||
{i18next.t("general:Organizations")}
|
||||
|
Reference in New Issue
Block a user