2 Commits 2f1280446f ... 3bb1e64b74

Autor SHA1 Mensaje Fecha
  Tanya Sashyna 3bb1e64b74 added filter on the results page hace 5 años
  Marina Yakovenko c92e24a1e9 admin-page hace 5 años
Se han modificado 44 ficheros con 341 adiciones y 745 borrados
  1. 3 3
      src/actions/adminMainPageActions.js
  2. 4 2
      src/actions/getResults.js
  3. 6 10
      src/actions/photogalaryActions.js
  4. 0 15
      src/components/adminEventElement/adminEventElement.js
  5. 0 67
      src/components/adminEventElement/adminEventElement.scss
  6. 12 15
      src/components/adminHeader/adminHeader.js
  7. 0 3
      src/components/adminMenu/adminMenu.js
  8. 5 15
      src/components/adminMenu/adminMenu.scss
  9. 6 9
      src/components/adminPhotogalary/adminPhotogalary.scss
  10. 7 20
      src/components/adminPhotogalary/adminPhotogalaryReduxForm.js
  11. 4 4
      src/components/adminResults/adminResultsForm.js
  12. 3 14
      src/components/adminResults/adminResultsForm.scss
  13. 15 15
      src/components/customFields/customInput/customInput.js
  14. 0 2
      src/components/customFields/customInput/customInput.scss
  15. 0 104
      src/components/customFields/customSearchSelect/customSearchSelect.js
  16. 0 42
      src/components/customFields/customSearchSelect/customSearchSelect.scss
  17. 4 4
      src/components/customFields/customSelect/customSelect.js
  18. 3 2
      src/components/customFields/customSelect/customSelect.scss
  19. 4 4
      src/components/customFields/customTextarea/customTextarea.js
  20. 31 31
      src/components/customFields/customTextarea/customTextarea.scss
  21. 9 11
      src/components/eventForm/eventForm.scss
  22. 2 17
      src/components/eventForm/eventReduxForm.js
  23. 1 1
      src/components/filtersEvents/FiltersEvents.js
  24. 27 35
      src/conteiners/adminAddEventPage/adminAddEventPage.js
  25. 2 10
      src/conteiners/adminMainPage/adminMainPage.js
  26. 0 1
      src/conteiners/adminMainPage/adminMainPage.scss
  27. 5 16
      src/conteiners/adminMyEventsPage/adminMyEventsPage.js
  28. 3 4
      src/conteiners/adminMyEventsPage/adminMyEventsPage.scss
  29. 15 22
      src/conteiners/adminPhotogalaryPage/adminPhotogalaryPage.js
  30. 24 24
      src/conteiners/adminResultsPage/adminResultsPage.js
  31. 18 16
      src/conteiners/result/Result.js
  32. 3 6
      src/conteiners/reviews/Reviews.js
  33. 1 5
      src/index.js
  34. 1 2
      src/private-router.js
  35. 4 5
      src/reducers/adminMainPageReducer.js
  36. 7 9
      src/reducers/adminResultsReduser.js
  37. 11 2
      src/reducers/getAllEvents.js
  38. 14 33
      src/reducers/photogalaryReducer.js
  39. 44 46
      src/router.js
  40. 32 90
      src/state/addEventInitialValue.js
  41. 2 4
      src/state/adminMenu.js
  42. 0 0
      src/state/initialState.js
  43. 4 0
      src/styles/base.scss
  44. 5 5
      src/utils/eventFormValidation.js

+ 3 - 3
src/actions/adminMainPageActions.js

@@ -28,7 +28,7 @@ export const postNewEvent = payload => {
 	return async dispatch => {
 		dispatch(postNewEventRequest());
 		try {
-			const { data } = await axios.post("https://api-marathon.herokuapp.com/api/v1/event", payload);
+			const { data } = await axios.post(eventURL, payload);
 			dispatch(postNewEventRequestSuccess(data));
 			console.log("New Event Posted", payload)
 		} catch (error) {
@@ -55,7 +55,7 @@ export const changeEvent = (payload) => {
 	return async dispatch => {
 		dispatch(editEventRequest());
 		try {
-			await axios.put(`https://api-marathon.herokuapp.com/api/v1/event/${payload._id} `, payload);
+			await axios.put(`${eventURL}/${payload._id} `, payload);
 			dispatch(editEventRequestSuccess({payload, id: payload._id}));
 			console.log("Event Changed", payload)
 		} catch (error) {
@@ -133,7 +133,7 @@ const removeEventFail = payload => ({
 export const removeEvent = _id => dispatch => {
 	dispatch(removeEventRequest());
 	return axios
-		.delete(` https://api-marathon.herokuapp.com/api/v1/event/${_id}`)
+		.delete(`${eventURL}/${_id}`)
 		.then(res => dispatch(removeEventSuccess({ res, _id })))
 		.catch(err => dispatch(removeEventFail(err)));
 };

+ 4 - 2
src/actions/getResults.js

@@ -1,5 +1,7 @@
 import * as types from "../actionTypes/actionTypes";
 
+const resultsURL = 'https://api-marathon.herokuapp.com/api/v1/results'
+
 export const getResultsSend = payload => ({
     type: types.GET_RESULT,
     payload
@@ -15,9 +17,9 @@ export const getResultsError = payload => ({
     payload
 });
 
-export const getResults = () => {
+export const getResults = (type = 'All events') => {
     return dispatch => {
-        let promise = fetch('https://api-marathon.herokuapp.com/api/v1/results')
+        let promise = fetch(type !== 'All events' ? `${resultsURL}/?event=${type}` : resultsURL)
 
         dispatch(getResultsSend())
 

+ 6 - 10
src/actions/photogalaryActions.js

@@ -1,12 +1,8 @@
 import axios from "axios";
 import * as types from "../actionTypes/actionTypes"
 
-// export const photogalaryOnchange = payload => {
-// 	return {
-// 		type: types.PHOTOGALARY_ONCHAGE,
-// 		payload
-// 	};
-// };
+const photogalaryURL = "https://api-marathon.herokuapp.com/api/v1/gallery"
+const eventURL = 'https://api-marathon.herokuapp.com/api/v1/event'
 
 // GET EVENTS
 const getEventsRequest = payload => ({
@@ -27,7 +23,7 @@ const getEventsRequestFail = payload => ({
 export const getEvents = () => dispatch => {
 	dispatch(getEventsRequest());
 	return axios
-		.get("https://api-marathon.herokuapp.com/api/v1/event")
+		.get(eventURL)
 		.then(res => dispatch(getEventsRequestSuccess(res)))
 		.catch(err => dispatch(getEventsRequestFail(err)));
 };
@@ -51,7 +47,7 @@ const getPhotogalaryRequestFail = payload => ({
 export const getPhotogalary = () => dispatch => {
 	dispatch(getPhotogalaryRequest());
 	return axios
-		.get("https://api-marathon.herokuapp.com/api/v1/gallery")
+		.get(photogalaryURL)
 		.then(res => dispatch(getPhotogalaryRequestSuccess(res)))
 		.catch(err => dispatch(getPhotogalaryRequestFail(err)));
 };
@@ -74,7 +70,7 @@ export const postPhotogalary = payload => {
 	return async dispatch => {
 		dispatch(postPhotogalaryRequest());
 		try {
-			const { data } = await axios.post("https://api-marathon.herokuapp.com/api/v1/gallery", payload);
+			const { data } = await axios.post(photogalaryURL, payload);
 			dispatch(postPhotogalaryRequestSuccess(data));
 			console.log("Photogalary Posted", payload)
 		} catch (error) {
@@ -101,7 +97,7 @@ export const putPhotogalary = (payload) => {
 	return async dispatch => {
 		dispatch(putPhotogalaryRequest());
 		try {
-			await axios.put(`https://api-marathon.herokuapp.com/api/v1/gallery/:${payload._id} `, payload);
+			await axios.put(`${photogalaryURL}/:${payload._id} `, payload);
 			dispatch(putPhotogalaryRequestSuccess({payload, id: payload._id}));
 			console.log("PUT Photogalary success", payload)
 		} catch (error) {

+ 0 - 15
src/components/adminEventElement/adminEventElement.js

@@ -1,15 +0,0 @@
-import React from 'react'
-import "./adminEventElement.scss";
-
-
-export default ({img, title, id, onClick, onClickEdit, onClickDelete,  ...rest}) => (
-    <div id = {id} className = "event-tank" color = "#f6f1bf" onClick = {onClick} > 
-        <div className = "event-title">{title}</div>
-        <img className = "event-image" src = {img} alt = "event"/>
-        <div className ="event-buttons-conteiner">
-            <button className="event-button" onClick = {onClickEdit}>Edit Event</button>
-            <button className="event-button" onClick = {onClickDelete}>Delete Event</button>
-        </div>
-        {/* <div className = "event-title">{title}</div> */}
-    </div>
-)

+ 0 - 67
src/components/adminEventElement/adminEventElement.scss

@@ -1,67 +0,0 @@
-@import "../../styles/variables";
-
-// .event-tank {
-//     display:flex;
-//     flex-direction: column;
-//     justify-content: top;
-//     text-align: center;
-//     padding: 10px;
-//     margin: 5px;
-//     // border: 2px solid $color-black;	
-// }
-// .event-image {
-//     width: 100%;
-//     height: 25rem;
-//     padding: 10px;
-//     border: 2px solid $color-mint;
-//     margin-bottom: 5px;
-// }
-// .event-image:hover {
-//     // box-shadow: inset 10px 10px 10px $color-mint;
-//     background: $color-mint;
-// }
-
-// .event-buttons-conteiner{
-//     display: flex;
-//     flex-direction: row;
-//     justify-content: space-between;
-//     margin: 10px;
-// }
-
-// .event-button{
-//     width: 45%;
-//     background-color: $color-mint;
-//     padding: 1rem;
-//     border: none;
-//     border-radius: 3px;
-//     color: #fff;
-//     font-weight: 600;
-// 	font-size: 1.2rem;
-// 	transition: 0.2s;
-// 	// padding: 1rem 5rem;
-// }
-
-// .event-button:hover{
-//     outline: none;
-//     transform: translateY(-1px);
-//     box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.2);
-//     &:after {
-//         transform: scaleX(1.4) scaleY(1.6);
-//         opacity: 0;
-//     }
-// }
-// .event-title {
-//     color: $color-black;
-//     font-size: 1.3rem;
-//     font-weight: 800;
-// }
-// @media (max-width: 600px) {
-//     .event-tank {
-//         padding: 10px;
-//         margin: 0;	
-//     }
-//     .event-title {
-//         font-size: 1rem;
-//         font-weight: 600;
-//     }
-// }

+ 12 - 15
src/components/adminHeader/adminHeader.js

@@ -1,30 +1,30 @@
 import React from "react";
 import { Link, withRouter } from "react-router-dom";
-import { connect } from "react-redux";
 import "./adminHeader.scss";
 import { adminMenu } from "../../state/adminMenu";
 
 const adminHeader = props => {
-	
+
 	const logout = (e) => {
-        localStorage.removeItem('user');
-        props.history.push('/')
-    }
+		localStorage.removeItem('user');
+		props.history.push('/')
+	}
 
 	return (
 		<header className="header" id="header">
 			<div className="header__left-wrapper">
-				<div className="header__logo-box">                    
-				<div className="header__logo">
-                        <Link to="/admin">
-                            Just_<span>tri</span>_it
+				<div className="header__logo-box">
+					<div className="header__logo">
+						<Link to="/admin">
+							Just_<span>tri</span>_it
                         </Link>
-                </div></div>
+					</div>
+				</div>
 				<nav className="header__nav">
 					<ul className="header__list">
 						{adminMenu.map(el =>
 							el.hideWhenAuth && props.user ? null : (
-								<li className="header__item" key={el.id} onClick = { el.logout ? logout : null}>
+								<li className="header__item" key={el.id} onClick={el.logout ? logout : null}>
 									<Link to={el.path}>{el.text}</Link>
 								</li>
 							)
@@ -36,7 +36,4 @@ const adminHeader = props => {
 	);
 };
 
-const mapStateToProps = state => ({
-});
-
-export default connect(mapStateToProps)(withRouter(adminHeader));
+export default withRouter(adminHeader);

+ 0 - 3
src/components/adminMenu/adminMenu.js

@@ -18,7 +18,6 @@ class AdminMenu extends Component {
         return (
             <div className="menu-block">
                 {adminMenu.map(el =>
-
                     el.text !== "Log out" && el.text !== "Main Page" &&
                     <div
                         className="menu-skew"
@@ -26,10 +25,8 @@ class AdminMenu extends Component {
                         onClick={this.clickEventHandler.bind(null, el.path)}
                     >
                         <h2 className="menu-text">{el.text.toUpperCase()}</h2>
-                        {/* <Link to={el.path} className = "menu-text">{el.text.toUpperCase()}</Link>  */}
                     </div>
                 )}
-
             </div>
         )
     }

+ 5 - 15
src/components/adminMenu/adminMenu.scss

@@ -26,8 +26,7 @@
     
     &:first-child {
       clip-path: polygon(0 0,100% 0,80% 100%,0% 100%);
-       background-image: 
-    url(https://cdn.pixabay.com/photo/2018/08/09/02/50/person-3593664_1280.jpg);
+      background-image: url(https://cdn.pixabay.com/photo/2018/08/09/02/50/person-3593664_1280.jpg);
     }
 
      &:nth-child(2) {
@@ -43,8 +42,7 @@
       clip-path: polygon(0 0,100% 0,86% 100%,0% 100%);
       background-image: url(https://cdn.pixabay.com/photo/2016/07/07/22/58/cycling-1503365_1280.jpg);
     }
-
-    
+   
      &:nth-child(4) {
       flex-grow: 0;
       clip-path: polygon(24% 0,100% 0,100% 100%,0% 100%);
@@ -54,18 +52,9 @@
 
     &:nth-child(5) {
        width: 100%;
-       background-image: 
-    url(https://cdn.pixabay.com/photo/2014/01/24/13/32/marathon-250987_1280.jpg);
+       background-image: url(https://cdn.pixabay.com/photo/2014/01/24/13/32/marathon-250987_1280.jpg);
     }
-
-    //  &:nth-child(6) {
-    //   right: -100px;
-    //   clip-path: polygon(12% 0,100% 0,100% 100%,0% 100%);
-    //   margin-left: -7%;
-    //   flex-grow: 2;
-    //   background-image: url(https://cdn.pixabay.com/photo/2018/08/12/11/02/swim-3600519_1280.jpg);
-    // } 
-    
+   
     .menu-text{
       color: $color-white;
       font-size: 3rem;
@@ -74,6 +63,7 @@
       text-shadow: 3px 3px 3px #000;
       transition: .5s ease-in-out;
     }
+    
     &:hover {
       opacity: 0.75;
       .menu-text{

+ 6 - 9
src/components/adminPhotogalary/adminPhotogalary.scss

@@ -24,10 +24,10 @@
 	}
 
 	&__photogalary-form__selects{
-	position: relative;
-	display: flex;
-	flex-direction: row;
-	flex-wrap: wrap;
+		position: relative;
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
 	}
 
 	&__text {
@@ -60,8 +60,7 @@
     &__picture-input {
         display: flex;
         flex-direction: column;
-        width: 100%;
-    
+        width: 100%;    
         font-size: 1.3rem;
         font-weight: 600;
     }
@@ -115,8 +114,7 @@
 			color: $color-mint;
 			border: 1px solid $color-mint;
 			background-color: #eee;
-        }
-        
+        }        
     }
 
 	&__submit-btn {
@@ -154,5 +152,4 @@
 			background-color: #eee;
 		}
 	}
-
 }

+ 7 - 20
src/components/adminPhotogalary/adminPhotogalaryReduxForm.js

@@ -13,24 +13,14 @@ class PhotogalaryReduxForm extends Component {
     }
 
     submit = values => {
-        // console.log('submit props', this.props)
-        // console.log('submit state', this.state)
         const pictures = this.state.addPhotogalaryInitialValue.pictures.reduce((prev, elem) => {
             return prev.concat(elem.value);
         }, []);
 
-        // const eventId = this.props.eventList.find(
-        //     event => event.title === this.state.addPhotogalaryInitialValue.eventTitle
-        // )._id
-
         const submitValues = {
             ...this.state.addPhotogalaryInitialValue,
             pictures: pictures,
-            // _id: eventId
         }
-        // console.log('submit eventId', eventId)
-        console.log('submit values', submitValues)
-        // console.log('pictures', pictures)
 
         this.props.submitHandler(submitValues);
         this.props.reset()
@@ -38,16 +28,15 @@ class PhotogalaryReduxForm extends Component {
 
     onChangeTypeHandler = e => {
         const { name, value } = e.target;
-        // console.log('eventInput', value)
+
         this.setState(prevState => {
-            console.log('prevStateInput', prevState)
             return {
                 ...prevState,
                 addPhotogalaryInitialValue: {
                     ...prevState.addPhotogalaryInitialValue,
                     [name]: value
                 },
-                filteredEventList: [{_id: 1, title: "Choose event"}].concat(
+                filteredEventList: [{_id: 1, title: "Select event"}].concat(
                     this.props.eventList.filter(el => el.eventType === value)
                 )
             };
@@ -56,9 +45,8 @@ class PhotogalaryReduxForm extends Component {
 
     onChangeTitleHandler = e => {
         const { name, value } = e.target;
-        console.log('eventInput', value)
+
         this.setState(prevState => {
-            console.log('prevStateInput', prevState)
             return {
                 ...prevState,
                 addPhotogalaryInitialValue: {
@@ -71,14 +59,15 @@ class PhotogalaryReduxForm extends Component {
 
     onChangePicturesHandler = e => {
         const { value, id } = e.target;
-        console.log('eventPicture', e)
+
         this.setState(prevState => {
-            console.log('prevStatePicture', prevState)
             return {
                 ...prevState,
                 addPhotogalaryInitialValue: {
                     ...prevState.addPhotogalaryInitialValue,
-                    pictures: prevState.addPhotogalaryInitialValue.pictures.map(el => (el.id === id ? { ...el, value } : el))
+                    pictures: prevState.addPhotogalaryInitialValue.pictures.map(
+                        el => (el.id === id ? { ...el, value } : el)
+                    )
                 }
             };
         });
@@ -86,7 +75,6 @@ class PhotogalaryReduxForm extends Component {
 
     addPicture = (e) => {
         this.setState(prevState => {
-            console.log('prevStatePicture-add', prevState)
             return {
                 ...prevState,
                 addPhotogalaryInitialValue: {
@@ -107,7 +95,6 @@ class PhotogalaryReduxForm extends Component {
 
     render() {
         const { filteredEventList, addPhotogalaryInitialValue } = this.state;
-        // console.log(this.state )
 
         const {
             handleSubmit,

+ 4 - 4
src/components/adminResults/adminResultsForm.js

@@ -19,6 +19,8 @@ class AdminResultsForm extends Component {
             onChangeInputTimeHandler
         } = this.props;
 
+        const fullEventList = [{title: "Select Event", _id: 1}].concat(eventList)
+
         return (
             <form className="results-form__results-form__main" onSubmit={handleSubmit(submitHandler)}>
 
@@ -41,8 +43,7 @@ class AdminResultsForm extends Component {
                     onChange={onChangeTitleHandler}
                     className="form-block__select -wide"
                 >   
-                    {console.log('event list', eventList)}
-                    {eventList && eventList.map(elem => <option key={elem._id} id={elem._id} value={elem.title}>{elem.title}</option>)}
+                    {fullEventList && fullEventList.map(elem => <option key={elem._id} id={elem._id} value={elem.title}>{elem.title}</option>)}
                 </Field>
 
                 <div className = 'results-form__table'>  
@@ -52,8 +53,8 @@ class AdminResultsForm extends Component {
                         <div className = 'results-form__header_country'>Country</div>
                         <div className = 'results-form__header_distance'>Distance</div>
                         <div className = 'results-form__header_time'>Time</div>
+                    </div> 
 
-                    </div>              
                 {eventusers && eventusers.map( elem => 
                     <div key={elem._id} className='results-form__user-data'>
                         <div className = "results-form__user-data_name">{elem.name}</div>
@@ -75,7 +76,6 @@ class AdminResultsForm extends Component {
                     <button className="results-form__submit-btn" >Add Results</button>
                 </div>
             </form>
-
         );
     }
 }

+ 3 - 14
src/components/adminResults/adminResultsForm.scss

@@ -5,9 +5,9 @@
 	min-height: 100vh;
 	margin: auto;
 
-	background: -webkit-linear-gradient(top, #fff, $color-blue); /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
-	background: -moz-linear-gradient(top, #fff, $color-blue); /* Firefox 3.6-15 */
-	background: -o-linear-gradient(top,  #fff, $color-blue); /* Opera 11.1-12 */
+	background: -webkit-linear-gradient(top, #fff, $color-blue);
+	background: -moz-linear-gradient(top, #fff, $color-blue); 
+	background: -o-linear-gradient(top,  #fff, $color-blue); 
 	background: linear-gradient(to bottom,  #fff, $color-blue);
 
 	&__content {
@@ -35,16 +35,7 @@
 		margin-bottom: 3%;
     }
 
-	&__toggle-span {
-		font-size: 1.6rem;
-		font-weight: bold;
-		color: rgb(102, 104, 223);
-	}
-
 	&__header{
-		// display: flex;
-		// flex-direction: row;
-		// justify-content: space-between;
 		display: grid;
 		grid-template-columns: repeat(5, 1fr);
 		grid-gap: 1rem;
@@ -60,8 +51,6 @@
 	}	
 
 	&__user-data{
-		// display: flex;
-		// justify-content: space-between;
 		display: grid;
 		grid-template-columns: repeat(5, 1fr);
 		align-items: start;

+ 15 - 15
src/components/customFields/customInput/customInput.js

@@ -11,18 +11,18 @@ export const customInput = ({
 	type = "text",
 	required
 }) => (
-	<label htmlFor={id} className ={className} >
-		<span>
-			{label} {required && <span className="input-box__required">*</span>}
-		</span>
-		<input
-			{...inputProps}
-			autoComplete="off"
-			className={error && touched ? "input-box__input input-box__input--fail" : "input-box__input"}
-			id={id}
-			placeholder={placeholder}
-			type={type}
-		/>
-		{error && touched && <span className="input-box__error">{error}</span>}
-	</label>
-);
+		<label htmlFor={id} className={className} >
+			<span>
+				{label} {required && <span className="input-box__required">*</span>}
+			</span>
+			<input
+				{...inputProps}
+				autoComplete="off"
+				className={error && touched ? "input-box__input input-box__input--fail" : "input-box__input"}
+				id={id}
+				placeholder={placeholder}
+				type={type}
+			/>
+			{error && touched && <span className="input-box__error">{error}</span>}
+		</label>
+	);

+ 0 - 2
src/components/customFields/customInput/customInput.scss

@@ -34,12 +34,10 @@
 			font-size: 1.3rem;
 			color:  #cecece;
 		}
-
 	}
 
 	&.-wide{
 		width: 100%;
 		margin-right: 0;
 	}
-
 }

+ 0 - 104
src/components/customFields/customSearchSelect/customSearchSelect.js

@@ -1,104 +0,0 @@
-import React from "react";
-import "./customSearchSelect.scss";
-
-const mock = [{ id: 1, optionName: "ONE" }, { id: 2, optionName: "TWO" }, { id: 3, optionName: "THREE" }];
-
-export const CustomSearchSelect = ({ label, options = mock, emptyLine = false, searchInput = true, reset }) => {
-	const [copyOption, setCopyOption] = React.useState([]);
-	const [show, toggleShow] = React.useState(false);
-	const [value, toggleValue] = React.useState("");
-	const [inputValue, toggleInputValue] = React.useState("");
-	const list = React.createRef();
-
-	React.useEffect(() => {
-		document.addEventListener("mousedown", handleClickOutSide);
-		return () => document.removeEventListener("mousedown", handleClickOutSide);
-	});
-
-	React.useEffect(() => {
-		if (reset) {
-			toggleValue("");
-			toggleInputValue("");
-			setCopyOption(options);
-
-			toggleShow(false);
-		}
-	}, [options, reset]);
-
-	React.useEffect(() => {
-		setCopyOption(options);
-	}, [options]);
-
-	const handleClickOutSide = e => {
-		if (!show) return;
-
-		if (list.current && !list.current.contains(e.target)) {
-			toggleShow(false);
-		}
-	};
-
-	const toggleEvent = optionName => {
-		toggleValue(optionName);
-		toggleInputValue(optionName);
-        toggleShow(false);
-        console.log('toggleValue', optionName)
-	};
-
-	const clickOnEptyLine = () => {
-		toggleValue("");
-		toggleInputValue("");
-
-		toggleShow(false);
-	};
-
-	const chahgeValueEvent = e => {
-		const { value } = e.target;
-		toggleInputValue(e.target.value);
-
-		if (!value) {
-			setCopyOption(options);
-			toggleInputValue(value);
-		} else {
-			const filtered = copyOption.filter(el => el.optionName.toLowerCase().indexOf(value.toLowerCase()) >= 0);
-
-			setCopyOption(filtered);
-			toggleInputValue(value);
-        }
-        console.log('selectValue', value)
-	};
-
-	return (
-		<div className="select">
-			{label && (
-				<label htmlFor="select" className="select__lable">
-					{label}
-				</label>
-			)}
-			<div className="select__value-box" onClick={() => toggleShow(true)}>
-				{searchInput ? null : <span>{value} &nbsp;</span>}
-				<input
-					value={inputValue}
-					autoComplete="off"
-					type={searchInput ? "text" : "hidden"}
-					onChange={chahgeValueEvent}
-					id="select"
-					className="select__input"
-				/>
-			</div>
-			{show && (
-				<ul className="select__list" ref={list}>
-					{emptyLine && (
-						<li className="select__item" onClick={clickOnEptyLine}>
-							&nbsp;
-						</li>
-					)}
-					{copyOption.map(el => (
-						<li className="select__item" key={el.id} onClick={toggleEvent.bind(null, el.optionName)}>
-							{el.optionName}
-						</li>
-					))}
-				</ul>
-			)}
-		</div>
-	);
-};

+ 0 - 42
src/components/customFields/customSearchSelect/customSearchSelect.scss

@@ -1,42 +0,0 @@
-.select {
-	width: 100%;
-	display: flex;
-	flex-direction: column;
-	position: relative;
-
-	&__list {
-		list-style: none;
-		padding: 0;
-		margin: 0;
-		width: 100%;
-		background-color: #fff;
-
-		position: absolute;
-		left: 0;
-		top: 100%;
-		z-index: 10;
-	}
-
-	&__value-box {
-		border: 1px solid #eee;
-		border-radius: 3px;
-		padding: 0.5rem;
-	}
-
-	&__item {
-		display: flex;
-		padding: 0.5rem;
-		cursor: pointer;
-		&:hover {
-			background-color: #eee;
-		}
-	}
-
-	&__input {
-		border: none;
-		width: 100%;
-		&:focus {
-			outline: none;
-		}
-	}
-}

+ 4 - 4
src/components/customFields/customSelect/customSelect.js

@@ -3,10 +3,10 @@ import "./customSelect.scss";
 
 export const customSelect = ({ label, input, children, id, className = "form-block__select", meta }) => {
 	return (
-		<div className={className} id = {'select_'+id}>
-			<label className= "select-box" htmlFor={id}>{label}</label>
-			<select {...input} className = "select-box__input">{children}</select>
-            {meta.error && meta.touched && (
+		<div className={className} id={'select_' + id}>
+			<label className="select-box" htmlFor={id}>{label}</label>
+			<select {...input} className="select-box__input">{children}</select>
+			{meta.error && meta.touched && (
 				<span className="error">{meta.error}</span>
 			)}
 		</div>

+ 3 - 2
src/components/customFields/customSelect/customSelect.scss

@@ -1,10 +1,10 @@
 .form-block__select{
     width: 40%;
-    margin-right: 10%;
+	margin-right: 10%;
+	
 	.select-box {
 		display: flex;
 		flex-direction: column;
-		
 		font-size: 1.3rem;
 		font-weight: 600;
 
@@ -37,6 +37,7 @@
 				color:  #cecece;
 			}
 		}
+		
 		&____option{
 			&:hover {
 				background-color: #5acec2;

+ 4 - 4
src/components/customFields/customTextarea/customTextarea.js

@@ -3,12 +3,12 @@ import "./customTextarea.scss";
 
 export const customTextarea = ({ label, rows, input, placeholder, id, name, meta }) => {
 	return (
-		<div className="form-block__text-area" id = {'textarea_'+id}>
+		<div className="form-block__text-area" id={'textarea_' + id}>
 			<label className="textarea-box">{label}</label>
-			<textarea className="textarea-box__input" {...input} rows={rows} name={name} placeholder={placeholder}/>
-            {meta.error && meta.touched && (
+			<textarea className="textarea-box__input" {...input} rows={rows} name={name} placeholder={placeholder} />
+			{meta.error && meta.touched && (
 				<span className="error">{meta.error}</span>
-			)} 
+			)}
 		</div>
 	)
 }

+ 31 - 31
src/components/customFields/customTextarea/customTextarea.scss

@@ -1,40 +1,40 @@
 .form-block__text-area{
 	width: 100%;
-.textarea-box {
-	display: flex;
-	flex-direction: column;
-	
-	font-size: 1.3rem;
-	font-weight: 600;
 
-	&__input {
-		font-family: inherit;
-		color: inherit;
-		font-size: 1.5rem;
-		padding: 0.5rem 1rem;
-		border-radius: 2px;
-		background-color: rgba(255, 255, 255, 0.5);
-		border: none;
-		border: 2px solid #eee;
-		width: 100%;
-		display: block;
-        transition: all 0.3s;
-        margin-bottom: 1rem;
+	.textarea-box {
+		display: flex;
+		flex-direction: column;	
+		font-size: 1.3rem;
+		font-weight: 600;
 
-		&:focus {
-			outline: none;
-			box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
-			border: 2px solid #5acec2;
-		}
+		&__input {
+			font-family: inherit;
+			color: inherit;
+			font-size: 1.5rem;
+			padding: 0.5rem 1rem;
+			border-radius: 2px;
+			background-color: rgba(255, 255, 255, 0.5);
+			border: none;
+			border: 2px solid #eee;
+			width: 100%;
+			display: block;
+			transition: all 0.3s;
+			margin-bottom: 1rem;
 
-		&--fail {
-			border-bottom: 3px solid #9e4560;
-		}
+			&:focus {
+				outline: none;
+				box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.1);
+				border: 2px solid #5acec2;
+			}
+
+			&--fail {
+				border-bottom: 3px solid #9e4560;
+			}
 
-		&::placeholder {
-			font-size: 1.3rem;
-			color:  #cecece;
+			&::placeholder {
+				font-size: 1.3rem;
+				color:  #cecece;
+			}
 		}
 	}
-}
 }

+ 9 - 11
src/components/eventForm/eventForm.scss

@@ -4,9 +4,9 @@
 	width: 100%;
 	height: 100%;
 	margin: auto;
-	background: -webkit-linear-gradient(top, #fff, $color-blue); /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
-	background: -moz-linear-gradient(top, #fff, $color-blue); /* Firefox 3.6-15 */
-	background: -o-linear-gradient(top,  #fff, $color-blue); /* Opera 11.1-12 */
+	background: -webkit-linear-gradient(top, #fff, $color-blue);
+	background: -moz-linear-gradient(top, #fff, $color-blue);
+	background: -o-linear-gradient(top,  #fff, $color-blue); 
 	background: linear-gradient(to bottom,  #fff, $color-blue);
 
 	&__content {
@@ -21,10 +21,10 @@
 	}
 
 	&__event-form__main{
-	position: relative;
-	display: flex;
-	flex-direction: row;
-	flex-wrap: wrap;
+		position: relative;
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
 	}
 
 	&__text {
@@ -36,7 +36,6 @@
 		font-size: 3rem;
 		letter-spacing: 0.2;
 		font-weight: 600;
-		// text-shadow: 3px 3px 3px #000;
 		margin-bottom: 3%;
     }
 
@@ -66,7 +65,6 @@
 	&__picture {
 		width: 100%;
 		height: 400px;
-
 		overflow: hidden;
 		border: 1px solid $color-mint;
 		margin-bottom: 2rem;
@@ -77,7 +75,6 @@
 		border-radius: 3px;
 		display: block;
 		border: none;
-
 		color: $color-white;
 		background-color: $color-mint;
 		cursor: pointer;
@@ -89,13 +86,14 @@
 		&:focus {
 			outline: none;
 		}
+
 		&:hover {
 			background-color: $color-blue;
 			color: $color-white;
-
 			outline: none;
 			transform: translateY(-1px);
 			box-shadow: 0 1rem 2rem rgba(0, 0, 0, 0.2);
+
 			&:after {
 				transform: scaleX(1.4) scaleY(1.6);
 				opacity: 0;

+ 2 - 17
src/components/eventForm/eventReduxForm.js

@@ -9,41 +9,26 @@ import { eventFormValidation } from "../../utils/eventFormValidation";
 const EventReduxForm = ({
     handleSubmit,
     postNewEvent,
-    // resetInitValue,
     showConfirmationMessage,
     reset,
     eventTypes,
     initialValues,
-    // eventFormInitialValue,
     editFormFlag,
     changeEvent
 }) => {
 
     const submit = value => {
-        console.log('submit values', value)
 		if (!editFormFlag) {
             postNewEvent(value)
-            reset();
-            showConfirmationMessage();
 		} else {
             changeEvent(value);
-            reset();
-            showConfirmationMessage();
 		}
-		reset();
+        reset();
+        showConfirmationMessage();
     };
-    
-    console.log('initialValues',initialValues);
-
-    
-	// const resetForm = () => {
-	// 	reset();
-	// 	resetInitValue();
-	// };
 
     return (
         <form className="event-form__event-form__main" onSubmit={handleSubmit(submit)}>
-            {console.log('eventFormInitialValue', initialValues)}
 
             <img className="event-form__picture" alt="Event Bunner" src={initialValues.mainBannerPicture} />
             <Field name="mainBannerPicture" className="input-box -wide"  label="Main Banner Picture" component={customInput} />

+ 1 - 1
src/components/filtersEvents/FiltersEvents.js

@@ -9,7 +9,7 @@ let FiltersEvents = props => {
     const { handleSubmit, getRequest, eventTypes, labelType } = props;
 
     const submit = value => {
-        console.log(value);
+        //console.log(value);
         getRequest(value.eventType);
     };
 

+ 27 - 35
src/conteiners/adminAddEventPage/adminAddEventPage.js

@@ -4,66 +4,58 @@ import * as actions from "../../actions/adminMainPageActions";
 import AdminHeader from "../../components/adminHeader/adminHeader";
 import Form from "../../components/eventForm/eventReduxForm";
 import ConfirmationMessage from "../../components/confirmationMessage/confirmationMessage";
-// import eventFormInitialValue from "../../state/addEventInitialValue"
 
 class AdminAddEventPage extends Component {
-    state = { 
+    state = {
         confirmationMessageFlag: false
-     };
+    };
 
     componentDidMount() {
-	    this.props.getEvents();
+        this.props.getEvents();
     }
-    
-    // resetInitValue = () => this.setState({ eventFormInitialValue: {} });
 
     showConfirmationMessage = () => {
-        this.setState({confirmationMessageFlag: true })
-        document.location.reload(true);
+        this.setState({ confirmationMessageFlag: true })
     };
+
     closeConfirmationMessage = () => {
-        this.setState({confirmationMessageFlag: false })
+        this.setState({ confirmationMessageFlag: false })
     };
 
     render() {
         const {
             postNewEvent,
             changeEvent,
-            // removeEvent,
             eventFormInitialValue,
             eventTypes,
             editFormFlag
         } = this.props
-        console.log('eventFormInitialValue',eventFormInitialValue);
-
 
-		return (
+        return (
             <>
-            <AdminHeader/>
-            <div className="event-form">
-                <div className="event-form__content">
-                    <h2 className="event-form__form-title">{editFormFlag ? 'CHANGE EVENT' : 'ADD NEW EVENT'}</h2>
-        
-                    <Form 
-                        postNewEvent = {postNewEvent}
-                        changeEvent = {changeEvent}
-                        // removeEvent = {removeEvent}
-                        // resetInitValue = {this.resetInitValue}
-                        showConfirmationMessage = {this.showConfirmationMessage}
-                        initialValues = {eventFormInitialValue}
-                        eventTypes = {eventTypes}
-                        editFormFlag = {editFormFlag}
-                    />
+                <AdminHeader />
+                <div className="event-form">
+                    <div className="event-form__content">
+                        <h2 className="event-form__form-title">{editFormFlag ? 'CHANGE EVENT' : 'ADD NEW EVENT'}</h2>
+
+                        <Form
+                            postNewEvent={postNewEvent}
+                            changeEvent={changeEvent}
+                            showConfirmationMessage={this.showConfirmationMessage}
+                            initialValues={eventFormInitialValue}
+                            eventTypes={eventTypes}
+                            editFormFlag={editFormFlag}
+                        />
+                    </div>
                 </div>
-            </div>
 
-            {this.state.confirmationMessageFlag && 
-                <ConfirmationMessage closeMessage = {this.closeConfirmationMessage}>
-                    <div className = "text">{editFormFlag ? `Event has been changed.` : `New event has beed added.`}</div>
-                </ConfirmationMessage >}
+                {this.state.confirmationMessageFlag &&
+                    <ConfirmationMessage closeMessage={this.closeConfirmationMessage}>
+                        <div className="text">{editFormFlag ? `Event has been changed.` : `New event has beed added.`}</div>
+                    </ConfirmationMessage >}
             </>
-		);
-	}
+        );
+    }
 }
 
 const mapStateToProps = state => ({

+ 2 - 10
src/conteiners/adminMainPage/adminMainPage.js

@@ -3,30 +3,22 @@ import { connect } from "react-redux";
 import "./adminMainPage.scss";
 import Header from '../../components/adminHeader/adminHeader';
 import AdminMenu from '../../components/adminMenu/adminMenu';
-// import Footer from '../../components/footer/Footer';
 
 class AdminMainPage extends Component {
-  
-  render() {
-    // const {
 
-    // } = this.props;
+  render() {
 
     return (
       <div className="admin-main-page-wrapper">
         <Header />
         <AdminMenu />
-        {/* <Footer /> */}
       </div>
     )
   }
 }
 
-
 const mapStateToProps = state => ({
 
 });
 
-export default connect(
-  mapStateToProps
-)(AdminMainPage);
+export default connect(mapStateToProps)(AdminMainPage);

+ 0 - 1
src/conteiners/adminMainPage/adminMainPage.scss

@@ -1,4 +1,3 @@
-
 @import "../../styles/variables";
 
 .admin-main-page-wrapper{

+ 5 - 16
src/conteiners/adminMyEventsPage/adminMyEventsPage.js

@@ -1,8 +1,6 @@
 import React, { Component } from "react";
 import { connect } from "react-redux";
-// import { reduxForm, Field } from "redux-form";
 import "./adminMyEventsPage.scss";
-// import { Link } from "react-router-dom";
 import { Redirect } from 'react-router-dom'
 import * as actions from "../../actions/adminMainPageActions";
 import AdminHeader from "../../components/adminHeader/adminHeader";
@@ -11,9 +9,7 @@ import EventInfoShort from "../../components/eventInfoShort/EventInfoShort";
 class AdminAddEventPage extends Component {
 
     state = {
-        filteredEventList: [],
-        // confirmationMessageFlag: false,
-        // editFormFlag: false
+        filteredEventList: []
     };
 
     componentDidMount() {
@@ -23,12 +19,10 @@ class AdminAddEventPage extends Component {
     onChangeTypeHandler = e => {
         const { value } = e.target;
         this.props.getEvents(value)
-        // console.log('eventInput', value)
     };
 
     render() {
         const {
-            // postNewEvent,
             eventList,
             removeEvent,
             editEvent,
@@ -37,10 +31,6 @@ class AdminAddEventPage extends Component {
             eventTypes
         } = this.props
 
-        console.log('eventList', eventList)
-        // console.log('confirmationMessageFlag', this.state.confirmationMessageFlag)
-
-        // console.log("eventFormInitialValue", eventFormInitialValue);
         return (
             <>
                 <AdminHeader />
@@ -49,14 +39,13 @@ class AdminAddEventPage extends Component {
                         <h2 className="event-page__title">MY EVENTS</h2>
 
                         <select className="event-page__select" onChange={this.onChangeTypeHandler} label="Event Type">
-                                    {eventTypes.map(elem => <option key={elem.id} value={elem.optionName}>{elem.optionName}</option>)}
-                                </select>
+                            {eventTypes.map(elem => <option key={elem.id} value={elem.optionName}>{elem.optionName}</option>)}
+                        </select>
 
                         <div className="events-list">
 
                             {eventList && eventList.map(el =>
                                 <div className="event-page__container" key={el._id}>
-
                                     <EventInfoShort
                                         key={el._id}
                                         title={el.title}
@@ -69,14 +58,14 @@ class AdminAddEventPage extends Component {
                                     />
                                     <div className="event-page__buttons-conteiner">
                                         <button className="event-page__buttons-conteiner__button" onClick={editEvent.bind(null, el._id)} >Edit Event</button>
-                                        <button className="event-page__buttons-conteiner__button" onClick={removeEvent.bind(null,el._id)} >Delete Event</button>
+                                        <button className="event-page__buttons-conteiner__button" onClick={removeEvent.bind(null, el._id)} >Delete Event</button>
                                     </div>
 
                                 </div>
                             )}
                         </div>
 
-                        {editFormFlag && <Redirect to='/admin/add_new_event' /> }
+                        {editFormFlag && <Redirect to='/admin/add_new_event' />}
                     </div>
                 </div>
             </>

+ 3 - 4
src/conteiners/adminMyEventsPage/adminMyEventsPage.scss

@@ -4,9 +4,9 @@
 	width: 100%;
 	height: 100%;
 	margin: auto;
-	background: -webkit-linear-gradient(top, #fff, $color-blue); /* Safari 5.1, iOS 5.0-6.1, Chrome 10-25, Android 4.0-4.3 */
-	background: -moz-linear-gradient(top, #fff, $color-blue); /* Firefox 3.6-15 */
-	background: -o-linear-gradient(top,  #fff, $color-blue); /* Opera 11.1-12 */
+	background: -webkit-linear-gradient(top, #fff, $color-blue);
+	background: -moz-linear-gradient(top, #fff, $color-blue);
+	background: -o-linear-gradient(top,  #fff, $color-blue); 
 	background: linear-gradient(to bottom,  #fff, $color-blue);
 
 	&__select{
@@ -63,7 +63,6 @@
 		font-size: 3rem;
 		letter-spacing: 0.2;
 		font-weight: 600;
-		// text-shadow: 3px 3px 3px #000;
 		margin-bottom: 3%;
 	}
 

+ 15 - 22
src/conteiners/adminPhotogalaryPage/adminPhotogalaryPage.js

@@ -6,9 +6,9 @@ import PhotogalaryForm from "../../components/adminPhotogalary/adminPhotogalaryR
 import ConfirmationMessage from "../../components/confirmationMessage/confirmationMessage";
 
 class AdminAddPhotogalarytPage extends Component {
-    state = { 
+    state = {
         confirmationMessageFlag: false
-     };
+    };
 
     componentDidMount() {
         this.props.getEvents();
@@ -16,11 +16,11 @@ class AdminAddPhotogalarytPage extends Component {
     }
 
     showConfirmationMessage = () => {
-        this.setState({confirmationMessageFlag: true })
-        document.location.reload(true);
+        this.setState({ confirmationMessageFlag: true })
     };
+
     closeConfirmationMessage = () => {
-        this.setState({confirmationMessageFlag: false })
+        this.setState({ confirmationMessageFlag: false })
     };
 
     render() {
@@ -30,37 +30,31 @@ class AdminAddPhotogalarytPage extends Component {
             postPhotogalary,
         } = this.props
 
-        // console.log('page props', this.props)
-        // console.log('eventList', eventList)
-        // console.log('gallery', this.props.gallery)
-
-		// console.log("eventTypes", this.state.eventTypes );
-		return (
+        return (
             <>
                 <AdminHeader />
                 <div className="photogalary-form">
                     <div className="photogalary-form__content">
                         <h2 className="photogalary-form__form-title">ADD PHOTOGALARY</h2>
-                        <PhotogalaryForm 
-                            eventTypes={eventTypes} 
-                            eventList={eventList} 
-                            submitHandler = {postPhotogalary}
+                        <PhotogalaryForm
+                            eventTypes={eventTypes}
+                            eventList={eventList}
+                            submitHandler={postPhotogalary}
                         />
                     </div>
-                    {this.state.confirmationMessageFlag && 
-                        <ConfirmationMessage closeMessage = {this.closeConfirmationMessage}>
-                            <div className = "text">Photogalary has beed added.</div>
+                    {this.state.confirmationMessageFlag &&
+                        <ConfirmationMessage closeMessage={this.closeConfirmationMessage}>
+                            <div className="text">Photogalary has beed added.</div>
                         </ConfirmationMessage >}
                 </div>
             </>
-		);
-	}
+        );
+    }
 }
 
 const mapStateToProps = state => ({
     eventList: state.adminMainPageReducer.eventList,
     eventTypes: state.adminMainPageReducer.eventTypes,
-    // eventFormInitialValue: state.adminMainPageReducer.eventFormInitialValue,
     addPhotogalaryInitialValue: state.photogalaryReducer.addPhotogalaryInitialValue,
     gallery: state.photogalaryReducer.gallery
 });
@@ -68,5 +62,4 @@ const mapStateToProps = state => ({
 export default connect(
     mapStateToProps,
     actions
-    // {getEvents, photogalaryOnchange}
 )(AdminAddPhotogalarytPage);

+ 24 - 24
src/conteiners/adminResultsPage/adminResultsPage.js

@@ -1,7 +1,7 @@
 import React, { Component } from "react";
 import { connect } from "react-redux";
-import {getEvents, getEventByTitle} from "../../actions/adminMainPageActions";
-import {getRegistredUsers, resultsPromiseAll} from "../../actions/adminResultsActions";
+import { getEvents, getEventByTitle } from "../../actions/adminMainPageActions";
+import { getRegistredUsers, resultsPromiseAll } from "../../actions/adminResultsActions";
 import AdminHeader from "../../components/adminHeader/adminHeader";
 import ResultsForm from "../../components/adminResults/adminResultsForm";
 import ConfirmationMessage from "../../components/confirmationMessage/confirmationMessage";
@@ -9,15 +9,16 @@ import ConfirmationMessage from "../../components/confirmationMessage/confirmati
 class AdminResultstPage extends Component {
     state = {
         confirmationMessageFlag: false
-     };
+    };
 
-     componentDidMount() {
+    componentDidMount() {
         this.props.getEvents();
     }
 
     showConfirmationMessage = () => {
-        this.setState({confirmationMessageFlag: true })
+        this.setState({ confirmationMessageFlag: true })
     };
+
     closeConfirmationMessage = () => {
         this.setState({ confirmationMessageFlag: false })
     };
@@ -25,11 +26,11 @@ class AdminResultstPage extends Component {
     submitHandler = values => {
         const results = Object.keys(values).slice(2)
             .map(elem => elem = {
-                eventUser: elem, 
-                event: this.props.eventusers.find( user => user._id === elem).event[0],
+                eventUser: elem,
+                event: this.props.eventusers.find(user => user._id === elem).event[0],
                 time: values[elem]
             })
-       
+
         this.props.resultsPromiseAll(results)
         this.showConfirmationMessage()
     }
@@ -41,9 +42,8 @@ class AdminResultstPage extends Component {
 
     onChangeTitleHandler = e => {
         const { value } = e.target;
-        this.props.getEventByTitle(value).then((res) => {
-            this.props.getRegistredUsers(res.payload.data.events[0]._id)
-        })
+        const eventId = this.props.eventList.find(elem => elem.title === value)._id
+        this.props.getRegistredUsers(eventId)
     };
 
     render() {
@@ -53,31 +53,31 @@ class AdminResultstPage extends Component {
             eventusers,
         } = this.props
 
-		return (
+        return (
             <>
                 <AdminHeader />
                 <div className="results-form">
                     <div className="results-form__content">
                         <h2 className="results-form__form-title">RESULTS</h2>
-                        <ResultsForm 
+                        <ResultsForm
                             eventTypes={eventTypes}
                             eventList={eventList}
-                            submitHandler = {this.submitHandler}
-                            onChangeInputTimeHandler = {this.onChangeInputTimeHandler}
+                            submitHandler={this.submitHandler}
+                            onChangeInputTimeHandler={this.onChangeInputTimeHandler}
                             eventusers={eventusers}
-                            onChangeTypeHandler = {this.onChangeTypeHandler}
-                            onChangeTitleHandler = {this.onChangeTitleHandler}
+                            onChangeTypeHandler={this.onChangeTypeHandler}
+                            onChangeTitleHandler={this.onChangeTitleHandler}
                         />
                     </div>
-                    
-                    {this.state.confirmationMessageFlag && 
-                        <ConfirmationMessage closeMessage = {this.closeConfirmationMessage}>
-                            <div className = "text">Results have beed added.</div>
+
+                    {this.state.confirmationMessageFlag &&
+                        <ConfirmationMessage closeMessage={this.closeConfirmationMessage}>
+                            <div className="text">Results have beed added.</div>
                         </ConfirmationMessage >}
                 </div>
             </>
-		);
-	}
+        );
+    }
 }
 
 const mapStateToProps = state => ({
@@ -90,5 +90,5 @@ const mapStateToProps = state => ({
 
 export default connect(
     mapStateToProps,
-    {getEvents, getEventByTitle, getRegistredUsers, resultsPromiseAll}
+    { getEvents, getEventByTitle, getRegistredUsers, resultsPromiseAll }
 )(AdminResultstPage);

+ 18 - 16
src/conteiners/result/Result.js

@@ -2,19 +2,22 @@ import React from 'react';
 import { connect } from "react-redux";
 
 import { getResults } from "../../actions/getResults";
+import { getAllEvents } from "../../actions/getAllEvents";
 
 import './result.scss';
 
 import Sidebar from '../../components/sidebar/Sidebar';
 import Footer from '../../components/footer/Footer';
+import FiltersReviews from '../../components/filtersReviews/filtersReviews';
 
 export class Result extends React.Component {
     componentDidMount() {
         this.props.getResults();
+        this.props.getAllEvents();
     }
     render() {
-        const {marathone, halfMarathone} = this.props;
-        console.log('result page',marathone);
+        const {marathone, halfMarathone, getResults, eventsArr} = this.props;
+        //console.log('result page',marathone);
         return (
             <>
                 <Sidebar/>
@@ -25,6 +28,11 @@ export class Result extends React.Component {
                 </div>
 
                 <div className="container-wrap">
+                    <div className="events-filters">
+                        <h4>Events filter</h4>
+                        <FiltersReviews labelType="Event Title" getRequest={getResults} eventTypes={eventsArr} />
+                    </div>
+
                     <div className="results-wrap">
                         <div className="profile-tabs-wrap">
                             <div className="tabs-main">
@@ -36,30 +44,26 @@ export class Result extends React.Component {
 
                                 <div className="tab-item" id="content1">
                                     <div className="history">
-                                        {/* имя, название ивента, тип ивента, время, пол, место */}
-                                        {/* фильтрация по тайтлу ивента,по типу ивента */}
                                         <table>
                                             <thead>
                                                     <tr>
                                                         <th>User name</th>
                                                         <th>Event</th>
                                                         <th>Event type</th>
-                                                        {/*<th>Distance</th>*/}
-                                                        {/*<th>rating</th>*/}
                                                         <th>Time</th>
                                                         <th>User sex</th>
                                                     </tr>
                                             </thead>
                                             <tbody>
                                                 {
-                                                    marathone.map(result =><tr key={result._id}>
+                                                    marathone.length !== 0 ? marathone.map(result =><tr key={result._id}>
                                                             <td>{result.eventUser.name}</td>
                                                             <td>{result.event.title}</td>
                                                             <td>{result.event.eventType}</td>
                                                             <td>{result.time}</td>
                                                             <td><i className={`fa fa-${result.eventUser.sex === 'female' ? 'female' : 'male'}`} aria-hidden="true"></i></td>
                                                         </tr>
-                                                    )
+                                                    ) : <tr><td colSpan="5"><p className="not-found">Not found results</p></td></tr>
                                                 }
                                             </tbody>
                                         </table>
@@ -68,30 +72,26 @@ export class Result extends React.Component {
 
                                 <div className="tab-item" id="content2">
                                     <div className="history">
-                                        {/* имя, название ивента, тип ивента, время, пол, место */}
-                                        {/* фильтрация по тайтлу ивента,по типу ивента */}
                                         <table>
                                             <thead>
                                                     <tr>
                                                         <th>User name</th>
                                                         <th>Event</th>
                                                         <th>Event type</th>
-                                                        {/*<th>Distance</th>*/}
-                                                        {/*<th>rating</th>*/}
                                                         <th>Time</th>
                                                         <th>User sex</th>
                                                     </tr>
                                             </thead>
                                             <tbody>
                                                 {
-                                                    halfMarathone.map(result =><tr key={result._id}>
+                                                    halfMarathone.length !== 0 ? halfMarathone.map(result =><tr key={result._id}>
                                                             <td>{result.eventUser.name}</td>
                                                             <td>{result.event.title}</td>
                                                             <td>{result.event.eventType}</td>
                                                             <td>{result.time}</td>
                                                             <td><i className={`fa fa-${result.eventUser.sex === 'female' ? 'female' : 'male'}`} aria-hidden="true"></i></td>
                                                         </tr>
-                                                    )
+                                                    ) : <tr><td colSpan="5"><p className="not-found">Not found results</p></td></tr>
                                                 }
                                             </tbody>
                                         </table>
@@ -111,11 +111,13 @@ const mapStateToProps = state => {
     return {
         results: state.results.results,
         marathone: state.results.marathoneResults,
-        halfMarathone: state.results.halfMarathoneResults
+        halfMarathone: state.results.halfMarathoneResults,
+        events: state.getEvents.events,
+        eventsArr: state.getEvents.eventsArrShort
     };
 };
 
 export default connect(
     mapStateToProps,
-    { getResults }
+    { getResults, getAllEvents }
 )(Result);

+ 3 - 6
src/conteiners/reviews/Reviews.js

@@ -18,11 +18,7 @@ export class Reviews extends React.Component {
     }
 
     render() {
-        const { postReviewSubmit, events, reviews, getAllReviews } = this.props;
-        const eventsArr = events.map(event => ({
-            title: event.title,
-            id: event._id
-        }));
+        const { postReviewSubmit, reviews, getAllReviews, eventsArr } = this.props;
         
         return (
             <>
@@ -69,7 +65,8 @@ export class Reviews extends React.Component {
 const mapStateToProps = state => {
     return {
         reviews: state.allReviews.reviews,
-        events: state.getEvents.events
+        events: state.getEvents.events,
+        eventsArr: state.getEvents.eventsArrShort
     };
 };
 

+ 1 - 5
src/index.js

@@ -3,15 +3,11 @@ import ReactDOM from 'react-dom';
 import { BrowserRouter } from "react-router-dom";
 import { Provider } from "react-redux";
 import { createBrowserHistory } from 'history';
-
 import * as serviceWorker from './serviceWorker';
 import './index.scss';
-
 import Router from './router';
-
 import { store } from "./store.js";
 
-
 const history = createBrowserHistory();
 
 ReactDOM.render(
@@ -19,7 +15,7 @@ ReactDOM.render(
         <BrowserRouter>
             <Router history={history} />
         </BrowserRouter>
-    </Provider>, 
+    </Provider>,
     document.getElementById('root')
 );
 

+ 1 - 2
src/private-router.js

@@ -7,9 +7,8 @@ export const PrivateRoute = ({ component: Component, protectedRoute, ...rest })
 		render={props => {
 			if (protectedRoute) {
 				const user = localStorage.getItem("user");
-				//console.log('user')
+
 				if (!user) {
-					//console.log('user')
 					return <Redirect to="/" />;
 				}
 

+ 4 - 5
src/reducers/adminMainPageReducer.js

@@ -4,11 +4,10 @@ import initialState from "../state/addEventInitialValue";
 
 export default (state = initialState, action) => {
 
-    switch (action.type) {
+	switch (action.type) {
 
 		case types.EDIT_EVENT: {
 			const eventFormInitialValue = state.eventList.find(el => el._id === action.payload);
-			console.log(eventFormInitialValue)
 			return {
 				...state,
 				eventFormInitialValue: eventFormInitialValue,
@@ -87,7 +86,7 @@ export default (state = initialState, action) => {
 			return state;
 		}
 
-        default:
-			return state; 
-    }
+		default:
+			return state;
+	}
 }

+ 7 - 9
src/reducers/adminResultsReduser.js

@@ -3,7 +3,7 @@ import initialState from "../state/addEventInitialValue";
 
 export default (state = initialState, action) => {
 
-    switch (action.type) {
+	switch (action.type) {
 
 		//GET REGISTRED USERS
 		case types.GET_REGISTRED_USERS: {
@@ -11,9 +11,7 @@ export default (state = initialState, action) => {
 		}
 		case types.GET_REGISTRED_USERS_SUCCESS: {
 			const { data } = action.payload;
-            const eventusers = data.eventusers
-            // console.log('state', state)
-            // console.log('result reduser users', eventusers)
+			const eventusers = data.eventusers
 			return { ...state, eventusers };
 		}
 		case types.GET_EVENTS_REQUEST_FAIL: {
@@ -24,8 +22,8 @@ export default (state = initialState, action) => {
 		case types.POST_RESULTS_REQUEST_SUCCESS: {
 			console.log('reducer results success', action.payload)
 			return {
-			...state,
-			addEventMessage: "Results have been added"
+				...state,
+				addEventMessage: "Results have been added"
 			}
 		}
 		case types.POST_RESULTS_REQUEST_FAIL: {
@@ -33,7 +31,7 @@ export default (state = initialState, action) => {
 			return { ...state, error: action.payload }
 		}
 
-        default:
-			return state; 
-    }
+		default:
+			return state;
+	}
 }

+ 11 - 2
src/reducers/getAllEvents.js

@@ -1,7 +1,8 @@
 import * as types from "../actionTypes/actionTypes";
 
 const initialState = {
-    events: []
+    events: [],
+    eventsArrShort: []
 }
 
 export default (state = initialState, action) => {
@@ -12,9 +13,17 @@ export default (state = initialState, action) => {
 
         case types.GET_REQUEST_SUCCESS_EVENTS: {
             //console.log('events',action.payload.events);
+            
+            const allEvents = action.payload.events;
+            const eventsArr = allEvents.map(event => ({
+                title: event.title,
+                id: event._id
+            }));
+
             return {
                 ...state,
-                events: action.payload.events
+                events: allEvents,
+                eventsArrShort: eventsArr
             };
         }
 

+ 14 - 33
src/reducers/photogalaryReducer.js

@@ -3,9 +3,9 @@ import initialState from "../state/addEventInitialValue";
 
 export default (state = initialState, action) => {
 
-    switch (action.type) {
-        
-        // GET ALL EVENTS
+	switch (action.type) {
+
+		// GET ALL EVENTS
 		case types.GET_EVENTS_REQUEST: {
 			return state;
 		}
@@ -16,23 +16,20 @@ export default (state = initialState, action) => {
 		}
 		case types.GET_EVENTS_REQUEST_FAIL: {
 			return state;
-        }
+		}
 
-        // GET PHOTOGAARY
+		// GET PHOTOGALARY
 		case types.GET_PHOTOGALARY_REQUEST: {
 			return state;
 		}
 		case types.GET_PHOTOGALARY_REQUEST_SUCCESS: {
-            console.log('GET_PHOTOGALARY reducer data', action.payload.data.gallery)
-			//const { data } = action.payload;
-			//const gallery = data.data.gallery;
-            return { ...state, gallery: action.payload.data.gallery  };
+			return { ...state, gallery: action.payload.data.gallery };
 		}
 		case types.GET_PHOTOGALARY_REQUEST_FAIL: {
 			return state;
-        }
-        
-        //POST PHOTOGAARY
+		}
+
+		//POST PHOTOGALARY
 		case types.POST_PHOTOGALARY_REQUEST_SUCCESS: {
 			console.log('reducer post photogalary success', action.payload)
 			return state
@@ -42,34 +39,18 @@ export default (state = initialState, action) => {
 			return { ...state, error: action.payload }
 		}
 
-		//PUT PHOTOGAARY
+		//PUT PHOTOGALARY
 		case types.PUT_PHOTOGALARY_REQUEST_SUCCESS: {
 			console.log('reducer PUT photogalary success', action.payload)
 			return state
-			
+
 		}
 		case types.PUT_PHOTOGALARY_REQUEST_FAIL: {
 			console.log('reducer PUT photogalary fail', action.payload)
 			return { ...state, error: action.payload }
 		}
 
-		// // REMOVE
-		// case types.REMOVE_EVENT_REQUEST: {
-		// 	return state;
-		// }
-		// case types.REMOVE_EVENT_REQUEST_SUCCESS: {
-		// 	const { _id } = action.payload;
-		// 	return {
-		// 		...state,
-		// 		eventList: state.eventList.filter(el => el._id !== _id)
-		// 	};
-		// }
-
-		// case types.REMOVE_EVENT_REQUEST_FAIL: {
-		// 	return state;
-		// }
-
-        default:
-			return state; 
-    }
+		default:
+			return state;
+	}
 }

+ 44 - 46
src/router.js

@@ -1,6 +1,7 @@
-import React, {useEffect } from "react";
+import React, { useEffect } from "react";
 import { Switch, withRouter } from "react-router-dom";
 import { connect } from "react-redux";
+import { PrivateRoute } from "./private-router";
 
 import AdminMainPage from './conteiners/adminMainPage/adminMainPage';
 import AdminAddEventPage from './conteiners/adminAddEventPage/adminAddEventPage';
@@ -16,11 +17,8 @@ import Login from './conteiners/login/Login';
 import RegistrationPage from './conteiners/registrationPage/RegistrationPage';
 import Events from './conteiners/events/Events';
 import EventCard from './conteiners/eventCard/EventCard';
-
 import Profile from './conteiners/profile/Profile';
 
-import { PrivateRoute } from "./private-router";
-
 const PAGENOTFOUND = () => <div>PAGE 404 NOT FOUND</div>;
 
 const route = [
@@ -37,14 +35,14 @@ const route = [
 		path: "/events",
 		protected: false,
 		component: Events
-    },
-    {
-        id: 3,
-        exact: true,
-        path: "/events/:id",
-        protected: false,
-        component: EventCard
-    },
+	},
+	{
+		id: 3,
+		exact: true,
+		path: "/events/:id",
+		protected: false,
+		component: EventCard
+	},
 	{
 		id: 4,
 		exact: true,
@@ -58,74 +56,74 @@ const route = [
 		path: "/gallery",
 		protected: false,
 		component: Gallery
-    },
-    {
+	},
+	{
 		id: 6,
 		exact: true,
 		path: "/reviews",
 		protected: false,
 		component: Reviews
-    },
-    {
+	},
+	{
 		id: 7,
 		exact: true,
 		path: "/login",
 		protected: false,
 		component: Login
-    },
-    {
+	},
+	{
 		id: 8,
 		exact: true,
 		path: "/registration",
 		protected: false,
 		component: RegistrationPage
-    },
-    {
+	},
+	{
 		id: 9,
 		exact: true,
 		path: "/profile",
-        protected: true,
-        hasAccess: 'user',
+		protected: true,
+		hasAccess: 'user',
 		component: Profile
-    },
-    {
+	},
+	{
 		id: 10,
 		exact: true,
 		path: "/admin",
-        protected: true,
-        hasAccess: 'admin',
+		protected: true,
+		hasAccess: 'admin',
 		component: AdminMainPage
-    },
-    {
+	},
+	{
 		id: 11,
 		exact: true,
 		path: "/admin/add_new_event",
-        protected: true,
-        hasAccess: 'admin',
+		protected: true,
+		hasAccess: 'admin',
 		component: AdminAddEventPage
-    },
-    {
+	},
+	{
 		id: 12,
 		exact: true,
 		path: "/admin/photogalary",
-        protected: true,
-        hasAccess: 'admin',
+		protected: true,
+		hasAccess: 'admin',
 		component: AdminAddPhotogalarytPage
-    },
-    {
+	},
+	{
 		id: 13,
 		exact: true,
 		path: "/admin/results",
-        protected: true,
-        hasAccess: 'admin',
+		protected: true,
+		hasAccess: 'admin',
 		component: AdminResultsPage
 	},
 	{
 		id: 14,
 		exact: true,
 		path: "/admin/my_events",
-        protected: true,
-        hasAccess: 'admin',
+		protected: true,
+		hasAccess: 'admin',
 		component: AdminMyEventsPage
 	},
 	{
@@ -144,8 +142,8 @@ const Router = withRouter(({ history, user }) => {
 			if (userRole === 'admin') {
 				history.push("/admin");
 			}
-			
-            if (userRole === 'user') {
+
+			if (userRole === 'user') {
 				history.push("/profile");
 			}
 		}
@@ -160,18 +158,18 @@ const Router = withRouter(({ history, user }) => {
 						key={el.id}
 						exact={el.exact}
 						path={el.path}
-                        component={el.component}
+						component={el.component}
 					/>
-                ))}
+				))}
 			</Switch>
 		</div>
 	);
 });
 
 const mapStateToProps = state => {
-    return {
+	return {
 		user: state.login.user
-    };
+	};
 };
 
 export default connect(

+ 32 - 90
src/state/addEventInitialValue.js

@@ -1,94 +1,36 @@
-export default{
+export default {
 
-eventFormInitialValue: {
-    mainBannerPicture: "https://tokyo2020.org/assets/img/pages/news/20180802-01-photo-main.jpg",
-    title: "",
-    eventType: "",
-    eventDate: "",
-    country: "",
-    city: "",
-    overview: "",
-    contentPicture: "",
-    contentVideo: "",
-    marathoneDistancePrice: "",
-    halfmarathoneDistancePrice: "",
-    ageLimit: "",
-    awardMedals: "",
-    maximumTime: "",
-    aidStations: "",
-    equipmentStorage: "",
-    parking: "",
-    refreshments: "",
-    map: "",
-    addEventMessage: null
-},
+    eventFormInitialValue: {
+        mainBannerPicture: "https://tokyo2020.org/assets/img/pages/news/20180802-01-photo-main.jpg",
+        title: "",
+        eventType: "",
+        eventDate: "",
+        country: "",
+        city: "",
+        overview: "",
+        contentPicture: "",
+        contentVideo: "",
+        marathoneDistancePrice: "",
+        halfmarathoneDistancePrice: "",
+        ageLimit: "",
+        awardMedals: "",
+        maximumTime: "",
+        aidStations: "",
+        equipmentStorage: "",
+        parking: "",
+        refreshments: "",
+        map: "",
+        addEventMessage: null
+    },
 
-eventList: [],
-editFormFlag: false,
-gallery: [],
-// eventusers: [],
+    eventList: [],
+    editFormFlag: false,
+    gallery: [],
 
-eventTypes: [
-    { optionName: 'Select Event Type', id: 1 },
-    { optionName: 'Triathlon', id: 2 },
-    { optionName: 'Marathon', id: 3 },
-    { optionName: 'Cycling', id: 4 }
-],
-
-// addPhotogalaryInitialValue: {
-//     eventType: "",
-//     eventTitle: "",
-//     pictures: [
-//         {
-//             id: '1',
-//             name: `picture_1}`,
-//             value: ""
-//         },
-//         {
-//             id: '2',
-//             name: `picture_2`,
-//             value: ""
-//         },
-//         {
-//             id: '3',
-//             name: `picture_3`,
-//             value: ""
-//         },
-//         {
-//             id: '4',
-//             name: `picture_4`,
-//             value: ""
-//         },
-//         {
-//             id: '5',
-//             name: `picture_5`,
-//             value: ""
-//         },
-//         {
-//             id: '6',
-//             name: `picture_6`,
-//             value: ""
-//         },
-//         {
-//             id: '7',
-//             name: `picture_7`,
-//             value: ""
-//         },
-//         {
-//             id: '8',
-//             name: `picture_8`,
-//             value: ""
-//         },
-//         {
-//             id: '9',
-//             name: `picture_9`,
-//             value: ""
-//         },
-//         {
-//             id: '10',
-//             name: `picture_10`,
-//             value: ""
-//         }
-//     ]
-// }
+    eventTypes: [
+        { optionName: 'Select Event Type', id: 1 },
+        { optionName: 'Triathlon', id: 2 },
+        { optionName: 'Marathon', id: 3 },
+        { optionName: 'Cycling', id: 4 }
+    ]
 }

+ 2 - 4
src/state/adminMenu.js

@@ -1,10 +1,8 @@
 export const adminMenu = [
-	// { path: "/admin", id: 0, text: "Main Page", logout: false },
 	{ path: "/admin/add_new_event", id: 1, text: "Add New Event", logout: false },
 	{ path: "/admin/my_events", id: 2, text: "My Events", logout: false },
     { path: "/admin/photogalary", id: 3, text: "Add Photogalery", logout: false },
 	{ path: "/admin/results", id: 4, text: "Add Results", logout: false },
-	// { path: "/admin/feedbacks", id: 5, text: "Feedbacks", logout: false },
-	{ path: "/", id: 6, text: "Go to WebSite", logout: false },
-	{ path: "/", id: 7, text: "Log out", logout: true }
+	{ path: "/", id: 5, text: "Go to WebSite", logout: false },
+	{ path: "/", id: 6, text: "Log out", logout: true }
 ];

+ 0 - 0
src/state/initialState.js


+ 4 - 0
src/styles/base.scss

@@ -115,4 +115,8 @@ button {
 	cursor: pointer;
     outline: none;
     box-shadow: none;
+}
+
+.stop-scroling {
+    overflow: hidden;
 }

+ 5 - 5
src/utils/eventFormValidation.js

@@ -2,23 +2,23 @@ export const eventFormValidation = values => {
 	const errors = {};
 
 	if (!values.title) {
-		errors.title = "Required";
+		errors.title = "Required field";
 	}
 
 	if (!values.eventType) {
-		errors.eventType = "Required";
+		errors.eventType = "Required field";
 	}
 
 	if (!values.country) {
-		errors.country = "Required";
+		errors.country = "Required field";
     }
     
     if (!values.city) {
-		errors.city = "Required";
+		errors.city = "Required field";
     }
     
     if (!values.eventDate) {
-		errors.eventDate = "Required";
+		errors.eventDate = "Required field";
 	}
 
 	return errors;