{{ header }}
<header class="background-white bottom-margin-large">
  <div class="container-fluid">
    <div class="row no-space-xs">
      <div class="col-xs-12">
        <div class="content-box vertical-padding-large flex between-xs middle-xs js-header-notifications">
          <div>
            <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 class="flex flex-row middle-xs">
            <div class="content-box padding-large flex">
              <a href="{{ cancel }}" class="btn-default btn-medium btn-outline right-margin-small">
                <span>{{ button_cancel }}</span>
              </a>
              <button class="btn-default btn-medium btn-primary js-submit-payment-form" data-url="{{ url_save }}" data-redirect="{{url_redirect_success}}">
                <span>{{ button_save }}</span>
              </button>
            </div>
          </div>
          {% if error_warning %}
            <div class="text-small full-width background-error text-error padding-medium bottom-margin-medium rounded-x-small">{{ error_warning }}</div>
          {% endif %}
          {% if success %}
            <div class="text-small full-width background-success text-success padding-medium bottom-margin-medium rounded-x-small">{{ success }}</div>
          {% endif %}
        </div>
      </div>
      <div class="col-xs-12">
        <div class="flex js-tabs" id="tab-info"></div>
      </div>
    </div>
  </div>
</header>
<form class="js-main-form">
  <div class="container-fluid" data-tabs-id="tab-info">

    <div class="row hidden" data-tab="{{ tab_general }}">
      <div class="col-xs-12">
        <div class="content-box">
          <span class="text-x-large text-dark">{{ tab_general }}</span>
        </div>
      </div>
      <div class="col-xs-12 col-md-8">
        <div class="background-white padding-large bottom-margin-medium shadow-small">
          <label class="field field-medium bottom-margin-large">
            <span class="field-label"><span class="required">*</span> {{ entry_token }}</span>
            <input type="text" name="yapay_token" class="field-entry" value="{{ yapay_token }}"/>
            {% if error_token %}
              <span class="error">{{ error_token }}</span>
            {% endif %}
          </label>
          <button type="button" class="btn-default btn-medium btn-primary bottom-margin-large js-validate-credentials" data-url="{{ url_validate_credentials }}">
            <span>{{ text_validate_credentials }}</span>
          </button>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_sufixo }}</span>
            <input type="text" name="yapay_sufixo" class="field-entry" value="{{ yapay_sufixo }}"/>
          </label>
          <label class="field field-medium">
            <span class="field-label">{{ entry_yapay_cnpj }}</span>
            <input type="text" name="yapay_cnpj" class="field-entry" value="{{ yapay_cnpj }}" readonly/>
          </label>
        </div>
      </div>
      <div class="col-xs-12 col-md-4">
        <div class="background-white padding-large bottom-margin-medium shadow-small">
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_status }}</span>
            <select class="field-entry js-sort-by-option" name="yapay_status">
              {% for status in status_list %}
                <option value="{{ status.value }}" {{ status.choice }}>{{ status.description }}</option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_ambiente }}</span>
            <select class="field-entry js-sort-by-option" name="yapay_ambiente">
              {% for environment in environment_list %}
                <option
                  value="{{ environment.value }}" {{ environment.choice }}>{{ environment.description }}</option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_payment_display }}</span>
            <select class="field-entry js-sort-by-option" name="yapay_display">
              {% for display_module_option in display_module_options %}
                <option value="{{ display_module_option.value }}" {{ display_module_option.choice }}>{{ display_module_option.description }}</option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_log_error }}</span>
            <select class="field-entry js-sort-by-option" name="yapay_log_error">
              {% for status in status_list_error %}
                <option value="{{ status.value }}" {{ status.choice }}>{{ status.description }}</option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order }}</span>
            <input type="text" name="yapay_order" class="field-entry mask-number" value="{{ yapay_order }}"/>
          </label>
          <label class="field field-medium">
            <span class="field-label">{{ entry_region }}</span>
            <select class="field-entry js-sort-by-option" name="yapay_region">
              <option value="0" {% if yapay_region ==0 %} selected {% endif %}>{{ text_all_zones }}</option>
              {% for geo_zone in geo_zones %}
                <option value="{{ geo_zone.id }}" {{ geo_zone.status }}>{{ geo_zone.name }}</option>
              {% endfor %}
            </select>
          </label>
        </div>

      </div>
    </div>


    <div class="row hidden" data-tab="{{ tab_settings_order_status }}">
      <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_settings_order_status }}</span>
          </div>
        </div>
        <div class="content-box background-white shadow-small padding-large flex">
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order_status_replicar }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_replicar">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_replicar) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order_status_waiting }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_waiting">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_waiting) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order_status_processing }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_processing">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_processing) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order_status_aproved }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_aproved">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_aproved) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order_status_canceled }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_canceled">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_canceled) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order_status_disputed }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_disputed">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_disputed) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium bottom-margin-large">
            <span class="field-label">{{ entry_order_status_monitoring }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_monitoring">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_monitoring) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium">
            <span class="field-label">{{ entry_order_status_reproved }}</span>
            <select class="field-entry field-entry-medium js-sort-by-option" name="yapay_order_status_reproved">
              {% for order_status in order_statuses %}
                <option
                  value="{{ order_status.order_status_id }}"
                  {{ (order_status.order_status_id == yapay_order_status_reproved) ? 'selected="selected"' : '' }}
                >
                  {{ order_status.name }}
                </option>
              {% endfor %}
            </select>
          </label>
        </div>
      </div>
    </div>

    <div class="row hidden" data-tab="{{ tab_settings_payments }}">

      <div class="col-xs-12">
        <div class="content-box">
          <span class="text-x-large text-dark">{{ tab_settings_payments }}</span>
        </div>
      </div>

      <div class="col-xs-12 col-md-4 last-md">
        <div class="content-box background-white shadow-small padding-large js-content-options">
          <label class="field field-medium bottom-margin-medium">
            <span class="field-label">{{ entry_desconto }}</span>
            <select class="field-entry js-discount-status" name="yapay_discount">
              {% for discount_list in discount_list %}
                {% if yapay_discount == discount_list.value %}
                  <option value="{{ discount_list.value }}" selected>{{ discount_list.description }}</option>
                {% else %}
                  <option value="{{ discount_list.value }}">{{ discount_list.description }}</option>
                {% endif %}
              {% endfor %}
            </select>
          </label>
          <label class="field field-medium">
            <span class="field-label">{{ entry_desconto_ordem }}</span>
            <input type="text" name="yapay_discount_order" mask="positiveInteger" class="field-entry js-number" value="{{ yapay_discount_order }}"/>
          </label>
        </div>
      </div>
      <div class="col-xs-12 col-md-8">
        <div class="content-box">
          <div class="background-white shadow-small padding-large js-content-options">
            {% for billet in billet %}
              <label class="checkbox checkbox-medium bottom-margin-small">
                <input type="checkbox" class="checkbox-entry js-check-options"
                        name="yapay_billet[{{ billet.value }}][descricao]"
                        value="{{ billet.description }}" {% if yapay_billet[billet.value].descricao %} checked {% endif %}>
                <span class="checkbox-text">{{ billet.description }}</span>
              </label>
              <div class="field-group-join hidden">
                <label class="field field-medium">
                  <span class="field-label">{{ text_title }}</span>
                  <input type="text" class="field-entry" name="yapay_billet[{{ billet.value }}][title]"
                          value="{{ yapay_billet[billet.value].title }}" mask="alphanumeric" maxlength="70" disabled>
                </label>
              </div>
              <div class="field-group-join top-margin-medium hidden">
                <label class="field field-medium">
                  <span class="field-label">{{ text_valor_minimo }}</span>
                  <input type="text" class="field-entry mask-money" name="yapay_billet[{{ billet.value }}][valor_minimo]"
                          value="{{ yapay_billet[billet.value].valor_minimo }}" mask="brazilCurrency" disabled>
                </label>
                <label class="field field-medium">
                  <span class="field-label">{{ text_validade }}</span>
                  <input type="text" class="field-entry mask-number" name="yapay_billet[{{ billet.value }}][validade]"
                          value="{{ yapay_billet[billet.value].validade }}" maxlength="1" disabled>
                </label>
                <label class="field field-medium">
                  <span class="field-label js-label">{{ text_desconto }} {{ yapay_billet[billet.value].tipo_desconto == 0 ? '(%)' : '(R$)' }}</span>
                  <input type="text" class="field-entry js-discount js-discount-value"
                          name="yapay_billet[{{ billet.value }}][desconto]"
                          value="{{ yapay_billet[billet.value].desconto }}"
                          disabled>
                </label>
                <label class="field field-medium">
                  <span class="field-label">{{ text_tipo_desconto }}</span>
                  <select class="field-entry js-discount js-type-discount" name="yapay_billet[{{ billet.value }}][tipo_desconto]"
                          disabled>
                    {% for discount_type in discount_type %}
                      {% if yapay_billet[billet.value].tipo_desconto == discount_type.value %}
                        <option value="{{ discount_type.value }}" selected>{{ discount_type.description }}</option>
                      {% else %}
                        <option value="{{ discount_type.value }}">{{ discount_type.description }}</option>
                      {% endif %}
                    {% endfor %}
                  </select>
                </label>
              </div>
            {% endfor %}
          </div>

          <span class="text-x-large text-dark visible-block top-margin-large bottom-margin-medium">
            {{ text_cartao_credito }}
          </span>

          <div class="background-white shadow-small padding-large">

            <div>
              <label class="field field-medium">
                <span class="field-label">{{ text_title }}</span>
                <input type="text" class="field-entry" name="yapay_credit_card_title" value="{{ yapay_credit_card_title }}" mask="alphanumeric" maxlength="70">
              </label>
            </div>
            <div class="flex nowrap-xs top-margin-large bottom-padding-large">
              <label for="" class="field field-medium left-margin-x-small">
                <span class="field-label">{{ entry_parcela_minima }}</span>
                <input class="field-entry mask-money" type="text" name="yapay_parcela_minima" value="{{ yapay_parcela_minima }}"  mask="brazilCurrency">
              </label>
              <label for="" class="field field-medium">
                <span class="field-label">{{ entry_yapay_parcela_qtdmax }}</span>
                <input class="field-entry js-number js-advanced-installments-number" mask="positiveInteger" maxlength="2" min="0" max="12" type="text" name="yapay_parcela_qtdmax" 
                value="{{ yapay_parcela_qtdmax }}">
              </label>
              <label for="" class="field field-medium right-margin-x-small field_installment_fee">
                <span class="field-label">{{ entry_yapay_parcela_juros }}</span>
                <input class="field-entry mask-percent" type="text" name="yapay_parcela_juros" mask="percentage" maxlength="6" value="{{ yapay_parcela_juros }}">
              </label>
            </div>
            <div>
              <label for="" class="field field-medium left-margin-x-small">
                <span class="field-label">{{ entry_yapay_config_parcelamento }}</span>
                <select class="field-entry js-advanced-installments-config" name="yapay_config_parcelamento" data-url="{{ url_parcelamento_config }}" data-modulo="yapay" >
                  {% for key, display in Type_ConfigParcelamento.getEnumList() %}
                    <option value="{{ key }}" {{ ftr_geral.isSelected(key, yapay_config_parcelamento) }}>{{ display }}</option>
                  {% endfor %}
                </select>
              </label>
            </div>

            <div class="flex nowrap-xs top-margin-large bottom-padding-large bottom-border-gray parcelamento-padrao">
              <label class="field field-medium bottom-margin-large">
                <span class="field-label">{{ entry_yapay_parcela_comdesconto }}</span>
                <input class="field-entry mask-number" type="text" name="yapay_parcela_comdesconto" mask="positiveInteger" maxlength="2" value="{{ yapay_parcela_comdesconto }}" />
              </label>
              <label class="field field-medium bottom-margin-large">
                <span class="field-label">{{ entry_yapay_parcela_desconto }}</span>
                <input class="field-entry mask-percent" type="text" name="yapay_parcela_desconto" mask="percentage" maxlength="6" value="{{ yapay_parcela_desconto }}" />
              </label>
              <label class="field field-medium bottom-margin-large">
                <span class="field-label">{{ entry_yapay_parcela_semjuros }}</span>
                <input class="field-entry mask-number" type="text" name="yapay_parcela_semjuros"  mask="positiveInteger" maxlength="2" value="{{ yapay_parcela_semjuros }}" />
              </label>
            </div>

            <div class="parcelamento-avancado bottom-margin-large"></div>

            {% for credit_card in credit_cards %}
              <div class="top-margin-large bottom-padding-large bottom-border-gray js-content-options js-credit-card-flag">
                <label class="checkbox checkbox-medium">
                  <input type="checkbox" class="checkbox-entry js-check-options"
                          name="yapay_credit_card[{{ credit_card.value }}][descricao]"
                          value="{{ credit_card.description }}" {% if yapay_credit_card[credit_card.value].descricao %} checked {% endif %}>
                  <span class="checkbox-text">{{ credit_card.description }}</span>
                </label>

                <div class="field-group-join hidden top-margin-small credit-flag-configs">
                  <label class="field field-medium">
                    <span class="field-label">{{ text_valor_minimo }}</span>
                    <input type="text" class="field-entry mask-money"
                            name="yapay_credit_card[{{ credit_card.value }}][valor_minimo]"
                            value="{{ yapay_credit_card[credit_card.value].valor_minimo }}" mask="brazilCurrency" disabled>
                  </label>
                  <label class="field field-medium">
                    <span class="field-label">{{ text_total_parcelas }}</span>
                    <select class="field-entry" name="yapay_credit_card[{{ credit_card.value }}][total_parcela]"
                            disabled>
                      <option value=""></option>
                      {% for i in 1..12 %}
                        {% if yapay_credit_card[credit_card.value].total_parcela == i %}
                          <option value="{{ i }}" selected>{{ i }}x</option>
                        {% else %}
                          <option value="{{ i }}">{{ i }}x</option>
                        {% endif %}
                      {% endfor %}
                    </select>
                  </label>
                  <label class="field field-medium">
                    <span class="field-label">{{ text_parcelas_sem_juros }}</span>
                    <select class="field-entry" name="yapay_credit_card[{{ credit_card.value }}][parcela_juros]"
                            disabled>
                      <option value=""></option>
                      {% for i in 1..12 %}
                        {% if yapay_credit_card[credit_card.value].parcela_juros == i %}
                          <option value="{{ i }}" selected>{{ i }}x</option>
                        {% else %}
                          <option value="{{ i }}">{{ i }}x</option>
                        {% endif %}
                      {% endfor %}
                    </select>
                  </label>
                </div>
                {% if error_total_parcela[credit_card.value].total_parcela %}
                  <span class="text-error text-small">{{ error_total_parcela[credit_card.value].total_parcela }}</span>
                {% endif %}
              </div>
            {% endfor %}
          </div>

          <span class="text-x-large text-dark visible-block top-margin-large bottom-margin-medium">
            {{ text_transferencia_bancaria }}
          </span>

          <div class="background-white shadow-small padding-large">

            <div class="bottom-padding-large bottom-border-gray">
              <label class="field field-medium">
                <span class="field-label">{{ text_title }}</span>
                <input type="text" class="field-entry" name="yapay_bank_transfer_title" mask="alphanumeric" maxlength="70"
                        value="{{ yapay_bank_transfer_title }}">
              </label>
            </div>

            {% for bank_transfer in bank_transfers %}
              <div class="top-margin-large bottom-padding-large bottom-border-gray js-content-options">
                <label class="checkbox checkbox-medium">
                  <input type="checkbox" class="checkbox-entry js-check-options js-check-bank"
                          name="yapay_bank_transfer[{{ bank_transfer.value }}][descricao]"
                          value="{{ bank_transfer.description }}" {% if yapay_bank_transfer[bank_transfer.value].descricao %} checked {% endif %}>
                  <span class="checkbox-text">{{ bank_transfer.description }}</span>
                </label>

                <div class="field-group-join top-margin-small hidden">
                  <label class="field field-medium">
                    <span class="field-label">{{ text_valor_minimo }}</span>
                    <input type="text" class="field-entry mask-money"
                            name="yapay_bank_transfer[{{ bank_transfer.value }}][valor_minimo]"
                            mask="brazilCurrency"
                            value="{{ yapay_bank_transfer[bank_transfer.value].valor_minimo }}" disabled>
                  </label>
                  <label class="field field-medium">
                    <span class="field-label js-label">{{ text_desconto }} {{ yapay_bank_transfer[yapay_bank_transfer.value].tipo_desconto == 0 ? '(%)' : '(R$)' }}</span>
                    <input type="text" class="field-entry js-discount js-discount-value"
                            name="yapay_bank_transfer[{{ bank_transfer.value }}][desconto]"
                            value="{{ yapay_bank_transfer[bank_transfer.value].desconto }}" disabled>
                  </label>
                  <label class="field field-medium">
                    <span class="field-label">{{ text_tipo_desconto }}</span>
                    <select class="field-entry js-discount js-type-discount" name="yapay_bank_transfer[{{ bank_transfer.value }}][tipo_desconto]"
                            disabled>
                      {% for discount_type in discount_type %}
                        {% if yapay_bank_transfer[bank_transfer.value].tipo_desconto == discount_type.value %}
                          <option value="{{ discount_type.value }}" selected>{{ discount_type.description }}</option>
                        {% else %}
                          <option value="{{ discount_type.value }}">{{ discount_type.description }}</option>
                        {% endif %}
                      {% endfor %}
                    </select>
                  </label>
                </div>
              </div>
            {% endfor %}
          </div>

        </div>
      </div>

    </div>

  </div>
</form>

{{ footer }}
