{% extends 'layout.twig' %}

{% block body %}
	{% include '@Evaluation/Campaign/entete.twig' %}
			</div>
		</div>
		<div id="gestion-facture" class="tab-pane fade in active">
			<div class="padding_form border_form">
					<a class="supprimer_filtre button_right" style="display: none; margin: 10px 10px 0 0;" id="hide_filters" onclick="hideFilters();">
					</a>
					<a class="principal button button_right" id="show_filters" onclick="showFilters();">
						{{  'Filtres' | trad }}
					</a>
					<style>
						#hide_filters {
							position: absolute;
							right: 35px;
						}
					</style>

					<script>
						function showFilters() {
							$('#filtre_facture').show();
							$('#hide_filters').show();
							$('#show_filters').hide();
						}
						function hideFilters() {
							$('#filtre_facture').hide();
							$('#hide_filters').hide();
							$('#show_filters').show();
						}
					</script>
				{% include "@Evaluation/Campaign/Fournisseur/suppliers_filters.twig" %}
				<div id="suppliers" style="margin-top:50px;">
					<form method="post" name="filtre_choixFrs" id="filtre_choixFrs">
						<div id="buttonRegroup" style="display: none;">
                            <div style="margin-bottom: 10px; margin-top: 10px; font-weight: bold; width: 100%;position: relative;">
                                <span style="font-weight: bold; position:relative; top: 15px;">
                                    {{ 'Nombre de fournisseur(s) sélectionné(s)' | trad }}
                                    :
                                </span>
                                <span style="font-weight: bold; position:relative; top: 15px;" id="countSelected">{{ post.countSelected ?? 0 }}</span>
                                <button type="button" class="button principal" style="float: right; margin-right: 0;" onclick="addFrs('{{ path('Evaluation.Campaign.addSupplier',{id:campaign.ID_CAMP}) }}');">{{ 'Ajouter le(s) fournisseur(s)' | trad }}</button>
                            </div>
							<input type="hidden" id="input_countSelected" name="countSelected" value="{{ post.countSelected ?? 0 }}"/>
							<div id='listInputSelected'>
								{% for key, val in listeSelectInput %}
									<input type='hidden' name='{{ key }}' id='{{ key }}' value='{{ val }}'/>
								{% endfor %}
							</div>
						</div>
						<div id="divRefreshFrs" class="clearfix">
                            <div>
							<table class="table table-hover">
								<thead class="thead-dark">
									<tr>
										<th></th>
										<th scope="col" width="">{{ triTable('RS',  post.tri_RS, 'Raison sociale (Code)' | trad, '', 'divRefreshFrs', 'filtre_choixFrs') }}</th>
										<th scope="col" width="">{{ triTable('CPOSTAL',  post.tri_CPOSTAL, 'Code postal' | trad, '', 'divRefreshFrs', 'filtre_choixFrs') }}</th>
										<th scope="col" width="">{{ triTable('VILLE1',  post.tri_VILLE1, 'Ville' | trad, '', 'divRefreshFrs', 'filtre_choixFrs') }}</th>
										<th scope="col" width="">{{ triTable('ADR',  post.tri_ADR, 'Adresse' | trad, '', 'divRefreshFrs', 'filtre_choixFrs') }}</th>
										<th scope="col" width="">{{ 'Sous-famille' | trad }}</th>
										<th scope="col" width="">{{ 'Type' | trad }}</th>
									</tr>
								</thead>
								<tbody>
									<tr class="recherche">
                                        <td scope="col" class="align-center white-tooltip" width="4%">
                                            <input 
                                                name="selectAll" 
                                                type="checkbox" 
                                                id="input_selectAll" 
                                                data-checkall-input = "allSuppliers" 
                                                class="form-control checkbox">
                                        </td>
										<td>{{ filterTable('RS', post.filter_RS, '', 'divRefreshFrs', '','filtre_choixFrs', '','Désignation' | trad,'',true) }}</td>
										<td>{{ filterTable('CPOSTAL', post.filter_CPOSTAL, '', 'divRefreshFrs', '','filtre_choixFrs', '','Code postal' | trad,'',true) }}</td>
										<td>{{ filterTable('VILLE1', post.filter_VILLE1, '', 'divRefreshFrs', '','filtre_choixFrs', '','Ville' | trad,'',true) }}</td>
										<td>{{ filterTable('ADR', post.filter_ADR, '', 'divRefreshFrs', '','filtre_choixFrs', '','Adresse' | trad,'',true) }}</td>
                                        <td>{{ zoomFilter('listeSousFamille', post.filter_listeSousFamille, '', 'filtre_choixFrs', path('Ajax.liste.sousFamille'), 'Liste des sous-familles' | trad, '','', 'Sous-famille' | trad) }}</td>
										<td>{{ filterSelect('TYPE', post.filter_TYPE, supplierTypes, 'filtre_choixFrs', '', '', '', '') }}</td>
									</tr>
								</tbody>
								{% for frs in listeFrs %}
									<tr id="Frs{{ loop.index }}">
                                    <td>
                                        <input type="checkbox" 
                                        data-checkall = "allSuppliers" 
                                        class="form-control checkbox selected_frs" 
                                        data-id="{{ frs.CODE }}" 
                                        id="input_selected_frs_{{ frs.CODE }}" 
                                        name="selected_frs_{{ frs.CODE }}"/>
                                    </td>		
                                    {# <td>
                                        <input type="checkbox" 
                                            class="form-control checkbox selected_frs" 
                                            data-id="{{ frs.CODE }}" 
                                            id="input_selected_frs_{{ frs.CODE }}" 
                                            name="selected_frs_{{ frs.CODE }}"/>
                                    </td> #}
										<td>{{ frs.RS ~ ' (' ~ frs.CODE ~ ')' }}</td>
										<td>{{ frs.CPOSTAL }}</td>
										<td>{{ frs.VILLE1 }}</td>
										<td>{{ shortLibelle( frs.ADR, 50) }}</td>
										<td>{{ shortLibelle( frs.listeSousFamille , 50) }}</td>
										<td>{{ frs.TYPE }}</td>
									</tr>
								{% endfor %}
							</table>
							{{ paginations(path('Evaluation.Campaign.supplierList', {id:id}),infoPagination.nombreDePage, infoPagination.page, infoPagination.post, 'divRefreshFrs') }}
							<script type="text/javascript" src="{{ baseUrl('js/parametre.js') }}" id="parametreJS"></script>
							<script>
								function addFrs(path) {
									activeLoader();
									$.ajax({
										dataType: 'html',
										url: path,
										data: $('#filtre_choixFrs').serializeArray(),
										type: "POST",
										success: function (result) {
											redirectJSWithPost('{{ path('Evaluation.Campaign.detail',{id:id, tab:'fournisseur'}) }}');
											desactiveLoader();
										}
									});
								}

                                $('#input_selectAll').click(function () {
                                    var input       = $(this)[0];
                                    var count    = parseInt($('#input_countSelected').val());
                        
                                    if ($(input).is(':checked')) {
                                        // au clic sur l'input de sélection de tous les évaluateurs, on vérifie si certains évaluateurs étaient déjà présents dans la liste des évaluateurs sélectionnés
                                        // si déjà présents, aucun changement, sinon on les ajoute au compteur et à l'input hidden
                                        $('.selected_frs').each(function () {
                                            var supplierId = $($(this)[0]).data('id').toString().replace('.', '#point#');
                                            if (!$('#save_selected_frs_' + supplierId).val()) {
                                                count = count + 1;
                                                saveSupplier(supplierId);
                                            }
                                        });
                                    } else {
                                        // si on décoche l'input de sélection de tous les évaluateurs, on fait la démarche inverse 
                                        // on retire du compteur ceux qui étaient déjà comptés et on les supprime de l'input hidden
                                        $('.selected_frs').each(function () {
                                            var supplierId = $($(this)[0]).data('id').toString().replace('.', '#point#');
                                            if ($('#save_selected_frs_' + supplierId).val()) {
                                                count = count - 1;
                                                removeSupplier(supplierId);
                                            }
                                        });
                                    }
                                    
                                    setCount(count);
                                });

                                function setCount(count) {
                                    $('#countSelected').html(count);
                                    $('#input_countSelected').val(count);
                        
                                    if (count >= 1) {
                                        $('#buttonRegroup').show();
                                    } else {
                                        $('#buttonRegroup').hide();
                                    }    
                                }

                                function saveSupplier(supplierId) {
                                    $('#listInputSelected').append("<input type='hidden' name='save_selected_frs_" + supplierId + "' id='save_selected_frs_" + supplierId + "' value='" + supplierId + "'/>");
                                }
                        
                                function removeSupplier(supplierId) {
                                    $('#save_selected_frs_' + supplierId).remove();
                                }

								$(document).ready(function () {
									$('#listInputSelected input').each(function (index) {
										$('#input_' + $(this).attr('id').substring(5)).prop("checked", true);
									});
								});

								$('.selected_frs').click(function () {
									var input = $(this)[0];

									var oldCount = parseInt($('#input_countSelected').val());

									var idFrs = $($(this)[0]).data('id');
									if ($(input).is(':checked')) {
										var newCount = oldCount + 1;
										$('#listInputSelected').append("<input type='hidden' name='save_selected_frs_" + idFrs + "' id='save_selected_frs_" + idFrs + "' value='1'/>");
									} else {
										var newCount = oldCount - 1;
										$('#save_selected_frs_' + idFrs).remove();
									}

									$('#countSelected').html(newCount);
									$('#input_countSelected').val(newCount);

									if (newCount >= 1) {
										$('#buttonRegroup').show();
									} else {
										$('#buttonRegroup').hide();
									}
								});
							</script>
                            </div>
						</div>
					</form>
				</div>
			</div>
		</div>
	</div>
{% endblock %}
