{% trans_default_domain 'lcshop' %}
{% import '@LcShop/backend/default/block/macros.html.twig' as macros %}

<div class="row">
    {{ macros.startCard(8, 'ProductFamily.propertyMain', 'light', true) }}
    <table class="table table-bordered">
        <thead>
        <tr>
            {#<th style="width: 10px">#</th>#}
            <th style="width: 40%">{{ 'field.default.property'|trans({}, 'lcshop') }}</th>
            <th style="width: 60%">{{ 'field.default.propertyValue'|trans({}, 'lcshop') }}</th>
        </tr>
        </thead>
        <tbody>
        <tr>

            <td>{{ form_widget(form.propertyNoveltyExpirationDateActive, {"attr" : {'v-model' : 'propertyNoveltyExpirationDateActive'}}) }}</td>
            <td>
                <div v-show="propertyNoveltyExpirationDateActive == true">
                {{ form_widget(form.propertyNoveltyExpirationDate) }}
                </div>
            </td>
        </tr>
        <tr>
            <td>{{ form_widget(form.propertyOrganicLabelActive, {"attr" : {'v-model' : 'propertyOrganicLabelActive' } }) }}</td>
            <td>
                <div class="form-widget" v-show="propertyOrganicLabelActive == true">
                {{ form_widget(form.propertyOrganicLabel) }}
                </div>
            </td>
        </tr>
        <tr>
            <td>{{ form_widget(form.propertyLargeVolume) }}</td>
            <td></td>
        </tr>
        </tbody>
    </table>
    {{ macros.endCard(true) }}

    {{ macros.startCard(0, 'ProductFamily.propertySecondary', 'light', true) }}

    <table class="table table-bordered">
        <thead>
        <tr>
            {#<th style="width: 10px">#</th>#}
            <th style="width: 40%">{{ 'field.default.property'|trans({}, 'lcshop') }}</th>
            <th style="width: 60%">{{ 'field.default.propertyValue'|trans({}, 'lcshop') }}</th>
        </tr>
        </thead>
        <tbody>
        <tr v-show="typeExpirationDate != null && typeExpirationDate != ''">
            <td><label style="text-transform: uppercase">${typeExpirationDate}</label></td>
            <td>{{ form_widget(form.propertyExpirationDate, {'attr' : {'v-model' : 'propertyExpirationDate'}}) }}</td>
        </tr>

        <tr>
            {#<td>
                {{ form_widget(form.propertyAllergensActive, {"label" : false , "attr" : {'v-model' : 'propertyAllergensActive'}}) }}
            </td>#}
            <td>{{ form_label(form.propertyAllergens) }}</td>
            <td>
                <div class="autoresize">
                    {{ form_widget(form.propertyAllergens, {'attr' : {rows : '1'}}) }}
                </div>
            </td>
        </tr>

        <tr>
            <td>{{ form_label(form.propertyComposition) }}</td>
            <td>
                <div class="autoresize">
                    {{ form_widget(form.propertyComposition, {'attr' : {rows : '1'}}) }}
                </div>
            </td>
        </tr>

        <tr>
            <td>{{ form_label(form.propertyFragrances) }}</td>
            <td>
                <div class="autoresize">
                    {{ form_widget(form.propertyFragrances, {'attr' : {rows : '1'}}) }}
                </div>
            </td>
        </tr>
        <tr>
            <td>{{ form_label(form.propertyWeightQuantity) }}</td>
            <td>
                <div class="autoresize">
                    {{ form_widget(form.propertyWeightQuantity, {'attr' : {rows : '1'}}) }}
                </div>
            </td>
        </tr>
        <tr>
            <td>{{ form_label(form.propertyCharacteristics) }}</td>
            <td>
                <div class="autoresize">
                    {{ form_widget(form.propertyCharacteristics, {'attr' : {rows : '1'}}) }}
                </div>
            </td>
        </tr>
        <tr>
            <td>{{ form_label(form.propertyPackaging) }}</td>
            <td>
                <div class="autoresize">
                    {{ form_widget(form.propertyPackaging, {'attr' : {rows : '1'}}) }}
                </div>
            </td>
        </tr>

        </tbody>
    </table>

    {{ macros.endCard() }}

    {{ macros.startCard(4, 'ProductFamily.property', 'light') }}

    <div class="col">


        {{ form_label(form.typeExpirationDate) }}
        {% for field in form.typeExpirationDate %}
            {{ form_widget(field, {"attr" : {"v-model" : 'typeExpirationDate'}}) }}
        {% endfor %}


        <div class="form-group" v-show="typeExpirationDate != null && typeExpirationDate != ''">
            {{ form_label(form.behaviorExpirationDate) }}
            {% for field in form.behaviorExpirationDate %}
                {{ form_widget(field, {"attr" : {"v-model" : 'behaviorExpirationDate'}}) }}
            {% endfor %}
        </div>

    </div>

    {{ macros.endCard() }}


</div>
