resume step

src/App.css

@@ -259,3 +259,8 @@
     padding-top : 25px !important;
 }
 
+.name_header{
+    max-width:20px;
+    background-color:whitesmoke;
+    font-weight:bold;
+}

src/Auth/AuthProvider.js

@@ -3,47 +3,46 @@ import Cookies from 'js-cookie'
 
 export const AuthContext = React.createContext(null);
 
-export function AuthProvider ({ children }){
+export function AuthProvider({ children }) {
 
-    let [user, setUser] = React.useState( Cookies.get('token') );
-    let [profile, setProfile] = React.useState({});
+    let [user, setUser] = React.useState(Cookies.get('token'));
 
     const context = {
         user,
         login: (token) => {
-            try{
-                Cookies.set('token', token, { expires : 7 })
+            try {
+                Cookies.set('token', token, { expires: 7 })
                 setUser(Cookies.get('token'))
-            }catch(e){
+            } catch (e) {
                 console.log('Login Error >> ', e)
                 Cookies.set('token', undefined)
             }
         },
-        logout : () => {
+        logout: () => {
             Cookies.set('token', undefined)
             setUser(undefined)
         },
-        getToken : () => Cookies.get('token'),
-        isLogged : () => {
-            try{
+        getToken: () => Cookies.get('token'),
+        isLogged: () => {
+            try {
                 let CookiesUser = Cookies.get('token')
-                if(!CookiesUser || CookiesUser === 'undefined'){
+                if (!CookiesUser || CookiesUser === 'undefined') {
                     return false
                 }
                 // TODO   
                 // add an method implmentation for 
                 // check if cockie jwt is valid
-                let logged = CookiesUser.length > 5 
+                let logged = CookiesUser.length > 5
                 console.log("is login? >>", logged)
                 return logged
 
-            }catch(e){
+            } catch (e) {
                 console.log("Error checking user ", e)
                 return false
             }
         },
-        setProfile :(obj) => setProfile(obj),
-        getProfile: () => profile
+        setProfile: (obj) => Cookies.set('profile', JSON.stringify(obj) ),
+        getProfile: () => JSON.parse( Cookies.get('profile') )
     }
 
     return (

src/Components/Modal/PasswordModal.jsx

@@ -21,15 +21,15 @@ export function HelpModal(props) {
 
     const [password, setPassword] = React.useState({
         puesto: [],
-        pwd: "",
+        pwd: "xxxxxxxxxxx",
         deadpwd: now.current,
         dateToActived: now.current,
-        nombres:"",
-        apellidos:"",
-        mail:"",
+        nombres:"xxxxxxxxxx",
+        apellidos:"xxxxxxxxx",
+        mail:"xxx@gmail.com",
         sendmail:true,
-        nombrepuesto:"",
-        nombreEmpresa:"",
+        nombrepuesto:null,
+        nombreEmpresa:null,
     });
 
     const isStepSkipped = (step) => {
@@ -144,7 +144,7 @@ export function HelpModal(props) {
                     ) : (
                         <React.Fragment>
 
-                            <Box style={{ padding: 25, marginTop: 25 }}>
+                            <Box style={{ padding: 18, marginTop: 10 }}>
                                 {steps[activeStep].operation}
                             </Box>
 

src/Components/Password/Steps/candidato.jsx

@@ -7,9 +7,13 @@ import {
     Stack, TextField, FormGroup,
 } from '@mui/material';
 
+import useAuth from '../../../Auth/useAuth';
+
 
 export function Candidato(props) {
 
+    const auth = useAuth();
+
     const CandidatoSchema = Yup.object().shape({
         nombres:
             Yup.string()
@@ -43,8 +47,8 @@ export function Candidato(props) {
             apellidos: password.apellidos,
             sendmail: password.sendmail,
             mail : password.mail,
-            nombrepuesto: password.nombrepuesto,
-            nombreEmpresa: password.nombreEmpresa,
+            nombrepuesto: password.nombrepuesto ? password.nombrepuesto: password.puesto[0].nombrepuesto,
+            nombreEmpresa: password.nombreEmpresa ? password.nombreEmpresa : auth.getProfile().nombre,
         },
         onSubmit: (fields) => {
             setPassword({ ...password, ...fields })

src/Components/Password/Steps/puesto.js

@@ -50,7 +50,6 @@ export function Puesto(props) {
             puesto: password.puesto
         },
         onSubmit: (fields) => {
-            console.log(fields)
             setPassword({
                 ...password,
                 puesto : fields.puesto
@@ -67,6 +66,7 @@ export function Puesto(props) {
             <Form autoComplete="off" noValidate onSubmit={handleSubmit}>
                 <Stack spacing={2}>
                     <Autocomplete
+                        disableCloseOnSelect={false}
                         {...getFieldProps('puesto')}
                         onChange={(_a,current_list,_c,_individual,_f) => {
                             setValues({
@@ -77,7 +77,6 @@ export function Puesto(props) {
                         multiple
                         id="checkboxes-tags-demo"
                         options={puestos}
-                        disableCloseOnSelect
                         getOptionLabel={(option) => { 
                             return option.nombrepuesto 
                         }}

src/Components/Password/Steps/resume.jsx

@@ -1,104 +1,66 @@
 import * as React from 'react';
-import Table from '@mui/material/Table';
-import TableBody from '@mui/material/TableBody';
-import TableCell from '@mui/material/TableCell';
-import TableContainer from '@mui/material/TableContainer';
-import TableHead from '@mui/material/TableHead';
-import TableRow from '@mui/material/TableRow';
-import Paper from '@mui/material/Paper';
-import {
-    Typography, Divider, Box, Button
-} from '@mui/material';
+import { Table } from 'react-bootstrap';
 
-const TAX_RATE = 0.07;
-
-function ccyFormat(num) {
-    return `${num.toFixed(2)}`;
-}
-
-function priceRow(qty, unit) {
-    return qty * unit;
-}
-
-function createRow(desc, qty, unit) {
-    const price = priceRow(qty, unit);
-    return { desc, qty, unit, price };
-}
-
-function subtotal(items) {
-    return items.map(({ price }) => price).reduce((sum, i) => sum + i, 0);
-}
-
-const rows = [
-    createRow('Paperclips (Box)', 100, 1.15),
-    createRow('Paper (Case)', 10, 45.99),
-    createRow('Waste Basket', 2, 17.99),
-];
-
-const invoiceSubtotal = subtotal(rows);
-const invoiceTaxes = TAX_RATE * invoiceSubtotal;
-const invoiceTotal = invoiceTaxes + invoiceSubtotal;
+import { Box, Button } from '@mui/material';
 
 export function Resume(props) {
-    let {handleBack, password } = props
-    console.log("FINAL::", password)
 
-    return (
-        <React.Fragment>
-            <Typography  variant="h6">
-                Resumen:
-            </Typography>
-            <Divider sx={{paddingTop : 1}}/>
-            <TableContainer component={Paper}>
-                <Table sx={{ minWidth: 700 }} aria-label="spanning table">
-                    <TableBody>
-                        {rows.map((row) => (
-                            <TableRow key={row.desc}>
-                                <TableCell>{row.desc}</TableCell>
-                                <TableCell align="right">{row.qty}</TableCell>
-                                <TableCell align="right">{row.unit}</TableCell>
-                                <TableCell align="right">{ccyFormat(row.price)}</TableCell>
-                            </TableRow>
-                        ))}
+    let {handleBack, password: key } = props
+    const fmt = React.useRef({ weekday: 'long', year: 'numeric', month: 'short', day: 'numeric' })
 
-                        <TableRow>
-                            <TableCell rowSpan={3} />
-                            <TableCell colSpan={2}>Subtotal</TableCell>
-                            <TableCell align="right">{ccyFormat(invoiceSubtotal)}</TableCell>
-                        </TableRow>
-                        <TableRow>
-                            <TableCell>Tax</TableCell>
-                            <TableCell align="right">{`${(TAX_RATE * 100).toFixed(0)} %`}</TableCell>
-                            <TableCell align="right">{ccyFormat(invoiceTaxes)}</TableCell>
-                        </TableRow>
-                        <TableRow>
-                            <TableCell colSpan={2}>Total</TableCell>
-                            <TableCell align="right">{ccyFormat(invoiceTotal)}</TableCell>
-                        </TableRow>
-                    </TableBody>
-                </Table>
-            </TableContainer>
+    return(
+        <React.Fragment>
+            <Table>
+                <thead>
+                    <tr>
+                        <th>{key.pwd}</th>
+                        <th></th>
+                    </tr>
+                </thead>
+                <tbody>
+                    <tr>
+                        <td>{"Candidato"}</td>
+                        <td colSpan={2}>{key.nombres + " " + key.apellidos} - {key.mail}</td>
+                    </tr>
+                    <tr>
+                        <td>{"Puesto"}</td>
+                        <td colSpan={2}>{key.puesto[0].nombrepuesto}</td>
+                    </tr>
+                    <tr>
+                        <td>{"Empresa"}</td>
+                        <td colSpan={2}>{key.nombreEmpresa}</td>
+                    </tr>
+                    <tr>
+                        <td>{"Fecha Activación"}</td>
+                        <td colSpan={2}>{new Date( key.dateToActived ).toLocaleDateString('es-GT',fmt.current )}</td>
+                    </tr>
+                    <tr>
+                        <td>{"Fecha de Vencimiento"}</td>
+                        <td colSpan={2}>{new Date( key.deadpwd ).toLocaleDateString('es-GT',fmt.current )}</td>
+                    </tr>
+                </tbody>
+            </Table>
 
-                    <Box sx={{ mb: 2 }}>
-                        <div style={{ paddingTop: 15 }}>
-                            <Button
-                                type="submit"
-                                className="registerBtn"
-                                variant="contained"
-                                sx={{ mt: 1, mr: 1 }}
-                            >
-                                {'Guardar'}
-                            </Button>
-                            <Button
-                                disabled={false}
-                                onClick={handleBack}
-                                sx={{ mt: 1, mr: 1 }}
-                            >
-                                Regresar
-                            </Button>
-                        </div>
-                    </Box>
 
+            <Box sx={{ mb: 2 }}>
+                <div style={{ paddingTop: 15 }}>
+                    <Button
+                        type="submit"
+                        className="registerBtn"
+                        variant="contained"
+                        sx={{ mt: 1, mr: 1 }}
+                    >
+                        {'Guardar'}
+                    </Button>
+                    <Button
+                        disabled={false}
+                        onClick={handleBack}
+                        sx={{ mt: 1, mr: 1 }}
+                    >
+                        Regresar
+                    </Button>
+                </div>
+            </Box>
         </React.Fragment>
-    );
+    )
 }