{{ header }}
<header class="background-white bottom-margin-large"
  data-info='{
    "positions": {{ positions|json_encode() }},
    "status": {{ status|json_encode() }},
    "fidelityModule": {{ fidelity_module|json_encode() }}
  }'
>
  <div class="container-fluid">
    <div class="row no-space-xs middle-xs">
      <div class="col-xs-12 col-sm-6 col-md">
        <div class="content-box padding-large">
          <span class="text-x-large text-dark">{{ heading_title }}</span>
          <div class="adm-breadcrumb">
            {% for breadcrumb in breadcrumbs %}
              <i class="fas fa-angle-right text-x-small text-gray horizontal-padding-small"></i>
              <a href="{{ breadcrumb.href }}" class="text-x-small text-gray text-decoration-none">{{ breadcrumb.text }}</a>
            {% endfor %}
          </div>
        </div>
      </div>
      <div class="col-xs-12 col-sm-6 col-md-width-auto">
        <div class="content-box vertical-padding-x-large flex flex-row middle-xs">
          <a href="{{ cancel }}" class="btn-default btn-medium btn-outline right-margin-small">
            <span>{{ button_cancel }}</span>
          </a>
          <a class="btn-default btn-medium btn-primary js-submit-main-form">
            <span>{{ button_save }}</span>
          </a>
        </div>
      </div>
      {% if error_warning %}<div class="warning full-width">{{ error_warning }}</div>{% endif %}
      {% if success %}<div class="success full-width">{{ success }}</div>{% endif %}
      <div class="col-xs-12">
        <div class="flex js-tabs" id="tab-info"></div>
      </div>
    </div>
  </div>
</header>
<form action="{{action}}" method="post" class="js-main-form">
  <div class="container-fluid" data-tabs-id="tab-info">

    {% if error_ceo %}
      <div class="row">
        <div class="col-xs-12 col-md-8">
          <div class="content-box background-white shadow-small padding-large">
            <span class="text-large text-dark visible-block">{{ text_error_search }}</span>
            <span class="text-small text-gray visible-block top-padding-small">{{ text_search_info }}</span>
            <div class="top-padding-medium">
              <a class="cursor-pointer text-decoration-none text-error text-small js-error-ceo">
                <i class="fas fa-exclamation-triangle"></i>
                {{ text_show_error }}
              </a>
              <div class="padding-medium background-error rounded-x-small top-margin-medium hidden js-error-ceo-message">
                <span class="text-error text-small">{{ error_ceo.message }}</span>
              </div>
            </div>
          </div>
        </div>
      </div>
    {% endif %}

    {% if not error_ceo %}
      <div class="row hidden" data-tab="{{ tab_general }}">
        <div class="col-xs-12 col-md-8">

          <div class="content-box bottom-padding-large">
            <div class="flex between-xs middle-xs">
              <span class="text-x-large text-dark">{{ tab_general }}</span>
            </div>
          </div>

          <div class="content-box background-white shadow-small padding-large">
            <div class="row">
              <div class="col-xs-12">
                <label class="field field-medium bottom-padding-large">
                  <span class="field-label">{{ entry_status }}</span>
                  <select class="field-entry" name="fidelity_status">
                    {% for status in status_list %}
                      <option value="{{ status.value }}" {{ status.choice }}>{{ status.description }}</option>
                    {% endfor %}
                  </select>
                </label>

                <label class="field field-medium bottom-padding-large">
                  <span class="field-label required">{{ entry_empresa_id }}</span>
                  <select class="field-entry" name="fidelity_empresa_id">
                    {% if empresas|length > 1 %}
                      <option value=""></option>
                    {% endif %}
                    {% for empresa in empresas %}
                      <option value="{{ empresa.value }}" {{ empresa.choice }}>{{ empresa.description }}</option>
                    {% endfor %}
                  </select>
                  {% if error_fidelity_empresa_id %}
                    <span class="error">{{ error_fidelity_empresa_id }}</span>
                  {% endif %}
                </label>

                <label class="field field-medium bottom-padding-large">
                  <span class="field-label">{{ entry_quantity_points }}</span>
                  <span class="text-x-small text-gray bottom-padding-small visible-block">{{ text_quantity_points }}</span>
                  <input type="text" name="fidelity_mininum_points" class="field-entry mask-number" value="{{ fidelity_mininum_points }}"/>
                </label>

                <label class="field field-medium">
                  <span class="field-label">{{ entry_status_initial }}</span>
                  <span class="text-x-small text-gray bottom-padding-small visible-block">{{ text_status_initial }}</span>
                  <select class="field-entry" name="fidelity_status_initial">
                    {% for order_status in order_statuses %}
                      <option
                        value="{{ order_status.order_status_id }}"
                        {{ (order_status.order_status_id == fidelity_status_initial) ? 'selected="selected"' : '' }}
                      >
                        {{ order_status.name }}
                      </option>
                    {% endfor %}
                  </select>
                </label>

                <label class="field field-medium">
                  <span class="field-label">{{ entry_status_contemplado }}</span>
                  <span class="text-x-small text-gray bottom-padding-small visible-block">{{ text_status_contemplado }}</span>
                  <select class="field-entry" name="fidelity_status_contemplado">
                    {% for order_status in order_statuses %}
                      <option
                        value="{{ order_status.order_status_id }}"
                        {{ (order_status.order_status_id == fidelity_status_contemplado) ? 'selected="selected"' : '' }}
                      >
                        {{ order_status.name }}
                      </option>
                    {% endfor %}
                  </select>
                </label>

              </div>
            </div>
          </div>
        </div>


      </div>

      <div class="row hidden" data-tab="{{ tab_filter }}">
        <div class="col-xs-12 col-md-8">
          <div class="content-box">
            <div class="flex between-xs middle-xs bottom-padding-medium">
              <span class="text-x-large text-dark">{{ tab_filter }}</span>
              <button id="addFidelity" type="button" class="btn-default btn-medium btn-primary">
                <span>{{ button_add }}</span>
              </button>
            </div>
          </div>

          <div id="fidelity">
            {% if fidelity_module %}
              {% for key, fidelity_module in fidelity_module %}
                <div id="module-row{{ key }}" class="background-white shadow-small adm-focus-within padding-large bottom-margin-small js-fidelity">
                  <div class="row x-small-space-xs">
                    <div class="col-md">
                      <label class="field field-medium">
                        <span class="field-label">{{ entry_position }}</span>
                        <input type="hidden" name="fidelity_module[{{ key }}][layout_id]" value="{{ fidelity_module.layout_id }}">
                        <select class="field-entry" name="fidelity_module[{{ key }}][position]">
                          {% for key, position in positions %}
                            <option value="{{ key }}" {{ key == fidelity_module.position ? 'selected' : '' }} >
                              {{ position }}
                            </option>
                          {% endfor %}
                        </select>
                      </label>
                    </div>
                    <div class="col-md">
                      <label class="field field-medium">
                        <span class="field-label">{{ entry_status }}</span>
                        <select class="field-entry" name="fidelity_module[{{ key }}][status]">
                          {% for key, status in status %}
                            <option value="{{ key }}" {{ key == fidelity_module.status ? 'selected' : '' }} >
                              {{ status }}
                            </option>
                          {% endfor %}
                        </select>
                      </label>
                    </div>
                    <div class="col-md-width-auto">
                      <label class="field field-medium" style="width:64px;">
                        <span class="field-label">{{ entry_sort_order }}</span>
                        <input class="field-entry" type="text" name="fidelity_module[{{ key }}][sort_order]" value="{{ fidelity_module.sort_order }}" />
                      </label>
                    </div>
                    <div class="col-xs-12 col-md-width-auto">
                      <div class="padding-medium cursor-pointer top-margin-medium js-remove-fidelity" data-tooltip="Remover">
                        <i class="fas fa-trash text-gray"></i>
                      </div>
                    </div>
                  </div>
                </div>
              {% endfor %}
            {% endif %}
          </div>

        </div>

        <div class="col-xs-12 col-md-4">
          <div class="content-box background-white shadow-small padding-large">
            <div class="row">
              <div class="col-xs-12">
                <label class="content-box field field-medium">
                  <span class="field-label">{{ entry_filter_category }}</span>
                  <select class="field-entry" name="fidelity_category">
                    {% for status in fidelity_category_list %}
                      <option value="{{ status.value }}" {{ status.choice }}>{{ status.description }}</option>
                    {% endfor %}
                  </select>
                </label>
              </div>

              <div class="col-xs-12">
                <label class="content-box field field-medium">
                  <span class="field-label">{{ entry_filter_range }}</span>
                  <select class="field-entry" name="fidelity_range">
                    {% for status in fidelity_range_list %}
                      <option value="{{ status.value }}" {{ status.choice }}>{{ status.description }}</option>
                    {% endfor %}
                  </select>
                </label>
              </div>
            </div>
          </div>
        </div>

      </div>

      <div class="row hidden" data-tab="{{ tab_indication }}">
        <div class="col-xs-12 col-md-12">
          <div class="content-box">
            <div class="flex between-xs middle-xs bottom-padding-medium">
              <span class="text-x-large text-dark">{{ tab_indication }}</span>
            </div>
          </div>

          <div class="content-box background-white shadow-small padding-large">
            <div class="row">
              <div class="col-xs-12">
                <label class="field field-medium bottom-padding-large">
                  <span class="field-label">{{ entry_status }}</span>
                  <select class="field-entry" name="indication_status">
                      {% for status in indication_status_list %}
                        <option value="{{ status.value }}" {{ status.choice }}>{{ status.description }}</option>
                      {% endfor %}
                  </select>
                </label>
                <label class="field field-medium bottom-padding-large">
                  <span class="field-label">{{ entry_indication_points }}</span>
                  <span class="text-x-small text-gray bottom-padding-small visible-block">{{ text_indication_points }}</span>
                  <input type="text" name="indication_points" class="field-entry" value="{{ indication_points }}"/>
                </label>
              </div>
            </div>
          </div>
        </div>
      </div>
    {% endif %}


  </div>
</form>
<script>
  var entryPosition = '{{ entry_position }}',
    entryStatus = '{{ entry_status }}',
    fidelityLayoutId = '{{ fidelity_layout.layout_id }}';
    entrySortOrder = '{{ entry_sort_order }}',
    errorCeo = Boolean('{{ error_ceo.message }}');

</script>
{{ footer }}
