personal info mok

src/Pages/Configuracion.jsx

@@ -1,101 +1,64 @@
 import React from 'react'
 import ProfilePicture from '../Images/man.png';
 import { Row, Col, Button } from 'react-bootstrap'
+import { useSelector } from 'react-redux'
 
 export function Configuracion() {
 
-    let [ filename, setFilename ] = React.useState('');
-    const hiddenFileInput = React.useRef(null);
+  let recluter = useSelector((state) => state.recluter.info)
+  console.log('recluter: ', recluter)
 
-    return (
-        <div className="content-section">
-            <div className="main">
-                <h1 className="breadcrumb-header">Configuraciones</h1>
-                <Row>
-                    <Col md="12">
-                        <div className="panel">
+  return (
+    <div className="content-section">
+      <div className="main">
+        <h1 className="breadcrumb-header">Configuraciones</h1>
+        <Row>
+          <Col md="12">
+            <div className="panel">
+              <Row style={{padding:15}} className="row">
+                <Col md="6">
+                  <div className="inputs_config">
+                    <p>Datos personales</p>
+                    <label>Nombre</label>
+                    <input type="text" name="nombre_user" placeholder="Fernando Vásquez" />
+                    <label>Apellidos</label>
+                    <input type="text" name="puesto" placeholder="Gerente general" />
+                    <label>Dirección</label>
+                    <input type="text" name="direccion" placeholder="Melbourn, Australia" />
+                    <label>Número</label>
+                    <input type="number" name="numero" placeholder="12345678" />
+                  </div>
+                </Col>
+                <Col md="6">
+                  <div className="inputs_config">
+                    <p>Redes sociales</p>
+                    <label>Facebook</label>
+                    <input type="text" name="facebook" placeholder="Link de Facebook" />
+                    <label>Linkein</label>
+                    <input type="text" name="linkedin" placeholder="Link de Linkedin" />
+                    <label>Instagram</label>
+                    <input type="text" name="instagram" placeholder="Link de Instagram" />
+                    <label>Correo</label>
+                    <input type="email" name="instagram" placeholder="Correo electrónico" />
+                  </div>
+                </Col>
+              </Row>
 
-                            <Row style={{ padding : 25 }} className="row">
-                                <Col md="4">
-                                    <div className="img-container">
-                                        <img src={ProfilePicture} alt='profile ' />
-                                    </div>
-                                </Col>
-                                <Col md="8">
+              <Row>
+                <Col md='12'>
+                  <div className="boton_guardar_info">
+                    <div className="success_btn">
+                      <span >Guardar</span>
+                    </div>
+                  </div>
+                </Col>
+              </Row>
 
-                                    <input 
-                                        value={filename} 
-                                        type="text" 
-                                        className="file-upload-input" 
-                                        disabled="" 
-                                        placeholder="Ningún archivo seleccionado" readOnly
-                                    />
-
-                                    <Button className="btn_add_producto_confirm" style={{ marginLeft : 15 }}>
-                                        SUBIR FOTO
-                                    </Button>
-
-                                    <input
-                                        multiple={false}
-                                        type="file"
-                                        ref={hiddenFileInput}
-                                        onChange={(event) => {
-                                            const files = event.target.files;
-                                            console.log('files crud ', files[0])
-                                            setFilename(files[0])
-                                        }}
-                                        style={{display: 'none'}}
-                                    />
-
-                                
-
-                                </Col>
-                            </Row>
-
-                            <Row className="row">
-                                <Col md="6">
-                                    <div className="inputs_config">
-                                        <p>Datos personales</p>
-                                        <label>Nombre</label>
-                                        <input type="text" name="nombre_user" placeholder="Fernando Vásquez"/>
-                                        <label>Puesto / Profesión</label>
-                                        <input type="text" name="puesto" placeholder="Gerente general"/>
-                                        <label>Dirección</label>
-                                        <input type="text" name="direccion" placeholder="Melbourn, Australia"/>
-                                        <label>Número</label>
-                                        <input type="number" name="numero" placeholder="12345678"/>
-                                    </div>
-                                </Col>
-                                <Col md="6">
-                                    <div className="inputs_config">
-                                        <p>Redes sociales</p>
-                                        <label>Facebook</label>
-                                        <input type="text" name="facebook" placeholder="Link de Facebook"/>
-                                        <label>Linkein</label>
-                                        <input type="text" name="linkedin" placeholder="Link de Linkedin"/>
-                                        <label>Instagram</label>
-                                        <input type="text" name="instagram" placeholder="Link de Instagram"/>
-                                        <label>Correo</label>
-                                        <input type="email" name="instagram" placeholder="Correo electrónico"/>
-                                    </div>
-                                </Col>
-                            </Row>
-
-                            <Row>
-                                <Col md='12'>
-                                    <div className="boton_guardar_info">
-                                        <div className="success_btn">
-                                            <span >Guardar</span>
-                                        </div>
-                                    </div>
-                                </Col>
-                            </Row>
-
-                        </div>
-                    </Col>
-                </Row>
             </div>
-        </div>
-    )
+          </Col>
+        </Row>
+      </div>
+    </div>
+  )
 
 }

src/Pages/Login.jsx

@@ -4,6 +4,7 @@ import jwt_decode from "jwt-decode";
 import { useDispatch, useSelector } from 'react-redux';
 import { setToken } from '../Slices/tokenSlice'
 import { setRole, setProfile } from '../Slices/userSlice'
+import { setInfo } from '../Slices/recluterSlice'
 
 import {
   Paper, Box, Grid, Checkbox, FormControlLabel, Typography,
@@ -61,6 +62,8 @@ export function Login() {
         .post({})
         .then(response => {
 
+          dispatch(setInfo(response))
+
           let { token, nombre, apelidos, empresa } = response;
           toast.success(`Bienvenido ${nombre} ${apelidos} !!`)
           token = token.replace("Bearer ", "")

src/Reducers/index.js

@@ -2,11 +2,13 @@ import { combineReducers } from '@reduxjs/toolkit'
 import tokenReducer from '../Slices/tokenSlice.js';
 import userReducer from '../Slices/userSlice.js';
 import cleaverSlice from '../Slices/cleaverSlice.js';
+import recluterSlice from '../Slices/recluterSlice.js';
 
 const rootReducer = combineReducers({
   token : tokenReducer,
   user: userReducer,
-  cleaver : cleaverSlice
+  cleaver : cleaverSlice,
+  recluter : recluterSlice
 });
 
 export default rootReducer;

src/Slices/recluterSlice.js

@@ -0,0 +1,16 @@
+import { createSlice } from '@reduxjs/toolkit'
+
+const initialState = { info : {} }
+
+export const recluterSlice = createSlice({
+  name : 'recluter',
+  reducers: {
+    setInfo : (state,action) => {
+      state.info = action.payload;
+    }
+  },
+  initialState
+})
+
+export const { setInfo } = recluterSlice.actions;
+export default recluterSlice.reducer;