llvy.ltd/casdoor
1
0
Fork 0
mirror of https://github.com/casdoor/casdoor.git synced 2025-07-04 21:30:24 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: add server-side pagination (#312)

Browse Source 
Signed-off-by: “seriouszyx” <seriouszyx@foxmail.com>
This commit is contained in:
Yixiang Zhao
2021-11-06 11:32:22 +08:00
committed by GitHub
parent 7520b71198
commit b1db47bad1
28 changed files with 444 additions and 103 deletions
Download Patch File Download Diff File Expand all files Collapse all files

34
web/src/ApplicationListPage.js
View File

@ -27,28 +27,33 @@ class ApplicationListPage extends React.Component {
this.state = {
classes: props,
applications: null,
total: 0,
};
}
UNSAFE_componentWillMount() {
this.getApplications();
this.getApplications(1, 10);
}
getApplications() {
ApplicationBackend.getApplications("admin")
getApplications(page, pageSize) {
ApplicationBackend.getApplications("admin", page, pageSize)
.then((res) => {
this.setState({
applications: res,
});
if (res.status === "ok") {
this.setState({
applications: res.data,
total: res.data2
});
}
});
}
newApplication() {
var randomName = Math.random().toString(36).slice(-6)
return {
owner: "admin", // this.props.account.applicationname,
name: `application_${this.state.applications.length}`,
name: `application_${randomName}`,
createdTime: moment().format(),
displayName: `New Application - ${this.state.applications.length}`,
displayName: `New Application - ${randomName}`,
logo: "https://cdn.casbin.com/logo/logo_1024x256.png",
enablePassword: true,
enableSignUp: true,
@ -75,6 +80,7 @@ class ApplicationListPage extends React.Component {
Setting.showMessage("success", `Application added successfully`);
this.setState({
applications: Setting.prependRow(this.state.applications, newApplication),
total: this.state.total + 1
});
}
)
@ -89,6 +95,7 @@ class ApplicationListPage extends React.Component {
Setting.showMessage("success", `Application deleted successfully`);
this.setState({
applications: Setting.deleteRow(this.state.applications, i),
total: this.state.total - 1
});
}
)
@ -213,9 +220,18 @@ class ApplicationListPage 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.getApplications(page, pageSize),
onShowSizeChange: (current, size) => this.getApplications(current, size),
};
return (
<div>
<Table scroll={{x: 'max-content'}} columns={columns} dataSource={applications} rowKey="name" size="middle" bordered pagination={{pageSize: 100}}
<Table scroll={{x: 'max-content'}} columns={columns} dataSource={applications} rowKey="name" size="middle" bordered pagination={paginationProps}
title={() => (
<div>
{i18next.t("general:Applications")}&nbsp;&nbsp;&nbsp;&nbsp;