import React, { Fragment, memo, useState } from 'react';
//Componentes
import Botones from '../../../components/UI/botonera/headerBotones.js';
import CajaTexto from '../../../components/UI/cajaTexto/cajaTexto.jsx';
import ComboBox from '../../../components/UI/comboBox/combobox.jsx';
import ComboBoxMulti from '../../../components/UI/comboBox/comboboxmulti.jsx';
import DatePicker from '../../../components/UI/dataPicker/dataPicker.jsx';
import MonthYearPicker from '../../../components/UI/dataPicker/monthYearPicker.jsx'
import Config from "../../../components/Util/constantes.js";
export function mantCatalogoCuentasInt(props) {
    const [fecMesAno, setFecMesAno]  = useState(new Date(2022,4,15));
    const [fecha, setFecha]  = useState(new Date(2022,5,22));

    return (
        <Fragment>
            <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'>
                                <ComboBox id="cmbTipo" col="6" attributes={props.Datos.Tipo.attributes} value={props.selectedOptionTipo} label={props.Datos.Tipo.attributes.label} datos={props.listaSubCuentas} onChange={props.onhandleSelectedTipo} />
                                <CajaTexto col="6" id="Cuenta" type="text" label={props.Datos.Cuenta.attributes.label} value={props.Datos.Cuenta.value} attributes={props.Datos.Cuenta.attributes} onChangeInput={props.onChangeInput} />

                            </div>
                            <div className='row'>
                                <CajaTexto col="6" id="Nombre" type="text" label={props.Datos.Nombre.attributes.label} value={props.Datos.Nombre.value} attributes={props.Datos.Nombre.attributes} onChangeInput={props.onChangeInput} />
                                <CajaTexto col="6" id="CuentaSAP" type="text" label={props.Datos.CuentaSAP.attributes.label} value={props.Datos.CuentaSAP.value} attributes={props.Datos.CuentaSAP.attributes} onChangeInput={props.onChangeInput} />
                            </div>
                            <div className='row'>
                                <ComboBoxMulti id="selectedEmpresas" col="6" attributes={props.Datos.Empresas.attributes} value={props.selectedEmpresas} label={props.Datos.Empresas.attributes.label} datos={props.listaEmpresas} onChange={props.onhandleSelectEmpresas} placeholder={"Seleccione"} />
                            </div>

                        </div>
                    </div>
                </div>
            </div>

        </Fragment>
    );
};
export default memo(mantCatalogoCuentasInt);