import { Table, Tag } from "@arco-design/web-react";
import type { RequestLogTableProps } from "./interface";

export function RequestLogTable({ data, loading }: RequestLogTableProps) {
    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 },
            ]}
        />
    );
}