[ADD] profile component

perfil.php

@@ -210,4 +210,4 @@
 }(jQuery));
 
 $('input[type=file]').customFile();
-  </script>
+  </script>

psicoadmin/src/Components/Dashboard.js

@@ -161,7 +161,7 @@ function DashboardContent() {
                                 MenuListProps={{
                                     'aria-labelledby': 'basic-button',
                                 }}>
-                                <MenuItem onClick={handleCloseMov}>Profile</MenuItem>
+                                <MenuItem onClick={ () => navigate('/perfil') }>Perfil</MenuItem>
                                 <MenuItem onClick={handleCloseMov}>My account</MenuItem>
                                 <MenuItem onClick={handleCloseMov}>Logout</MenuItem>
                             </Menu>
@@ -222,7 +222,7 @@ function DashboardContent() {
                                 open={open_profile}
                                 onClose={handleClose}
                                 MenuListProps={{ 'aria-labelledby': 'basic-button', }}>
-                                <MenuItem onClick={() => console.log('opcion 1') }>Profile</MenuItem>
+                                <MenuItem onClick={() => navigate('perfil') }>Profile</MenuItem>
                                 <MenuItem onClick={() => console.log('opcion 2')}>My account</MenuItem>
                                 <MenuItem onClick={CerrarSession}>Logout</MenuItem>
                             </Menu>

psicoadmin/src/Components/Routes.js

@@ -3,7 +3,6 @@ import { Routes, Route, Navigate, useNavigate } from "react-router-dom";
 
 import { Dashboard } from "./Dashboard";
 import { Login } from '../Pages/Login'
-import { NotFound } from '../Pages/NotFound'
 import { Home } from '../Pages/Home'
 import { Puestos } from '../Pages/Puestos'
 import { Contras  } from '../Pages/Contras'
@@ -14,6 +13,8 @@ import { Historial } from '../Pages/Historial'
 import { Pruebas } from '../Pages/Pruebas'
 import { PruebaNueva } from '../Pages/PruebaNueva'
 import { PruebaAsignar } from '../Pages/PruebaAsignar'
+import { NotFound } from '../Pages/404'
+import { Profile } from '../Pages/Profile'
 
 import useAuth from '../Auth/useAuth'
 
@@ -40,6 +41,7 @@ export default function MyRoutes () {
                         <Route path="dashboard" element={<Dashboard/>}>
                             <Route path="home" element={<Home/>} />
                             <Route path="puestos" element={<Puestos/>} />
+                            <Route path="perfil" element={<Profile/>} />
                             <Route path="contrasenas" element={<Contras/>} />
                             <Route path="expedientes" element={<Expedientes/>} />
                             <Route path="resultados" element={<Resultados/>} />

psicoadmin/src/Css/all.css

@@ -1096,8 +1096,9 @@ section.lockscreen {
     height:200px;
 }
 .page_notfound {
+    padding-top: 15%;
     display: table-cell;
-    vertical-align: middle;
+    vertical-align: middle !important;
 }
 section.error_page {
     background: #f1f1f1;

psicoadmin/src/Pages/404.js

@@ -0,0 +1,17 @@
+import { Col, Row }  from 'react-bootstrap'
+
+export function NotFound() {
+    return(
+        <section class="error_page">
+            <div class="page_notfound">
+                <Row class="row">
+                    <Col md="12">
+                        <h1>404</h1>
+                        <h3>Upss!.. Algo salió mal</h3>
+                        <p>No pudimos encontrar la página que estás buscando.</p>
+                    </Col>
+                </Row>
+            </div>    
+        </section>
+    )
+}

psicoadmin/src/Pages/Profile.js

@@ -0,0 +1,63 @@
+import ProfilePicture from '../Images/man.png';
+import { Col, Row } from 'react-bootstrap'
+
+export function Profile () {
+    return (
+        <div class="content-section">
+            <div class="main">
+                <h1 class="breadcrumb-header">Perfil</h1>
+                <Row>
+                    <Col md="12">
+                        <div class="panel">
+                            <Row class="row">
+                                <Col md="4">
+                                    <div class="img-container">
+                                        <img src={ProfilePicture}/>
+                                    </div>
+                                </Col>
+                                <Col md="8">
+                                    <div class="custom-file-upload">
+                                        <input type="file" id="file" name="myfiles[]" multiple readonly />
+                                    </div>
+                                </Col>
+                            </Row>
+                            <Row>
+                                <Col md="6">
+                                    <div class="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 class="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>
+                            <div class="boton_guardar_info">
+                                <div class="success_btn">
+                                    <a href="#">Guardar</a>
+                                </div>
+                            </div>
+                        </div>
+                    </Col>
+                </Row>
+            </div>
+        </div>
+    )
+}