blog1

table.tsx

<Table
  rowKey={(record) => record.id}
  columns={[
    {
      title: 'ID',
      dataIndex: 'id',
      key: 'id',
    },
    {
      title: 'Tên',
      dataIndex: 'name',
      key: 'name',
      render: (text: string) => (
        <Typography.Text strong>{text}</Typography.Text>
      ),
    },
    {
      title: 'Phương thức',
      dataIndex: 'method',
      key: 'method',
      render: (text) => <RequestMethodTag method={text} />,
    },
    {
      title: 'URL',
      key: 'url',
      render: (_, record) => (
        <Typography.Link>{`${record.protocol}://${record.host}:${record.port}${record.path}`}</Typography.Link>
      ),
    },
    {
      title: 'Hành động',
      key: 'actions',
      render: (_, record) => (
        <Flex>
          <Button
            icon={<EditOutlined />}
            type="link"
            onClick={() => {
              setRequestById(record.id);
            }}
          >
            Sửa
          </Button>
          <Button danger type="link" icon={<DeleteOutlined />}>
            Xóa
          </Button>
        </Flex>
      ),
    },
  ]}
  dataSource={project.requests}
  pagination={false}
/>;