{% macro startCard(col, zone = "default", card ='primary', fullWidth = false ) %}
    {% if col > 0 %}
<div class="col-{{ col }}">{% endif %}
    <div class="card card-{{ card }}">
        <div class="card-header">
            <h3 class="card-title">
                {% set label = "group."~zone %}
                {{ label|trans({}, 'lcshop')|raw }}
            </h3>
        </div>
        <div class="card-body {{ fullWidth == true ? 'p-0' : 'row' }}">

            {% endmacro %}

            {% macro endCard(noCol = false) %}
        </div>
    </div>
    {% if noCol == false %}</div>{% endif %}
{% endmacro %}


{% macro productField(colspan, field, fieldName, fieldDisplay = false, displaySuffix="",attr="") %}

    {% if fieldDisplay == false %}{% set fieldDisplay = fieldName %}{% endif %}

    <td {{ attr|raw }} colspan="{{ colspan }}" class="{{ fieldName }}" >
        <div v-show="{{ fieldName }}Inherited == false" v-on:click="{{ fieldName }}Inherited = true">
            <div v-if="{{ fieldName }}">
                {% verbatim %}{{ {% endverbatim %}{{ fieldDisplay }} {% verbatim %}}}{% endverbatim %}{{ displaySuffix }}
            </div>
            <div v-else class="inherited">
                {% verbatim %}{{ productFamily.{% endverbatim %}{{ fieldDisplay }} {% verbatim %}}}{% endverbatim %}{{ displaySuffix }}
            </div>
        </div>
        <div v-show="{{ fieldName }}Inherited == true">
            {{ form_widget(field, {'attr' : {'v-model' :  fieldName , 'v-on:focusout': fieldName~'Inherited = false', '@change' : fieldName~'Updated'}}) }}
        </div>
        <button v-show="{{ fieldName }}" v-on:click="{{ fieldName }} = null; {{ fieldName }}Inherited = false; " class="btn btn-empty-field" type="button"> <i class="fa fa-undo"></i> </button>
    </td>
{% endmacro %}

{% macro priceField(field, fieldTax, fieldName,  behaviorPriceValue) %}

    <div class="form-group field-price col-12" v-show="behaviorPrice == '{{ behaviorPriceValue }}'">
        <div class="row">
            <div class="col-12">
                {{ form_label(field) }}
            </div>
            <div class="col-6">
                <div class="form-widget">
                    <div class="input-group">
                        {{ form_widget(field, {'attr' : {'v-model': fieldName, '@change' : fieldName~'Updated'}}) }}
                        <div class="input-group-append">
                            <span class="input-group-text">€ HT
                                    {% if behaviorPriceValue == 'by-reference-unit' %}/ ${ unitReference }{% endif %}
                            </span>
                        </div>
                    </div>
                </div>
            </div>
            <div class="col-6">
                <div class="input-group">
                    {{ form_widget(fieldTax, {'attr' : {'v-model':  fieldName ~ 'WithTax', '@change' : fieldName~'WithTaxUpdated'}}) }}
                    <div class="input-group-append">
                        <span class="input-group-text">€ TTC
                            {% if behaviorPriceValue == 'by-reference-unit' %}/ ${ unitReference }{% endif %}
                        </span>
                    </div>
                </div>
            </div>
        </div>
    </div>

{% endmacro %}