{% extends 'partial/admin/base.html.twig' %}

{% block title %}Administration{% endblock %}

{% block sidebar %}
    {% include 'partial/admin/sidebar.html.twig' %}
{% endblock %}

{% block navbar %}
    {% include 'partial/admin/navbar.html.twig' %}
{% endblock %}

{% block body %}
    {% include 'admin/zone/zone.html.twig' %}
{% endblock %}

{% block footer %}
    {% include 'partial/admin/footer.html.twig' %}
{% endblock %}

{% block javascripts %}
   
	<!-- Bootstrap JS -->
	<script src={{asset("assets/js/bootstrap.bundle.min.js")}}></script>
	<!--plugins-->
	<script src={{asset("assets/js/jquery.min.js")}}></script>
	<script src={{asset("assets/plugins/simplebar/js/simplebar.min.js")}}></script>
	<script src={{asset("assets/plugins/metismenu/js/metisMenu.min.js")}}></script>
	<script src={{asset("assets/plugins/perfect-scrollbar/js/perfect-scrollbar.js")}}></script>
	<script src={{asset("assets/plugins/datatable/js/jquery.dataTables.min.js")}}></script>
	<script src={{asset("assets/plugins/datatable/js/dataTables.bootstrap5.min.js")}}></script>
	<script>
		$(document).ready(function() {
			$('#example').DataTable();
		  } );
	</script>
<script>
		$(document).ready(function() {
			var table = $('#example2').DataTable({
				lengthChange: false,
				buttons: [
					{
						extend: 'copy',
						exportOptions: {
							columns: ':not(.noExport)'  // Exclut les colonnes avec la classe `noExport`
						}
					},
					{
						extend: 'excel',
						exportOptions: {
							columns: ':not(.noExport)'
						}
					},
					{
						extend: 'pdf',
						exportOptions: {
							columns: ':not(.noExport)'
						}
					},
					{
						extend: 'print',
						exportOptions: {
							columns: ':not(.noExport)'
						}
					}
				]
			});

			table.buttons().container().appendTo('#example2_wrapper .col-md-6:eq(0)');
		});
	</script>

	<script src={{asset("assets/plugins/select2/js/select2.min.js")}}></script>
	<script>
		$('.single-select').select2({
			theme: 'bootstrap4',
			width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
			placeholder: $(this).data('placeholder'),
			allowClear: Boolean($(this).data('allow-clear')),
		});
		$('.multiple-select').select2({
			theme: 'bootstrap4',
			width: $(this).data('width') ? $(this).data('width') : $(this).hasClass('w-100') ? '100%' : 'style',
			placeholder: $(this).data('placeholder'),
			allowClear: Boolean($(this).data('allow-clear')),
		});
	</script>

	<!--app JS-->
<script src={{asset("assets/js/app.js")}}></script>

{% endblock %}