import { Table, Tag } from '@arco-design/web-react';
import type { RequestLog } from '../api/types';

export function RequestLogTable({ data, loading }: { data: RequestLog[]; loading: boolean }) {
  return (
    <Table rowKey="requestId" loading={loading} data={data} pagination={false} columns={[
      { title: '请求 ID', dataIndex: 'requestId', ellipsis: true },
      { title: '方法', dataIndex: 'method', width: 100, render: (value) => <Tag>{value}</Tag> },
      { title: '路径', dataIndex: 'path', ellipsis: true },
      { title: '状态', dataIndex: 'statusCode', width: 100, render: (value) => <Tag color={value < 400 ? 'green' : 'red'}>{value}</Tag> },
      { title: '耗时', dataIndex: 'costMs', width: 100, render: (value) => String(value) + 'ms' },
      { title: '消息', dataIndex: 'message', width: 180 },
    ]} />
  );
}