From c7b995c709d7ffba2709bc7f083be866f852aea6 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Chif=20Gerg=C5=91?= <chifgeri97@gmail.com>
Date: Thu, 17 Jan 2019 15:20:29 +0100
Subject: [PATCH] Display event notes and notes to trainees, connect creation
actions to the button and text area.
---
src/actions/notes.js | 14 +++++--
src/actions/statistics.js | 1 -
src/components/forms/AddEventForm.js | 2 -
src/components/pages/EventDetail.js | 58 ++++++++++++++++++++++++----
src/reducers/NoteReducer.js | 9 ++++-
5 files changed, 70 insertions(+), 14 deletions(-)
diff --git a/src/actions/notes.js b/src/actions/notes.js
index 79242e8..04362ab 100644
--- a/src/actions/notes.js
+++ b/src/actions/notes.js
@@ -2,7 +2,8 @@ import axios from './session';
import {
GET_NOTES_BY_EVENT,
WRITE_NOTE,
- ADD_NOTE,
+ ADD_EVENT_NOTE,
+ CLEAR_WRITE,
} from './types';
export const getNotesByEvent = id => (
@@ -26,9 +27,9 @@ export const writeNote = (event) => {
export const postEventNote = ({ eventid, userid, note }) => (
async (dispatch) => {
try {
- const response = await axios.post('/api/v1/note/', {
+ const response = await axios.post('/api/v1/notes/', {
event: eventid ? eventid : '',
- user: userid ? eventid : '',
+ profile: userid ? eventid : '',
note,
});
if (response.data.id) {
@@ -37,7 +38,14 @@ export const postEventNote = ({ eventid, userid, note }) => (
type: ADD_EVENT_NOTE,
payload: response.data,
});
+ }
} catch (e) {
console.log(e);
}
});
+
+export const clearWrite = () => (
+ (dispatch) => {
+ dispatch({ type: CLEAR_WRITE });
+ }
+);
diff --git a/src/actions/statistics.js b/src/actions/statistics.js
index c23ee3a..591057d 100644
--- a/src/actions/statistics.js
+++ b/src/actions/statistics.js
@@ -4,7 +4,6 @@ import {
GET_EVENT_BY_ID,
GET_TRAINEES,
VISITOR_CHANGE,
- GET_NOTES_BY_EVENT,
WRITE_EVENT,
ADD_EVENT,
DELETE_EVENT,
diff --git a/src/components/forms/AddEventForm.js b/src/components/forms/AddEventForm.js
index 1df5d90..af8c4b1 100644
--- a/src/components/forms/AddEventForm.js
+++ b/src/components/forms/AddEventForm.js
@@ -2,8 +2,6 @@ import React, { Component } from 'react';
import { Modal, Button, Form, Input, TextArea, Icon } from 'semantic-ui-react';
import { connect } from 'react-redux';
import { DateTimeInput } from 'semantic-ui-calendar-react';
-
-// import { clearWrite } from '../../actions/news';
import { writeEvent, eventDate, addEvent } from '../../actions/statistics'
class AddEventForm extends Component {
diff --git a/src/components/pages/EventDetail.js b/src/components/pages/EventDetail.js
index 6383489..530ed73 100644
--- a/src/components/pages/EventDetail.js
+++ b/src/components/pages/EventDetail.js
@@ -12,7 +12,8 @@ import {
} from 'semantic-ui-react';
import { connect } from 'react-redux';
import moment from 'moment';
-import { getEventById, getTrainees, visitorChange, getNotesByEvent, submitVisitors } from '../../actions/statistics';
+import { getEventById, getTrainees, visitorChange, submitVisitors } from '../../actions/statistics';
+import { getNotesByEvent, writeNote, clearWrite, postEventNote } from '../../actions/notes';
class EventDetail extends Component {
constructor(props) {
@@ -31,7 +32,7 @@ class EventDetail extends Component {
renderTrainees() {
return this.props.trainees.map((item) => {
- const isVisitor = this.props.selectedEvent.visitors.find(i => i === item.id);
+ const isVisitor = this.props.selectedEvent.visitors.includes(item.id);
return (
<Table.Row>
<Table.Cell>
@@ -55,6 +56,20 @@ class EventDetail extends Component {
</Table.Cell>
}
<Table.Cell>
+ {this.props.eventNotes.map((note) => {
+ if (note.profile === item.id) {
+ return (
+ <Comment.Content>
+ <Comment.Author>{note.created_by_name}</Comment.Author>
+ <Comment.Text>
+ {note.note}
+ </Comment.Text>
+ </Comment.Content>
+ );
+ }
+ return ('');
+ })
+ }
</Table.Cell>
</Table.Row>
);
@@ -62,7 +77,7 @@ class EventDetail extends Component {
}
renderEvent() {
- const { id, name, date, visitors } = this.props.selectedEvent;
+ const { name, date } = this.props.selectedEvent;
return (
<Item>
<Item.Header as='h2'>{name}</Item.Header>
@@ -89,6 +104,8 @@ class EventDetail extends Component {
}
render() {
+ const event = this.props.selectedEvent;
+ const note = this.props.actualNote;
return (
<Container>
<Container textAlign='center'>
@@ -147,8 +164,22 @@ class EventDetail extends Component {
''
}
<Form reply>
- <Form.TextArea />
- <Button content='MegjegyzĂŠs hozzĂĄadĂĄsa' labelPosition='left' icon='edit' primary />
+ <Form.TextArea
+ value={note.note}
+ onChange={e => this.props.writeNote(e)}
+ />
+ <Button
+ onClick={() => {
+ this.props.postEventNote({ eventid: event.id,
+ note: note.note });
+ this.props.clearWrite();
+ }
+ }
+ content='MegjegyzĂŠs hozzĂĄadĂĄsa'
+ labelPosition='left'
+ icon='edit'
+ primary
+ />
</Form>
</Comment.Group>
</Container>
@@ -157,6 +188,19 @@ class EventDetail extends Component {
}
}
-const mapStateToProps = ({ notes: { eventNotes }, events: { selectedEvent }, trainees: { trainees } }) => ({ eventNotes, selectedEvent, trainees });
+const mapStateToProps = ({
+ notes: { eventNotes, actualNote },
+ events: { selectedEvent },
+ trainees: { trainees }
+}) => ({ eventNotes, selectedEvent, trainees, actualNote });
-export default connect(mapStateToProps, { getEventById, getTrainees, visitorChange, getNotesByEvent, submitVisitors })(EventDetail);
+export default connect(mapStateToProps, {
+ getEventById,
+ getTrainees,
+ visitorChange,
+ getNotesByEvent,
+ submitVisitors,
+ writeNote,
+ clearWrite,
+ postEventNote,
+})(EventDetail);
diff --git a/src/reducers/NoteReducer.js b/src/reducers/NoteReducer.js
index c98a0fa..90e4c8d 100644
--- a/src/reducers/NoteReducer.js
+++ b/src/reducers/NoteReducer.js
@@ -1,4 +1,9 @@
-import { GET_NOTES_BY_EVENT, WRITE_NOTE, ADD_EVENT_NOTE } from '../actions/types';
+import {
+ GET_NOTES_BY_EVENT,
+ WRITE_NOTE,
+ ADD_EVENT_NOTE,
+ CLEAR_WRITE,
+} from '../actions/types';
const INITIAL_STATE = { eventNotes: [], actualNote: {} };
@@ -10,6 +15,8 @@ export default (state = INITIAL_STATE, action) => {
return { ...state, actualNote: { ...state.actualNote, note: action.payload } };
case ADD_EVENT_NOTE:
return { ...state, eventNotes: [...state.eventNotes, action.payload] };
+ case CLEAR_WRITE:
+ return { ...state, actualNote: { note: '' } };
default:
return state;
}
--
GitLab