完成标签的分页

src/pages/config/ConfigLabel.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { connectAlita } from 'redux-alita';
 import { withRouter } from 'react-router-dom';
-import { Button, Input, List, message, Modal, Spin } from 'antd';
+import { Button, Input, List, message, Modal, Spin, Pagination } from 'antd';
 import './styles/label.less';
 import AddLabelForm from './widget/AddLabelForm';
 
@@ -17,12 +17,15 @@ class ConfigLabel extends React.Component {
             removeModalVisible: false,
             currentLabel: null,
         };
+        this.params = {
+            page: 1,
+            pageSize: 10,
+        };
     }
 
 
     componentDidMount() {
         this._fetchLabels();
-        this.params = {};
     }
 
     _fetchLabels() {
@@ -73,11 +76,17 @@ class ConfigLabel extends React.Component {
 
     render() {
         const { data: labelList = {}, isFetching } = this.props.findPLabel || {};
+        let { records, current, total } = labelList || { total: 0, current: 1, records: [] };
+
+        console.log('params: ', this.params);
         const { currentLabel } = this.state;
         return (<div className="page-label-container">
             <div className="prop-label-header">
                 <Button htmlType="button" type="primary" icon="sync" loading={isFetching}
-                        onClick={this._fetchLabels.bind(this)}/>
+                        onClick={() => {
+                            this.params.page = 1;
+                            this._fetchLabels();
+                        }}/>
                 <Button htmlType="button" icon="plus"
                         onClick={() => this.setState({ currentLabel: {} })}/>
                 <Input.Search placeholder="输入关键词查询"
@@ -86,11 +95,20 @@ class ConfigLabel extends React.Component {
             </div>
             <Spin className="spin" spinning={isFetching} size="large"/>
             <List
-                dataSource={labelList.records}
+                dataSource={records}
                 bordered
                 size="small"
                 renderItem={this.renderItem.bind(this)}
             />
+            <Pagination defaultCurrent={current}
+                        style={{ marginTop: 10, padding: 10, background: 'white' }}
+                        onChange={(page, pageSize) => {
+                            this.params.page = page;
+                            this.params.pageSize = pageSize;
+                            this._fetchLabels();
+                        }}
+                        total={total}
+                        pageSize={this.params.pageSize}/>
             <AddLabelForm cancel={() => this.setState({ currentLabel: null })}
                           refresh={this._fetchLabels.bind(this)}
                           visible={!!currentLabel}