34 lines
1016 B
TypeScript
34 lines
1016 B
TypeScript
import type React from "react";
|
|
import type { Player } from "../types";
|
|
import { Avatar, Table } from "antd";
|
|
import User from "./User";
|
|
|
|
interface Props {
|
|
loading?: boolean;
|
|
players?: Player[];
|
|
}
|
|
|
|
export const PlayerList: React.FC<Props> = props => {
|
|
return (
|
|
<>
|
|
<Table
|
|
dataSource={props.players}
|
|
rowKey={(e) => `${e.name}-${e.uid}`}
|
|
loading={props.loading}
|
|
>
|
|
<Table.Column width={32} dataIndex={'_'} align="center" render={(_, __, i) => `${i + 1}`} />
|
|
<Table.Column width={32} dataIndex={'avatar'} align="center" render={src => <Avatar src={src} />} />
|
|
<Table.Column
|
|
width={200}
|
|
title="姓名"
|
|
align="center"
|
|
dataIndex={'name'}
|
|
render={(name, { uid }) => <User name={name} uid={uid} />}
|
|
/>
|
|
<Table.Column width={200} dataIndex={'score'} title="积分" sorter={{
|
|
compare: ({ score: a }: Player, { score: b}: Player) => a - b,
|
|
}} />
|
|
</Table>
|
|
</>
|
|
);
|
|
} |