<section id="table-choix-facture">
    {% set listSelectionFac = (post.listSelectionFac ?? [])%}
    {% for selection in listSelectionFac %}
    <input type="hidden" name="listSelectionFac[]" value="{{ selection | e('html_attr') }}">
    {% endfor %}

    <table class="table">
        <thead class="thead-dark">
            <tr>
                <th scope="col" width="5%">{{ 'N° Enreg.' | trad }}</th>                                    
                <th scope="col">{{ 'Réf. Frs' | trad }}</th>                                    
                <th scope="col">{{ 'Enreg. le' | trad }}</th>                                    
                <th scope="col">{{ 'Emise le' | trad }}</th>                                    
                <th scope="col" width="13%">{{ 'Total HT' | trad }}</th>                      
                <th scope="col" width="13%">{{ 'Total TTC' | trad }}</th>                                    
                <th scope="col" width="1%" class="white-tooltip">
                    <span class="infos_tooltip left">
                        {{ 'Tout sélectionner' | trad }}
                    </span>
                    <input type="checkbox" class="form-control checkbox"
                        data-checkall-input="choixFacture"
                    />
                </th>                           
                <th width="1%">{# Action #}</th>                             
            </tr>
        </thead>
        <tbody>
            <tr class="recherche">
                <td>{{ filterTable('NUM_FACT', post.filter_NUM_FACT, '', '', '', 'form-main', '', 'N° Enreg.' | trad) }}</td>
                <td>{{ filterTable('FACT_FOU', post.filter_FACT_FOU, '', '', '', 'form-main', '', 'Réf. Frs' | trad) }}</td>
                <td>{{ filterTable('date_DATE_ENR', post.filter_date_DATE_ENR, '', '', '','form-main', 'datepicker', 'Enreg. le' | trad) }}</td>
                <td>{{ filterTable('date_DATE_FAFO', post.filter_date_DATE_FAFO, '', '', '','form-main', 'datepicker', 'Emise le' | trad) }}</td>
                <td>{{ filterTable('montant_TOTAL_HT', post.filter_montant_TOTAL_HT, '', '', '', 'form-main', '', 'Total HT' | trad) }}</td>
                <td>{{ filterTable('montant_TOTAL_TTC', post.filter_montant_TOTAL_TTC, '', '', '', 'form-main', '', 'Total TTC' | trad) }}</td>
                <td>{# Selection #}</td>
                <td>{# Action #}</td>
            </tr>
            {% for fact in listFacture %}
            <tr id="facture{{ fact.NUM_FACT }}">
                <td class="toggleSlide" onclick="toggleSlide('{{ path(
                        'Facture.ajax.ligneFacture',
                        {numFact: fact.NUM_FACT}
                    ) }}' , 'facture{{ fact.NUM_FACT }}detail', {id : {{ fact.NUM_FACT }} } );"
                >{{ fact.NUM_FACT }}</td>
                <td>{{ fact.FACT_FOU }}</td>
                <td>{{ fact.DATE_ENR | dateTrad }}</td>
                <td>{{ fact.DATE_FAFO | dateTrad }}</td>
                <td class="montant">{{ fact.TOTAL_HT | prix }} {{ fact.DEVISE }}</td>
                <td class="montant">{{ fact.TOTAL_TTC | prix }} {{ fact.DEVISE }}</td>
                <td>
                    <input type="checkbox" 
                        name="listSelectionFac[]" 
                        value="{{ fact.NUM_FACT }}" 
                        class="form-control checkbox"
                        data-checkall="choixFacture"
                        {{ fact.NUM_FACT in listSelectionFac ? 'checked' }}
                    />
                </td>
                <td>
                    <div class="parametrage">
                        {{ menuContextuel('facture'~fact.NUM_FACT, false, fact.menuContextuel, 6) }}
                    </div>
                </td>
            </tr>
            <tr class="detail_ligne hide_detail" id="facture{{ fact.NUM_FACT }}detail" ></tr>
            {% endfor %}
        </tbody>
    </table>
    {# TODO : factorize pagination #}
    {# Note : due to listSelectionFac we used a custom pagination #}
    <nav aria-label="Page navigation">
        <ul class="pagination" id="pagination"></ul>
    </nav>
    <script>
        ajaxPagination("#pagination", "#table-choix-facture", {
            pageCount: {{ infoPagination.nombreDePage }},
            page: {{ infoPagination.page }},
            path: {{ path('Facture.CreationFacture.tableChoixFacture', ctx) | json }},
            postKey: 'page',
        }, function() {
            return new FormData(document.getElementById('form-main'));
        });
    </script>
</section>