import React, { Fragment, memo } from 'react';
import Botones from '../../components/UI/botonera/headerBotones.js';
import FrmBotones from '../../components/UI/botonera/formBotones.jsx';
import Catalogo from '../../components/UI/arboles/arbolBusqueda.jsx'
import ListaDatos from '../../components/UI/listaDatosBusqueda/index.jsx'
export function catalogoCentroCostoInt(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={7}
                                    onSelectedRow={props.onRowSelectBusquedaTree}
                                    maxDepth={5}
                                    listatree={props.listCentroCosto}
                                    label={"Centro de Costos"}
                                />
                            </div>
                        </div>
                    </div>
                </div>
            </div>

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