addStaff

package-lock.json

@@ -2450,6 +2450,11 @@
       "resolved": "https://registry.npmjs.org/boolbase/-/boolbase-1.0.0.tgz",
       "integrity": "sha1-aN/1++YMUes3cl6p4+0xDcwed24="
     },
+    "bowser": {
+      "version": "1.9.4",
+      "resolved": "https://registry.npmjs.org/bowser/-/bowser-1.9.4.tgz",
+      "integrity": "sha512-9IdMmj2KjigRq6oWhmwv1W36pDuA4STQZ8q6YO9um+x07xgYNCD3Oou+WP/3L1HNz7iqythGet3/p4wvc8AAwQ=="
+    },
     "brace-expansion": {
       "version": "1.1.11",
       "resolved": "https://registry.npmjs.org/brace-expansion/-/brace-expansion-1.1.11.tgz",
@@ -2725,6 +2730,11 @@
         "lodash.uniq": "^4.5.0"
       }
     },
+    "caniuse-db": {
+      "version": "1.0.30000928",
+      "resolved": "https://registry.npmjs.org/caniuse-db/-/caniuse-db-1.0.30000928.tgz",
+      "integrity": "sha512-nAoeTspAEzLjqGSeibzM09WojORi08faeOOI5GBmFWC3/brydovb9lYJWM+p48rEQsdevfpufK58gPiDtwOWKw=="
+    },
     "caniuse-lite": {
       "version": "1.0.30000927",
       "resolved": "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30000927.tgz",
@@ -3399,6 +3409,37 @@
         }
       }
     },
+    "css-in-js-utils": {
+      "version": "2.0.1",
+      "resolved": "https://registry.npmjs.org/css-in-js-utils/-/css-in-js-utils-2.0.1.tgz",
+      "integrity": "sha512-PJF0SpJT+WdbVVt0AOYp9C8GnuruRlL/UFW7932nLWmFLQTaWEzTBQEx7/hn4BuV+WON75iAViSUJLiU3PKbpA==",
+      "requires": {
+        "hyphenate-style-name": "^1.0.2",
+        "isobject": "^3.0.1"
+      }
+    },
+    "css-keyframer": {
+      "version": "1.0.1",
+      "resolved": "https://registry.npmjs.org/css-keyframer/-/css-keyframer-1.0.1.tgz",
+      "integrity": "sha1-RBAX8+LWjJKnpQuLZ2a8ucjvCQ8=",
+      "requires": {
+        "exenv": "^1.2.1",
+        "hyphenate-style-name": "^1.0.2",
+        "inline-style-prefixer": "^2.0.5",
+        "is-plain-object": "^2.0.1"
+      },
+      "dependencies": {
+        "inline-style-prefixer": {
+          "version": "2.0.5",
+          "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-2.0.5.tgz",
+          "integrity": "sha1-wVPH6I/YT+9cYC6VqBaLJ3BnH+c=",
+          "requires": {
+            "bowser": "^1.0.0",
+            "hyphenate-style-name": "^1.0.1"
+          }
+        }
+      }
+    },
     "css-loader": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/css-loader/-/css-loader-1.0.0.tgz",
@@ -4788,6 +4829,11 @@
         }
       }
     },
+    "exenv": {
+      "version": "1.2.2",
+      "resolved": "https://registry.npmjs.org/exenv/-/exenv-1.2.2.tgz",
+      "integrity": "sha1-KueOhdmJQVhnCwPUe+wfA72Ru50="
+    },
     "exit": {
       "version": "0.1.2",
       "resolved": "https://registry.npmjs.org/exit/-/exit-0.1.2.tgz",
@@ -7151,6 +7197,11 @@
       "resolved": "https://registry.npmjs.org/https-browserify/-/https-browserify-1.0.0.tgz",
       "integrity": "sha1-7AbBDgo0wPL68Zn3/X/Hj//QPHM="
     },
+    "hyphenate-style-name": {
+      "version": "1.0.2",
+      "resolved": "https://registry.npmjs.org/hyphenate-style-name/-/hyphenate-style-name-1.0.2.tgz",
+      "integrity": "sha1-MRYKNpMK2vH8BMYHT360FGXU7Es="
+    },
     "iconv-lite": {
       "version": "0.4.24",
       "resolved": "https://registry.npmjs.org/iconv-lite/-/iconv-lite-0.4.24.tgz",
@@ -7273,6 +7324,15 @@
       "resolved": "https://registry.npmjs.org/ini/-/ini-1.3.5.tgz",
       "integrity": "sha512-RZY5huIKCMRWDUqZlEi72f/lmXKMvuszcMBduliQ3nnWbx9X/ZBQO7DijMEYS9EhHBb2qacRUMtC7svLwe0lcw=="
     },
+    "inline-style-prefixer": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/inline-style-prefixer/-/inline-style-prefixer-3.0.8.tgz",
+      "integrity": "sha1-hVG45bTVcyROZqNLBPfTIHaitTQ=",
+      "requires": {
+        "bowser": "^1.7.3",
+        "css-in-js-utils": "^2.0.0"
+      }
+    },
     "inquirer": {
       "version": "6.2.1",
       "resolved": "https://registry.npmjs.org/inquirer/-/inquirer-6.2.1.tgz",
@@ -14202,6 +14262,49 @@
       "resolved": "https://registry.npmjs.org/react-lifecycles-compat/-/react-lifecycles-compat-3.0.4.tgz",
       "integrity": "sha512-fBASbA6LnOU9dOU2eW7aQ8xmYBSXUIWr+UmF9b1efZBazGNO+rcXT/icdKnYm2pTwcRylVUYwW7H1PHfLekVzA=="
     },
+    "react-loader-spinner": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/react-loader-spinner/-/react-loader-spinner-2.3.0.tgz",
+      "integrity": "sha512-Nu7RXMyAnvdGoZLH5boXaHbqLkgBEIPO1u75zOZkZNp2V+Dg8RvvlZ05SU3ajtmsFNteFe8BJbFd0samH0tXcw==",
+      "requires": {
+        "babel-runtime": "^6.26.0",
+        "prop-types": "^15.6.2"
+      }
+    },
+    "react-md-spinner": {
+      "version": "0.3.0",
+      "resolved": "https://registry.npmjs.org/react-md-spinner/-/react-md-spinner-0.3.0.tgz",
+      "integrity": "sha512-7MZx3eSCjUNocTQuYFzt2BF3J69s9UNSnOG2I6R+Yg2okbi3VzRVY0Ers7C7dTXHhpNMYeQoaI1juIz72r3bng==",
+      "requires": {
+        "caniuse-api": "^1.6.1",
+        "css-keyframer": "1.0.1",
+        "exenv": "^1.2.1",
+        "inline-style-prefixer": "^3.0.3",
+        "prop-types": "^15.5.8"
+      },
+      "dependencies": {
+        "browserslist": {
+          "version": "1.7.7",
+          "resolved": "https://registry.npmjs.org/browserslist/-/browserslist-1.7.7.tgz",
+          "integrity": "sha1-C9dnBCWL6CmyOYu1Dkti0aFmsLk=",
+          "requires": {
+            "caniuse-db": "^1.0.30000639",
+            "electron-to-chromium": "^1.2.7"
+          }
+        },
+        "caniuse-api": {
+          "version": "1.6.1",
+          "resolved": "https://registry.npmjs.org/caniuse-api/-/caniuse-api-1.6.1.tgz",
+          "integrity": "sha1-tTTnxzTE+B7F++isoq0kNUuWLGw=",
+          "requires": {
+            "browserslist": "^1.3.6",
+            "caniuse-db": "^1.0.30000529",
+            "lodash.memoize": "^4.1.2",
+            "lodash.uniq": "^4.5.0"
+          }
+        }
+      }
+    },
     "react-redux": {
       "version": "6.0.0",
       "resolved": "https://registry.npmjs.org/react-redux/-/react-redux-6.0.0.tgz",
@@ -14733,6 +14836,11 @@
         }
       }
     },
+    "redux-thunk": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/redux-thunk/-/redux-thunk-2.3.0.tgz",
+      "integrity": "sha512-km6dclyFnmcvxhAcrQV2AkZmPQjzPDjgVlQtR0EQjxZPyJ0BnMf3in1ryuR8A2qU0HldVRfxYXbFSKlI3N7Slw=="
+    },
     "regenerate": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/regenerate/-/regenerate-1.4.0.tgz",

package.json

@@ -7,11 +7,14 @@
     "axios": "^0.18.0",
     "react": "^16.6.3",
     "react-dom": "^16.6.3",
+    "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-form": "^8.1.0",
+    "redux-thunk": "^2.3.0"
   },
   "scripts": {
     "start": "react-scripts start",

src/actions/addNewStaffAction.js

@@ -0,0 +1,32 @@
+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 AddNewStaff = 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)))
+    }
+}

src/actions/index.js

@@ -1,5 +0,0 @@
-import * as types from "../constants/actionTypes";
-
-export const getUsersData = (payload)=>({
-    type: types.GETDATA, payload
-});

src/actions/searchStaffAction.js

@@ -0,0 +1,39 @@
+import  * as types from '../constants/actionTypes';
+
+const axios = require('axios');
+
+export const getInfoSearchStaffData = payload =>({
+    type: types.GET_INFO_SEARCH_STAFF_DATA,
+    payload
+})
+
+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))},1000)
+                        })
+                    .catch(
+                        err=>{dispatch(searchStaffrequestFail(err))
+                        })    
+        
+    }
+}

src/actions/staffsAction.js

@@ -0,0 +1,36 @@
+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 = (payload)=>{
+    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));
+                    })    
+			
+	};
+};
+

src/components/AllStaffs/FullInfoAboutStaff.js

@@ -0,0 +1,17 @@
+import React, { Component } from 'react';
+
+class FullInfoAboutStaff extends Component {
+    render() {
+        const { InfoStaff } = this.props
+        console.log(InfoStaff)
+        return (
+            <div>
+             {InfoStaff.map((el,key)=>(<div className="staff"  key={key}> {el.title} {el.price} {el.description} {el.img} </div>)
+                    )} 
+                    
+            </div>
+        );
+    }
+}
+
+export default FullInfoAboutStaff;

src/components/AllStaffs/index.js

@@ -0,0 +1,43 @@
+import React, { Component } from 'react';
+
+import { Link } from "react-router-dom";
+
+import Loader from 'react-loader-spinner'
+
+class AllStaffs extends Component {
+    
+    render() {
+            
+        const {inputStaffs,isFetching,getInfoStaffData} = this.props
+        console.log(this.props)
+           
+        let data;
+            if(isFetching===true){
+                data = <div> 
+                    <Loader 
+                type="Triangle"
+                color="#1890ff"
+                height="75"	
+                width="75"
+             /> 
+             </div> 
+            }
+            else{
+                data = <div className="staffs">
+                    {inputStaffs.map((el,key)=>(<Link to={'/staff'}  key={key} onClick={getInfoStaffData.bind(null,[{description: el.description, title: el.title, price: el.price, img: el.img}])}><div className="staff" > {el.title} {el.price}  </div></Link> )
+                    )}    
+                      </div>
+            }
+        return (
+           <div>
+              
+                {data}
+           </div> 
+            
+        );
+    }
+}
+
+export default AllStaffs;
+
+// '/staff/'+el.title

src/components/Auth/index.js

@@ -3,7 +3,7 @@ import { reduxForm, Field } from "redux-form";
 import  authValidate  from "../../utils/validate";
 
 const Form = props => {
-  const { handleSubmit,submitting } = props
+  const { handleSubmit } = props
     return (
       <form className="auth__form" onSubmit={handleSubmit}>
         <label>Login:</label>

src/components/Auth/registration.js

@@ -1,26 +1,13 @@
 import React from 'react'
 import { Field, reduxForm } from 'redux-form'
 
-const axios = require('axios');
-const submit = values => {
-   axios.post(`http://127.0.0.1:2000/api/users`,{
-        "name": values.Name,
-        "description": "dfgfdhd",
-        "login": "Johny",
-        "password": values.Login,
-        "isAdmin": "0",
-        "email": values.email,
-        "avatar": "https://git-scm.com/book/ru/v1/",
-        "phone": values.Phone  
-})
-  .then(function (response) {
-    // handle success
-    console.log(response);
-  })
-  .catch((err)=>console.log(err))
-};
+
+
 const RegistrForm = props => {
   const { handleSubmit, pristine, reset, submitting } = props
+  const submit = values => {
+   console.log(props)
+};
   return (
     <form onSubmit={handleSubmit(submit)}>
       <div>

src/components/BtnAddNewStaff/index.js

@@ -0,0 +1,17 @@
+import React, { Component } from 'react';
+
+import { Link } from "react-router-dom";
+
+
+
+class BtnAddNewStaff extends Component {
+    render() {
+        return (
+            <div className="topbutton">
+               <Link to="/newStaff" className="topbutton">+</Link>
+            </div>
+        );
+    }
+}
+
+export default BtnAddNewStaff;

src/components/FormAddNewStaff/SendingStaffForm.js

@@ -0,0 +1,66 @@
+import React from 'react'
+import { Field, reduxForm } from 'redux-form'
+
+
+
+
+const SendingForm = props => {
+  const { handleSubmit, pristine, reset, submitting, AddNewStaff } = props
+  const submit = values => {
+   values.img = "http://site.com"
+   values.staff = "Машина"
+   values.state = 1
+   values.userId = 1
+   values.categoryId = 1
+   AddNewStaff(values)
+
+};
+  return (
+    <form onSubmit={handleSubmit(submit)}>
+      <div>
+       
+        <div>
+          <Field
+            name="title"
+            component="input"
+            type="text"
+            placeholder="Название"
+          />
+        </div>
+      </div>
+      <div>
+        
+        <div>
+          <Field
+            name="description"
+            component="input"
+            type="text"
+            placeholder="Описание"
+          />
+        </div>
+      </div>
+      <div> 
+        <div>
+          <Field
+            name="price"
+            component="input"
+            type="number"
+            placeholder="Цена"
+          />
+        </div>
+      </div>
+      <div>
+        <button type="submit" disabled={pristine || submitting}>
+          Submit
+        </button>
+        <button type="button" disabled={pristine || submitting} onClick={reset}>
+          Clear Values
+        </button>
+      </div>
+      </form>
+  )
+}
+
+export default reduxForm({
+  form: 'SendingForm'
+})(SendingForm)

src/components/FormAddNewStaff/index.js

@@ -0,0 +1,23 @@
+import React, { Component } from 'react';
+
+import MDSpinner from "react-md-spinner";
+
+import Form from '../FormAddNewStaff/SendingStaffForm'
+
+class FormAddNewStaff extends Component {
+    render() {
+        console.log(this.props)
+        const { staffData, isFetching } = this.props
+        
+        return (
+            <div>
+               <Form {...this.props}/>
+               {isFetching===true ? <div><MDSpinner size={100} duration={1000} /></div> : null}
+                {staffData.map((el,key)=>(<div key={key}> {el.description} {el.title} </div>))}
+ 
+            </div>
+        );
+    }
+}
+
+export default FormAddNewStaff;

src/components/Header/index.js

@@ -1,18 +0,0 @@
-import React, { Component } from 'react';
-import HeaderLogo from '../Header/logo'
-import SearchLine from '../Header/searchLine'
-import Myprofile from './Myprofile'
-import 'antd/dist/antd.css';
-class Header extends Component {
-    render() {
-        return (
-            <div className="header">
-               <HeaderLogo />
-               <SearchLine/>
-               <Myprofile/>
-            </div>
-        );
-    }
-}
-
-export default Header;

src/components/Header/logo.js

@@ -5,7 +5,7 @@ class HeaderLogo extends Component {
     render() {
         return (
             <div className="logo">
-               <Link to="/logo"><img src={logo} alt="Logo"/></Link> 
+               <Link to="/"><img src={logo} alt="Logo"/></Link> 
             </div>
         );
     }

src/components/Header/searchLine.js

@@ -1,69 +1,29 @@
 import React, { Component } from 'react';
-import { Input } from 'antd';
-const Search = Input.Search;
-const axios = require('axios');
 
-//Выводит всех пользователей
-// axios.get('http://127.0.0.1:2000/api/users')
-//   .then(function (response) {
-//     // handle success
-//     console.log(response.data);
-//   })
 
-//Добавить пользователя
-// axios.post(`http://127.0.0.1:2000/api/users`,{
-//         "name": "John",
-//         "description": "dfgfdhd",
-//         "login": "Johny",
-//         "password": "1234567",
-//         "isAdmin": "1",
-//         "email": "dsgdsgdf@gmail.com",
-//         "avatar": "",
-//         "phone": "+380951242245"  
-// })
-//   .then(function (response) {
-//     // handle success
-//     console.log(response);
-//   })
+import { Link } from "react-router-dom";
 
-//Обновление информации пользователя
-// axios.put(`http://127.0.0.1:2000/api/users`,{
-//     "id": "151",
-//         "name": "Joh124",
-//         "description": "dfgfdhd",
-//         "login": "Johny",
-//         "password": "1234567",
-//         "isAdmin": "1",
-//         "email": "dsgdsgdf@gmail.com",
-//         "avatar": "",
-//         "phone": "+380951242245"  
-// })
-//   .then(function (response) {
-//     // handle success
-//     console.log(response);
-//   })
 
-// axios.delete(`http://127.0.0.1:2000/api/users`, {
-//     "id": 151
-// })
-//   .then(function (response) {
-//     // handle success
-//     console.log(response);
-//   })
 
 
 class SearchLine extends Component {
+    changeHandler = (e)=>{
+            const {changeInputValue} = this.props
+            changeInputValue(e.target.value)
+        }
+    send = () =>{
+            const { inputData, searchStaff } = this.props
+            //console.log(this.props)
+            searchStaff(inputData)
+    }   
     render() {
         return (
             <div className="searchLine">
-                <Search className="searchInput"
-                    placeholder="input search text"
-                    onSearch={value => console.log(value)}
-                    enterButton
-                />
+            <input onChange={e=>{this.changeHandler(e)}} />
+            <Link to = '/search'><button onClick={this.send}>search</button></Link>
             </div>
         );
     }
 }
 
-export default SearchLine;
+export default SearchLine;

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, error } = this.props;
+		  return (
+			<Modal title="" visible={visible} onCancel={onCancel} onOk={onOk} >
+				{error==="error" ? <h4>Не все поля были заполнены</h4> : <h4>Ваше объявление успешно добавлено</h4>}
+			</Modal>
+		  );
+	}
+}

src/components/SearchStaffsPage/SearchFullInfoStaff.js

@@ -0,0 +1,17 @@
+import React, { Component } from 'react';
+
+class SearchFullInfoStaff extends Component {
+    render() {
+        console.log(this.props)
+        const {fullInfoSearchData} = this.props
+        return (
+            <div>
+                 {fullInfoSearchData.map((el,key)=>(<div key={key}> {el.title} {el.price} {el.description} </div>)
+                    )}  
+                    
+            </div>
+        );
+    }
+}
+
+export default SearchFullInfoStaff;

src/components/SearchStaffsPage/index.js

@@ -0,0 +1,32 @@
+import React, { Component } from 'react';
+import { Link } from "react-router-dom";
+import MDSpinner from "react-md-spinner";
+
+
+
+class SearchStaffsPage extends Component {
+    render() {
+        
+        const {searchData, getInfoSearchStaffData, isFetching } = this.props
+            
+        let data;
+            if(isFetching===true){
+                data = <div> <MDSpinner size={100} duration={1000} /> </div> 
+            }
+            else{
+                data = <div className="staffs">
+                      {searchData.map((el,key)=>(<Link to="/search/Staff"  key={key} onClick={getInfoSearchStaffData.bind(null,[{description: el.description, title: el.title, price: el.price, img: el.img}])} ><div className="staff" > {el.title} {el.price}  </div></Link> )
+                    )}
+                      </div>
+            }
+        return (
+            <div>
+                
+               {data} 
+                 
+            </div>
+        );
+    }
+}
+
+export default SearchStaffsPage;

src/constants/actionTypes.js

@@ -1 +1,13 @@
-export const GET_DATA = "GET_DATA";
+export const STAFF_REQUEST = "STAFF_REQUEST";
+export const STAFF_REQUEST_SUCCESS = "STAFF_REQUEST_SUCCESS";
+export const STAFF_REQUEST_FAIL = "STAFF_REQUEST_FAIL";
+export const GET_STAFF_INFO_DATA = "GET_STAFF_INFO_DATA";
+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";
+export const CHANGE_INPUT_VALUE = "CHANGE_INPUT_VALUE";
+export const GET_INFO_SEARCH_STAFF_DATA = "GET_INFO_SEARCH_STAFF_DATA"
+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 CLOSE_MODAL_WINDOW = "CLOSE_MODAL_WINDOW";

src/container/AddNewStaff.js

@@ -0,0 +1,46 @@
+import React, { Component, Fragment } from 'react';
+import { connect} from 'react-redux';
+import * as actions from "../actions/addNewStaffAction";
+
+import { bindActionCreators } from "redux";
+
+import FormAddNewStaff from '../components/FormAddNewStaff'
+
+import EditModal from "../components/Modal";
+
+class AddNewStaff extends Component {
+    
+  closeEditModal = () => {
+      const { closeModal } = this.props;
+        closeModal();
+  }
+      render() {
+        const { showModal, error } = this.props
+        return (
+          <Fragment>
+             <div >
+             
+            <FormAddNewStaff {...this.props}/>
+            
+          </div>
+          <EditModal  visible={showModal} onOk={this.closeEditModal} onCancel={this.closeEditModal} error = {error} />     
+          </Fragment>   
+           
+        );
+      }
+}
+
+
+const mapStateToProps = state => ({
+  staffData: state.addStaff.staffData,
+  isFetching: state.addStaff.isFetching,
+  showModal : state.addStaff.showModal,
+  error: state.addStaff.error
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+
+export default AddNewStaff = connect(
+      mapStateToProps,
+      mapDispatchToProps
+)(AddNewStaff);

src/container/App.js

@@ -1,18 +0,0 @@
-import React, { Component } from 'react';
-
-
-import LeftMenu from '../components/LeftMenu'
-
-class App extends Component {
-  render() {
-    return (
-      <div className='ras'>
-          <div className='ras1'>
-            <LeftMenu /> 
-          </div>
-      </div>       
-    );
-  }
-}
-
-export default App;

src/container/Header.js

@@ -0,0 +1,33 @@
+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 { bindActionCreators } from "redux";
+
+class Header extends Component {
+    render() {  
+        return (
+            <div className="header">
+               <HeaderLogo />
+               <SearchLine {...this.props}/>
+               <Myprofile/>
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+        inputData: state.searchStaff.inputData,
+        isFetching: state.searchStaff.isFetching
+  });
+  
+  const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+  
+  export default Header = connect(
+        mapStateToProps,
+        mapDispatchToProps
+  )(Header);

src/container/MainPage.js

@@ -0,0 +1,43 @@
+import React, { Component } from 'react';
+import { connect} from 'react-redux';
+import * as actions from "../actions/staffsAction";
+import LeftMenu from '../components/LeftMenu'
+import { bindActionCreators } from "redux";
+import AllStaffs from "../components/AllStaffs"
+
+import AddNewStaff from '../components/BtnAddNewStaff'
+
+class MainPage extends Component {
+ 
+    componentDidMount(){
+        const { getStaffsData } = this.props
+        getStaffsData()
+        
+    }
+      render() {
+        
+        return (
+          <div className='ras'>
+            <div className='ras1'>
+              <AddNewStaff/>
+              <LeftMenu />
+              <AllStaffs {...this.props}/>
+
+            </div>
+          </div>       
+        );
+      }
+}
+
+
+const mapStateToProps = state => ({
+  inputStaffs: state.staffs.inputStaffs,
+  isFetching: state.staffs.isFetching,
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+
+export default MainPage = connect(
+      mapStateToProps,
+      mapDispatchToProps
+)(MainPage);

src/container/MainPageStaffInfo.js

@@ -0,0 +1,30 @@
+import React, { Component } from 'react';
+import { connect} from 'react-redux';
+import * as actions from "../actions/staffsAction";
+import { bindActionCreators } from "redux";
+
+import FullInfoAboutStaff from '../components/AllStaffs/FullInfoAboutStaff'
+
+class MainPageStaffInfo extends Component {
+    render() {
+       
+        return (
+            <div>
+                <FullInfoAboutStaff {...this.props}/>
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+
+    InfoStaff: state.staffs.infoStaffs,
+
+  });
+  
+  const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+  
+  export default MainPageStaffInfo = connect(
+        mapStateToProps,
+        mapDispatchToProps
+  )(MainPageStaffInfo);

src/container/SearchStaffs.js

@@ -0,0 +1,32 @@
+import React, { Component } from 'react';
+import { connect} from 'react-redux';
+import * as actions from "../actions/searchStaffAction";
+
+import { bindActionCreators } from "redux";
+import SearchStaffsPage from "../components/SearchStaffsPage"
+
+
+class SearchStaff extends Component {
+ 
+      render() {
+        
+        return (
+          <div>
+            <SearchStaffsPage {...this.props}/>
+          </div>       
+        );
+      }
+}
+
+
+const mapStateToProps = state => ({
+    searchData: state.searchStaff.searchData,
+    isFetching: state.searchStaff.isFetching,
+});
+
+const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+
+export default SearchStaff = connect(
+      mapStateToProps,
+      mapDispatchToProps
+)(SearchStaff);

src/container/SearchStaffsInfo.js

@@ -0,0 +1,30 @@
+import React, { Component } from 'react';
+import { connect} from 'react-redux';
+import * as actions from "../actions/searchStaffAction";
+import { bindActionCreators } from "redux";
+
+import SearchFullInfoStaff from '../components/SearchStaffsPage/SearchFullInfoStaff'
+
+class SearchInfoStaffsInfo extends Component {
+    render() {
+       
+        return (
+            <div>
+                <SearchFullInfoStaff {...this.props}/>
+            </div>
+        );
+    }
+}
+
+const mapStateToProps = state => ({
+
+    fullInfoSearchData: state.searchStaff.fullInfoSearchData
+
+  });
+  
+  const mapDispatchToProps = dispatch => bindActionCreators({ ...actions }, dispatch);
+  
+  export default SearchInfoStaffsInfo = connect(
+        mapStateToProps,
+        mapDispatchToProps
+  )(SearchInfoStaffsInfo);

src/index.css

@@ -69,3 +69,31 @@ code {
   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;
+  }
+
+  

src/index.js

@@ -1,6 +1,7 @@
 import React from 'react';
 import ReactDOM from 'react-dom';
 import './index.css';
+import 'antd/dist/antd.css';
 import * as serviceWorker from './serviceWorker';
 import { BrowserRouter } from "react-router-dom";
 import Router from "./router";

src/reducer/addStaff.js

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

src/reducer/index.js

@@ -1,9 +1,13 @@
 import { combineReducers } from "redux";
 import { reducer as formReducer } from 'redux-form';
 
-import users from './users'
+import staffs from './staffs'
+import searchStaff from './searchStaff'
+import addStaff from './addStaff'
 
 export default  combineReducers({
-    users: users,
+    staffs: staffs,
+    searchStaff,
+    addStaff,
     form: formReducer,
 })

src/reducer/searchStaff.js

@@ -0,0 +1,49 @@
+import * as types from '../constants/actionTypes'
+
+const initState = {
+    inputData: "",
+    searchData: [],
+    fullInfoSearchData: [],
+    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"
+            }
+        }
+        case types.GET_INFO_SEARCH_STAFF_DATA: {
+            return {
+                ...state,
+                fullInfoSearchData: payload
+            }
+        }
+
+        default: return state;
+    }
+}

src/reducer/staffs.js

@@ -0,0 +1,45 @@
+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;    
+    }
+  };
+
+  

src/reducer/users.js

@@ -1,21 +0,0 @@
-import * as types from "../constants/actionTypes";
-
-const initState = {
-    inputData: [],
-    isFetching: false,
-    error: null
-  };
-
-  export default (state = initState, { type, payload }) => {
-    
-      switch (type) {
-        case types.GET_DATA: {
-          return {
-          ...state,
-          inputData: payload
-          }
-        }
-        
-        default: return state;    
-    }
-  };

src/router.js

@@ -1,19 +1,33 @@
-import React, {Fragment} from "react";
+import React from "react";
 import { Switch, Route } from "react-router-dom";
 
-import App from "./container/App";
-import Header from './components/Header'
+import MainPage from "./container/MainPage";
+import Header from './container/Header'
 import Form from './components/Auth/index'
 import RegistrForm from './components/Auth/registration'
+import MainPageStaffInfo from './container/MainPageStaffInfo'
+
+import SearchStaffs from './container/SearchStaffs'
+
+import SearchStaffsInfo from './container/SearchStaffsInfo'
+
+import AddNewStaff from './container/AddNewStaff'
 
 export default () => (
     <div>
+        
         <Header/>
 	        <Switch>
-                <Route path="/" exact component={App} />
-                <Route path="/auth" exact component={Form} />
-                <Route path="/registration" exact component={RegistrForm} />
-
+                <Route path="/" exact component={()=><MainPage/>} />
+                    <Route path="/auth" exact component={()=><Form/>} />
+                    <Route path="/registration" exact component={()=><RegistrForm/>} />
+                    <Route path="/staff" exact component={()=><MainPageStaffInfo/>} />
+                    <Route path="/search" exact component={()=><SearchStaffs/>} />
+                        <Route path="/search/Staff" exact component={()=><SearchStaffsInfo/>} />
+                    <Route path="/newStaff" exact component={()=><AddNewStaff/>} />
+                
 	        </Switch>
     </div>
-);
+);
+
+// /Ортопедическое кресло Austin/Рассрочка

src/state/state.js

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