import * as React from 'react';
import { Table } from 'react-bootstrap';

import { Box, Button } from '@mui/material';

export function Resume(props) {

    let {handleBack, password: key } = props
    const fmt = React.useRef({ weekday: 'long', year: 'numeric', month: 'short', day: 'numeric' })

    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>
        </React.Fragment>
    )
}