second

.idea/workspace.xml

@@ -5,15 +5,16 @@
   </component>
   <component name="ChangeListManager">
     <list default="true" id="a8a32a88-c432-4104-a927-0d3d1c1c21be" name="Default Changelist" comment="">
-      <change beforePath="$PROJECT_DIR$/package-lock.json" beforeDir="false" afterPath="$PROJECT_DIR$/package-lock.json" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/package.json" beforeDir="false" afterPath="$PROJECT_DIR$/package.json" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/public/favicon.ico" beforeDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/App.css" beforeDir="false" />
+      <change afterPath="$PROJECT_DIR$/src/components/Doctors.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/.idea/workspace.xml" beforeDir="false" afterPath="$PROJECT_DIR$/.idea/workspace.xml" afterDir="false" />
       <change beforePath="$PROJECT_DIR$/src/App.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/App.js" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/App.test.js" beforeDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/index.css" beforeDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/index.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/index.js" afterDir="false" />
-      <change beforePath="$PROJECT_DIR$/src/logo.svg" beforeDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/Appointment.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Appointment.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/Header.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Header.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/Main.js" beforeDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/components/Service.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/components/Service.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/db.json" beforeDir="false" afterPath="$PROJECT_DIR$/src/db.json" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/store/app/actions.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/store/app/actions.js" afterDir="false" />
+      <change beforePath="$PROJECT_DIR$/src/store/app/reducers.js" beforeDir="false" afterPath="$PROJECT_DIR$/src/store/app/reducers.js" afterDir="false" />
     </list>
     <ignored path="$PROJECT_DIR$/.tmp/" />
     <ignored path="$PROJECT_DIR$/temp/" />
@@ -26,11 +27,11 @@
   </component>
   <component name="FileEditorManager">
     <leaf>
-      <file pinned="false" current-in-tab="true">
+      <file pinned="false" current-in-tab="false">
         <entry file="file://$PROJECT_DIR$/src/App.js">
           <provider selected="true" editor-type-id="text-editor">
-            <state relative-caret-position="612">
-              <caret line="36" column="1" lean-forward="true" selection-start-line="36" selection-start-column="1" selection-end-line="36" selection-end-column="1" />
+            <state relative-caret-position="242">
+              <caret line="52" column="38" selection-start-line="52" selection-start-column="28" selection-end-line="52" selection-end-column="38" />
               <folding>
                 <element signature="e#0#26#0" expanded="true" />
               </folding>
@@ -41,17 +42,17 @@
       <file pinned="false" current-in-tab="false">
         <entry file="file://$PROJECT_DIR$/src/components/Appointment.js">
           <provider selected="true" editor-type-id="text-editor">
-            <state relative-caret-position="1156">
-              <caret line="68" column="27" lean-forward="true" selection-start-line="68" selection-start-column="27" selection-end-line="68" selection-end-column="27" />
+            <state relative-caret-position="578">
+              <caret line="76" column="21" lean-forward="true" selection-start-line="76" selection-start-column="21" selection-end-line="76" selection-end-column="21" />
             </state>
           </provider>
         </entry>
       </file>
       <file pinned="false" current-in-tab="false">
-        <entry file="file://$PROJECT_DIR$/src/components/Main.js">
+        <entry file="file://$PROJECT_DIR$/src/components/Services.js">
           <provider selected="true" editor-type-id="text-editor">
-            <state relative-caret-position="629">
-              <caret line="37" column="1" lean-forward="true" selection-start-line="37" selection-start-column="1" selection-end-line="37" selection-end-column="1" />
+            <state relative-caret-position="238">
+              <caret line="14" column="58" lean-forward="true" selection-start-line="14" selection-start-column="28" selection-end-line="14" selection-end-column="58" />
               <folding>
                 <element signature="e#0#26#0" expanded="true" />
               </folding>
@@ -59,11 +60,46 @@
           </provider>
         </entry>
       </file>
+      <file pinned="false" current-in-tab="true">
+        <entry file="file://$PROJECT_DIR$/src/store/app/reducers.js">
+          <provider selected="true" editor-type-id="text-editor">
+            <state relative-caret-position="463">
+              <caret line="68" column="18" lean-forward="true" selection-start-line="68" selection-start-column="18" selection-end-line="68" selection-end-column="18" />
+              <folding>
+                <element signature="e#0#207#0" expanded="true" />
+                <element signature="e#1513#1662#0" />
+                <element signature="e#1672#1811#0" />
+                <element signature="e#1821#1958#0" />
+                <element signature="e#2115#2255#0" />
+              </folding>
+            </state>
+          </provider>
+        </entry>
+      </file>
+      <file pinned="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/src/store/app/actions.js">
+          <provider selected="true" editor-type-id="text-editor">
+            <state relative-caret-position="204">
+              <caret line="12" column="31" selection-start-line="12" selection-start-column="13" selection-end-line="12" selection-end-column="31" />
+            </state>
+          </provider>
+        </entry>
+      </file>
+      <file pinned="false" current-in-tab="false">
+        <entry file="file://$PROJECT_DIR$/../../my-app/src/store/app/actions.js">
+          <provider selected="true" editor-type-id="text-editor">
+            <state relative-caret-position="493">
+              <caret line="62" selection-start-line="62" selection-end-line="75" selection-end-column="2" />
+            </state>
+          </provider>
+        </entry>
+      </file>
     </leaf>
   </component>
   <component name="FindInProjectRecents">
     <findStrings>
       <find>week.indexOf(week.find(el =&gt; el === 'чт'))</find>
+      <find>arr</find>
     </findStrings>
   </component>
   <component name="Git.Settings">
@@ -78,28 +114,18 @@
         <option value="$PROJECT_DIR$/src/components/Footer.js" />
         <option value="$PROJECT_DIR$/src/store.js" />
         <option value="$PROJECT_DIR$/src/index.js" />
-        <option value="$PROJECT_DIR$/src/components/Header.js" />
         <option value="$PROJECT_DIR$/src/store/reducers.js" />
         <option value="$PROJECT_DIR$/../../db.json" />
-        <option value="$PROJECT_DIR$/src/store/app/actions.js" />
-        <option value="$PROJECT_DIR$/src/store/app/reducers.js" />
         <option value="$PROJECT_DIR$/src/components/Appoitnment.js" />
+        <option value="$PROJECT_DIR$/src/components/Header.js" />
+        <option value="$PROJECT_DIR$/src/components/Main.js" />
+        <option value="$PROJECT_DIR$/src/components/Services.js" />
         <option value="$PROJECT_DIR$/src/components/Service.js" />
         <option value="$PROJECT_DIR$/src/db.json" />
         <option value="$PROJECT_DIR$/src/App.js" />
         <option value="$PROJECT_DIR$/src/components/Appointment.js" />
-        <option value="$PROJECT_DIR$/src/components/Main.js" />
-      </list>
-    </option>
-  </component>
-  <component name="ProjectConfigurationFiles">
-    <option name="files">
-      <list>
-        <option value="$PROJECT_DIR$/.idea/inspectionProfiles/Project_Default.xml" />
-        <option value="$PROJECT_DIR$/.idea/our-app.iml" />
-        <option value="$PROJECT_DIR$/.idea/vcs.xml" />
-        <option value="$PROJECT_DIR$/.idea/misc.xml" />
-        <option value="$PROJECT_DIR$/.idea/modules.xml" />
+        <option value="$PROJECT_DIR$/src/store/app/actions.js" />
+        <option value="$PROJECT_DIR$/src/store/app/reducers.js" />
       </list>
     </option>
   </component>
@@ -114,28 +140,48 @@
       <foldersAlwaysOnTop value="true" />
     </navigator>
     <panes>
-      <pane id="ProjectPane" />
-      <pane id="Scope">
-        <subPane subId="Scope 'Changed Files'; set:Changed Files; ALL; class com.intellij.packageDependencies.ChangeListScope">
+      <pane id="ProjectPane">
+        <subPane>
           <expand>
             <path>
-              <item name="our-app" type="3d21c010:ScopeViewTreeModel$ProjectNode" />
-              <item name="C:\React\GroupProject\our-app" type="442cc68d:ScopeViewTreeModel$RootNode" />
+              <item name="our-app" type="b2602c69:ProjectViewProjectNode" />
+              <item name="our-app" type="462c0819:PsiDirectoryNode" />
+            </path>
+            <path>
+              <item name="our-app" type="b2602c69:ProjectViewProjectNode" />
+              <item name="our-app" type="462c0819:PsiDirectoryNode" />
+              <item name="src" type="462c0819:PsiDirectoryNode" />
+            </path>
+            <path>
+              <item name="our-app" type="b2602c69:ProjectViewProjectNode" />
+              <item name="our-app" type="462c0819:PsiDirectoryNode" />
+              <item name="src" type="462c0819:PsiDirectoryNode" />
+              <item name="components" type="462c0819:PsiDirectoryNode" />
+            </path>
+            <path>
+              <item name="our-app" type="b2602c69:ProjectViewProjectNode" />
+              <item name="our-app" type="462c0819:PsiDirectoryNode" />
+              <item name="src" type="462c0819:PsiDirectoryNode" />
+              <item name="store" type="462c0819:PsiDirectoryNode" />
             </path>
             <path>
-              <item name="our-app" type="3d21c010:ScopeViewTreeModel$ProjectNode" />
-              <item name="C:\React\GroupProject\our-app" type="442cc68d:ScopeViewTreeModel$RootNode" />
-              <item name="src" type="9f88c78c:ScopeViewTreeModel$FileNode" />
+              <item name="our-app" type="b2602c69:ProjectViewProjectNode" />
+              <item name="our-app" type="462c0819:PsiDirectoryNode" />
+              <item name="src" type="462c0819:PsiDirectoryNode" />
+              <item name="store" type="462c0819:PsiDirectoryNode" />
+              <item name="app" type="462c0819:PsiDirectoryNode" />
             </path>
           </expand>
           <select />
         </subPane>
       </pane>
+      <pane id="Scope" />
     </panes>
   </component>
   <component name="PropertiesComponent">
+    <property name="SHARE_PROJECT_CONFIGURATION_FILES" value="true" />
     <property name="WebServerToolWindowFactoryState" value="false" />
-    <property name="last_opened_file_path" value="$PROJECT_DIR$/../../my-app/src/App.js" />
+    <property name="last_opened_file_path" value="$PROJECT_DIR$/../../my-app/src/store/app/actions.js" />
     <property name="node.js.detected.package.eslint" value="true" />
     <property name="node.js.path.for.package.eslint" value="project" />
     <property name="node.js.selected.package.eslint" value="(autodetect)" />
@@ -183,23 +229,24 @@
       <option name="number" value="Default" />
       <option name="presentableId" value="Default" />
       <updated>1562445740358</updated>
-      <workItem from="1562445741612" duration="29973000" />
+      <workItem from="1562445741612" duration="45849000" />
     </task>
     <servers />
   </component>
   <component name="TimeTrackingManager">
-    <option name="totallyTimeSpent" value="29973000" />
+    <option name="totallyTimeSpent" value="45849000" />
   </component>
   <component name="ToolWindowManager">
-    <frame x="297" y="30" width="1175" height="1047" extended-state="0" />
+    <frame x="-8" y="-8" width="2576" height="1056" extended-state="6" />
+    <editor active="true" />
     <layout>
       <window_info id="npm" sideWeight="0.227446" side_tool="true" weight="0.08392435" />
       <window_info id="Favorites" side_tool="true" />
-      <window_info active="true" content_ui="combo" id="Project" order="0" sideWeight="0.772554" visible="true" weight="0.18733509" />
+      <window_info active="true" content_ui="combo" id="Project" order="0" sideWeight="0.772554" visible="true" weight="0.08392435" />
       <window_info id="Structure" order="1" sideWeight="0.5005417" side_tool="true" weight="0.08392435" />
       <window_info anchor="bottom" id="Docker" show_stripe_button="false" />
       <window_info anchor="bottom" id="Version Control" />
-      <window_info anchor="bottom" id="Terminal" weight="0.094257854" />
+      <window_info anchor="bottom" id="Terminal" visible="true" weight="0.0964247" />
       <window_info anchor="bottom" id="Event Log" side_tool="true" />
       <window_info anchor="bottom" id="Message" order="0" />
       <window_info anchor="bottom" id="Find" order="1" weight="0.32936078" />
@@ -387,48 +434,71 @@
         </state>
       </provider>
     </entry>
+    <entry file="file://$PROJECT_DIR$/src/components/Header.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state relative-caret-position="170">
+          <caret line="10" column="36" lean-forward="true" selection-start-line="10" selection-start-column="36" selection-end-line="10" selection-end-column="36" />
+          <folding>
+            <element signature="e#0#26#0" expanded="true" />
+          </folding>
+        </state>
+      </provider>
+    </entry>
     <entry file="file://$PROJECT_DIR$/src/db.json">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="153">
-          <caret line="9" column="15" selection-start-line="9" selection-start-column="7" selection-end-line="9" selection-end-column="15" />
+        <state relative-caret-position="204">
+          <caret line="12" column="26" lean-forward="true" selection-start-line="12" selection-start-column="26" selection-end-line="12" selection-end-column="26" />
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/src/store/app/reducers.js">
+    <entry file="file://$PROJECT_DIR$/src/components/Doctors.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="306">
-          <caret line="21" column="24" lean-forward="true" selection-start-line="21" selection-start-column="24" selection-end-line="21" selection-end-column="24" />
+        <state relative-caret-position="408">
+          <caret line="24" column="26" lean-forward="true" selection-start-line="24" selection-start-column="26" selection-end-line="24" selection-end-column="26" />
           <folding>
-            <element signature="e#0#115#0" expanded="true" />
+            <element signature="e#0#26#0" expanded="true" />
           </folding>
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/src/store/app/actions.js">
+    <entry file="file://$PROJECT_DIR$/src/components/Service.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="136">
-          <caret line="8" column="43" lean-forward="true" selection-start-line="8" selection-start-column="43" selection-end-line="8" selection-end-column="43" />
+        <state relative-caret-position="340">
+          <caret line="20" column="1" lean-forward="true" selection-start-line="20" selection-start-column="1" selection-end-line="20" selection-end-column="1" />
+          <folding>
+            <element signature="e#0#26#0" expanded="true" />
+          </folding>
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/src/components/Header.js">
+    <entry file="file://$APPLICATION_HOME_DIR$/plugins/JavaScriptLanguage/jsLanguageServicesImpl/external/react.d.ts">
       <provider selected="true" editor-type-id="text-editor">
-        <state>
-          <caret column="9" selection-start-column="9" selection-end-column="9" />
+        <state relative-caret-position="371">
+          <caret line="298" column="8" selection-start-line="298" selection-start-column="8" selection-end-line="298" selection-end-column="8" />
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/src/components/Service.js">
+    <entry file="file://$PROJECT_DIR$/src/components/Services.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="17">
-          <caret line="1" selection-start-line="1" selection-end-line="1" />
+        <state relative-caret-position="238">
+          <caret line="14" column="58" lean-forward="true" selection-start-line="14" selection-start-column="28" selection-end-line="14" selection-end-column="58" />
+          <folding>
+            <element signature="e#0#26#0" expanded="true" />
+          </folding>
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/src/components/Main.js">
+    <entry file="file://$PROJECT_DIR$/../../my-app/src/store/app/actions.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="629">
-          <caret line="37" column="1" lean-forward="true" selection-start-line="37" selection-start-column="1" selection-end-line="37" selection-end-column="1" />
+        <state relative-caret-position="493">
+          <caret line="62" selection-start-line="62" selection-end-line="75" selection-end-column="2" />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/src/App.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state relative-caret-position="242">
+          <caret line="52" column="38" selection-start-line="52" selection-start-column="28" selection-end-line="52" selection-end-column="38" />
           <folding>
             <element signature="e#0#26#0" expanded="true" />
           </folding>
@@ -437,17 +507,28 @@
     </entry>
     <entry file="file://$PROJECT_DIR$/src/components/Appointment.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="1156">
-          <caret line="68" column="27" lean-forward="true" selection-start-line="68" selection-start-column="27" selection-end-line="68" selection-end-column="27" />
+        <state relative-caret-position="578">
+          <caret line="76" column="21" lean-forward="true" selection-start-line="76" selection-start-column="21" selection-end-line="76" selection-end-column="21" />
         </state>
       </provider>
     </entry>
-    <entry file="file://$PROJECT_DIR$/src/App.js">
+    <entry file="file://$PROJECT_DIR$/src/store/app/actions.js">
       <provider selected="true" editor-type-id="text-editor">
-        <state relative-caret-position="612">
-          <caret line="36" column="1" lean-forward="true" selection-start-line="36" selection-start-column="1" selection-end-line="36" selection-end-column="1" />
+        <state relative-caret-position="204">
+          <caret line="12" column="31" selection-start-line="12" selection-start-column="13" selection-end-line="12" selection-end-column="31" />
+        </state>
+      </provider>
+    </entry>
+    <entry file="file://$PROJECT_DIR$/src/store/app/reducers.js">
+      <provider selected="true" editor-type-id="text-editor">
+        <state relative-caret-position="463">
+          <caret line="68" column="18" lean-forward="true" selection-start-line="68" selection-start-column="18" selection-end-line="68" selection-end-column="18" />
           <folding>
-            <element signature="e#0#26#0" expanded="true" />
+            <element signature="e#0#207#0" expanded="true" />
+            <element signature="e#1513#1662#0" />
+            <element signature="e#1672#1811#0" />
+            <element signature="e#1821#1958#0" />
+            <element signature="e#2115#2255#0" />
           </folding>
         </state>
       </provider>

src/App.js

@@ -2,11 +2,24 @@ import React from 'react';
 import {connect} from 'react-redux'
 import {Switch, Route} from "react-router-dom";
 
-import {getDoctors,getServices} from "./store/app/actions";
+import {
+    getAll,
+    getDoctors,
+    getServices,
+    setAppointmentDate,
+    setAppointmentDoctor,
+    setAppointmentTime,
+    setAppointmentSpec,
+    setAppointmentComment,
+    clearAppointment,
+    putOrders,
+
+} from "./store/app/actions";
 
 import Header from "./components/Header";
 import Footer from "./components/Footer";
-import Main from "./components/Main"
+import Doctors from "./components/Doctors"
+import Services from "./components/Services"
 import Service from "./components/Service"
 import Appointment from "./components/Appointment"
 
@@ -14,21 +27,39 @@ import Appointment from "./components/Appointment"
 export class App extends React.Component {
 
     componentDidMount() {
-        this.props.getDoctors();
-        this.props.getServices()
+        // this.props.getDoctors();
+        // this.props.getServices()
+        this.props.getAll()
     }
 
     render() {
-
+        console.log(this.props.app)
         return (
             <div className="App">
                 <Header/>
                     <Switch>
                         <Route exact path="/" render={() => <div>Main</div>} />
-                        <Route exact path="/doctors" render={() => <Main data={this.props.app.doctors} flag={'doctors'}/> } />
-                        <Route exact path="/services" render={() => <Main data={Array.from(Object.values(this.props.app.services))} flag={'services'}/>} />
-                        <Route exact path="/services/:service" render={(props) => <Service his={props} data={this.props.app.services}/>} />
-                        <Route  path="/appointment/:doctor" render={(props) => <Appointment his={props} dataDoctors={this.props.app.doctors} dataServices={this.props.app.services}/>} />
+                        <Route exact path="/doctors" render={() => <Doctors data={this.props.app.doctors} /> } />
+                        <Route exact path="/services" render={() => <Services data={Array.from(Object.values(this.props.app.services))} />} />
+                        <Route exact path="/reviews" render={() => <div>Reviews</div>} />
+                        <Route exact path="/services/:service" render={(props) => <Service
+                            his={props}
+                            data={this.props.app.services}
+                        />} />
+                        <Route  path="/appointment/:doctor" render={(props) => <Appointment
+                            his={props}
+                            dataDoctors={this.props.app.doctors}
+                            dataServices={this.props.app.services}
+                            dataOrders={this.props.app.orders}
+                            appointment={this.props.app.appointment}
+                            setAppointmentDate={this.props.setAppointmentDate}
+                            setAppointmentDoctor={this.props.setAppointmentDoctor}
+                            setAppointmentTime={this.props.setAppointmentTime}
+                            setAppointmentSpec={this.props.setAppointmentSpec}
+                            setAppointmentComment={this.props.setAppointmentComment}
+                            clearAppointment={this.props.clearAppointment}
+                            putOrders={this.props.putOrders}
+                        />} />
                     </Switch>
                 <Footer/>
             </div>
@@ -43,8 +74,16 @@ const mapStateToProps = state => {
 };
 
 const mapDispatchToProps = {
+    getAll,
     getDoctors,
-    getServices
+    getServices,
+    setAppointmentDate,
+    setAppointmentDoctor,
+    setAppointmentTime,
+    setAppointmentSpec,
+    setAppointmentComment,
+    clearAppointment,
+    putOrders
 
 };
 

src/components/Appointment.js

@@ -2,92 +2,83 @@ import React from 'react';
 
 
 export default class Appointment extends React.Component {
-    state={
-        date:{
-            year:0,
-            month:0,
-            day:0
-        },
-        spec:null,
-        time:null
-    };
 
-
-    changeDate =(e) => {
-        const date = e.target.value.split('-');
-        this.setState({
-            date:{
-                year:date[0],
-                month:date[1],
-                day:date[2]
-            }
-        })
-    };
-
-    chooseSpeciality = (e) => {
-        this.setState({spec:e.target.value})
+    componentDidMount() {
+        this.props.setAppointmentDoctor(+this.props.his.match.params.doctor)
     }
 
-    chooseTime =(e) => {
-        this.setState({time:e.target.value})
+    componentWillUnmount() {
+        this.props.clearAppointment()
     }
 
     render() {
-        let schedule
-        const {his,dataDoctors,dataServices} = this.props;
-        const path = his.match.params.doctor;
-        const doctor = dataDoctors.find(el => el.id === +path);
-        if(doctor){
-            schedule = doctor.schedule
-
-
-        }
-
-
-        // if (doctor){
-        //     schedule = doctor.schedule[`${this.state.date.month<10 ? '0'+this.state.date.month : this.state.date.month}`][`${this.state.date.day<10 ? '0'+this.state.date.day : this.state.date.day}`]
-        //     console.log(doctor.schedule[`${this.state.date.month<10 ? '0'+this.state.date.month : this.state.date.month}`][`${this.state.date.day<10 ? '0'+this.state.date.day : this.state.date.day}`])
-        // }
-        if (this.state.time){
-        console.log(this.state.time)
-        console.log(this.state.time.split(':'))
-        console.log(dataServices[this.state.spec].duration)
-            console.log(+this.state.time.split(':')[0] + dataServices[this.state.spec].duration)
+        const {his,dataDoctors,dataServices,dataOrders,appointment,
+            setAppointmentDate,
+            setAppointmentTime,
+            setAppointmentSpec,
+            setAppointmentComment,
+            putOrders
+        } = this.props;
+        const timeArray = [];
+        const doctor = dataDoctors.find(el => el.id === +his.match.params.doctor);
+        if (appointment.date.year){
+            for (let index in doctor.schedule[appointment.date.month][appointment.date.day]){
+                timeArray.push({[`${index}`]:doctor.schedule[appointment.date.month][appointment.date.day][`${index}`]})
+            }
         }
-
         return (
             <>
-                {doctor && <div style={{display:'flex',flexDirection:'column',width:'400px'}}>
+                {doctor &&
+                <div style={{display:'flex',flexDirection:'column',width:'400px'}}>
                     <p>{doctor.photo}</p>
                     <p>{doctor.name}</p>
                     <p>{doctor.lastName}</p>
                     <p>{doctor.skillsDescription}</p>
-                    <select onChange={this.chooseSpeciality} defaultValue='choose spec'>
+                    <select onChange={(e)=>setAppointmentSpec(e.target.value)} defaultValue='choose spec'>
                         <option disabled >choose spec</option>
-                        {doctor.speciality.map(el=> (
-                            <option key={el}>{el}</option>
-                        ))}
+                        {
+                            doctor.speciality.map(el=> (
+                                <option key={el}>{el}</option>
+                            ))
+                        }
 
                     </select>
-                    {this.state.spec && <input type="date" onChange={this.changeDate}/>}
-                    {this.state.date.year !== 0 &&
+
+                    {appointment.spec && <input type="date" onChange={(e)=>setAppointmentDate(e.target.value)}/>}
+
+                    {appointment.date.year !== 0 &&
                     <div>
-                        {Object.values(schedule)[0][this.state.date.day] ?
-                            <div>
-                            <select onChange={this.chooseTime}>
-                                {Object.values(schedule)[0][this.state.date.day].map(el=> (
-                                    <option key={el}>{el}</option>
-                                ))}
-                                
-                            </select>
-                                <input type="time" readOnly placeholder="Time will be calculated" value={this.state.time ? +this.state.time.split(':')[0] + dataServices[this.state.spec].duration + ':00' : ''}/>
-                            </div>
-                            : <p>No work today</p>}
+                        {
+                            ( +appointment.date.month >= new Date().getMonth()+1 && +appointment.date.day >= new Date().getDate() ) ?
+                                doctor.schedule[appointment.date.month][appointment.date.day] ?
+                                    <div>
+                                        <select onChange={(e)=>setAppointmentTime(e.target.value)} defaultValue='choose time'>
+                                            <option disabled >choose time</option>
+                                            {
+                                                timeArray.map(el=> (
+                                                    <option key={Object.keys(el)[0]}>{Object.values(el)[0] ? Object.keys(el)[0] : null}</option>
+                                                ))
+                                            }
+
+                                        </select>
+                                        <input type="time" readOnly placeholder="Time will be calculated" value={appointment.time ? +appointment.time.split(':')[0] + dataServices[appointment.spec].duration + ':00' : ''}/>
+                                    </div>
+                                    : <p>No work today</p>
+                                : <p>Please choose current or future date</p>
+                        }
                     </div>
                     }
-            </div>}
-                </>
+
+                    {appointment.time &&
+                    <div style={{display:"flex",flexDirection:"column"}}>
+                        <input type='text' placeholder='Add comments here' onChange={(e)=>setAppointmentComment(e.target.value)}/>
+                        <button onClick={()=>putOrders([...dataOrders,appointment])}>Confirm Appointment</button>
+                    </div>
+                    }
+
+                </div>
+                }
+            </>
         );
     }
 }
-

src/components/Doctors.js

@@ -0,0 +1,31 @@
+import React from 'react';
+import {Link} from 'react-router-dom'
+
+export default class Doctors extends React.Component {
+
+
+    render() {
+        const {data} = this.props
+        return (
+            <div style={{display:'flex', justifyContent:'center', flexWrap:'wrap'}}>
+                {data.map(el => (
+                    <div key={el.id}
+                         style={{display: 'flex', flexDirection: 'column', width: '300px', margin: '10px 20px'}}>
+                        <Link to={`/doctors/${el.id}`}>
+                            <p>{el.photo}</p>
+                            <p>{el.name}</p>
+                            <p>{el.lastName}</p>
+                            <p>{el.age}</p>
+                            <p>{el.skillsDescription}</p>
+                        </Link>
+                        {el.speciality.map(el => (
+                            <Link to={`/services/${el}`} key={el}>{el}</Link>
+                        ))}
+                        <Link to={`/appointment/${el.id}`}>Make an appointment</Link>
+                    </div>
+                ))
+                }
+            </div>
+        );
+    }
+}

src/components/Header.js

@@ -7,6 +7,8 @@ const Header = () => {
             <Link to="/">Main Page</Link>
             <Link to="/doctors">Doctors</Link>
             <Link to="/services">Services</Link>
+            <Link to="/reviews">Reviews</Link>
+            <button>Sing In</button>
         </div>
     );
 };

src/components/Main.js

@@ -1,38 +0,0 @@
-import React from 'react';
-import {Link} from 'react-router-dom'
-
-export default class Main extends React.Component {
-
-
-    render() {
-        const {data, flag} = this.props
-        return (
-            <div style={{display:'flex', justifyContent:'center', flexWrap:'wrap'}}>
-                {(flag==='doctors') ? data.map(el=>(
-                        <div key={el.id} style={{display:'flex',flexDirection:'column', width:'300px', margin:'10px 20px'}}>
-                            <Link to={`/doctors/${el.id}`} >
-                                <p>{el.photo}</p>
-                                <p>{el.name}</p>
-                                <p>{el.lastName}</p>
-                                <p>{el.age}</p>
-                                <p>{el.skillsDescription}</p>
-                            </Link>
-                            {el.speciality.map(el=>(
-                                <Link to={`/services/${el}`} key={el}>{el}</Link>
-                            ))}
-                            <Link to={`/appointment/${el.id}`}>Make an appointment</Link>
-                        </div>
-                    )) : (flag==='services') ?
-                data.map(el => (
-                   <div key={el.id} style={{width:'300px', margin:'10px 20px'}}>
-                       <p>{el.name}</p>
-                       <p>{el.description}</p>
-                       <p>Price:{el.price}$</p>
-                   </div>
-                )) : <p>null</p>
-                }
-
-            </div>
-        );
-    }
-}

src/components/Service.js

@@ -1,4 +1,5 @@
 import React from 'react';
+import {Link} from "react-router-dom";
 
 
 export default class Service extends React.Component {
@@ -8,10 +9,12 @@ export default class Service extends React.Component {
         const {his,data} = this.props;
         const path = his.match.params.service;
         return (
-            <div >
+            <div style={{display:'flex',flexDirection:'column', width:'200px', margin:'10px 20px'}}>
                 {data[path].name}
-                {data[path].description}
-                {data[path].price}
+                <p>Duration:{data[path].duration}h</p>
+                <p>{data[path].description}</p>
+                <p>Price:{data[path].price}$</p>
+                <Link to={`/appointment/${path}`}>Make an appointment</Link>
             </div>
         );
     }

src/components/Services.js

@@ -0,0 +1,29 @@
+import React from 'react';
+import {Link} from 'react-router-dom'
+
+export default class Services extends React.Component {
+
+
+    render() {
+        const {data} = this.props;
+        return (
+            <div style={{display:'flex', justifyContent:'center', flexWrap:'wrap'}}>
+                {
+                    data.map(el => (
+                        <div key={el.id} style={{display:'flex',flexDirection:'column', width:'200px', margin:'10px 20px'}}>
+                            <p>{el.name}</p>
+                            <p>Duration:{el.duration}h</p>
+                            <p>{el.description}</p>
+                            <p>Price:{el.price}$</p>
+                            <div>
+                            <Link to={`/services/service${el.id}`}>More Info</Link>
+                                <button>Make appointment</button>
+                            </div>
+                        </div>
+                    ))
+                }
+
+            </div>
+        );
+    }
+}

src/db.json

@@ -9,10 +9,54 @@
       "skillsDescription":"Lorem ipsum dolor sit amet, consectetur adipisi...",
       "schedule": {
         "07": {
-          "09": ["8:00","09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00","17:00"],
-          "10": ["8:00", "09:00", "10:00", "11:00", "12:00", "13:00", "14:00", "15:00", "16:00", "17:00"],
-          "11": ["8:00", "09:00", "10:00", "11:00", "12:00", "13:00", "14:00", "15:00", "16:00", "17:00"],
-          "12": ["8:00","09:00","10:00","11:00","12:00","13:00","14:00","15:00","16:00","17:00"],
+          "09": {
+            "08:00": true,
+            "09:00": true,
+            "10:00": true,
+            "11:00": true,
+            "12:00": true,
+            "13:00": true,
+            "14:00": true,
+            "15:00": true,
+            "16:00": true,
+            "17:00": true
+          },
+          "10": {
+            "08:00": true,
+            "09:00": true,
+            "10:00": true,
+            "11:00": true,
+            "12:00": true,
+            "13:00": true,
+            "14:00": true,
+            "15:00": true,
+            "16:00": true,
+            "17:00": true
+          },
+          "11": {
+            "08:00": true,
+            "09:00": true,
+            "10:00": true,
+            "11:00": true,
+            "12:00": true,
+            "13:00": true,
+            "14:00": true,
+            "15:00": true,
+            "16:00": true,
+            "17:00": true
+          },
+          "12": {
+            "08:00": true,
+            "09:00": true,
+            "10:00": true,
+            "11:00": true,
+            "12:00": true,
+            "13:00": true,
+            "14:00": true,
+            "15:00": true,
+            "16:00": true,
+            "17:00": true
+          },
           "13": false,
           "14": false
         }

src/store/app/actions.js

@@ -6,10 +6,118 @@ export const GET_SERVICES_REQUEST = "GET_SERVICES_REQUEST";
 export const GET_SERVICES_REQUEST_SUCCESS = "GET_SERVICES_REQUEST_SUCCESS";
 export const GET_SERVICES_REQUEST_FAIL = "GET_SERVICES_REQUEST_FAIL";
 
+export const GET_ALL_REQUEST = "GET_ALL_REQUEST";
+export const GET_ALL_REQUEST_SUCCESS = "GET_ALL_REQUEST_SUCCESS";
+export const GET_ALL_REQUEST_FAIL = "GET_ALL_REQUEST_FAIL";
+
+export const PUT_ORDERS_REQUEST = "PUT_ORDERS_REQUEST";
+export const PUT_ORDERS_REQUEST_SUCCESS = "PUT_ORDERS_REQUEST_SUCCESS";
+export const PUT_ORDERS_REQUEST_FAIL = "PUT_ORDERS_REQUEST_FAIL";
+
+export const CHANGE_APPOINTMENT_DATE= "CHANGE_APPOINTMENT_DATE";
+export const CHANGE_APPOINTMENT_DOCTOR= "CHANGE_APPOINTMENT_DOCTOR";
+export const CHANGE_APPOINTMENT_TIME= "CHANGE_APPOINTMENT_TIME";
+export const CHANGE_APPOINTMENT_SPEC= "CHANGE_APPOINTMENT_SPEC";
+export const CHANGE_APPOINTMENT_COMMENT= "CHANGE_APPOINTMENT_COMMENT";
+export const CLEAR_APPOINTMENT= "CLEAR_APPOINTMENT";
+
+
+
 const URL = "https://team-app-28f4a.firebaseio.com/";
 
 // -----------------------------------------------------------------------------------------------------------------
 
+export const setAppointmentDate = payload => ({
+    type: CHANGE_APPOINTMENT_DATE,
+    payload
+});
+
+export const setAppointmentDoctor = payload => ({
+    type: CHANGE_APPOINTMENT_DOCTOR,
+    payload
+});
+
+export const setAppointmentTime = payload => ({
+    type: CHANGE_APPOINTMENT_TIME,
+    payload
+});
+
+export const setAppointmentSpec = payload => ({
+    type: CHANGE_APPOINTMENT_SPEC,
+    payload
+});
+
+export const setAppointmentComment = payload => ({
+    type: CHANGE_APPOINTMENT_COMMENT,
+    payload
+});
+
+export const clearAppointment = payload => ({
+    type: CLEAR_APPOINTMENT,
+    payload
+});
+
+// -----------------------------------------------------------------------------------------------------------------
+
+
+const putOrdersRequest = payload => ({
+    type: PUT_ORDERS_REQUEST,
+    payload
+});
+
+const putOrdersSuccess = payload => ({
+    type: PUT_ORDERS_REQUEST_SUCCESS,
+    payload
+});
+
+const putOrdersFail = payload => ({
+    type: PUT_ORDERS_REQUEST_FAIL,
+    payload
+});
+
+export const putOrders = (payload) => dispatch => {
+    dispatch(putOrdersRequest());
+    return fetch(`${URL}/orders.json`, {
+        method: "PUT",
+        headers: {
+            'Content-Type': 'application/json'
+        },
+        body: JSON.stringify(payload)
+    })
+        .then(res => res.json())
+        .then(res => dispatch(putOrdersSuccess(res)))
+        .catch(err => dispatch(putOrdersFail(err)));
+
+};
+
+
+// -----------------------------------------------------------------------------------------------------------------
+
+const getAllRequest = payload => ({
+    type: GET_ALL_REQUEST,
+    payload
+});
+
+const getAllRequestSuccess = payload => ({
+    type: GET_ALL_REQUEST_SUCCESS,
+    payload
+});
+
+const getAllRequestFail = payload => ({
+    type: GET_ALL_REQUEST_FAIL,
+    payload
+});
+
+export const getAll = () => dispatch => {
+    dispatch(getAllRequest());
+    return fetch(`${URL}.json`)
+        .then(res => res.json())
+        .then(res => dispatch(getAllRequestSuccess(res)))
+        .catch(err => dispatch(getAllRequestFail(err)));
+};
+
+// -----------------------------------------------------------------------------------------------------------------
+
 const getDoctorsRequest = payload => ({
     type: GET_DOCTORS_REQUEST,
     payload

src/store/app/reducers.js

@@ -5,7 +5,22 @@ import {
 
     GET_SERVICES_REQUEST,
     GET_SERVICES_REQUEST_SUCCESS,
-    GET_SERVICES_REQUEST_FAIL
+    GET_SERVICES_REQUEST_FAIL,
+
+    GET_ALL_REQUEST,
+    GET_ALL_REQUEST_SUCCESS,
+    GET_ALL_REQUEST_FAIL,
+
+    PUT_ORDERS_REQUEST,
+    PUT_ORDERS_REQUEST_SUCCESS,
+    PUT_ORDERS_REQUEST_FAIL,
+
+    CHANGE_APPOINTMENT_DATE,
+    CHANGE_APPOINTMENT_DOCTOR,
+    CHANGE_APPOINTMENT_TIME,
+    CHANGE_APPOINTMENT_SPEC,
+    CHANGE_APPOINTMENT_COMMENT,
+    CLEAR_APPOINTMENT
 
 } from './actions'
 
@@ -13,6 +28,18 @@ import {
 
 
 const defaultState = {
+    currentUser:{
+        email:"dead1990bb@gmail.com",
+        id:1,
+        name:"Borys",
+        lastName:"Kozhyn",
+        age:29,
+        phone:"380938807183",
+        avatar:"some avatar",
+        password:"123456",
+        root:false,
+        doctor:false,
+    },
     doctors:[],
     services:{
         service1:{id:1},
@@ -25,6 +52,22 @@ const defaultState = {
         service8:{id:8},
         service9:{id:9},
     },
+    orders:[],
+    users:[],
+    reviews: [],
+    appointment:{
+        date:{
+            year:0,
+            month:0,
+            day:0
+        },
+        price:null,
+        time:null,
+        doctorId:null,
+        spec:null,
+        user:null,
+        comment:''
+    },
     isFetching:false,
     error: null,
 
@@ -35,6 +78,128 @@ const defaultState = {
 export const appReducer = (state = defaultState,action) => {
 
     switch (action.type) {
+// -----------------------------------------------------------------------------------------------------------------
+
+        case CHANGE_APPOINTMENT_DATE : {
+            return {
+                ...state,
+                appointment:{
+                    ...state.appointment,
+                    date:{
+                        year: action.payload.split('-')[0],
+                        month: action.payload.split('-')[1],
+                        day: action.payload.split('-')[2],
+                    }
+                }
+            };
+        }
+
+        case CHANGE_APPOINTMENT_DOCTOR : {
+            return {
+                ...state,
+                appointment:{
+                    ...state.appointment,
+                    doctorId:action.payload
+                }
+            };
+        }
+
+        case CHANGE_APPOINTMENT_TIME : {
+            return {
+                ...state,
+                appointment:{
+                    ...state.appointment,
+                    time:action.payload
+                }
+            };
+        }
+
+        case CHANGE_APPOINTMENT_SPEC : {
+            return {
+                ...state,
+                appointment:{
+                    ...state.appointment,
+                    spec:action.payload,
+                    id:state.orders[state.orders.length-1].id+1,
+                    price:+state.services[action.payload].price
+                }
+            };
+        }
+
+        case CHANGE_APPOINTMENT_COMMENT : {
+            return {
+                ...state,
+                appointment:{
+                    ...state.appointment,
+                    comment:action.payload
+                }
+            };
+        }
+
+        case CLEAR_APPOINTMENT : {
+            return {
+                ...state,
+                appointment: defaultState.appointment
+            };
+        }
+
+// -----------------------------------------------------------------------------------------------------------------
+
+
+        case PUT_ORDERS_REQUEST : {
+            return {
+                ...state,
+                isFetching: true
+            };
+        }
+
+        case PUT_ORDERS_REQUEST_SUCCESS : {
+            return {
+                ...state,
+                appointment: defaultState.appointment,
+                orders:action.payload,
+                isFetching: false
+            }
+        }
+
+        case PUT_ORDERS_REQUEST_FAIL : {
+            return {
+                ...state,
+                error:action.payload,
+                isFetching: false
+            }
+        }
+
+// -----------------------------------------------------------------------------------------------------------------
+
+
+        case GET_ALL_REQUEST : {
+            return {
+                ...state,
+                isFetching: true
+            };
+        }
+
+        case GET_ALL_REQUEST_SUCCESS : {
+            return {
+                ...state,
+                doctors: action.payload.doctors,
+                services: action.payload.services,
+                orders: action.payload.orders,
+                users: action.payload.users,
+                reviews: action.payload.reviews,
+                isFetching: false
+            }
+        }
+
+        case GET_ALL_REQUEST_FAIL : {
+            return {
+                ...state,
+                error:action.payload,
+                isFetching: false
+            }
+        }
+
 // -----------------------------------------------------------------------------------------------------------------
 
         case GET_DOCTORS_REQUEST : {