pc-admin/src/pages/cardList/index.jsx

import React, { useRef } from 'react'
import { Button } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import PageTable from '@/components/PageTable'
import { getCardList } from '@/services/card'
import { history } from 'umi';

export default (props) => {
  const actionRef = useRef();
  const goDetail = (id) => {
    history.push(`cardList/detail.jsx?id=${id}`);
  }
  const columns = [
    {
      title: '证件号',
      dataIndex: 'cardNo',
      key: 'cardNo',
      search: true,
    },
    {
      title: '犬主',
      dataIndex: 'personName',
      key: 'personName',
      search: true,
    },
    {
      title: '犬名',
      dataIndex: 'petName',
      key: 'petName',
      search: true,
    },
    {
      title: '有效期',
      dataIndex: 'createDate',
      key: 'createDate',
      render: (t, record) => record.startDate + (record.expireDate != null ? '~' + record.expireDate : ''),
      search: false
    },
    {
      title: '操作',
      valueType: 'option',
      width: 160,
      render: (_, record) => [
        <Button key={1} style={{ padding: 0 }} type="link"
          onClick={() => goDetail(record.cardId)}
        >
          详情
        </Button>
      ],
    },
  ]

  return (
    <PageHeaderWrapper>
      <PageTable
        actionRef={actionRef}
        columns={columns}
        request={getCardList}
        options={false}
        rowKey="cardId"
      />
    </PageHeaderWrapper>
  )
}