From 81123aa9ffaec649803fe99ae6bd7c6fe4236d80 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?Chif=20Gerg=C5=91?= <chifgeri97@gmail.com> Date: Wed, 16 Jan 2019 11:15:40 +0100 Subject: [PATCH] Create trainee list to statistics page --- src/components/pages/Statistics.js | 2 ++ src/components/pages/Trainees.js | 47 ++++++++++++++++++++++++++++++ 2 files changed, 49 insertions(+) create mode 100644 src/components/pages/Trainees.js diff --git a/src/components/pages/Statistics.js b/src/components/pages/Statistics.js index d3129d6..44a4cdd 100644 --- a/src/components/pages/Statistics.js +++ b/src/components/pages/Statistics.js @@ -1,6 +1,7 @@ import React, { Component } from 'react'; import { Container, Menu } from 'semantic-ui-react'; import Events from './Events' +import Trainees from './Trainees' export default class Statistics extends Component { state = { activeItem: 'events' } @@ -35,6 +36,7 @@ export default class Statistics extends Component { </Menu.Item> </Menu> { activeItem === 'events' ? <Events /> : '' } + { activeItem === 'trainees' ? <Trainees /> : '' } </Container> </div> ); diff --git a/src/components/pages/Trainees.js b/src/components/pages/Trainees.js new file mode 100644 index 0000000..ea16589 --- /dev/null +++ b/src/components/pages/Trainees.js @@ -0,0 +1,47 @@ +import React, { Component } from 'react'; +import { Link } from 'react-router-dom'; +import { Container, Table } from 'semantic-ui-react'; +import { connect } from 'react-redux'; +import { getTrainees } from '../../actions/statistics'; + +class Trainees extends Component { + componentWillMount() { + this.props.getTrainees(); + } + + renderTrainees() { + return this.props.trainees.map((trainee) => + { return ( + <Table.Row> + <Table.Cell> + <Link to={`trainees/${trainee.id}`}> + {trainee.full_name} + </Link> + </Table.Cell> + </Table.Row> + ); + }); + } + + render() { + return ( + <Container textAlign='center'> + <Table color='blue' celled selectable compact> + <Table.Header> + <Table.Row> + <Table.HeaderCell>KĂŠpzĹdĹk</Table.HeaderCell> + </Table.Row> + </Table.Header> + + <Table.Body> + {this.props.trainees ? this.renderTrainees() : 'Nincsenek kĂŠpzĹdĹk'} + </Table.Body> + </Table> + </Container> + ); + } +} + +const mapStateToProps = ({ trainees: { trainees }, user }) => ({ trainees, user }); + +export default connect(mapStateToProps, { getTrainees })(Trainees); -- GitLab