This is an automated email from the ASF dual-hosted git repository.
likeguo pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-shenyu-dashboard.git
The following commit(s) were added to refs/heads/master by this push:
new 4aa6ddbd [ISSUE #216] pagination can chose pageSize (#217)
4aa6ddbd is described below
commit 4aa6ddbdfacd4ea1deb023996db0b98fff6c3964
Author: zhengpeng <[email protected]>
AuthorDate: Sun Jul 10 22:54:25 2022 +0800
[ISSUE #216] pagination can chose pageSize (#217)
* feature: basicConfig can chose pageSize
* feature: basicConfig can chose pageSize,format code
---
src/routes/System/AppAuth/index.js | 21 +++++++++++++++------
src/routes/System/Dict/index.js | 29 +++++++++++++++++++----------
src/routes/System/Metadata/index.js | 33 +++++++++++++++++++++------------
src/routes/System/Plugin/index.js | 33 +++++++++++++++++++++------------
src/routes/System/PluginHandle/index.js | 29 +++++++++++++++++++----------
5 files changed, 95 insertions(+), 50 deletions(-)
diff --git a/src/routes/System/AppAuth/index.js
b/src/routes/System/AppAuth/index.js
index 39dbb707..1a8b4ed8 100644
--- a/src/routes/System/AppAuth/index.js
+++ b/src/routes/System/AppAuth/index.js
@@ -39,6 +39,7 @@ export default class Auth extends Component {
super(props);
this.state = {
currentPage: 1,
+ pageSize: 12,
selectedRowKeys: [],
appKey: "",
phone: "",
@@ -78,28 +79,28 @@ export default class Auth extends Component {
query = () =>{
const { dispatch } = this.props;
- const { appKey,phone,currentPage } = this.state;
+ const { appKey,phone,currentPage,pageSize} = this.state;
dispatch({
type: "auth/fetch",
payload: {
appKey,
phone,
currentPage,
- pageSize: 20
+ pageSize
}
});
}
getAllAuths = page => {
const { dispatch } = this.props;
- const { appKey,phone } = this.state;
+ const { appKey,phone,pageSize } = this.state;
dispatch({
type: "auth/fetch",
payload: {
appKey,
phone,
currentPage: page,
- pageSize: 20
+ pageSize
}
});
};
@@ -108,6 +109,10 @@ export default class Auth extends Component {
this.setState({ currentPage: page }, this.query);
};
+ onShowSizeChange = (currentPage,pageSize) => {
+ this.setState({ currentPage: 1, pageSize }, this.query);
+ };
+
closeModal = (refresh) => {
if (refresh) {
this.setState({ popup: "" }, this.query);
@@ -447,7 +452,7 @@ export default class Auth extends Component {
render() {
const { auth, loading } = this.props;
const { authList, total } = auth;
- const { currentPage, selectedRowKeys, popup } = this.state;
+ const { currentPage, pageSize, selectedRowKeys, popup } = this.state;
const columns = this.state.columns.map((col, index) => ({
...col,
onHeaderCell: column => ({
@@ -524,8 +529,12 @@ export default class Auth extends Component {
rowSelection={rowSelection}
pagination={{
total,
+ showTotal: (showTotal) => `${showTotal}`,
+ showSizeChanger: true,
+ pageSizeOptions: ["12", "20", "50", "100"],
current: currentPage,
- pageSize:20,
+ pageSize,
+ onShowSizeChange: this.onShowSizeChange,
onChange: this.pageOnchange
}}
/>
diff --git a/src/routes/System/Dict/index.js b/src/routes/System/Dict/index.js
index a862ed37..93c70581 100644
--- a/src/routes/System/Dict/index.js
+++ b/src/routes/System/Dict/index.js
@@ -35,6 +35,7 @@ export default class ShenYuDict extends Component {
super(props);
this.state = {
currentPage: 1,
+ pageSize: 12,
selectedRowKeys: [],
type: "",
dictName: "",
@@ -75,7 +76,7 @@ export default class ShenYuDict extends Component {
query = () =>{
const { dispatch } = this.props;
- const { type, dictName, dictCode, currentPage } = this.state;
+ const { type, dictName, dictCode, currentPage, pageSize } = this.state;
dispatch({
type: "shenyuDict/fetch",
payload: {
@@ -83,7 +84,7 @@ export default class ShenYuDict extends Component {
dictName,
dictCode,
currentPage,
- pageSize: 12
+ pageSize
}
});
}
@@ -92,13 +93,17 @@ export default class ShenYuDict extends Component {
this.setState({ currentPage: page }, this.query);
};
+ onShowSizeChange = (currentPage,pageSize) => {
+ this.setState({ currentPage: 1,pageSize }, this.query);
+ };
+
closeModal = () => {
this.setState({ popup: "" });
};
editClick = record => {
const { dispatch } = this.props;
- const { currentPage } = this.state;
+ const { currentPage,pageSize } = this.state;
const currentType = this.state.type;
const currentDictCode = this.state.dictCode;
const currentDictName = this.state.dictName;
@@ -133,7 +138,7 @@ export default class ShenYuDict extends Component {
dictCode: currentDictCode,
dictName: currentDictName,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.closeModal();
@@ -169,7 +174,7 @@ export default class ShenYuDict extends Component {
deleteClick = () => {
const { dispatch } = this.props;
- const { type, dictCode, dictName, currentPage, selectedRowKeys } =
this.state;
+ const { type, dictCode, dictName, currentPage, pageSize, selectedRowKeys }
= this.state;
if (selectedRowKeys && selectedRowKeys.length > 0) {
dispatch({
type: "shenyuDict/delete",
@@ -181,7 +186,7 @@ export default class ShenYuDict extends Component {
dictCode,
dictName,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [], currentPage: 1 }, this.query);
@@ -194,7 +199,7 @@ export default class ShenYuDict extends Component {
};
addClick = () => {
- const { currentPage } = this.state;
+ const { currentPage,pageSize } = this.state;
this.setState({
popup: (
<AddModal
@@ -215,7 +220,7 @@ export default class ShenYuDict extends Component {
},
fetchValue: {
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [], currentPage: 1 },
this.query);
@@ -364,7 +369,7 @@ export default class ShenYuDict extends Component {
const { shenyuDict, loading } = this.props;
const { shenyuDictList, total } = shenyuDict;
- const { currentPage, selectedRowKeys, type, dictCode, dictName, popup } =
this.state;
+ const { currentPage, pageSize, selectedRowKeys, type, dictCode, dictName,
popup } = this.state;
const columns = this.state.columns.map((col, index) => ({
...col,
onHeaderCell: column => ({
@@ -458,8 +463,12 @@ export default class ShenYuDict extends Component {
rowSelection={rowSelection}
pagination={{
total,
+ showTotal: (showTotal) => `${showTotal}`,
+ showSizeChanger: true,
+ pageSizeOptions: ["12", "20", "50", "100"],
current: currentPage,
- pageSize: 12,
+ pageSize,
+ onShowSizeChange: this.onShowSizeChange,
onChange: this.pageOnchange
}}
/>
diff --git a/src/routes/System/Metadata/index.js
b/src/routes/System/Metadata/index.js
index 59370449..c2430286 100644
--- a/src/routes/System/Metadata/index.js
+++ b/src/routes/System/Metadata/index.js
@@ -35,6 +35,7 @@ export default class Metadata extends Component {
super(props);
this.state = {
currentPage: 1,
+ pageSize: 12,
selectedRowKeys: [],
appName: "",
path: "",
@@ -74,13 +75,13 @@ export default class Metadata extends Component {
query = () => {
const { dispatch } = this.props;
- const { path, currentPage } = this.state;
+ const { path, currentPage, pageSize } = this.state;
dispatch({
type: "metadata/fetch",
payload: {
path,
currentPage,
- pageSize: 12
+ pageSize
}
});
};
@@ -89,13 +90,17 @@ export default class Metadata extends Component {
this.setState({ currentPage: page }, this.query);
};
+ onShowSizeChange = (currentPage,pageSize) => {
+ this.setState({ currentPage: 1, pageSize }, this.query);
+ };
+
closeModal = () => {
this.setState({ popup: "" });
};
editClick = record => {
const { dispatch } = this.props;
- const { currentPage } = this.state;
+ const { currentPage,pageSize } = this.state;
const name = this.state.appName;
dispatch({
type: "metadata/fetchItem",
@@ -127,7 +132,7 @@ export default class Metadata extends Component {
fetchValue: {
appName: name,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.closeModal();
@@ -154,7 +159,7 @@ export default class Metadata extends Component {
deleteClick = () => {
const { dispatch } = this.props;
- const { appName, currentPage, selectedRowKeys } = this.state;
+ const { appName, currentPage,pageSize, selectedRowKeys } = this.state;
if (selectedRowKeys && selectedRowKeys.length > 0) {
dispatch({
type: "metadata/delete",
@@ -164,7 +169,7 @@ export default class Metadata extends Component {
fetchValue: {
appName,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [], currentPage: 1 }, this.query);
@@ -177,7 +182,7 @@ export default class Metadata extends Component {
};
addClick = () => {
- const { currentPage } = this.state;
+ const { currentPage,pageSize } = this.state;
const name = this.state.appName;
this.setState({
popup: (
@@ -202,7 +207,7 @@ export default class Metadata extends Component {
fetchValue: {
appName: name,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [], currentPage: 1 },
this.query);
@@ -220,7 +225,7 @@ export default class Metadata extends Component {
enableClick = () => {
const { dispatch } = this.props;
- const { appName, currentPage, selectedRowKeys } = this.state;
+ const { appName, currentPage, pageSize, selectedRowKeys } = this.state;
if (selectedRowKeys && selectedRowKeys.length > 0) {
dispatch({
@@ -239,7 +244,7 @@ export default class Metadata extends Component {
fetchValue: {
appName,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [] }, this.query);
@@ -382,7 +387,7 @@ export default class Metadata extends Component {
const { metadata, loading } = this.props;
const { userList, total } = metadata;
- const { currentPage, selectedRowKeys, path, popup } = this.state;
+ const { currentPage, pageSize, selectedRowKeys, path, popup } = this.state;
const columns = this.state.columns.map((col, index) => ({
...col,
onHeaderCell: column => ({
@@ -473,8 +478,12 @@ export default class Metadata extends Component {
rowSelection={rowSelection}
pagination={{
total,
+ showTotal: (showTotal) => `${showTotal}`,
+ showSizeChanger: true,
+ pageSizeOptions: ["12", "20", "50", "100"],
current: currentPage,
- pageSize: 12,
+ pageSize,
+ onShowSizeChange: this.onShowSizeChange,
onChange: this.pageOnchange
}}
/>
diff --git a/src/routes/System/Plugin/index.js
b/src/routes/System/Plugin/index.js
index cc84569f..feeb49b4 100644
--- a/src/routes/System/Plugin/index.js
+++ b/src/routes/System/Plugin/index.js
@@ -40,6 +40,7 @@ export default class Plugin extends Component {
super(props);
this.state = {
currentPage: 1,
+ pageSize: 12,
selectedRowKeys: [],
name: "",
enabled: null,
@@ -81,28 +82,28 @@ export default class Plugin extends Component {
query = () => {
const { dispatch } = this.props;
- const { name, enabled, currentPage } = this.state;
+ const { name, enabled, currentPage, pageSize } = this.state;
dispatch({
type: "plugin/fetch",
payload: {
name,
enabled,
currentPage,
- pageSize: 12
+ pageSize
}
});
}
getAllPlugins = page => {
const { dispatch } = this.props;
- const { name, enabled } = this.state;
+ const { name, enabled,pageSize } = this.state;
dispatch({
type: "plugin/fetch",
payload: {
name,
enabled,
currentPage: page,
- pageSize: 12
+ pageSize
}
});
};
@@ -111,6 +112,10 @@ export default class Plugin extends Component {
this.setState({ currentPage: page }, this.query);
};
+ onShowSizeChange = (currentPage,pageSize) => {
+ this.setState({ currentPage: 1, pageSize}, this.query);
+ };
+
closeModal = (refresh = false) => {
if (refresh) {
this.setState({ popup: "", currentPage:1 }, this.query);
@@ -121,7 +126,7 @@ export default class Plugin extends Component {
editClick = record => {
const { dispatch } = this.props;
- const { currentPage } = this.state;
+ const { currentPage,pageSize } = this.state;
const pluginName = this.state.name;
dispatch({
type: "plugin/fetchItem",
@@ -157,7 +162,7 @@ export default class Plugin extends Component {
fetchValue: {
name: pluginName,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [] });
@@ -221,7 +226,7 @@ export default class Plugin extends Component {
};
addClick = () => {
- const { currentPage } = this.state;
+ const { currentPage,pageSize } = this.state;
const pluginName = this.state.name;
this.setState({
popup: (
@@ -242,7 +247,7 @@ export default class Plugin extends Component {
fetchValue: {
name: pluginName,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.closeModal(true);
@@ -279,7 +284,7 @@ export default class Plugin extends Component {
// 批量启用或禁用
enableClick = () => {
const { dispatch } = this.props;
- const { selectedRowKeys, currentPage, name } = this.state;
+ const { selectedRowKeys, currentPage, pageSize, name } = this.state;
if (selectedRowKeys && selectedRowKeys.length > 0) {
dispatch({
type: "plugin/fetchItem",
@@ -296,7 +301,7 @@ export default class Plugin extends Component {
fetchValue: {
name,
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [] });
@@ -456,7 +461,7 @@ export default class Plugin extends Component {
render() {
const { plugin, loading } = this.props;
const { pluginList, total } = plugin;
- const { currentPage, selectedRowKeys, name, enabled, popup } = this.state;
+ const { currentPage, pageSize, selectedRowKeys, name, enabled, popup } =
this.state;
const columns = this.state.columns.map((col, index) => ({
...col,
onHeaderCell: column => ({
@@ -553,8 +558,12 @@ export default class Plugin extends Component {
rowSelection={rowSelection}
pagination={{
total,
+ showTotal: (showTotal) => `${showTotal}`,
+ showSizeChanger: true,
+ pageSizeOptions: ["12", "20", "50", "100"],
current: currentPage,
- pageSize: 12,
+ pageSize,
+ onShowSizeChange: this.onShowSizeChange,
onChange: this.pageOnchange
}}
/>
diff --git a/src/routes/System/PluginHandle/index.js
b/src/routes/System/PluginHandle/index.js
index a012c698..a468dc40 100644
--- a/src/routes/System/PluginHandle/index.js
+++ b/src/routes/System/PluginHandle/index.js
@@ -37,6 +37,7 @@ export default class PluginHandle extends Component {
super(props);
this.state = {
currentPage: 1,
+ pageSize: 12,
selectedRowKeys: [],
pluginDict: [],
popup: "",
@@ -69,14 +70,14 @@ export default class PluginHandle extends Component {
*/
query = () => {
const {dispatch} = this.props;
- const {pluginId, field, currentPage} = this.state;
+ const {pluginId, field, currentPage, pageSize} = this.state;
dispatch({
type: "pluginHandle/fetch",
payload: {
pluginId,
field,
currentPage,
- pageSize: 12
+ pageSize
}
});
};
@@ -96,6 +97,10 @@ export default class PluginHandle extends Component {
this.setState({ currentPage: page },this.query);
};
+ onShowSizeChange = (currentPage,pageSize) => {
+ this.setState({ currentPage: 1,pageSize }, this.query);
+ };
+
/**
* close model
* @param reset after is reset search condition
@@ -118,7 +123,7 @@ export default class PluginHandle extends Component {
editClick = record => {
const { dispatch } = this.props;
- const { currentPage } = this.state;
+ const { currentPage,pageSize } = this.state;
this.loadPluginDict()
const pluginDropDownList = this.state.pluginDict
dispatch({
@@ -166,7 +171,7 @@ export default class PluginHandle extends Component {
},
fetchValue: {
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.closeModal(true);
@@ -184,7 +189,7 @@ export default class PluginHandle extends Component {
};
addClick = () => {
- const {currentPage} = this.state;
+ const {currentPage,pageSize} = this.state;
this.loadPluginDict()
const pluginDropDownList = this.state.pluginDict
this.setState({
@@ -219,7 +224,7 @@ export default class PluginHandle extends Component {
},
fetchValue: {
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.closeModal(true);
@@ -240,7 +245,7 @@ export default class PluginHandle extends Component {
deleteClick = () => {
const { dispatch } = this.props;
- const { currentPage, selectedRowKeys } = this.state;
+ const { currentPage, pageSize, selectedRowKeys } = this.state;
if (selectedRowKeys && selectedRowKeys.length > 0) {
dispatch({
type: "pluginHandle/delete",
@@ -249,7 +254,7 @@ export default class PluginHandle extends Component {
},
fetchValue: {
currentPage,
- pageSize: 12
+ pageSize
},
callback: () => {
this.setState({ selectedRowKeys: [],currentPage:1 },this.query);
@@ -455,7 +460,7 @@ export default class PluginHandle extends Component {
render() {
const {pluginHandle, loading} = this.props;
const {pluginHandleList, total, pluginDropDownList} = pluginHandle;
- const {currentPage, selectedRowKeys, pluginId, field, popup, columns = []}
= this.state;
+ const {currentPage, pageSize, selectedRowKeys, pluginId, field, popup,
columns = []} = this.state;
const tableColumns = columns.map((col, index) => ({
@@ -544,8 +549,12 @@ export default class PluginHandle extends Component {
rowSelection={rowSelection}
pagination={{
total,
+ showTotal: (showTotal) => `${showTotal}`,
+ showSizeChanger: true,
+ pageSizeOptions: ["12", "20", "50", "100"],
current: currentPage,
- pageSize: 12,
+ pageSize,
+ onShowSizeChange: this.onShowSizeChange,
onChange: this.pageOnchange
}}
/>
