{% macro input(label, type = "text", id, name, value, placeholder, orderNumber, required = false, incolumn = false, controlComa = false, stepBtnId = null, classNameRequired = "errorMessage",decimal=null, excludeZeroValue = false, recommendation = false, classNameReco = "recoMessage", limited = false, classNameLimited = "limitedMessage", limitedTabTitle = null, min = null, max = null, disable = false) %}
    <div id="{{ id ~ "Div" }}">
        <div class="row" style="display: inline;">
            <div class="col{{ incolumn ? "-md-2" : "" }}">
                <label data-label="{{ label }}" id="{{ id ~ "Label" }}" class="control-label"
                       style="width:100%;font-size:15px;{{ id != "dzeta" ? "margin-bottom:10px;" : "" }}">
                    {% if id == "dzeta" %}
                        <a style="margin-right:2%;text-decoration: none" target="_blank"
                           href="{{ asset("filesPublic/Dzeta_coudes_Aide.pdf") }}">
                            <button type="button">
                                <i class="fas fa-download"></i>
                            </button>
                        </a>
                    {% endif %}
                    {{ label }}
                    {% if required %}
                        <span id="{{ id ~ "Required" }}" style="color:red">*</span>
                    {% endif %}
                    {% if limited %}
                        <a data-toggle-id="{{ id }}" class="info-icon">
                            <img alt="info icon" src="{{ asset('install-bois/icon/icon_info.png') }}">
                        </a>
                    {% endif %}
                </label>
            </div>
            <div class="col{{ incolumn ? "-md-8" : "" }}">
                {% if type == "number" %}
                    {% if value != null and value > 0 %}
                        {% set inputValue = value %}
                    {% elseif (value !== null and excludeZeroValue == false) %}
                        {% set inputValue = 0 %}
                    {% else %}
                        {% set inputValue = "" %}
                    {% endif %}
                {% else %}
                    {% set inputValue = value and value !== null ? value : "" %}
                {% endif %}

                {% if decimal != null %}
                    {% set step = '0.' %}
                    {% for i in 1..decimal-1 %}
                        {% set step = step ~ '0' %}
                    {% endfor %}
                    {% set step = step ~ '1' %}
                {% endif %}
                <input
                        class="form-control"
                        {{ decimal != null ? "data-decimal=" ~ decimal : "" }}
                        {{ decimal != null ? "step=" ~ step : "" }}
                        type="{{ type }}"
                        id="{{ id }}"
                        name="{{ name }}"
                        value="{{ inputValue }}"
                        placeholder="{{ placeholder }}"
                        {{ required ? 'required="required"' : "" }}
                        {# style="{{ required ? 'background-color: #FFF3F3;' : "" }}" #}
                        {{ type == "number" ? 'onKeyUp=onKeyUpVerifNegativeNumber(event' ~ ( stepBtnId != null ? ",'" ~ stepBtnId ~ "'" : "") ~')' : "" }}
                        {{ disable ? 'disabled' : '' }}
                        data-order="{{ orderNumber }}"
                />

                {% if type == "number" %}
                    <span id="{{ id ~ "ControlMin" }}" class="{{ classNameRequired }}" style="display:none;">La valeur ne peut pas être négative</span>
                {% endif %}
                {% if required %}
                    <span id="{{ id ~ "Control" }}" class="{{ classNameRequired }}" style="display:none;">Ce champ est obligatoire</span>
                {% endif %}
                {% if recommendation %}
                    <span id="{{ id ~ "Reco" }}" class="{{ classNameReco }}" style="display:none;"></span>
                {% endif %}
                {% if limited %}
                    <span id="{{ id ~ "Limited" }}" class="{{ classNameLimited }}" style="display:none;">Valeur incorrecte</span>
                    <table id="{{ id ~ "LimitedTab" }}" style="display: none" class="limitedTabMinMax">
                        <thead>
                        <tr>
                            <th class="custom-th-title">Valeur attendue</th>
                            <th class="custom-th">Min</th>
                            <th class="custom-th">Max</th>
                        </tr>
                        </thead>
                        <tbody>
                        <tr>
                            <td class="custom-td-title">Tous types d'appareils</td>
                            <td class="custom-td">>= {{ min }}</td>
                            <td class="custom-td"><= {{ max }}</td>
                        </tr>
                        </tbody>
                    </table>
                {% endif %}
                {% if controlComa %}
                    <span id="{{ "other"  ~ id ~ "Control" }}" class="{{ classNameRequired }}" style="display:none;">Vous devez séparer chaque mot par un point-virgule ainsi qu'à la fin</span>
                {% endif %}
            </div>
        </div>
    </div>
{% endmacro %}

{% macro inputDate(label, id, name, value, required = false, incolumn = false, classNameRequired = "errorMessage", min = null, max = null, disable = false) %}
    <div id="{{ id ~ "Div" }}">
        <div class="row" style="display: inline;">
            <div class="col{{ incolumn ? "-md-2" : "" }}">
                <label data-label="{{ label }}" id="{{ id ~ "Label" }}" class="control-label"
                       style="width:100%;font-size:15px;{{ id != "dzeta" ? "margin-bottom:10px;" : "" }}">
                    {% if id == "dzeta" %}
                        <a style="margin-right:2%;text-decoration: none" target="_blank"
                           href="{{ asset("filesPublic/Dzeta_coudes_Aide.pdf") }}">
                            <button type="button">
                                <i class="fas fa-download"></i>
                            </button>
                        </a>
                    {% endif %}
                    {{ label }}
                    {% if required %}
                        <span id="{{ id ~ "Required" }}" style="color:red">*</span>
                    {% endif %}
                </label>
            </div>
            <div class="col{{ incolumn ? "-md-8" : "" }}">
                <input
                        class="form-control"
                        type="date"
                        id="{{ id }}"
                        name="{{ name }}"
                        value="{{ value }}"
                        min="{{ min }}"
                        max="{{ max }}"
                        {{ required ? 'required="required"' : "" }}
                        {{ disable ? 'disabled' : ''}}
                />

                {% if required %}
                    <span id="{{ id ~ "Control" }}" class="{{ classNameRequired }}" style="display:none;">Ce champ est obligatoire</span>
                {% endif %}
            </div>
        </div>
    </div>
{% endmacro %}

{% macro inputCOP(label, type = "text", id, name, value, placeholder, orderNumber, required = false) %}
    <div class="row" style="display: inline;">
        <div class="col-md-2">
            <label data-label="{{ label }}" id="{{ id ~ "1Label" }}" class="control-label"
                   style="margin-bottom: 10px;font-size:15px;">
                {{ label }}
                {% if required %}
                    <span style="color:red">*</span>
                {% endif %}
            </label>
        </div>
        <div class="col-md-4">
            <input
                    class="form-control"
                    type="{{ type }}"
                    id="{{ id ~ "1" }}"
                    name="{{ name ~ "1" }}"
                    value="{{ value and value != null ? value : "" }}"
                    placeholder="{{ placeholder }}"
                    {{ required ? 'required="required"' : "" }}
                    data-order="{{ orderNumber }}"
            />
            <span id="{{ id ~ "1ControlMin" }}" class="noEmptySpan" style="display:none;color:red">La valeur ne peut pas être négative</span>
            {% if required %}
                <span id="{{ id ~ "Control" }}" class="noEmptySpan" style="display:none;color:red">Ce champ est obligatoire</span>
            {% endif %}
        </div>
        <div class="col-md-4">
            <input
                    class="form-control"
                    type="{{ type }}"
                    id="{{ id ~ "2" }}"
                    name="{{ name ~ "2" }}"
                    placeholder="0"
                    {{ required ? 'required="required"' : "" }}
                    data-order="{{ orderNumber + 1 }}"
            />
            <span>Note  : Cette valeur est en pourcentage ( % )</span>
            <span id="{{ id ~ "2ControlMin" }}" class="noEmptySpan" style="display:none;color:red">La valeur ne peut pas être négative</span>
        </div>
    </div>
{% endmacro %}

{% macro select(label, id, name, listObject, firstOptionLabel, orderNumber, value, required = false, incolumn = false, hidden = false, multiple = false, classNameRequired = "errorMessage", disable = false) %}
    <div id="{{ id ~ "Div" }}">
        <div class="row" style="display: inline;">
            <div class="col{{ incolumn ? "-md-2" : "" }}">
                <label data-label="{{ label }}" id="{{ id ~ "Label" }}" class="control-label"
                       style="margin-bottom: 10px;font-size:15px;">
                    {{ label }}
                    {% if required %}
                        <span style="color:red">*</span>
                    {% endif %}
                </label>
            </div>
            <div class="col{{ incolumn ? "-md-8" : "" }}">
                <select
                        {{ multiple ? 'multiple="multiple"' : "" }}
                        data-id="{{ id }}"
                        id="{{ id }}"
                        name="{{ name }}"
                        class="form-control"
                        style="{{ required ? 'background-color: #FFF3F3;"' : "" }}"
                        {{ required ? 'required="required"' : "" }}
                        data-order="{{ orderNumber }}"
                        {{ disable ? 'disabled' : '' }}
                >
                    {% if listObject|length > 0 and firstOptionLabel is not null %}
                        <option value="null" style="color:#d2d6de">{{ firstOptionLabel }}</option>
                    {% endif %}
                    {% if listObject|length > 0 and listObject != null %}
                        {% for key,object in listObject %}
                            <option value="{{ object != null ? (object.id is defined ? object.id : key) : "null" }}" {{ object.slug is defined ? 'data-slug='~ object.slug ~'' : "" }}
                                    {{ object != null and ((object.id is defined and object.id == value) or (object.label is defined and object.label == value) or key == value or object == value) and value != null ? "selected='selected'" : "" }}
                            >{{ object != null ? (object.label is defined ? object.label : object) : null }}</option>
                        {% endfor %}
                    {% endif %}
                </select>
                {% if required %}
                    <span id="{{ id ~ "Control" }}" class="{{ classNameRequired }}" style="display: none">Ce champ est obligatoire</span>
                {% endif %}
            </div>
        </div>
    </div>
{% endmacro %}

{% macro selectWithTags(label, id, name, listObject, orderNumber, required = false) %}
    <div id="{{ id ~ "Div" }}">
        <div class="row" style="display: inline;">
            <div class="col">
                <label data-label="{{ label }}" id="{{ id ~ "Label" }}" class="control-label"
                       style="margin-bottom: 10px;font-size:15px;">
                    {{ label }}
                    {% if required %}
                        <span style="color:red">*</span>
                    {% endif %}
                </label>
            </div>
            <div class="col">
                <select
                        multiple="multiple"
                        data-id="{{ id }}"
                        id="{{ id }}"
                        name="{{ name }}"
                        class="form-control select2"
                        style="{{ required ? 'background-color: #FFF3F3;"' : "" }}"
                        {{ required ? 'required="required"' : "" }}
                        data-order="{{ orderNumber }}"
                        data-tags="true"
                >
                    {% for object in listObject %}
                        {% if object.id is not empty and object.label is not empty %}
                            <option value="{{ object.id }}" {% if object.selected is defined and object.selected %}
                            selected
                                {% endif %}>
                                    {{ object.label }}
                            </option>
                        {% endif %}
                    {% endfor %}
                </select>
                {% if required %}
                    <span id="{{ id ~ "Control" }}" class="errorMessage"
                          style="display: none">Ce champ est obligatoire</span>
                {% endif %}
            </div>
        </div>
    </div>
{% endmacro %}

{% macro textarea(label, id, name, placeholder, orderNumber, value, required = false, rows = 10, resize = false, disable = false) %}
    <div class="row" style="display: inline;">
        <div class="col">
            <label data-label="{{ label }}" id="{{ id ~ "Label" }}" class="control-label"
                   style="margin-bottom: 10px;font-size:15px;">
                {{ label }}
                {% if required %}
                    <span style="color:red">*</span>
                {% endif %}
            </label>
        </div>
        <div class="col">
            <textarea
                    class="form-control"
                    id="{{ id }}"
                    name="{{ name }}"
                    placeholder="{{ placeholder }}"
                    {{ required ? 'required="required"' : "" }}
                    rows="{{ rows }}"
                    data-order="{{ orderNumber }}"
                    {{ disable ? 'disabled' : '' }}
                    style="{{ resize == false ? 'resize: none' : '' }}"
            >{{ value and value != null ? value : "" }}</textarea>
            {% if required %}
                <span id="{{ id ~ "Control" }}" class="noEmptySpan" style="display:none;color:red">Ce champ est obligatoire</span>
            {% endif %}
        </div>
    </div>
{% endmacro %}
{% macro checkboxList(label, id, name,listObject, orderNumber, values, otherValue = null, required = false, inline = false, withOther = false, withOtherPlaceholder = false) %}
    <div id="{{ id ~ "Div" }}" class="row" style="display: inline;">
        <div class="col">
            <label data-label="{{ label }}" id="{{ name ~ "Label" }}" class="control-label"
                   style="margin-bottom: 10px;font-size:15px;">
                {{ label }}
                {% if required %}
                    <span style="color:red">*</span>
                {% endif %}
            </label>
        </div>
        <div class="col checkboxListForm"
             style="{{ inline ? "display: inline-flex;" : "display: block;" }}">
            {% for object in listObject %}
                <div id="{{ object.id ~ "_" ~name }}Div" class="checkbox"
                     style="margin-right: 2%;margin-top: {{ inline ? "0" : "2px" }};margin-bottom: 0">
                    <label>
                        <input
                                type="checkbox"
                                data-idParam="{{ object.id }}"
                                id="{{ object.id ~ "_" ~name }}"
                                name="{{ name }}"
                                value="{{ object.label }}"
                                data-order="{{ orderNumber }}"
                                {{ object.id in values and values != null  ? "checked='checked'" : "" }}
                        />
                        {{ object.label }}
                    </label>
                </div>
            {% endfor %}
            {% if withOther %}
                <br>
                <div class="col">
                    <label data-label="{{ label }}" id="{{ "other" ~ id|capitalize ~ "Label" }}" class="control-label">
                        Autre(s) :
                    </label>
                    <input
                            class="form-control"
                            type="text"
                            id="{{ "other" ~ id|capitalize }}"
                            name="{{ "other" ~ id|capitalize }}"
                            placeholder="{{ withOtherPlaceholder }}"
                            style="width: 100%;"
                            data-order="{{ orderNumber + 1 }}"
                            value="{{ otherValue and otherValue != null ? otherValue : "" }}"
                    />
                    <span id="{{ "other"  ~ id ~ "Control" }}" class="noEmptySpan"
                          style="font-weight:normal;display:none;color:red">Vous devez séparer chaque mot par un point-virgule ainsi qu'à la fin</span>
                </div>
            {% endif %}
        </div>
        {% if required %}
            <div id="{{ name ~ "checkBoxRequiredDiv" }}">
                <span id="{{ name ~ "Control" }}" class="noEmptySpan"
                      style="font-weight:normal;display:none;color:#FFC000">Vous devez renseigner au moins un champ</span>
            </div>
        {% endif %}
    </div>
{% endmacro %}

{% macro inputFilePath(filepath,formFilePath,isPDF,inputId,libelle,idParent) %}
    <div class="form-group col-sm-12 containerFilePath" style="margin-top: 10px;padding-left: 0">
        <label class="control-label"> {{ libelle }} </label>
        <div id="{{ idParent }}" data-typetoremove="{{ inputId }}" class="fileLine" style="margin-top: 10px">
            {% set name = filepath|split('/')|last %}
            <div class="containerFile" style="position: relative">
                <br>
                <span class="name">{{ name? name : "Non renseigné" }}</span>
                <div>
                    <a target="_blank" class="btnVisualiser txtlibre txtUnderline"
                            {% if name %}
                        href="{{ asset(filepath) }}"
                    {% else %}
                        style="display: none"
                            {% endif %}>
                        <span>Visualiser</span>
                    </a>
                    {% if not is_granted('ROLE_LECTURE_SEULE') %}
                        <a
                                type="button"
                                data-toggle="modal"
                                {{ name ? 'data-target="#popup-danger-agencyDelete"' }}
                                class="txtlibre txtUnderline {{ name ?'btnRemoveRedirect':'btnRemove' }}"
                                {{ name ? "data-todelete=" ~ inputId }}
                                style="cursor:pointer;padding-left: 10px{{ name ?"" : ';display: none' }}"
                        >
                            <span>Supprimer</span>
                        </a>
                    {% endif %}
                </div>
                {% if isPDF == false %}
                    <div class="previewFile">
                        {% if name %}
                            <img src="{{ asset(filepath) }}"/>
                        {% endif %}
                    </div>
                {% endif %}
            </div>
            <div style="display: flex; flex-direction: row;margin-top: 10px">
                <label for="{{ inputId }}" class="boutonAction"
                       style="height: 25px; padding-top: 2px;color: #FFFFFF!important; font-weight: 700!important;font-size: 14px!important">
                    Parcourir...
                </label>
                <small style="color: red;margin-top: 10px"><b>Veuillez selectionner un
                        fichier de type {{ isPDF ? 'PDF':'PNG ou JPEG' }} . La taille maximale autorisée est
                        de {{ isPDF ? '10Mo':'2Mo' }} </b></small>
            </div>
            {{ form_widget(formFilePath, { 'attr' : { 'style' : 'opacity:0','accept':isPDF?'application/pdf,application/x-pdf':'image/png,image/jpeg'}}) }}
        </div>
    </div>
{% endmacro %}
{% macro inputCheckbox(libelle1,libelle2,isChecked,inputId) %}
    <div style="margin-bottom: 15px">
        <span style="margin-right: 7px;">{{ libelle1 }}</span>
        <label class="switch-button" for="{{ inputId }}">
            <div class="switch-outer">
                <input id="{{ inputId }}"
                       type="checkbox"
                       name="isLight"
                        {{ isChecked ? 'checked="checked"' : "" }}
                >
                <div class="button">
                    <span class="button-toggle"></span>
                    <span class="button-indicator"></span>
                </div>
            </div>
        </label>
        <span style="margin-left: 7px;">{{ libelle2 }}</span>
    </div>
{% endmacro %}

{% macro adrDiameterInput(data, diameter, type, isBigPN, choixAACForfait, diameterBuse) %}
    <label class="{{ data['result'] ? 'positive-square-result' : 'negative-square-result' }}">
        <p {{ type === 'TMRECTANGLESC' || type === 'CC' || type === 'TP' ? 'style="font-size:3rem"' : '' }}>{{ data['diameterFormatted'] }}</p>
        <div class="block-aac-result">
            <img style='width: 2rem;'
                 src="{{ data['result'] ? asset('install-bois/improveResultCDC/check.png') : asset('install-bois/improveResultCDC/cross.png') }}"
                 alt="Calcul OK">
            <span style="color: {{ data['result'] ? '#70AD47' : 'red' }}">Calcul du conduit</span>
        </div>
        {% if isBigPN == false %}
            {% if not choixAACForfait %}
                <div class="block-aac-result">
                    <img style='width: 2rem;'
                         src="{{ data['AAC'] ? asset('install-bois/improveResultCDC/check.png') : asset('install-bois/improveResultCDC/cross.png') }}"
                         alt="AAC OK">
                    <span style="color: {{ data['AAC'] ? '#70AD47' : 'red' }}">Section AAC</span>
                </div>
            {% endif %}
            <div class="block-aac-result">
                {% if (data['DTU'] and app.request.get('displayWet') == '1') or data['DTU'] === null %}
                    <img class="imgDangerDTU"
                         src="{{ asset('install-bois/improveResultCDC/danger.svg') }}"
                         alt="DTU KO">
                    <span style="color: #FC971F">DTU-Conception</span>
                {% elseif data['DTU'] %}
                    <img style='width: 2rem;'
                         src="{{ asset('install-bois/improveResultCDC/check.png') }}"
                         alt="DTU OK">
                    <span style="color: #70AD47">DTU-Conception</span>
                {% else %}
                    <img style='width: 2rem;'
                         src="{{ asset('install-bois/improveResultCDC/cross.png') }}"
                         alt="DTU KO">
                    <span style="color: red">DTU-Conception</span>
                {% endif %}
            </div>
        {% endif %}
        <input type="radio" name="diameter" value="{{ diameter ~ '-' ~ diameterBuse }}" style="display: none"
               onchange="selectDiameter(this);"
               data-is-aac-confirmed="{{ data['AAC'] ? 'true' : 'false' }}"
               data-is-result-positive="{{ data['result'] ? 'true' : 'false' }}">
    </label>
{% endmacro %}