{% extends "AppBundle::layout_backend.html.twig" %}

{% block headercontent %}
    <h3 class="cfj-bgcolor-three pageTitle cfj-color-white">
        Catálogo <i class="fa fa-angle-right"></i> Exportar
    </h3>
{% endblock %}    

{% block content %}
    
    <div class="box">
		<div class="box-body">
			<div class='box views'>

                <div class="row mt-4" style="display:flex; align-items: stretch;"> 
                    <div class="col-xs-12 col-md-3 ">
                        {% include 'AppBundle:Excel:export/spreadsheet_templates.html.twig' %}
                    </div>
                    <div class="col-xs-12 col-md-6">
                        {% include 'AppBundle:Excel:export/spreadsheet_template_columns.html.twig'%}
                    </div>
                    <div class="col-xs-12 col-md-3">
                        {% include 'AppBundle:Excel:export/filter.html.twig'%}
                    </div>
                </div>
                
                {# Exported files list #}
                <div class="row">
					<div class="showview p-2 m-1">

						<div id="exportedFilesTableContainer" class="table-container mb-2" role="table" aria-label="users">

                            <table id='exportedFilesTable' class='table table-hover table-responsive'>
                                <thead>
                                    <tr class='tr-top-table'>
                                        <th style="width: 30%;">Fecha de exportación</th>
                                        <th style="width: 30%;">Total de productos exportados</th>
                                        <th style="width: 30%;">Nombre de la plantilla</th>
                                        <th style="width: 10%;">Acciones</th>
                                    </tr>
                                </thead>

                                <tbody id='rows-container'>
                                </tbody>
                            </table>
                            <ul id="table-records-info" style="display:none;" class="pagination_description text-center">Se muestran los últimos 10 archivos exportados</ul>
						</div>
					</div>
				</div>

			</div>
		</div>
	</div>
{% endblock %}

{% block javascripts2nd %}
    
    <script type="text/javascript">
        const productsAttributes =  JSON.parse('{{ attributes | json_encode | raw }}');
    </script>

    {% javascripts 
        '@AppBundle/Resources/public/js/Export/Excel/base.js'
        '@AppBundle/Resources/public/js/Export/Excel/Product/index.js'
        '@AppBundle/Resources/public/js/Export/Excel/Product/html_blocks.js'
        '@AppBundle/Resources/public/js/Export/Excel/Product/spreadsheetTemplate.js'
        '@AppBundle/Resources/public/js/Export/Excel/Product/filterTemplate.js'
        
    %}
        <script src="{{ asset_url }}"></script>
    {% endjavascripts %}
{% endblock %}