import React, { Fragment, memo } from 'react';
import Botones from '../../components/UI/botonera/headerBotones.js';
import FrmBotones from '../../components/UI/botonera/formBotones.jsx';
import TablaSaldos from '../../components/UI/tablaSaldos/tablaSaldos.jsx'
import Catalogo from '../../components/UI/arboles/arbolBusqueda.jsx'
import ListaDatos from '../../components/UI/listaDatosBusqueda/index.jsx'


export function catalogoCuentasInt(props) {
    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'>
                                <FrmBotones col="12" attributes={props.Datos.BotonesAE.attributes} botones={props.botonesLista} />
                            </div>
                            <div className='row'>
                                <Catalogo
                                    col={6}
                                    onSelectedRow={props.onRowSelectBusquedaTree}
                                    maxDepth={5}
                                    listatree={props.listCuentasCont}
                                />
                            </div>
                            <div className='row'>
                                <TablaSaldos
                                    col={12}
                                    eventLeft={props.eventoIzquierda}
                                    eventRight={props.eventoDerecha}
                                    DatoNav={props.DatosNav}
                                    id={props.id}
                                    datos={props.ListaDatoSaldo}
                                    columnasTabla={props.columnasTabla}
                                    selectRow={props.selectRowTabla}
                                    onDoubleClick={() => { }}
                                    borrando={false}
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>

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