Create add event action

src/actions/statistics.js

@@ -5,6 +5,7 @@ import {
   GET_TRAINEES, VISITOR_CHANGE,
   GET_NOTES_BY_EVENT,
   WRITE_EVENT,
+  ADD_EVENT,
 } from './types';
 
 export const getEvents = () => (
@@ -79,9 +80,9 @@ export const submitVisitors = ({ id, visitors }) => (
   }
 );
 
-export const writeEvent = event => (
+export const writeEvent = ({ target: { name, value } }) => (
   (dispatch) => {
-    dispatch({ type: WRITE_EVENT, payload: event.target.value, target: event.name });
+    dispatch({ type: WRITE_EVENT, payload: value, target: name });
   }
 );
 
@@ -91,3 +92,25 @@ export const eventDate = (name, value) => (
     dispatch({ type: WRITE_EVENT, payload: value, target: name });
   }
 );
+
+export const addEvent = ({ name, date }) => (
+  async (dispatch) => {
+    try {
+      const response = await axios.post('/api/v1/events/', {
+        name,
+        date,
+      });
+      if (response.data.id) {
+        alert('Sikeres mentés!');
+        dispatch({
+          type: ADD_EVENT,
+          payload: response.data,
+        });
+      } else {
+        alert('Mentés nem sikerült!');
+      }
+    } catch (e) {
+      console.log(e);
+    }
+  }
+);

src/actions/types.js

@@ -20,3 +20,4 @@ export const VISITOR_CHANGE = 'visitor_change';
 
 export const GET_NOTES_BY_EVENT = 'get_notes_by_event';
 export const WRITE_EVENT = 'write_event';
+export const ADD_EVENT = 'add_event';

src/components/forms/AddEventForm.js

@@ -3,8 +3,8 @@ 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 } from '../../actions/statistics'
+// import { clearWrite } from '../../actions/news';
+import { writeEvent, eventDate, addEvent } from '../../actions/statistics'
 
 class AddEventForm extends Component {
   constructor(props) {
@@ -59,6 +59,7 @@ class AddEventForm extends Component {
             <DateTimeInput
               name="date"
               label="Dátum:"
+              dateFormat='YYYY-MM-DD'
               placeholder="Date"
               value={this.state.date}
               iconPosition="left"
@@ -79,8 +80,8 @@ class AddEventForm extends Component {
             inverted
             color='green'
             onClick={() => {
-                    this.props.addEvent();
-                    this.setState({ showModal: false });
+                    this.props.addEvent(this.props.newEvent);
+                    this.setState({ showModal: false, date: '' });
                     }}
           >
             <Icon name='checkmark' /> Add
@@ -93,4 +94,4 @@ class AddEventForm extends Component {
 
 const mapStateToProps = ({ events: { newEvent } }) => ({ newEvent });
 
-export default connect(mapStateToProps, { writeEvent, clearWrite, eventDate })(AddEventForm);
+export default connect(mapStateToProps, { writeEvent, addEvent, eventDate })(AddEventForm);

src/reducers/EventReducer.js

-import { GET_EVENTS, GET_EVENT_BY_ID, VISITOR_CHANGE, WRITE_EVENT } from '../actions/types';
+import { GET_EVENTS, GET_EVENT_BY_ID, VISITOR_CHANGE, WRITE_EVENT, ADD_EVENT } from '../actions/types';
 
 const INITIAL_STATE = { newEvent: {} };
 
@@ -11,7 +11,9 @@ export default (state = INITIAL_STATE, action) => {
     case VISITOR_CHANGE:
       return { ...state, selectedEvent: { ...state.selectedEvent, visitors: action.payload } };
     case WRITE_EVENT:
-      return { ...state, newEvent: { ...state.selectedEvent, [action.target]: action.payload } };
+      return { ...state, newEvent: { ...state.newEvent, [action.target]: action.payload } };
+    case ADD_EVENT:
+      return { ...state, events: [...state.events, action.payload] };
     default:
       return state;
   }