Skip to content
Snippets Groups Projects

Compare revisions

Changes are shown as if the source revision was being merged into the target revision. Learn more about comparing revisions.

Source

Select target project
No results found

Target

Select target project
  • kszk/devteam/kszkepzes/old/kszkepzes-frontend
  • kbgergely/kszkepzes-frontend
2 results
Show changes
Showing
with 609 additions and 510 deletions
import { Container, Icon, Table } from 'semantic-ui-react';
import React, { Component } from 'react';
import { getStaffEvents, getTrainees } from '../../actions/statistics';
import { connect } from 'react-redux';
class Presence extends Component {
UNSAFE_componentWillMount() {
this.props.getTrainees();
this.props.getStaffEvents();
}
// Every event with visit status in table cells
renderVisitedStatus(trainee) {
return this.props.events.map((event) => {
if (event.visitors.includes(trainee.id)) {
return (
<Table.Cell textAlign="center" key={Math.random()}>
<Icon color="green" name="checkmark" />
</Table.Cell>
);
}
return (
<Table.Cell textAlign="center" key={Math.random()}>
<Icon color="red" name="cancel" />
</Table.Cell>
);
});
}
// Every event rendered
renderTraineesWithEvents() {
return this.props.trainees.map((trainee) =>
trainee.role === 'Student' ? (
<Table.Row key={Math.random()}>
<Table.Cell textAlign="center">{trainee.full_name}</Table.Cell>
{this.renderVisitedStatus(trainee)}
</Table.Row>
) : null
);
}
// Column for each event
renderTableHeaderEvents() {
return this.props.events.map((event) => (
<Table.HeaderCell textAlign="center" key={event.id}>
{event.name}
</Table.HeaderCell>
));
}
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>
{this.renderTableHeaderEvents()}
</Table.Row>
</Table.Header>
<Table.Body>
{this.props.trainees ? (
this.renderTraineesWithEvents()
) : (
<Table.Row>
<Table.Cell>Nincsenek képződők</Table.Cell>
</Table.Row>
)}
</Table.Body>
</Table>
</Container>
);
}
}
const mapStateToProps = ({
trainees: { trainees },
events: { events },
user,
}) => ({ trainees, events, user });
export default connect(mapStateToProps, { getTrainees, getStaffEvents })(
Presence
);
import React, { Component } from 'react';
import { Container, Form, Dropdown, Divider, Segment } from 'semantic-ui-react';
import { connect } from 'react-redux';
import { textChange, submitRegistration, groupChange } from '../../actions';
import { Container, Divider, Dropdown, Form, Segment } from "semantic-ui-react";
import React, { Component } from "react";
import { groupChange, submitRegistration, textChange } from "../../actions";
import HiddenForm from "../forms/HiddenForm";
import { connect } from "react-redux";
import { getDeadline } from "../../actions/auth";
const options = [
{ key: 'DT', text: 'DevTeam', value: 'DT' },
{ key: 'NET', text: 'NETeam', value: 'NET' },
{ key: 'ST', text: 'SecurITeam', value: 'ST' },
{ key: 'SYS', text: 'SysAdmin', value: 'SYS' },
{ key: 'HAT', text: 'Hallgatói Tudásbázis', value: 'HAT' },
{ key: "DT", text: "DevTeam", value: "DT" },
{ key: "NET", text: "NETeam", value: "NET" },
{ key: "ST", text: "SecurITeam", value: "ST" },
{ key: "SYS", text: "SysAdmin", value: "SYS" },
{ key: "HAT", text: "Hallgatói Tudásbázis", value: "HAT" },
];
class Profile extends Component {
componentWillMount() {
UNSAFE_componentWillMount() {
this.props.getDeadline();
if (!this.props.id) {
this.props.history.push('/home');
this.props.history.push("/home");
}
}
render() {
const {
role, nick, groups, motivationAbout, motivationProfession, motivationExercise, signed, id,
nick,
groups,
motivationAbout,
motivationProfession,
motivationExercise,
signed,
id,
deadline,
messageBefore,
messageAfter,
} = this.props;
const endDate = new Date(deadline);
const canEdit = Date.now() < endDate;
return (
<Container
style={{
marginTop: '0.5em',
marginTop: "1em",
}}
>
<Segment inverted color='red' tertiary>
<p style={{ fontSize: '1.33em' }}>
A profilod mentés után is módosítható a későbbiekben, egészen február 14. 23:59-ig.
</p>
</Segment>
<Form>
<Form.Input
fluid
name='nick'
label='Becenév'
onChange={e => this.props.textChange(e)}
placeholder='Becenév'
value={nick}
/>
{canEdit ? (
<Segment inverted color="red" tertiary>
<p
style={{ fontSize: "1.3em" }}
dangerouslySetInnerHTML={{ __html: messageBefore }}
/>
</Segment>
) : (
<Segment inverted color="red" tertiary>
<p
style={{ fontSize: "1.3em" }}
dangerouslySetInnerHTML={{ __html: messageAfter }}
/>
</Segment>
)}
<Form>
{canEdit ? (
<Form.Input
fluid
name="nick"
label="Becenév"
onChange={(e) => this.props.textChange(e)}
placeholder="Becenév"
value={nick}
/>
) : (
<HiddenForm fontWeight="bold" label="Becenév" value={nick} />
)}
<Divider horizontal>Motiváció</Divider>
<Form.TextArea
rows={10}
name='motivationAbout'
label='Mesélj nekünk egy kicsit magadról. Milyen szakmai vagy más eredményeket értél el, amikre büszke vagy?'
onChange={e => this.props.textChange(e)}
placeholder='Mesélj nekünk egy kicsit magadról. Milyen szakmai vagy más eredményeket értél el, amikre büszke vagy?'
value={motivationAbout}
/>
{canEdit ? (
<Form.TextArea
rows={10}
name="motivationAbout"
label="Mesélj nekünk egy kicsit magadról. Milyen szakmai vagy más eredményeket értél el, amikre büszke vagy?"
onChange={(e) => this.props.textChange(e)}
placeholder="Mesélj nekünk egy kicsit magadról. Milyen szakmai vagy más eredményeket értél el, amikre büszke vagy?"
value={motivationAbout}
/>
) : (
<HiddenForm
fontWeight="bold"
label="Mesélj nekünk egy kicsit magadról. Milyen szakmai vagy más eredményeket értél el, amikre büszke vagy?"
value={motivationAbout}
/>
)}
<Divider horizontal />
<Form.TextArea
rows={10}
label='Mit vársz el a képzéstől, miért szeretnél rá jelentkezni, szerinted mire tudod majd használni az itt megszerzett tudást? Mit szeretnél elérni a szakmádban?'
name='motivationProfession'
onChange={e => this.props.textChange(e)}
placeholder='Mit vársz el a képzéstől, miért szeretnél rá jelentkezni, szerinted mire tudod majd használni az itt megszerzett tudást? Mit szeretnél elérni a szakmádban?'
value={motivationProfession}
/>
{canEdit ? (
<Form.TextArea
rows={10}
label="Mit vársz el a képzéstől, miért szeretnél rá jelentkezni, szerinted mire tudod majd használni az itt megszerzett tudást? Mit szeretnél elérni a szakmádban?"
name="motivationProfession"
onChange={(e) => this.props.textChange(e)}
placeholder="Mit vársz el a képzéstől, miért szeretnél rá jelentkezni, szerinted mire tudod majd használni az itt megszerzett tudást? Mit szeretnél elérni a szakmádban?"
value={motivationProfession}
/>
) : (
<HiddenForm
fontWeight="bold"
label="Mit vársz el a képzéstől, miért szeretnél rá jelentkezni, szerinted mire tudod majd használni az itt megszerzett tudást? Mit szeretnél elérni a szakmádban?"
value={motivationProfession}
/>
)}
<Divider horizontal />
<Form.TextArea
rows={10}
name='motivationExercise'
onChange={e => this.props.textChange(e)}
placeholder=''
label={
<div>
<b>Alább találsz néhány elgondolkodtató kérdést, megoldandó feladatot.
A kérdések és feladatok elkészítése opcionális,
nem titkolt célunk ezzel a lelkesedés felmérése.
A válaszokat a kérdések alatti szövegdobozba várjuk.
</b>
<ol>
<li>
Szeretnéd kedvenc tantárgyad vik.wiki oldalát elérni,
de szomorúan látod, hogy az oldal nem jön be.
A Steam pedig hibátlanul megy a háttérben és az emailek is megérkeznek...
Szobatársadnak pont megvan a vik.wiki szerverének IP-címe.
Csodálkozva látod, hogy a böngésző címsorába írva eléred a kiszolgáló webszervert.
Mi lehet a baj?
</li>
<br />
<li>
Két előadás közti szünetben úgy döntesz,
hogy laptopoddal az index.hu tech cikkeit fogod görgetni.
Ám az oldal nem válaszol, a hiba okát megpróbálod kideríteni.
Ekkor veszed észre, hogy az alábbiakat sem éred el:
sze.hu, 444.hu, corvinus.hu, startlap.hu.
Ugyanakkor a Facebook, a Gmail, a YouTube, de még az egyetemi
oldalak többsége is működik. Szerinted mi lehet a hiba oka?
</li>
<br />
<li>
Találsz egy értelmetlen szöveget egy honlapon (például: <a href='http://kszkepzes18.sch.bme.hu/zebra.html'>http://kszkepzes18.sch.bme.hu/zebra.html</a>), de feltűnik, hogy két egyenlőségjellel fejeződik be. Nyomozz, s a végeredményt (amit találtál) írd ide!
</li>
<br />
<li>
A <b>kszkepzes18.sch.bme.hu</b> címen elérhető gépen
fut egy szolgáltatás az alapértelmezett <b>5432</b> porton
(használd az előző feladatban kapott adatokat).
Belépés után keresd meg a feladat megoldását!
</li>
</ol>
</div>
}
value={motivationExercise}
/>
{canEdit ? (
<Form.TextArea
rows={10}
name="motivationExercise"
onChange={(e) => this.props.textChange(e)}
placeholder=""
label={
<div>
<b>
Alább találsz néhány elgondolkodtató kérdést, megoldandó
feladatot. A kérdések és feladatok elkészítése opcionális,
nem titkolt célunk ezzel a lelkesedés felmérése. A
válaszokat a kérdések alatti szövegdobozba várjuk.
</b>
<ul>
<li>
Szeretnéd kedvenc tantárgyad vik.wiki oldalát elérni, de
szomorúan látod, hogy az oldal nem jön be. A Steam pedig
hibátlanul megy a háttérben és az emailek is
megérkeznek... Szobatársadnak pont megvan a vik.wiki
szerverének IP-címe. Csodálkozva látod, hogy a böngésző
címsorába írva eléred a kiszolgáló webszervert. Mi lehet a
baj?
</li>
<br />
<li>
Kicsit hosszúra nyúlt az előadás és lassan rohannod kell
haza, ezért úgy döntesz, hogy megnézed a menetrendet a
menetrendek.hu weboldalon. Ám az oldal nem válaszol, a
hiba okát megpróbálod kideríteni. Ekkor veszed észre, hogy
az alábbiakat sem éred el: sze.hu, corvinus.hu,
startlap.hu. Ugyanakkor a Facebook, a Gmail, a YouTube, de
még az egyetemi oldalak többsége is működik. Szerinted mi
lehet a hiba oka?
</li>
<br />
<li>
Találsz egy értelmetlen szöveget egy honlapon (például:{" "}
<a href="https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html">
https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html
</a>
), de feltűnik, hogy egyenlőségjellel fejeződik be.
Nyomozz, s a végeredményt (amit találtál) írd ide!
</li>
<br />
<li>
A <b>ujonc-gres.kszk.bme.hu</b> címen elérhető gépen fut
egy szolgáltatás az alapértelmezett <b>5432</b> porton
(használd az előző feladatban kapott adatokat). Belépés
után írd le mit találtál!
</li>
</ul>
</div>
}
value={motivationExercise}
/>
) : (
<HiddenForm
fontWeight="normal"
label={
<div>
<b>
Alább találsz néhány elgondolkodtató kérdést, megoldandó
feladatot. A kérdések és feladatok elkészítése opcionális,
nem titkolt célunk ezzel a lelkesedés felmérése. A
válaszokat a kérdések alatti szövegdobozba várjuk.
</b>
<ul>
<li>
Szeretnéd kedvenc tantárgyad vik.wiki oldalát elérni, de
szomorúan látod, hogy az oldal nem jön be. A Steam pedig
hibátlanul megy a háttérben és az emailek is
megérkeznek... Szobatársadnak pont megvan a vik.wiki
szerverének IP-címe. Csodálkozva látod, hogy a böngésző
címsorába írva eléred a kiszolgáló webszervert. Mi lehet a
baj?
</li>
<br />
<li>
Kicsit hosszúra nyúlt az előadás és lassan rohannod kell
haza, ezért úgy döntesz, hogy megnézed a menetrendet a
menetrendek.hu weboldalon. Ám az oldal nem válaszol, a
hiba okát megpróbálod kideríteni. Ekkor veszed észre, hogy
az alábbiakat sem éred el: sze.hu, corvinus.hu,
startlap.hu. Ugyanakkor a Facebook, a Gmail, a YouTube, de
még az egyetemi oldalak többsége is működik. Szerinted mi
lehet a hiba oka?
</li>
<br />
<li>
Találsz egy értelmetlen szöveget egy honlapon (például:{" "}
<a href="https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html">
https://ujonc.kszk.bme.hu/kepzes-media/public/zebra.html
</a>
), de feltűnik, hogy egyenlőségjellel fejeződik be.
Nyomozz, s a végeredményt (amit találtál) írd ide!
</li>
<br />
<li>
A <b>ujonc-gres.kszk.bme.hu</b> címen elérhető gépen fut
egy szolgáltatás az alapértelmezett <b>5432</b> porton
(használd az előző feladatban kapott adatokat). Belépés
után keresd meg a feladat megoldását!
</li>
</ul>
</div>
}
value={motivationExercise}
/>
)}
<Divider horizontal>Érdekelődés</Divider>
<Divider horizontal>Érdeklődés</Divider>
<Dropdown
fluid
multiple
selection
placeholder='DevTeam, ...'
placeholder="DevTeam, ..."
onChange={(_, v) => this.props.groupChange(v.value)}
options={options}
defaultValue={groups}
disabled={!canEdit}
/>
<br />
{ role === 'Applicant' ?
<Form.Checkbox
name='signed'
label='Szeretnék jelentkezni a KSZKépzésre'
onChange={(_, v) =>
this.props.textChange({ target: { name: v.name, value: v.checked } })
<Form.Checkbox
name="signed"
label="Szeretnék a képzés során emaileket kapni és jelentkezni a KSZKépzésre"
onChange={(_, v) =>
this.props.textChange({
target: { name: v.name, value: v.checked },
})
}
checked={signed}
readOnly={!canEdit}
style={!canEdit ? { marginBottom: "5em" } : null}
/>
{canEdit ? (
<Form.Button
primary
style={{ marginBottom: "5em" }}
disabled={!signed}
onClick={() =>
this.props.submitRegistration({
nick,
motivationAbout,
motivationProfession,
motivationExercise,
signed,
groups,
id,
})
}
checked={signed}
/>
:
null
}
<Form.Button
primary
style={{ marginBottom: '10em' }}
onClick={() => this.props.submitRegistration({
nick, motivationAbout, motivationProfession, motivationExercise, signed, groups, id,
})}
>
Mentés
</Form.Button>
>
Mentés
</Form.Button>
) : (
""
)}
</Form>
</Container>
);
......@@ -152,10 +273,18 @@ class Profile extends Component {
const mapStateToProps = ({
user: {
role, nick, groups, motivationAbout, motivationProfession, motivationExercise, signed, id,
nick,
groups,
motivationAbout,
motivationProfession,
motivationExercise,
signed,
id,
deadline,
messageBefore,
messageAfter,
},
}) => ({
role,
nick,
groups,
motivationAbout,
......@@ -163,6 +292,14 @@ const mapStateToProps = ({
motivationExercise,
signed,
id,
deadline,
messageBefore,
messageAfter,
});
export default connect(mapStateToProps, { textChange, submitRegistration, groupChange })(Profile);
export default connect(mapStateToProps, {
textChange,
submitRegistration,
groupChange,
getDeadline,
})(Profile);
import React, { Component } from 'react';
import { Container, Accordion, Icon, Grid } from 'semantic-ui-react';
import { connect } from 'react-redux';
import moment from 'moment';
import { getStudentEvents } from '../../actions/statistics';
import "moment/locale/hu";
import {
Accordion,
Container,
Grid,
Header,
Icon,
Segment,
} from "semantic-ui-react";
import React, { Component } from "react";
import { connect } from "react-redux";
import { getStudentEvents } from "../../actions/statistics";
import moment from "moment";
class Schedule extends Component {
state = { activeIndex: 0 }
// eslint-disable-next-line react/state-in-constructor
state = { activeIndex: 0 };
componentWillMount() {
this.props.getStudentEvents();
UNSAFE_componentWillMount() {
this.props.getStudentEvents();
}
handleClick = (e, titleProps) => {
const { index } = titleProps
const { activeIndex } = this.state
const newIndex = activeIndex === index ? -1 : index
const { index } = titleProps;
const { activeIndex } = this.state;
const newIndex = activeIndex === index ? -1 : index;
this.setState({ activeIndex: newIndex })
}
this.setState({ activeIndex: newIndex });
};
render() {
const { activeIndex } = this.state
const { activeIndex } = this.state;
const events = this.props.events;
const panels = events.map(event => (
<div>
<Accordion.Title
active={activeIndex === event.id}
index={event.id}
onClick={this.handleClick}
>
<h3>
<Grid>
<Grid.Column floated='left' width={8} textAlign='left'>
<Icon name='angle right' color='blue' />{event.name}
</Grid.Column>
<Grid.Column floated='right' width={8} textAlign='right'>
{moment(event.date).locale('hu').format('LLLL')}
</Grid.Column>
</Grid>
</h3>
</Accordion.Title>
<Accordion.Content active={activeIndex === event.id}>
<h4>Leírás:</h4>
<p>
{event.description}
</p>
</Accordion.Content>
</div>
));
const { events } = this.props;
const panels = events
.sort((a, b) => a.date - b.date)
.map((event) => (
<Accordion key={Math.random()}>
<Accordion.Title
active={activeIndex === event.id}
index={event.id}
onClick={this.handleClick}
>
<h2>
<Grid>
<Grid.Column floated="left" width={5} textAlign="left">
<Icon name="calendar alternate outline" color="blue" />{" "}
{event.name}
</Grid.Column>
<Grid.Column floated="right" width={8} textAlign="right">
{moment(event.date).locale("hu").format("LLLL")}
</Grid.Column>
</Grid>
</h2>
</Accordion.Title>
<Accordion.Content active={activeIndex === event.id}>
<Segment textAlign="left" style={{ overflowWrap: "break-word" }}>
{event.description}
</Segment>
</Accordion.Content>
</Accordion>
));
return (
<Container
textAlign='left'
style={{
padding: '60px'
}}
>
<h2>Képzésalkalmak:</h2>
<Accordion
fluid
styled
defaultActiveIndex={-1}
panels={panels}
>
{panels}
</Accordion>
</Container>
<div>
<Container textAlign="center">
<Header
as="h1"
content="Képzés alkalmak"
style={{
fontSize: "2em",
fontWeight: "bold",
marginBottom: "0.5em",
marginTop: "0.5em",
}}
/>
<Accordion fluid styled>
{panels}
</Accordion>
<Header
as="h1"
content="Tábor: április 11-13"
style={{
fontSize: "2em",
fontWeight: "bold",
marginBottom: "0.5em",
marginTop: "1.5em",
}}
/>
</Container>
</div>
);
}
}
const mapStateToProps = ({ events: { events }, user }) => ({ events, user });
export default connect(mapStateToProps, { getStudentEvents })(Schedule);
import React, { Component } from 'react';
import { Container, Menu } from 'semantic-ui-react';
import Events from './Events'
import Trainees from './Trainees'
import React, { Component } from 'react';
import Events from './Events';
import LeaderBoard from './LeaderBoard';
import Presence from './Presence';
export default class Statistics extends Component {
state = { activeItem: 'events' }
handleItemClick = (e, { name }) => this.setState({ activeItem: name })
// eslint-disable-next-line react/state-in-constructor
state = { activeItem: 'events' };
handleItemClick = (e, { name }) => this.setState({ activeItem: name });
render() {
const { activeItem } = this.state
const { activeItem } = this.state;
return (
<div>
<Container
textAlign="center"
style={{
padding: '60px',
}}
>
<Menu
attached='top'
tabular
size='huge'
compact={true}>
<Container
textAlign="center"
style={{ paddingBottom: '5em', paddingTop: '1em' }}
>
<Menu tabular attached="top" size="huge" compact>
<Menu.Item
name='events'
name="events"
active={activeItem === 'events'}
onClick={this.handleItemClick}
>Alkalmak
>
Alkalmak
</Menu.Item>
<Menu.Item
name="presence"
active={activeItem === 'presence'}
onClick={this.handleItemClick}
>
Jelenlét
</Menu.Item>
<Menu.Item
name='trainees'
active={activeItem === 'trainees'}
name="leaderboard"
active={activeItem === 'leaderboard'}
onClick={this.handleItemClick}
>Képződők
>
Ranglista
</Menu.Item>
</Menu>
{ activeItem === 'events' ? <Events /> : '' }
{ activeItem === 'trainees' ? <Trainees /> : '' }
{activeItem === 'events' ? <Events /> : ''}
{activeItem === 'presence' ? <Presence /> : ''}
{activeItem === 'leaderboard' ? <LeaderBoard /> : ''}
</Container>
</div>
);
......
import React, { Component } from 'react';
import {
Comment,
Table,
Icon,
Popup,
Grid,
Button,
Form,
} from 'semantic-ui-react';
import { connect } from 'react-redux';
import { visitorChange } from '../../actions/statistics';
import { writeNote, clearWrite, postNote, deleteNote } from '../../actions/notes';
import CommentModal from './CommentModal'
class TraineeTableRow extends Component {
constructor(props) {
super(props);
this.state = {
note: '',
}
}
handleWrite = (e) => {
this.setState({ ...this.state, note: e.target.value });
}
clearWrite = () => {
this.setState({ ...this.state, note: '' });
}
render() {
const { trainee, edit, selectedEvent, notes } = this.props;
const isVisitor = selectedEvent.visitors.includes(trainee.id);
const isAbsent = selectedEvent.absent.includes(trainee.id);
return (
<Table.Row key={trainee.id}>
<Table.Cell>
{trainee.full_name}
</Table.Cell>
{!edit ?
<Table.Cell textAlign='center'>
{
isVisitor ?
<Icon color='green' name='checkmark' />
:
isAbsent ?
<Icon color='orange' name='minus' />
:
<Icon color='red' name='cancel' />
}
</Table.Cell>
:
<Table.Cell textAlign='center'>
<Button
compact
icon={<Icon color='green' name='checkmark' />}
color={isVisitor ? 'blue' : 'lightgrey'}
onClick={() => this.props.visitorChange({ id: trainee.id, value: 'Visitor' })}
/>
<Button
compact
icon={<Icon color='orange' name='minus' />}
color={isAbsent ? 'blue' : 'lightgrey'}
onClick={() => this.props.visitorChange({ id: trainee.id, value: 'Absent' })}
/>
<Button
compact
icon={<Icon color='red' name='cancel' />}
color={!isVisitor && !isAbsent ? 'blue' : 'lightgrey'}
onClick={() => this.props.visitorChange({ id: trainee.id, value: 'No' })}
/>
</Table.Cell>
}
<Table.Cell>
<Grid>
<Grid.Row>
<Grid.Column floated='left' width={11} textAlign='left'>
{notes.length > 0 ?
<Comment>
<Comment.Content>
<Comment.Author>{notes[0].created_by_name}</Comment.Author>
<Comment.Text>
{notes[0].note.length > 50 ? notes[0].note.slice(0, 50).concat('...')
:
notes[0].note }
</Comment.Text>
</Comment.Content>
</Comment>
:
null
}
</Grid.Column>
<Grid.Column floated='right' width={5} textAlign='right'>
{notes.length > 0 ?
<CommentModal notes={notes} />
:
null}
<Popup
trigger={<Button icon='plus' onClick={this.triggerAdd}/>}
on='click'
position='bottom left'
content={
<Form reply>
<Form.TextArea
value={this.state.note}
onChange={e => this.handleWrite(e)}
/>
<Button
onClick={() => {
this.props.postNote({ eventid:selectedEvent.id,
userid: trainee.id,
note: this.state.note });
this.clearWrite();
}
}
content='Megjegyzés hozzáadása'
labelPosition='left'
icon='edit'
primary
/>
</Form>
}
/>
</Grid.Column>
</Grid.Row>
</Grid>
</Table.Cell>
</Table.Row>
);
}
}
export default connect(() => ({}), { writeNote, clearWrite, postNote, visitorChange, deleteNote })(TraineeTableRow)
import React, { Component } from 'react';
import { Container, Table, Icon } from 'semantic-ui-react';
import { connect } from 'react-redux';
import { getTrainees, getStaffEvents } from '../../actions/statistics';
class Trainees extends Component {
componentWillMount() {
this.props.getTrainees();
this.props.getStaffEvents();
}
renderVisitedStatus(trainee) {
return (this.props.events.map((event) => {
if (event.visitors.includes(trainee.id)) {
return (
<Table.Cell textAlign='center'>
<Icon color='green' name='checkmark' />
</Table.Cell>);
}
return (
<Table.Cell textAlign='center'>
{ event.absent.includes(trainee.id) ?
<Icon color='orange' name='minus' />
:
<Icon color='red' name='cancel' />
}
</Table.Cell>);
}));
}
renderTrainees() {
return this.props.trainees.map((trainee) =>
{ return (
<Table.Row>
<Table.Cell>
{trainee.full_name}
</Table.Cell>
{this.renderVisitedStatus(trainee)}
</Table.Row>
);
});
}
renderTableHeader() {
return (this.props.events.map(event => (
<Table.HeaderCell textAlign='center'>
{event.name}
</Table.HeaderCell>)));
}
render() {
return (
<Container textAlign='center'>
<Table color='blue' selectable compact>
<Table.Header>
<Table.Row>
<Table.HeaderCell>Képződők</Table.HeaderCell>
{ this.renderTableHeader() }
</Table.Row>
</Table.Header>
<Table.Body>
{this.props.trainees ? this.renderTrainees() : 'Nincsenek képződők'}
</Table.Body>
</Table>
</Container>
);
}
}
const mapStateToProps = ({ trainees: { trainees }, events: { events }, user }) => ({ trainees, events, user });
export default connect(mapStateToProps, { getTrainees, getStaffEvents })(Trainees);
import React, { Component } from 'react';
import { Container, Header, Segment } from 'semantic-ui-react';
export default class Trainers extends Component {
render() {
return (
<div>
<Segment inverted textAlign='center' vertical>
<Container>
<Header
as='h1'
content='Képzők - Hamarosan'
inverted
style={{
fontSize: '3em',
fontWeight: 'normal',
marginBottom: 0,
marginTop: '0.5em',
}}
/>
</Container>
</Segment>
</div>
);
}
}
import { createStore, applyMiddleware } from 'redux';
import thunkMiddleware from 'redux-thunk';
import { createLogger } from 'redux-logger';
import { applyMiddleware, createStore } from 'redux';
// import { createLogger } from 'redux-logger';
import rootReducer from './reducers';
import thunkMiddleware from 'redux-thunk';
const loggerMiddleware = createLogger();
// const loggerMiddleware = createLogger();
export default function configureStore(preloadedState) {
return createStore(
rootReducer,
preloadedState,
applyMiddleware(
thunkMiddleware,
loggerMiddleware,
),
thunkMiddleware
// loggerMiddleware,
)
);
}
/* eslint-disable import/no-unresolved */
/* eslint-disable import/named */
/* eslint-disable import/extensions */
import React, { Component } from 'react';
import { connect } from 'react-redux';
// eslint-disable-next-line
import PropTypes from 'prop-types';
import Todo from '../components/Todo';
import { addTodo } from '../actions';
import { connect } from 'react-redux';
class TodoContainer extends Component {
render() {
......@@ -11,13 +15,11 @@ class TodoContainer extends Component {
return (
<div>
{
todos.map(todo => (
<Todo onClick={onTodoClick} key={Math.random()}>
{todo.data}
</Todo>
))
}
{todos.map((todo) => (
<Todo onClick={onTodoClick} key={Math.random()}>
{todo.data}
</Todo>
))}
</div>
);
}
......@@ -31,7 +33,7 @@ const mapStateToProps = (state) => {
};
};
const mapDispatchToProps = dispatch => ({
const mapDispatchToProps = (dispatch) => ({
onTodoClick: (data) => {
dispatch(addTodo(data));
},
......
import React from 'react';
import { render } from 'react-dom';
import { Provider } from 'react-redux';
import { BrowserRouter as Router } from 'react-router-dom';
import 'slick-carousel/slick/slick.css';
import 'slick-carousel/slick/slick-theme.css';
import 'semantic-ui-css/semantic.min.css';
import ScrollToTop from './components/ScrollToTop';
import moment from 'moment';
import configureStore from './configureStore';
import App from './components/App';
import registerServiceWorker from './registerServiceWorker';
import * as serviceWorker from './registerServiceWorker';
import App from './components/App';
import { Provider } from 'react-redux';
import React from 'react';
import { BrowserRouter as Router } from 'react-router-dom';
import configureStore from './configureStore';
import moment from 'moment';
import { render } from 'react-dom';
moment.locale();
......@@ -20,12 +19,10 @@ const store = configureStore();
render(
<Provider store={store}>
<Router>
<ScrollToTop>
<App />
</ScrollToTop>
<App />
</Router>
</Provider>,
document.getElementById('root'),
document.getElementById('root')
);
registerServiceWorker();
serviceWorker.unregister();
import { WRITE_NEWS, CLEAR_WRITE } from '../actions/types';
import { CLEAR_WRITE, WRITE_NEWS } from '../actions/types';
const INITIAL_STATE = { title: '', text: '' };
......
import { WRITE_SOLUTION, WRITE_SOLUTION_FILE, GET_SOLUTIONS, CLEAR_WRITE } from '../actions/types';
import {
CLEAR_WRITE,
GET_SOLUTIONS,
WRITE_SOLUTION,
WRITE_SOLUTION_FILE,
} from '../actions/types';
const INITIAL_STATE = {
task: '',
......
import { WRITE_TASK, WRITE_TASK_DEADLINE, CLEAR_WRITE } from '../actions/types';
import { CLEAR_WRITE, WRITE_TASK, WRITE_TASK_DEADLINE } from '../actions/types';
const INITIAL_STATE = { title: '', text: '', deadline: '' };
......
import { WRITE_SOLUTION, CHECK, CLEAR_WRITE } from '../actions/types';
import {
CHECK,
CLEAR_WRITE,
SELECT_SOLUTION,
SETCHECKTRUE,
WRITE_SOLUTION,
} from '../actions/types';
const INITIAL_STATE = {
accepted: false,
corrected: false,
note: '',
};
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
case SELECT_SOLUTION:
return {
corrected: action.payload.corrected,
accepted: action.payload.accepted,
note: action.payload.note,
};
case WRITE_SOLUTION:
return { ...state, [action.target]: action.payload };
case CHECK:
return { ...state, accepted: !state.accepted };
return {
...state,
[action.target]: !state[action.target],
};
case SETCHECKTRUE:
return {
...state,
[action.target]: true,
};
case CLEAR_WRITE:
return INITIAL_STATE;
default:
......
import { WRITE_NEWS, CLEAR_WRITE, SELECT_NEWS } from '../actions/types';
import { CLEAR_WRITE, SELECT_NEWS, WRITE_NEWS } from '../actions/types';
const INITIAL_STATE = { };
const INITIAL_STATE = {};
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
......
import { SELECT_TASK, WRITE_TASK, WRITE_TASK_DEADLINE, CLEAR_WRITE } from '../actions/types';
import {
CLEAR_WRITE,
SELECT_TASK,
WRITE_TASK,
WRITE_TASK_DEADLINE,
} from '../actions/types';
const INITIAL_STATE = { };
const INITIAL_STATE = {};
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
......
import {
ABSENT_CHANGE,
ADD_EVENT,
CHANGE_NO,
CLEAR_WRITE,
DELETE_EVENT,
GET_EVENTS,
GET_EVENT_BY_ID,
VISITOR_CHANGE,
WRITE_EVENT,
ADD_EVENT,
DELETE_EVENT,
CLEAR_WRITE,
ABSENT_CHANGE,
CHANGE_NO,
SELECT_EVENT_FOR_EDIT,
EDIT_EVENT,
WRITE_EDITED_EVENT,
} from '../actions/types';
const INITIAL_STATE = { events: [], newEvent: {}, editedEvent: {} };
const INITIAL_STATE = { events: [], newEvent: {} };
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
......@@ -24,13 +21,16 @@ export default (state = INITIAL_STATE, action) => {
case VISITOR_CHANGE:
if (state.selectedEvent.visitors.includes(action.payload)) {
// Benne van nem kell megváltoztatni
return { ...state }
return { ...state };
}
if (state.selectedEvent.absent.indexOf(action.payload) > -1) {
// Ha az absentbe van ki kell venni
state.selectedEvent.absent.splice(state.selectedEvent.absent.indexOf(action.payload), 1);
state.selectedEvent.absent.splice(
state.selectedEvent.absent.indexOf(action.payload),
1
);
}
state.selectedEvent.visitors.push(action.payload)
state.selectedEvent.visitors.push(action.payload);
return {
...state,
selectedEvent: {
......@@ -44,7 +44,10 @@ export default (state = INITIAL_STATE, action) => {
return { ...state };
}
if (state.selectedEvent.visitors.indexOf(action.payload) > -1) {
state.selectedEvent.visitors.splice(state.selectedEvent.visitors.indexOf(action.payload), 1);
state.selectedEvent.visitors.splice(
state.selectedEvent.visitors.indexOf(action.payload),
1
);
}
state.selectedEvent.absent.push(action.payload);
return {
......@@ -57,11 +60,17 @@ export default (state = INITIAL_STATE, action) => {
};
case CHANGE_NO:
if (state.selectedEvent.visitors.indexOf(action.payload) > -1) {
state.selectedEvent.visitors.splice(state.selectedEvent.visitors.indexOf(action.payload), 1);
state.selectedEvent.visitors.splice(
state.selectedEvent.visitors.indexOf(action.payload),
1
);
}
if (state.selectedEvent.absent.indexOf(action.payload) > -1) {
// Ha az absentbe van ki kell venni
state.selectedEvent.absent.splice(state.selectedEvent.absent.indexOf(action.payload), 1);
state.selectedEvent.absent.splice(
state.selectedEvent.absent.indexOf(action.payload),
1
);
}
return {
...state,
......@@ -72,22 +81,17 @@ export default (state = INITIAL_STATE, action) => {
},
};
case WRITE_EVENT:
return { ...state, newEvent: { ...state.newEvent, [action.target]: action.payload } };
return {
...state,
newEvent: { ...state.newEvent, [action.target]: action.payload },
};
case ADD_EVENT:
return { ...state, events: [...state.events, action.payload] };
case DELETE_EVENT:
state.events.splice(state.events.indexOf(action.payload), 1);
return { ...state, events: [...state.events] };
case SELECT_EVENT_FOR_EDIT:
return { ...state, editedEvent: action.payload }
case WRITE_EDITED_EVENT:
return { ...state, editedEvent: { ...state.editedEvent, [action.target]: action.payload } };
case EDIT_EVENT:
const index = state.events.findIndex(item => item.id === action.payload.id);
state.events.splice(index, 1, action.payload);
return { ...state, events: [...state.events] };
case CLEAR_WRITE:
return { ...state, newEvent: {}, editedEvent: {} };
return { ...state, newEvent: {} };
default:
return state;
}
......
import { GET_GROUPS } from '../actions/types';
const INITIAL_STATE = [];
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
case GET_GROUPS:
return action.payload;
default:
return state;
}
};
import { GET_TASKS,
GET_SOLUTIONS,
/* eslint-disable no-case-declarations */
import {
ADD_SOLUTION,
ADD_TASK,
CORRECT_SOLUTION,
DELETE_TASK,
EDIT_TASK,
ADD_SOLUTION,
GET_DOCUMENTS,
GET_PROFILES,
GET_DOCUMENTS } from '../actions/types';
GET_SOLUTIONS,
GET_TASKS,
} from '../actions/types';
const INITIAL_STATE = {
id: 0,
......@@ -15,32 +19,49 @@ const INITIAL_STATE = {
documents: [],
};
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
case GET_TASKS:
return { ...state, tasks: action.payload };
case GET_SOLUTIONS:
return { ...state, solutions: action.payload };
case CORRECT_SOLUTION:
const modifiedSolution = state.solutions.find(
(sol) => sol.id === action.payload.id
);
const modifiedSolutions = state.solutions.slice();
modifiedSolutions.splice(
state.solutions.indexOf(modifiedSolution),
1,
action.payload
);
return { ...state, solutions: [...modifiedSolutions] };
case ADD_SOLUTION:
return { ...state, solutions: [action.payload, ...state.solutions], id: action.payload.id };
return {
...state,
solutions: [action.payload, ...state.solutions],
id: action.payload.id,
};
case ADD_TASK:
return { ...state, tasks: [action.payload, ...state.tasks] };
case DELETE_TASK:
return {
...state,
tasks: [...state.tasks.slice(0, state.tasks.indexOf(action.payload)),
...state.tasks.slice(state.tasks.indexOf(action.payload) + 1)],
tasks: [
...state.tasks.slice(0, state.tasks.indexOf(action.payload)),
...state.tasks.slice(state.tasks.indexOf(action.payload) + 1),
],
};
case EDIT_TASK:
return {
...state,
tasks: [...state.tasks.map((task) => {
if (task.id !== action.payload.id) {
return task;
}
return action.payload;
}),
tasks: [
...state.tasks.map((task) => {
if (task.id !== action.payload.id) {
return task;
}
return action.payload;
}),
],
};
case GET_PROFILES:
......
import { GET_IMAGES } from '../actions/types';
const INITIAL_STATE = [];
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
case GET_IMAGES:
return action.payload;
default:
return state;
}
};