import React, { Fragment, memo } from 'react';
import { withRouter } from 'react-router-dom';
//Componentes
import Botones from '../../components/UI/botonera/headerBotones.js';
import CajaTexto from '../../components/UI/cajaTexto/cajaTexto.jsx';


function cambiarContrasenaInt(props) {

    return (
        <Fragment>
            {/*} <div className="container">

                    <section className="pacientes">
                        <div className="row">
                            <div className="col-md-6">
                                <div className="form-group">
                                    <label>ID:</label>
                                    <input type="number" className="form-control" aria-describedby="ID" placeholder="" disabled="" value={Usuario_Id} readOnly={true} maxLength = {25} />
                                </div>
                            </div>
                            <div className="col-md-6">
                                <div className="form-group">
                                    <label>Login:</label>
                                    <input type="text" className="form-control" aria-describedby="login" placeholder="" disabled="" value={Usuario_Login} readOnly={true} maxLength = {30} />
                                </div>
                            </div>

                            <div className="col-md-6">
                                <div className="form-group">
                                    <label>Contraseña Actual:</label>
                                    <input name={'Usuario_OldPassword'} type="password" className="form-control" aria-describedby="constraseña" onChange={this.props.OnChangeText}  maxLength ={100} />
                                </div>
                            </div>
                            <div className="col-md-6">
                                <div className="form-group">
                                    <label>Contraseña Nueva:</label>
                                    <input name={'Usuario_NewPassword'} type="password" className="form-control" aria-describedby="constraseña" onChange={this.props.OnChangeText} maxLength = {100} />
                                </div>
                            </div>

                            <div className="col-md-6">
                                <div className="form-group">
                                    <label>Confirmar Contraseña:</label>
                                    <input name={'Usuario_NewPassword2'} type="password" className="form-control" aria-describedby="constraseña" onChange={this.props.OnChangeText} maxLength = {100}  />
                                </div>
                            </div>
                        </div>

                    </section>
       </div>*/}



            <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>
        </Fragment>
    )
}
export default withRouter(memo(cambiarContrasenaInt));