{% block body %}
        <div style="display: flex; justify-content: space-between; align-items: center; flex-direction: row-reverse;">
            {% if tab == 'lines' %}
                <div style="display: flex; align-items: center; justify-content: center; gap: 1em; margin-right: 0.5em;cursor: pointer;">
                    <span style="font-size: var(--fs-base); padding-bottom: 0.2px">
                        {{ 'Détail de toutes les lignes' |trad }}
                    </span>
                    <input type="checkbox" class="checkbox" style="margin-top: -1px;" id="showAllDetailLigne"/>
                </div>
            {% endif %}
            
        </div>

	<div id="refreshTab" style="padding-top: 5px;">
        {# <div style="display: flex; justify-content: space-between; flex-direction: row-reverse">
        {% if tab == 'lines' %}
            <div style="display: flex; align-items: center; gap: 1em; margin-right: 0.5em;cursor: pointer;">
                <span style="font-size: var(--fs-base);">
                    {{ 'Détail de toutes les lignes' |trad }}
                </span>
                <input type="checkbox" class="checkbox" style="margin-top: -1px;" id="showAllDetailLigne"/>
            </div>
        {% endif %}
        </div> #}
		<table id="order_lines" class="table table-hover">
			<thead class="thead-dark">
				<tr>
                    <th scope="col" class="align-center white-tooltip" width="4%">
                        <input 
                            name="returnAll" 
                            type="checkbox" 
                            id="input_returnAll" 
                            data-checkall-input = "allLines" 
                            class="form-control checkbox">
                    </th>
					<th scope="col" width="4%">{{ 'N° de poste cde' | trad }}</th>
					<th scope="col" width="4%">{{ 'N° de poste rcpt' | trad }}</th>
					<th scope="col" width="9%">{{ 'Code article' | trad }}</th>
					<th scope="col" width="15%">{{ 'Désignation article' | trad }}</th>
					<th scope="col" width="4%">{{ 'Unité' | trad }}</th>
					<th scope="col" width="4%">{{ 'Mnt' | trad ~ ' ?' }}</th>
					<th scope="col" width="7%">{{ 'Qté reçue' | trad }}</th>
					<th scope="col" width="7%">{{ 'Qté comptée' | trad }}</th>
					<th scope="col" width="7%">{{ 'Qté acceptée' | trad }}</th>
					<th scope="col" width="7%">{{ 'Montant reçu' | trad }}</th>
					<th scope="col" width="7%">{{ 'Quantité retournée' | trad }}</th>
					<th scope="col" width="7%">{{ 'Montant retourné' | trad }}</th>
					<th scope="col" width="7%">{{ 'Déjà retourné' | trad }}</th>
				</tr>
			</thead>
			<tbody>
				{% for line in lines %}
					<tr id="line{{ line.no_ligne_br }}" class="align-center">
                        <td>
                            <input type="checkbox" 
                            data-checkall = "allLines" 
                            class="form-control checkbox selection_box" 
                            data-id="{{ line.no_ligne_br }}" 
                            id="input_IS_ANNULE-{{ line.no_ligne_br }}" 
                            {% if line.IS_ANNULE != 0 %} checked {% endif %} 
                            name="IS_ANNULE-{{ line.no_ligne_br }}"/>
                        </td>
						<td>{{ line.no_ligne_cde }}</td>
						<td>{{ line.no_ligne_br }}</td>
						<td class="loupe">{{ line.code_art }}</td>
						<td class="align-left">{{ shortLibelle(line.design_sommaire, 45) }}</td>
						<td>{{ line.UNIT_LABEL ~ ' (' ~ line.unite ~ ')' }}</td>
						<td>
							<input type="checkbox" class="form-control checkbox montant_box" name="en_mnt_{{ line.no_ligne_br }}" id="input_EN_MNT-{{ line.no_ligne_br }}" {% if line.TYPE_RECEPT_POSSIBLE == 'M' %} checked {% endif %} disabled onclick="changeInput({{ line.no_ligne_br }}, 'EN_MNT');">
						</td>
						<td>
							{{ inputAdvance('TEXT', {
                                'name'        : 'qte_r' ~ '-' ~ line.no_ligne_br,
                                'value'       : qteByUnite(line.qte_r, line.unite),
                                'option'      : 'disabled',
                                'numerique'   : true,
							}) }}
						</td>
						<td>
							{{ inputAdvance('TEXT', {
								'name'      : 'qte_c' ~ '-' ~ line.no_ligne_br,
								'value'     : qteByUnite(line.qte_c, line.unite),
                                'option'    : 'disabled',
                                'numerique' : true,
							}) }}
						</td>
						<td>
							{{ inputAdvance('TEXT', {
								'name'      : 'qte_a' ~ '-' ~ line.no_ligne_br,
								'value'     : qteByUnite(line.qte_a, line.unite),
                                'option'    : 'disabled',
                                'numerique' : true,
							}) }}
						</td>
						<td>
							{{ inputAdvance('TEXT', {
								'name'              	: 'MNT_REC' ~ '-' ~ line.no_ligne_br,
								'value'             	: line.EN_MNT | boolSql == false ? (line.qte_a * line.PU_REMISE) | tva ~ ' ' ~ line.COD_DEV : line.MNT_REC | tva ~ ' ' ~ line.COD_DEV,
                                'option'                : 'disabled',
                                'numerique'             : true,
							}) }}
						</td>
						<td align="center">
							{{ inputAdvance('TEXT', {
								'name'              	: 'QTE_ANNULE' ~ '-' ~ line.no_ligne_br,
								'value'             	: qteByUnite((line.QTE_ANNULE ?? line.qte_a), line.unite),
								'pathValidator'         : path('Reception.ValidatorCreation.saisie'),                            
								'paramsValidator'       : "{'section' : 'ligne', 'line' : '" ~ line.no_ligne_br ~ "', 'field' : 'QTE_ANNULE'}",
								'myFuncValidator' 		: 'updateValueLine',
								'paramFuncValidator'	: '["QTE_ANNULE' ~ '-' ~ line.no_ligne_br ~ '", false]',
								'addStyle'				: (line.EN_MNT | boolSql or line.IS_ANNULE != 1) ? 'display: none;',
                                'numerique'             : true,
							}) }}
						</td>
						<td align="center">
							{{ inputAdvance('TEXT', {
								'name'              	: 'MNT_RET' ~ '-' ~ line.no_ligne_br,
								'value'             	: (line.MNT_RET ?? line.MNT_REC)|tva,
								'pathValidator'         : path('Reception.ValidatorCreation.saisie'),                            
								'paramsValidator'       : "{'section' : 'ligne', 'line' : '" ~ line.no_ligne_br ~ "', 'field' : 'MNT_RET'}",
								'myFuncValidator' 		: 'updateValueLine',
								'paramFuncValidator'	: '["MNT_RET' ~ '-' ~ line.no_ligne_br ~ '", false]',
								'addStyle'				: (line.EN_MNT | boolSql == false or line.IS_ANNULE != 1) ? 'display: none;',
                                'numerique'             : true,
							}) }}
						</td>
						<td align="right">
                            {% if line.QTE_DEJA_ANNULE > 0 %}
                                {{ qteByUnite(line.QTE_DEJA_ANNULE, line.unite) }}
                                {% if droits.HA_BR_PX %}
                                    {{ ' (' ~ (line.QTE_DEJA_ANNULE * line.PU_REMISE) | tva ~ ' ' ~ (line.COD_DEV) ~ ')'}}
                                {% endif %}
								<a class="visualiser_v2" style="opacity: 0.6;" onclick="ajaxPopupV2('{{ path('Reception.GestionBR.viewPreviousReturnVouchers', {br: initialBr.NUM_BR ?? initialBr.NUM_BR_ANNULE }) }}');">
                                    <span class="infos_tooltip top-left">
                                        {{ 'Afficher les bons de retour précédents' | trad }}
                                    </span>                                
                                </a>
                            {% endif %}
                            
						</td>
					</tr>
					<tr id="line{{ line.no_ligne_br }}detail" class="detail_ligne hide_detail">
						<td colspan="14">
                            <div class="full">
								<div class="informations">
									<p>
										<span class="champs_label">{{ 'Désignation comp.'| trad }}</span>
										<span class="resultat">
                                            {{ line.design_comp }}
										</span>
									</p>
								</div>
							</div>
							<div class="colonne2">
								<div class="informations">
									<p>
										<span class="champs_label">{{ 'Montant déjà réceptionné' | trad }}</span>
										<span class="resultat">
											{% if droits.HA_BR_PX %}
                                                {% if line.EN_MNT | boolSql == false %}
                                                    {{ (line.qte_a * line.PU_REMISE)|tva ~ ' ' ~ line.COD_DEV }}
                                                {% else %}
                                                    {{ line.MNT_REC|tva ~ ' ' ~ line.COD_DEV }}
                                                {% endif %}
                                                
											{% endif %}
										</span>
									</p>
									<p>
										<span class="champs_label">{{ 'Section d\'imputation' | trad }}</span>
										<span class="resultat">
											{{ line.SI_LIBELLE ~ ' (' ~ line.CODE_SI ~ ')' }}
										</span>
									</p>
									<p>
										<span class="champs_label">{{ 'Sous-compte d\'analyse' | trad }}</span>
										<span class="resultat">
											{% if line.CODE_SCA %}
												{{ line.SCA_LIBELLE ~ ' (' ~ line.CODE_SCA ~ ')' }}
											{% endif %}
										</span>
									</p>
								</div>
							</div>
							<div class="colonne2 last">
								<div class="informations">
									<p>
										<span class="champs_label">{{ 'Prix unitaire' | trad }}</span>
										<span class="resultat">
											{% if droits.HA_BR_PX %}
												{{ line.PU | tva ~ ' ' ~ line.COD_DEV }}
											{% endif %}
										</span>
									</p>
									<p>
										<span class="champs_label">{{ 'Code gestion' | trad }}</span>
										<span class="resultat">
											{% if line.CODGES %}
												{{ line.LIBGES ~ ' (' ~ line.CODGES ~ ')' }}
											{% endif %}
										</span>
									</p>
									<p>
										<span class="champs_label">{{ 'Code complémentaire' | trad }}</span>
										<span class="resultat">
											{{ line.CDC_LIBELLE ~ ' (' ~ line.CODE_CDC ~ ')' }}
										</span>
									</p>
								</div>
							</div>
							<div class="">
                                <fieldset class="scheduler-border tableLines">
                                    <legend class="scheduler-border tableLines">{{ 'Répartition par lots' | trad }}
                                        <span class="obligatoire">*</span>
                                    </legend>
                                    <table class="table table-hover" id="tableLines">
                                        <thead class="thead-dark">
                                            <th scope="col">{{ 'Sélectionner' | trad }}</th>
                                            <th scope="col">{{ 'N° de lot' | trad }}</th>
                                            <th scope="col">{{ 'Quantité disponible sur le lot' | trad }}</th>
                                            <th scope="col">{{ 'Quantité à retourner' | trad }}</th>
                                            <th scope="col">{{ 'Quantité retournée' | trad }}</th>
                                        </thead>
                                        <tbody>
                                            {% for batch in line.batchReturn %}
                                                <tr id="line_{{ batch.NO_LIG_BR }}">
                                                    <td align="center" width="10%">
                                                        <input 
                                                            type="checkbox" class="form-control checkbox batch_box" 
                                                            name="NO_LOT-{{ batch.NO_LIG_BR }}-{{ batch.NO_LOT }}" 
                                                            id="input_NO_LOT-{{ batch.NO_LIG_BR }}-{{ batch.NO_LOT }}" 
                                                            {% if batch.SELECTED != 'FALSE' %} checked {% endif %}
                                                            onclick="updateBatchReturn(
                                                                {{ batch.NO_LIG_BR }}, 
                                                                '{{ batch.NO_LOT }}', 
                                                                'selected'
                                                            );"
                                                        >
                                                    </td>
                                                    <td id="" align="left">{{ batch.NO_LOT }}</td>
                                                    <td id="QTE_DISPO-{{ batch.NO_LIG_BR }}-{{ batch.NO_LOT }}" align="right">{{ qteByUnite(batch.QTE_DISPO, line.unite) }}</td>
                                                    <td id="QTE_ANNULE-{{ batch.NO_LIG_BR }}-{{ batch.NO_LOT }}" align="right">{{ qteByUnite(batch.QTE_LOT, line.unite) }}</td>
                                                    <td align="right">
                                                        {{ inputAdvance('TEXT', {
                                                            'name'                  : 'QTE_LOT_RETOUR' ~ '-' ~ batch.NO_LIG_BR ~ '-' ~ batch.NO_LOT,
                                                            'value'                 : qteByUnite((batch.QTE_LOT_RETOUR ?? 0), line.unite),
                                                            'pathValidator'         : path('Reception.ValidatorCreation.batch'),
                                                            'paramsValidator'       : "{'line' : '" ~ batch.NO_LIG_BR ~ "', 'batch' : '" ~ batch.NO_LOT ~ "', 'field' : 'QTE_LOT_RETOUR'}",
                                                            'myFuncValidator'       : 'updateBatchReturn',
                                                            'paramFuncValidator'    : '[' ~ batch.NO_LIG_BR ~ ', "' ~ batch.NO_LOT ~ '", "QTE_LOT_RETOUR"]',
                                                            'addStyle'              : (line.IS_ANNULE != '1' or batch.SELECTED == 'FALSE') ? 'display: none;',
                                                            'addClass'              : 'QTE_LOT_RETOUR' ~ '-' ~ batch.NO_LIG_BR,
                                                            'numerique'             : true,
                                                        }) }}
                                                    </td>
                                                </tr>
                                            {% endfor %}
                                        </tbody>
                                    </table>
                                </fieldset>
							</div>
						</td>
					</tr>
				{% endfor %}
			</tbody>
		</table>
		{{ paginations(
			path('Reception.CreationBR.creatEdit', {
				order: order, 
				type: type,
				mode: mode, 
				init: init, 
				tab: tab
			}),
			infoPagination.nombreDePage, 
			infoPagination.page, 
			infoPagination.post
		) }}
	</div>

    <script>
        $(document).ready(function () {
            for (checkAll of document.querySelectorAll('[data-checkall-input]')) {
                id = checkAll.getAttribute('data-checkall-input');
                if (document.querySelectorAll('[data-checkall="' + id + '"]:not(:checked)').length == 0) {
                    document
                        .querySelector('[data-checkall-input="'+id+'"]')
                        .checked = true;
                }
            }
        });

        function updateValueLine(field, bool, error) {
            if (error == true) {
                if (
                    (document.getElementsByClassName('error').length > 0) 
                        && 
                    (document.getElementsByClassName('error').length != document.getElementsByClassName('nonBloquant').length)
                ) {
                    $('#valid').hide();
                    $('#MsgErreur').show();
                } else {
                    $('#valid').show();
                    $('#MsgErreur').show();
                }
                return '';
            }

            $('#valid').show();
            $('#MsgErreur').hide();

            if (bool) {
                var value = $('#input_'+field).is(':checked');
            } else {
                var value = $('#input_'+field).val();
            }

            $.ajax({
                dataType : 'json',
                url: '{{ path('Reception.CreationBR.ajaxUpdateLine', {order: order, type: type, mode: mode}) }}',
                data: {field: field, value: value},
                type: "POST",
                success: function(result) {
                    $('#tab').html(result.lines);
                },
                error: function(result){

                }
            });
        }

        function updateBatchReturn(line, batch, field, error) {
            if (error == true) {
                if (
                    (document.getElementsByClassName('error').length > 0) 
                        && 
                    (document.getElementsByClassName('error').length != document.getElementsByClassName('nonBloquant').length)
                ) {
                    $('#valid').hide();
                    $('#MsgErreur').show();
                } else {
                    $('#valid').show();
                    $('#MsgErreur').show();
                }
                return '';
            }
            
            $('#valid').show();
            $('#MsgErreur').hide();

            if (field == 'selected') {
                var value = $('#input_NO_LOT-' + line + '-' + batch).is(':checked');
                if (value == true) {
                    $('#input_QTE_LOT_RETOUR-' + line + '-' + batch).show();
                } else {
                    $('#input_QTE_LOT_RETOUR-' + line + '-' + batch).hide();
                }

            } else {
                var value = $('#input_QTE_LOT_RETOUR-' + line + '-' + batch).val();
            }
            let brNumber = {{ initialBr.NUM_BR ?? initialBr.NUM_BR_ANNULE }};
            activeLoader();
            $.ajax({
                dataType : 'html',
                url: '{{ path('Reception.Lot.ajaxUpdateBatchReturn') }}',
                data: {brNumber: brNumber, line: line, batch: batch, field: field, value: value},
                type: "POST",
                success: function(result){
                    {# $('#LINE_LOT_' + line + '_' + batch).remove(); #}
                    desactiveLoader();
                },
                error: function(result){

                }
            });
        }

        $('.loupe').on('click', () => {
            if ($('#showAllDetailLigne').is(':checked')) {
                $('#showAllDetailLigne').prop('checked', false);
            }
        });

        $('#showAllDetailLigne').parent().on('click', () => {
            if($('#showAllDetailLigne').is(':checked')) {
                $('#showAllDetailLigne').prop('checked', false);
            } else {
                $('#showAllDetailLigne').prop('checked', true);
            }

            if($('#showAllDetailLigne').is(':checked')) {
                $('.loupe').addClass('actif');
                $('.detail_ligne').removeClass('hide_detail');
            } else {
                $('.loupe').removeClass('actif');
                $('.detail_ligne').addClass('hide_detail');
            }
        });

        $('#showAllDetailLigne').on('click', () => {
            if($('#showAllDetailLigne').is(':checked')) {
                $('#showAllDetailLigne').prop('checked', false);
            } else {
                $('#showAllDetailLigne').prop('checked', true);
            }

            if($('#showAllDetailLigne').is(':checked')) {
                $('.loupe').addClass('actif');
                $('.detail_ligne').removeClass('hide_detail');
            } else {
                $('.loupe').removeClass('actif');
                $('.detail_ligne').addClass('hide_detail');
            }
        });
    </script>
{% endblock %}
