70 Commits 674b2a8891 ... 1da04aab14

Autor SHA1 Mensagem Data
  vit9 1da04aab14 correct 5 anos atrás
  vit9 5d466105ca lastC 5 anos atrás
  vit9 fa9fe5c60d LastTop 5 anos atrás
  Vlad 379eb5fbac roza 5 anos atrás
  vit9 d8ba5e99c0 lastMerge 5 anos atrás
  vit9 06839b36ab lastPart 5 anos atrás
  Vlad 724909a91d devLa 5 anos atrás
  vit9 ee935f95e4 all 5 anos atrás
  Vlad 7b493623fe Vlad1 5 anos atrás
  vit9 1632b2cf17 l 5 anos atrás
  vit9 e7972b07d6 Merge branch 'Alesha1' into dev 5 anos atrás
  vit9 a75d07fe91 addNewFile 5 anos atrás
  vit9 4285bf9ac4 m 5 anos atrás
  vit9 e5d77ba46b vit9 5 anos atrás
  Vlad 9b12d7c227 vlad 5 anos atrás
  vit9 73ee9195b3 0602 5 anos atrás
  vit9 cb73e3ff33 fileImg 5 anos atrás
  Vlad e560863fe0 inputFile 5 anos atrás
  Vlad 3467c4eafd scss 5 anos atrás
  Vlad 07ebe9a2e3 Merge branch 'dev' into Babich 5 anos atrás
  Vlad fbfb850904 merDev 5 anos atrás
  vit9 9651ba0255 fixPrivateR 5 anos atrás
  vit9 9ca4c965ea privateRouting 5 anos atrás
  Vlad 0646caf8f4 catStafInfo 5 anos atrás
  Vlad 328cf8f888 form 5 anos atrás
  Vlad acfcb2028e error1 5 anos atrás
  vit9 00f32c7d8b mergefix2 5 anos atrás
  vit9 7553b5d340 mergefix1 5 anos atrás
  vit9 dc227bbfd8 mergefix 5 anos atrás
  Vlad 442eff56c2 fix2 5 anos atrás
  Vlad 81e41e87d4 leftMenu 5 anos atrás
  vit9 d6345cf63b fix 5 anos atrás
  Alex b0819b0eea 'error' 5 anos atrás
  vit9 2a1d1b5e14 fix 5 anos atrás
  Alex 7914a15d7b added auth validation 5 anos atrás
  Alex 0fd2a741e9 added auth validation 5 anos atrás
  Vlad cfb3ea346f leftEroor 5 anos atrás
  vit9 63bf9b7f85 remote 5 anos atrás
  vit9 5f06ec4c6e fix 5 anos atrás
  vit9 a1239597ba auth 5 anos atrás
  vit9 d07445e2f2 router 5 anos atrás
  vit9 c0ccd2b16a merge 5 anos atrás
  vit9 2fc902ee02 correcterror 5 anos atrás
  vit9 d5490cf5ce scss 5 anos atrás
  Vlad c2ee943f2f add-material1 5 anos atrás
  Vlad 0feb222d9d add-material 5 anos atrás
  vit9 c6e224c62c serverRequest 5 anos atrás
  vit9 a88c5bf7d6 problemSolving 5 anos atrás
  vit9 d735ece427 addStaff 5 anos atrás
  Vlad 1d292a7996 leftmenu scss 5 anos atrás
  Alex a149e26a04 athuorisation added back 5 anos atrás
  Alex 83742cbd27 authorisation 5 anos atrás
  Alex ab52cd660b authorisation 5 anos atrás
  vit9 85360c3f97 delBack 5 anos atrás
  vit9 71db32692d regAndLog 5 anos atrás
  vit9 bd4340eec9 delAuth2 5 anos atrás
  vit9 5023b09a06 delAuth 5 anos atrás
  vit9 a23ae11ef3 regitsration2 5 anos atrás
  Alex ef7f8cb8a6 registration 5 anos atrás
  vit9 32eccbebd4 redux-form 5 anos atrás
  Alex f3e7d87366 auth 5 anos atrás
  vit9 f16f77eeb4 Merge branch 'Alyosha' into dev 5 anos atrás
  vit9 efa90c20c5 bd axios 5 anos atrás
  Vlad 66e667f4b7 del app.js 5 anos atrás
  Vlad 5f0d8b1728 next2 5 anos atrás
  Vlad 1428c909d6 left menu 5 anos atrás
  Vlad 9d3e8ebf06 header2 6 anos atrás
  vit9 a6e08d1d69 header1 6 anos atrás
  vit9 ea5248d7a5 header 6 anos atrás
  vit9 c5fe0be6dc next1 6 anos atrás
94 arquivos alterados com 21793 adições e 686 exclusões
  1. 4763 627
      package-lock.json
  2. 17 1
      package.json
  3. 18 37
      public/index.html
  4. 0 15
      src/App.js
  5. 34 0
      src/actions/addNewCategoryAction.js
  6. 130 0
      src/actions/addNewStaffAction.js
  7. 39 0
      src/actions/categoryAction.js
  8. 35 0
      src/actions/getStaffByCategoryIdAction.js
  9. 35 0
      src/actions/getStaffByIdAction.js
  10. 41 0
      src/actions/getUserById.js
  11. 41 0
      src/actions/searchStaffAction.js
  12. 33 0
      src/actions/searchStaffByIdAction.js
  13. 39 0
      src/actions/staffsAction.js
  14. 38 0
      src/actions/usersAuthActions.js
  15. 38 0
      src/actions/usersRegistrActions.js
  16. 11 0
      src/common/authRenderField.js
  17. 11 0
      src/common/regRenderField.js
  18. 76 0
      src/components/AllStaffs/FullInfoAboutStaff.js
  19. 94 0
      src/components/AllStaffs/index.js
  20. 23 0
      src/components/Auth/authButtons.js
  21. 55 0
      src/components/Auth/authorisation.js
  22. 95 0
      src/components/Auth/registration.js
  23. 19 0
      src/components/Btn/linkHome.js
  24. 27 0
      src/components/BtnAddNewStaff/index.js
  25. 54 0
      src/components/CategoryStaffs/index.js
  26. 56 0
      src/components/FormsAdd/FormAddNewCategory/SendingCategoryForm.js
  27. 40 0
      src/components/FormsAdd/FormAddNewCategory/index.js
  28. 175 0
      src/components/FormsAdd/FormAddNewStaff/SendingStaffForm.js
  29. 46 0
      src/components/FormsAdd/FormAddNewStaff/index.js
  30. 203 0
      src/components/FormsAdd/redForm/index.js
  31. 48 0
      src/components/Header/Myprofile.js
  32. 15 0
      src/components/Header/logo.js
  33. 35 0
      src/components/Header/searchLine.js
  34. 33 0
      src/components/LeftMenu/DrawCategory.js
  35. 40 0
      src/components/LeftMenu/PodCategory.js
  36. 64 0
      src/components/LeftMenu/index.js
  37. 15 0
      src/components/Modal/addNewStaffModal.js
  38. 15 0
      src/components/Modal/index.js
  39. 66 0
      src/components/SearchStaffsPage/SearchFullInfoStaff.js
  40. 47 0
      src/components/SearchStaffsPage/index.js
  41. 29 0
      src/components/privateRouterComponents/addCategoryIfAdmin.js
  42. 20 0
      src/components/usersProtectPage/PrivateRoute.js
  43. 16 0
      src/components/usersProtectPage/index.js
  44. 84 0
      src/constants/actionTypes.js
  45. 52 0
      src/container/AddNewCategory.js
  46. 75 0
      src/container/AddNewStaff.js
  47. 71 0
      src/container/CategoryStaffInfo.js
  48. 42 0
      src/container/Header.js
  49. 47 0
      src/container/LeftMenu.js
  50. 65 0
      src/container/MainPage.js
  51. 54 0
      src/container/MainPageStaffInfo.js
  52. 61 0
      src/container/SearchStaff.js
  53. 52 0
      src/container/SearchStaffsInfo.js
  54. 79 0
      src/container/UserProfile.js
  55. 125 0
      src/container/activeStaffs.js
  56. 88 0
      src/container/redactorForm.js
  57. 50 0
      src/container/renderAuthorisation.js
  58. 44 0
      src/container/renderRegistration.js
  59. BIN
      src/img/depositphotos_80275194-stock-illustration-russian-old-fair-bazaar-vector.jpg
  60. BIN
      src/img/logoBazar — копия.png
  61. BIN
      src/img/logoBazar.jpg
  62. BIN
      src/img/logoBazar.png
  63. BIN
      src/img/no.jpg
  64. 85 0
      src/index.css
  65. 18 6
      src/index.js
  66. 43 0
      src/reducer/addCategory.js
  67. 189 0
      src/reducer/addStaff.js
  68. 49 0
      src/reducer/category.js
  69. 35 0
      src/reducer/categoryById.js
  70. 54 0
      src/reducer/getUserById.js
  71. 35 0
      src/reducer/index.js
  72. 46 0
      src/reducer/searchStaff.js
  73. 41 0
      src/reducer/searchStaffById.js
  74. 40 0
      src/reducer/staffs.js
  75. 48 0
      src/reducer/staffsById.js
  76. 54 0
      src/reducer/usersAuthorisation.js
  77. 46 0
      src/reducer/usersRegistration.js
  78. 71 0
      src/router.js
  79. 10 0
      src/state/state.js
  80. 30 0
      src/style/abstracts/variables.scss
  81. 14 0
      src/style/base/_base.scss
  82. 331 0
      src/style/components/_allStaff.scss
  83. 449 0
      src/style/components/_form.scss
  84. 209 0
      src/style/components/_formLogin.scss
  85. 131 0
      src/style/components/_header.scss
  86. 33 0
      src/style/components/_leftMenu.scss
  87. 82 0
      src/style/components/_userProfil.scss
  88. 119 0
      src/style/components/auth.scss
  89. 17 0
      src/style/index.scss
  90. 10 0
      src/style/layout/container.scss
  91. 19 0
      src/utils/authValidate.js
  92. 38 0
      src/utils/regValidate.js
  93. 15 0
      src/utils/validate.js
  94. 11714 0
      yarn.lock

Diferenças do arquivo suprimidas por serem muito extensas
+ 4763 - 627
package-lock.json


+ 17 - 1
package.json

@@ -3,9 +3,25 @@
   "version": "0.1.0",
   "private": true,
   "dependencies": {
+    "@material-ui/core": "^3.9.0",
+    "@material-ui/lab": "^3.0.0-alpha.28",
+    "antd": "^3.11.2",
+    "axios": "^0.18.0",
+    "form-data": "^2.3.3",
+    "node-sass": "^4.11.0",
     "react": "^16.6.3",
+    "react-bootstrap-slider": "^2.1.5",
     "react-dom": "^16.6.3",
-    "react-scripts": "2.1.1"
+    "react-dropzone": "^8.0.4",
+    "react-loader-spinner": "^2.3.0",
+    "react-md-spinner": "^0.3.0",
+    "react-redux": "^6.0.0",
+    "react-router-dom": "^4.3.1",
+    "react-scripts": "^2.1.3",
+    "redux": "^4.0.1",
+    "redux-form": "^8.1.0",
+    "redux-thunk": "^2.3.0",
+    "sass": "^1.16.0"
   },
   "scripts": {
     "start": "react-scripts start",

+ 18 - 37
public/index.html

@@ -1,40 +1,21 @@
 <!DOCTYPE html>
 <html lang="en">
-  <head>
-    <meta charset="utf-8">
-    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
-    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
-    <meta name="theme-color" content="#000000">
-    <!--
-      manifest.json provides metadata used when your web app is added to the
-      homescreen on Android. See https://developers.google.com/web/fundamentals/web-app-manifest/
-    -->
-    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
-    <!--
-      Notice the use of %PUBLIC_URL% in the tags above.
-      It will be replaced with the URL of the `public` folder during the build.
-      Only files inside the `public` folder can be referenced from the HTML.
-
-      Unlike "/favicon.ico" or "favicon.ico", "%PUBLIC_URL%/favicon.ico" will
-      work correctly both with client-side routing and a non-root public URL.
-      Learn how to configure a non-root public URL by running `npm run build`.
-    -->
-    <title>React App</title>
-  </head>
-  <body>
-    <noscript>
-      You need to enable JavaScript to run this app.
-    </noscript>
-    <div id="root"></div>
-    <!--
-      This HTML file is a template.
-      If you open it directly in the browser, you will see an empty page.
-
-      You can add webfonts, meta tags, or analytics to this file.
-      The build step will place the bundled scripts into the <body> tag.
-
-      To begin the development, run `npm start` or `yarn start`.
-      To create a production bundle, use `npm run build` or `yarn build`.
-    -->
-  </body>
+  	<head>
+	    <meta charset="utf-8">
+	    <link rel="shortcut icon" href="%PUBLIC_URL%/favicon.ico">
+	    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
+	    <meta name="theme-color" content="#000000">
+	    
+	    
+		<link href='https://fonts.googleapis.com/css?family=Roboto:400' rel='stylesheet' type='text/css'>
+	    <link rel="manifest" href="%PUBLIC_URL%/manifest.json">
+	    
+	    <title>Bazar.com</title>
+  	</head>
+	  <body>
+		    <noscript>
+		      	You need to enable JavaScript to run this app.
+		    </noscript>
+		    <div id="root"></div>
+	  </body>
 </html>

+ 0 - 15
src/App.js

@@ -1,15 +0,0 @@
-import React, { Component } from 'react';
-import logo from './logo.svg';
-import './App.css';
-
-class App extends Component {
-  render() {
-    return (
-      <div>
-        start
-      </div>
-    );
-  }
-}
-
-export default App;

+ 34 - 0
src/actions/addNewCategoryAction.js

@@ -0,0 +1,34 @@
+import * as types from '../constants/actionTypes';
+
+const axios = require('axios')
+
+const addNewCategoryRequest = payload => ({
+    type: types.ADD_NEW_CATEGORY_REQUEST,
+    payload
+})
+
+const addNewCategoryRequestSuccess = payload => ({
+    type: types.ADD_NEW_CATEGORY_REQUEST_SUCCESS,
+    payload
+})
+
+const addNewCategoryRequestFail = payload => ({
+    type: types.ADD_NEW_CATEGORY_REQUEST_FAIL,
+    payload
+})
+
+export const closeModal = payload => ({
+    type: types.CLOSE_MODAL_WINDOW,
+    payload
+})
+
+export const AddNewCategory = payload => {
+    return dispatch => {
+        dispatch(addNewCategoryRequest())
+        axios.post(`http://127.0.0.1:2000/api/categories`, payload)
+            .then(res =>
+                setTimeout(() => dispatch(addNewCategoryRequestSuccess(res)), 1000))
+            .catch(err =>
+                dispatch(addNewCategoryRequestFail(err)))
+    }
+}

+ 130 - 0
src/actions/addNewStaffAction.js

@@ -0,0 +1,130 @@
+import * as types from '../constants/actionTypes';
+
+const axios = require('axios')
+
+const addNewStaffRequest = payload => ({
+    type: types.ADD_NEW_STAFF_REQUEST,
+    payload
+})
+
+const addNewStaffRequestSuccess = payload => ({
+    type: types.ADD_NEW_STAFF_REQUEST_SUCCESS,
+    payload
+})
+
+const addNewStaffRequestFail = payload => ({
+    type: types.ADD_NEW_STAFF_REQUEST_FAIL,
+    payload
+})
+
+export const closeModal = payload => ({
+    type: types.CLOSE_MODAL_WINDOW,
+    payload
+})
+
+
+export const AddNewStaffAction = payload => {
+    return dispatch => {
+        dispatch(addNewStaffRequest())
+        axios.post(`http://127.0.0.1:2000/api/staffs`, payload)
+            .then(res =>
+                setTimeout(() => dispatch(addNewStaffRequestSuccess(res)), 1000))
+            .catch(err =>
+                dispatch(addNewStaffRequestFail(err)))
+    }
+}
+
+export const base64 = payload => ({
+    type: types.BASE_64_REQUEST,
+    payload
+})
+export const base641 = payload => ({
+    type: types.BASE1_64_REQUEST,
+    payload
+})
+export const base642 = payload => ({
+    type: types.BASE2_64_REQUEST,
+    payload
+})
+export const base643 = payload => ({
+    type: types.BASE3_64_REQUEST,
+    payload
+})
+
+const addPhotoRequest = payload => ({
+    type: types.PUSH_NEW_PHOTO_REQUEST,
+    payload
+})
+
+const addNewPhotoRequestSuccess = payload => ({
+    type: types.PUSH_NEW_PHOTO_REQUEST_SUCCESS,
+    payload
+})
+
+const addNewPhotoRequestFail = payload => ({
+    type: types.PUSH_NEW_PHOTO_REQUEST_FAIL,
+    payload
+})
+
+
+export const pushPhoto = payload => {
+    console.log(payload)
+    return dispatch => {
+        dispatch(addPhotoRequest())
+        axios.post(`http://127.0.0.1:2000/upload`, payload)
+            .then(res =>
+                setTimeout(() => dispatch(addNewPhotoRequestSuccess(res)), 1000))
+            .catch(err =>
+                dispatch(addNewPhotoRequestFail(err)))
+    }
+}
+
+
+
+ export const inputchangeHandler = payload => ({
+    type: types.INPUT_CHANGE_VALUE,
+    payload
+})
+
+export const inputchangeHandler1 = payload => ({
+    type: types.INPUT_CHANGE_VALUE1,
+    payload
+})
+export const inputchangeHandler2 = payload => ({
+    type: types.INPUT_CHANGE_VALUE2,
+    payload
+})
+export const inputchangeHandler3 = payload => ({
+    type: types.INPUT_CHANGE_VALUE3,
+    payload
+})
+
+
+
+
+const editStaffRequest = payload => ({
+    type: types.ADD_NEW_STAFF_REQUEST,
+    payload
+})
+
+const editStaffRequestSuccess = payload => ({
+    type: types.ADD_NEW_STAFF_REQUEST_SUCCESS,
+    payload
+})
+
+const editStaffRequestFail = payload => ({
+    type: types.ADD_NEW_STAFF_REQUEST_FAIL,
+    payload
+})
+
+export const EditStaffAction = payload => {
+    console.log(payload)
+    return dispatch => {
+        dispatch(editStaffRequest())
+        axios.put(`http://127.0.0.1:2000/api/staffs`, payload)
+            .then(res =>
+                setTimeout(() => dispatch(editStaffRequestSuccess(res)), 1000))
+            .catch(err =>
+                dispatch(editStaffRequestFail(err)))
+    }
+}

+ 39 - 0
src/actions/categoryAction.js

@@ -0,0 +1,39 @@
+import * as types from '../constants/actionTypes';
+
+const axios = require('axios');
+
+export const podCategory = (payload) => ({
+	type: types.POD_CATEGORY,
+	payload
+});
+
+const CategoryRequest = (payload) => ({
+	type: types.CATEGORY_REQUEST,
+	payload
+});
+
+const CategoryRequestSuccess = payload => ({
+	type: types.CATEGORY_REQUEST_SUCCESS,
+	payload
+});
+
+const CategoryRequestFail = payload => ({
+	type: types.CATEGORY_REQUEST_FAIL,
+	payload
+});
+
+export const getCategoriesData = () => {
+    return dispatch => {
+        dispatch(CategoryRequest());
+        return axios.get(`http://127.0.0.1:2000/api/categories`)
+            .then(res => {
+                setTimeout(() => {
+                    dispatch(CategoryRequestSuccess(res))
+                }, 1000);
+            })
+            .catch(err => {
+                dispatch(CategoryRequestFail(err));
+            })
+
+    };
+};

+ 35 - 0
src/actions/getStaffByCategoryIdAction.js

@@ -0,0 +1,35 @@
+import * as types from '../constants/actionTypes'
+
+const axios = require('axios')
+
+const CategoryRequestById = payload => ({
+	type: types.CATEGORY_REQUEST_BY_ID,
+	payload
+});
+
+const CategoryRequestSuccessById = payload => ({
+	type: types.CATEGORY_REQUEST_SUCCESS_BY_ID,
+	payload
+});
+
+const CategoryRequestFailById = payload => ({
+	type: types.CATEGORY_REQUEST_FAIL_BY_ID,
+	payload
+});
+
+export const getCategorysDataById = (payload) => {
+	console.log(payload)
+	return dispatch => {
+		dispatch(CategoryRequestById());
+		return axios.get(`http://127.0.0.1:2000/api/categories?id=${payload}`)
+			.then(res => {
+				setTimeout(() => {
+					dispatch(CategoryRequestSuccessById(res))
+				}, Math.random() * 1000);
+			})
+			.catch(err => {
+				dispatch(CategoryRequestFailById(err));
+			})
+
+	};
+};

+ 35 - 0
src/actions/getStaffByIdAction.js

@@ -0,0 +1,35 @@
+import * as types from '../constants/actionTypes'
+
+const axios = require('axios')
+
+const StaffRequestById = payload => ({
+	type: types.STAFF_REQUEST_BY_ID,
+	payload
+});
+
+const StaffRequestSuccessById = payload => ({
+	type: types.STAFF_REQUEST_SUCCESS_BY_ID,
+	payload
+});
+
+const StaffRequestFailById = payload => ({
+	type: types.STAFF_REQUEST_FAIL_BY_ID,
+	payload
+});
+
+export const getStaffsDataById = (payload) => {
+	return dispatch => {
+		dispatch(StaffRequestById());
+		return axios.get(`http://127.0.0.1:2000/api/staffs?id=${payload}`)
+			.then(res => {
+				setTimeout(() => {
+					dispatch(StaffRequestSuccessById(res))
+				}, Math.random() * 1000);
+			})
+			.catch(err => {
+				dispatch(StaffRequestFailById(err));
+			})
+
+	};
+};
+

+ 41 - 0
src/actions/getUserById.js

@@ -0,0 +1,41 @@
+import * as types from "../constants/actionTypes";
+
+const axios = require("axios");
+
+const userAuthRequestById = payload => ({
+    type: types.USER_AUTH_REQUEST_BY_ID,
+    payload
+})
+
+const userAuthRequestSuccessById = payload => ({
+    type: types.USER_AUTH_REQUEST_SUCCESS_BY_ID,
+    payload
+})
+
+const userAuthRequestFailById = payload => ({
+    type: types.USER_AUTH_REQUEST_FAIL_BY_ID,
+    payload
+})
+
+export const getUsersDataById = (payload) => {
+    return dispatch => {
+        dispatch(userAuthRequestById());
+        return axios.get(`http://127.0.0.1:2000/api/users?id=${payload}`)
+            .then(res => {
+                dispatch(userAuthRequestSuccessById(res))
+            })
+            .catch(err => {
+                dispatch(userAuthRequestFailById(err));
+            })
+    }
+}
+
+export const getParams = payload => ({
+    type: types.GET_PARAMS,
+    payload
+})
+
+export const deleteStaffById = (payload) => ({
+	type:types.DELETE_STAFF,
+	payload
+})

+ 41 - 0
src/actions/searchStaffAction.js

@@ -0,0 +1,41 @@
+import * as types from '../constants/actionTypes';
+
+const axios = require('axios');
+
+export const changeInputValue = payload => ({
+    type: types.CHANGE_INPUT_VALUE,
+    payload
+})
+
+const searchStaffRequest = payload => ({
+    type: types.SEARCH_STAFF_REQUEST,
+    payload
+})
+
+const searchStaffRequestSuccess = payload => ({
+    type: types.SEARCH_STAFF_REQUEST_SUCCESS,
+    payload
+})
+
+const searchStaffrequestFail = payload => ({
+    type: types.SEARCH_STAFF_REQUEST_FAIL,
+    payload
+})
+
+export const searchStaff = payload => {
+    return dispatch => {
+        dispatch(searchStaffRequest())
+        return axios.get(`http://127.0.0.1:2000/api/staffs?search=${payload}`)
+            .then(
+                res => {
+                    setTimeout(() => {
+                        dispatch(searchStaffRequestSuccess(res))
+                    }, Math.random()*1000)
+                })
+            .catch(
+                err => {
+                    dispatch(searchStaffrequestFail(err))
+                })
+
+    }
+}

+ 33 - 0
src/actions/searchStaffByIdAction.js

@@ -0,0 +1,33 @@
+import * as types from '../constants/actionTypes';
+
+const axios = require('axios')
+
+const SeacrhStaffRequestById = payload => ({
+	type: types.SEARCH_STAFF_REQUEST_BY_ID,
+	payload
+});
+
+const SeacrhStaffRequestSuccessById = payload => ({
+	type: types.SEARCH_STAFF_REQUEST_SUCCESS_BY_ID,
+	payload
+});
+
+const SeacrhStaffRequestFailById = payload => ({
+	type: types.SEARCH_STAFF_REQUEST_FAIL_BY_ID,
+	payload
+});
+
+export const getSeacrhStaffsDataById = (payload) => {
+	return dispatch => {
+		dispatch(SeacrhStaffRequestById());
+		return axios.get(`http://127.0.0.1:2000/api/staffs?id=${payload}`)
+			.then(res => {
+				setTimeout(() => {
+					dispatch(SeacrhStaffRequestSuccessById(res))
+				}, Math.random() * 1000);
+			})
+			.catch(err => {
+				dispatch(SeacrhStaffRequestFailById(err));
+			})
+	};
+};

+ 39 - 0
src/actions/staffsAction.js

@@ -0,0 +1,39 @@
+import * as types from "../constants/actionTypes";
+
+const axios = require('axios');
+
+export const getInfoStaffData = payload => ({
+	type: types.GET_STAFF_INFO_DATA,
+	payload
+})
+
+const StaffRequest = payload => ({
+	type: types.STAFF_REQUEST,
+	payload
+});
+
+const StaffRequestSuccess = payload => ({
+	type: types.STAFF_REQUEST_SUCCESS,
+	payload
+});
+
+const StaffRequestFail = payload => ({
+	type: types.STAFF_REQUEST_FAIL,
+	payload
+});
+
+export const getStaffsData = () => {
+	return dispatch => {
+		dispatch(StaffRequest());
+		return axios.get(`http://127.0.0.1:2000/api/staffs`)
+			.then(res => {
+				setTimeout(() => {
+					dispatch(StaffRequestSuccess(res))
+				}, 1000);
+			})
+			.catch(err => {
+				dispatch(StaffRequestFail(err));
+			})
+
+	};
+};

+ 38 - 0
src/actions/usersAuthActions.js

@@ -0,0 +1,38 @@
+import * as types from "../constants/actionTypes";
+
+const axios = require("axios");
+
+export const closeModal = payload => ({
+    type: types.CLOSE_MODAL_WINDOW,
+    payload
+})
+
+const userAuthRequest = payload => ({
+    type: types.USER_AUTH_REQUEST,
+    payload
+})
+
+const userAuthRequestSuccess = payload => ({
+    type: types.USER_AUTH_REQUEST_SUCCESS,
+    payload
+})
+
+const userAuthRequestFail = payload => ({
+    type: types.USER_AUTH_REQUEST_FAIL,
+    payload
+})
+
+export const getUsersData = (payload) => {
+    return dispatch => {
+        dispatch(userAuthRequest());
+        return axios.post(`http://127.0.0.1:2000/api/users-check`, payload)
+            .then(res => {
+                dispatch(userAuthRequestSuccess(res))
+            })
+            .catch(err => {
+                dispatch(userAuthRequestFail(err));
+            })
+    }
+}
+
+    

+ 38 - 0
src/actions/usersRegistrActions.js

@@ -0,0 +1,38 @@
+import * as types from "../constants/actionTypes";
+
+const axios = require("axios");
+
+export const closeModal = payload => ({
+    type: types.CLOSE_MODAL_WINDOW,
+    payload
+})
+
+const userRegRequest = payload => ({
+    type: types.USER_REG_REQUEST,
+    payload
+});
+
+const userRegRequestSuccess = payload => ({
+    type: types.USER_REG_REQUEST_SUCCESS,
+    payload
+});
+
+const userRegRequestFail = payload => ({
+    type: types.USER_REG_REQUEST_FAIL,
+    payload
+});
+
+export const postUsersData = (payload) => {
+    return dispatch => {
+        dispatch(userRegRequest());
+        return axios.post(`http://127.0.0.1:2000/api/users`, payload)
+            .then(res => {
+                setTimeout(() => {
+                    dispatch(userRegRequestSuccess(res))
+                }, 2000);
+            })
+            .catch(err => {
+                dispatch(userRegRequestFail(err));
+            })
+    };
+};

+ 11 - 0
src/common/authRenderField.js

@@ -0,0 +1,11 @@
+import React from "react";
+
+export const authRenderField = ({input, meta: {touched, error}, label, type, placeholder }) => (
+    <div className={touched && error ? "form__input-box":"error"}> 
+        <label className="form__input-label" htmlFor="origin">
+            {label}
+            {touched && error ? <input  className="input" style={{"border":"2px solid red"}} type = {type} placeholder = {placeholder}  {...input} /> : <input  className="input" type = {type} placeholder = {placeholder} {...input} /> }
+        </label> 
+        {touched && error && <span className="span_auth">{error}</span>}
+    </div>
+);

+ 11 - 0
src/common/regRenderField.js

@@ -0,0 +1,11 @@
+import React from "react";
+
+export const regRenderField = ({input, meta: {touched, error}, label, type, placeholder }) => (
+    <div className="form__input-box">
+        <label className="form__input-label" htmlFor="origin">
+            {label}
+            {touched && error ? <input  className="input" style={{"border":"2px solid red"}} type = {type} placeholder = {placeholder}  {...input} /> : <input  className="input" type = {type} placeholder = {placeholder} {...input} /> }
+        </label>
+        {touched && error && <span className="span_reg">{error}</span>}
+    </div>
+);

+ 76 - 0
src/components/AllStaffs/FullInfoAboutStaff.js

@@ -0,0 +1,76 @@
+import React, { Component } from 'react';
+
+import Loader from 'react-loader-spinner';
+import { Carousel } from 'antd';
+
+class FullInfoAboutStaff extends Component {
+    constructor(props) {
+        super(props)
+
+        this.state = {
+            count: 0,
+        }
+    }
+
+    render() {
+
+        const { InfoStaff, isFetching } = this.props
+        let arr = [];
+
+        InfoStaff.map(el => {
+            if (el.state) {
+                let str1 = el.img.substr(29)
+
+                for (var i = 0, b = 24; i < str1.length; i = i + 25) {
+                    arr.push({ newStr: str1.substr(i, b), state: el.state, defaultStr: el.img })
+                }
+            } else {
+                arr.push({ state: el.state, defaultStr: el.img })
+            }
+
+        })
+
+        let data1
+        let data;
+
+        if (isFetching === true) {
+            data = <div className="loader">
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"
+                    width="100"
+                />
+            </div>
+        } else {
+            data = InfoStaff.map((el, key) => <div className="divCenter" key={key}>
+                <div className="flex-around">
+                    <p><b>Название: </b>{el.title} </p>
+                    <p><b>Цена: </b>{el.price}</p>
+                    <p><b>Описание: </b>{el.description}</p>
+                    <p><b>Контактное лицо: </b>{el.user.name}</p> 
+                    <p><b>Номер телефона: </b>{el.user.phone}</p>
+                </div>
+            </div>
+            )
+            data1 = <div className="carusel">
+                <Carousel effect="fade">
+                    {arr.map((el,key) => <div key={key}>
+                        {el.state ? <img src={`http://127.0.0.1:2000/static/${el.newStr}`} className="fullImgStaff" alt="lorem" /> :
+                            <img src={`${el.defaultStr}`} width="325" height="190" className="imgStaff" alt="lorem" />}
+                    </div>)}
+                </Carousel>
+            </div>
+        }
+
+
+        return (
+
+            <div className="staffinfo" >
+                {data1}
+                {data}
+            </div>
+        );
+    }
+}
+
+export default FullInfoAboutStaff;

+ 94 - 0
src/components/AllStaffs/index.js

@@ -0,0 +1,94 @@
+import React, { Component } from 'react';
+import { Link } from "react-router-dom";
+
+import Loader from 'react-loader-spinner';
+import AddNewStaff from '../../components/BtnAddNewStaff'
+
+class AllStaffs extends Component {
+    constructor(props){
+        super(props)
+        this.state = {
+            trig: false, 
+            maxMin: false
+        }
+    }
+    sortStaffMinMax = () =>{
+        this.setState({trig: !this.state.trig})
+    }
+    sortStaffMaxMin = () =>{
+        this.setState({maxMin: !this.state.maxMin})
+    }
+    render() {
+        const { inputStaffs, isFetching, isAdmin, getUser, arr } = this.props
+       
+        let data;
+
+        if (isFetching === true) {
+            data = <div className="loader">
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"
+                    width="100"
+                />
+            </div>
+        } else if(this.state.trig === true) {
+            data = <div className="staffs">
+           
+                {arr.map((el, key) => (
+                 <Link to={`/staff/${el.id}`} key={key}>
+                     <div className="staff">
+                     {el.state ?  <img src={el.img.substr(0,53)} width="325" height="190" className="imgStaff"  alt="lorem" /> : <img src={el.img} width="325" height="190" className="imgStaff"  alt="lorem" />}
+                         <div className="titlleAndPrice">
+                             <h4>{el.title}</h4>
+                             <h4>Цена: {el.price}</h4>
+                         </div>
+                     </div>
+                 </Link>
+             ))}
+             </div>
+
+        }else if (this.state.maxMin === true){
+             data = <div className="staffs">
+                  { arr.map((el, key) => (
+                    <Link to={`/staff/${el.id}`} key={key}>
+                        <div className="staff">
+                        {el.state ?  <img src={el.img.substr(0,53)} width="325" height="190" className="imgStaff"  alt="lorem" /> : <img src={el.img} width="325" height="190" className="imgStaff"  alt="lorem" />}
+                            <div className="titlleAndPrice">
+                                <h4>{el.title}</h4>
+                                <h4>Цена: {el.price}</h4>
+                            </div>
+                        </div>
+                    </Link>
+                )).reverse()}
+                </div>
+        } else {
+            data = <div className="staffs">
+            {inputStaffs.map((el, key) => (
+                    <Link to={`/staff/${el.id}`} key={key}>
+                        <div className="staff">
+                        {el.state ?  <img src={el.img.substr(0,53)} width="325" height="190" className="imgStaff"  alt="lorem" /> : <img src={el.img} width="325" height="190" className="imgStaff"  alt="lorem" />}
+                            <div className="titlleAndPrice">
+                                <h4>{el.title}</h4>
+                                <h4>Цена: {el.price}</h4>
+                            </div>
+                        </div>
+                    </Link>
+                ))}
+                  
+            </div>
+        }
+        console.log(arr.reverse())
+        return (
+
+            <div className="contentStaffs">
+                {data}
+                <button className="topPrice" onClick={this.sortStaffMinMax}>Дорогие</button>
+                <button className="bottomPrice" onClick={this.sortStaffMaxMin}>Дешевые</button>
+                <AddNewStaff isAdmin={isAdmin} getUser={getUser} />
+            </div>
+
+        );
+    }
+}
+
+export default AllStaffs;

+ 23 - 0
src/components/Auth/authButtons.js

@@ -0,0 +1,23 @@
+import React, { Component } from "react"
+import { Link } from "react-router-dom"
+
+class Authbuttons extends Component {
+    render() {
+        return (
+            <div className="auth__button">
+                <Link to="/auth" >
+                    <button className="buttonAuth">
+                        Вход
+                    </button>
+                </Link>
+                <Link to="/registration" >
+                    <button className="buttonAuth">
+                        Регистрация
+                    </button>
+                </Link>
+            </div>
+        )
+    }
+}
+
+export default Authbuttons;

+ 55 - 0
src/components/Auth/authorisation.js

@@ -0,0 +1,55 @@
+import React from "react";
+import { reduxForm, Field } from "redux-form";
+import { Link } from "react-router-dom"
+
+import Authbuttons from './authButtons'
+
+import { authValidate } from "../../utils/authValidate";
+import { authRenderField } from "../../common/authRenderField"
+
+
+const Form = props => {
+
+    const { handleSubmit, getUsersData } = props
+
+    const submit = (values) => {
+
+        getUsersData(values);
+
+    }
+    return (
+        <div className="formdiv">
+            <div>
+                <Authbuttons />
+                <form className="formAuth" >
+                    <Field
+                        name="email"
+                        component={authRenderField}
+                        type="Емейл"
+                        placeholder="email@example.com"
+                        className="input"
+                    />
+                    <Field
+                        name="password"
+                        component={authRenderField}
+                        type="password"
+                        placeholder="Пароль"
+                        className="input"
+                    />
+
+                    <div className="center">
+                        <button className="buttonInAuth" onClick={handleSubmit(submit)}>
+                            Войти
+                        </button>
+                    </div>
+                </form>
+            </div>
+
+        </div>
+
+
+
+    );
+}
+
+export default reduxForm({ form: "authForm", validate: authValidate })(Form);

+ 95 - 0
src/components/Auth/registration.js

@@ -0,0 +1,95 @@
+import React from 'react'
+import { Field, reduxForm } from 'redux-form'
+
+import Authbuttons from './authButtons'
+
+import { regValidate } from '../../utils/regValidate'
+import { regRenderField } from '../../common/regRenderField'
+
+const RegistrForm = props => {
+
+    const { handleSubmit, pristine, reset, postUsersData } = props
+
+    const submit = (values) => {
+        values.avatar = "https://site.com"
+        values.isAdmin = 0
+        values.description = "bad_boy"
+        postUsersData(values)
+    }
+
+    return (
+        <div >
+            <Authbuttons />
+            <form onSubmit={handleSubmit(submit)} className="formRegistr">
+                <div>
+                    <div className="divName">
+                        <div style={{ "width": "270px" }} >
+                            <Field
+                                name="name"
+                                component={regRenderField}
+                                type="text"
+                                placeholder="Имя"
+                                className="inputName"
+                            />
+                        </div>
+                        <div style={{ "width": "270px" }} >
+                            <Field
+                                name="login"
+                                component={regRenderField}
+                                type="text"
+                                placeholder="Логин"
+                                className="inputName"
+                            />
+                        </div>
+                    </div>
+                    <div className="divName">
+                        <div style={{ "width": "270px" }} >
+                            <Field
+                                name="email"
+                                component={regRenderField}
+                                type="email"
+                                placeholder="email@example.com"
+                                className="inputName"
+                            />
+                        </div>
+                        <div style={{ "width": "270px" }} >
+                            <Field
+                                name="phone"
+                                component={regRenderField}
+                                type="text"
+                                placeholder="+380XXXXXXXX"
+                                className="inputName"
+                            />
+                        </div>
+                    </div>
+                    <Field
+                        name="password"
+                        component={regRenderField}
+                        type="password"
+                        placeholder="Пароль"
+                        className="input"
+                    />
+                </div>
+                <div className="center">
+                    <button type="submit"
+                        className="buttonInRegistration"
+                        disabled={pristine}
+                    >
+                        Зарегистрироваться
+                    </button>
+                    <button type="button"
+                        className="buttonInRegistration"
+                        disabled={pristine}
+                        onClick={reset}
+                    >
+                        Очистить поля
+                    </button>
+                </div>
+            </form>
+        </div>
+
+    )
+}
+
+export default reduxForm({ form: 'registrForm', validate: regValidate })(RegistrForm)
+

+ 19 - 0
src/components/Btn/linkHome.js

@@ -0,0 +1,19 @@
+import React, { Component } from 'react';
+
+import { Icon } from 'antd';
+import { Link } from "react-router-dom";
+
+class LinkHome extends Component {
+    render() {
+    
+        return (
+            <div>
+                <Link to="/" className="linkTopButton">
+                    <Icon type="home" style={{ fontSize: '30px' }} />
+                </Link>
+            </div>
+        );
+    }
+}
+
+export default LinkHome;

+ 27 - 0
src/components/BtnAddNewStaff/index.js

@@ -0,0 +1,27 @@
+import React, { Component, Fragment } from 'react';
+
+import { Icon } from 'antd';
+import { Link } from "react-router-dom";
+
+
+class BtnAddNewStaff extends Component {
+    render() {
+        const { isAdmin, getUser } = this.props
+        let localS = JSON.parse(localStorage.getItem("login"));
+
+        let data;
+        if (localS === null) {
+            data = <div><Link to="/auth" className="topbutton"><Icon type="plus" style={{ fontSize: '30px' }} /></Link></div>
+        }
+        else if (isAdmin !== undefined || getUser.isAdmin !== undefined) {
+            data = <div> <Link to="/newStaff" className="topbutton"><Icon type="plus" style={{ fontSize: '30px' }} /></Link></div>
+        }
+        return (
+            <Fragment>
+                {data}
+            </Fragment>
+        );
+    }
+}
+
+export default BtnAddNewStaff;

+ 54 - 0
src/components/CategoryStaffs/index.js

@@ -0,0 +1,54 @@
+import React, { Component } from 'react';
+import { Link } from "react-router-dom";
+
+import Loader from 'react-loader-spinner';
+import AddNewStaff from '../../components/BtnAddNewStaff'
+
+class CategoryStaffs extends Component {
+    
+    render() {
+        const { infoCategory, isFetching, getUser } = this.props
+        console.log(this.props)
+
+        let data;
+            if(isFetching===true){
+                
+                data = <div className="loader"> 
+                    <Loader type="Triangle"
+                        color="#FD7F71"
+                        height="100"	
+                        width="100"
+                    /> 
+                </div> 
+            }
+            else{
+                data = <div className="staffs">
+                {infoCategory.map((el,key)=>(
+                    <Link to={`/staff/${el.id}`} key={key}>
+                        <div className="staff">
+                           <img src={el.img.substr(0,53)} width="325" height="190" className="imgStaff"  alt="lorem" />
+                            <div className="titlleAndPrice">
+                                <h4>{el.title}</h4>
+                                <h4>Цена: {el.price}</h4>
+                            </div>
+
+                        </div>
+                    </Link> 
+                ))}    
+            </div>
+            }
+        return (
+
+           <div className="content">
+
+                {data}
+                <AddNewStaff   getUser={ getUser }/>
+           </div> 
+            
+        );
+    }
+}
+
+export default CategoryStaffs;
+
+

+ 56 - 0
src/components/FormsAdd/FormAddNewCategory/SendingCategoryForm.js

@@ -0,0 +1,56 @@
+import React from 'react'
+import { Field, reduxForm } from 'redux-form'
+
+const SendingForm = props => {
+    const { handleSubmit, pristine, reset, submitting, AddNewCategory, podcategory } = props
+
+    const submit = values => {
+        AddNewCategory(values)
+    };
+
+    return (
+        <div className="formdiv">
+            <form onSubmit={handleSubmit(submit)} className="form">
+                <Field name="title"
+                    className="input"
+                    component="input"
+                    type="text"
+                    placeholder="Наименование Заголовка"
+                />
+                <Field name="description"
+                    className="input"
+                    component="input"
+                    type="text"
+                    placeholder="Icon"
+                />
+                <Field name="parentId"
+                    className="input"
+                    component="select"  
+                >
+                    <option >Выберите рубрику</option>
+                    <option value={0}> Новая рубрика</option>
+                    {podcategory.map(el => <option value={el.id}> {el.title}</option>)}
+                </Field>
+                <div className="buttonConteiner">
+                    <button type="submit"
+                        className="button"
+                        disabled={pristine || submitting}
+                    >
+                        Добавить
+                    </button>
+                    <button type="button"
+                        className="button"
+                        disabled={pristine || submitting}
+                        onClick={reset}
+                    >
+                        Очистить
+                    </button>
+                </div>
+            </form>
+        </div >
+    )
+}
+
+export default reduxForm({
+    form: 'SendingForm'
+})(SendingForm)

+ 40 - 0
src/components/FormsAdd/FormAddNewCategory/index.js

@@ -0,0 +1,40 @@
+import React, { Component } from 'react';
+import { connect } from 'react-redux';
+import * as actions from '../../../actions/categoryAction';
+
+import { bindActionCreators } from 'redux';
+
+import MDSpinner from "react-md-spinner";
+import Form from '../FormAddNewCategory/SendingCategoryForm'
+import LinkHome from "../../Btn/linkHome"
+
+class FormAddNewStaff extends Component {
+    componentDidMount() {
+        this.props.getCategoriesData(); 
+    }
+
+    render() {
+        
+        const { isFetching, AddNewCategory, allCategory, podcategory } = this.props
+        
+        return (
+            <div>
+                <LinkHome />
+               <Form AddNewCategory={AddNewCategory} allCategory={allCategory} podcategory={podcategory} />
+               {isFetching===true ? <div><MDSpinner size={100} duration={1000} /></div> : null}
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state =>({
+    allCategory: state.category.allCategory,
+    podcategory: state.category.podcategory,
+})
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+
+export default FormAddNewStaff = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(FormAddNewStaff);;

+ 175 - 0
src/components/FormsAdd/FormAddNewStaff/SendingStaffForm.js

@@ -0,0 +1,175 @@
+import React, { Component } from 'react';
+import { Field, reduxForm } from 'redux-form';
+
+import FormData from 'form-data'
+
+
+class SendingForm extends Component {
+    constructor(props) {
+        super(props)
+
+        this.state = { trig: false }
+    }
+
+    onChange = e => {
+        const { pushPhoto, base64 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base64(reader.result)
+        }
+        reader.readAsDataURL(file);
+    }
+    onChange1 = e => {
+        const { pushPhoto, base641 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base641(reader.result)
+        }
+        reader.readAsDataURL(file);
+    }
+    onChange2 = e => {
+        const { pushPhoto, base642 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base642(reader.result)
+        }
+        reader.readAsDataURL(file);
+    }
+    onChange3 = e => {
+        const { pushPhoto, base643 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        if (e.target.files[0] === undefined) {
+            return
+        }
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base643(reader.result)
+        }
+        reader.readAsDataURL(file);
+
+    }
+
+    submit = values => {
+
+        const { AddNewStaffAction, getUser, photo } = this.props      
+        if(!this.state.trig){
+            // http://rs.img.com.ua/crop?v2=1&w=600&h=0&url=%2F%2Fbm.img.com.ua%2Fberlin%2Fstorage%2Forig%2Fd224d3bd9bfe8bcb6b561da523d87364.jpg
+            values.img = "https://icoconvert.com/images/noimage2.png";
+            values.state = 0
+        } else {
+            values.img = `http://127.0.0.1:2000/static/${photo.map(el => el.data.fileName)}`;
+            values.state = 1
+        }
+        values.staff = "Машина"
+
+        values.userId = getUser.id
+        AddNewStaffAction(values)
+
+    };
+    render() {
+
+        const { handleSubmit, pristine, reset, submitting, allCategory, base64Photo, addOrnot, base64Photo1, base64Photo2, base64Photo3, addOrnot1, addOrnot2, addOrnot3 } = this.props
+
+        return (
+
+
+            <div className="formdiv">
+                <form onSubmit={handleSubmit(this.submit)} className="form">
+                    <Field name="title"
+                        component="input"
+                        type="text"
+                        placeholder="Название"
+                        className="input"
+                    />
+
+                    <Field name="description"
+                        component="textarea"
+                        type="text"
+                        placeholder="Описание"
+                        className="textarea"
+                    />
+
+                    <Field name="price"
+                        component="input"
+                        type="number"
+                        placeholder="Цена"
+                        className="input"
+                    />
+
+                    <Field name="categoryId"
+                        component="select"
+                        className="input"
+                    >
+                        <option >Выберите рубрику</option>
+                        {allCategory.map((el,key) => <option value={el.id} key={key}> {el.title}</option>)}
+                    </Field>
+
+
+                    <div className="file">
+                        <label className='upload-zone zone1'>
+                            {addOrnot ? <img src={base64Photo} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange} />
+
+                        </label>
+                        <label className='upload-zone zone2'>
+                            {addOrnot1 ? <img src={base64Photo1} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange1} />
+
+                        </label>
+                        <label className='upload-zone zone3'>
+                            {addOrnot2 ? <img src={base64Photo2} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange2} />
+
+                        </label>
+                        <label className='upload-zone zone4'>
+                            {addOrnot3 ? <img src={base64Photo3} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange3} />
+
+                        </label>
+                    </div>
+
+
+                    <div className="buttonConteiner">
+                        <button type="submit"
+                            className="button"
+                            disabled={pristine || submitting}
+                        >
+                            Добавить
+                        </button>
+                        <button type="button"
+                            className="button"
+                            disabled={pristine || submitting}
+                            onClick={reset}
+                        >
+                            Очистить
+                        </button>
+                    </div>
+                </form>
+            </div>
+
+        )
+    }
+}
+
+export default reduxForm({
+    form: 'SendingForm'
+})(SendingForm)

+ 46 - 0
src/components/FormsAdd/FormAddNewStaff/index.js

@@ -0,0 +1,46 @@
+import React, { Component, Fragment } from 'react';
+import { connect } from 'react-redux';
+import * as actions from '../../../actions/categoryAction';
+
+import { bindActionCreators } from 'redux';
+
+import MDSpinner from "react-md-spinner";
+import Form from '../FormAddNewStaff/SendingStaffForm'
+import LinkHome from "../../Btn/linkHome"
+
+class FormAddNewStaff extends Component {
+    componentDidMount() {
+        this.props.getCategoriesData();
+        
+    }
+    render() {
+        
+        const { isFetching, allCategory } = this.props
+        let data;
+        if (allCategory.data===undefined){
+            data = []
+        }
+        else{ 
+            const category = allCategory.data.filter(el => el.parentId !== 0)
+            data = <Form {...this.props} allCategory={ category }/>
+        }
+        return (
+            <Fragment>
+                <LinkHome />
+                {data}
+                {isFetching===true ? <div><MDSpinner size={100} duration={1000} /></div> : null}
+            </Fragment>
+        );
+    }
+}
+
+
+const mapStateToProps = state =>({
+    allCategory: state.category.allCategory,
+})
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+export default FormAddNewStaff = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(FormAddNewStaff);

+ 203 - 0
src/components/FormsAdd/redForm/index.js

@@ -0,0 +1,203 @@
+import React, { Component } from 'react';
+import { reduxForm } from 'redux-form';
+
+import FormData from 'form-data'
+import LinkHome from "../../Btn/linkHome"
+
+class FormRedactorStaff extends  Component  {
+
+    constructor(props){
+        super(props)
+       this.state = { trig:false }
+    }
+    onChange = e =>{
+        const { pushPhoto } = this.props
+        this.setState({trig:true})
+        let data = new FormData();
+        data.append('image',e.target.files[0], e.target.files[0].name);
+          
+          pushPhoto(data)
+    }
+    onChange0 = e => {
+        const { pushPhoto, base64 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base64(reader.result)
+        }
+        reader.readAsDataURL(file);
+    }
+    onChange1 = e => {
+        const { pushPhoto, base641 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base641(reader.result)
+        }
+        reader.readAsDataURL(file);
+    }
+    onChange2 = e => {
+        const { pushPhoto, base642 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base642(reader.result)
+        }
+        reader.readAsDataURL(file);
+    }
+    onChange3 = e => {
+        const { pushPhoto, base643 } = this.props
+        this.setState({ trig: true })
+        let data = new FormData();
+        if (e.target.files[0] === undefined) {
+            return
+        }
+        data.append('image', e.target.files[0], e.target.files[0].name);
+        pushPhoto(data)
+        var file = e.target.files[0];
+        var reader = new FileReader();
+        reader.onloadend = function () {
+            base643(reader.result)
+        }
+        reader.readAsDataURL(file);
+
+    }
+    changeHandler = (e) =>{
+          const { inputchangeHandler } = this.props
+          inputchangeHandler(e.target.value)
+    }
+    changeHandler1 = (e) =>{
+        const { inputchangeHandler1 } = this.props
+        inputchangeHandler1(e.target.value)
+    }
+    changeHandler2 = (e) =>{
+         const { inputchangeHandler2 } = this.props
+        inputchangeHandler2(e.target.value)
+        
+    }
+    changeHandler3 = (e) =>{
+         const { inputchangeHandler3 } = this.props
+        inputchangeHandler3(e.target.value)
+        
+    }
+    send = () =>{
+        const { inputData, inputData1, inputData2, inputData3, photo, EditStaffAction, InfoStaff, getUser,  } = this.props  
+        let values = {}
+        if(!this.state.trig){
+            //http://rs.img.com.ua/crop?v2=1&w=600&h=0&url=%2F%2Fbm.img.com.ua%2Fberlin%2Fstorage%2Forig%2Fd224d3bd9bfe8bcb6b561da523d87364.jpg
+            values.img = "https://icoconvert.com/images/noimage2.png";
+            values.state = 0
+        }
+        else{
+            values.img = `http://127.0.0.1:2000/static/${photo.map(el => el.data.fileName)}`; 
+            values.state = 1 
+         }
+            values.title = inputData
+            values.description = inputData1
+            values.price = inputData2
+            values.categoryId = inputData3  
+        values.staff = "Машина"       
+        values.userId = getUser.id
+        values.id = InfoStaff[0].id
+        if(values.title === ""){
+            InfoStaff.map(el => values.title = el.title)
+        }
+        if(values.description === ""){
+            InfoStaff.map(el => values.description = el.description)
+        }
+        if(values.price === null){
+            InfoStaff.map(el => values.price = el.price)
+        }
+        if(values.categoryId === null){
+            InfoStaff.map(el => values.categoryId = el.categoryId)
+        }
+          EditStaffAction(values)
+        
+         
+    }
+    render(){
+        
+        
+         const { pristine, reset, submitting, InfoStaff, allCategory, base64Photo, addOrnot, base64Photo1, base64Photo2, base64Photo3, addOrnot1, addOrnot2, addOrnot3 } = this.props
+         
+         const category = allCategory.data.filter(el => el.parentId !== 0)
+         let data;
+         
+         
+            data = InfoStaff.map((el,key) => <form  className="form" key={key}>
+            <input type="text"  name="title" defaultValue ={el.title} className="input" onChange={this.changeHandler}/>
+            <textarea type="text"  name="description" defaultValue ={el.description} className="textarea" onChange={this.changeHandler1}/>
+            <input type="number"  name="price" defaultValue ={el.price} className="input" onChange={this.changeHandler2}/>
+            <select type="number"  name="categoryId"  className="input" defaultValue ={el.categoryId} onChange={this.changeHandler3}>
+
+              <option >Выберите рубрику</option>
+                    {category.map((el,key) => <option value={el.id} key={key} > {el.title}</option>)}
+                </select>         
+                <div className="file">
+                        <label className='upload-zone zone1'>
+                            {addOrnot ? <img src={base64Photo} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange0} />
+
+                        </label>
+                        <label className='upload-zone zone2'>
+                            {addOrnot1 ? <img src={base64Photo1} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange1} />
+
+                        </label>
+                        <label className='upload-zone zone3'>
+                            {addOrnot2 ? <img src={base64Photo2} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange2} />
+
+                        </label>
+                        <label className='upload-zone zone4'>
+                            {addOrnot3 ? <img src={base64Photo3} style={{ "width": "80px", "height": "80px" }} alt=""></img> : <i>&nbsp;</i>}
+                            <input type='file' className='files' onChange={this.onChange3} />
+
+                        </label>
+                    </div>
+                        
+               
+                <div className="buttonConteiner">
+                <button type="button" className="button" onClick={this.send}>
+                Добавить
+                    </button>
+                   <button type="button" disabled={pristine || submitting} onClick={reset} className="button" >
+                        Очистить
+                    </button>
+                   
+                </div>
+                
+                
+            </form>
+          )
+         
+    return (
+        
+            <div className="formdiv">
+            <LinkHome />
+              {data}  
+            </div>
+        
+    )
+  }
+}
+
+export default reduxForm({
+    form: 'RedactorForm'
+})(FormRedactorStaff)
+
+// {!this.state.trig ?   <button type="button" className="button" onClick={this.send}>
+//                         Submit
+//                     </button>: <Redirect to='/' /> }

+ 48 - 0
src/components/Header/Myprofile.js

@@ -0,0 +1,48 @@
+import React, { Component } from 'react';
+import { Link } from "react-router-dom";
+import { Avatar } from 'antd';
+
+class Myprofile extends Component {
+
+    render() {
+
+        const { name, getUser, id } =this.props
+        let localS = JSON.parse(localStorage.getItem("login"));
+        let data;
+
+        if((!name && !getUser.name) || localS===null){
+
+            data = <Link to="/auth" className="link">
+                <div className="header__auth__container">
+                    <div className="avatar">
+                        <Avatar icon="user" size={60} style={{ backgroundColor: '#FD7F71' }}/>
+                    </div>
+                    <div className="text">
+                        Мой профиль
+                    </div>
+                        
+                </div>    
+            </Link>
+        } else {
+            
+            data = <Link to={`/user/id:${getUser.id || id }`} className="link">
+                <div className="header__auth__container">
+                    <div className="avatar">
+                        <Avatar icon="user" size={60} style={{ backgroundColor: '#FD7F71' }}/>
+                    </div>
+                    <div className="text">
+                        {name || getUser.name }
+                    </div>                    
+                </div>    
+            </Link> 
+        }
+            
+        return (
+            <div className="header__auth">
+                { data }
+            </div>
+        );
+    }
+}
+
+export default Myprofile;

+ 15 - 0
src/components/Header/logo.js

@@ -0,0 +1,15 @@
+import React, { Component } from 'react';
+import logo from '../../img/logoBazar.png';
+import { Link } from "react-router-dom";
+
+class HeaderLogo extends Component {
+    render() {
+        return (
+            <div className="header__logo">
+               <Link to="/"><img src={logo} alt="Logo"/></Link> 
+            </div>
+        );
+    }
+}
+
+export default HeaderLogo;

+ 35 - 0
src/components/Header/searchLine.js

@@ -0,0 +1,35 @@
+import React, { Component } from 'react';
+
+import { Link } from "react-router-dom";
+
+class SearchLine extends Component {
+    
+    changeHandler = e => {
+        this.props.changeInputValue(e.target.value)
+        //athis.props.searchStaff(e.target.value)        
+    }
+    
+    send = () => {
+        const { inputData, searchStaff } = this.props
+        searchStaff(inputData)
+    } 
+
+    render() {
+        const { inputData } = this.props
+        return (
+            <div className="header__searchLine">
+                <input onChange={this.changeHandler}  className="searchInput" placeholder="Что будем покупать?"/>
+                    <Link to = {`/search/${inputData}`} >
+                        <button onClick={this.send} className="searchBtn" > 
+                            <svg xmlns="http://www.w3.org/2000/svg" width="30" height="30" viewBox="0 0 30 30" className="icon">
+                                <rect className="fill-none" width="30" height="30"/>
+                                    <path className="fill-currentcolor" d="M29.82861,24.17139,25.56519,19.908A13.0381,13.0381,0,1,0,19.908,25.56525l4.26343,4.26337a4.00026,4.00026,0,0,0,5.65723-5.65723ZM5,14a9,9,0,1,1,9,9A9.00984,9.00984,0,0,1,5,14Z"/>
+                            </svg>
+                        </button>
+                    </Link>
+            </div>
+        );
+    }
+}
+
+export default SearchLine;

+ 33 - 0
src/components/LeftMenu/DrawCategory.js

@@ -0,0 +1,33 @@
+import React, {Component} from 'react'
+import { Menu, Icon } from 'antd';
+
+import PodCategory from './PodCategory'
+
+const SubMenu = Menu.SubMenu;
+
+class DrawCategory extends Component {
+
+    render(){
+
+        const { allCategory, mainCategory } = this.props;
+        
+        return (
+
+            <div >
+                {mainCategory.map((el,key)=>
+                    <Menu key={key} theme="dark" defaultSelectedKeys={['1']} mode="inline" >    
+                        <SubMenu key={key} 
+                            title={<span ><Icon type={el.description} /><span >{el.title}</span></span>}
+                        > 
+                            <PodCategory allCategory={allCategory} 
+                                categoryId={el.id}     
+                            />  
+                        </SubMenu> 
+                    </Menu>     
+                )}
+            </div>
+        );
+    }
+}
+
+export default DrawCategory

+ 40 - 0
src/components/LeftMenu/PodCategory.js

@@ -0,0 +1,40 @@
+import React, { Component } from 'react'
+import { Link } from "react-router-dom";
+
+class PodCatygory extends Component {
+    constructor(props) {
+        super(props)
+        
+        this.podCaty= [];
+       
+
+    }
+
+    render() {
+        const { allCategory, categoryId } = this.props;
+        this.podCaty = allCategory.filter(el => el.parentId === categoryId)
+
+        let datacat = this.podCaty.map((el, key) =>
+            <Link to={`/category/staff/${el.id}`}  key={`podCaty${key}`}>
+                <li key={`${el.id}`} 
+                    className="ant-menu-item" 
+                    role="menuitem" 
+                    style={{"paddingLeft": "48px"}}
+                >
+                    {el.title}
+                </li>
+            </Link>
+        ) 
+
+        return (
+            <ul className="ant-menu ant-menu-sub ant-menu-inline" 
+                role="menu" 
+                style={{"background": "#e06b62","color": "#fff"}} 
+            >
+                {datacat}
+            </ul>
+        );
+    }
+}
+
+export default PodCatygory

+ 64 - 0
src/components/LeftMenu/index.js

@@ -0,0 +1,64 @@
+import React, { Component } from 'react';
+import DrawCategory from './DrawCategory'
+
+import { Layout, Menu, Icon } from 'antd';
+import { Link } from "react-router-dom";
+
+const { Sider } = Layout;
+
+class LeftMenu extends Component {
+
+    state = {
+        collapsed: false,
+    };
+
+    onCollapse = collapsed => {
+        this.setState({ collapsed });
+    }
+
+    render() {
+
+        const { allCategory, mainCategory,  getUser, isAdmin } = this.props
+        
+            let localS = JSON.parse(localStorage.getItem("login")); 
+            
+            let data; 
+           
+            if(localS===null) {
+                data = [];
+                }
+               
+             else if(Boolean(isAdmin) || Boolean(getUser.isAdmin)){
+                data =  <Menu key="addCatigory1" theme="dark" defaultSelectedKeys={['1']} mode="inline">    
+                <Menu.Item key="addCatigory">
+                    <Link to="/addCategory">
+                        <Icon type="plus" />
+                        <span >Добавить категорию</span>
+                    </Link>
+                </Menu.Item>
+            </Menu>
+            }
+             
+            else{
+                data =[];
+            }
+
+        return (
+            <div>
+                <Layout style={{ minHeight: '100vh' }}>
+                    <Sider collapsible
+                        collapsed={this.state.collapsed}
+                        onCollapse={this.onCollapse}
+                    >
+                        {data}                        
+                        <DrawCategory allCategory={allCategory} 
+                            mainCategory={mainCategory}  
+                        />  
+                    </Sider>
+                </Layout>
+            </div>
+        );
+    }
+}
+
+export default LeftMenu;

+ 15 - 0
src/components/Modal/addNewStaffModal.js

@@ -0,0 +1,15 @@
+import React, { Component } from "react";
+import { Modal } from "antd";
+
+export default class EditModal extends Component {
+	render() {
+		
+		
+		const { visible, onOk, onCancel, error, str } = this.props;
+		  return (
+			<Modal title="" visible={visible} onCancel={onCancel} onOk={onOk}  >
+					{error==="error" ? <h4>Не все поля были заполнены</h4> : <h4>{str}</h4>}
+			</Modal>
+		  );
+	}
+}

+ 15 - 0
src/components/Modal/index.js

@@ -0,0 +1,15 @@
+import React, { Component } from "react";
+import { Modal } from "antd";
+
+export default class EditModal extends Component {
+
+	render() {	
+		const { visible, onOk, onCancel, str, inputData } = this.props;
+		  return (
+			<Modal title="" visible={visible} onCancel={onCancel} onOk={onOk}  >
+			<h4>{inputData ? str: "Данные введены не верно"}</h4>
+			</Modal>
+		  );
+	}
+}
+

+ 66 - 0
src/components/SearchStaffsPage/SearchFullInfoStaff.js

@@ -0,0 +1,66 @@
+import React, { Component } from 'react';
+import Loader from 'react-loader-spinner'
+import { Carousel } from 'antd';
+
+class SearchFullInfoStaff extends Component {
+    render() {
+        
+        const { fullInfoSearchData, isFetching } = this.props
+        let arr = [];
+        
+
+        fullInfoSearchData.map(el => {
+            if (el.state) {
+                let str1 = el.img.substr(29)
+
+                for (var i = 0, b = 24; i < str1.length; i = i + 25) {
+                    arr.push({ newStr: str1.substr(i, b), state: el.state, defaultStr: el.img })
+                }
+            } else {
+                arr.push({ state: el.state, defaultStr: el.img })
+            }
+
+        })
+        let data1
+        let data;
+        if (isFetching === true) {
+            data = <div className="loader">
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"
+                    width="100"
+                />
+            </div>
+        } else {
+            data = fullInfoSearchData.map((el, key) => <div className="divCenter">
+                <div className="flex-around">
+                    <p><b>Название: </b>{el.title} </p>
+                    <p><b>Цена: </b>{el.price}</p>
+                    <p><b>Описание: </b>{el.description}</p>
+                    <p><b>Контактное лицо: </b>{el.user.name}</p> 
+                    <p><b>Номер телефона: </b>{el.user.phone}</p>
+                </div>
+            </div>
+            )
+            data1 = <div className="carusel">
+                <Carousel effect="fade">
+                    {arr.map(el => <div>
+                        {el.state ? <img src={`http://127.0.0.1:2000/static/${el.newStr}`} className="fullImgStaff" alt="lorem" /> :
+                            <img src={`${el.defaultStr}`} width="325" height="190" className="imgStaff" alt="lorem" />}
+                    </div>)}
+                </Carousel>
+            </div>
+        }
+
+
+        return (
+
+            <div className="staffinfo" >
+                {data1}
+                {data}
+            </div>
+        );
+    }
+}
+
+export default SearchFullInfoStaff;

+ 47 - 0
src/components/SearchStaffsPage/index.js

@@ -0,0 +1,47 @@
+import React, { Component } from 'react';
+import { Link } from "react-router-dom";
+import Loader from 'react-loader-spinner'
+
+class searchStaffs extends Component {
+    render() {
+        
+        const {searchData, isFetching } = this.props
+            
+        let data;
+            if(isFetching===true){
+                data = <div className="loader"> 
+                <Loader type="Triangle"
+                    color="#FD7F71"
+                    height="100"	
+                    width="100"
+                /> 
+            </div> 
+            }
+            else{
+                data = <div className="staffs">
+                      {searchData.map((el,key)=>(
+                      <Link to={`/search/Staff/${el.id}`}  key={key}>
+                      <div className="staff">
+                      {el.state ?  <img src={el.img.substr(0,53)} width="325" height="190" className="imgStaff"  alt="lorem" /> : <img src={el.img} width="325" height="190" className="imgStaff"  alt="lorem" />}
+                          <div className="titlleAndPrice">
+                              <h4>{el.title}</h4>
+                              <h4>Цена: {el.price}</h4>
+                          </div>
+                      </div>
+                      </Link>
+                                                )
+                                    )}
+                      </div>
+            }
+        return (
+            <div>
+                
+               {data} 
+                 
+            </div>
+        );
+    }
+}
+
+
+export default searchStaffs;

+ 29 - 0
src/components/privateRouterComponents/addCategoryIfAdmin.js

@@ -0,0 +1,29 @@
+import React, { Component } from 'react';
+
+
+import { Menu, Icon } from 'antd';
+import { Link } from "react-router-dom";
+
+
+
+
+
+class addCategoryIfAdmin extends Component {
+    render() {
+        return (
+            <div>
+                <Menu key="addCatigory1" theme="dark" defaultSelectedKeys={['1']} mode="inline">    
+                            <Menu.Item key="addCatigory">
+                                <Link to="/addCategory">
+                                    <Icon type="plus" />
+                                    <span >Добавить категорию</span>
+                                </Link>
+                            </Menu.Item>
+                        </Menu>          
+            </div>
+        );
+    }
+}
+
+export default addCategoryIfAdmin;
+ 

+ 20 - 0
src/components/usersProtectPage/PrivateRoute.js

@@ -0,0 +1,20 @@
+import React from 'react';
+
+import { Route } from "react-router-dom";
+
+export default ({ component: Component, data, params, ...rest }) => (
+    <Route
+        {...rest}
+
+        render= {props =>{
+            
+            return <Component {...data}  {...props}  />
+
+        }}
+    />
+
+)
+
+
+
+

+ 16 - 0
src/components/usersProtectPage/index.js

@@ -0,0 +1,16 @@
+import React, { Component } from 'react';
+import { throws } from 'assert';
+
+class UsersProtect extends Component {
+    render() {
+        
+       const { id, name, email } = this.props
+        return (
+            <div>
+               { name } 
+            </div>
+        );
+    }
+}
+
+export default UsersProtect;

+ 84 - 0
src/constants/actionTypes.js

@@ -0,0 +1,84 @@
+// export const GET_INFO_SEARCH_STAFF_DATA = "GET_INFO_SEARCH_STAFF_DATA"
+
+//modalWindow
+    export const CLOSE_MODAL_WINDOW = "CLOSE_MODAL_WINDOW";
+
+//Category
+    //categoryAction    
+    export const CATEGORY_REQUEST = "CATEGORY_REQUEST";
+    export const CATEGORY_REQUEST_SUCCESS = "CATEGORY_REQUEST_SUCCESS";
+    export const CATEGORY_REQUEST_FAIL = "CATEGORY_REQUEST_FAIL";
+    export const POD_CATEGORY = "POD_CATEGORY";
+
+    //addNewCategoryAction
+    export const ADD_NEW_CATEGORY_REQUEST = "ADD_NEW_CATEGORY_REQUEST";
+    export const ADD_NEW_CATEGORY_REQUEST_SUCCESS = "ADD_NEW_CATEGORY_REQUEST_SUCCESS";
+    export const ADD_NEW_CATEGORY_REQUEST_FAIL = "ADD_NEW_CATEGORY_REQUEST_FAIL";
+
+    //getStaffByCategoryIdAction
+    export const CATEGORY_REQUEST_BY_ID = "CATEGORY_REQUEST_BY_ID";
+    export const CATEGORY_REQUEST_SUCCESS_BY_ID = "CATEGORY_REQUEST_SUCCESS_BY_ID";
+    export const CATEGORY_REQUEST_FAIL_BY_ID = "CATEGORY_REQUEST_FAIL_BY_ID";
+
+//Staff
+    //staffAction
+    export const GET_STAFF_INFO_DATA = "GET_STAFF_INFO_DATA";
+    export const STAFF_REQUEST = "STAFF_REQUEST";
+    export const STAFF_REQUEST_SUCCESS = "STAFF_REQUEST_SUCCESS";
+    export const STAFF_REQUEST_FAIL = "STAFF_REQUEST_FAIL";
+
+    //addNewStaffAction
+    export const ADD_NEW_STAFF_REQUEST = "ADD_NEW_STAFF_REQUEST";
+    export const ADD_NEW_STAFF_REQUEST_SUCCESS = "ADD_NEW_STAFF_REQUEST_SUCCESS";
+    export const ADD_NEW_STAFF_REQUEST_FAIL = "ADD_NEW_STAFF_REQUEST_FAIL";
+    export const PUSH_NEW_PHOTO_REQUEST = "PUSH_NEW_PHOTO_REQUEST";
+    export const PUSH_NEW_PHOTO_REQUEST_SUCCESS = "PUSH_NEW_PHOTO_REQUEST_SUCCESS";
+    export const PUSH_NEW_PHOTO_REQUEST_FAIL = "PUSH_NEW_PHOTO_REQUEST_FAIL";
+    export const BASE_64_REQUEST = "BASE_64_REQUEST";
+    export const BASE1_64_REQUEST = "BASE1_64_REQUEST";
+    export const BASE2_64_REQUEST = "BASE2_64_REQUEST";
+    export const BASE3_64_REQUEST = "BASE3_64_REQUEST";
+    //addNewStaffAction(PUT)
+    export const INPUT_CHANGE_VALUE = "INPUT_CHANGE_VALUE";
+    export const INPUT_CHANGE_VALUE1 = "INPUT_CHANGE_VALUE1";
+    export const INPUT_CHANGE_VALUE2 = "INPUT_CHANGE_VALUE2";
+    export const INPUT_CHANGE_VALUE3 = "INPUT_CHANGE_VALUE3";
+    export const EDIT_STAFF_REQUEST = "EDIT_STAFF_REQUEST";
+    export const EDIT_STAFF_REQUEST_SUCCESS = "EDIT_STAFF_REQUEST_SUCCESS";
+    export const EDIT_STAFF_REQUEST_FAIL = "EDIT_STAFF_REQUEST_FAIL";
+
+    //searchStaffAction
+    export const CHANGE_INPUT_VALUE = "CHANGE_INPUT_VALUE";
+    export const SEARCH_STAFF_REQUEST = "SEARCH_STAFF_REQUEST";
+    export const SEARCH_STAFF_REQUEST_SUCCESS = "SEARCH_STAFF_REQUEST_SUCCESS";
+    export const SEARCH_STAFF_REQUEST_FAIL = "SEARCH_STAFF_REQUEST_FAIL";
+
+    //getStaffByIdAction
+    export const STAFF_REQUEST_BY_ID = "STAFF_REQUEST_BY_ID";
+    export const STAFF_REQUEST_SUCCESS_BY_ID = "STAFF_REQUEST_SUCCESS_BY_ID";
+    export const STAFF_REQUEST_FAIL_BY_ID = "STAFF_REQUEST_FAIL_BY_ID";
+
+    //searchStaffByIdAction
+    export const SEARCH_STAFF_REQUEST_BY_ID = "SEARCH_STAFF_REQUEST_BY_ID";
+    export const SEARCH_STAFF_REQUEST_SUCCESS_BY_ID = "SEARCH_STAFF_REQUEST_SUCCESS_BY_ID";
+    export const SEARCH_STAFF_REQUEST_FAIL_BY_ID = "SEARCH_STAFF_REQUEST_FAIL_BY_ID";
+
+//User
+    //usersAuthAction
+    export const USER_AUTH_REQUEST = "USER_AUTH_REQUEST";
+    export const USER_AUTH_REQUEST_SUCCESS = "USER_AUTH_REQUEST_SUCCESS";
+    export const USER_AUTH_REQUEST_FAIL = "USER_AUTH_REQUEST_FAIL";
+    
+    //usersRegistrAction
+    export const USER_REG_REQUEST = "USER_REG_REQUEST";
+    export const USER_REG_REQUEST_SUCCESS = "USER_REG_REQUEST_SUCCESS";
+    export const USER_REG_REQUEST_FAIL = "USER_REG_REQUEST_FAIL";
+
+    //getUsersById
+    export const USER_AUTH_REQUEST_BY_ID = "USER_AUTH_REQUEST_BY_ID";
+    export const USER_AUTH_REQUEST_SUCCESS_BY_ID = "USER_AUTH_REQUEST_SUCCESS_BY_ID";
+    export const USER_AUTH_REQUEST_FAIL_BY_ID = "USER_AUTH_REQUEST_FAIL_BY_ID";
+    export const GET_PARAMS = "GET_PARAMS";
+
+
+    export const DELETE_STAFF = "DELETE_STAFF"

+ 52 - 0
src/container/AddNewCategory.js

@@ -0,0 +1,52 @@
+import React, { Component } from 'react';
+
+import { connect } from 'react-redux';
+import * as actions from '../actions/addNewCategoryAction';
+
+import { bindActionCreators } from 'redux';
+
+import FormAddNewCategory from '../components/FormsAdd/FormAddNewCategory';
+import EditModal from '../components/Modal/addNewStaffModal';
+
+
+class AddNewCategory extends Component {
+
+    closeEditModal = () => {
+        const { closeModal } = this.props;
+        closeModal();
+    }
+
+    render() {
+        const { AddNewCategory, isFetching, showModal, error } = this.props
+        const str = "Не все поля были заполнены или заполнены не верно"
+        return(
+            <div>
+                <div>
+                    <FormAddNewCategory AddNewCategory={AddNewCategory}
+                        isFetching={isFetching}
+                    /> 
+                </div>
+                <EditModal visible={showModal}
+                    onOk={this.closeEditModal}
+                    onCancel={this.closeEditModal}
+                    error={error}
+                    str={ str }
+                />
+            </div>      
+        )
+    }
+}
+
+const mapStateToProps = state =>({
+    categoryData: state.addCategory.categoryData,
+    isFetching: state.addCategory.isFetching,
+    showModal: state.addCategory.showModal,
+    error: state.addCategory.error
+})
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+
+export default AddNewCategory = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(AddNewCategory);

+ 75 - 0
src/container/AddNewStaff.js

@@ -0,0 +1,75 @@
+import React, { Component, Fragment } from 'react';
+
+import { connect } from 'react-redux';
+import { AddNewStaffAction, closeModal, pushPhoto, base64, base641, base642, base643 } from "../actions/addNewStaffAction";
+
+import { getUsersDataById } from "../actions/getUserById"
+
+import { bindActionCreators } from "redux";
+
+import FormAddNewStaff from '../components/FormsAdd/FormAddNewStaff';
+import EditModal from "../components/Modal/addNewStaffModal";
+
+class AddNewStaff extends Component {
+    componentDidMount() {
+
+        const { getUsersDataById } = this.props
+              let localS = JSON.parse(localStorage.getItem("login"));
+                if(localS===null){
+                }
+                else{
+                    getUsersDataById(localS)
+                }
+              
+    }
+    closeEditModal = () => {
+        const { closeModal } = this.props;
+        closeModal();
+    }
+    render() {
+        const { showModal, error } = this.props
+        const str = "Ваше объявление успешно добавлено"
+        return (
+
+            <Fragment>
+                <Fragment>
+                    <FormAddNewStaff {...this.props}
+
+                    />
+                </Fragment>
+                <EditModal visible={showModal}
+                    onOk={this.closeEditModal}
+                    onCancel={this.closeEditModal}
+                    error={error}
+                    str={ str }
+                />
+            </Fragment>
+
+        );
+    }
+}
+
+
+const mapStateToProps = state => ({
+    staffData: state.addStaff.staffData,
+    photo: state.addStaff.photo,
+    isFetching: state.addStaff.isFetching,
+    showModal: state.addStaff.showModal,
+    error: state.addStaff.error,
+    getUser: state.getUserById.getUser,
+    base64Photo: state.addStaff.base64Photo,
+    base64Photo1: state.addStaff.base64Photo1,
+    base64Photo2: state.addStaff.base64Photo2,
+    base64Photo3: state.addStaff.base64Photo3,
+    addOrnot: state.addStaff.addOrnot,
+    addOrnot1: state.addStaff.addOrnot1,
+    addOrnot2: state.addStaff.addOrnot2,
+    addOrnot3: state.addStaff.addOrnot3
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ AddNewStaffAction, getUsersDataById, closeModal, pushPhoto, base64, base641, base642,base643 }, dispatch);
+
+export default AddNewStaff = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(AddNewStaff);

+ 71 - 0
src/container/CategoryStaffInfo.js

@@ -0,0 +1,71 @@
+import React, { Component, Fragment } from 'react';
+import { connect} from 'react-redux';
+import { getCategorysDataById } from "../actions/getStaffByCategoryIdAction";
+import { getUsersDataById } from "../actions/getUserById"
+import { bindActionCreators } from "redux";
+
+import CategoryStaffs from '../components/CategoryStaffs'
+import LeftMenu from '../container/LeftMenu'
+import Header from '../container/Header'
+
+class CategoryStaffInfo extends Component {
+    
+    componentDidMount(){
+        const { getCategorysDataById, match, getUsersDataById } = this.props
+        getCategorysDataById(match.params.id)
+       
+        //getStaffsDataById(match.params.id)
+        let localS = JSON.parse(localStorage.getItem("login"));
+            if(localS===null){
+
+            }
+            else{
+                getUsersDataById(localS)
+            }
+        
+    }
+
+    componentDidUpdate(prevProps){
+        const { getCategorysDataById, match } = this.props
+        if(prevProps.match.params.id !==match.params.id ){
+            getCategorysDataById(match.params.id)
+        }
+    }
+
+    render() {
+        const { getUser } = this.props
+        const {  infoCategory, isFetching  } = this.props
+        console.log(this.props)
+        
+       
+        return (
+
+            <Fragment>
+  
+            
+                <Header  getUser={ getUser }/>
+                <div className="menuAndContent">
+                    <LeftMenu  getUser={ getUser }/>
+                    <CategoryStaffs infoCategory={infoCategory} isFetching={isFetching}  getUser={ getUser }  />
+
+                </div>
+            </Fragment>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+
+    infoCategory: state.categoryById.infoCategory,
+    isFetching: state.categoryById.isFetching,
+    trigger: state.categoryById.trigger,
+    getUser: state.getUserById.getUser,
+
+  });
+  
+  const mapDispatchToProps = dispatch => bindActionCreators({ getCategorysDataById, getUsersDataById }, dispatch);
+  
+  export default CategoryStaffInfo = connect(
+        mapStateToProps,
+        mapDispatchToProps
+  )(CategoryStaffInfo);

+ 42 - 0
src/container/Header.js

@@ -0,0 +1,42 @@
+import React, { Component } from 'react';
+import HeaderLogo from '../components/Header/logo'
+import SearchLine from '../components/Header/searchLine'
+import Myprofile from '../components/Header/Myprofile'
+import 'antd/dist/antd.css';
+
+import { connect } from 'react-redux';
+import * as actions from "../actions/searchStaffAction";
+import { getUsersData } from '../actions/usersAuthActions'
+import { bindActionCreators } from "redux";
+
+class Header extends Component {
+
+    render() {
+        const { inputData, searchStaff, changeInputValue, name, getUser, id } = this.props
+        return (
+            <div className="header">
+                <HeaderLogo />
+                <SearchLine inputData={inputData}
+                    searchStaff={searchStaff}
+                    changeInputValue={changeInputValue}
+                />
+                <Myprofile name={name}
+                    getUser={getUser}
+                    id={id}
+                />
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+    inputData: state.searchStaff.inputData,
+    isFetching: state.searchStaff.isFetching,
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions, getUsersData }, dispatch);
+
+export default Header = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(Header);

+ 47 - 0
src/container/LeftMenu.js

@@ -0,0 +1,47 @@
+import React, { Component, Fragment } from 'react';
+import { connect } from 'react-redux';
+import * as actions from "../actions/categoryAction";
+import { bindActionCreators } from "redux";
+
+import CategoryMenu from '../components/LeftMenu';
+
+class LeftMenu extends Component {
+
+    componentDidMount() {
+       
+        this.props.getCategoriesData();
+        
+        // this.props.getAllCategory()
+       
+    }
+
+    render() {
+        
+        const { allCategory, mainCategory, podCategory, isAdmin, getUser } = this.props
+        
+        return (
+            <Fragment>
+                <CategoryMenu allCategory={allCategory.data} 
+                    mainCategory={mainCategory} 
+                    podCategory={podCategory}
+                    isAdmin = { isAdmin }
+                    getUser={ getUser } 
+                    
+                />
+            </Fragment>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+    allCategory: state.category.allCategory,
+    mainCategory: state.category.mainCategory,
+    isFetching: state.category.isFetching,
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+
+export default LeftMenu = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(LeftMenu);

+ 65 - 0
src/container/MainPage.js

@@ -0,0 +1,65 @@
+import React, { Component, Fragment } from 'react';
+import { connect } from 'react-redux';
+
+import { getStaffsData } from "../actions/staffsAction";
+
+import { getUsersDataById } from "../actions/getUserById"
+
+import { bindActionCreators } from "redux";
+
+import Header from '../container/Header'
+import LeftMenu from '../container/LeftMenu'
+import AllStaffs from "../components/AllStaffs"
+
+class MainPage extends Component {
+   
+    componentDidMount() {
+        
+        const { getStaffsData, getUsersDataById } = this.props
+
+        getStaffsData()
+
+        let localS = JSON.parse(localStorage.getItem("login"));
+        if (localS === null) {
+
+        } else {
+            getUsersDataById(localS)
+        }
+
+    }
+
+    render() {
+        const { inputStaffs, isFetching, getUser } = this.props
+        const {  name, isAdmin, id } = this.props
+        let arr = [];
+        function compareNumeric(a, b) {
+            if (a.price > b.price) return 1;
+            if (a.price < b.price) return -1;
+          }
+          arr = inputStaffs.slice()
+      arr.sort(compareNumeric);
+        return (
+            <Fragment>
+                <Header name={ name } getUser={ getUser } id={ id }/>
+                <div className="menuAndContent">
+                    <LeftMenu isAdmin = {isAdmin} getUser={ getUser } />
+                    <AllStaffs inputStaffs={inputStaffs} arr={arr} isFetching={isFetching} isAdmin = {isAdmin} getUser={ getUser } />
+                </div>
+            </Fragment>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+    inputStaffs: state.staffs.inputStaffs,
+    isFetching: state.staffs.isFetching,
+    getUser: state.getUserById.getUser,
+    params: state.getUserById.params,
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ getStaffsData, getUsersDataById }, dispatch);
+
+export default MainPage = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(MainPage);

+ 54 - 0
src/container/MainPageStaffInfo.js

@@ -0,0 +1,54 @@
+import React, { Component, Fragment } from 'react';
+import { connect} from 'react-redux';
+import {getStaffsDataById} from "../actions/getStaffByIdAction";
+
+import { getUsersDataById } from "../actions/getUserById"
+
+import { bindActionCreators } from "redux";
+
+import FullInfoAboutStaff from '../components/AllStaffs/FullInfoAboutStaff'
+import LeftMenu from '../container/LeftMenu'
+import Header from '../container/Header'
+
+class MainPageStaffInfo extends Component {
+        componentDidMount(){
+            const { getStaffsDataById, match, getUsersDataById } = this.props
+            getStaffsDataById(match.params.id)
+            let localS = JSON.parse(localStorage.getItem("login"));
+                if(localS===null){
+
+                }
+                else{
+                    getUsersDataById(localS)
+                }
+        }
+    render() {
+            const { getUser } = this.props
+        return (
+            <Fragment>
+
+                <Header getUser={ getUser } />
+                <div className="menuAndContent">
+                    <LeftMenu getUser={ getUser }/>
+                    <FullInfoAboutStaff {...this.props} />
+                </div>
+
+            </Fragment>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+
+    InfoStaff: state.staffById.infoStaffs,
+    isFetching: state.staffById.isFetching,
+    getUser: state.getUserById.getUser,
+
+  });
+  
+  const mapDispatchToProps = dispatch => bindActionCreators({ getUsersDataById, getStaffsDataById }, dispatch);
+  
+  export default MainPageStaffInfo = connect(
+        mapStateToProps,
+        mapDispatchToProps
+  )(MainPageStaffInfo);

+ 61 - 0
src/container/SearchStaff.js

@@ -0,0 +1,61 @@
+import React, { Component, Fragment } from 'react';
+
+import { connect } from 'react-redux';
+import { searchStaff } from "../actions/searchStaffAction";
+
+
+import { getUsersDataById } from "../actions/getUserById"
+
+import { bindActionCreators } from "redux";
+
+
+
+import SearchStaffsPage from "../components/SearchStaffsPage"
+import LeftMenu from '../container/LeftMenu'
+import Header from '../container/Header'
+
+
+
+
+class SearchStaff extends Component {
+    componentDidMount() {
+        const { searchStaff, match, getUsersDataById } = this.props
+        searchStaff(match.params.title)
+        let localS = JSON.parse(localStorage.getItem("login"));
+        if (localS === null) {
+
+        }
+        else {
+            getUsersDataById(localS)
+        }
+    }
+    render() {
+        const { getUser } = this.props
+
+        console.log(this.props)
+
+        return ( 
+          <Fragment>
+          <Header  getUser={ getUser } />
+          <div className="menuAndContent">
+              <LeftMenu    getUser={ getUser }/>
+              <SearchStaffsPage {...this.props} />
+          </div>
+          </Fragment>       
+        );
+    }
+}
+
+
+const mapStateToProps = state => ({
+    searchData: state.searchStaff.searchData,
+    isFetching: state.searchStaff.isFetching,
+    getUser: state.getUserById.getUser,
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ searchStaff, getUsersDataById }, dispatch);
+
+export default SearchStaff = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(SearchStaff);

+ 52 - 0
src/container/SearchStaffsInfo.js

@@ -0,0 +1,52 @@
+import React, { Component, Fragment } from 'react';
+import { connect} from 'react-redux';
+import {getSeacrhStaffsDataById} from "../actions/searchStaffByIdAction";
+
+import { getUsersDataById } from "../actions/getUserById"
+
+import { bindActionCreators } from "redux";
+
+import SearchFullInfoStaff from '../components/SearchStaffsPage/SearchFullInfoStaff'
+import LeftMenu from '../container/LeftMenu'
+import Header from '../container/Header'
+
+class SearchInfoStaffsInfo extends Component {
+        componentDidMount(){
+            const { getSeacrhStaffsDataById, match, getUsersDataById } = this.props
+            getSeacrhStaffsDataById(match.params.id)
+            let localS = JSON.parse(localStorage.getItem("login"));
+            if(localS===null){
+
+            }
+            else{
+                getUsersDataById(localS)
+            }
+        }
+    render() {
+        const {  getUser } = this.props
+        return (
+            <Fragment>
+                <Header getUser={ getUser } />
+                <div className="menuAndContent">
+                    <LeftMenu getUser={ getUser } />
+                    <SearchFullInfoStaff {...this.props}/>
+                </div>
+            </Fragment>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+
+    fullInfoSearchData: state.searchStaffById.fullInfoSearchData,
+    isFetching: state.searchStaffById.isFetching,
+    getUser: state.getUserById.getUser,
+
+  });
+  
+  const mapDispatchToProps = dispatch => bindActionCreators({ getSeacrhStaffsDataById, getUsersDataById }, dispatch);
+  
+  export default SearchInfoStaffsInfo = connect(
+        mapStateToProps,
+        mapDispatchToProps
+  )(SearchInfoStaffsInfo);

+ 79 - 0
src/container/UserProfile.js

@@ -0,0 +1,79 @@
+import React, { Component, Fragment } from 'react';
+
+import { Link } from "react-router-dom";
+
+import { connect } from 'react-redux';
+
+import { getUsersData } from "../actions/usersAuthActions";
+
+import { getUsersDataById } from "../actions/getUserById"
+
+import { getParams } from "../actions/getUserById"
+
+import { bindActionCreators } from "redux";
+
+import Header from '../container/Header'
+
+class UserProfile extends Component {
+
+    singOut = () => {
+        const { getParams, match } = this.props
+        localStorage.removeItem("login")
+        getParams(match.params.id)
+    }
+
+    componentDidMount() {
+        const { getUsersDataById } = this.props
+        console.log(this.props);
+
+
+        let localS = JSON.parse(localStorage.getItem("login"));
+        if (localS === null) {
+
+        }
+        else {
+            getUsersDataById(localS)
+        }
+    }
+    render() {
+
+        const { getUser } = this.props
+
+        return (
+
+            <Fragment>
+                <Header getUser={getUser} />
+                <div className="menuAndContent">
+                    <div className="profil">
+                        <h2>{getUser.name}</h2>
+                        <div className="profilData">
+                            <p>{getUser.login}</p>
+                            <p>{getUser.email}</p>
+                            <p>{getUser.phone}</p>
+                            <div className="buttonConteiner">
+                                <Link to="/activeStaffs"><button className="profilLink">Активные Товары</button></Link>
+                                <Link to="/"><button className="profilBtn" onClick={this.singOut}>Выход</button></Link>
+                            </div>
+                        </div>
+                    </div>
+
+                </div>
+            </Fragment>
+
+        );
+    }
+}
+
+
+const mapStateToProps = state => ({
+    inputData: state.usersAuth.inputData,
+    getUser: state.getUserById.getUser,
+
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ getUsersData, getUsersDataById, getParams }, dispatch);
+
+export default UserProfile = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(UserProfile);

+ 125 - 0
src/container/activeStaffs.js

@@ -0,0 +1,125 @@
+import React, { Component } from 'react';
+
+import { getUsersDataById, deleteStaffById } from "../actions/getUserById"
+
+import { Link } from "react-router-dom";
+import { Icon } from 'antd';
+import { connect } from 'react-redux';
+
+import { bindActionCreators } from "redux";
+
+import Header from '../container/Header'
+import { stat } from 'fs';
+
+
+
+class activeStaffs extends Component {
+    componentDidUpdate(prevProps){   
+        if(prevProps.del !== this.props.del){
+            const { getUsersDataById } = this.props
+
+        let localS = JSON.parse(localStorage.getItem("login"));
+        if (localS === null) {
+
+        }
+        else {
+            getUsersDataById(localS)
+        }
+        }
+    }
+    componentDidMount() {
+        const { getUsersDataById } = this.props
+
+        let localS = JSON.parse(localStorage.getItem("login"));
+        if (localS === null) {
+
+        }
+        else {
+            getUsersDataById(localS)
+        }
+    }
+    deleteStaff = (id) => {
+        const { deleteStaffById } = this.props
+        var qs = require("querystring");
+var http = require("http");
+
+var options = {
+  "method": "DELETE",
+  "hostname": [
+   "127.0.0.1:2000/api/staffs"
+  ],
+  "headers": {
+    "Content-Type": "application/x-www-form-urlencoded",
+    "cache-control": "no-cache",
+    "mode":'cors'
+  }
+};
+
+var req = http.request(options, function (res) {
+  var chunks = [];
+
+  res.on("data", function (chunk) {
+    chunks.push(chunk);
+  });
+
+  res.on("end", function () {
+    var body = Buffer.concat(chunks);
+    deleteStaffById(body.toString());
+  });
+});
+
+req.write(qs.stringify({ id: `${id}`, undefined: undefined }));
+req.end();
+    }
+    render() {
+
+        const { getUser } = this.props
+        const { name, id, del } = this.props
+        const { staffs } = getUser
+        
+        
+        return (
+            <div >
+                <Header name={name} getUser={getUser} id={id} />
+
+                <div className="menuAndContent">
+                    <div className="contentStaffs">
+                        <div className="staffs">
+                            {staffs !== undefined && staffs.reverse().map((el, key) => <div className="staff" key={key}>
+                                {el.state ? <img src={el.img.substr(0, 53)} width="325" height="190" className="imgStaff" alt="lorem" /> : <img src={el.img} width="325" height="190" className="imgStaff" alt="lorem" />}
+                                <div className="titlleAndPrice">
+                                    <h4>{el.title}</h4>
+                                    <h4>Цена: {el.price}</h4>
+                                </div>
+                                <div className="titlleAndPrice">
+                                    <Link to={`/activeStaffs/${el.id}`} className="allMyStaff">
+                                        <Icon type="edit" style={{ fontSize: '30px' }} />
+                                    </Link>
+                                    <button className="Exit" onClick={() => this.deleteStaff(el.id)} >
+                                        <Icon type="delete" style={{ fontSize: '30px' }} />
+                                    </button>
+                                </div>
+                            </div>
+                            )}
+                        </div>
+                    </div>
+                </div>
+
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+    getUser: state.getUserById.getUser,
+    params: state.getUserById.params,
+    del: state.getUserById.del
+
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ getUsersDataById, deleteStaffById }, dispatch);
+
+export default activeStaffs = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(activeStaffs);

+ 88 - 0
src/container/redactorForm.js

@@ -0,0 +1,88 @@
+import React, { Component, Fragment } from 'react';
+import { connect } from 'react-redux';
+import { bindActionCreators } from "redux";
+
+import { getUsersDataById } from "../actions/getUserById"
+import { getCategoriesData } from '../actions/categoryAction';
+import { getStaffsDataById } from "../actions/getStaffByIdAction"
+import {  inputchangeHandler, inputchangeHandler1, inputchangeHandler2, inputchangeHandler3, EditStaffAction, closeModal, pushPhoto, base64, base641, base642, base643 } from "../actions/addNewStaffAction"; 
+
+import FormRedactorStaff from '../components/FormsAdd/redForm'
+import EditModal from "../components/Modal/addNewStaffModal";
+
+class redactorForm extends Component {
+    // componentDidUpdate(prevProps){
+    //     const {getStaffsDataById, match } = this.props
+    //     console.log(prevProps, this.props)
+        
+    // }
+    componentDidMount(){
+        const { getStaffsDataById, match, getUsersDataById } = this.props
+        getStaffsDataById(match.params.id)
+            this.props.getCategoriesData();
+            let localS = JSON.parse(localStorage.getItem("login"));
+        if(localS===null){
+        }
+        else{
+            getUsersDataById(localS)
+        }     
+
+    }
+    closeEditModal = () => {
+        const { closeModal } = this.props;
+        closeModal();
+    }
+    render() {
+        const { allCategory } = this.props
+        const str = "Объявление успешно отредактировано"
+        let data; 
+        if (allCategory.data===undefined){
+            data = []
+        }
+        else{ 
+            data = <Fragment>
+            <FormRedactorStaff {...this.props}/>  
+            <EditModal visible={this.props.showModal}
+            onOk={this.closeEditModal}
+            onCancel={this.closeEditModal}
+ 
+            str={ str }   
+        /> 
+                </Fragment>
+        }
+       
+        return (
+            <div>
+              {data}  
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+    allCategory: state.category.allCategory,
+    InfoStaff: state.staffById.infoStaffs,
+    isFetching: state.staffById.isFetching,
+    getUser: state.getUserById.getUser,
+    photo: state.addStaff.photo,
+    inputData: state.addStaff.inputData,
+    inputData1: state.addStaff.inputData1,
+    inputData2: state.addStaff.inputData2,
+    inputData3: state.addStaff.inputData3,
+    showModal: state.addStaff.showModal,
+    base64Photo: state.addStaff.base64Photo,
+    base64Photo1: state.addStaff.base64Photo1,
+    base64Photo2: state.addStaff.base64Photo2,
+    base64Photo3: state.addStaff.base64Photo3,
+    addOrnot: state.addStaff.addOrnot,
+    addOrnot1: state.addStaff.addOrnot1,
+    addOrnot2: state.addStaff.addOrnot2,
+    addOrnot3: state.addStaff.addOrnot3
+  });
+  
+  const mapDispatchToProps = dispatch => bindActionCreators({ base64, base641, base642, base643, closeModal, getUsersDataById, getStaffsDataById, getCategoriesData, pushPhoto, inputchangeHandler, inputchangeHandler1, inputchangeHandler2, inputchangeHandler3, EditStaffAction }, dispatch);
+  
+  export default redactorForm = connect(
+        mapStateToProps,
+        mapDispatchToProps
+  )(redactorForm);

+ 50 - 0
src/container/renderAuthorisation.js

@@ -0,0 +1,50 @@
+import React, { Component, Fragment } from "react";
+import { bindActionCreators } from "redux";
+import { connect} from 'react-redux';
+
+import Form from "../components/Auth/authorisation";
+
+import LinkHome from "../components/Btn/linkHome"
+
+import { getUsersData, closeModal } from "../actions/usersAuthActions";
+
+
+import EditModal from "../components/Modal";
+
+class RenderAuthorisation extends Component { 
+  closeEditModal = () => {
+    const { closeModal } = this.props;
+    closeModal();
+}     
+    render() {
+      const { showModal, inputData } = this.props
+      const str = "Данные введены верно";
+     
+      return (
+        <Fragment>
+          <LinkHome />
+          <Form {...this.props} /> 
+          <EditModal visible={showModal}
+                    onOk={this.closeEditModal}
+                    onCancel={this.closeEditModal}
+                    str={ str }
+                    inputData={ inputData }
+                />
+        </Fragment>       
+
+      );
+    }
+}
+
+
+const mapStateToProps = state => ({
+  inputData: state.usersAuth.inputData,
+  showModal: state.usersAuth.showModal
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ getUsersData, closeModal }, dispatch);
+
+export default RenderAuthorisation = connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(RenderAuthorisation);

+ 44 - 0
src/container/renderRegistration.js

@@ -0,0 +1,44 @@
+import React, { Component } from "react";
+import { bindActionCreators } from "redux";
+import { connect } from 'react-redux';
+
+
+import { postUsersData, closeModal } from "../actions/usersRegistrActions";
+import EditModal from "../components/Modal";
+import RegistrForm from "../components/Auth/registration";
+import LinkHome from "../components/Btn/linkHome"
+
+class RenderRegistration extends Component {
+    closeEditModal = () => {
+        const { closeModal } = this.props;
+        closeModal();
+    } 
+    render() {
+        const str = "Вы успешно зарегестрировались";
+        return (
+            <div className="formdiv">
+                <LinkHome />
+                <RegistrForm {...this.props} />
+                <EditModal visible={this.props.showModal}
+                    onOk={this.closeEditModal}
+                    onCancel={this.closeEditModal}
+                    str={ str }
+                    inputData={ this.props.inputData }
+                />
+            </div>
+        );
+    }
+}
+
+
+const mapStateToProps = state => ({
+    showModal: state.usersRegistr.showModal,
+    inputData: state.usersRegistr.inputData
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ postUsersData, closeModal }, dispatch);
+
+export default RenderRegistration = connect(
+    mapStateToProps,
+    mapDispatchToProps
+)(RenderRegistration);

BIN
src/img/depositphotos_80275194-stock-illustration-russian-old-fair-bazaar-vector.jpg


BIN
src/img/logoBazar — копия.png


BIN
src/img/logoBazar.jpg


BIN
src/img/logoBazar.png


BIN
src/img/no.jpg


+ 85 - 0
src/index.css

@@ -12,3 +12,88 @@ code {
   font-family: source-code-pro, Menlo, Monaco, Consolas, "Courier New",
     monospace;
 }
+.logo{
+  
+  width: 20%;
+}
+.header{
+  display:flex;
+  
+}
+.searchLine{
+  width: 60%;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  
+  
+}
+.searchInput{
+  width: 80%;
+}
+.auth{
+  width: 20%;
+  display: flex;
+  
+  justify-content: center;
+  align-items: center;
+}
+.avatar{
+  padding: 0 10px;
+}
+.link{
+  display: flex;
+  
+  justify-content: center;
+  align-items: center;
+}
+.ras{
+  display: flex;
+}
+.ras1{
+  display: flex;
+  width: 20%;
+}
+.ras2{
+  display: flex;
+  width: 300px;
+  height: 300px;
+}
+.as{
+  border: 4px outset;
+  border-radius: 5px;
+  margin: 5px;
+}
+.img{
+  width: 250px;
+  height: 250px;
+  
+}
+.staffs{
+  display:flex;
+ 
+}
+.staff{
+  width: 250px;
+  height: 250px;
+}
+.topbutton {
+  width:50px;
+  border:2px solid #ccc;
+  background:#f7f7f7;
+  text-align:center;
+  padding:10px;
+  position:fixed;
+  bottom:50px;
+  right:50px;
+  cursor:pointer;
+  color:#333;
+  font-family:verdana;
+  font-size:12px;
+  border-radius: 50px;
+  -moz-border-radius: 50px;
+  -webkit-border-radius: 50px;
+  -khtml-border-radius: 50px;
+  }
+
+  

+ 18 - 6
src/index.js

@@ -1,12 +1,24 @@
 import React from 'react';
+import { Provider } from "react-redux";
+import { BrowserRouter } from "react-router-dom";
 import ReactDOM from 'react-dom';
-import './index.css';
-import App from './App';
+
 import * as serviceWorker from './serviceWorker';
 
-ReactDOM.render(<App />, document.getElementById('root'));
+import Router from "./router";
+import store from "./state/state";
+
+
+
+import "./style/index.scss";
+
+ReactDOM.render(
+    <BrowserRouter>
+        <Provider store={store}>
+            <Router/>
+        </Provider>
+    </BrowserRouter>,
+    document.getElementById("root")
+);
 
-// If you want your app to work offline and load faster, you can change
-// unregister() to register() below. Note this comes with some pitfalls.
-// Learn more about service workers: http://bit.ly/CRA-PWA
 serviceWorker.unregister();

+ 43 - 0
src/reducer/addCategory.js

@@ -0,0 +1,43 @@
+import * as types from '../constants/actionTypes';
+
+const initState = {
+    categoryData: [],
+    isFetching: false,
+    error: null,
+    showModal: false
+}
+
+export default ( state = initState, { type, payload } ) => {
+    
+    switch (type){
+        case types.ADD_NEW_CATEGORY_REQUEST: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+        case types.ADD_NEW_CATEGORY_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                categoryData: state.categoryData.concat(JSON.parse(payload.config.data)),
+                isFetching:false,
+                showModal: true
+            }
+        }
+        case types.ADD_NEW_CATEGORY_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                showModal: true
+            }
+        }
+        case types.CLOSE_MODAL_WINDOW: {
+            return {
+                ...state,
+                showModal: false
+            }
+        }
+         default: return state;
+    }
+}

+ 189 - 0
src/reducer/addStaff.js

@@ -0,0 +1,189 @@
+import * as types from '../constants/actionTypes';
+
+const initState = {
+    addOrnot: false,
+    addOrnot1: false,
+    addOrnot2: false,
+    addOrnot3: false,
+    base64Photo: "",
+    base64Photo1: "",
+    base64Photo2: "",
+    base64Photo3: "",
+    inputData: '',
+    inputData1: '',
+    inputData2: null,
+    inputData3: null,
+    staffData: [],
+    photo: [],
+    editData: [],
+    isFetching: false,
+    error: null,
+    showModal: false
+}
+
+export default ( state = initState, { type, payload } ) => {
+    
+    switch (type){
+        case types.ADD_NEW_STAFF_REQUEST: {
+            return {
+                ...state,
+                isFetching: true,
+                base64Photo: "",
+                base64Photo1: "",
+                base64Photo2: "",
+                base64Photo3: "",
+                photo: [],
+                addOrnot: false,
+                addOrnot1: false,
+                addOrnot2: false,
+                addOrnot3: false,
+                
+            }
+        }
+        case types.ADD_NEW_STAFF_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                staffData: state.staffData.concat(JSON.parse(payload.config.data)),
+                isFetching:false,
+                showModal: true,
+                error: null
+            }
+        }
+        case types.ADD_NEW_STAFF_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                showModal: true
+            }
+        }
+        case types.CLOSE_MODAL_WINDOW: {
+            return {
+                ...state,
+                showModal: false
+            }
+        }
+        case types.PUSH_NEW_PHOTO_REQUEST: {
+            return {
+                ...state,
+                isFetching: true,
+            }
+        }
+        case types.PUSH_NEW_PHOTO_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                photo: state.photo.concat(payload),
+                isFetching: false,
+               
+            }
+        }
+        case types.PUSH_NEW_PHOTO_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                
+            }
+        }
+        case types.INPUT_CHANGE_VALUE: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                inputData: payload
+                
+            }
+        }
+        case types.INPUT_CHANGE_VALUE1: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                inputData1: payload
+                
+            }
+        }
+        case types.INPUT_CHANGE_VALUE2: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                inputData2: payload
+                
+            }
+        }
+        case types.INPUT_CHANGE_VALUE3: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                inputData3: payload
+                
+            }
+        }
+        case types.EDIT_STAFF_REQUEST: {
+            return {
+                ...state,
+                isFetching: true,
+                base64Photo: "",
+                base64Photo1: "",
+                base64Photo2: "",
+                base64Photo3: "",
+                photo: [],
+                addOrnot: false,
+                addOrnot1: false,
+                addOrnot2: false,
+                addOrnot3: false,
+            }
+        }
+        case types.EDIT_STAFF_REQUEST_SUCCESS: {
+            return {
+                ...state,
+               
+                isFetching:false,
+                showModal: true
+            }
+        }
+        case types.EDIT_STAFF_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "error",
+                showModal: true
+            }
+        }
+        case types.BASE_64_REQUEST: {
+            return {
+            ...state,
+            isFetching: false,
+            base64Photo: payload,
+            addOrnot: !state.addOrnot
+            }
+          }
+          case types.BASE1_64_REQUEST: {
+            return {
+            ...state,
+            isFetching: false,
+            base64Photo1: payload,
+            addOrnot1: !state.addOrnot1
+            }
+          }
+          case types.BASE2_64_REQUEST: {
+            return {
+            ...state,
+            isFetching: false,
+            base64Photo2: payload,
+            addOrnot2: !state.addOrnot2
+            }
+          }
+          case types.BASE3_64_REQUEST: {
+            return {
+            ...state,
+            isFetching: false,
+            base64Photo3: payload,
+            addOrnot3: !state.addOrnot3
+            }
+          }
+         default: return state;
+    }
+}

+ 49 - 0
src/reducer/category.js

@@ -0,0 +1,49 @@
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    allCategory: [],
+    mainCategory: [],
+    podcategory: [],
+    isFetching: false,
+    error: null
+};
+
+export default (state = initState, { type, payload }) => {
+        
+    switch (type) {
+        
+        case types.CATEGORY_REQUEST: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+
+        case types.CATEGORY_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                isFetching: false,
+                allCategory: payload,
+                mainCategory: payload.data.filter(el => el.parentId === 0),
+                podcategory: payload.data.filter(el => el.parentId === 0),
+            }
+        }
+
+        case types.CATEGORY_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "ERROR"
+            }
+        }
+
+        case types.POD_CATEGORY: {
+            return {
+                ...state,
+                podcategory: state.allCategory.filter(el => el.parentId === payload),
+            }
+        }
+
+        default: return state;
+    }
+};

+ 35 - 0
src/reducer/categoryById.js

@@ -0,0 +1,35 @@
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    infoCategory: [],
+    isFetching: false,
+    error: null,
+};
+
+export default (state = initState, { type, payload }) => {
+    switch (type) {
+
+        case types.CATEGORY_REQUEST_BY_ID: {
+            return {
+                ...state,
+                isFetching: true,
+                infoCategory: [],
+            }
+        }
+        case types.CATEGORY_REQUEST_SUCCESS_BY_ID: {
+            return {
+                ...state,
+                isFetching: false,
+                infoCategory: payload.data.staffs,
+            }
+        }
+        case types.CATEGORY_REQUEST_FAIL_BY_ID: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "ERROR"
+            }
+        }
+        default: return state;
+    }
+};

+ 54 - 0
src/reducer/getUserById.js

@@ -0,0 +1,54 @@
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    getUser: [],
+    isFetching: false,
+    error: null,
+    params: null,
+    del: ""
+    
+  };
+
+export default (state = initState, {type, payload} ) => {
+    
+    switch(type) {
+        case types.USER_AUTH_REQUEST_BY_ID: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+        case types.USER_AUTH_REQUEST_SUCCESS_BY_ID: {
+            
+            return {
+                ...state,
+                getUser: payload.data,
+                isFetching: false,
+                del: ""
+            }
+        }
+        case types.USER_AUTH_REQUEST_FAIL_BY_ID: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "ERROR"
+            }
+        }
+        case types.GET_PARAMS: {
+            return {
+                ...state,
+                params: payload
+            }
+        }
+        case types.DELETE_STAFF: {
+            return {
+            ...state,
+            isFetching: false,
+            error: "ERROR",
+            del: payload
+            }
+          }
+        default: return state;
+
+    }
+};

+ 35 - 0
src/reducer/index.js

@@ -0,0 +1,35 @@
+import { combineReducers } from "redux";
+import { reducer as formReducer } from 'redux-form';
+
+import usersRegistration from './usersRegistration'
+import usersAuthorisation from './usersAuthorisation'
+import getUserById from './getUserById'
+
+import staffs from './staffs'
+import searchStaff from './searchStaff'
+import addStaff from './addStaff'
+import staffById from './staffsById'
+import searchStaffById from './searchStaffById'
+
+import category from './category'
+import addCategory from './addCategory'
+import categoryById from './categoryById'
+
+export default  combineReducers({
+    usersRegistr: usersRegistration,
+    usersAuth: usersAuthorisation,
+    getUserById,
+    
+    staffs,
+    searchStaff,
+    addStaff,
+
+    staffById,
+    searchStaffById,
+
+    category,
+    addCategory,
+    categoryById,
+
+    form: formReducer
+})

+ 46 - 0
src/reducer/searchStaff.js

@@ -0,0 +1,46 @@
+import * as types from '../constants/actionTypes'
+
+const initState = {
+    inputData: "",
+    searchData: [], 
+    isFetching: false,
+    error: null,
+}
+
+export default (state = initState, { type, payload }) => {
+    
+    switch(type) {
+        case types.CHANGE_INPUT_VALUE: {
+            return {
+                ...state,
+                inputData: payload
+            }
+        }
+        case types.SEARCH_STAFF_REQUEST: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+        case types.SEARCH_STAFF_REQUEST_SUCCESS: {
+            
+            return {
+                ...state,
+                isFetching: false,
+                searchData: payload.data
+            }
+        }
+        
+        case types.SEARCH_STAFF_REQUEST_FAIL: {
+            
+            return {
+                ...state,
+                isFetching:false,
+                error: "error"
+            }
+        }
+       
+
+        default: return state;
+    }
+}

+ 41 - 0
src/reducer/searchStaffById.js

@@ -0,0 +1,41 @@
+
+
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    fullInfoSearchData: [],
+    isFetching: false,
+    error: null
+  };
+
+  export default (state = initState, { type, payload }) => {
+      
+      switch (type) {
+        
+        case types.SEARCH_STAFF_REQUEST_BY_ID: {
+          return {
+          ...state,
+          isFetching: true,
+           
+          
+          }
+        } 
+        case types.SEARCH_STAFF_REQUEST_SUCCESS_BY_ID: { 
+          return {
+          ...state,
+          isFetching: false,
+          fullInfoSearchData: [payload.data]
+          }
+        }
+        case types.SEARCH_STAFF_REQUEST_FAIL_BY_ID: {
+          return {
+          ...state,
+          isFetching: false,
+          error: "ERROR"
+          }
+        }
+        default: return state;    
+    }
+  };
+
+  

+ 40 - 0
src/reducer/staffs.js

@@ -0,0 +1,40 @@
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    inputStaffs: [],
+    infoStaffs: [],
+    isFetching: false,
+    error: null
+};
+
+export default (state = initState, { type, payload }) => {
+    switch (type) {
+        case types.STAFF_REQUEST: {
+            return {
+                ...state,
+                isFetching: true
+            }
+        }
+        case types.STAFF_REQUEST_SUCCESS: {
+            return {
+                ...state,
+                isFetching: false,
+                inputStaffs: payload.data.reverse()
+            }
+        }
+        case types.STAFF_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFetching: false,
+                error: "ERROR"
+            }
+        }
+        case types.GET_STAFF_INFO_DATA: {
+            return {
+                ...state,
+                infoStaffs: payload
+            }
+        }
+        default: return state;
+    }
+};  

+ 48 - 0
src/reducer/staffsById.js

@@ -0,0 +1,48 @@
+
+
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    infoStaffs: [],
+    isFetching: false,
+    error: null,
+    
+  };
+
+  export default (state = initState, { type, payload }) => {
+      
+      switch (type) {
+        
+        case types.STAFF_REQUEST_BY_ID: {
+          return {
+          ...state,
+          isFetching: true,
+          }
+        } 
+        case types.STAFF_REQUEST_SUCCESS_BY_ID: { 
+          return {
+          ...state,
+          isFetching: false,
+          infoStaffs: [payload.data]
+          }
+        }
+        case types.STAFF_REQUEST_FAIL_BY_ID: {
+          return {
+          ...state,
+          isFetching: false,
+          error: "ERROR"
+          }
+        }
+        case types.DELETE_STAFF: {
+          return {
+          ...state,
+          isFetching: false,
+          error: "ERROR",
+          del: payload
+          }
+        }
+        default: return state;    
+    }
+  };
+
+  

+ 54 - 0
src/reducer/usersAuthorisation.js

@@ -0,0 +1,54 @@
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    inputData: [],
+    isFetching: false,
+    
+    trig: true,
+    showModal: false
+  };
+
+export default (state = initState, {type, payload} ) => {
+ 
+    switch(type) {
+        case types.USER_AUTH_REQUEST: {
+            return {
+                ...state,
+                isFatching: true,
+            }
+        }
+        case types.USER_AUTH_REQUEST_SUCCESS: {
+            
+            if (payload.data===null){
+                payload.data = false
+            }
+            else if (payload.data!==null && payload.data.id !==undefined ){
+                const { id } = payload.data
+                localStorage.setItem("login",JSON.stringify(id))
+            }
+            return {
+                ...state,
+                inputData: payload.data,
+                isFatching: false,
+                showModal: true,
+                
+            }
+        }
+        case types.USER_AUTH_REQUEST_FAIL: {
+            return {
+                ...state,
+                isFatching: false,
+                error: "ERROR",
+            }
+        }
+        case types.CLOSE_MODAL_WINDOW: {
+            return {
+                ...state,
+                showModal: false
+            }
+        }
+        
+        
+        default: return state;
+    }
+};

+ 46 - 0
src/reducer/usersRegistration.js

@@ -0,0 +1,46 @@
+import * as types from "../constants/actionTypes";
+
+const initState = {
+    inputData: [],
+    isFetching: false,
+    error: null,
+    showModal: false
+  };
+
+  export default (state = initState, { type, payload }) => {
+    
+      switch (type) {
+        case types.USER_REG_REQUEST: {
+          return {
+          ...state,
+          inputData: payload,
+          isFetching: true
+          }
+        }
+
+        case types.USER_REG_REQUEST_SUCCESS: {
+          return {
+            ...state,
+            isFetching: false,
+            inputData: payload.data,
+            showModal: true
+          }
+        }
+
+        case types.USER_REG_REQUEST_FAIL: {
+          return {
+            ...state,
+            isFetching: false,
+            error: "ERROR"
+          }
+        }
+        case types.CLOSE_MODAL_WINDOW: {
+          return {
+              ...state,
+              showModal: false
+          }
+      }
+        
+        default: return state;    
+    }
+  };

+ 71 - 0
src/router.js

@@ -0,0 +1,71 @@
+import React, { Component, Fragment } from "react";
+import { Switch, Route, withRouter } from "react-router-dom";
+import { connect } from 'react-redux';
+import { bindActionCreators } from "redux";
+
+
+import MainPage from "./container/MainPage";
+
+import RenderAuthorisation from "./container/renderAuthorisation"
+import RenderRegistration from "./container/renderRegistration"
+import CategoryStaffInfo from './container/CategoryStaffInfo'
+import MainPageStaffInfo from './container/MainPageStaffInfo'
+import SearchStaffs from './container/SearchStaff'
+import SearchStaffsInfo from './container/SearchStaffsInfo'
+import AddNewStaff from './container/AddNewStaff'
+import AddNewCategory from './container/AddNewCategory'
+import ActiveStaffs from './container/activeStaffs'
+import redactorForm from './container/redactorForm'
+// import Form from './components/Auth/index'
+// import RegistrForm from './components/Auth/registration'
+// import UserProtect from './components/usersProtectPage/'
+// import UserProfile from './components/Header/Myprofile'
+import PrivateRoute from './components/usersProtectPage/PrivateRoute'
+import userProfile from  './container/UserProfile'
+
+import { getUsersDataById } from "./actions/getUserById"
+
+import { getUsersData } from './actions/usersAuthActions'
+
+
+
+class Router extends Component {
+
+   render() {
+       
+       const { inputData, params} = this.props
+      
+       return (
+    <Fragment>
+	    <Switch>
+            <PrivateRoute path="/"   data= { inputData } params = {params} exact component={MainPage} />
+            <Route path="/user/:id" exact component={userProfile} />
+            <Route path="/authorisation" exact component={RenderAuthorisation} />
+            <Route path="/auth" exact component= {RenderAuthorisation}/>
+            <Route path="/registration" exact component={RenderRegistration} />
+            <Route path="/category/staff/:id" exact component={CategoryStaffInfo} />
+            <Route path="/staff/:id" exact component={MainPageStaffInfo} />
+            <Route path="/search/:title"   exact component={SearchStaffs} />
+                <Route path="/search/Staff/:id" exact component={SearchStaffsInfo} />
+            <Route path="/newStaff" exact component={AddNewStaff} />
+            <Route path="/addCategory" exact component={AddNewCategory} />
+            <Route path="/activeStaffs" exact component={ ActiveStaffs } />
+            <Route path="/activeStaffs/:id" exact component={ redactorForm } />
+	    </Switch>
+    </Fragment>
+       )
+   }
+
+}
+
+const mapStateToProps = state => ({
+    inputData: state.usersAuth.inputData,
+    params: state.getUserById.params,
+})
+const mapDispatchToProps = dispatch => bindActionCreators({ getUsersData, getUsersDataById }, dispatch);
+
+export default withRouter(connect(
+    mapStateToProps, 
+    mapDispatchToProps
+)(Router));
+

+ 10 - 0
src/state/state.js

@@ -0,0 +1,10 @@
+
+import { createStore, applyMiddleware} from "redux";
+
+import thunk from "redux-thunk";
+import reducers from "../reducer/";
+
+export default createStore(
+	reducers,
+	applyMiddleware(thunk)
+);

+ 30 - 0
src/style/abstracts/variables.scss

@@ -0,0 +1,30 @@
+// COLORS
+$color-black: #000;
+$color-white: #fff;
+$color-red: #f00;
+$color-red-dark: #b40000;
+$color-yellow: #f5a623;
+$color-green: #0ea500;
+$color-blue: #008ff7;
+$color-blue-light-dark: #4a90e2;
+$color-blue-dark: #29336f;
+$color-blue-light: #eaf1f9;
+$color-brown: #4c4c4c;
+$color-grey: #51606a;
+$color-grey-light: #999999;
+$color-grey-lighter: #d8d8d8;
+$color-grey-the-lightest: #f9fbfd;
+$color-grey-transparent: rgba(247, 249, 251, 0.7);
+
+//BASE COLORS
+$el-color:#FD7F71;
+$color-backgtound: #f8f6f6;
+
+//SearchLine
+$color: #FD7F71;
+$background: #F7FBFB;
+$background-2: #EAF5F5;
+$background-3: #BBD8D8;
+$primary: #FD7F71;
+$white: #fff;
+$breakpoint: 768px;

+ 14 - 0
src/style/base/_base.scss

@@ -0,0 +1,14 @@
+*,
+*:after,
+*:before {
+	margin: 0;
+	padding: 0;
+	box-sizing:border-box;
+}
+body{
+	min-width: 980px;
+	max-width: 1520px;
+	width: 100%;
+	margin: 0 auto ;
+	background: $color-backgtound;
+}

+ 331 - 0
src/style/components/_allStaff.scss

@@ -0,0 +1,331 @@
+.menuAndContent{
+    max-width: 100%;
+    display: flex;
+    
+    .contentStaffs{
+        width: 100%;
+        padding: 10px;
+    }
+    .staffs{
+        margin: 0 auto;
+        display: flex;
+        align-items: center;
+        align-content: center; 
+        flex-wrap: wrap;
+    }
+    .staff{
+        width: 350px;
+        height: 250px;
+        margin: 10px;
+        padding: 1%;
+        border: none;
+        outline: none;
+        border: 0px;
+        cursor: pointer;
+        color: #FD7F71;
+        transition: .3s ease-out;
+        border-radius: 10px;
+        background-color: #fff;
+        box-shadow: 0 1px 1px rgba(187, 216, 216, 0.6), 
+            0 3px 3px rgba(187, 216, 216, 0.4), 
+            0 8px 16px rgba(187, 216, 216, 0.3);
+
+        .titlleAndPrice{
+            display: flex;
+            justify-content: space-around;
+            padding-top: 10px;
+
+        }    
+    }
+    .imgStaff{
+        width: 100%;
+        height: 80%;
+        padding: 5px ;
+        border-radius: 15px;
+       
+    }
+    .staffinfo{
+        width: 100%;
+        height: 100%;
+        margin: 10px;
+        padding: 1%;
+        border: none;
+        outline: none;
+        border: 0px;
+        cursor: pointer;
+        color: #FD7F71;
+        transition: .3s ease-out;
+        border-radius: 10px;
+        background-color: #fff;
+        box-shadow: 0 1px 1px rgba(187, 216, 216, 0.6), 
+            0 3px 3px rgba(187, 216, 216, 0.4), 
+            0 8px 16px rgba(187, 216, 216, 0.3);
+
+        .titlleAndPrice{
+            display: flex;
+            justify-content: space-around;
+            padding-top: 10px;
+
+        }
+
+        .fullImgStaff{
+            width: 480px;
+            height: 320px;
+            border: none;
+            outline: none;
+            border: 1px;
+            border-radius: 10px;    
+            animation-timing-function: linear;
+        }
+    }
+
+    .loader{
+        position: fixed;
+        bottom: 0;
+        left: 50%;
+        right: 0;
+        top: 50%;
+        height: 100%;
+        width: 100%;
+        z-index: 9999;  
+    }
+
+}
+.topbutton{
+    position:fixed;
+    bottom:50px;
+    right:50px;  
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    display: block;
+    width: 50px;
+    height: 50px;
+    line-height:50px;
+    text-align:center;
+    color: #fff;
+    border: none;
+    box-shadow: 0 0 0 0 #f0f0f0, 0 0 0 0 #FD7F71;
+    border-radius: 25px;
+    background: #FD7F71;
+    cursor: pointer;
+    transform: translate3d(0, 0, 0);
+    animation: pulse 1.25s infinite cubic-bezier(0.66, 0.33, 0, 1);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    &:hover > i {
+        color:#fff;
+        text-shadow: 3px 3px 3px rgba(0,0,0,.35);
+      }
+      &:focus > i {
+        color:#fff;
+      }
+      @keyframes pulse {
+        to {
+          box-shadow: 0 0 0 12px transparent, 0 0 0 24px rgba(227, 115, 14, 0);
+        }
+      }
+    
+}
+
+// .loader{
+//     position: fixed;
+//     bottom: 0;
+//     left: 50%;
+//     right: 0;
+//     top: 50%;
+//     height: 100%;
+//     width: 100%;
+//     z-index: 9999; 
+
+// }
+
+
+.carusel{
+    border: none;
+        outline: none;
+        border: 0px;
+    border-radius: 10px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+}
+.viwe-carusel{
+    height: 100%;
+    width: var(--main-width);
+    display: flex;
+    flex-direction: row;
+    overflow: hidden;
+}
+.el-carusel{
+    height: 100%;
+    border: none;
+        outline: none;
+        border: 0px;
+    border-radius: 10px;
+    width: var(--main-width);
+    user-select: none;
+    animation-timing-function: linear;
+}
+.el-carusel::befor{
+    animation: eye 3s ease-in-out infinite;
+}
+.scropl-carusel{
+    width: 99999px;
+    display: flex;
+    transition: all 2s ease-in-out;
+}
+.scropl-carusel-finish{
+    width: 99999px;
+    display: flex;
+    transition: all 0s ease-in-out;
+}
+.img-carusel{
+  width: 100%;
+  height: 100%;
+}
+.but{
+  display: flex;
+  font-size: 2rem;
+  color: #424271;
+  background-color: #efeded;
+  height: 50px;
+  width: 50px;
+  /*position: relative;
+  top: 125px;*/
+  transform: translate(100%);
+  font-weight: bold;
+  opacity: 0.5;
+  user-select: none;
+}
+.but:hover{
+  color: #ccd024;
+  cursor: pointer;
+  opacity: 1;
+}
+.back{
+  z-index: 1;
+  align-items: center;
+  justify-content: center;
+  /*transform: translateX(100%);*/
+}
+.next{
+  z-index: 1;
+  align-items: center;
+  justify-content: center;
+  transform: rotate(180deg) translate(100%);
+}
+
+
+.ant-carousel{
+    width: 480px;
+}
+
+.ant-carousel .slick-slide {
+    width: 480px;
+    text-align: center;
+    height: 320px;
+    line-height: 160px;
+    overflow: hidden;
+  }
+  
+  .ant-carousel .slick-slide h3 {
+    color: #fff;
+  }
+.divCenter{
+    width: 55%;
+    margin: 0 auto;
+}
+.flex-around{
+    display: flex;
+    justify-content: flex-start;
+    flex-direction: column;
+}
+
+.ant-carousel .slick-dots li button {
+    border: 0;
+    cursor: pointer;
+    background: green;
+    opacity: 0.5;
+    display: block;
+    width: 25px;
+    height: 7px;
+    border-radius: 3px;
+    outline: none;
+    font-size: 0;
+    color: transparent;
+    -webkit-transition: all 0.5s;
+    transition: all 0.5s;
+    padding: 0;
+}
+.ant-carousel .slick-dots li.slick-active button {
+    background: #FD7F71;
+    opacity: 1;
+    width: 20px;
+}
+ 
+.topPrice{
+    position: fixed;
+    top: 20%;
+    right: 1em;
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    display: block;
+    width: 80px;
+    height: 50px;
+    line-height: 50px;
+    text-align: center;
+    color: #fff;
+    border: none;
+    box-shadow: 0 0 0 0 #f0f0f0, 0 0 0 0 #FD7F71;
+    border-radius: 25px;
+    background: #FD7F71;
+    cursor: pointer;
+    transform: translate3d(0, 0, 0);
+    outline: none;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    &:hover > i {
+        color:#fff;
+        text-shadow: 3px 3px 3px rgba(0,0,0,.35);
+      }
+      &:focus > i {
+        color:#fff;
+      }
+      
+}
+
+.bottomPrice{
+    position:fixed;
+    top: 30%;
+    right: 1em;
+    transform: translate3d(0, 0, 0);
+    display: block;
+    width: 80px;
+    height: 50px;
+    line-height:50px;
+    text-align:center;
+    color: #fff;
+    border: none;
+    box-shadow: 0 0 0 0 #f0f0f0, 0 0 0 0 #FD7F71;
+    border-radius: 25px;
+    background: #FD7F71;
+    cursor: pointer;
+    transform: translate3d(0, 0, 0);
+    outline: none;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    &:hover > i {
+        color:#fff;
+        text-shadow: 3px 3px 3px rgba(0,0,0,.35);
+      }
+      &:focus > i {
+        color:#fff;
+      }
+      
+}

+ 449 - 0
src/style/components/_form.scss

@@ -0,0 +1,449 @@
+// All Form 
+.formdiv{
+    width: 100%;
+    height: 100vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+	  font-size: 20px;
+    background-image: url("../img/depositphotos_80275194-stock-illustration-russian-old-fair-bazaar-vector.jpg");
+    background-position: center; /* Center the image */
+    background-repeat: no-repeat; /* Do not repeat the image */
+    background-size: cover; 
+    
+    .form{
+      box-sizing: border-box;
+      width: 500px;
+      box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
+      padding: 1px 0 40px 0;
+      border-radius: 3px;
+      background-color: rgba(247, 240, 240, 0.7);
+    }
+
+    .formAuth {
+        box-sizing: border-box;
+        width: 625px;
+        box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
+        padding: 1px 0 40px 0;
+        border-radius: 3px;
+        background-color: rgba(247, 240, 240, 0.7);
+        
+    }
+    
+    .formRegistr {
+      box-sizing: border-box;
+      width: 625px;
+      box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
+      padding: 1px 0 40px 0;
+      border-radius: 3px;
+      background-color: rgba(247, 240, 240, 0.7);
+  }
+
+    .input {
+        margin: 20px auto;
+        width: 80%;
+        display: block;
+        border: none;
+        padding: 10px 0;
+        border-bottom: solid 1px $color;
+        transition: all 0.3s cubic-bezier(.64,.09,.08,1);
+        background: linear-gradient(to bottom, rgba(255,255,255,0) 96%, $color 4%);
+        background-position: -500px 0;
+        background-size: 500px 100%;
+        background-repeat: no-repeat;
+        color: darken($color, 1%);
+        &:focus {
+            box-shadow: none;
+            outline: none;
+            background-position: 0 0;
+            &::-webkit-input-placeholder {
+                color: $color;
+                font-size: 11px;
+                transform: translateY(-20px);
+                visibility: visible !important;
+            }
+        }
+
+        option{
+            background: rgba(247, 240, 240, 0.7);
+            border-radius: 3px;
+        }
+        select::-ms-expand { /* for IE 11 */
+            appearance: none;
+        }
+        
+    }
+    
+    .textarea {
+        margin: 20px auto;
+        width: 80%;
+        height: 100px;
+        display: block;
+        border: none;
+        padding: 20px 0;
+        overflow: hidden;
+        border-bottom: solid 1px $color;
+        transition: all 0.3s cubic-bezier(.64,.09,.08,1);
+        background: linear-gradient(to bottom, rgba(255,255,255,0) 96%, $color 4%);
+        background-position: -400px 0;
+        background-size: 400px 100%;
+        background-repeat: no-repeat;
+        color: darken($color, 1%);
+        &:focus {
+            box-shadow: none;
+            outline: none;
+            background-position: 0 0;
+            &::-webkit-input-placeholder {
+                color: $color;
+                font-size: 11px;
+                transform: translateY(-20px);
+                visibility: visible !important;
+            }
+        }
+    }
+
+    .file{
+        width: 100%;
+        height: 100px;
+    }
+
+    .buttonConteiner{
+        display: flex;
+        justify-content: center;
+    }
+}
+  
+input[type=number]::-webkit-inner-spin-button, 
+input[type=number]::-webkit-outer-spin-button { 
+  -webkit-appearance: none; 
+  margin: 0; 
+}
+
+.upload-zone {
+  padding: 3px;
+  cursor: pointer;
+  position: absolute;
+  left: 38%;
+  top: 66%;
+    -webkit-transform: translate(-50%, -50%);
+    -ms-transform: translate(-50%, -50%);
+    -moz-transform: translate(-50%, -50%);
+    -o-transform: translate(-50%, -50%);
+    transform: translate(-50%, -50%);
+    -webkit-border-radius: 20%;
+    -ms-border-radius: 20%;
+    -moz-border-radius: 20%;
+    -o-border-radius: 20%;
+    border-radius: 20%;
+    -webkit-transition: 0.3s;
+    -ms-transition: 0.3s;
+    -moz-transition: 0.3s;
+    -o-transition: 0.3s;
+    transition: 0.3s;
+    img{
+      position: absolute;
+      width: 75px;
+      height: 75px;
+      bottom: 6px;
+      border-radius: 15px;
+      left: 3px;
+      top: 3px;
+    }
+}
+
+.upload-zone:before {
+    display: block;
+    width: 80px;
+    height: 80px;
+    border: 3px dashed $color;
+    position: relative;
+    -webkit-border-radius: 20%;
+    -ms-border-radius: 20%;
+    -moz-border-radius: 20%;
+    -o-border-radius: 20%;
+    border-radius: 20%;
+    content: " ";
+    display: block;
+    -webkit-transition: 0.3s;
+    -ms-transition: 0.3s;
+    -moz-transition: 0.3s;
+    -o-transition: 0.3s;
+    transition: 0.3s;
+}
+
+.upload-zone:hover {
+    background: $color;
+}
+
+.upload-zone:hover:before {
+    border-color: #fff;
+}
+
+.upload-zone:hover i:before, .upload-zone:hover i:after {
+  background: #fff;
+}
+  
+.upload-zone i {
+  display: block;
+  width: 20%;
+  height: 20%;
+  -webkit-border-radius: 50%;
+  -ms-border-radius: 50%;
+  -moz-border-radius: 50%;
+  -o-border-radius: 50%;
+  border-radius: 50%;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  -webkit-transform: translate(-50%, -50%);
+  -ms-transform: translate(-50%, -50%);
+  -moz-transform: translate(-50%, -50%);
+  -o-transform: translate(-50%, -50%);
+  transform: translate(-50%, -50%);
+  -webkit-transition: 0.3s;
+  -ms-transition: 0.3s;
+  -moz-transition: 0.3s;
+  -o-transition: 0.3s;
+  transition: 0.3s;
+
+  img{
+    position: absolute;
+    width: 75px;
+    height: 75px;
+    bottom: 6px;
+    border-radius: 15px;
+    left: 6px;
+  }
+}
+  
+.upload-zone i:before, .upload-zone i:after {
+  background: $color;
+  top: 50%;
+  left: 50%;
+  content: " ";
+  display: block;
+  -webkit-border-radius: 4px;
+  -ms-border-radius: 4px;
+  -moz-border-radius: 4px;
+  -o-border-radius: 4px;
+  border-radius: 4px;
+  -webkit-transition: 0.3s;
+  -ms-transition: 0.3s;
+  -moz-transition: 0.3s;
+  -o-transition: 0.3s;
+  transition: 0.3s;
+  position: absolute;
+  left: 50%;
+  top: 50%;
+  -webkit-transform: translate(-50%, -50%);
+  -ms-transform: translate(-50%, -50%);
+  -moz-transform: translate(-50%, -50%);
+  -o-transform: translate(-50%, -50%);
+  transform: translate(-50%, -50%);
+}
+
+.upload-zone i:before {
+  width: 100%;
+  height: 3px;
+}
+  
+.upload-zone i:after {
+  width: 3px;
+  height: 100%;
+}
+
+.upload-zone input[type='file'] {
+  display: none;
+}
+  
+.zone2{
+  left: 46%;
+  top: 66%;
+}
+  
+.zone3{
+  left: 54%;
+  top: 66%;
+}
+
+.zone4{
+  left: 62%;
+  top: 66%;
+}
+   
+//Page auth
+  
+  .buttonAuth {
+    border: none;
+    background: $color;
+    cursor: pointer;
+    border-radius: 3px;
+    padding: 20px;
+    width: 50%;
+    color: white;
+    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+    &:hover { 
+      transform: translateY(-3px);
+      box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+    }
+  }
+  .buttonInAuth {
+    border: none;
+    background: $color;
+    cursor: pointer;
+    border-radius: 3px;
+    padding: 5px;
+    width: 50%;
+    color: white;
+    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+    &:hover { 
+      transform: translateY(-3px);
+      box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+    }
+    .colorLink{
+      text-decoration: none;
+      color: white;
+    }
+  }
+  .center{
+    display: flex;
+    justify-content: space-around;
+    align-items: center;
+  }
+  
+  //Page registrateon
+
+  .buttonInRegistration {
+    border: none;
+    background: $color;
+    cursor: pointer;
+    border-radius: 3px;
+    padding: 7px;
+    width: 40%;
+    color: white;
+    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+    &:hover { 
+      transform: translateY(-3px);
+      box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+    }
+    .colorLink{
+      text-decoration: none;
+      color: white;
+    }
+  }
+  .divName{
+    margin: 0 40px;
+    display: flex;
+    justify-content: space-between;
+
+  }
+  .inputName{
+    width: 90%;
+  }
+
+  .form__input-box{
+    span{
+      color: red;
+      position: relative;
+      left: 160px;
+      bottom: 85px;
+    }
+    .span_auth{
+      color: red;
+      position: relative;
+      left: 10%;
+      bottom: 5em;
+    }
+    .span_reg{
+      color: red;
+      position: relative;
+      left: 10%;
+      bottom: 5em;
+    }
+  }
+  //all
+  
+  .linkTopButton{
+    position:fixed;
+    top:20px;
+    left:50px;  
+    -webkit-transform: translate3d(0, 0, 0);
+    transform: translate3d(0, 0, 0);
+    display: block;
+    width: 50px;
+    height: 50px;
+    line-height:50px;
+    text-align:center;
+    color: #fff;
+    border: none;
+    box-shadow: 0 0 0 0 #f0f0f0, 0 0 0 0 #FD7F71;
+    border-radius: 25px;
+    background: #FD7F71;
+    cursor: pointer;
+    transform: translate3d(0, 0, 0);
+    animation: pulse 1.25s infinite cubic-bezier(0.66, 0.33, 0, 1);
+    display: flex;
+    justify-content: center;
+    align-items: center;
+
+    &:hover > i {
+        color:#fff;
+        text-shadow: 3px 3px 3px rgba(0,0,0,.35);
+      }
+      &:focus > i {
+        color:#fff;
+      }
+      @keyframes pulse {
+        to {
+          box-shadow: 0 0 0 12px transparent, 0 0 0 24px rgba(227, 115, 14, 0);
+        }
+      }
+    
+}
+  // .button {
+    //   border: none;
+    //   background: $color;
+    //   cursor: pointer;
+    //   border-radius: 3px;
+    //   padding: 6px;
+    //   margin-bottom: 10px;
+    //   width: 80%;
+    //   color: white;
+    //   margin-left: 25px;
+    //   box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+    //   &:hover { 
+      //     transform: translateY(-3px);
+      //     box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+      //   }
+      // }
+      // .btn1{
+        //     width: 180px;
+        //       margin-left: 0px;
+        //       border-radius: 0px;
+        //       padding-bottom: 10px;
+        //       padding-top: 10px;
+        //   }
+        //   .btn2{
+          //     width: 180px;
+          //       margin-left: 0px;
+          //       border-radius: 0px;
+          //       padding-bottom: 10px;
+          //       padding-top: 10px;
+          //   }
+          
+          .button {
+              border: none;
+              background: $color;
+              cursor: pointer;
+              border-radius: 3px;
+              padding: 6px;
+              margin: 10px 30px;
+              width: 90%;
+              color: white;
+              margin-left: 25px;
+              box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+              &:hover { 
+                transform: translateY(-3px);
+                box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+              }
+          }

+ 209 - 0
src/style/components/_formLogin.scss

@@ -0,0 +1,209 @@
+.formdiv{
+    width: 100%;
+    height: 100vh;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+	font-size: 20px;
+    margin: 0 auto ;
+    background-image: url("../img/depositphotos_80275194-stock-illustration-russian-old-fair-bazaar-vector.jpg");
+    background-position: center; /* Center the image */
+    background-repeat: no-repeat; /* Do not repeat the image */
+    background-size: cover; 
+    
+}
+
+h1, .input::-webkit-input-placeholder, .button {
+    font-family: 'roboto', sans-serif;
+    transition: all 0.3s ease-in-out;
+}
+
+h1 {
+    height: 100px;
+    width: 100%;
+    font-size: 18px;
+    background: darken($el-color, 4%);
+    color: #fff;
+    line-height: 150%;
+    border-radius: 3px 3px 0 0;
+    box-shadow: 0 2px 5px 1px rgba(0,0,0,0.2);
+}
+
+.form {
+    box-sizing: border-box;
+    width: 260px;
+    box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
+    padding-bottom: 40px;
+    border-radius: 3px;
+    background-color: rgba(247, 240, 240, 0.7);;
+    
+    h1 {
+        box-sizing: border-box;
+        padding: 20px;
+    }
+}
+
+.input {
+    margin: 40px 25px;
+    width: 200px;
+    display: block;
+    border: none;
+    padding: 10px 0;
+    border-bottom: solid 1px $el-color;
+    transition: all 0.3s cubic-bezier(.64,.09,.08,1);
+    background: linear-gradient(to bottom, rgba(255,255,255,0) 96%, $el-color 4%);
+    background-position: -200px 0;
+    background-size: 200px 100%;
+    background-repeat: no-repeat;
+    color: darken($el-color, 20%);
+
+    &:focus {
+        box-shadow: none;
+        outline: none;
+        background-position: 0 0;
+        &::-webkit-input-placeholder {
+            color: $el-color;
+            font-size: 11px;
+            transform: translateY(-20px);
+            visibility: visible !important;
+        }
+    }
+}
+
+
+
+.button {
+    border: none;
+    background: $el-color;
+    cursor: pointer;
+    border-radius: 3px;
+    padding: 6px;
+    width: 200px;
+    color: white;
+    margin: 25px auto;
+    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+    &:hover { 
+        transform: translateY(-3px);
+        box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+    }
+}
+
+
+h1, .input::-webkit-input-placeholder, .button {
+    font-family: 'roboto', sans-serif;
+    transition: all 0.3s ease-in-out;
+  }
+  
+  h1 {
+    height: 100px;
+    width: 100%;
+    font-size: 18px;
+    background: darken($color, 4%);
+    color: white;
+    line-height: 150%;
+    border-radius: 3px 3px 0 0;
+    box-shadow: 0 2px 5px 1px rgba(0,0,0,0.2);
+  }
+  
+  .form {
+    box-sizing: border-box;
+    width: 460px;
+    margin: auto 0;
+    box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
+    padding-bottom: 40px;
+    border-radius: 3px;
+  }
+  
+  .input {
+    margin: 20px 25px;
+    width: 80%;
+    display: block;
+    border: none;
+    padding: 10px 0;
+    border-bottom: solid 1px $color;
+    transition: all 0.3s cubic-bezier(.64,.09,.08,1);
+    background: linear-gradient(to bottom, rgba(255,255,255,0) 96%, $color 4%);
+    background-position: -200px 0;
+    background-size: 200px 100%;
+    background-repeat: no-repeat;
+    color: darken($color, 1%);
+    &:focus {
+      box-shadow: none;
+      outline: none;
+      background-position: 0 0;
+      &::-webkit-input-placeholder {
+        color: $color;
+        font-size: 11px;
+        transform: translateY(-20px);
+        visibility: visible !important;
+      }
+    }
+  }
+  //.input:focus::-webkit-input-placeholder {text-indent: 500px; transition: text-indent 0.5s ease;}
+  .button {
+    border: none;
+    background: $color;
+    cursor: pointer;
+    border-radius: 3px;
+    padding: 6px;
+    margin-bottom: 10px;
+    width: 80%;
+    color: white;
+    margin-left: 25px;
+    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+    &:hover { 
+      transform: translateY(-3px);
+      box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+    }
+  }
+  // .allStaffs{
+    
+  //   max-width: 1500px;
+  //    display: flex;
+  //     flex-wrap: wrap;
+  //     justify-content: center;
+  //     align-items: center;
+  //     align-content: center;
+  // }
+  // .staffs{
+  //   max-width: 1500px;
+  //   display: flex;
+  //     flex-wrap: wrap;
+  //     justify-content: center;
+  //     align-items: center;
+  //     align-content: center;
+      
+  // }
+  // .staff{
+  //    width: 350px;
+     
+  // }
+  .main{
+    display: flex;
+  }
+  
+  .sider{
+    background-color: #FD7F71
+  }
+  .auth__button{
+    width: 100%;
+    display : flex;
+    padding-top: 30px;
+    padding-bottom: 30px;
+  }
+  .btn1{
+    width: 180px;
+      margin-left: 0px;
+      border-radius: 0px;
+      padding-bottom: 10px;
+      padding-top: 10px;
+  }
+  .btn2{
+    width: 180px;
+      margin-left: 0px;
+      border-radius: 0px;
+      padding-bottom: 10px;
+      padding-top: 10px;
+  }
+
+  

+ 131 - 0
src/style/components/_header.scss

@@ -0,0 +1,131 @@
+.header {
+	display:flex;
+	
+
+	&__logo {
+		width: 20%;
+		margin: 0 auto;
+		display: flex;
+		justify-content: center;
+		align-items: center;	
+	}
+
+	&__searchLine{
+		width: 60%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+	}
+
+	&__auth {
+		width: 20%;
+		display: flex;
+		justify-content: center;
+		align-items: center;
+		
+		&__container{
+			
+			display: flex;
+			justify-content: center;
+			align-items: center;
+
+			.avatar{
+				padding-right: 5px;
+			}
+
+			.text{
+				color: $el-color;
+				font-size: 18px;
+			}
+		}
+	}
+}
+
+.searchInput::-webkit-input-placeholder, .button {
+    font-family: 'roboto', sans-serif;
+    transition: all 0.3s ease-in-out;
+}
+  
+.searchInput{   
+	margin: 40px 25px;
+	width: 75%;
+	display: block;
+	border: none;
+	padding: 10px 0;
+	border-bottom: solid 1px $color;
+	transition: all 0.3s cubic-bezier(.64,.09,.08,1);
+	background: linear-gradient(to bottom, rgba(255,255,255,0) 96%, $color 4%);
+	background-position: -700px 0;
+	background-size: 700px 100%;
+	background-repeat: no-repeat;
+	color: darken($color,1%);
+	
+	&:focus {
+		box-shadow: none;
+		outline: none;
+		background-position: 0 0;
+		&::-webkit-input-placeholder {
+			text-indent: 700px; transition: text-indent 0.5s ease;
+		}
+	}
+}
+.searchBtn{
+    border:none;
+    outline: none;
+    border: 0px;
+    cursor: pointer;
+	color: $primary;
+	transition: .3s ease-out;
+	
+	&:hover,
+	&:focus { 
+    	transform: scale(1.125);
+    
+    	.icon {
+	  		transform: scale(1.25); 
+		} 
+	} 
+        // Display/alignment
+        display: flex;
+        justify-content: center;
+        align-items: center;
+        align-content: center;
+        
+        // Sizing
+        width: 68px;
+        height: 68px;
+        border-radius: 34px;
+        
+        // Style
+        background-color: $white;
+        box-shadow:
+          0 1px 1px rgba($background-3, .6),
+          0 3px 3px rgba($background-3, .4),
+          0 8px 16px rgba($background-3, .3);
+        
+        &:hover,
+        &:focus {
+          box-shadow:
+            0 2px 2px rgba($background-3, .4),
+            0 4px 4px rgba($background-3, .3),
+            0 12px 32px rgba($background-3, .3); } 
+}
+
+.fill-currentcolor {
+	fill: currentcolor; 
+}
+  
+.fill-none {
+	fill: none; 
+}
+
+.icon {
+    width: 24px;
+    height: 24px;
+    transition: .3s ease-out;
+        
+    @media (min-width: $breakpoint) {
+      	width: 32px;
+		height: 32px; 
+	} 
+}

+ 33 - 0
src/style/components/_leftMenu.scss

@@ -0,0 +1,33 @@
+.ant-layout-sider-children{
+    background: $el-color; 
+    height: 170%; 
+}
+.ant-menu-submenu-title{
+    font-size: 20px;
+    background: $el-color; 
+    margin: 0;
+        &:hover {
+            background: rgb(223, 111, 98);
+            margin: 0;
+        }
+}
+.ant-menu-dark{
+    background: $el-color;
+}
+.ant-layout-sider-trigger {
+    position: fixed;
+    text-align: center;
+    bottom: 0;
+    cursor: pointer;
+    height: 48px;
+    line-height: 48px;
+    color: #fff;
+    background: #e06b62;
+    z-index: 1;
+    transition: all 0.2s;
+}
+.ant-menu .ant-menu-sub .ant-menu-inline{
+    & :hover{
+        background: #db5b51d2;
+    }  
+}

+ 82 - 0
src/style/components/_userProfil.scss

@@ -0,0 +1,82 @@
+.profil{
+    width: 100%;
+    height: 75vh;
+    margin: 10px;
+    padding: 1%;
+    border: none;
+    border: 0px;
+    color: #FD7F71;
+    border-radius: 10px;
+    background-color: #fff; 
+    font-size: 20px;
+    h2{
+        text-align: center;
+    }
+    .profilData{
+        width: 50%;
+        margin: 0 auto;
+    }
+    .buttonConteiner{
+        display: flex;
+        justify-content: space-around;
+    }
+    .profilLink{
+        border: none;
+        background: rgb(99, 206, 99);
+        cursor: pointer;
+        border-radius: 3px;
+        padding: 20px;
+        width: 210px;
+        color: white;
+        box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+        &:hover { 
+        transform: translateY(-3px);
+        box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+        }
+    }
+    .profilBtn{
+        border: none;
+        background: rgb(207, 56, 40);
+        cursor: pointer;
+        border-radius: 3px;
+        padding: 20px;
+        width: 210px;
+        color: white;
+        box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+        &:hover { 
+        transform: translateY(-3px);
+        box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+        }
+    }
+
+}
+
+.allMyStaff{
+    border: none;
+    cursor: pointer;
+    border-radius: 35px;
+    padding: 20px;
+    width: 70px;
+    color: black;
+    box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+    position: relative;
+    top: -12em;
+    &:hover { 
+        background: rgb(99, 206, 99);
+    }
+}
+.Exit{
+    border: none;
+    background: rgba(216, 216, 216, 0.5);
+    cursor: pointer;
+    border-radius: 35px;
+    padding: 20px;
+    width: 70px;
+    color: black;
+    box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.2);
+    position: relative;
+    top: -12em;
+    &:hover { 
+        background: rgb(207, 56, 40);    
+    }
+}

+ 119 - 0
src/style/components/auth.scss

@@ -0,0 +1,119 @@
+h1, .input::-webkit-input-placeholder, .button {
+  font-family: 'roboto', sans-serif;
+  transition: all 0.3s ease-in-out;
+}
+
+h1 {
+  height: 100px;
+  width: 100%;
+  font-size: 18px;
+  background: darken($color, 4%);
+  color: white;
+  line-height: 150%;
+  border-radius: 3px 3px 0 0;
+  box-shadow: 0 2px 5px 1px rgba(0,0,0,0.2);
+}
+
+.form {
+  box-sizing: border-box;
+  width: 460px;
+  margin: 100px auto 0;
+  box-shadow: 2px 2px 5px 1px rgba(0,0,0,0.2);
+  padding-bottom: 40px;
+  border-radius: 3px;
+}
+
+.input {
+  margin: 20px 25px;
+  width: 80%;
+  display: block;
+  border: none;
+  padding: 10px 0;
+  border-bottom: solid 1px $color;
+  transition: all 0.3s cubic-bezier(.64,.09,.08,1);
+  background: linear-gradient(to bottom, rgba(255,255,255,0) 96%, $color 4%);
+  background-position: -200px 0;
+  background-size: 200px 100%;
+  background-repeat: no-repeat;
+  color: darken($color, 1%);
+  &:focus {
+    box-shadow: none;
+    outline: none;
+    background-position: 0 0;
+    &::-webkit-input-placeholder {
+      color: $color;
+      font-size: 11px;
+      transform: translateY(-20px);
+      visibility: visible !important;
+    }
+  }
+}
+//.input:focus::-webkit-input-placeholder {text-indent: 500px; transition: text-indent 0.5s ease;}
+.button {
+  border: none;
+  background: $color;
+  cursor: pointer;
+  border-radius: 3px;
+  padding: 6px;
+  margin-bottom: 10px;
+  width: 80%;
+  color: white;
+  margin-left: 25px;
+  box-shadow: 0 3px 6px 0 rgba(0,0,0,0.2);
+  &:hover { 
+    transform: translateY(-3px);
+    box-shadow: 0 6px 6px 0 rgba(0,0,0,0.2);
+  }
+}
+// .allStaffs{
+  
+//   max-width: 1500px;
+//    display: flex;
+//     flex-wrap: wrap;
+//     justify-content: center;
+//     align-items: center;
+//     align-content: center;
+// }
+// .staffs{
+//   max-width: 1500px;
+//   display: flex;
+//     flex-wrap: wrap;
+//     justify-content: center;
+//     align-items: center;
+//     align-content: center;
+    
+// }
+// .staff{
+//    width: 350px;
+   
+// }
+.main{
+  display: flex;
+}
+
+.sider{
+  background-color: #FD7F71
+}
+.auth__button{
+
+  width: 100%;
+  display : flex;
+  padding-top: 30px;
+  padding-bottom: 30px;
+  
+}
+.btn1{
+  width: 180px;
+    margin-left: 0px;
+    border-radius: 0px;
+    padding-bottom: 10px;
+    padding-top: 10px;
+}
+.btn2{
+  width: 180px;
+    margin-left: 0px;
+    border-radius: 0px;
+    padding-bottom: 10px;
+    padding-top: 10px;
+}
+

+ 17 - 0
src/style/index.scss

@@ -0,0 +1,17 @@
+@import "~antd/dist/antd.css";
+
+@import "abstracts/variables.scss";
+
+@import "base/base";
+
+@import "layout/container";
+
+@import "components/allStaff";
+@import "components/form";
+// @import "components/formLogin";
+@import "components/header";
+@import "components/leftMenu";
+@import "components/userProfil";
+
+// @import './components/auth.scss';
+

+ 10 - 0
src/style/layout/container.scss

@@ -0,0 +1,10 @@
+// .container {
+// 	max-width: 192rem;
+// 	width: 100%;
+// 	margin: 0 auto;
+// }
+
+// .todo {
+// 	padding: 3rem;
+// 	display: flex;
+// }

+ 19 - 0
src/utils/authValidate.js

@@ -0,0 +1,19 @@
+export const authValidate =  values => {
+    const { email, password } = values;
+    const error = {};
+
+    if(!email) {
+        
+        error.email = "*"
+    } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.]+\.[A-Z]{2,4}$/i.test(email)) {
+        error.email = "Неверный адрес"
+    }
+
+    if(!password) {
+        error.password = "*"
+    }else if(!/^[a-zA-Z0-9]+$/.test(password)) {
+        error.password = "Неверный пароль"
+    }
+
+    return error;
+};

+ 38 - 0
src/utils/regValidate.js

@@ -0,0 +1,38 @@
+export const regValidate = values => {
+    const { login, password, name, phone, email } = values;
+    const error = {};
+
+    if (!login) {
+        error.login = "*" // - true если ничего не надо возвращать
+    } else if (login.length > 15) {
+        error.login = 'Must be 15 characters or less'
+    } else if (!/^[a-zA-Z0-9]+$/.test(login)) {
+        error.login = "invalid login"
+    }
+
+    if (!password) {
+        error.password = "*"
+    }else if(!/^[a-zA-Z0-9]+$/.test(password)) {
+        error.password = "Invalid password"
+    }
+
+    if (!name) {
+        error.name = "*"
+    }else if (!/^[a-zA-Z0-9]+$/.test(name)) {
+        error.name = "Invalid login"
+    }
+
+    if (!phone) {
+        error.phone = "*"
+    }else if(!/^[0-9-+()]+$/.test(phone)) {
+        error.phone = "Invalid phone number"
+    }
+
+    if (!email) {
+        error.email = "*"
+    } else if (!/^[A-Z0-9._%+-]+@[A-Z0-9.]+\.[A-Z]{2,4}$/i.test(email)) {
+        error.email = 'Invalid email address'
+    }
+
+    return error;
+};

+ 15 - 0
src/utils/validate.js

@@ -0,0 +1,15 @@
+export default values => {
+    const { email, password } = values;
+    const error = {};
+    console.log(values)
+
+    if(!email) {
+        error.email = "Required"
+    }
+
+    if(!password) {
+        error.password = "Required"
+    }
+
+    return error;
+};

Diferenças do arquivo suprimidas por serem muito extensas
+ 11714 - 0
yarn.lock