|
@@ -1,5 +1,10 @@
|
|
1
|
+import React, { useState } from 'react';
|
|
2
|
+import { Row, Col } from 'react-bootstrap';
|
|
3
|
+
|
1
|
4
|
import UpdateIcon from '@mui/icons-material/Update';
|
2
|
|
-import { Table } from 'react-bootstrap'
|
|
5
|
+import Typography from '@mui/material/Typography';
|
|
6
|
+import Pagination from '@mui/material/Pagination';
|
|
7
|
+import Stack from '@mui/material/Stack';
|
3
|
8
|
|
4
|
9
|
export default function Candidatos () {
|
5
|
10
|
|
|
@@ -18,6 +23,12 @@ export default function Candidatos () {
|
18
|
23
|
}
|
19
|
24
|
]
|
20
|
25
|
|
|
26
|
+ const [page, setPage] = React.useState(1);
|
|
27
|
+ const handleChange = (event, value) => {
|
|
28
|
+ console.log("INDEX => ", value)
|
|
29
|
+ setPage(value);
|
|
30
|
+ };
|
|
31
|
+
|
21
|
32
|
return (
|
22
|
33
|
<div className="body_historial">
|
23
|
34
|
<div className="header_historial">
|
|
@@ -27,26 +38,16 @@ export default function Candidatos () {
|
27
|
38
|
<div className="content_historial">
|
28
|
39
|
<p>Últimos candidatos que han ingresado al sistema:</p>
|
29
|
40
|
<div className="cabeceras">
|
30
|
|
- <div className="row">
|
31
|
|
- <div className="col20">
|
32
|
|
- <p>Contraseña</p>
|
33
|
|
- </div>
|
34
|
|
- <div className="col20">
|
35
|
|
- <p>Puesto</p>
|
36
|
|
- </div>
|
37
|
|
- <div className="col20">
|
38
|
|
- <p>No. Identificación</p>
|
39
|
|
- </div>
|
40
|
|
- <div className="col20">
|
41
|
|
- <p>Fecha de aplicación</p>
|
42
|
|
- </div>
|
43
|
|
- <div className="col20">
|
44
|
|
- <p>Pruebas Pendientes</p>
|
45
|
|
- </div>
|
46
|
|
- </div>
|
|
41
|
+ <Row>
|
|
42
|
+ <div className="col20"> <p>Contraseña</p> </div>
|
|
43
|
+ <div className="col20"> <p>Puesto</p> </div>
|
|
44
|
+ <div className="col20"> <p>No. Identificación</p> </div>
|
|
45
|
+ <div className="col20"> <p>Fecha de aplicación</p> </div>
|
|
46
|
+ <div className="col20"> <p>Pruebas Pendientes</p> </div>
|
|
47
|
+ </Row>
|
47
|
48
|
</div>
|
48
|
|
-
|
49
|
49
|
{
|
|
50
|
+ users.length ?
|
50
|
51
|
users.map( (user, index) => {
|
51
|
52
|
return(
|
52
|
53
|
<div key={index} className="data_candidato">
|
|
@@ -69,8 +70,16 @@ export default function Candidatos () {
|
69
|
70
|
</div>
|
70
|
71
|
</div>
|
71
|
72
|
)
|
72
|
|
- })
|
|
73
|
+ }) : undefined
|
73
|
74
|
}
|
|
75
|
+ <Row style={{ padding : 5 }}>
|
|
76
|
+ <Col>
|
|
77
|
+ <Stack spacing={2}>
|
|
78
|
+ <Typography>Page: {page}</Typography>
|
|
79
|
+ <Pagination count={10} page={page} onChange={handleChange} />
|
|
80
|
+ </Stack>
|
|
81
|
+ </Col>
|
|
82
|
+ </Row>
|
74
|
83
|
</div>
|
75
|
84
|
</div>
|
76
|
85
|
)
|