Browse Source

add tests in password

amenpunk 3 years ago
parent
commit
65f97075d9
2 changed files with 81 additions and 14 deletions
  1. 9 9
      src/Components/Modal/AgregarManual.js
  2. 72 5
      src/Components/Modal/EditPlaza.js

+ 9 - 9
src/Components/Modal/AgregarManual.js

34
     }
34
     }
35
 
35
 
36
     const { data } = useQuery('categories', getCategories);
36
     const { data } = useQuery('categories', getCategories);
37
-    const { data: tests } = useQuery('tests', getTest);
37
+    const { data: testsCatalog } = useQuery('tests', getTest);
38
     const queryClient = useQueryClient();
38
     const queryClient = useQueryClient();
39
 
39
 
40
     const NewPlazaSchema = Yup.object().shape({
40
     const NewPlazaSchema = Yup.object().shape({
43
         aredepto: Yup.number().required('Escoge alguna área'),
43
         aredepto: Yup.number().required('Escoge alguna área'),
44
         fecha: Yup.date("Ingresa una fecha válida"),
44
         fecha: Yup.date("Ingresa una fecha válida"),
45
         notas: Yup.string("Ingresa una nota válida").min(5, "Ingresa una nota válida").max(150),
45
         notas: Yup.string("Ingresa una nota válida").min(5, "Ingresa una nota válida").max(150),
46
-        pruebas: Yup.array()
46
+        tests: Yup.array()
47
     })
47
     })
48
 
48
 
49
     const [departamento, setDepartamento] = React.useState('');
49
     const [departamento, setDepartamento] = React.useState('');
74
             aredepto: 1,
74
             aredepto: 1,
75
             fecha: date,
75
             fecha: date,
76
             notas: "",
76
             notas: "",
77
-            pruebas:[]
77
+            tests:[]
78
         },
78
         },
79
         onSubmit: (fields, { resetForm }) => {
79
         onSubmit: (fields, { resetForm }) => {
80
 
80
 
108
     const { errors, touched, handleSubmit, getFieldProps, values, setValues } = formik;
108
     const { errors, touched, handleSubmit, getFieldProps, values, setValues } = formik;
109
 
109
 
110
     const addPrueba = (check,id) => {
110
     const addPrueba = (check,id) => {
111
-        let { pruebas } = values
111
+        let { tests } = values
112
         let temp ;
112
         let temp ;
113
         if(check){
113
         if(check){
114
-            temp = [...pruebas, {id}]
114
+            temp = [...tests, {id}]
115
         }else{
115
         }else{
116
-            temp = pruebas.filter( test => test.id !== id);
116
+            temp = tests.filter( test => test.id !== id);
117
         }
117
         }
118
         setChecklist(  temp.map( test => test.id) )
118
         setChecklist(  temp.map( test => test.id) )
119
-        setValues({...values, pruebas: temp})
119
+        setValues({...values, tests: temp})
120
     };
120
     };
121
 
121
 
122
     return (
122
     return (
145
                                     <Divider/>
145
                                     <Divider/>
146
                                     <FormGroup>
146
                                     <FormGroup>
147
                                         {
147
                                         {
148
-                                            tests ?
149
-                                            tests.data.map( test => (
148
+                                            testsCatalog ?
149
+                                            testsCatalog.data.map( test => (
150
                                                 <FormControlLabel 
150
                                                 <FormControlLabel 
151
                                                     key={test.id}
151
                                                     key={test.id}
152
                                                     control={
152
                                                     control={

+ 72 - 5
src/Components/Modal/EditPlaza.js

6
 
6
 
7
 import DateFnsUtils from '@date-io/date-fns';
7
 import DateFnsUtils from '@date-io/date-fns';
8
 import { DesktopDatePicker, LocalizationProvider } from '@mui/lab';
8
 import { DesktopDatePicker, LocalizationProvider } from '@mui/lab';
9
+import { TabPanel } from './TabPanel'
9
 
10
 
10
 import {
11
 import {
11
     Button, Stack, TextField, MenuItem, FormControl, InputLabel, Select,
12
     Button, Stack, TextField, MenuItem, FormControl, InputLabel, Select,
12
-    Backdrop, CircularProgress
13
+    Backdrop, CircularProgress,
14
+    Tabs,Tab,Box, Divider,FormGroup,FormControlLabel,Checkbox
13
 } from '@mui/material';
15
 } from '@mui/material';
14
 
16
 
15
 import { Service } from '../../Utils/HTTP';
17
 import { Service } from '../../Utils/HTTP';
26
     aredepto: Yup.number().required('Escoge alguna área'),
28
     aredepto: Yup.number().required('Escoge alguna área'),
27
     fecha: Yup.date("Ingresa una fecha válida"),
29
     fecha: Yup.date("Ingresa una fecha válida"),
28
     notas: Yup.string("Ingresa una nota válida").min(5).max(150),
30
     notas: Yup.string("Ingresa una nota válida").min(5).max(150),
31
+    pruebas: Yup.array()
29
 })
32
 })
30
 
33
 
31
 
34
 
46
     }, []);
49
     }, []);
47
 
50
 
48
     const [date, setDate] = React.useState(now);
51
     const [date, setDate] = React.useState(now);
52
+    const [tab, setTab] = React.useState(0);
53
+    const [checklist, setChecklist] = React.useState([]);
54
+
55
+    const addPrueba = (check,id) => {
56
+        let { pruebas } = values
57
+        console.log(pruebas)
58
+        let temp ;
59
+        if(check){
60
+            temp = [...pruebas, {id}]
61
+        }else{
62
+            temp = pruebas.filter( test => test.id !== id);
63
+        }
64
+        setChecklist(temp.map( test => test.id) )
65
+        setValues({...values, pruebas: temp})
66
+    };
49
 
67
 
50
     const getCategories = async () => {
68
     const getCategories = async () => {
51
         let rest = new Service("/categoria/getAll")
69
         let rest = new Service("/categoria/getAll")
56
         let rest = new Service('/plaza/edit');
74
         let rest = new Service('/plaza/edit');
57
         return rest.putQuery(fields, token)
75
         return rest.putQuery(fields, token)
58
     }
76
     }
77
+    
78
+    const getTest = async () => {
79
+        let rest = new Service("/tests/getAll")
80
+        return await rest.getQuery(token)
81
+    }
59
 
82
 
60
     const puestoMutation = useMutation(updatePuesto)
83
     const puestoMutation = useMutation(updatePuesto)
61
 
84
 
62
     const close = () => toggle("EDIT");
85
     const close = () => toggle("EDIT");
63
 
86
 
64
     const { data } = useQuery('categories', getCategories);
87
     const { data } = useQuery('categories', getCategories);
65
-
88
+    const { data: tests } = useQuery('tests', getTest);
66
 
89
 
67
     const formik = useFormik({
90
     const formik = useFormik({
68
         initialValues: {
91
         initialValues: {
71
             puestosuperior: 1,
94
             puestosuperior: 1,
72
             aredepto: 1,
95
             aredepto: 1,
73
             fecha: now,
96
             fecha: now,
74
-            notas: ""
97
+            notas: "",
98
+            pruebas : []
75
         },
99
         },
76
         onSubmit: (fields, { resetForm }) => {
100
         onSubmit: (fields, { resetForm }) => {
77
             setOpen(true);
101
             setOpen(true);
96
         validationSchema: NewPlazaSchema,
120
         validationSchema: NewPlazaSchema,
97
     });
121
     });
98
 
122
 
99
-    const { errors, touched, handleSubmit, getFieldProps, setValues } = formik;
123
+    const { errors, touched, handleSubmit, getFieldProps, setValues, values } = formik;
100
 
124
 
101
     useEffect(() => {
125
     useEffect(() => {
102
         console.log("PUESTO :: ", puesto)
126
         console.log("PUESTO :: ", puesto)
107
                 puestosuperior: puesto.puestosuperior,
131
                 puestosuperior: puesto.puestosuperior,
108
                 aredepto: puesto.areadeptoplz_id,
132
                 aredepto: puesto.areadeptoplz_id,
109
                 fecha: new Date(puesto.create_day),
133
                 fecha: new Date(puesto.create_day),
110
-                notas: puesto.notas
134
+                notas: puesto.notas,
135
+                pruebas : puesto.tests
111
             })
136
             })
137
+            setChecklist(puesto.tests.map(( {id} ) => id))
112
         }
138
         }
113
     }, [puesto, now, setValues])
139
     }, [puesto, now, setValues])
114
 
140
 
141
+    const changeTab = (_event, newValue) => {
142
+        setTab(newValue);
143
+    };
144
+
115
     return (
145
     return (
116
 
146
 
117
         <Modal size="lg" aria-labelledby="contained-modal-title-vcenter" centered show={visible} onHide={close}>
147
         <Modal size="lg" aria-labelledby="contained-modal-title-vcenter" centered show={visible} onHide={close}>
121
             </Modal.Header>
151
             </Modal.Header>
122
             <Modal.Body className="modal-body">
152
             <Modal.Body className="modal-body">
123
 
153
 
154
+                <Tabs value={tab} onChange={changeTab} aria-label="basic tabs example">
155
+                    <Tab label="Información" />
156
+                    <Tab label="Pruebas" />
157
+                </Tabs>
158
+
124
                 <FormikProvider style={{ padding: 25 }} value={formik}>
159
                 <FormikProvider style={{ padding: 25 }} value={formik}>
125
                     <Form autoComplete="off" noValidate onSubmit={handleSubmit}>
160
                     <Form autoComplete="off" noValidate onSubmit={handleSubmit}>
161
+
162
+
163
+                        <TabPanel value={tab} index={1}>
164
+                            <Stack spacing={1}>
165
+                                <Box style={{ paddingTop :5, paddingLeft :15 }}>
166
+                                    <Divider/>
167
+                                        <h4 style={{paddingTop :10, paddingBottom:10}}>Seleciona los test a realizar</h4>
168
+                                    <Divider/>
169
+                                    <FormGroup>
170
+                                        {
171
+                                            tests ?
172
+                                            tests.data.map( test => (
173
+                                                <FormControlLabel 
174
+                                                    key={test.id}
175
+                                                    control={
176
+                                                        <Checkbox 
177
+                                                            checked={checklist.includes((test.id))}
178
+                                                            onChange={(event)=> addPrueba(event.target.checked,test.id)}
179
+                                                        />
180
+                                                    } 
181
+                                                    label={test.nombre} 
182
+                                                    />
183
+                                            )): null
184
+                                        }
185
+                                    </FormGroup>
186
+                                </Box>
187
+                            </Stack>
188
+                        </TabPanel>
189
+
190
+
191
+                        <TabPanel value={tab} index={0} >
126
                         <Stack spacing={3}>
192
                         <Stack spacing={3}>
127
 
193
 
128
                             <Stack direction={{ xs: 'column', sm: 'row' }} spacing={2}>
194
                             <Stack direction={{ xs: 'column', sm: 'row' }} spacing={2}>
204
                                 />
270
                                 />
205
                             </Stack>
271
                             </Stack>
206
                         </Stack>
272
                         </Stack>
273
+                        </TabPanel>
207
 
274
 
208
 
275
 
209
                         <Modal.Footer>
276
                         <Modal.Footer>