Fix: show final and small final in one column
This commit is contained in:
parent
1f3ad14be0
commit
d493777de3
1 changed files with 22 additions and 3 deletions
|
@ -4,9 +4,14 @@ import { useParams } from 'react-router-dom';
|
||||||
import {
|
import {
|
||||||
convertResultsToSpeedFlowchartResult,
|
convertResultsToSpeedFlowchartResult,
|
||||||
SpeedFlowchartResult,
|
SpeedFlowchartResult,
|
||||||
|
SpeedRoundPair,
|
||||||
} from '../data/SpeedFlowchart';
|
} from '../data/SpeedFlowchart';
|
||||||
import { Card, CardContent, Grid, Skeleton, Typography } from '@mui/material';
|
import { Card, CardContent, Grid, Skeleton, Typography } from '@mui/material';
|
||||||
|
|
||||||
|
interface SpeedRoundPairDummy extends SpeedRoundPair {
|
||||||
|
dummy: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
*
|
*
|
||||||
* @return {JSX.Element} speed flowchart page
|
* @return {JSX.Element} speed flowchart page
|
||||||
|
@ -37,7 +42,17 @@ export default function SpeedFlowchartPage() {
|
||||||
console.log('loading false');
|
console.log('loading false');
|
||||||
|
|
||||||
const flowchartResult = convertResultsToSpeedFlowchartResult(r);
|
const flowchartResult = convertResultsToSpeedFlowchartResult(r);
|
||||||
console.log(flowchartResult);
|
const l = flowchartResult.rounds.length;
|
||||||
|
const dummy: SpeedRoundPairDummy = { dummy: true };
|
||||||
|
flowchartResult.rounds[l - 2].pairs = [
|
||||||
|
dummy,
|
||||||
|
...flowchartResult.rounds[l - 1].pairs,
|
||||||
|
...flowchartResult.rounds[l - 2].pairs,
|
||||||
|
];
|
||||||
|
flowchartResult.rounds[l - 2].roundName = `${
|
||||||
|
flowchartResult.rounds[l - 1].roundName
|
||||||
|
} / ${flowchartResult.rounds[l - 2].roundName}`;
|
||||||
|
flowchartResult.rounds.pop();
|
||||||
setFlowchartResult(flowchartResult);
|
setFlowchartResult(flowchartResult);
|
||||||
});
|
});
|
||||||
}, []);
|
}, []);
|
||||||
|
@ -56,7 +71,7 @@ export default function SpeedFlowchartPage() {
|
||||||
xs={12}
|
xs={12}
|
||||||
md={12 / flowchartResult.rounds.length}
|
md={12 / flowchartResult.rounds.length}
|
||||||
>
|
>
|
||||||
<Grid item xs={12}>
|
<Grid item className='center-children' xs={12}>
|
||||||
<Typography variant='h6' fontWeight={'bold'} gutterBottom>
|
<Typography variant='h6' fontWeight={'bold'} gutterBottom>
|
||||||
{round.roundName}
|
{round.roundName}
|
||||||
</Typography>
|
</Typography>
|
||||||
|
@ -70,7 +85,11 @@ export default function SpeedFlowchartPage() {
|
||||||
>
|
>
|
||||||
{round.pairs.map((pair, pairKey) => (
|
{round.pairs.map((pair, pairKey) => (
|
||||||
<Grid key={`flowchart-column-${roundKey}-pair-${pairKey}`} item>
|
<Grid key={`flowchart-column-${roundKey}-pair-${pairKey}`} item>
|
||||||
<Card>
|
<Card
|
||||||
|
sx={{
|
||||||
|
opacity: (pair as SpeedRoundPairDummy).dummy ? 0 : 1,
|
||||||
|
}}
|
||||||
|
>
|
||||||
<CardContent>
|
<CardContent>
|
||||||
<Typography
|
<Typography
|
||||||
sx={{
|
sx={{
|
||||||
|
|
Loading…
Reference in a new issue