Extract the dominance shower view

This commit is contained in:
Jonny 2019-05-03 13:07:17 +02:00 committed by JP1998
parent beffd24855
commit 2ea9668f38
2 changed files with 39 additions and 34 deletions

View File

@ -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>
);
}
}

View File

@ -2,49 +2,17 @@ import Head from 'next/head';
import React from 'react';
import { connect } from 'react-redux';
import {
Card,
CardBody,
CardTitle,
Col,
Container,
Row,
Table
Row
} from 'reactstrap';
import { TurniereNavigation } from '../js/components/Navigation';
import { TournamentInformationView } from '../js/components/TournamentInformationView';
import { BigImage } from '../js/components/BigImage';
import { StandingsTable } from '../js/components/StandingsTable';
import { DominanceShower } from '../js/components/DominanceShower';
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 {