36 lines
988 B
TypeScript
36 lines
988 B
TypeScript
import { Card, Space, Table, Typography } from "antd";
|
|
import type { Player } from "../types";
|
|
import { useMemo } from "react";
|
|
|
|
interface Props {
|
|
index: number;
|
|
players?: Player[];
|
|
}
|
|
|
|
export const GroupMember: React.FC<Props> = props => {
|
|
const char = useMemo(() => {
|
|
const baseCode = 'A'.charCodeAt(0);
|
|
let idx = props.index;
|
|
const times = Math.floor(idx / 26);
|
|
const code = 'A'.repeat(times);
|
|
const lastChar = baseCode + (idx % 26);
|
|
return `${code}${String.fromCharCode(lastChar)}`;
|
|
}, []);
|
|
return (
|
|
<Card title={`${char} 组`} style={{ minWidth: 300 }}>
|
|
<Table
|
|
size="small"
|
|
rowKey={e => `${e.name}-${e.score}`}
|
|
showHeader={false}
|
|
pagination={false}
|
|
dataSource={props.players}
|
|
columns={[
|
|
{ dataIndex: '_', render: (_, __, i) => `(${i + 1})` },
|
|
{ dataIndex: 'index' },
|
|
{ dataIndex: 'name' },
|
|
{ dataIndex: 'score' },
|
|
]}
|
|
/>
|
|
</Card>
|
|
);
|
|
} |