浏览代码

check test in dashboard

amenpunk 2 年之前
父节点
当前提交
09c1dd66e7
共有 4 个文件被更改,包括 118 次插入15 次删除
  1. 8 0
      src/App.css
  2. 40 0
      src/Components/HomeUser/TestCard.jsx
  3. 62 13
      src/Pages/HomeUser.jsx
  4. 8 2
      src/Pages/Logincs.jsx

+ 8 - 0
src/App.css

@@ -275,3 +275,11 @@
275 275
     color : var(--main);
276 276
     margin :5px;
277 277
 }
278
+
279
+.test_list{
280
+    max-height: 500px;
281
+    display : flex;
282
+}
283
+
284
+
285
+

+ 40 - 0
src/Components/HomeUser/TestCard.jsx

@@ -0,0 +1,40 @@
1
+import * as React from 'react';
2
+import {
3
+    Box, Card, CardActions, CardContent, Button, Typography,
4
+    CardMedia, CardActionArea,
5
+} from '@mui/material'
6
+
7
+import QA from '../../Images/puesto.jpg'
8
+
9
+export function TestCard(props) {
10
+
11
+    let { test } = props;
12
+    console.log("TEST :: ", test)
13
+
14
+    return (
15
+        <Card sx={{ maxWidth: 500, maxHeight : 500 }}>
16
+            <CardActionArea>
17
+                <CardMedia
18
+                    component="img"
19
+                    height="140"
20
+                    image={QA}
21
+                    alt="green iguana"
22
+                />
23
+                <CardContent>
24
+                    <Typography gutterBottom variant="h5" component="div">
25
+                        {test.nombre}
26
+                    </Typography>
27
+                    <Typography variant="body2" color="text.secondary">
28
+                        {test.descripcion}
29
+                    </Typography>
30
+                </CardContent>
31
+            </CardActionArea>
32
+            <CardActions>
33
+                <Button size="small" color="primary">
34
+                    Realizar
35
+                </Button>
36
+            </CardActions>
37
+        </Card>
38
+    )
39
+
40
+}

+ 62 - 13
src/Pages/HomeUser.jsx

@@ -1,19 +1,68 @@
1
-import { 
2
-    Typography, Button
3
-} from '@mui/material';
1
+import { useState, useEffect, useRef  } from 'react';
2
+import { Typography, Button, Box, Paper, Divider } from '@mui/material';
3
+
4
+import useAuth from '../Auth/useAuth.js'
5
+import { Service } from '../Utils/HTTP.js';
6
+
7
+import { TestCard } from '../Components/HomeUser/TestCard';
4 8
 
5 9
 export function HomeUser(){
6
-    return (
7
-        <div>
8
-            <Typography paragraph>
9
-                Bienvenido User
10
-            </Typography>
11
-            <div>
12
-                <Button onClick={() => console.log("close")} 
13
-                    variant="contained">
14
-                    Cerrar Session
15
-                </Button>
10
+
11
+    const auth = useAuth();
12
+    const token = useRef(auth.getToken());
13
+    const [tests, setTests] = useState([]);
14
+
15
+    useEffect(() => {
16
+
17
+        let { email , password} = auth.getProfile();
18
+        let rest = new Service(`/plaza/contrasenia/${password}/${email}`);
19
+        rest
20
+        .get(token.current)
21
+            .then(({ data }) => {
22
+                console.log("data >>> ", data)
23
+                setTests(data.tests)
24
+            })
25
+            .catch(erro => {
26
+                console.error("ERR : ", erro)
27
+            })
28
+
29
+    },[auth])
30
+
31
+    return(
32
+        <div className="content-section">
33
+            <div className="main">
34
+                <Box sx={{ width: '100%' }}>
35
+                    <Paper elevation={0} sx={{ mb: 2, padding: 2, height: '100%', minHeight: '95vh', boxShadow: 'none !important' }}>
36
+                        <h2>
37
+                            Bienvenido al sistemas de pruebas psicometricas.
38
+                        </h2>
39
+                        <h3>Instrucciones Generales</h3>
40
+                        <Typography>
41
+                             Bienvenido, el sistema tiene como objetivo evaluar diferentes caracteristicas como  medir y cuantificar los procesos cognoscitivos de la mente humana.
42
+
43
+                            Parar resolver las pruebas que estan asignadas te recomendamos busques un lugar apropiado ya que necesitaras  en promedio 2 horas libre y es importante que se tenga el 100% de tu concentracion.
44
+
45
+                        </Typography>
46
+
47
+                        <Divider style={{margin : 5}}/>
48
+
49
+                        <div className="test_list" style={{ marginTop :15 }}> 
50
+                            {
51
+                            tests.map( test => {
52
+                                return (
53
+                                    <TestCard key={test.id} test={test} />
54
+                                )
55
+                            })
56
+                            }
57
+                        </div>
58
+
59
+
60
+
61
+                    </Paper>
62
+                    <Button  onClick={auth.logout}>Salir</Button>
63
+                </Box>
16 64
             </div>
17 65
         </div>
18 66
     )
67
+
19 68
 }

+ 8 - 2
src/Pages/Logincs.jsx

@@ -51,6 +51,10 @@ export function LoginCs() {
51 51
         validationSchema: LoginSchema,
52 52
         onSubmit: async (values) => {
53 53
 
54
+            //
55
+            // QW5hbGlzdGEgZGUgY29tcHJhcw==
56
+            //
57
+            
54 58
             let { email, password } = values
55 59
             setOpen(true)
56 60
 
@@ -60,7 +64,7 @@ export function LoginCs() {
60 64
                 .then(response => {
61 65
 
62 66
                     console.log("Service Response :: ", response)
63
-                    let { token, nombre, apelidos, empresa } = response;
67
+                    let { token, nombre, apelidos} = response;
64 68
                     toast.success(`Bienvenido ${nombre} ${apelidos}!!`)
65 69
                     token = token.replace("Bearer ", "")
66 70
                     console.log(token);
@@ -72,7 +76,9 @@ export function LoginCs() {
72 76
                     // let restante = timestamp - Date.now();
73 77
 
74 78
                     // setTimeout(() => alert("Token Expirado"), restante)
75
-                    auth.setProfile(empresa)
79
+                    auth.setProfile({
80
+                        email, password
81
+                    })
76 82
                     auth.setRole(body_token)
77 83
 
78 84
                     setTimeout(() => {