Browse Source

full user component without markup

Alex 5 years ago
parent
commit
bdbaec2c60

+ 5 - 0
src/actions/orders.js

@@ -34,6 +34,11 @@ const getOrdersFail = payload => ({
     payload
 });
 
+export const getUserOrders = payload => ({
+    type: types.USER_ORDERS,
+    payload
+})
+
 export const getOrders = (payload) => dispatch => {
     dispatch(getOrdersRequest());
     return fetch(`${URL}`,{

+ 0 - 3
src/actionsTypes/actionsTypes.js

@@ -9,9 +9,6 @@ export const CHANGE_DATA_IN_CURRENT_USER = "CHANGE_DATA_IN_CURRENT_USER"
 export const FIND_ORDERS_ARRAY = "FIND_ORDERS_ARRAY";
 export const CHANGE_INPUT_VALUE_FIND_ORDER = "CHANGE_INPUT_VALUE_FIND_ORDER";
 export const CHANGE_INPUT_VALUE_ORDER_FORM= "CHANGE_INPUT_VALUE_ORDER_FORM";
-export const GET_ORDERS_REQUEST = "GET_ORDERS_REQUEST";
-export const GET_ORDERS_REQUEST_SUCCESS = "GET_ORDERS_REQUEST_SUCCESS";
-export const GET_ORDERS_REQUEST_FAIL = "GET_ORDERS_REQUEST_FAIL";
 
 export const GET_USERS_REQUEST = "GET_USERS_REQUEST";
 export const GET_USERS_REQUEST_SUCCESS = "GET_USERS_REQUEST_SUCCESS";

+ 10 - 2
src/components/userOrders.js

@@ -1,9 +1,17 @@
 import React, { Component } from 'react';
 
 class UserOrders extends Component {
-    state = {  }
     render() { 
-        return ( <div>User Orders</div> );
+        const { data } = this.props
+        console.log(data)
+        return ( <div>
+            {data.map(el =>  
+                     <div key={el._id}>
+                        <p>Номер заказа: {el.orderNumber}</p>
+                        <p>Дата заказа: {el.date.split('T')[0]}</p>
+                        <p>Время заказа: {el.time}</p>
+                        </div>)}
+        </div> );
     }
 }
  

+ 27 - 10
src/containers/user.js

@@ -6,21 +6,32 @@ import {Switch, Route} from "react-router-dom";
 import UserInfo from '../components/userInfo'
 import UserOrders from '../components/userOrders'
 
-import { getOrders,getUserOrders } from "../actions/orders"
+import { getUserOrders,getOrders } from "../actions/orders"
 import { changeInputValueUserUserForm } from '../actions/auth'
 import {putUser} from '../actions/user'
 
 class UserContainer extends Component {
 
     componentDidMount() {
-        this.props.getOrders(this.props.currentUser);
-        this.props.getUserOrders(this.props.currentUser)
-       
+        this.props.getOrders({
+            doctors: this.props.doctors,
+            services: this.props.services,
+            users: this.props.users})
+    }
+    // componentDidUpdate(){
+    //     if(this.props.orders.length > 0 &&) 
+    //     // console.log('did update', this.props.orders)
+    //      this.props.getUserOrders(this.props.currentUser)
+    // }
+    componentDidUpdate(prevProps) {
+        if(this.props.orders.length > 0 ) 
+            if(prevProps.orders !==  this.props.orders)
+            this.props.getUserOrders(this.props.currentUser)
     }
 
     render() { 
-        // const {currentUser, dataOrders, getUserOrders} = this.props
-        const { currentUser,changeUserUserForm, changeInputValueUserUserForm,putUser } = this.props
+        console.log(this.props.userOrdersArray)
+        const { currentUser,changeUserUserForm, changeInputValueUserUserForm,putUser,userOrdersArray } = this.props
         return (
             <div className="main">
                 <div className="info-wrap">
@@ -30,7 +41,9 @@ class UserContainer extends Component {
                     <Link to='/user/info' className = "btn link admin">Редактировать профиль</Link>
                  </div>
                  <Switch>
-                    <Route path='/user/orders' component={ UserOrders } />
+                    <Route path='/user/orders'  render={() => <UserOrders
+                           data={ userOrdersArray}
+                        />} />
                     <Route path='/user/info' render={() => <UserInfo
                             user={currentUser}
                             changeUserUserForm = {changeUserUserForm}
@@ -48,8 +61,12 @@ class UserContainer extends Component {
 const mapStateToProps = state => {
     return {
         currentUser: state.auth.user,
-        dataOrders: state.orders,
-        changeUserUserForm: state.auth.changeUserForm
+        changeUserUserForm: state.auth.changeUserForm,
+        orders: state.orders.orders,
+        users:state.user.users,
+        services: state.services.services,
+        doctors:state.app.doctors,
+        userOrdersArray: state.orders.userOrdersArray
     }
 }
-export default connect(mapStateToProps, { getOrders,getUserOrders, changeInputValueUserUserForm, putUser })(UserContainer);
+export default connect(mapStateToProps, { changeInputValueUserUserForm, putUser, getOrders,getUserOrders })(UserContainer);

+ 0 - 2
src/reducers/index.js

@@ -5,7 +5,6 @@ import {calendarReducer} from "./calendar"
 import auth from './auth';
 import {appointmentReducer} from "./appointment";
 import {servicesReducer} from "./services";
-import orders from './orders'
 import {userReducer} from "./user";
 import {sheduleReducer} from "./shedule";
 import {ordersReducer} from "./orders";
@@ -18,7 +17,6 @@ export default combineReducers({
     calendar:calendarReducer,
     appointment:appointmentReducer,
     services:servicesReducer,
-    orders,
     user:userReducer,
     shedule:sheduleReducer,
     orders:ordersReducer

+ 12 - 1
src/reducers/orders.js

@@ -4,6 +4,7 @@ const defaultState = {
     orders:[],
     ordersArray:[],
     findOrderInput:'',
+    userOrdersArray:[],
     error:null,
     isFetching:false,
     searching:false,
@@ -79,7 +80,17 @@ export const ordersReducer = (state = defaultState, action) => {
             }
         }
 
-
+        case types.USER_ORDERS: {
+            //  console.log(action.payload)
+            // console.log(state.orders)
+             const userOrderArray = state.orders.filter(userOrder => userOrder.user === action.payload._id)
+            //  console.log('userOrders',userOrderArray)
+             return  {
+                 ...state,
+                 userOrdersArray:userOrderArray,
+                isFetching: false,}
+        }
+                  
 
 
         default: