import React, { Fragment, memo, useState, useEffect, } from 'react';
import { Row, Nav, Col, Modal } from "react-bootstrap";
import Botones from '../../components/UI/botonera/headerBotones.js';
import CajaTexto from '../../components/UI/cajaTexto/cajaTexto.jsx';

 const ModalCambiarContrasena = (props) => {
    return (
        <Fragment>
            <Modal size="lg" show={props.show} animation={false} onHide={() => { props.cerrarModal() }}>
                {/*<Modal.Header closeButton="false">
                    <Modal.Title>{props.titulo}</Modal.Title>
                </Modal.Header>*/}
                <Modal.Body>
                    <Row>
                        <Col>
                        <div className="col-md-12">
                        <div className='row'>
                            <div className="col-md-6">
                                <h1>{props.Titulo}</h1>
                            </div>
                            <div className="col-md-6 text-right">
                                <div className="acciones">
                                    <Botones
                                        botones={props.botones}
                                    />
                                </div>
                            </div>
                        </div>
                        <div className="content">
                            <div className="content-box box-primary">
                                <div className="row">
                                    <div className='row'>
                                        <CajaTexto col="6" id="Usuario" type="text" label={props.Datos.Usuario.attributes.label} value={props.Datos.Usuario.value} attributes={props.Datos.Usuario.attributes} onChangeInput={() => { }} />
                                        <CajaTexto col="6" id="Usuario_Login" type="text" label={props.Datos.Usuario_Login.attributes.label} value={props.Datos.Usuario_Login.value} attributes={props.Datos.Usuario_Login.attributes} onChangeInput={props.OnChangeText} />
                                    </div>
                                    <div className='row'>
                                        <CajaTexto col="6" id="Usuario_OldPassword" type="password" label={props.Datos.Usuario_OldPassword.attributes.label} value={props.Datos.Usuario_OldPassword.value} attributes={props.Datos.Usuario_OldPassword.attributes} onChangeInput={props.OnChangeText} />
                                        <CajaTexto col="6" id="Usuario_NewPassword" type="password" label={props.Datos.Usuario_NewPassword.attributes.label} value={props.Datos.Usuario_NewPassword.value} attributes={props.Datos.Usuario_NewPassword.attributes} onChangeInput={props.OnChangeText} />
                                    </div>
                                    <div className='row'>
                                        <CajaTexto col="6" id="Usuario_NewPassword2" type="password" label={props.Datos.Usuario_NewPassword2.attributes.label} value={props.Datos.Usuario_NewPassword2.value} attributes={props.Datos.Usuario_NewPassword2.attributes} onChangeInput={props.OnChangeText} />
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                        </Col>
                    </Row>
                </Modal.Body>
                {/* <Modal.Footer>
                    <Botones
                        botones={props.botones}
                    />
                </Modal.Footer>*/}
            </Modal>
        </Fragment>
    );
};
export default ModalCambiarContrasena;