kyuuseiryuu
65195289bd
- Move `BattleTable` logic from `GroupMember` to its own `BattleTable.tsx` component. - Clean up `GroupMember` by removing unused imports (`Divider`, `Flex`, `Space`, `Table`, `getRoundTable`). - Add new utility functions in `src/utils/common.ts`: - `higherWin` and `lowerWin` to calculate scores based on point difference thresholds. - `calculate` to determine the final score return value based on win/loss status.
53 lines
1.5 KiB
TypeScript
53 lines
1.5 KiB
TypeScript
import { useMemo, useState } from "react";
|
|
import { Button, Card, Drawer, Table } from "antd";
|
|
import type { BasePlayer } from "../types";
|
|
import User from "./User";
|
|
import BattleTable from "./BattleTable";
|
|
|
|
interface Props {
|
|
index: number;
|
|
players?: (BasePlayer & { id: string })[];
|
|
}
|
|
|
|
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)}`;
|
|
}, []);
|
|
const [open, setOpen] = useState(false);
|
|
return (
|
|
<Card
|
|
title={`${char} 组`}
|
|
style={{ minWidth: 300 }}
|
|
extra={<Button type="link" onClick={() => setOpen(true)}>查看对战表</Button>}
|
|
>
|
|
<Table
|
|
size="small"
|
|
rowKey={e => `${e.id}-${e.name}-${e.score}`}
|
|
showHeader={false}
|
|
pagination={false}
|
|
dataSource={props.players}
|
|
columns={[
|
|
{ dataIndex: '_', render: (_, __, i) => `(${i + 1})` },
|
|
{ dataIndex: 'number' },
|
|
{ dataIndex: 'name', render: (name, { uid }) => <User name={name} uid={uid} /> },
|
|
{ dataIndex: 'score' },
|
|
]}
|
|
/>
|
|
<Drawer
|
|
open={open}
|
|
title={`${char} 组对战表`}
|
|
onClose={() => setOpen(false)}
|
|
size={'80vh'}
|
|
placement="bottom"
|
|
>
|
|
<BattleTable players={props.players ?? []} />
|
|
</Drawer>
|
|
</Card>
|
|
);
|
|
}
|