react antdpro class 组件，分页，筛选

组件1：排号

import React, {
    Component, Fragment } from 'react';
import {
    injectIntl, formatMessage } from 'react-intl';
import {
    connect } from 'dva';
import {
    Table, Tabs, Row, Col, Button, message, Modal, Select,LocaleProvider } from 'antd';
import {
    CloseCircleOutlined, ExclamationCircleOutlined } from '@ant-design/icons';
import styles from './waiting.less';
import zh_CN from 'antd/lib/locale-provider/zh_CN';
import {
    downLoadFile } from '../../../utils/utils';
import {
   
  GetSerialNumberList,
  ExportSerialNumberList,
  SerialNumberUpdate,
} from '../../../services/waiting';
import {
    debounce } from 'lodash';

const {
    TabPane } = Tabs;

// @Form.create()
//修饰器只能放在类的前面
@connect(({
    waitingAdmin }) => {
   
  return {
   
    waitingAdmin,
  };
})
class WaitingAdmin extends Component {
   
  constructor(props) {
   
    super(props);
    const {
    intl } = props;
    this.state = {
   
      spinning: false,
      currentPage: 1,
      pageSize: 20,
      total: 0,
      pageSizeOptions: ['10', '20', '50', '100'],
      selectedRowKeys: [],
      listData: [],
      statusCode: 1001,
    };
  }

  getSerialNumberList = (page = 1, pageSize = 20, statusCode = 1001) => {
   
    GetSerialNumberList({
   
      OrderBy: '',
      Page: page,
      ItemsPerPage: pageSize,
      SerialNumberStatus: statusCode,
    }).then(res => {
   
      if (res && res.Details) {
   
        this.setState({
    listData: res.Details || [] }