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 287 additions and 394 deletions
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, postEventNote, 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.postEventNote({ 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, postEventNote, 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 moment from 'moment';
import ScrollToTop from './components/ScrollToTop';
import configureStore from './configureStore';
import App from './components/App';
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();
......@@ -18,10 +19,10 @@ const store = configureStore();
render(
<Provider store={store}>
<Router>
<ScrollToTop>
<App />
</ScrollToTop>
<App />
</Router>
</Provider>,
document.getElementById('root'),
document.getElementById('root')
);
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;
}
};
import { GET_MENTORS } from '../actions/types';
const INITIAL_STATE = [];
export default (state = INITIAL_STATE, action) => {
switch (action.type) {
case GET_MENTORS:
return action.payload;
default:
return state;
}
};
import { GET_NEWS, ADD_NEWS, DELETE_NEWS, EDIT_NEWS } from '../actions/types';
import { ADD_NEWS, DELETE_NEWS, EDIT_NEWS, GET_NEWS } from '../actions/types';
const INITIAL_STATE = [];
......@@ -9,7 +9,7 @@ export default (state = INITIAL_STATE, action) => {
case ADD_NEWS:
return [action.payload, ...state];
case EDIT_NEWS:
const array = state.filter(item => item.id === action.payload.id);
const array = state.filter((item) => item.id === action.payload.id);
state.splice(state.indexOf(array.pop()), 1, action.payload);
return [...state];
case DELETE_NEWS:
......