reworked changeUser

src/components/Admin/Admin.js

@@ -109,7 +109,8 @@ export class Admin extends React.Component {
             clearAppointment,
             setAppointmentTime,
             setAppointmentComment,
-            deleteOrder
+            deleteOrder,
+            access
         } = this.props;
 
         return (
@@ -154,6 +155,7 @@ export class Admin extends React.Component {
                         />} />
                         <Route path='/admin/change-user' render={() => <ChangeUser
                             user={user}
+                            access={access}
                             users={users}
                             findUserInput={findUserInput}
                             changeFindUserInput={changeFindUserInput}
@@ -206,6 +208,7 @@ const mapStateToProps = state => {
         services: state.services.services,
         categories: state.services.categories,
         user:state.user.user,
+        access:state.user.access,
         findUserInput:state.user.findUserInput,
         userError:state.user.error,
         changeUserForm:state.user.changeUserForm,

src/components/Admin/ChangeUser.js

@@ -26,11 +26,40 @@ export default class ChangeUser extends React.Component {
     changeUser = (e) => {
         e.preventDefault();
         const obj = {};
-            this.props.changeUserForm.map(el => {
-            obj[el.inputName] = el.type === 'radio' ? el.checked ? el.value : !el.value : el.value
+        // eslint-disable-next-line array-callback-return
+        this.props.changeUserForm.map(el => {
+            if (el.type !== 'radio') {
+                return obj[el.id] = el.value
+            }
         });
-        // this.props.putUser
-        console.log({data:obj,path:this.props.user._id})
+        if (this.props.access === 'user') {
+            this.props.putUser({
+                data: {
+                    ...obj,
+                    doctor: false,
+                    role: false
+                },
+                path: this.props.user._id
+            })
+        } else if (this.props.access === 'doctor') {
+            this.props.putUser({
+                data: {
+                    ...obj,
+                    doctor: true,
+                    role: false
+                },
+                path: this.props.user._id
+            })
+        } else if (this.props.access === 'role') {
+            this.props.putUser({
+                data: {
+                    ...obj,
+                    doctor: false,
+                    role: true
+                },
+                path: this.props.user._id
+            })
+        }
     };
 
     changeConfirm = (action, text) => {
@@ -50,37 +79,37 @@ export default class ChangeUser extends React.Component {
             changeUserForm,
             error
         } = this.props;
+        console.log(this.props)
         return (
-            <div className = "change-user-container" >
-                <div className = "input-box">
-                    <input type='text' name='find_user' className = " appointment admin-form"  onKeyDown={this.enterPressed} onChange={this.changeUserInput}/>
+            <div className="change-user-container">
+                <div className="input-box">
+                    <input type='text' name='find_user' className=" appointment admin-form"
+                           onKeyDown={this.enterPressed} onChange={this.changeUserInput}/>
                     {findUserInput &&
-                    <button className = "btn service-btn" id='enter' onClick={this.findUser}>Найти пользователя</button>
+                    <button className="btn service-btn" id='enter' onClick={this.findUser}>Найти пользователя</button>
                     }
                     {user &&
-                    <div className = "change-user-form">
-                        <form className = "change-user-radio">
+                    <div className="change-user-form">
+                        <form className="change-user-radio">
                             {changeUserForm.map(el =>
-                            <div className="input-wrap" key={el.id}>
-                                
-                                    <Input
-                                        el={el}
-                                        changeInputValues={changeInputValueUserForm}
-                                        className={el.className}
-                                        id={el.id}
-                                        name = {el.inputName}
-                                        value={el.value}
-                                    />
-                                    <label htmlFor = {el.id} >
-                                        {el.pageValue}
-                                    </label>
-                            </div>
+                                    <div className="input-wrap" key={el.id}>
+                                        <Input
+                                            el={el}
+                                            changeInputValues={changeInputValueUserForm}
+                                            className={el.className}
+                                            id={el.id}
+                                            value={el.value}
+                                        />
+                                        <label htmlFor={el.id}>
+                                            {el.pageValue}
+                                        </label>
+                                    </div>
 
                                 // <label htmlFor={index}>{Object.keys(el)}</label>
                             )}
                         </form>
-                        <button className = "btn service-btn" onClick={this.changeUser}>Изменить</button>
-                        <button className = "btn service-btn" onClick={this.changeConfirm}>Удалить</button>
+                        <button className="btn service-btn" onClick={this.changeUser}>Изменить</button>
+                        <button className="btn service-btn" onClick={this.changeConfirm}>Удалить</button>
                     </div>
                     }
 
@@ -91,7 +120,7 @@ export default class ChangeUser extends React.Component {
                     }
                 </div>
                 <div>
-                    <p>Здесь будет список пользователей  </p>
+                    <p>Здесь будет список пользователей </p>
                 </div>
                 {
                     this.state.showConfirm &&

src/components/Admin/Input.js

@@ -16,6 +16,7 @@ export default class Input extends React.Component {
                 required={el.required}
                 pattern={el.pattern}
                 checked={el.checked}
+                defaultChecked={el.defaultChecked}
                 readOnly={el.readOnly}
                 onChange={(e) => changeInputValues(e)}
             />

src/reducers/user.js

@@ -1,14 +1,16 @@
 import * as types from '../actionsTypes/actionsTypes'
 
-import {adminChangeUserForm} from "../utils/formFields"
+import {adminChangeUserForm, changeUserForm} from "../utils/formFields"
 
 const defaultState = {
     user: null,
-    users:[],
+    users: [],
     findUserInput: '',
     changeUserForm: adminChangeUserForm,
+    access: '',
     isFetching: false,
     error: null
+
 };
 
 export const userReducer = (state = defaultState, action) => {
@@ -23,21 +25,26 @@ export const userReducer = (state = defaultState, action) => {
 
         case types.CHANGE_INPUT_VALUE_USER_FORM : {
             const data = action.payload.target;
-            console.log (data)
-            return {
-                ...state,
-                changeUserForm: state.changeUserForm.map(el => el.inputName === data.inputName ? el.type === 'radio' ?
-                    {
-                        ...el,
-                        checked: true
-                    } :
-                    {
-                        ...el,
-                        value: data.value
-                    } :
-                    el
-                ),
-            };
+            if (data.type === 'radio') {
+                return {
+                    ...state,
+                    access: data.value
+                }
+            } else {
+                return {
+                    ...state,
+                    changeUserForm: state.changeUserForm.map(el =>
+                        el.id === data.id
+                            ? {
+                                ...el,
+                                value: data.value
+                            }
+                            : el
+                    )
+                }
+            }
+
+
         }
 
         case types.GET_USERS_REQUEST : {
@@ -67,30 +74,42 @@ export const userReducer = (state = defaultState, action) => {
         case types.FIND_USER_REQUEST : {
             return {
                 ...state,
+                changeUserForm: adminChangeUserForm,
                 isFetching: true
             };
         }
 
         case types.FIND_USER_REQUEST_SUCCESS : {
             const data = state.findUserInput.includes('@') ? action.payload.users[0] : action.payload.user;
+            console.log(data)
             return {
                 ...state,
                 user: data,
-                changeUserForm: state.changeUserForm.map(el => Object.keys(data).find(item =>
-                     item === el.inputName) ? el.type === 'radio' ?
-                    {
-                        ...el,
-                        // checked: data[`${el.inputName}`] === el.value
-                    } :
-                    {
-                    ...el,
-                    value: data[`${el.inputName}`]
-                    } :
-                    el
+                changeUserForm: state.changeUserForm.map(el =>
+                    Object.keys(data).find(item =>
+                        item === el.id)
+                        ? el.type === 'radio'
+                        ? {
+                            ...el,
+                            defaultChecked: data[el.id]
+                        }
+                        : {
+                            ...el,
+                            value: data[el.id]
+                        }
+                        : el.id === 'user' && data.doctor === false && data.role === false
+                        ? {
+                                ...el,
+                            defaultChecked: true,
+                            }
+                        : el
                 ),
                 error: action.payload.message,
-                isFetching: false
-            };
+                access:data.role ? 'role' : data.doctor ? 'doctor' : 'user',
+                isFetching:
+                    false
+            }
+                ;
         }
 
         case types.FIND_USER_REQUEST_FAIL : {
@@ -111,6 +130,7 @@ export const userReducer = (state = defaultState, action) => {
         case types.PUT_USER_REQUEST_SUCCESS : {
             return {
                 ...state,
+                changeUserForm: adminChangeUserForm,
                 isFetching: false
             };
         }

src/utils/formFields.js

@@ -297,7 +297,7 @@ export const changeUserForm = [
 
 export const adminChangeUserForm =[
 	{
-		id:1,
+		id:'firstName',
 		type:'text',
 		value:"",
 		inputName:'firstName',
@@ -306,7 +306,7 @@ export const adminChangeUserForm =[
 		required:true
 	},
 	{
-		id:2,
+		id:'lastName',
 		type:'text',
 		value:"",
 		inputName:'lastName',
@@ -315,7 +315,7 @@ export const adminChangeUserForm =[
 		required:true
 	},
 	{
-		id:3,
+		id:'email',
 		type:'email',
 		value:"",
 		inputName:'email',
@@ -325,7 +325,7 @@ export const adminChangeUserForm =[
 		required:true
 	},
 	{
-		id:4,
+		id:'phone',
 		type:'phone',
 		value:"",
 		inputName:'phone',
@@ -333,43 +333,35 @@ export const adminChangeUserForm =[
 		placeholder:'Введите номер телефона',
 		required:true
 	},
-	// {
-	// 	id:5,
-	// 	type:'text',
-	// 	value:"",
-	// 	name:'_id',
-	// 	readOnly:true,
-	// 	required:true
-	// },
 	{
-		id:6,
+		id:'role',
 		type:'radio',
-		value: 'role',
-		pageValue : "Админ",
-		name: 'access',
+		value:'role',
+		pageValue:"Админ",
+		name:'access',
 		inputName:'role',
-		required:true,
-		className:"radio"
+		className:"radio",
+		defaultChecked:false,
 	},
 	{
-		id:7,
+		id:'doctor',
 		type:'radio',
-		value: 'doctor',
-		inputName:  'doctor',
-		pageValue : "Доктор",
+		value:'doctor',
+		inputName:'doctor',
+		pageValue:"Доктор",
 		name:'access',
-		required:true,
-		className:"radio"
+		className:"radio",
+		defaultChecked:false,
 	},
 	{
-		id:8,
+		id:'user',
 		type:'radio',
-		value: 'user',
-		inputName:  'user',
+		value:'user',
+		inputName:'user',
 		pageValue : "Пользователь",
 		name:'access',
-		required:true,
-		className:"radio"
+		className:"radio",
+		defaultChecked:false,
 	},
 ];