Mila-Zagrevskaya 5 年 前
コミット
4d5640d1ad

+ 2 - 1
src/App.js

@@ -5,7 +5,7 @@ import {Switch} from "react-router-dom";
 import {getDoctors, getServices} from "./actions/actions";
 import {getUser} from "./actions/auth"
 
-import Loader from "./components/loader";
+import Loader from "./components/hooks/loader";
 import Header from "./components/header/index";
 import Footer from "./components/Footer";
 import {route} from './utils/formFields'
@@ -18,6 +18,7 @@ export class App extends React.Component {
     componentDidMount() {
         this.props.getDoctors();
         this.props.getServices();
+        console.log(this.props.app)
 
        if(localStorage.getItem('userId')) this.props.getUser()
 

+ 67 - 6
src/components/Admin/Shedule.js

@@ -1,14 +1,43 @@
 import React from 'react';
 import moment from "moment";
+import { connect } from "react-redux";
 
+import { CustomSelect } from "../hooks/select"
 import Calendar from "../Calendar";
 
-export default class Shedule extends React.Component {
+import {
+    setAppointmentShedule,
+    setAppointmentDoctor,
+    setAppointmentTime,
+    postOrders
+} from "../../actions/actions";
+
+export  class Shedule extends React.Component {
     state ={
         startDate:null,
         endDate:null,
+        pickedDate: null
     };
 
+    setShedule = e => {
+        this.setState({ pickedDate: e.target.id });
+        this.props.setAppointmentShedule(e.target.id);
+      };
+    
+      setShedule = e => {
+        this.setState({ pickedDate: e.target.id });
+        this.props.setAppointmentShedule(e.target.id);
+      };
+    
+      setTime = e => {
+        this.props.setAppointmentTime(e.target.value);
+      };
+
+      postOrder = () => {
+        this.props.postOrders(this.props.app.appointment);
+      };
+
+
     post = (e) => {
         e.preventDefault()
         let current = new Date(this.state.startDate);
@@ -35,13 +64,21 @@ export default class Shedule extends React.Component {
     };
 
     render() {
-        const {doctors, postNewShedule} = this.props;
-        const doctor = doctors.find(el => el._id === postNewShedule.doctor);
-
+        const {doctors, match, postNewShedule} = this.props;
+        const doctor = doctors.find (el => el._id === postNewShedule.doctor);
+        console.log (this.props.doctors)
         return (
             <div  className = "shedule-container" >
                 <div className = "option" >
-                    <select className = "appointment admin-appointment"  onChange={this.setDoctor} defaultValue={doctor ? doctor.name : 'Выберите доктора'}>
+
+                {/* <CustomSelect
+                    label="Выберите доктора"
+                    options= {doctor ? doctor[0].name : 'Выберите доктора'}
+                    clickOptionEvent={this.setDoctor}
+                  /> */}
+
+                    <select className = "appointment admin-appointment"  
+                        onChange={this.setDoctor} defaultValue={doctor ? doctor.name : 'Выберите доктора'}>
                         <option disabled >Выберите доктора</option>
                         {
                             doctors.map ( el=> (
@@ -63,12 +100,36 @@ export default class Shedule extends React.Component {
                 </div>
 
                 {postNewShedule.doctor &&
+                <div className="shedule-card">
                     <Calendar
                         doctor={doctor}
                         action = {console.log}
                     />
+                    <div className="day-shedule">
+
+                    </div>
+                </div>
+
                 }
             </div>
         );
     }
-}
+}
+
+const mapStateToProps = state => {
+    return {
+      app: state.app
+    };
+  };
+  
+  const mapDispatchToProps = {
+    setAppointmentShedule,
+    setAppointmentDoctor,
+    setAppointmentTime,
+    postOrders
+  };
+  
+  export default connect(
+    mapStateToProps,
+    mapDispatchToProps
+  )(Shedule);

+ 1 - 9
src/components/appointment/Appointment.js

@@ -1,7 +1,7 @@
 import React from "react";
 import { connect } from "react-redux";
 import moment from "moment";
-import { CustomSelect } from "./select";
+import { CustomSelect } from "../hooks/select";
 
 import {
   setAppointmentSpec,
@@ -162,11 +162,3 @@ export default connect(
   mapDispatchToProps
 )(Appoint);
 
-// <select className = "appointment "  onChange={this.setSpec} defaultValue='Выбор услуги'>
-//      <option disabled >Выбор услуги</option>
-//         {
-//             doctor.speciality.map(el=> (
-//                 <option key={el._id}>{el.name}</option>
-//              ))
-//         }
-// </select>

src/components/button.js → src/components/buttons/btn.js


src/components/loader.js → src/components/hooks/loader.js


src/components/appointment/select.js → src/components/hooks/select.js


+ 7 - 4
src/components/services/Services.js

@@ -14,6 +14,7 @@ export class Services extends React.Component {
     // console.log ("categories:", Object.values (categories))
     // console.log ("servArray:", servArray)
     // console.log ("this.props:", this.props.app)
+    console.log ("state.app.services", this.props.app.services.category)
 
     return (
       <div className="main">
@@ -47,13 +48,15 @@ export class Services extends React.Component {
 
 const mapStateToProps = state => {
   return {
-    app: state.app,
-    // data:state.app.services,
-    categories: state.app.servicesArray
+        app:state.app,
+        // data:state.app.services.category,
+        categories:state.app.servicesArray
   };
 };
 
-const mapDispatchToProps = {};
+const mapDispatchToProps = {
+  
+};
 
 export default connect(
   mapStateToProps,

+ 50 - 50
src/components/services/categories.js

@@ -1,64 +1,64 @@
-// import React from 'react';
+import React from 'react';
 
-// // import {Link} from 'react-router-dom';
-// import {connect} from 'react-redux';
+// import {Link} from 'react-router-dom';
+import {connect} from 'react-redux';
 
 
-// export class Services extends React.Component {
+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 )
+    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)
+        // 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) => (
+        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>
+                                    <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>
-//         );
-//     }
-// }
+                                            <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 mapStateToProps = state => {
+    return {
+        app:state.app,
+        data:state.services.services,
+        categories:state.services.categories
+    }
+};
 
-// const mapDispatchToProps = {
+const mapDispatchToProps = {
 
-// };
+};
 
-// export default connect (mapStateToProps,mapDispatchToProps)(Services)
+export default connect (mapStateToProps,mapDispatchToProps)(Services)
 
 

+ 3 - 3
src/components/specialists/MoreInfo.js

@@ -13,11 +13,11 @@ export class MoreInfo extends React.Component {
             <div className="main">
                 {doctor &&
                     <div className = "info-wrap">
-                        <div className="card">
-                            <div className="card-item">
+                        <div className="info">
+                            <div className="info-item">
                                 <img src={`.${doctor.photo}`} alt={doctor.name}/>
                             </div>
-                             <div className="card-item desc">
+                             <div className="info-item info-desc">
                                  <h3> {doctor.name} </h3>
                                 <p className = "highlights">{doctor.profession}</p>
                                 <p className = "highlights">Опыт работы более {new Date().toISOString().split('T')[0].split('-')[0] - doctor.experience.split('T')[0].split('-')[0]}  лет</p>

+ 10 - 1
src/components/user.js

@@ -3,7 +3,16 @@ import React from 'react';
 class User extends React.Component {
     state = {  }
     render() { 
-        return ( <div>User Component</div>);
+        return ( 
+        <div className = "main">
+            <div className="info-wrap">
+                <h2>User Name</h2>
+                <div classdescription = "reviews-container">
+                    <p>Это страница авторизованого пользователя</p>
+                </div>
+            </div>
+        </div>
+        );
     }
 }
  

+ 1 - 1
src/containers/auth.js

@@ -6,7 +6,7 @@ import { auth, register } from '../actions/auth';
 
 import {SignUpForm} from '../components/auth/signUp';
 import {SignInForm} from '../components/auth/signIn';
-import Loader from '../components/loader';
+import Loader from '../components/hooks/loader';
 
 class Auth extends Component {
   state = { auth: true };

+ 3 - 3
src/reducers/reducers.js

@@ -35,10 +35,10 @@ const defaultState = {
         time:null,
         doctor:null,
         spec:null,
-        comment:''
-    },
+        comment:  " "
+      },
 
-    timeArray:[],
+    timeArray:[ ],
     isFetching:false,
     error: null,
 

+ 33 - 12
src/style/all.scss

@@ -23,9 +23,9 @@ body {
 	background-image: url(../assets/images/fon1.jpg);
 	background-size: cover;
 	min-height: 100vh;
-	@media (max-width: 1024px) {
-		background-position-x: -450px;
-	}
+	// @media (max-width: 1024px) {
+	// 	background-position-x: -450px;
+	// }
 	@media (max-width: 768px) {
 		background-position-x: -270px;
 	}
@@ -390,7 +390,6 @@ h2 {
 				border-radius: 5px;
 				width: 100%;
 			}
-			
 		}
 		h3 {
 			margin: 10px;
@@ -408,9 +407,9 @@ h2 {
 		// }
 
 		@media (max-width: 768px) {
-			width: 45%;
+			width: 30%;
 		}
-		@media (max-width: 630px) {
+		@media (max-width: 414px) {
 			width: 100%;
 		}
 	}
@@ -450,9 +449,6 @@ h2 {
 
 
 
-
-
-
 // _____DOCTORS_____ 
 .doctors-wrap {
 	padding-top: 110px;	
@@ -491,8 +487,34 @@ h2 {
 }
 .info-wrap {
 	padding: 110px 10px 25px;
- 	min-height: 100vh;
+	min-height: 100vh;
+	flex-direction: row;
+	 .info {
+		display: flex;
+		justify-content: space-around;
+		flex-wrap: wrap;
+		color: $header-color;
+		.info-item {
+			margin: 0 20px 10px; 
+			@media (max-width: 414px) {
+				margin: 0;
+			}
+			p {
+				margin: 5px 0;
+				text-align: left;
+			}
+			img {
+				border-radius: 3px;
+				box-shadow: 1px 1px 15px 1px $hover-color;
+			}	
+		}
+		.info-desc {
+			width: 50%;
+		}
+	}
 }
+
+
 .card {
 	display: flex;
 	justify-content: space-around;
@@ -525,8 +547,7 @@ h2 {
 			box-shadow: 1px 1px 15px 1px $hover-color;
 		}	
 	}
-}
-		
+}		
 .present {
 	flex-basis: 20%;
 	display: flex;

+ 1 - 0
src/style/style.css

@@ -118,6 +118,7 @@
   content: "\ea14";
   color:  var(--hover-color);
   font-size: 1.6em;
+  margin-left: 20px;
 }
 .icon-location:before {
   content: "\e947";

+ 1 - 1
src/utils/formFields.js

@@ -199,7 +199,7 @@ export const postNewDoctorForm =[
 		type:'text',
 		value:"",
 		name:'speciality',
-		placeholder:'Введите массив представляемых услуг',
+		placeholder:'Выберите предоставляемые услуги',
 		required:true
 	}
 ];