{% extends 'layout.twig' %}

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

	<h3>
		{{ 'Article du catalogue' }} {{ infoCata.DESCRIPTION_CATA }} / {{ 'VERSION' | trad }} {{ versCata.VERSCATA }}
	</h3>

    {{ arianeSub() }}
    <h3 class="clearfix">
        {{ 'Ajout articles associés'  }} : {{ infoArticle.DESIGNCRT }}

        <button type="button" class="button principal" onClick="ajaxPopupV2('{{ path('Catalogue.ControleVersion.validateAssociesA', {idLigne:idLigne,idObjet:idObjet,typeAss:typeAss,idObjetAss:idObjetAss}) }}', 'formCarac', '{{ 'Validation' | trad }}');">
            {{ 'Enregistrer' | trad }}
        </button>
        <a class="button secondaire" href="{{ path('Catalogue.ControleVersion.listeArticleAssocies', {idLigne:idLigne}) }}">{{ 'Retour' | trad }}</a>
    </h3>

    <form id="formCarac" class="clearfix" style="margin-top:10px;">
        <div class="box-form clearfix">
            <div class="clearfix">
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('SELECT', {
                            'titre' : 'Type objet' | trad,
                            'name' : 'T_ASS',
                            'listeValue' : typeArticles,
                            'value' : article.T_ASS,
                            'option' : edit? 'readOnly':'',
                        }) }}
                    </div>
                </div
            </div>
            <div class="clearfix" id="zone_A" {% if article.T_ASS != 'A' and article.T_ASS != '' %}style="display:none;"{% endif %}>
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('ZOOM', {
                            'titre' : 'Code article' | trad,
                            'name' : 'ID_OBJ_A',
                            'value' : article.ID_OBJ,
                            'pahtZoom' : path('Ajax.liste.articles'),
                            'paramZoom' : "{'displayCode':false}",
                            'titleZoom' : 'Liste des articles' | trad,
                            'idText' : 'input_LIB_A',
                            'option' : edit? 'readOnly':'',
                        }) }}
                    </div>
                </div>

                <div class="colonne2 last">
                    <div class="row">
                        {{ inputAdvance('TEXT', {
                            'titre' : 'Désignation' | trad,
                            'name' : 'LIB_A',
                            'value' : article.LIB,
                            'option' : 'disabled',
                        }) }}
                    </div>
                </div>
            </div>
            <div class="clearfix" id="zone_C" {% if article.T_ASS != 'C' %}style="display:none;"{% endif %}>
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('ZOOM', {
                            'titre' : 'Code article' | trad,
                            'name' : 'ID_OBJ_C',
                            'pahtZoom' : path('Ajax.liste.articlesCatalogue'),
                            'paramZoom' : "{'onlyCata' : true}",
                            'titleZoom' : 'Liste des articles catalogue' | trad,
                            'widthPopup' : 'modal_large',
                            'value' : article.ID_OBJ,
                            'option' : edit? 'readOnly':'',
                        }) }}
                    </div>
                </div>

                <div class="colonne2 last">
                    <div class="row">
                        {{ inputAdvance('TEXT', {
                            'titre' : 'Désignation' | trad,
                            'name' : 'LIB_C',
                            'value' : article.LIB,
                            'option' : 'disabled',
                        }) }}
                    </div>
                </div>
            </div>
            <div class="clearfix" id="zone_G" {% if article.T_ASS != 'G' %}style="display:none;"{% endif %}>
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('ZOOM', {
                            'titre' : 'Code groupemement fournisseur' | trad,
                            'name' : 'ID_OBJ_G',
                            'value' : article.ID_OBJ,
                            'pahtZoom' : path('Ajax.liste.grpfou'),
                            'paramZoom' : "{'displayCode':false}",
                            'titleZoom' : 'Liste des groupements fournisseurs' | trad,
                            'idText' : 'input_LIB_G',
                            'option' : edit? 'readOnly':'',
                        }) }}
                    </div>
                </div>

                <div class="colonne2 last">
                    <div class="row">
                        {{ inputAdvance('TEXT', {
                            'titre' : 'Désignation' | trad,
                            'name' : 'LIB_G',
                            'value' : article.LIB,
                            'option' : 'disabled',
                        }) }}
                    </div>
                </div>
            </div>
            <div class="clearfix" id="zone_F" {% if article.T_ASS != 'F' %}style="display:none;"{% endif %}>
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('ZOOM', {
                            'titre' : 'Code fournisseur' | trad,
                            'name' : 'ID_OBJ_F',
                            'value' : article.ID_OBJ,
                            'pahtZoom' : path('Ajax.liste.fournisseur'),
                            'paramZoom' : "{'displayCode':false}",
                            'titleZoom' : 'Liste des fournisseurs' | trad,
                            'idText' : 'input_LIB_F',
                            'option' : edit? 'readOnly':'',
                        }) }}
                    </div>
                </div>

                <div class="colonne2 last">
                    <div class="row">
                        {{ inputAdvance('TEXT', {
                            'titre' : 'Désignation' | trad,
                            'name' : 'LIB_F',
                            'value' : article.LIB,
                            'option' : 'disabled',
                        }) }}
                    </div>
                </div>
            </div>
            <div class="clearfix" id="zone_S" {% if article.T_ASS != 'S' %}style="display:none;"{% endif %}>
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('ZOOM', {
                            'titre' : 'Code sous-famille' | trad,
                            'name' : 'ID_OBJ_S',
                            'value' : article.ID_OBJ,
                            'pahtZoom' : path('Ajax.liste.sousFamille'),
                            'paramZoom' : "{'displayCode':false}",
                            'titleZoom' : 'Liste des sous-familles' | trad,
                            'idText' : 'input_LIB_S',
                            'option' : edit? 'readOnly':'',
                        }) }}
                    </div>
                </div>

                <div class="colonne2 last">
                    <div class="row">
                        {{ inputAdvance('TEXT', {
                            'titre' : 'Désignation' | trad,
                            'name' : 'LIB_S',
                            'value' : article.LIB,
                            'option' : 'disabled',
                        }) }}
                    </div>
                </div>
            </div>
            <div class="clearfix" id="zone_R" {% if article.T_ASS != 'R' %}style="display:none;"{% endif %}>
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('ZOOM', {
                            'titre' : 'Code rayon' | trad,
                            'name' : 'ID_OBJ_R',
                            'value' : article.ID_OBJ,
                            'pahtZoom' : path('Ajax.liste.rayon'),
                            'paramZoom' : "{'tri_IDRAYON' : 'asc'}",
                            'titleZoom' : 'Liste des rayons' | trad,
                            'idText' : 'input_LIB_R',
                            'option' : edit? 'readOnly':'',
                        }) }}
                    </div>
                </div>

                <div class="colonne2 last">
                    <div class="row">
                        {{ inputAdvance('TEXT', {
                            'titre' : 'Désignation' | trad,
                            'name' : 'LIB_R',
                            'value' : article.LIB,
                            'option' : 'disabled',
                        }) }}
                    </div>
                </div>
            </div>
            <div class="clearfix">
                <div class="colonne2">
                    <div class="row">
                        {{ inputAdvance('TEXT', {
                            'titre' : 'Coefficient' | trad,
                            'name' : 'COEFF',
                            'value' : article.COEFF,
                            'numeric' : true,
                            'pathValidator' : path('Ajax.validator.float'),
                            'paramsValidator' : "{}",
                        }) }}
                    </div>
                </div>

                <div class="colonne2 last">
                    <div class="row">
                        {{ inputAdvance('SWITCH', {
                            'titre' : 'Obligatoire ?' | trad,
                            'name' : 'OBLIG',
                            'value' : article.OBLIG,
                        }) }}
                    </div>
                </div>
            </div>
        </div>
    </form>
    
</section>
<script>
	document.addEventListener('change',(event) => {
		var target = event.target;
		if (!(target instanceof HTMLElement) ) {
			return;
		}

		if (target.id == 'input_T_ASS') {
            $('#zone_A').hide();
            $('#zone_C').hide();
            $('#zone_G').hide();
            $('#zone_F').hide();
            $('#zone_S').hide();
            $('#zone_R').hide();

            $('#zone_'+$(target).val()).show();
        }

        return;
	});

</script>
{% endblock %}