{% extends 'layout.twig' %}

{% block body %}
<section class="contenu clearfix"  id="listeFormat">
	<h1>
		{{ 'Format' | trad }}
	</h1>
		
    {{ ariane() }}

	<div class="tab-content" id="tab-content">
        <h4>{{ 'Paramétrage du format' }} : {{ idFormat }}</h4>

		{% include '@catalogue/ParametrageFormat/_arianeSub.twig' %}

		<table class="table table-hover" id="mainTableCde">
			<thead class="thead-dark">
				<tr>
					<th scope="col" width="75px">{{ 'Pos' | trad }}</th>
					<th scope="col">{{ 'Nom rubrique' | trad }}</th>
					<th scope="col" width="90px">{{ 'Attribut' | trad }}</th>
					<th scope="col" width="150px">{{ 'Format' | trad }}</th>
                    <th scope="col" width="150px">{{ 'Obligatoire' | trad }}</th>
                    <th scope="col" width="150px">{{ 'Transcodage' | trad }}</th>
                    <th scope="col" width="150px">{{ 'Règle' | trad }}</th>
                    <th scope="col" width="150px">{{ 'Défaut' | trad }}</th>
                    <th scope="col">{{ 'Valeur par défaut' | trad }}</th>
                    <th scope="col" width="100px">{{ 'Diviseur' | trad }}</th>
				</tr>
			</thead>
			<tbody>
				{% for element in listeStructure %}
                    <tr>
                        <td>{{ element.POSITION }}</td>
                        <td>{{ element.NOMRUBRIQUE }}</td>
                        <td>{{ listeTypeFormat[element.RATTRIBUT] }}</td>
                        <td>{{ element.RFORMAT }}</td>
                        <td>
							{{ inputAdvance('SWITCH', {
								'name' : 'OBLIGATOI'~spliter()~element.LIGNE,
								'value' : element.OBLIGATOI | boolSql,
								'inputAttr' : {
									'data-updatevalue' : 'on',
								}
							}) }}
                        </td>
                        <td>
							{{ inputAdvance('SWITCH', {
								'name' : 'TRANSCOD'~spliter()~element.LIGNE,
								'value' : element.TRANSCOD | boolSql,
								'inputAttr' : {
									'data-updatevalue' : 'on',
								}
							}) }}
                        </td>
                        <td>
							{{ inputAdvance('SWITCH', {
								'name' : 'REGLES'~spliter()~element.LIGNE,
								'value' : element.REGLES | boolSql,
								'inputAttr' : {
									'data-updatevalue' : 'on',
								}
							}) }}
                        </td>
                        <td>
							{{ inputAdvance('SWITCH', {
								'name' : 'VALDEFAUT'~spliter()~element.LIGNE,
								'value' : element.VALDEFAUT | boolSql,
								'inputAttr' : {
									'data-updatevalue' : 'on',
                                    'data-ligne' : element.LIGNE,
								}
							}) }}
                        </td>
                        <td>
							{{ inputAdvance('TEXT', {
								'name' : 'Valeur_par_defaut'~spliter()~element.LIGNE,
								'value' : element.Valeur_par_defaut,
                                'option' : element.VALDEFAUT | boolSql ? '':'readOnly',
								'inputAttr' : {
									'data-updatevalue' : 'on',
								}
							}) }}
                        </td>
                        <td>
                            {% if element.RATTRIBUT == 'N' %}
                                {{ inputAdvance('SELECT', {
                                    'name' : 'DIVISEUR'~spliter()~element.LIGNE,
                                    'listeValue': listeDiviseur,
                                    'value' : element.DIVISEUR,
                                    'inputAttr' : {
                                        'data-updatevalue' : 'on',
                                    }
                                }) }}
                            {% endif %}
                        </td>
                    </tr>
				{% endfor %}
			</tbody>
		</table>
	</div>
</section>
{% include '@catalogue/ParametrageFormat/_script.twig' %}
<script>
	document.addEventListener('change',(event) => {
		var target = event.target;
		if (!(target instanceof HTMLElement) ) {
			return;
		}

		if (!target.hasAttribute('data-ligne')){
			return;
		} 

		var ligne = $(target).data('ligne');

		if ($(target).is(':checked')) {
            $('#input_Valeur_par_defaut{{spliter()}}'+ligne).prop('readonly', false);
		} else {
            $('#input_Valeur_par_defaut{{spliter()}}'+ligne).prop('readonly', true);
		}
	});
</script>
{% endblock %}
