feat: Add isPassedGame logic and update GroupingPrediction component
- Added `dayjs` import for date manipulation in `GamePanel.tsx`. - Introduced `isPassedGame` memoized value in `GamePanel.tsx` to determine if the game date has passed. - Updated `GroupingPrediction` component to accept `isPassedGame` prop and adjust `nowScoreGroup` state accordingly.
This commit is contained in:
parent
da35e0f623
commit
ac3beb5d8f
@ -4,6 +4,7 @@ import { Tabs } from "antd";
|
|||||||
import { PlayerList } from "./PlayerList";
|
import { PlayerList } from "./PlayerList";
|
||||||
import { GroupingPrediction } from "./GroupingPrediction";
|
import { GroupingPrediction } from "./GroupingPrediction";
|
||||||
import { useMemo } from "react";
|
import { useMemo } from "react";
|
||||||
|
import dayjs from "dayjs";
|
||||||
|
|
||||||
interface Props {
|
interface Props {
|
||||||
title: string;
|
title: string;
|
||||||
@ -15,6 +16,14 @@ export const GamePanel: React.FC<Props> = props => {
|
|||||||
const sneckMode = useMemo(() => {
|
const sneckMode = useMemo(() => {
|
||||||
return !!props.title?.includes('争霸赛');
|
return !!props.title?.includes('争霸赛');
|
||||||
}, [props.title]);
|
}, [props.title]);
|
||||||
|
const isPassedGame = useMemo(() => {
|
||||||
|
const match = /(?<year>\d{4})年(?<month>\d{1,2})月(?<day>\d{1,2})/.exec(props.title);
|
||||||
|
const { year, month, day } = match?.groups ?? {};
|
||||||
|
const date = dayjs(`${year}-${month}-${day}`);
|
||||||
|
console.debug('date %s', date.format('YYYY-MM-DD'));
|
||||||
|
if (!date.isValid()) return true;
|
||||||
|
return date.isBefore(dayjs());
|
||||||
|
}, []);
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Tabs
|
<Tabs
|
||||||
@ -22,7 +31,13 @@ export const GamePanel: React.FC<Props> = props => {
|
|||||||
{
|
{
|
||||||
key: 'groups',
|
key: 'groups',
|
||||||
label: '分组预测',
|
label: '分组预测',
|
||||||
children: <GroupingPrediction sneckMode={sneckMode} players={props.members} />
|
children: (
|
||||||
|
<GroupingPrediction
|
||||||
|
sneckMode={sneckMode}
|
||||||
|
isPassedGame={isPassedGame}
|
||||||
|
players={props.members}
|
||||||
|
/>
|
||||||
|
),
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'players',
|
key: 'players',
|
||||||
|
|||||||
@ -18,6 +18,7 @@ interface CustomPlayer extends Player {
|
|||||||
interface Props {
|
interface Props {
|
||||||
players?: Player[];
|
players?: Player[];
|
||||||
sneckMode: boolean;
|
sneckMode: boolean;
|
||||||
|
isPassedGame: boolean;
|
||||||
}
|
}
|
||||||
|
|
||||||
enum OrderScore {
|
enum OrderScore {
|
||||||
@ -27,7 +28,11 @@ enum OrderScore {
|
|||||||
|
|
||||||
export const GroupingPrediction: React.FC<Props> = props => {
|
export const GroupingPrediction: React.FC<Props> = props => {
|
||||||
const [maxPlayerSize, setMaxPlayerSize] = useState(48);
|
const [maxPlayerSize, setMaxPlayerSize] = useState(48);
|
||||||
const [nowScoreGroup, setNowScoreGroup] = useState(OrderScore.当前积分);
|
const [nowScoreGroup, setNowScoreGroup] = useState(
|
||||||
|
props.isPassedGame
|
||||||
|
? OrderScore.年度积分
|
||||||
|
: OrderScore.当前积分
|
||||||
|
);
|
||||||
const refactoredPlayers = useMemo(() => {
|
const refactoredPlayers = useMemo(() => {
|
||||||
return nowScoreGroup === OrderScore.当前积分 ? props.players?.map(e => ({
|
return nowScoreGroup === OrderScore.当前积分 ? props.players?.map(e => ({
|
||||||
...e,
|
...e,
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user