{#
<div class="row">
    <div class="field-group col-12">
        <fieldset>
            <legend>Livraisons</legend>
            <div class="row">
                <delivery-choice ref="delivery-choice"></delivery-choice>
                #}
{#<div class="col">
                    {{ form_label(form.deliveryAvailabilityZoneShort) }}
                    <div class="delivery-availability-short">
                    {% for field in form.deliveryAvailabilityZoneShort %}
                        {{ form_widget(field, {"attr" : {"v-model" : 'deliveryAvailability'}}) }}
                    {% endfor %}
                    </div>
                </div>
                <div class="col">
                    {{ form_label(form.deliveryAvailabilityZoneLarge) }}
                    <div class="delivery-availability-large">
                        {% for field in form.deliveryAvailabilityZoneLarge %}
                            {{ form_widget(field, {"attr" : {"v-model" : 'deliveryAvailability'}}) }}
                        {% endfor %}
                    </div>
                    ${deliveryAvailability}
                </div>#}{#

            </div>
        </fieldset>
    </div>
</div>
#}


{#
{% macro printDeliveryAvailabitlityRow(slot) %}
    <div class="form-check">
        <input type="radio" v-model="deliveryAvailability" id="{% verbatim %}{{ id }}{% endverbatim %}_20" name="{% verbatim %}{{ name }}{% endverbatim %}" class="form-check-input" value="{% verbatim %}{{ value }}{% endverbatim %}">
        <label class="form-check-label" for="{% verbatim %}{{ id }}{% endverbatim %}_20"></label>
    </div>
{% endmacro %}
{% import _self as formMacros %}

<div class="row">
    <div class="field-group col-12">
        <fieldset>
            <legend>Livraisons</legend>
            <div class="row">
                <div class="col">
                    {{ form_label(form.deliveryAvailabilityZone) }}

                    <div id="delivery-availabilities-choice">

                        <template v-for="(deliveryAvailability, key) in formDeliveryAvailabilityArray">
                            <delivery-availability-choice ref="delivery-choice" :template="deliveryAvailability" :key="key" :name="{{ form.deliveryAvailabilityZone.vars.full_name }}" :id="{{ form.deliveryAvailabilityZone.vars.id }}" >

                            </delivery-availability-choice>
                        </template>
                    </div>
                </div>
                #}{#  <div class="col">
                      {{ form_label(form.deliveryAvailabilityZoneLarge) }}
                      <div class="delivery-availability-large">
                          {% for field in form.deliveryAvailabilityZoneLarge %}
                              {{ form_widget(field, {"attr" : {"v-model" : 'deliveryAvailability'}}) }}
                          {% endfor %}
                      </div>
                      ${deliveryAvailability}
                  </div>#}{#
            </div>
        </fieldset>
    </div>

    <div class="clearfix"></div>

    #}{#{% for keyForm, deliveryAvailabilityField in form.deliveryAvailabilityZoneShort %}

        <script>
            jQuery(window).on('load', function () {
                var deliveryAvailabilityForm = '{{ formMacros.printDeliveryAvailabitlityRow(deliveryAvailabilityField)|replace({"\n":' ', "\r":' ', "'" : "\\'"})|raw }}';

                appOrder.formDeliveryAvailabilityArray.push(deliveryAvailabilityForm);
                appOrder.indexDeliveryAvailability++;
            });
        </script>

    {% endfor %}#}{#

</div>#}


{% macro printDeliveryAvailabitlityChoice() %}
    <div class="form-check">
        <input type="radio" v-model="deliveryAvailability" id="__id__" name="__name__" class="form-check-input" value="__value__" @change="updateDeliveryAvailability">
        <label class="form-check-label" for="__id__">__label__</label>

    </div>
{% endmacro %}
{% import _self as formMacros %}

<div class="row">
    <div class="field-group col-12">
        <fieldset>
            <legend>Livraisons</legend>
            <div class="row">
                <div class="col">
                    {{ form_label(form.deliveryAvailabilityZone) }}

                    <div id="delivery-availability-short" data-prototype='{{ formMacros.printDeliveryAvailabitlityChoice()|replace({"\n":' ', "\r":' ', "'" : "\\'"})|raw }}'>

                        <template v-for="(deliveryAvailability, key) in formDeliveryAvailabilityLargeArray">
                            <delivery-availability-choice ref="delivery-choice" :template="deliveryAvailability" :key="key" >

                            </delivery-availability-choice>
                        </template>
BLOP
                        <template v-for="(deliveryAvailability, key) in formDeliveryAvailabilityShortArray">
                            <delivery-availability-choice ref="delivery-choice" :template="deliveryAvailability" :key="key" >

                            </delivery-availability-choice>
                        </template>
                    </div>
                </div>
              {#  <div class="col">
                    {{ form_label(form.deliveryAvailabilityZoneLarge) }}
                    <div class="delivery-availability-large">
                        {% for field in form.deliveryAvailabilityZoneLarge %}
                            {{ form_widget(field, {"attr" : {"v-model" : 'deliveryAvailability'}}) }}
                        {% endfor %}
                    </div>
                    ${deliveryAvailability}
                </div>#}
            </div>
        </fieldset>
    </div>

    <div class="clearfix"></div>
</div>
{##}