{{ header }}
<header class="background-white bottom-margin-large" data-info='{"titleModules": "{{ constant('Type_TitleModules::Tp_Config') }}", "urlRetorno": "{{ urlretorno }}", "urlFilter": "{{ filter.filter }}" }'>
  <div class="container-fluid">
    <div class="row no-space-xs">
      <div class="col-xs-12">
        <div class="content-box vertical-padding-large js-header-notifications">
          <span class="text-x-large text-dark">{{ text_heading_title_question }}</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>
          {% if error_warning %}<div class="warning full-width">{{ error_warning }}</div>{% endif %}
        </div>
      </div>
    </div>
  </div>
</header>
<div class="container-fluid">
  <div class="row no-space-xs flex between-xs bottom-xs">
    <div class="col-xs">
      <div class="content-box flex middle-xs bottom-xs">
        <label class="field field-medium right-margin-large" style="max-width: 240px">
          <span class="field-label">Organizar por:</span>
          <select class="field-entry js-sort-by-option" name="select_sort_by" >
            {% for select_sort in select_sort_by %}
              <option data-type="{{ select_sort.type }}" data-href="{{ select_sort.href }}" {{ select_sort.selected }} value="{{ select_sort.value }}">{{ select_sort.text }}</option>
            {% endfor %}
          </select>
        </label>
        {% for select_order in select_order_by %}
          <label class="radio radio-medium radio-inline {{ select_order.type }}">
            <input type="radio" name="order_by" data-href="{{ select_order.href }}" {{ select_order.checked }} class="radio-entry js-order-by-sequence" value="{{ select_order.value }}">
            <span class="radio-text order-by-option-one js-order-by-sequence-text-{{ select_order.value }}">{{ select_order.text }}</span>
          </label>
        {% endfor %}
      </div>
    </div>
    <div class="col-xs-width-auto">
      <div class="content-box">
        {% if filter.count >= 1 %}
          <a class="text-small text-primary text-decoration-none padding-medium" href="index.php?route=module/mercadolivre/question&token={{ token }}&type={{ constant('Type_TitleModules::Tp_Config') }}">
          {{ text_cleaning_filters }} ({{ filter.count }})
          </a>
        {% endif %}
        <button type="button" class="btn-default btn-medium-square btn-primary js-suspended-side-control" id="suspended-side-filter">
          <i class="fas fa-filter"></i>
          <span class="text-small">{{ button_filter }}</span>
        </button>
      </div>
    </div>
  </div>
  {% if questions %}
    <div class="row top-margin-large no-space-xs">
      {% for question in questions %}
        <div class="col-xs-12">
            <div class="content-box background-white shadow-small hover:shadow-large bottom-margin-small horizontal-padding-medium">
                <a href="{{ question.href }}" class="row text-decoration-none no-space-xs vertical-padding-medium middle-xs">
                  <div class="col-xs-12 col-sm-2">
                    <div class="content-box">
                      <span class="text-small text-dark text-bold">#{{ question.mercaId }}</span>
                    </div>
                  </div>
                  <div class="col-xs-12 col-sm-2">
                    <div class="content-box">
                      <span class="text-small text-dark">{{ question.list_question }}</span>
                    </div>
                  </div>
                  <div class="col-xs-12 col-sm-6">
                    <div class="content-box right-padding-medium">
                      <span class="text-small text-dark">{{ question.name }}</span>
                    </div>
                  </div>
                  <div class="col-xs-12 col-sm-2">
                    <div class="content-box">
                      <span class="text-small text-dark">#{{ question.product_id }}</span>
                    </div>
                  </div>
                </a>
            </div>
        </div>
      {% endfor %}
    </div>
    <div class="row">
      <div class="col-xs-12">
        <div class="content-box">
          {{ pagination }}
        </div>
      </div>
    </div>
  {% else %}
    <div class="row">
      <div class="col-xs-12">
        <div class="content-box background-white shadow-small vertical-padding-x-large horizontal-padding-large text-center">
          <span class="text-medium text-gray">{{ text_no_results }}</span>
        </div>
      </div>
    </div>
  {% endif %}
</div>
<form class="js-filter">
  <div class="adm-suspended-side background-white shadow-large flex flex-column auto-overflow js-suspended-side js-suspended-side-filter">
    <div class="horizontal-padding-large top-padding-large bottom-padding-small flex between-xs middle-xs js-suspended-side-close">
      <span class="text-x-large text-dark">{{ text_filters }}</span>
      <i class="fas fa-times text-medium text-gray padding-small cursor-pointer"></i>
    </div>
    <div class="adm-suspended-side-content top-padding-large horizontal-padding-large">
      <label class="field field-medium">
        <span class="field-label" for="filter_mercaid">{{ text_filter_product_ml_id }}</span>
        <input class="field-entry" type="text" id="filter_mercaid" name="filter_mercaid" value="{{ filter_mercaid }}" />
      </label>
      <div class="field-group top-margin-medium">
          <label class="field-label" for="filter_model">{{ text_cod_prod }}</label>
          <div class="field-entry-group">
            <select class="field-entry field-entry-medium" name="filter_content_model" id="filter_content_model">
              {% for key, value in content_model %}
                <option value="{{ value.content_model_id }}" {{ value.content_model_status }} >{{ value.content_model_name }}</option>
              {% endfor %}
            </select>
            <input class="field-entry field-entry-medium ui-autocomplete-input" type="text" name="filter_model" id="filter_model" value="{{ filter_model }}" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true">
          </div>
        </div>
      <div class="field-group top-margin-medium">
          <label class="field-label" for="filter_data">{{ text_date_creatd }}</label>
          <div class="field-entry-group">
            <input class="field-entry field-entry-medium hasDatePicker" type="text" name="filter_data_start" id="filter_data_start" value="{{ filter_data_start }}" placeholder="{{ text_placeholder_start }}">
            <input class="field-entry field-entry-medium hasDatePicker" type="text" name="filter_data_end" id="filter_data_end" value="{{ filter_data_end }}" placeholder="{{ text_placeholder_end }}">
          </div>
      </div>
      <div class="top-margin-medium">
        <span class="text-small text-dark text-bold visible-block">{{ text_filter_questions }}</span>
        <label class="radio radio-medium">
          <input class="radio-entry" type="radio" name="filter_question_status" value="*" {% if filter_question_status is defined %} checked {% endif %}>
          <span class="radio-text">{{ text_both }}</span>
        </label>
        {% for key, value in contentQuestions %}
        <label class="radio radio-medium">
          <input class="radio-entry" type="radio" name="filter_question_status" value="{{ value.content_question_id }}" {{ value.content_question_status }}>
          <span class="radio-text">{{ value.content_question_name }}</span>
        </label>
        {% endfor %}
      </div>
    </div>
    <div class="padding-large">
      <button type="submit" class="btn-default btn-medium btn-full btn-primary">
        <span>{{ button_filter }}</span>
      </button>
    </div>
  </div>
</form>
{{ footer }}
