import { PageContainer, ProList } from '@ant-design/pro-components';
import { Card, Space, Tag } from 'antd';
import moment from 'moment';
import request from 'umi-request';
import { ReportItem } from './reportItem';

const Logs: React.FC = () => {
  return (
    <PageContainer>
      <Card>
        <ProList<ReportItem>
          search={{
            filterType: 'light',
          }}
          rowKey="name"
          headerTitle="反馈列表"
          request={async (params = {} as Record<string, any>) =>
            request<{
              data: ReportItem[];
            }>('/admin/reportlist', {
              params,
            })
          }
          pagination={{
            pageSize: 10,
          }}
          metas={{
            title: {
              dataIndex: 'name',
              title: '用户',
            },
            avatar: {
              dataIndex: 'avatar',
              search: false,
            },
            subTitle: {
              dataIndex: 'phone',
              render: (_, row) => {
                return (
                  <Space size={0}>
                    <Tag color="blue" key={row.name}>
                      {row.phone}
                    </Tag>
                  </Space>
                );
              },
              title: '联系方式',
            },
            description: {
              dataIndex: 'text',
              search: false,
            },
            extra: {
              dataIndex: 'time',
              render: (_: React.ReactNode, row: ReportItem) => {
                return (
                  <div style={{ marginLeft: '3vh' }}>
                    {moment(row.time).format('YYYY-M-D HH:mm:ss')}
                  </div>
                );
              },
              search: false,
            },
          }}
        />
      </Card>
    </PageContainer>
  );
};
export default Logs;