Reac front end for psicometric app

Home.jsx 2.0KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061
  1. import { Col, Row } from 'react-bootstrap'
  2. import React, { useEffect, useState } from 'react'
  3. import { PersonOutline, VerifiedUser, ListAlt } from '@mui/icons-material/'
  4. import Actividades from '../Components/Home/Actividades'
  5. import Candidatos from '../Components/Home/Candidatos'
  6. import { Card } from '../Components/Card';
  7. import useAuth from '../Auth/useAuth';
  8. export function Home() {
  9. const auth = useAuth();
  10. const [nombre, setNombre] = useState(null);
  11. useEffect(() => {
  12. let { nombre: empresa } = auth.getProfile();
  13. setNombre(empresa)
  14. }, [auth])
  15. return (
  16. <section >
  17. <div className="content-section">
  18. <div className="main">
  19. <div id="start_title">
  20. <h1>Bienvenido de nuevo {nombre}</h1>
  21. </div>
  22. <div className="panel_options">
  23. <Row>
  24. <Col md="4">
  25. <Card quantity={120} to='/dashboard/contrasenas' title='CONTRASEÑAS' icon={VerifiedUser}/>
  26. </Col>
  27. <Col md="4">
  28. <Card quantity={504} to='/dashboard/expedientes' title='EXPEDIENTES' icon={PersonOutline}/>
  29. </Col>
  30. <Col md="4">
  31. <Card quantity={343} to="/dashboard/puestos" title='PUESTOS' icon={ListAlt}/>
  32. </Col>
  33. </Row>
  34. </div>
  35. <div className="historial_candidatos">
  36. <Row>
  37. <Col md="8">
  38. <Candidatos/>
  39. </Col>
  40. <Col md="4">
  41. <Actividades/>
  42. </Col>
  43. </Row>
  44. </div>
  45. </div>
  46. </div>
  47. </section>
  48. )
  49. }