19 Commits 946c400aaa ... b912842a18

Author SHA1 Message Date
  Alex b912842a18 add Private Routing 5 years ago
  Boris K 9067ced985 working on change doctor 5 years ago
  Boris K 01485040b4 appoint change 5 years ago
  Boris K 625ef04201 test 5 years ago
  Mila-Zagrevskaya 6a4f6cd240 changed appointment part add time-buttons 5 years ago
  Mila-Zagrevskaya bd8a1b7459 added accordion to services part 5 years ago
  Mila-Zagrevskaya a1dccea1a9 added accordion to services part 5 years ago
  Mila-Zagrevskaya 4e9a9dab22 mobile version 5 years ago
  Mila-Zagrevskaya 66ff46cd13 mobile version 5 years ago
  Mila-Zagrevskaya 6e905b238e mobile version 5 years ago
  Alex d7eccda66d add a little bit private 5 years ago
  Boris K c250bf4f5a some 5 years ago
  Mila-Zagrevskaya 7015bd2719 add cards-servises 5 years ago
  Mila-Zagrevskaya d142e05e4b add cards-servises 5 years ago
  Boris K ff3f53df4e reworked appointment-calendar and admin-shedule-calendar for ato renew 5 years ago
  Boris K 24f4269e3a reworked calendar to reducer 5 years ago
  Mila-Zagrevskaya 7e65e9c644 admin part 5 years ago
  Mila-Zagrevskaya bf0135a2e7 shedule 5 years ago
  Mila-Zagrevskaya 5881cecb7b shedule 5 years ago
41 changed files with 1122 additions and 491 deletions
  1. 25 56
      package-lock.json
  2. 1 0
      package.json
  3. BIN
      public/images/services/endodontics.png
  4. BIN
      public/images/services/endodontics1.png
  5. BIN
      public/images/services/implantologist.png
  6. BIN
      public/images/services/kids.png
  7. BIN
      public/images/services/orthodontist.png
  8. BIN
      public/images/services/surgeon.png
  9. BIN
      public/images/services/therapist.png
  10. 35 25
      src/App.js
  11. 2 1
      src/actions/actions.js
  12. 35 3
      src/actions/auth.js
  13. 17 0
      src/actions/calendar.js
  14. 13 0
      src/actionsTypes/actionsTypes.js
  15. BIN
      src/assets/images/Arrows-Down-4-icon.png
  16. 1 5
      src/components/Admin/Admin.js
  17. 69 61
      src/components/Admin/ChangeServices-Doctors.js
  18. 1 0
      src/components/Admin/Input.js
  19. 31 18
      src/components/Admin/Shedule.js
  20. 64 14
      src/components/Reviews.js
  21. 0 48
      src/components/Services.js
  22. 47 20
      src/components/appointment/Appointment.js
  23. 65 36
      src/components/appointment/Calendar.js
  24. 1 1
      src/components/header/index.js
  25. 30 32
      src/components/header/navigation.js
  26. 3 3
      src/components/main/Main.js
  27. 10 8
      src/components/main/team.js
  28. 61 0
      src/components/services/Services.js
  29. 64 0
      src/components/services/categories.js
  30. 1 1
      src/components/signIn.js
  31. 1 1
      src/components/signUp.js
  32. 11 9
      src/containers/auth.js
  33. BIN
      src/icomoon.zip
  34. 14 4
      src/reducers/auth.js
  35. 77 0
      src/reducers/calendar.js
  36. 2 0
      src/reducers/index.js
  37. 17 104
      src/reducers/reducers.js
  38. 293 31
      src/style/all.scss
  39. 10 3
      src/style/auth.scss
  40. 28 0
      src/style/style.css
  41. 93 7
      src/utils/formFields.js

+ 25 - 56
package-lock.json

@@ -2932,8 +2932,7 @@
             },
             "ansi-regex": {
               "version": "2.1.1",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "aproba": {
               "version": "1.2.0",
@@ -2951,13 +2950,11 @@
             },
             "balanced-match": {
               "version": "1.0.0",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "brace-expansion": {
               "version": "1.1.11",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "balanced-match": "^1.0.0",
                 "concat-map": "0.0.1"
@@ -2970,18 +2967,15 @@
             },
             "code-point-at": {
               "version": "1.1.0",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "concat-map": {
               "version": "0.0.1",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "console-control-strings": {
               "version": "1.1.0",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "core-util-is": {
               "version": "1.0.2",
@@ -3084,8 +3078,7 @@
             },
             "inherits": {
               "version": "2.0.3",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "ini": {
               "version": "1.3.5",
@@ -3095,7 +3088,6 @@
             "is-fullwidth-code-point": {
               "version": "1.0.0",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "number-is-nan": "^1.0.0"
               }
@@ -3108,20 +3100,17 @@
             "minimatch": {
               "version": "3.0.4",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "brace-expansion": "^1.1.7"
               }
             },
             "minimist": {
               "version": "0.0.8",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "minipass": {
               "version": "2.3.5",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "safe-buffer": "^5.1.2",
                 "yallist": "^3.0.0"
@@ -3138,7 +3127,6 @@
             "mkdirp": {
               "version": "0.5.1",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "minimist": "0.0.8"
               }
@@ -3211,8 +3199,7 @@
             },
             "number-is-nan": {
               "version": "1.0.1",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "object-assign": {
               "version": "4.1.1",
@@ -3222,7 +3209,6 @@
             "once": {
               "version": "1.4.0",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "wrappy": "1"
               }
@@ -3298,8 +3284,7 @@
             },
             "safe-buffer": {
               "version": "5.1.2",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "safer-buffer": {
               "version": "2.1.2",
@@ -3329,7 +3314,6 @@
             "string-width": {
               "version": "1.0.2",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "code-point-at": "^1.0.0",
                 "is-fullwidth-code-point": "^1.0.0",
@@ -3347,7 +3331,6 @@
             "strip-ansi": {
               "version": "3.0.1",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "ansi-regex": "^2.0.0"
               }
@@ -3386,13 +3369,11 @@
             },
             "wrappy": {
               "version": "1.0.2",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "yallist": {
               "version": "3.0.3",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             }
           }
         },
@@ -6986,8 +6967,7 @@
             },
             "ansi-regex": {
               "version": "2.1.1",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "aproba": {
               "version": "1.2.0",
@@ -7011,7 +6991,6 @@
             "brace-expansion": {
               "version": "1.1.11",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "balanced-match": "^1.0.0",
                 "concat-map": "0.0.1"
@@ -7024,8 +7003,7 @@
             },
             "code-point-at": {
               "version": "1.1.0",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "concat-map": {
               "version": "0.0.1",
@@ -7034,8 +7012,7 @@
             },
             "console-control-strings": {
               "version": "1.1.0",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "core-util-is": {
               "version": "1.0.2",
@@ -7138,8 +7115,7 @@
             },
             "inherits": {
               "version": "2.0.3",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "ini": {
               "version": "1.3.5",
@@ -7149,7 +7125,6 @@
             "is-fullwidth-code-point": {
               "version": "1.0.0",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "number-is-nan": "^1.0.0"
               }
@@ -7162,20 +7137,17 @@
             "minimatch": {
               "version": "3.0.4",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "brace-expansion": "^1.1.7"
               }
             },
             "minimist": {
               "version": "0.0.8",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "minipass": {
               "version": "2.3.5",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "safe-buffer": "^5.1.2",
                 "yallist": "^3.0.0"
@@ -7192,7 +7164,6 @@
             "mkdirp": {
               "version": "0.5.1",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "minimist": "0.0.8"
               }
@@ -7265,8 +7236,7 @@
             },
             "number-is-nan": {
               "version": "1.0.1",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "object-assign": {
               "version": "4.1.1",
@@ -7276,7 +7246,6 @@
             "once": {
               "version": "1.4.0",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "wrappy": "1"
               }
@@ -7352,8 +7321,7 @@
             },
             "safe-buffer": {
               "version": "5.1.2",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "safer-buffer": {
               "version": "2.1.2",
@@ -7383,7 +7351,6 @@
             "string-width": {
               "version": "1.0.2",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "code-point-at": "^1.0.0",
                 "is-fullwidth-code-point": "^1.0.0",
@@ -7401,7 +7368,6 @@
             "strip-ansi": {
               "version": "3.0.1",
               "bundled": true,
-              "optional": true,
               "requires": {
                 "ansi-regex": "^2.0.0"
               }
@@ -7440,13 +7406,11 @@
             },
             "wrappy": {
               "version": "1.0.2",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             },
             "yallist": {
               "version": "3.0.3",
-              "bundled": true,
-              "optional": true
+              "bundled": true
             }
           }
         }
@@ -10595,6 +10559,11 @@
         "scheduler": "^0.13.6"
       }
     },
+    "react-accessible-accordion": {
+      "version": "3.0.0",
+      "resolved": "https://registry.npmjs.org/react-accessible-accordion/-/react-accessible-accordion-3.0.0.tgz",
+      "integrity": "sha512-pRfqyPFdCZlYuICYerLznzve/+Jmcah1RFFLDF4kOyWJijoa1Eo9bLYea/+4yJwAdTLj69xzcS8j4L704zMuAQ=="
+    },
     "react-app-polyfill": {
       "version": "1.0.1",
       "resolved": "https://registry.npmjs.org/react-app-polyfill/-/react-app-polyfill-1.0.1.tgz",

+ 1 - 0
package.json

@@ -9,6 +9,7 @@
     "moment": "^2.24.0",
     "node-sass": "^4.12.0",
     "react": "^16.8.6",
+    "react-accessible-accordion": "^3.0.0",
     "react-dom": "^16.8.6",
     "react-escape-outside": "^0.1.1",
     "react-full-page": "^0.1.7",

BIN
public/images/services/endodontics.png


BIN
public/images/services/endodontics1.png


BIN
public/images/services/implantologist.png


BIN
public/images/services/kids.png


BIN
public/images/services/orthodontist.png


BIN
public/images/services/surgeon.png


BIN
public/images/services/therapist.png


+ 35 - 25
src/App.js

@@ -1,23 +1,29 @@
 import React from 'react';
-import {connect} from 'react-redux'
+import {connect} from 'react-redux';
 import {Switch, Route} from "react-router-dom";
 // import { BrowserHistory } from 'react-history'
 
 import {
     getDoctors,
     getServices,
+   
 } from "./actions/actions";
 
-import Loader from "./components/loader"
-import Header from "./components/header/index"
+import {
+    getUser,
+} from "./actions/auth"
+
+import Loader from "./components/loader";
+import Header from "./components/header/index";
 import Main from "./components/main/Main";
 import Doctors from "./components/specialists/Doctors";
-import Services from "./components/Services"
-import MoreInfo from "./components/specialists/MoreInfo"
+import Services from "./components/services/Services";
+// import Categories from "./components/services/categories"
+import MoreInfo from "./components/specialists/MoreInfo";
 import Appointment from "./components/appointment/Appointment";
-import Reviews from "./components/Reviews"
-import Admin from './components/Admin/Admin'
-import Auth from './containers/auth'
+import Reviews from "./components/Reviews";
+import Admin from './components/Admin/Admin';
+import Auth from './containers/auth';
 import Footer from "./components/Footer";
 // import Calendar from "./components/Calendar"
 import User from './components/user'
@@ -95,7 +101,7 @@ const route = [
         id: 9,
         exact: true,
 		path: "/user",
-		protected: false,
+		protected: true,
 		component: User
     },
     {
@@ -110,22 +116,24 @@ export class App extends React.Component {
     componentDidMount() {
         this.props.getDoctors();
         this.props.getServices();
-        
-        console.log (this.props.app)
-        
-    //     fetch ("https://api-clinics.herokuapp.com/api/v1/auth/login", {
-    //         method : "POST",
-    //         credentials: "include",
-    //         headers: {
-    //             "Content-Type": "application/json"
-    //         },
-    //         body: JSON.stringify ({
-    //             email: "test@test.com",
-    //             password: "qwerty"
-    //         })
-    //     })
-    //         .then (res => res.json ())
-    //         .then (res => console.log (res))
+
+       if(localStorage.getItem('userId')){
+       this.props.getUser()
+       }
+
+        // fetch ("https://api-clinics.herokuapp.com/api/v1/auth/login", {
+        //     method : "POST",
+        //     credentials: "include",
+        //     headers: {
+        //         "Content-Type": "application/json"
+        //     },
+        //     body: JSON.stringify ({
+        //         email: "test@test.com",
+        //         password: "qwerty"
+        //     })
+        // })
+        //     .then (res => res.json ())
+        //     .then (res => console.log (res))
     }
 
     render() {
@@ -152,12 +160,14 @@ export class App extends React.Component {
 const mapStateToProps = state => {
     return {
         app:state.app,
+        user:state.auth.user
     }
 };
 
 const mapDispatchToProps = {
     getDoctors,
     getServices,
+    getUser,
 };
 
 export default connect (mapStateToProps,mapDispatchToProps)(App)

+ 2 - 1
src/actions/actions.js

@@ -99,6 +99,7 @@ const getDoctorsRequestFail = payload => ({
 });
 
 export const getDoctors = () => dispatch => {
+    // console.log('get')
     dispatch(getDoctorsRequest());
     return fetch(`${URL}doctors`,{
         credentials:"include"
@@ -228,7 +229,7 @@ export const postShedule = (payload) => dispatch => {
         body: JSON.stringify(payload)
     })
         .then(res => res.json())
-        .then(res => dispatch(postSheduleSuccess(res)))
+        .then(res => dispatch(postSheduleSuccess(res))).then(dispatch(getDoctors()))
         .catch(err => dispatch(postSheduleFail(err)));
 };
 

+ 35 - 3
src/actions/auth.js

@@ -22,8 +22,7 @@ export const auth = payload => {
         dispatch(authRequest());
         try {
             const { data } = await axios.post("https://api-clinics.herokuapp.com/api/v1/auth/login", payload);
-            localStorage.setItem("userId",JSON.stringify(data.user._id))
-            console.log('data',data)
+            localStorage.setItem("userId",data.user._id)
             dispatch(authRequestSuccess(data));
 
            
@@ -63,4 +62,37 @@ export const register = payload => {
             dispatch(registrRequestFail(error))
         }
     };
-};
+};
+
+
+const getUserRequest = payload => {
+    return {
+    type: types.GET_USER_REQUEST,
+    payload
+}}
+
+const getUserRequestSuccess = payload => ({
+    type: types.GET_USER_REQUEST_SUCCESS,
+    payload
+})
+
+const getUserRequestFail = payload => ({
+    type: types.GET_USER_REQUEST_FAIL,
+    payload
+})
+
+export const getUser = () => dispatch => {
+    dispatch(getUserRequest());
+    return fetch(`https://api-clinics.herokuapp.com/api/v1/users/` + localStorage.getItem('userId'),{
+        credentials:"include"
+    })
+        .then(res => res.json())
+        .then(res => dispatch(getUserRequestSuccess(res)))
+        .catch(err => dispatch(getUserRequestFail(err)));
+};
+
+
+export const userLogout = payload => ({
+    type: types.USER_LOGOUT,
+    payload
+})

+ 17 - 0
src/actions/calendar.js

@@ -0,0 +1,17 @@
+import * as types from '../actionsTypes/actionsTypes'
+
+export const createCalendarMonthArray = payload => ({
+    type: types.CREATE_CALENDAR_MONTH_ARRAY,
+    payload
+});
+
+export const changeCalendarMonth = payload => ({
+    type: types.CHANGE_CALENDAR_MONTH,
+    payload
+});
+
+export const resetCurrent = payload => ({
+    type: types.RESET_CALENDAR_CURRENT,
+    payload
+});
+

+ 13 - 0
src/actionsTypes/actionsTypes.js

@@ -21,6 +21,12 @@ export const REGISTRATION_REQUEST = "REQISTRATION_REQUEST";
 export const REGISTRATION_REQUEST_SUCCESS = "REGISTRATION_REQUEST_SUCCESS";
 export const REGISTRATION_REQUEST_FAIL = "REGISTRATION_REQUEST_FAIL";
 
+export const GET_USER_REQUEST = "GET_USER_REQUEST";
+export const GET_USER_REQUEST_SUCCESS = "GET_USER_REQUEST_SUCESS";
+export const GET_USER_REQUEST_FAIL = "GET_USER_REQUEST_FAIL";
+
+export const USER_LOGOUT = "USER_LOGOUT"
+
 export const POST_DOCTORS_REQUEST = "POST_DOCTORS_REQUEST";
 export const POST_DOCTORS_REQUEST_SUCCESS = "POST_DOCTORS_REQUEST_SUCCESS";
 export const POST_DOCTORS_REQUEST_FAIL = "POST_DOCTORS_REQUEST_FAIL";
@@ -61,5 +67,12 @@ export const CHANGE_INPUT_VALUE_SERVICE_FORM= "CHANGE_INPUT_VALUE_SERVICE_FORM";
 export const CHANGE_SELECTED_DOCTOR_ID= "CHANGE_SELECTED_DOCTOR_ID";
 export const CHANGE_SELECTED_SERVICE_ID= "CHANGE_SELECTED_SERVICE_ID";
 
+export const CREATE_CALENDAR_MONTH_ARRAY= "CREATE_CALENDAR_MONTH_ARRAY";
+export const CHANGE_CALENDAR_MONTH= "CHANGE_CALENDAR_MONTH";
+export const RESET_CALENDAR_CURRENT= "RESET_CALENDAR_CURRENT";
+
+
+
+
 
 

BIN
src/assets/images/Arrows-Down-4-icon.png


+ 1 - 5
src/components/Admin/Admin.js

@@ -24,13 +24,11 @@ import ChangeServicesDoctors from './ChangeServices-Doctors'
 
 export class Admin extends React.Component {
 
-
     render() {
         const {
             doctors,
             services,
             postNewShedule,
-            sheduleMonthArray,
             postNewDoctor,
             postNewService,
             changeDoctorId,
@@ -50,6 +48,7 @@ export class Admin extends React.Component {
             deleteServices,
             postServices
         } = this.props;
+
         return (
             <div className="main">
                 <div className="info-wrap">
@@ -62,7 +61,6 @@ export class Admin extends React.Component {
                         <Route path='/admin/change-shedule' render={() => <Shedule
                             doctors={doctors}
                             postNewShedule={postNewShedule}
-                            sheduleMonthArray={sheduleMonthArray}
                             setSheduleDoctor={setSheduleDoctor}
                             postShedule={postShedule}
                         />} />
@@ -112,8 +110,6 @@ const mapDispatchToProps = {
     postServices,
     putServices,
     deleteServices
-
-
 };
 
 export default connect (mapStateToProps,mapDispatchToProps)(Admin)

+ 69 - 61
src/components/Admin/ChangeServices-Doctors.js

@@ -3,87 +3,95 @@ import Input from './Input'
 
 export default class ChangeServicesDoctors extends React.Component {
 
+    postNewItem = (e) => {
+        const obj = {};
+        e.preventDefault();
+        this.props.form.map(el => {
+            obj[el.name] = el.value
+        });
+        this.props.postItem(obj)
+    };
 
-    render() {
+    changeItem = (e) => {
         const obj = {};
+        e.preventDefault();
+        this.props.form.map(el => {
+            if (el.value !== '')
+                obj[el.name] = el.value
+        });
+        this.props.putItem({data:obj,id:this.props.itemId})
+
+    };
+
+    deleteItem = () => {
+        this.props.deleteItem(this.props.itemId)
+    };
+
+    changeId = (e) => {
+        this.props.changeId(e.target.value)
+    };
+
+    render() {
         const {
             data,
             itemId,
             form,
-            postItem,
-            putItem,
-            deleteItem,
-            changeId,
             changeInputValues,
         } = this.props;
         return (
-            <div style={{display:'flex',flexDirection:'column', width:'400px', margin:'10px 20px'}}>
-                <form style={{display:"flex",flexDirection:"column"}} onSubmit={(e)=>{
-                    e.preventDefault();
-                    // eslint-disable-next-line array-callback-return
-                    form.map(el => {
-                        obj[el.name] = el.value
-                    });
-                    postItem(obj)
-                }}
-                >
-                    {
-                        form.map(el => (
-                            <Input
-                                key={el.id}
-                                id={el.id}
-                                el={el}
-                                changeInputValues={changeInputValues}
-                            />
-                        ))
-                    }
-                    <input
-                        type='submit'
-                        value='Post New Item'
-                    />
-                </form>
-
-                <select  onChange={(e)=>changeId(e.target.value)} defaultValue='choose item'>
-                    <option disabled >choose item</option>
-                    {
-                        data.map(el=> (
-                            <option key={el._id}>{el.name}</option>
-                        ))
-                    }
-                </select>
-                {itemId &&
-                <button onClick={()=>deleteItem(itemId)} style={{backgroundColor:"red"}}>DELETE Item</button>
-                }
-                {
-                    <form style={{display:"flex",flexDirection:"column",margin:"20px 0"}} onSubmit={(e)=>{
-                        e.preventDefault();
-                        // eslint-disable-next-line array-callback-return
-                        form.map(el => {
-                            if (el.value !== '')
-                                obj[el.name] = el.value
-                        });
-                        putItem({data:obj,id:itemId})
-
-                    }}>
-                        {itemId &&
-                        form.map(el => {
-                            el.required = false;
-                            return (
+            <div className = "change-services-doctors">
+                <div className="admin-item">
+                    <form className ="form-doctors" onSubmit={this.postNewItem}>
+                        {
+                            form.map(el => (
                                 <Input
                                     key={el.id}
                                     id={el.id}
                                     el={el}
                                     changeInputValues={changeInputValues}
                                 />
-                            )
-                        })
+                            ))
+                        }
+                        <input className = "btn link"
+                               type='submit'
+                               value='Добавить '
+                        />
+                    </form>
+                </div>
+                <div className="admin-item">
+                    <select  className = "appointment admin-form"  onChange={this.changeId} defaultValue='Выбрать'>
+                        <option disabled >Выбрать</option>
+                        {
+                            data.map(el=> (
+                                <option key={el._id}>{el.name}</option>
+                            ))
+                        }
+                    </select>
+
+                    <form  onSubmit={this.props.changeItem}>
+                        {itemId &&
+                            form.map(el => {
+                                el.required = false;
+                                return (
+                                    <Input
+                                        key={el.id}
+                                        id={el.id}
+                                        el={el}
+                                        changeInputValues={changeInputValues}
+                                    />
+                                )
+                            })
                         }
                         <input
+                            className = "btn link"
                             type='submit'
-                            value='Change Selected Item'
+                            value='Изменить выбранный элемент'
                         />
                     </form>
-                }
+                    {itemId &&
+                    <button className = "btn link" onClick={this.deleteItem} style={{backgroundColor:"#ff9774"}}>Удалить выбранный элемент</button>
+                    }
+                </div>
             </div>
         );
     }

+ 1 - 0
src/components/Admin/Input.js

@@ -4,6 +4,7 @@ export default class Input extends React.Component {
     render(){
         return (
             <input
+                className = "appointment admin-form"
                 id={this.props.el.id}
                 type={this.props.el.type}
                 name={this.props.el.name}

+ 31 - 18
src/components/Admin/Shedule.js

@@ -9,7 +9,8 @@ export default class Shedule extends React.Component {
         endDate:null,
     };
 
-    post = () => {
+    post = (e) => {
+        e.preventDefault()
         let current = new Date(this.state.startDate);
         let end = new Date (this.state.endDate);
         while (current.toISOString().split('T')[0] <= end.toISOString().split('T')[0]){
@@ -19,43 +20,55 @@ export default class Shedule extends React.Component {
                     data:current.toISOString().split('T')[0],
                 });
             }
-
             current = new Date(+current + 86400000)
         }
     };
 
+    changeStart = (e) => {
+        this.setState({startDate:e.target.value } )
+    };
+    changeEnd = (e) => {
+        this.setState ( { endDate:e.target.value } )
+    };
+    setDoctor = (e) => {
+        this.props.setSheduleDoctor(e.target.value)
+    };
+
     render() {
-        console.log(this.props)
-        const {doctors,postNewShedule,sheduleMonthArray,setSheduleDoctor} = this.props;
+        const {doctors, postNewShedule} = this.props;
+        const doctor = doctors.find(el => el._id === postNewShedule.doctor);
+
         return (
             <div  className = "shedule-container" >
-                <div className="option">
-                    <select className = "appointment admin-appointment"  onChange={(e) => setSheduleDoctor(e.target.value)} defaultValue='Выберите доктора'>
-                    <option disabled >Выберите доктора</option>
+                <div className = "option" >
+                    <select className = "appointment admin-appointment"  onChange={this.setDoctor} defaultValue={doctor ? doctor.name : 'Выберите доктора'}>
+                        <option disabled >Выберите доктора</option>
                         {
-                            doctors.map(el=> (
-                                <option key={el._id} id={el._id}>{el.name}</option>
-                            ))
+                            doctors.map ( el=> (
+                                <option key={el._id} id={el._id}> {el.name} </option>
+                            ) )
                         }
                     </select>
 
                     {postNewShedule.doctor &&
                         <div className = "input-box">
-                            <input className = "shedule-input " type="date" onChange={(e) => this.setState({startDate:e.target.value})}/>
-                            <input className = "shedule-input right" type="date" onChange={(e) => this.setState({endDate:e.target.value})}/>
+                            <input className = "shedule-input " type="date" onChange = {this.changeStart}/>
+                            <input className = "shedule-input right" type="date" onChange = {this.changeEnd}/>
                         </div>
                     }
 
-
-                {(this.state.startDate && this.state.endDate) && <button className = "btn admin" onClick={this.post}>Post</button>}
-
+                    {(this.state.startDate && this.state.endDate) &&
+                        <button className = "btn admin" onClick = {this.post}> Отправить </button>
+                    }
                 </div>
-                
 
                 {postNewShedule.doctor &&
-                <Calendar doctor={doctors.find(el=> el._id === postNewShedule.doctor)} setAppointmentShedule={console.log}/>
+                    <Calendar
+                        doctor={doctor}
+                        action = {console.log}
+                    />
                 }
             </div>
         );
     }
-}
+}

+ 64 - 14
src/components/Reviews.js

@@ -2,24 +2,74 @@ import React from 'react';
 // import {Link} from 'react-router-dom';
 // import Button from "../buttons/button";
 // import { postServices} from "../../store/app/actions";
+import {connect} from 'react-redux'
+import {
+    changeInputValueDoctorForm,
+} from "../actions/actions";
 
 
 
-
-export default class Reviews extends React.Component {
+export class Reviews extends React.Component {
     render( ) {
-        // const {postDoctors } = this.props
-        
+        const {postNewDoctor,doctors,servicesArray} = this.props.app
+        const servArray =  Object.keys(servicesArray).map(key => {
+            return [key, servicesArray[key]];
+        })
+        let doctor
+        if (doctors[0]) {
+            doctor = doctors[2].speciality
+        }
+        console.log(doctor)
+        console.log(servArray)
+
         return (
-            <div className = "main">
-                <div className="info-wrap">
-                                    <h2>Отзывы</h2>
-                <div classdescription = "reviews-container">
-                        ЗДЕСЬ БУДУТ ОТЗЫВЫ ПОСЕТИТЕЛЕЙ
-                 </div>
-                </div>
-
-            </div>
+           <div style={{display:'flex',margin:'100px 5px'}}>
+               {doctor &&
+                   servArray.map(el => (
+                       <div key={[el[0]]}>
+                           <p>{el[0]}</p>
+
+                            {
+                                el[1].map(item => (
+                                    <div key={item._id} style={{display:'flex',margin:'5px 5px',flexDirection:'column',width:'200px'}}>
+                                        <label >
+                                            <input
+                                                type="checkbox"
+                                                value={item._id}
+                                                defaultChecked={doctor.find(spec => spec._id === item._id)}
+                                            />
+                                            {item.name}
+                                        </label>
+                                    </div>
+                                ))
+                            }
+
+                       </div>
+                   ))
+               }
+           </div>
         ) 
     }
-}        
+}
+
+const mapStateToProps = state => {
+    return {
+        app:state.app,
+    }
+};
+
+const mapDispatchToProps = {
+    changeInputValueDoctorForm,
+};
+
+export default connect (mapStateToProps,mapDispatchToProps)(Reviews)
+
+// <div className = "main">
+//     <div className="info-wrap">
+//     <h2>Отзывы</h2>
+// <div classdescription = "reviews-container">
+//     ЗДЕСЬ БУДУТ ОТЗЫВЫ ПОСЕТИТЕЛЕЙ
+// </div>
+// </div>
+//
+// </div>

+ 0 - 48
src/components/Services.js

@@ -1,48 +0,0 @@
-import React from 'react';
-import {Link} from 'react-router-dom'
-import {connect} from 'react-redux'
-
-export class Services extends React.Component {
-    render() {
-        const {data} = this.props;
-        // console.log ("data:", {data})
-
-        return (
-            <div className="main">
-                <div className="wrapper">
-                    <div className = "doctors-wrap">
-                        {
-                            data.map ( el => (
-                                <div key={el._id} className = "item">
-                                    <p>{el.name}</p>
-                                    <p>Длительность: {el.duration} ч.</p> 
-                                    <p>{el.description}</p>
-                                    <p>Цена: {el.price} грн.</p>
-                                    <div>
-                                        <Link to= {`/services/${el._id}`} className = "btn more "> Подробнее ... </Link>
-                                        <button className = "btn link"> Записаться на приём </button>
-                                    </div>
-                             </div>
-                            ) )
-                        }
-                    </div>
-                </div>
-            </div>
-        );
-    }
-}
-
-const mapStateToProps = state => {
-    return {
-        data:state.app.services
-    }
-};
-
-const mapDispatchToProps = {
-
-};
-
-export default connect (mapStateToProps,mapDispatchToProps)(Services)
-
-
-

+ 47 - 20
src/components/appointment/Appointment.js

@@ -13,6 +13,7 @@ import {
 
 } from "../../actions/actions";
 
+
 import Calendar from "./Calendar";
 
 export class Appoint extends React.Component {
@@ -25,9 +26,26 @@ export class Appoint extends React.Component {
         this.props.clearAppointment()
     }
 
+    setSpec = (e) => {
+        this.props.setAppointmentSpec(e.target.value)
+    };
+
+    setTime = (e) => {
+        this.props.setAppointmentTime(e.target.value)
+    };
+
+    setComment = (e) => {
+        this.props.setAppointmentComment(e.target.value)
+    };
+
+    postOrder = () => {
+        this.props.postOrders(this.props.app.appointment)
+    };
+
+
     render() {
         const {doctors, appointment, timeArray,services} = this.props.app;
-        const {match, setAppointmentSpec, setAppointmentShedule, setAppointmentTime, setAppointmentComment, postOrders} = this.props;
+        const {match, setAppointmentShedule} = this.props;
         const doctor = doctors.find(el => el._id === match.params.doctorId);
         let spec;
         if (appointment.spec){
@@ -56,7 +74,7 @@ export class Appoint extends React.Component {
                                 </div>
                                 }
 
-                                <select className = "appointment"  onChange={(e)=>setAppointmentSpec(e.target.value)} defaultValue='Выбор услуги'>
+                                <select className = "appointment "  onChange={this.setSpec} defaultValue='Выбор услуги'>
                                     <option disabled >Выбор услуги</option>
                                     {
                                         doctor.speciality.map(el=> (
@@ -66,28 +84,38 @@ export class Appoint extends React.Component {
                                 </select>
 
                                 {appointment.spec &&
-                                <Calendar doctor={doctor} setAppointmentShedule={setAppointmentShedule} />
+                                <Calendar
+                                    doctor={doctor}
+                                    action={setAppointmentShedule}
+                                />
                                 }
 
                                 {appointment.shedule &&
-                                <div>
-                                    <div>
-                                        <select className = "appointment" onChange={(e)=>setAppointmentTime(e.target.value)} defaultValue='choose time'>
-                                            <option disabled >Выбор даты</option>
-                                            {
-                                                timeArray.map(el=> (
-                                                    <option key={Object.keys(el)[0]}> {Object.keys(el)[0]} </option>
-                                                ))
-                                            }
-                                        </select>
+
+                             
+                                   <div className = "appointment-time" >
+                                        <div className="btn-box"  >
+                                        {   timeArray.map ( (el, index)=> (
+
+                                                <label  key={Object.keys(el)} >
+                                                    <input
+                                                        type ="radio"
+                                                        name = "choise-time"
+                                                        id = {index} onChange={this.setTime}
+                                                        value =  {Object.keys(el)}
+                                                    />
+                                                   {Object.keys(el)}
+                                                </label>
+                                            ))
+                                        }
+                                            </div>
                                     </div>
-                                </div>
                                 }
 
                                 {appointment.time &&
                                 <div style={{display:"flex",flexDirection:"column"}}>
-                                    <input className = "appointment comment" type='text' placeholder='Добавить комментарий' onChange={(e)=>setAppointmentComment(e.target.value)}/>
-                                    <button className = "btn link" onClick={() => postOrders(appointment)}>Подтвердите запись</button>
+                                    <input className = "appointment comment" type='text' placeholder='Добавить комментарий' onChange={this.setComment}/>
+                                    <button className = "btn link" onClick={this.postOrder}>Подтвердите запись</button>
                                 </div>
                                 }
 
@@ -104,7 +132,7 @@ export class Appoint extends React.Component {
 
 const mapStateToProps = state => {
     return {
-        app:state.app,
+        app:state.app
     }
 };
 
@@ -115,8 +143,7 @@ const mapDispatchToProps = {
     clearAppointment,
     setAppointmentTime,
     setAppointmentComment,
-    postOrders
+    postOrders,
 };
 
-export default connect (mapStateToProps,mapDispatchToProps)(Appoint)
-
+export default connect (mapStateToProps,mapDispatchToProps)(Appoint)

+ 65 - 36
src/components/appointment/Calendar.js

@@ -1,10 +1,15 @@
-import React, {Component} from 'react';
+import React from 'react';
 import moment from "moment";
+import {connect} from "react-redux";
 
-export default class Calendar extends Component {
-    state={
-        current:moment(),
-    };
+import {
+    createCalendarMonthArray,
+    changeCalendarMonth,
+    resetCurrent
+
+} from "../../actions/calendar";
+
+export class Calendar extends React.Component {
 
     componentDidMount() {
         moment.locale('ru', {
@@ -12,54 +17,63 @@ export default class Calendar extends Component {
                 dow:1
             }
         });
+        this.props.createCalendarMonthArray(this.props.doctor)
+    }
+    componentDidUpdate(prevProps) {
+        if (prevProps.doctor !== this.props.doctor) this.props.createCalendarMonthArray(this.props.doctor)
     }
 
+    componentWillUnmount() {
+        this.props.resetCurrent()
+    }
+
+    addMonth = () => {
+        this.props.changeCalendarMonth(1);
+        this.props.createCalendarMonthArray(this.props.doctor)
+    };
+
+    subMonth = () => {
+        this.props.changeCalendarMonth(-1);
+        this.props.createCalendarMonthArray(this.props.doctor)
+    };
+
+    action = (e) => {
+        this.props.action(e.target.id)
+    };
+
     render() {
-        const {doctor,setAppointmentShedule} = this.props
-        const {current} = this.state
-        const daysArray = []
-        for (let x=1; x <= current.daysInMonth();x++){
-            daysArray.push(current.date(x).format('YYYY-MM-DD'))
-        }
-        const prevMonth = moment(current).subtract(1,'months')
-        const startDay = current.startOf('month').day() === 0 ? 7 : current.startOf('month').day()
-        for (let x=1; x < startDay ;x++){
-            daysArray.unshift(prevMonth.endOf('month').subtract(x-1,'days').format('YYYY-MM-DD'))
-        }
+        const {current,monthArray} = this.props;
         return (
             <div className = "calendar-container">
                 <div className = "calendar-title-box" >
-                    <button className= "btn angle" onClick={() => this.setState({current:current.subtract(1,"month")})}><span class="icon-angle-left"></span></button>
+                    <button className= "btn angle" onClick={this.subMonth}>
+                        <span className="icon-angle-left"></span>
+                    </button>
                     <h4>{current.format('MMMM-YYYY')}</h4>
-                    <button  className= "btn angle"  onClick={() => this.setState({current:current.add(1,"month")})}><span class="icon-angle-right"></span></button>
+                    <button  className= "btn angle"  onClick={this.addMonth}>
+                        <span className="icon-angle-right"></span>
+                    </button>
                 </div>
                 <div className = "weekdays">
                     {moment.weekdaysShort(true).map(el => (
-                            <p key={el} >{el}</p>
+                        <p key={el}>{el}</p>
                     ))}
                 </div>
                 <div  className = "days">
-
-                    {daysArray.map(el => (
+                    {monthArray.map(el => (
                         <button
-                            key={el}
-                            id={el}
-                            disabled={
-                                moment(el).format('YYYY-MM-DD') < moment().format('YYYY-MM-DD')
-                                || (moment(el).day()===6)
-                                || (moment(el).day()===0)
-                                || moment(el).month() !== current.month()
-                                || !doctor.shedule.find(item => item.data === el)
-                            }
+                            key={el.day}
+                            id={el.day}
+                            disabled={el.disabled}
                             style={{
-                                height:'50px',
-                                width:'50px',
-                                backgroundColor:moment(el).month() === current.month() ? doctor.shedule.find(item => item.data === el) ? "#b1e8ca" : "#ff9774" : "lightgrey",
-                                border:moment().format('YYYY-MM-DD') ===  moment(el).format('YYYY-MM-DD') ? "2px solid rgba(17,17,17,0.8)" : null
+                                width:"50px",
+                                height:"50px",
+                                backgroundColor:el.backgroundColor,
+                                border:el.border
                             }}
-                            onClick={(e) => setAppointmentShedule(e.target.id)}
+                            onClick={this.action}
                         >
-                            {moment(el).format('DD')}
+                            {moment(el.day).format('DD')}
                         </button>
                     ))}
                 </div>
@@ -68,3 +82,18 @@ export default class Calendar extends Component {
     }
 }
 
+const mapStateToProps = state => {
+    return {
+        current:state.calendar.current,
+        monthArray:state.calendar.monthArray
+    }
+};
+
+const mapDispatchToProps = {
+    createCalendarMonthArray,
+    changeCalendarMonth,
+    resetCurrent
+};
+
+export default connect (mapStateToProps,mapDispatchToProps)(Calendar)
+

+ 1 - 1
src/components/header/index.js

@@ -13,7 +13,7 @@ export default () => (
 					<img src= {logo} className = "logo" alt="logo"/>
 				</Link>
 			</div>
-			<Navigation></Navigation>
+			<Navigation/>
 	</header>
 );
 

+ 30 - 32
src/components/header/navigation.js

@@ -1,66 +1,64 @@
-import React from "react";
+import React, {Component} from "react";
 // import Scrollchor from 'react-scrollchor';
 import { Link, withRouter } from "react-router-dom";
 import { connect } from "react-redux";
 
-import Button from "../button";
+import { userLogout} from "../../actions/auth"
 
+class Header extends Component {
 
+	logoutHandler  = (e) => {
+		localStorage.removeItem('userId')
+		this.props.userLogout()
+		this.props.history.push('/')
+	}
 
-
-
-const header =  props  => {
+	render(){
+	const { user } = this.props
 	const liArr = [
 		{ path: "/", id: 1, text: "Главная", hideWhenAuth:false},
 		{ path: "/doctors",  id: 2,  text: "Специалисты", hideWhenAuth:false },
 		{ path: "/services", id: 3,  text: "Услуги", hideWhenAuth:false},
 		{ path: "/reviews", id: 4, text: "Отзывы", hideWhenAuth:false },
 		{ path: "/auth", id: 5, text: "Войти", hideWhenAuth:true
-		// Object.keys(props.user).length > 0 ? 
-		// 	props.user.role === "Admin" ? "Admin"
-		// 		: props.user.role === "Doctor" 
-		// 		? "Doctor" 		
-		// 				: "Logout" 
-		// 					: "Войти" 
 		}
 	];
 
-	return <nav className=" nav icon-dehaze" 
+	return (<nav className=" nav icon-dehaze" 
 		// onClick = { ( ) => { document.querySelector('.list').style.display = " block"    }  }
 	>
 		<ul className=" list ">
 		{liArr.map(el =>
-			el.hideWhenAuth && props.user.role ? null :
+			el.hideWhenAuth && user ? null :
 							(
 								<li className="item" key={el.id}>
 									<Link to={el.path}>{el.text}</Link>
 								</li>
 							)
 						)}
-		{Object.keys(props.user).length > 0 ? 
-			props.user.role === "Admin" ? (
-				<li className="item" key={6}>
-					<Link to={ "/admin"}>{"Admin"}</Link>
-					<Button text="Logout" />
-				</li>
-					
-			) : props.user.role === "Doctor" ? 
-			(<li className="item" key={6}>
-					<Link to={ "/admin"}>{"Doctor"}</Link>
-					<Button text="Logout" />
-				</li>) : (<li className="item" key={6}>
-					<Link to={ "/user"}>{"User"}</Link>
-					<Button text="Logout" />
-				</li>)
-						: null 
+		{Object.keys(user).length > 0 ? 
+			user.role ? 
+					(<li className="item" key={6}>
+						<Link to={ "/admin"}>{"Admin"} <span  className="icon-exit" onClick={this.logoutHandler}></span></Link>
+					</li>) : 
+			user.doctor ? 
+				(<li className="item" key={6}>
+					<Link to={ "/doctor"}>{"Reviews"}<span  className="icon-exit" onClick={this.logoutHandler}></span></Link>
+				</li>) : 
+				(<li className="item" key={6}>
+					<Link to={ "/user"}>{user.firstName}<span  className="icon-exit" onClick={this.logoutHandler}></span></Link>
+				</li>) :	<li className="item" key={5}>
+									<Link to={"/auth"}>Войти</Link>
+								</li>
 		}
+
 		</ul>
-	</nav>
+	</nav>)
+	}
 };
 
 const mapStateToProps = state => ({
 	user: state.auth.user
 });
 
-export default connect(mapStateToProps)(withRouter(header));
-
+export default connect(mapStateToProps,{userLogout})(withRouter(Header));

+ 3 - 3
src/components/main/Main.js

@@ -36,8 +36,8 @@ export class Main extends React.Component {
                     </div>
                 </div>
 
-                    <div className="wrapper" id = "team">
-                        <Team doctorsArr = {this.props.app.doctors}/>
+                    <div className="wrapper"  id = "team">
+                        <Team doctorsArr = {this.props.app.doctors} />
                     </div>
 
                 <div className=" case" id = "banner">
@@ -47,7 +47,7 @@ export class Main extends React.Component {
                         </div>     
                  </div>
 
-                 <div className="wrapper" id = "about">
+                 <div className="wrapper"  id = "about">
                     <About/>
                  </div>
 

+ 10 - 8
src/components/main/team.js

@@ -1,5 +1,5 @@
 import React from 'react';
-// import {Link} from 'react-router-dom';
+import {Link} from 'react-router-dom';
 // import Button from "../buttons/button";
 
 
@@ -7,7 +7,7 @@ import React from 'react';
 export default class Team extends React.Component {
     render( ) {
         const {doctorsArr } = this.props
-        console.log (doctorsArr)
+        // console.log (doctorsArr)
         return (
             <>
                 <h2>Наши врачи</h2>
@@ -15,12 +15,14 @@ export default class Team extends React.Component {
                     {doctorsArr.map  ( el => 
                          <div className="item"  key = {el._id} >
                              <div className="photo">
-                                 <img src= {el.photo} alt= {el.name}/>
-                                <div className="desc">
-                                    <h3>{el.name}</h3>
-                                    <p className="experience">Опыт работы {new Date().toISOString().split('T')[0].split('-')[0] - el.experience.split('T')[0].split('-')[0]} лет</p>
-                                    <p className="rank">{el.profession}</p>
-                                </div>
+                                <img src= {el.photo} alt= {el.name}/>
+                                <Link to = {`/doctors/${el._id}`}>
+                                    <div className="desc">
+                                        <h3>{el.name}</h3>
+                                        <p className="experience">Опыт работы {new Date().toISOString().split('T')[0].split('-')[0] - el.experience.split('T')[0].split('-')[0]} лет</p>
+                                        <p className="rank">{el.profession}</p>
+                                    </div>
+                                </Link>
                              </div>
                            
                              {/* <div className="link-box">

+ 61 - 0
src/components/services/Services.js

@@ -0,0 +1,61 @@
+import React from "react";
+
+import {Link} from 'react-router-dom';
+import { connect } from "react-redux";
+
+export class Services extends React.Component {
+  render() {
+    const { categories } = this.props;
+    const servArray = Object.keys(categories).map(key => {
+      return [key, categories[key]];
+    });
+
+    // console.log ("data:", data);
+    // console.log ("categories:", Object.values (categories))
+    // console.log ("servArray:", servArray)
+    // console.log ("this.props:", this.props.app)
+
+    return (
+      <div className="main">
+        <div className="wrapper">
+          <div className="doctors-wrap  services">
+            <div className="categories" id="accordion">
+              {servArray.map((el, index) => (
+                <div className="service-type" key={index} id={`item${index}`}>
+                  <a   href={`#item${index}`} className="categories-link icon-angle-down"   key={index}>
+                    {el[0]}
+                  </a>
+                  {el[1].map((item, index) => (
+                    <div className="servise-name" key={index}>
+                      <p>{item.name}</p>
+                      {/* <p>Длительность: {item.duration} ч.</p>  */}
+                      <p>Стоимость: {item.price} грн.</p>
+                      <div>
+                        <Link to = {`/appointment/${el._id}`}  className="btn service-btn">  Записаться  </Link>
+                      </div>
+                    </div>
+                  ))}
+                </div>
+              ))}
+            </div>
+          </div>
+        </div>
+      </div>
+    );
+  }
+}
+
+const mapStateToProps = state => {
+  return {
+    app: state.app,
+    // data:state.app.services,
+    categories: state.app.servicesArray
+  };
+};
+
+const mapDispatchToProps = {};
+
+export default connect(
+  mapStateToProps,
+  mapDispatchToProps
+)(Services);

+ 64 - 0
src/components/services/categories.js

@@ -0,0 +1,64 @@
+// import React from 'react';
+
+// // import {Link} from 'react-router-dom';
+// import {connect} from 'react-redux';
+
+
+// export class Services extends React.Component {
+    
+//     render() {
+//         const { categories} = this.props;
+//         const servArray =  Object.keys(categories).map(key => {
+//             return [key, categories[key]];
+//         })
+//         // const category = servArray.slice (1, 2 )
+
+//         // console.log ("data:", data);
+//         // console.log ("categories:", Object.values (categories))
+//         console.log ("servArray:", servArray)
+//         // console.log ("category:", category)
+//         // console.log ("this.props:", this.props.app)
+
+//         return (
+//             <div className="main">
+//                 <div className="wrapper">
+//                     <div className = "doctors-wrap">
+//                         {  servArray.map (( el, index )=> (
+//                             <div className = "serv-wrap" key = {index}>
+//                                 {   el[1].map ((item, index) => (
+                                          
+//                                     <div className = "servise-name" key = {index} >
+//                                         <p>{item.name}</p>
+//                                         <p>Длительность: {item.duration} ч.</p> 
+//                                         <p>Цена: {item.price} грн.</p>
+//                                         <div>
+                                            
+//                                             <button className = "btn service-btn"> Записаться на приём </button>
+//                                         </div>
+//                                     </div>
+//                                 ))}
+//                             </div>
+//                         ))
+//                         }
+//                     </div>
+//                 </div>
+//             </div>
+//         );
+//     }
+// }
+
+// const mapStateToProps = state => {
+//     return {
+//         app:state.app,
+//         // data:state.app.services,
+//         categories:state.app.servicesArray
+//     }
+// };
+
+// const mapDispatchToProps = {
+
+// };
+
+// export default connect (mapStateToProps,mapDispatchToProps)(Services)
+
+

+ 1 - 1
src/components/signIn.js

@@ -39,7 +39,7 @@ export const SignInForm = ({ error, submitHandler }) => {
 				})}
 				{error && <p className="auth__error-auth-text">{error}</p>}
 				<div className="auth__control-box">
-					<Button disabled={!form.validForm} className="auth__submit-btn" type="submit" text="Log In" />
+					<Button disabled={!form.validForm} className="auth__submit-btn" type="submit" text="Войти" />
 				</div>
 			</form>
 		</div>

+ 1 - 1
src/components/signUp.js

@@ -40,7 +40,7 @@ export const SignUpForm = ({ submitHandler, error, successRegister }) => {
 				{successRegister && <p className="auth__success-auth-text">{successRegister}</p>}
 				{error && <p className="auth__error-auth-text">{error}</p>}
 				<div className="auth__control-box">
-					<Button disabled={!form.validForm} className="auth__submit-btn" type="submit" text="Log In" />
+					<Button disabled={!form.validForm} className="auth__submit-btn" type="submit" text="Зарегистрироваться" />
 				</div>
 			</form>
 		</div>

+ 11 - 9
src/containers/auth.js

@@ -16,19 +16,21 @@ class Auth extends Component {
   render() {
     const { auth } = this.state;
     const { user } = this.props
-    console.log('userProps',this.props.user)
+
     
-    if(Object.keys(user).length !== 0 && user.role === "User") {
+    if(user) 
+    {if(Object.keys(user).length !== 0 && !user.role && !user.doctor) {
       return <Redirect to="/user" />
       }
 
-      if(Object.keys(user).length !== 0 && user.role === "Doctor") {
+      if(Object.keys(user).length !== 0 && user.role && !user.doctor) {
         return <Redirect to="/admin" />
       }
       
-      if(Object.keys(user).length !== 0 && user.role === "Admin") {
-        return <Redirect to="/admin" />
+      if(Object.keys(user).length !== 0 && user.doctor && !user.role) {
+        return <Redirect to="/reviews" />
       }
+    }
 
     return (
       <div className="main">
@@ -53,16 +55,16 @@ class Auth extends Component {
                 <div className="auth__additional-content">
                   {auth ? (
                     <p className="auth__text">
-                      Do you have account ? {" "}
+                    У вас есть акаунт ? {" "}
                       <span className="auth__toggle-span" onClick={this.toggleAuth}>
-                        Sing Up
+                        Зарегистрироваться
                       </span>
                     </p>
                   ) : (
                     <p className="auth__text">
-                      I have account{" "}
+                      У меня есть акаунт{" "}
                       <span className="auth__toggle-span" onClick={this.toggleAuth}>
-                        Sign In
+                       Войти
                       </span>
                     </p>
                   )}

BIN
src/icomoon.zip


+ 14 - 4
src/reducers/auth.js

@@ -1,7 +1,7 @@
 import * as types from '../actionsTypes/actionsTypes'
 
 const initialState = {
-    user: {},
+    user:{},
     isFetching: false,
     error:null,
     successRegister: null
@@ -15,9 +15,7 @@ export default (state = initialState, action) => {
 
         case types.AUTH_REQUEST_SUCCESS: {
             const { user } = action.payload;
-            const updatedUser = {...user, role: user.doctor ? "Doctor" : user.role ? "Admin" : "User"} 
-            console.log("user", updatedUser)
-            return {...state, isFetching: false, user: updatedUser };
+            return {...state, isFetching: false, user: user };
         }
 
         case types.AUTH_REQUEST_FAIL: {
@@ -36,6 +34,18 @@ export default (state = initialState, action) => {
         case types.REGISTRATION_REQUEST_FAIL: {
             return { ...state, isFetching: false, error: action.payload.response.data.message}
         }
+
+        case types.GET_USER_REQUEST: {
+            return { ...state, isFetching: true}
+        }
+
+        case types.GET_USER_REQUEST_SUCCESS: {
+            return {...state,isFetching: false, user: action.payload.user}
+        }
+        
+        case types.USER_LOGOUT: {
+            return { ...state, user: initialState.user}
+        }
         
         default:
              return state

+ 77 - 0
src/reducers/calendar.js

@@ -0,0 +1,77 @@
+import * as types from '../actionsTypes/actionsTypes'
+import moment from "moment";
+
+const defaultState = {
+    monthArray:[],
+    current:moment()
+};
+
+export const calendarReducer = (state = defaultState, action) => {
+    switch(action.type){
+
+        case types.CREATE_CALENDAR_MONTH_ARRAY: {
+            const daysArray = [];
+            for (let x=1; x <= state.current.daysInMonth();x++){
+                let day = {
+                    day:"",
+                    disabled:false,
+                    backgroundColor:"",
+                    border:""
+                };
+                let el = state.current.date(x).format('YYYY-MM-DD');
+                day.day = el;
+                day.disabled =  moment(el).format('YYYY-MM-DD') < moment().format('YYYY-MM-DD')
+                    || (moment(el).day()===6)
+                    || (moment(el).day()===0)
+                    || moment(el).month() !== state.current.month()
+                    || !action.payload.shedule.find(item => item.data === el);
+                day.backgroundColor = moment(el).month() === state.current.month() ? action.payload.shedule.find(item => item.data === el) ? "#b1e8ca" : "#ff9774" : "lightgrey";
+                day.border = moment().format('YYYY-MM-DD') ===  moment(el).format('YYYY-MM-DD') ? "2px solid rgba(17,17,17,0.8)" : null;
+                daysArray.push(day)
+            }
+
+            const prevMonth = moment(state.current).subtract(1,'months');
+            const startDay = state.current.startOf('month').day() === 0 ? 7 : state.current.startOf('month').day();
+            for (let x=1; x < startDay ;x++){
+                let day = {
+                    day:"",
+                    disabled:false,
+                    backgroundColor:"",
+                    border:""
+                };
+                let el = prevMonth.endOf('month').subtract(x-1,'days').format('YYYY-MM-DD');
+                day.day = el;
+                day.disabled =  moment(el).format('YYYY-MM-DD') < moment().format('YYYY-MM-DD')
+                    || (moment(el).day()===6)
+                    || (moment(el).day()===0)
+                    || moment(el).month() !== state.current.month()
+                    || !action.payload.shedule.find(item => item.data === el);
+                day.backgroundColor = moment(el).month() === state.current.month() ? action.payload.shedule.find(item => item.data === el) ? "#b1e8ca" : "#ff9774" : "lightgrey";
+                day.border = moment().format('YYYY-MM-DD') ===  moment(el).format('YYYY-MM-DD') ? "2px solid rgba(17,17,17,0.8)" : null;
+                daysArray.unshift(day)
+            }
+            return {
+                ...state,
+                monthArray: daysArray
+            };
+        }
+
+        case types.CHANGE_CALENDAR_MONTH: {
+            return {
+                ...state,
+                current: state.current.add(action.payload,"month")
+            };
+        }
+
+        case types.RESET_CALENDAR_CURRENT: {
+            return {
+                ...state,
+                current: moment()
+            };
+        }
+
+
+        default:
+            return state
+    }
+};

+ 2 - 0
src/reducers/index.js

@@ -1,6 +1,7 @@
 import {combineReducers} from "redux";
 
 import {appReducer} from "./reducers";
+import {calendarReducer} from "./calendar"
 import auth from './auth';
 
 
@@ -8,4 +9,5 @@ import auth from './auth';
 export default combineReducers({
     app:appReducer,
     auth,
+    calendar:calendarReducer
 })

+ 17 - 104
src/reducers/reducers.js

@@ -1,104 +1,20 @@
 import * as types from '../actionsTypes/actionsTypes'
 
-const postNewDoctorForm =[
-    {
-        id:1,
-        type:'text',
-        value:"",
-        name:'name',
-        placeholder:'Enter doctor Name and Last Name',
-        required:true
-    },
-    {
-        id:2,
-        type:'text',
-        value:"",
-        name:'experience',
-        placeholder:'Enter practice start date',
-        required:true
-    },
-    {
-        id:3,
-        type:'text',
-        value:"",
-        name:'photo',
-        placeholder:'Enter path to photo here',
-        required:true
-    },
-    {
-        id:4,
-        type:'text',
-        value:"",
-        name:'profession',
-        placeholder:'Enter profession here',
-        required:true
-    },
-    {
-        id:5,
-        type:'text',
-        value:"",
-        name:'skillsDescription',
-        placeholder:'Enter skills description here',
-        required:true
-    },
-    {
-        id:6,
-        type:'text',
-        value:"",
-        name:'speciality',
-        placeholder:'Enter array of service speciality description here',
-        required:true
-    }
-];
-
-const postNewServiceForm =[
-    {
-        id:1,
-        type:'text',
-        value:"",
-        name:'name',
-        placeholder:'Enter service Name',
-        required:true
-    },
-    {
-        id:2,
-        type:'text',
-        value:"",
-        name:'description',
-        placeholder:'Enter service description',
-        required:true
-    },
-    {
-        id:3,
-        type:'number',
-        value:"",
-        name:'duration',
-        placeholder:'Enter duration',
-        required:true
-    },
-    {
-        id:4,
-        type:'number',
-        value:"",
-        name:'price',
-        placeholder:'Enter price',
-        required:true
-    }
-];
-
+import {postNewDoctorForm,postNewServiceForm} from '../utils/formFields'
 
 const defaultState = {
     user:localStorage.getItem('id') ? localStorage.getItem('id') : null,
     doctors:[],
     services:[],
     servicesArray:{
-        surgeon:[],
-        kids:[],
-        orthodontist:[],
-        therapist:[],
-        implantologist: [],
-        endodontics:[],
+        'Хирургия':[],
+        'Детская стоматология':[],
+        'Ортодонтия':[],
+        'Терапия':[],
+        'Имплантология': [],
+        'Эндодонтия':[]
     },
+
     orders:[],
     users:[],
     reviews: [],
@@ -107,7 +23,6 @@ const defaultState = {
         data:null,
         doctor:null
     },
-    sheduleMonthArray:null,
 
     postNewDoctor:postNewDoctorForm,
     postNewService:postNewServiceForm,
@@ -124,7 +39,6 @@ const defaultState = {
     },
 
     timeArray:[],
-    wrongDate:true,
     isFetching:false,
     error: null,
 
@@ -217,8 +131,7 @@ export const appReducer = (state = defaultState,action) => {
                     ...state.appointment,
                     shedule:shedule._id
                 },
-                timeArray:timeArray,
-                wrongDate: action.payload
+                timeArray:timeArray
             };
         }
 
@@ -338,7 +251,7 @@ export const appReducer = (state = defaultState,action) => {
                                 ...state,
                                 servicesArray:{
                                     ...state.servicesArray,
-                                    orthodontist:state.servicesArray.orthodontist.push(el)
+                                    'Ортодонтия':state.servicesArray['Ортодонтия'].push(el)
                                 }
                             }
                         }
@@ -347,7 +260,7 @@ export const appReducer = (state = defaultState,action) => {
                                 ...state,
                                 servicesArray:{
                                     ...state.servicesArray,
-                                    kids:state.servicesArray.kids.push(el)
+                                    'Детская стоматология':state.servicesArray['Детская стоматология'].push(el)
                                 }
                             }
                         }
@@ -356,7 +269,7 @@ export const appReducer = (state = defaultState,action) => {
                                 ...state,
                                 servicesArray:{
                                     ...state.servicesArray,
-                                    implantologist:state.servicesArray.implantologist.push(el)
+                                    'Имплантология':state.servicesArray['Имплантология'].push(el)
                                 }
                             }
                         }
@@ -365,7 +278,7 @@ export const appReducer = (state = defaultState,action) => {
                                 ...state,
                                 servicesArray:{
                                     ...state.servicesArray,
-                                    implantologist:state.servicesArray.implantologist.push(el)
+                                    'Имплантология':state.servicesArray['Имплантология'].push(el)
                                 }
                             }
                         }
@@ -374,7 +287,7 @@ export const appReducer = (state = defaultState,action) => {
                                 ...state,
                                 servicesArray:{
                                     ...state.servicesArray,
-                                    surgeon:state.servicesArray.surgeon.push(el)
+                                    'Хирургия':state.servicesArray['Хирургия'].push(el)
                                 }
                             }
                         }
@@ -383,7 +296,7 @@ export const appReducer = (state = defaultState,action) => {
                                 ...state,
                                 servicesArray:{
                                     ...state.servicesArray,
-                                    endodontics:state.servicesArray.endodontics.push(el)
+                                    'Эндодонтия':state.servicesArray['Эндодонтия'].push(el)
                                 }
                             }
                         }
@@ -392,7 +305,7 @@ export const appReducer = (state = defaultState,action) => {
                                 ...state,
                                 servicesArray:{
                                     ...state.servicesArray,
-                                    therapist:state.servicesArray.therapist.push(el)
+                                    'Терапия':state.servicesArray['Терапия'].push(el)
                                 }
                             }
                         }
@@ -454,8 +367,8 @@ export const appReducer = (state = defaultState,action) => {
             return {
                 ...state,
                 postNewShedule:{
+                    ...state.postNewShedule,
                     data:null,
-                    doctor:null
                 },
                 isFetching: false
             }

+ 293 - 31
src/style/all.scss

@@ -8,24 +8,36 @@ $opacity-color: rgba(17,17,17,0.8);
 
 body {
 	font-family: 'Lato', sans-serif;
-	font-size: 16px;
-
+	font-size: 14px;
 }
 
 .main {
 	background-image: url(../assets/images/fon6.jpg);
 	background-size: cover;
 	background-attachment: fixed;
-	min-height: 100vh;
+	min-height: 80vh;
 	scroll-behavior: smooth;
-	// padding-top: 120px;
 }
 
 .container {
 	background-image: url(../assets/images/fon1.jpg);
 	background-size: cover;
 	min-height: 100vh;
+	
+	@media (max-width: 768px) {
+		background-position-x: -270px;
+	}
+	@media (max-width: 414px) {
+		background-position-x: -330px;
+	}
+	@media (max-width: 375px) {
+		background-position-x: -285px;
+	}
+	@media (max-width: 320px) {
+		background-position-x: -250px;
+	}
 }
+
 .wrapper,
 .info-wrap {
 	max-width: 1280px;
@@ -50,7 +62,7 @@ body {
 
 	& .nav {
 		margin-top: 25px;
-		font-size: 14px;
+		font-size: 1em;
 		line-height: 24px;
 		font-weight: bold;
 		letter-spacing: 0.075em;
@@ -122,29 +134,46 @@ body {
 	}
 	img {
 		margin: 150px auto 30px;
-		max-width: 350px;
+		max-width: 300px;
 		@media (max-width: 768px) {
+			// max-width: 200px;	
+			margin-top: 250px;
+		}
+		@media (max-width: 414px) {
+			max-width: 200px;	
+			margin-top: 175px;
+		}
+		@media (max-width: 375px) {
 			max-width: 200px;	
+			margin-bottom: 5px;
 		}
 	}
 	h1{
 		text-transform: uppercase;
 		background-color: $opacity-color;
 		width: 100%;
-		font-size: 40px;
+		font-size: 2.6em;
 		padding: 35px;
 		line-height: 50px;
 		font-weight: bold;
-		margin: 70px auto 0;
+		margin: 30px auto 0;
 		text-align: center;
 		@media (max-width: 768px) {
-			font-size: 25px;
+			font-size: 30px;
 			padding: 15px;	
 		}
+		@media (max-width: 414px) {
+			font-size: 20px;
+			// padding: 15px;	
+		}
+		@media (max-width: 375px) {
+			font-size: 15px;
+			padding: 5px;	
+		}
 	}
 }
 
-// button
+// buttons
 .btn {
 	display: block;
 	min-height: 50px;
@@ -195,7 +224,11 @@ body {
 	width: 30%;	
 	margin: 0;
 }
-
+.nav-exit {
+	background-color: none;
+	border: none;	
+	height: 30px;
+}
 
 //  section About Us
 .aboutsection, 
@@ -334,10 +367,16 @@ h2 {
 				align-items: center;
 				justify-content: center;
 			}
+			a {
+				color: $header-color;	
+				text-decoration: none;	
+			}
 	}
 	}
 }
 
+
+
 //  Footer
 .footer {
 	font-family: 'Montserrat', sans-serif;
@@ -356,6 +395,7 @@ h2 {
 		font-family: 'Montserrat', sans-serif;
 		font-weight: 700;
 		font-size: 1.3em;
+		margin: 5px;
 	}
 	.logo-box {
 		margin-right: 0px;
@@ -370,6 +410,12 @@ h2 {
 		@media (max-width: 768px) {
 			width: 250px;	
 		}
+		@media (max-width: 414px) {
+			width: 200px;	
+		}
+		@media (max-width: 375px) {
+			width: 150px;	
+		}
 	}	
 	.contacts {
 		background-color: $opacity-color;
@@ -381,6 +427,9 @@ h2 {
 		@media (max-width: 768px) {
 			width: 100%;
 		}
+		@media (max-width: 768px) {
+			font-size: 0.7em;
+		}
 	}
 	
 }
@@ -398,6 +447,16 @@ h2 {
 		position: fixed;
 		top: 30%;
 		left: 40%;
+		@media (max-width: 1024px) {
+			left: 35%;
+		}
+		@media (max-width: 768px) {
+			left: 30%;
+		}
+		@media (max-width: 768px) {
+			left: 25%;
+			width: 50%;
+		}
 	}
 
 }
@@ -408,6 +467,14 @@ h2 {
 // _____DOCTORS_____ 
 .doctors-wrap {
 	padding-top: 110px;	
+	@media (max-width: 768px) {
+		padding-top: 65px;
+	}
+	.item h3 {
+		@media (max-width: 375px) {
+			font-size: 1em;
+		}
+	}
 }
 .info-wrap {
 	padding: 110px 10px 25px;
@@ -421,7 +488,7 @@ h2 {
 	color: $header-color;
 	h3 {
 		margin: 0;
-		font-size: 2em;
+		font-size: 1.8em;
 		line-height: 2em;
 		text-align:  center;
 		@media (max-width: 768px) {
@@ -430,6 +497,9 @@ h2 {
 	}
 	.desc {
 		width: 50%;
+		@media (max-width: 1024px) {
+			width: 60%;
+		}
 		@media (max-width: 768px) {
 			width: 100%;
 		}
@@ -451,7 +521,7 @@ h2 {
 }
 
 
-// _____t APPOINTMENT _________
+// _____ APPOINTMENT _________
 
 .appointment {
 	width: 100%;
@@ -460,13 +530,46 @@ h2 {
 	border-radius: 3px;
 	padding: 0.5rem;
 	margin: 15px 0;
-	&:focus {
+	color: $opacity-color;
+	background-color: $header-color;
+	cursor: pointer;
+	-webkit-appearance: none; 
+   -moz-appearance: none;
+   appearance: none;       /* remove default arrow */
+ 	&:focus {
 		outline: none;
 	}
 }
-// .comment {
-// 	margin: 15px 0;
-// }
+.appointment-time {
+	.btn-box {
+		display: flex;
+		flex-direction: row;
+		flex-wrap: wrap;
+		justify-content: space-evenly;
+		margin: 30px 0;
+		input[type = "radio"] {
+			display: none;
+		}
+		label {
+			display: flex;
+			margin: 10px 10px 3px 0;
+			text-align: center;
+			padding: 5px 10px;
+			min-width: 80px;
+			background-color: $hover-color;
+			color: $opacity-color;
+			&:hover {
+				background-color: $main-color;
+				color: $header-color;
+			}
+		}
+		label input:checked ~ label {
+			background-color: $main-color;
+			color: $header-color;
+		  }
+	}
+
+}
 
 
 
@@ -475,20 +578,28 @@ h2 {
 aside {
 	position: fixed;
 	top: 50%;
-	right: 3%;
+	right: 2%;
 	z-index: 999999;
 	.sidebar-ul {
 		list-style: none;
 		.sidebar-item {
 			margin-top: 15px;
 		}
-		
 	}
 	.nav-link {
 		text-decoration: none;
 		margin-top: 15px;
 		padding: 15px 0;
 	}
+	@media (max-width: 1024px) {
+		top: 70%;	
+	}
+	@media (max-width: 375px) {
+		top: 75%;	
+	}
+	@media (max-width: 320px) {
+		top: 25%;	
+	}
 }
 
 
@@ -498,7 +609,8 @@ aside {
 	display: flex;
 	justify-content: space-between;
 }
-.option {
+.option,
+.change-services-doctors {
 	width: 40%;
 	margin: 0 auto;
 }
@@ -512,11 +624,8 @@ aside {
 		display: flex;
 		flex-direction: row;
 		justify-content: space-between;
-
 	}
-	
 	.shedule-input {
-		// width: calc(20% - 20px);
 		margin: 20px 10px 0 0;
 		border: 1px solid $hover-color;
 		border-radius: 3px;
@@ -525,22 +634,175 @@ aside {
 	.right {
 		margin-right: 0;
 	}
-
-	.shedule {
-		display: flex; 
-		margin: 10px 20px;
-		width: 100%;
-		flex-wrap: wrap;
-	}
 	.month {
 		color: $hover-color;
 		text-transform: uppercase;
 		font-weight: 700;
 		letter-spacing: 0.2em;
-	}
+		}
 	.admin {
 		margin-top: 30px;
 		width: 100%;
 	}
+	.shedule {
+		display: flex; 
+		margin: 10px 0px;
+		width: 100%;
+		flex-wrap: wrap;
+		justify-content: space-between;
+		.days-of-month {
+			width: 15%;
+			border: 1px solid $hover-color;
+			border-radius: 3px;
+			margin: 10px 20px;
+			text-align: center;
+			.title-day {
+				border-bottom: 1px solid $hover-color;
+				margin: 5px 0;
+			}
+		}
+	}
+
 }
 
+// ___ change-services-doctors____
+.change-services-doctors {
+	display: flex;
+	// flex-direction: column;
+	justify-content: center;
+	width: 100%;
+	margin-top: 50px;
+	.form-doctors {
+		display: flex;
+		flex-direction: column;
+	}
+	.admin-form {
+		margin: 2px 0;
+	}
+	.admin-item {
+		width: 35%;
+		margin: 0 50px;
+	}
+}
+
+// ______categories _________
+.services {
+	width: 100%;
+	min-height: 100vh;
+	@media (max-width: 414px) {
+		margin: 25px 0;
+	}
+	.categories {
+		padding-top: 50px;
+		width: 100%;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-around;	
+		flex-wrap: wrap;
+		align-content: flex-start;
+		@media (max-width: 768px) {
+			padding-top: 5px;
+		}
+		.service-type {
+			width: 85%;
+			// p {
+			// 	@media (max-width: 414px) {
+			// 		margin: 10px 0;
+			// 	}
+			// 	@media (max-width: 414px) {
+			// 		margin: 5px 0;
+			// 	}
+			// 	@media (max-width: 375px) {
+			// 		font-size: 0.8em;
+			// 	}
+			// }
+			.categories-link {
+				display: block;
+				position: relative;
+				border: 1px solid $hover-color;
+				border-radius: 3px;
+				margin: 25px 15px;
+				padding: 10px;
+				text-decoration: none;
+				text-transform: uppercase;
+				font-weight: 700;
+				letter-spacing: 0.1em;
+				text-align: center;
+				color: $header-color;
+				box-shadow: 0px 0px 10px 0px $hover-color;
+				&:hover {
+					background-color: $main-color;
+				}
+				@media (max-width: 768px) {
+					margin: 15px;
+				}
+				@media (max-width: 414px) {
+					margin: 5px 0;
+				}
+				@media (max-width: 320px) {
+					margin: 5px;
+					padding: 5px 10px;
+				}
+			}
+			@media (max-width: 1024px) {
+				width: 65%;
+				margin-top: 40px;
+			}
+			@media (max-width: 768px) {
+				width: 65%;
+				margin: 10px;
+			}
+			@media (max-width: 414px) {
+				width: 100%;
+				margin: 10px;
+			}
+			@media (max-width: 320px) {
+				margin: 7px;
+			}
+		}
+	}
+	
+}
+
+// ______services________
+	.serv-wrap {
+		width: 100%;
+		display: flex;
+		flex-wrap:wrap;
+		justify-content: space-between;
+	}
+	.servise-name {
+		width: 95%;
+		display: flex;
+		flex-direction: row;
+		justify-content: space-evenly;
+		align-content: stretch;
+		align-items: center;
+		border: 1px solid$hover-color;
+		margin: 10px auto;
+		text-align: center;
+		p {
+			flex-basis: 30%;
+			margin: 5px 10px;
+		}
+		@media (max-width: 414px) {
+			width: 100%;
+		}
+	}
+	.service-btn {
+		background-color: $hover-color;
+		width: 100%;
+		margin: 5px;
+	}
+
+	// _______________ACCORDION___________
+	#accordion {
+		.service-type {
+			.servise-name {
+				display: none;
+			}
+			&:target .servise-name {
+				display: flex;
+			}
+		}
+	}

+ 10 - 3
src/style/auth.scss

@@ -10,6 +10,9 @@ $opacity-color: rgba(17,17,17,0.8);
 	background-color: $opacity-color;
 	min-height: 100vh;
 	min-width: 100vw;
+	@media (max-width: 1024px) {
+		min-height: 84vh;
+	}
 }
 
 .auth {
@@ -18,16 +21,20 @@ $opacity-color: rgba(17,17,17,0.8);
 
 
 	&__content {
-		width: 30rem;
+		width: 28rem;
 		position: absolute;
 		top: 50%;
 		left: 50%;
 		transform: translate(-50%, -50%);
-		background-color: $opacity-color;
-		padding: 2rem;
+		background-color: rgba(17, 17, 17, 0.8);
+		padding: 1.5rem;
 		border: 1px solid #eee;
 		margin-top: 40px;
+		@media (max-width: 1024px) {
+			top: 35%;
+		}
 	}
+	
 
 	&__text {
 		font-size: 1.6rem;

+ 28 - 0
src/style/style.css

@@ -69,8 +69,34 @@
 .icon-lens:before {
   content: "\e901";
   color:  var(--opacity-color);
+  font-size: 1.6em;
   margin: 15px 0;
+
+}
+@media (max-width: 1024px) {
+	.icon-lens:before {
+		color:  var(--hover-color);
+	}
+}
+@media (max-width: 414px) {
+	.icon-lens:before {
+    color:  var(--hover-color);
+    font-size: 1em;
+  }
 }
+@media (max-width: 375px) {
+  .icon-lens:before {
+    /* color:  var(--hover-color); */
+    font-size: 0.9em;
+  }
+}  
+@media (max-width: 320px) {
+  .icon-lens:before {
+    color:  var(--opacity-color);
+    /* font-size: 0.9em; */
+  }
+}  
+
 .icon-calendar:before {
   content: "\f073";
 }
@@ -91,6 +117,8 @@
 }
 .icon-exit:before {
   content: "\ea14";
+  color:  var(--opacity-color);
+  font-size: 1.6em;
 }
 .icon-location:before {
   content: "\e947";

+ 93 - 7
src/utils/formFields.js

@@ -18,7 +18,7 @@ export const logInForm = {
 			id: 2,
 			name: "password",
 			type: "password",
-			label: "Password",
+			label: "Пароль",
 			validation: {
 				requred: {
 					cb: v => v.trim() === ""
@@ -55,7 +55,7 @@ export const signUpForm = {
 			id: 2,
 			type: "text",
 			name: "firstName",
-			label: "First Name",
+			label: "Имя",
 			validation: {
 				requred: {
 					cb: v => v.trim() === ""
@@ -72,7 +72,7 @@ export const signUpForm = {
 			id: 3,
 			type: "text",
 			name: "lastName",
-			label: "Last Name",
+			label: "Фамилия",
 			validation: {
 				requred: {
 					cb: v => v.trim() === ""
@@ -86,7 +86,7 @@ export const signUpForm = {
 			id: 4,
 			type: "number",
 			name: "phone",
-			label: "Phone",
+			label: "Телефон",
 			validation: {
 				requred: {
 					cb: v => v.trim() === ""
@@ -100,7 +100,7 @@ export const signUpForm = {
 			id: 5,
 			name: "password",
 			type: "password",
-			label: "Password",
+			label: "Пароль",
 			validation: {
 				requred: {
 					cb: v => v.trim() === ""
@@ -117,7 +117,7 @@ export const signUpForm = {
 			id: 6,
 			name: "confirmPassword",
 			type: "password",
-			label: "Confirm Password",
+			label: "Повторите пароль",
 			validation: {
 				requred: {
 					cb: v => v.trim() === ""
@@ -136,4 +136,90 @@ export const signUpForm = {
 		}
 	},
 	validForm: false
-};
+};
+
+export const postNewDoctorForm =[
+	{
+		id:1,
+		type:'text',
+		value:"",
+		name:'name',
+		placeholder:'Введите ФИО сотрудника',
+		required:true
+	},
+	{
+		id:2,
+		type:'text',
+		value:"",
+		name:'experience',
+		placeholder:'Введите дату начала практики',
+		required:true
+	},
+	{
+		id:3,
+		type:'text',
+		value:"",
+		name:'photo',
+		placeholder:'Добавьте фотографию',
+		required:true
+	},
+	{
+		id:4,
+		type:'text',
+		value:"",
+		name:'profession',
+		placeholder:'Добавьте специализацию',
+		required:true
+	},
+	{
+		id:5,
+		type:'text',
+		value:"",
+		name:'skillsDescription',
+		placeholder:'Введите описание навыков здесь',
+		required:true
+	},
+	{
+		id:6,
+		type:'text',
+		value:"",
+		name:'speciality',
+		placeholder:'Введите массив представляемых услуг',
+		required:true
+	}
+];
+
+export const postNewServiceForm =[
+	{
+		id:1,
+		type:'text',
+		value:"",
+		name:'name',
+		placeholder:'Введите название сервиса',
+		required:true
+	},
+	{
+		id:2,
+		type:'text',
+		value:"",
+		name:'description',
+		placeholder:'Введите описание сервиса',
+		required:true
+	},
+	{
+		id:3,
+		type:'number',
+		value:"",
+		name:'duration',
+		placeholder:'Введите длительность (часы)',
+		required:true
+	},
+	{
+		id:4,
+		type:'number',
+		value:"",
+		name:'price',
+		placeholder:'Введите стоимость сервиса',
+		required:true
+	}
+];