{% extends 'base.html.twig' %}

{% block title %}TNC
{% endblock %}

{% block body %}
	{{ encore_entry_link_tags('cute-alert-css') }}
	{{ encore_entry_link_tags('default-view') }}
	{{ encore_entry_link_tags('simple-aggrid-table-css') }}

    <div class="no-max container-fluid box-no-bkg-color">
		<nav aria-label="breadcrumb" class="hide-on-mobile">
			<ol class="breadcrumb">
				<li aria-current="page" class="page-directory breadcrumb-item active">TNC</li>
			</ol>
		</nav>
        <div class="no-max box txt-center-mobile">
            <div class="title">
                <div class="row">
                    <div class="col-lg-6">
                        <h1 class="page-title" >TNC</h1>
                    </div>
                    <div class="col-lg-6 text-lg-right">
                        <a class="btn btn-tqm-outline mr-3" href="{{ path('tnc_dashboard') }}">
                            Acessar dashboard
                        </a>
                        <a class="btn btn-tqm" href="{{ path('tnc_new') }}">
                            <i class="fas fa-plus"></i>Nova Tratativa
                        </a>
                    </div>
                </div>
            </div>
            <div class="box-body px-4 py-4">
                <div class="tableContainer">
					<div class="headerTable">
						<div class="leftSideHeader">
							<input style="margin-left: 30px" id="selectAllAggridCheckbox" type="checkbox" />
							<div class="trashIcon" id="deleteAllSelected">
								<span class="c-pointer trashIcon ml-4 mt-2 font-blue fas fa-trash"></span>
							</div>
							<div class="trashIcon" id="printAllSelected">
								<span class="c-pointer trashIcon ml-4 mt-2 font-blue fas fa-print"></span>
							</div>
							<div class="" id="exportData">
								<span class="c-pointer trashIcon ml-4 mt-2 font-blue fas fa-file-export"></span>
							</div>
						</div>
						<div class="rightSideHeader">
							<p class="numberOfPages hide-on-mobile">
								Página <span id="currentPage"></span> de <span id="totalPage"></span>
							</p>
							<div class="leftArrowIcon hide-on-mobile">
								<span class="c-pointer trashIcon ml-4 mt-2 font-blue fas fa-chevron-left"></span>
							</div>
							<div class="rightArrowIcon hide-on-mobile">
								<span class="c-pointer trashIcon ml-4 mt-2 font-blue fas fa-chevron-right"></span>
							</div>
						</div>
					</div>
					<div style="height: 90%; max-width:100%;" class="ag-theme-material" id="aggridTableWrapper">

					</div>
                </div>
            </div>
        </div>
    </div>
	
	<script>
		var tableData = {{ tableData|json_encode|raw }};
	</script>
	{{ encore_entry_script_tags('simple-aggrid-table') }}
{% endblock %}