Extract the dominance shower view
This commit is contained in:
parent
beffd24855
commit
2ea9668f38
|
|
@ -0,0 +1,37 @@
|
||||||
|
import React from 'react';
|
||||||
|
import {
|
||||||
|
Card,
|
||||||
|
CardBody,
|
||||||
|
CardTitle,
|
||||||
|
Table
|
||||||
|
} from 'reactstrap';
|
||||||
|
|
||||||
|
import { findTeam } from '../utils/findTeam';
|
||||||
|
|
||||||
|
export class DominanceShower extends React.Component {
|
||||||
|
|
||||||
|
render() {
|
||||||
|
return (
|
||||||
|
<Card className="shadow-sm">
|
||||||
|
<CardBody>
|
||||||
|
<CardTitle>{this.props.title}</CardTitle>
|
||||||
|
<Table borderless className="m-0">
|
||||||
|
<tbody>
|
||||||
|
<tr>
|
||||||
|
<th colSpan="2" className="h3 text-center">{findTeam(this.props.teams, this.props.stats.id).name}</th>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td className="h4 text-success pb-0">{this.props.stats.pointsMade}</td>
|
||||||
|
<td className="h4 text-danger text-right pb-0">{this.props.stats.pointsReceived}</td>
|
||||||
|
</tr>
|
||||||
|
<tr>
|
||||||
|
<td className="smaller pt-0">Punkte erzielt</td>
|
||||||
|
<td className="text-right smaller pt-0">Punkte kassiert</td>
|
||||||
|
</tr>
|
||||||
|
</tbody>
|
||||||
|
</Table>
|
||||||
|
</CardBody>
|
||||||
|
</Card>
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
@ -2,49 +2,17 @@ import Head from 'next/head';
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
import { connect } from 'react-redux';
|
import { connect } from 'react-redux';
|
||||||
import {
|
import {
|
||||||
Card,
|
|
||||||
CardBody,
|
|
||||||
CardTitle,
|
|
||||||
Col,
|
Col,
|
||||||
Container,
|
Container,
|
||||||
Row,
|
Row
|
||||||
Table
|
|
||||||
} from 'reactstrap';
|
} from 'reactstrap';
|
||||||
|
|
||||||
import { TurniereNavigation } from '../js/components/Navigation';
|
import { TurniereNavigation } from '../js/components/Navigation';
|
||||||
import { TournamentInformationView } from '../js/components/TournamentInformationView';
|
import { TournamentInformationView } from '../js/components/TournamentInformationView';
|
||||||
import { BigImage } from '../js/components/BigImage';
|
import { BigImage } from '../js/components/BigImage';
|
||||||
import { StandingsTable } from '../js/components/StandingsTable';
|
import { StandingsTable } from '../js/components/StandingsTable';
|
||||||
|
import { DominanceShower } from '../js/components/DominanceShower';
|
||||||
import { Footer } from '../js/components/Footer';
|
import { Footer } from '../js/components/Footer';
|
||||||
import { findTeam } from '../js/utils/findTeam';
|
|
||||||
|
|
||||||
class DominanceShower extends React.Component {
|
|
||||||
|
|
||||||
render() {
|
|
||||||
return (
|
|
||||||
<Card className="shadow-sm">
|
|
||||||
<CardBody>
|
|
||||||
<CardTitle>{this.props.title}</CardTitle>
|
|
||||||
<Table borderless className="m-0">
|
|
||||||
<tbody>
|
|
||||||
<tr>
|
|
||||||
<th colSpan="2" className="h3 text-center">{findTeam(this.props.teams, this.props.stats.id).name}</th>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td className="h4 text-success pb-0">{this.props.stats.pointsMade}</td>
|
|
||||||
<td className="h4 text-danger text-right pb-0">{this.props.stats.pointsReceived}</td>
|
|
||||||
</tr>
|
|
||||||
<tr>
|
|
||||||
<td className="smaller pt-0">Punkte erzielt</td>
|
|
||||||
<td className="text-right smaller pt-0">Punkte kassiert</td>
|
|
||||||
</tr>
|
|
||||||
</tbody>
|
|
||||||
</Table>
|
|
||||||
</CardBody>
|
|
||||||
</Card>
|
|
||||||
);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
class StatisticsTournamentPage extends React.Component {
|
class StatisticsTournamentPage extends React.Component {
|
||||||
|
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue