import React, { Fragment } from 'react';
import Modal from 'react-modal';
import Botones from '../botonera/headerBotones.js';
import MonthYearPicker from '../dataPicker/monthYearPicker.jsx';
import CheckBox from '../checkBox/checkBox.jsx';

class modalAsientosCierre extends React.Component {
    constructor(props) {
        super(props);
    }

    render() {
        const { selectedModal, label, selectRow, rowStyle, cellEdit, botones, contentLabel } = this.props;
        const customStyles = {
            content: {
                position: 'fixed', position: 'absolute', top: '35%', left: '25%', right: '25%', bottom: '25%', with: '50%', height: '24.5rem', padding: '5px'              
            },
            overlay: {
                backgroundColor: 'rgba(0, 0, 0, 0.75)',
            },
        };
        return (
            <Modal isOpen={selectedModal} contentLabel={contentLabel} style={customStyles} ariaHideApp={false}>
                <div className="modal-header">
                    <button type="button" className="close" data-dismiss="modal" aria-label="Close" onClick={this.props.cerrarModal}>
                        <span aria-hidden="true">&times;</span>
                    </button>
                    <h2 className="modal-title" id="exampleModalLabel">{label}</h2>
                </div>
                <div className="modal-body">
                    <div className='row mb-5'>
                        <MonthYearPicker id="fecMesAno" col="6" pvalue={this.props.Datos.fecMesAno.value} attributes={this.props.Datos.fecMesAno.attributes} label={this.props.Datos.fecMesAno.attributes.label} handleChange={this.props.onhandleChangeDate} />
                        <CheckBox id='ImprimirLogo' col="6" attributes={this.props.Datos.ImprimirLogo.attributes} value={this.props.Datos.ImprimirLogo.value} label={this.props.Datos.ImprimirLogo.attributes.label} onChange={this.props.handleCheckBox} />
                    </div>
                </div>
                <div className="modal-footer">
                    <button type="button" className="btn btnSecondaryStyle" data-dismiss="modal" onClick={this.props.cerrarModal}>Cerrar</button>
                    <button type="button" className="btn btn-primary" onClick={this.props.handleAceptar}>Aceptar</button>
                </div>
            </Modal>
        )



    }
}
export default modalAsientosCierre;