From 8538d59ceafa2effcb602fa9f8163c8a319a87dd Mon Sep 17 00:00:00 2001
From: rlacko <rlacko@sch.bme.hu>
Date: Sat, 1 Feb 2020 23:56:12 +0100
Subject: [PATCH] LeaderBoard
---
src/components/pages/EventDetail.js | 24 ++++---
src/components/pages/LeaderBoard.js | 72 +++++++++++++++++++
.../pages/{Trainees.js => Presence.js} | 4 +-
src/components/pages/Statistics.js | 19 +++--
4 files changed, 101 insertions(+), 18 deletions(-)
create mode 100644 src/components/pages/LeaderBoard.js
rename src/components/pages/{Trainees.js => Presence.js} (97%)
diff --git a/src/components/pages/EventDetail.js b/src/components/pages/EventDetail.js
index c99a482..b6b7c66 100644
--- a/src/components/pages/EventDetail.js
+++ b/src/components/pages/EventDetail.js
@@ -75,17 +75,19 @@ class EventDetail extends Component {
return notes.map((note) => {
if (!note.profile) {
return (
- <Comment key={Math.random()}>
- <Comment.Content>
- <Comment.Author>{note.created_by_name}</Comment.Author>
- <Comment.Metadata>
- {moment(note.created_at).format('LL')}
- </Comment.Metadata>
- <Comment.Text>
- {note.note}
- </Comment.Text>
- </Comment.Content>
- </Comment>);
+ <Segment>
+ <Comment key={Math.random()}>
+ <Comment.Content>
+ <Comment.Author>{note.created_by_name}</Comment.Author>
+ <Comment.Metadata>
+ {moment(note.created_at).format('LL')}
+ </Comment.Metadata>
+ <Comment.Text>
+ {note.note}
+ </Comment.Text>
+ </Comment.Content>
+ </Comment>
+ </Segment>);
}
return '';
});
diff --git a/src/components/pages/LeaderBoard.js b/src/components/pages/LeaderBoard.js
new file mode 100644
index 0000000..18fef5c
--- /dev/null
+++ b/src/components/pages/LeaderBoard.js
@@ -0,0 +1,72 @@
+import React, { Component } from 'react';
+import { Container, Table, Icon } from 'semantic-ui-react';
+import { connect } from 'react-redux';
+import { getTrainees } from '../../actions/statistics';
+
+class LeaderBoard extends Component {
+ UNSAFE_componentWillMount() {
+ this.props.getTrainees();
+ }
+
+ // Every event rendered
+ renderTraineeBits() {
+ return this.props.trainees.sort( (a,b) => {
+ return (Number(b.homework_bits) + b.events_visited)
+ - (Number(a.homework_bits) + a.events_visited)
+ }).map((trainee) => {
+ return (
+ <Table.Row>
+ <Table.Cell textAlign='center'>
+ {trainee.full_name}
+ </Table.Cell>
+ <Table.Cell textAlign='center'>
+ {trainee.events_visited}
+ </Table.Cell>
+ <Table.Cell textAlign='center'>
+ {Number(trainee.homework_bits)}
+ </Table.Cell>
+ <Table.Cell textAlign='center'>
+ {Number(trainee.homework_bits) + trainee.events_visited}
+ </Table.Cell>
+ </Table.Row>
+ )
+ })
+ }
+
+ render() {
+ return (
+ <Container textAlign='center' style={{overflowX: 'scroll'}}>
+ <Table color='blue' unstackable celled selectable compact>
+ <Table.Header>
+ <Table.Row>
+ <Table.HeaderCell textAlign='center'>
+ KĂŠpzĹdĹk
+ </Table.HeaderCell>
+ <Table.HeaderCell textAlign='center'>
+ JelenlĂŠt
+ </Table.HeaderCell>
+ <Table.HeaderCell textAlign='center'>
+ Bitek
+ </Table.HeaderCell>
+ <Table.HeaderCell textAlign='center'>
+ Szumma
+ </Table.HeaderCell>
+ </Table.Row>
+ </Table.Header>
+ <Table.Body>
+
+ {this.props.trainees ?
+ this.renderTraineeBits()
+ :
+ 'Nincsenek kĂŠpzĹdĹk'
+ }
+ </Table.Body>
+ </Table>
+ </Container>
+ );
+ }
+}
+
+const mapStateToProps = ({ trainees: { trainees }, user }) => ({ trainees, user });
+
+export default connect(mapStateToProps, { getTrainees })(LeaderBoard);
diff --git a/src/components/pages/Trainees.js b/src/components/pages/Presence.js
similarity index 97%
rename from src/components/pages/Trainees.js
rename to src/components/pages/Presence.js
index b508458..224cc5f 100644
--- a/src/components/pages/Trainees.js
+++ b/src/components/pages/Presence.js
@@ -3,7 +3,7 @@ import { Container, Table, Icon } from 'semantic-ui-react';
import { connect } from 'react-redux';
import { getTrainees, getStaffEvents } from '../../actions/statistics';
-class Trainees extends Component {
+class Presence extends Component {
UNSAFE_componentWillMount() {
this.props.getTrainees();
this.props.getStaffEvents();
@@ -79,4 +79,4 @@ class Trainees extends Component {
const mapStateToProps = ({ trainees: { trainees }, events: { events }, user }) => ({ trainees, events, user });
-export default connect(mapStateToProps, { getTrainees, getStaffEvents })(Trainees);
+export default connect(mapStateToProps, { getTrainees, getStaffEvents })(Presence);
diff --git a/src/components/pages/Statistics.js b/src/components/pages/Statistics.js
index 8e59dc5..89ec148 100644
--- a/src/components/pages/Statistics.js
+++ b/src/components/pages/Statistics.js
@@ -1,7 +1,8 @@
import React, { Component } from 'react';
import { Container, Menu } from 'semantic-ui-react';
import Events from './Events'
-import Trainees from './Trainees'
+import Presence from './Presence'
+import LeaderBoard from './LeaderBoard'
export default class Statistics extends Component {
state = { activeItem: 'events' }
@@ -28,15 +29,23 @@ export default class Statistics extends Component {
Alkalmak
</Menu.Item>
<Menu.Item
- name='trainees'
- active={activeItem === 'trainees'}
+ name='presence'
+ active={activeItem === 'presence'}
onClick={this.handleItemClick}
>
- KĂŠpzĹdĹk
+ JelenlĂŠt
+ </Menu.Item>
+ <Menu.Item
+ name='leaderboard'
+ active={activeItem === 'leaderboard'}
+ onClick={this.handleItemClick}
+ >
+ Ranglista
</Menu.Item>
</Menu>
{ activeItem === 'events' ? <Events /> : '' }
- { activeItem === 'trainees' ? <Trainees /> : '' }
+ { activeItem === 'presence' ? <Presence /> : '' }
+ { activeItem === 'leaderboard' ? <LeaderBoard /> : '' }
</Container>
</div>
);
--
GitLab