{% extends 'base/module.twig' %}

{% block content %}

  <div class="container-fluid">
    <div class="row">
      <div class="col-xs-12">
        <div v-show="tabs[0].active">
          <div class="row">
            <div class="col-xs-12 col-sm-8">
              <base-card class="padding-large">

                <div class="bottom-margin-large">
                  <span class="text-small text-dark text-bold visible-block">{ text_notification }</span>
                  <span class="text-small text-gray visible-block bottom-margin-small text-word-wrap">{ url_callback }</span>
                  <base-button
                    apperance="outline"
                    size="small"
                    @click.native="copyLink()"
                  >
                    { textCopy }
                  </base-button>
                </div>

                <base-input
                  class="bottom-margin-medium"
                  :label="text_cnpj"
                  name="pagarme_cnpj"
                  disabled
                  mask="cnpj"
                  v-model="configurations.pagarme_cnpj"
                  required
                >
                </base-input>

                <validation-provider
                  tag="div"
                  :rules="configurations.pagarme_status == 1 ? 'required' : ''"
                  class="top-margin-large"
                  name="pagarme_client_id"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_client_id"
                    name="pagarme_client_id"
                    type="password"
                    maxlength="70"
                    mask="alphanumeric"
                    :secret="true"
                    v-model="configurations.pagarme_client_id"
                    :error="errors[0]"
                    :valid="valid"
                    required>
                  </base-input>
                </validation-provider>

                <validation-provider
                  tag="div"
                  :rules="configurations.pagarme_status == 1 ? 'required' : ''"
                  class="top-margin-large"
                  name="pagarme_client_public"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_client_public"
                    name="pagarme_client_public"
                    type="password"
                    maxlength="70"
                    mask="alphanumeric"
                    :secret="true"
                    v-model="configurations.pagarme_client_public"
                    :error="errors[0]"
                    :valid="valid"
                    required>
                  </base-input>
                </validation-provider>

                <validation-provider
                  tag="div"
                  :rules="configurations.pagarme_status == 1 ? 'required' : ''"
                  class="top-margin-large"
                  name="pagarme_client_secret"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_client_secret"
                    type="password"
                    :secret="true"
                    maxlength="70"
                    mask="alphanumeric"
                    name="pagarme_client_secret"
                    v-model="configurations.pagarme_client_secret"
                    :error="errors[0]"
                    :valid="valid"
                    required>
                  </base-input>
                </validation-provider>

                <validation-provider
                  tag="div"
                  :rules="configurations.pagarme_status == 1 ? 'required|max:13|min:0' : ''"
                  class="top-margin-large"
                  name="pagarme_statement_descriptor"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_statement_descriptor"
                    type="texts"
                    :description="text_statement_descriptor_description"
                    maxlength="13"
                    mask="alphanumeric"
                    name="pagarme_statement_descriptor"
                    v-model="configurations.pagarme_statement_descriptor"
                    :error="errors[0]"
                    :valid="valid"
                    required>
                  </base-input>
                </validation-provider>
              </base-card>
            </div>
            <div class="col-xs-12 col-sm-4">
              <base-card class="padding-large">

                <validation-provider
                  tag="div"
                  rules="required"
                  name="pagarme_status"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_status"
                    name="pagarme_status"
                    v-model="configurations.pagarme_status"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(value, key) in Type_Status"
                      :key="key"
                      :value="key">
                      { value }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  rules="required"
                  class="top-margin-large"
                  name="pagarme_display"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_display_in"
                    name="pagarme_display"
                    v-model="configurations.pagarme_display"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(value, key) in Type_DisplayModuleOption"
                      :key="key"
                      :value="key">
                      { value }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  rules="required"
                  class="top-margin-large"
                  name="pagarme_log_error"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_log_error"
                    name="pagarme_log_error"
                    v-model="configurations.pagarme_log_error"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(value, key) in Type_Status"
                      :key="key"
                      :value="key">
                      { value }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_order"
                    name="pagarme_order"
                    maxlength="2"
                    v-model="configurations.pagarme_order"
                    mask="integer"
                    :error="errors[0]"
                    :valid="valid">
                  </base-input>
                </validation-provider>

                <validation-provider
                  tag="div"
                  rules="required"
                  class="top-margin-large"
                  name="pagarme_region"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_region"
                    name="pagarme_region"
                    v-model="configurations.pagarme_region"
                    :error="errors[0]"
                    :valid="valid">
                    <option value="0">{ text_all }</option>
                    <option
                      v-for="(geo_zone, key) in geo_zones"
                      :key="geo_zone.geo_zone_id"
                      :value="geo_zone.geo_zone_id">
                      { geo_zone.name }
                    </option>
                  </base-select>
                </validation-provider>
              </base-card>
            </div>
          </div>
        </div>
        <div v-show="tabs[1].active">
          <div class="row">
            <div class="col-xs-12 col-sm-8">
              <base-card class="padding-large">

                <validation-provider
                  tag="div"
                  name="pagarme_order_status_replicar"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_status_replicar"
                    name="pagarme_order_status_replicar"
                    v-model="configurations.pagarme_order_status_replicar"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_pending"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_waiting_payment"
                    name="pagarme_order_status_pending"
                    v-model="configurations.pagarme_order_status_pending"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_approved"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_approved"
                    name="pagarme_order_status_approved"
                    v-model="configurations.pagarme_order_status_approved"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_paid"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_paid"
                    name="pagarme_order_status_paid"
                    v-model="configurations.pagarme_order_status_paid"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_reproved"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_reproved"
                    name="pagarme_order_status_reproved"
                    v-model="configurations.pagarme_order_status_reproved"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_canceled"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_canceled"
                    name="pagarme_order_status_canceled"
                    v-model="configurations.pagarme_order_status_canceled"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_error"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_error"
                    name="pagarme_order_status_error"
                    v-model="configurations.pagarme_order_status_error"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_denied"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_denied"
                    name="pagarme_order_status_denied"
                    v-model="configurations.pagarme_order_status_denied"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_refunded"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_refunded"
                    name="pagarme_order_status_refunded"
                    v-model="configurations.pagarme_order_status_refunded"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_chargeback"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_chargeback"
                    name="pagarme_order_status_chargeback"
                    v-model="configurations.pagarme_order_status_chargeback"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_pending_refuded"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_pending_refuded"
                    name="pagarme_order_status_pending_refuded"
                    v-model="configurations.pagarme_order_status_pending_refuded"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_authorized_pending_capture"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_authorized_pending_capture"
                    name="pagarme_order_status_authorized_pending_capture"
                    v-model="configurations.pagarme_order_status_authorized_pending_capture"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_captured"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_captured"
                    name="pagarme_order_status_captured"
                    v-model="configurations.pagarme_order_status_captured"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_partial_capture"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_partial_capture"
                    name="pagarme_order_status_partial_capture"
                    v-model="configurations.pagarme_order_status_partial_capture"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_waiting_capture"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_waiting_capture"
                    name="pagarme_order_status_waiting_capture"
                    v-model="configurations.pagarme_order_status_waiting_capture"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_partial_refunded"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_partial_refunded"
                    name="pagarme_order_status_partial_refunded"
                    v-model="configurations.pagarme_order_status_partial_refunded"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_partial_void"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_partial_void"
                    name="pagarme_order_status_partial_void"
                    v-model="configurations.pagarme_order_status_partial_void"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_error_on_voiding"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_error_on_voiding"
                    name="pagarme_order_status_error_on_voiding"
                    v-model="configurations.pagarme_order_status_error_on_voiding"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_error_on_refunding"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_error_on_refunding"
                    name="pagarme_order_status_error_on_refunding"
                    v-model="configurations.pagarme_order_status_error_on_refunding"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_waiting_cancellation"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_waiting_cancellation"
                    name="pagarme_order_status_waiting_cancellation"
                    v-model="configurations.pagarme_order_status_waiting_cancellation"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_with_error"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_with_error"
                    name="pagarme_order_status_with_error"
                    v-model="configurations.pagarme_order_status_with_error"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_failed"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_failed"
                    name="pagarme_order_status_failed"
                    v-model="configurations.pagarme_order_status_failed"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_processing"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_processing"
                    name="pagarme_order_status_processing"
                    v-model="configurations.pagarme_order_status_processing"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

              </base-card>
            </div>
          </div>
          <div class="row">
            <div class="col-xs-12 col-sm-8">
              <base-card class="padding-large">
                <span v-text="text_billet" class="text-medium text-bold top-margin-large" ></span>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_billetunderpaid"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_billetunderpaid"
                    :description="descript_billetunderpaid"
                    name="pagarme_order_status_billetunderpaid"
                    v-model="configurations.pagarme_order_status_billetunderpaid"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_order_status_billetoverpaid"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_billetoverpaid"
                    :description="descript_billetoverpaid"
                    name="pagarme_order_status_billetoverpaid"
                    v-model="configurations.pagarme_order_status_billetoverpaid"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(order_status, key) in order_statuses"
                      :key="order_status.order_status_id"
                      :value="order_status.order_status_id">
                      { order_status.name }
                    </option>
                  </base-select>
                </validation-provider>
              </base-card>

            </div>
          </div>
        </div>
        <div v-show="tabs[2].active">
          <div class="row">

            <div class="col-xs-12 col-sm-8">
              <base-card  class="padding-large">
                <validation-provider
                  tag="div"
                  name="pagarme_billet_status"
                  v-slot="{ errors, valid }">
                  <base-checkbox
                    :label="text_billet"
                    name="pagarme_billet_status"
                    v-model="configurations.pagarme_billet.status"
                    value="1"
                    unchecked-value="0">
                  </base-checkbox>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  :rules="configurations.pagarme_billet.status == 1  ? 'required': ''"
                  name="pagarme_billet_title"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_title"
                    name="pagarme_billet_title"
                    mask="alphanumeric"
                    maxlength="70"
                    v-model="configurations.pagarme_billet.title"
                    :error="errors[0]"
                    :valid="valid">
                  </base-input>
                </validation-provider>

                <div class="row small-space-xs bottom-xs top-margin-large">

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    :rules="configurations.pagarme_billet.status == 1  ? 'required': ''"
                    name="pagarme_billet_valor_minimo"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_min_value"
                      name="pagarme_billet_valor_minimo"
                      v-model="configurations.pagarme_billet.valor_minimo"
                      mask="brazilCurrency"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    :rules="configurations.pagarme_billet.status == 1  ? {required: true, min_value: {min: 1}}: ''"
                    name="pagarme_billet_validade"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_validity"
                      name="pagarme_billet_validade"
                      v-model="configurations.pagarme_billet.validade"
                      maxlength="3"
                      mask="positiveInteger"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    name="pagarme_billet_desconto"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_discount"
                      name="pagarme_billet_desconto"
                      v-model="configurations.pagarme_billet.desconto"
                      :disabled="!parseBoolean(configurations.pagarme_discount)"
                      :mask="pagarmeDescontoBoleto"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    :rules="configurations.pagarme_billet.status == 1  ? 'required': ''"
                    name="pagarme_billet_tipo_desconto"
                    v-slot="{ errors, valid }">
                    <base-select
                      name="pagarme_billet_tipo_desconto"
                      :label="text_discount_type"
                      v-model="configurations.pagarme_billet.tipo_desconto"
                      :disabled="!parseBoolean(configurations.pagarme_discount)"
                      :valid="valid"
                      :error="errors[0]">
                      <option
                        v-for="(value, key) in Type_MarketplaceAdjustmentPrice"
                        :key="key"
                        :value="key">
                        { value }
                      </option>
                    </base-select>
                  </validation-provider>
                </div>
                <div class="row" >
                  <span v-text="text_banco" class="col-xs-12 top-margin-large" ></span>

                  <base-radio
                    name="pagarme_bank"
                    :label="text_brasil"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="001"
                    value-checked="001"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_santander"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="033"
                    value-checked="033"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_caixa"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="104"
                    value-checked="104"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_stone"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="197"
                    value-checked="197"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_pagar"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="198"
                    value-checked="198"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_bradesco"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="237"
                    value-checked="237"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_itau"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="341"
                    value-checked="341"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_JP"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="376"
                    value-checked="376"
                    inline
                  ></base-radio>
                  <base-radio
                    name="pagarme_bank"
                    :label="text_cit"
                    v-model="configurations.pagarme_bank"
                    required
                    :disabled="disableForm"
                    value="745"
                    value-checked="745"
                    inline
                  ></base-radio>
                </div>
              </base-card>
            </div>
            <div class="col-xs-12 col-sm-4">
              <base-card class="padding-large">

                <validation-provider
                  tag="div"
                  name="pagarme_discount"
                  v-slot="{ errors, valid }">
                  <base-select
                    :label="text_discount"
                    name="pagarme_discount"
                    v-model="configurations.pagarme_discount"
                    :error="errors[0]"
                    :valid="valid">
                    <option
                      v-for="(value, key) in Type_Status"
                      :key="key"
                      :value="key">
                      { value }
                    </option>
                  </base-select>
                </validation-provider>

                <validation-provider
                  tag="div"
                  class="top-margin-large"
                  name="pagarme_discount_order"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_order_discount"
                    name="pagarme_discount_order"
                    v-model="configurations.pagarme_discount_order"
                    mask="integer"
                    maxlength="2"
                    :error="errors[0]"
                    :valid="valid">
                  </base-input>
                </validation-provider>

              </base-card>
            </div>

            {# Informações de pagamento com PIX #}
            <div class="col-xs-12 col-sm-8">
              <base-card class="padding-large top-margin-large">
                <validation-provider
                  tag="div"
                  name="pagarme_pix_status"
                  v-slot="{ errors, valid }">
                  <base-checkbox
                    :label="text_pix"
                    name="pagarme_pix_status"
                    v-model="configurations.pagarme_pix.status"
                    value="1"
                    unchecked-value="0">
                  </base-checkbox>
                </validation-provider>

                <validation-provider
                  tag="div"
                  name="pagarme_pix_title"
                  :rules="configurations.pagarme_pix.status == 1  ? 'required': ''"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_title"
                    name="pagarme_credit_card_title"
                    mask="alphanumeric"
                    maxlength="70"
                    v-model="configurations.pagarme_pix.title"
                    :error="errors[0]"
                    :valid="valid">
                  </base-input>
                </validation-provider>

                <validation-provider
                  tag="div"
                  name="pagarme_expires_at"
                  :rules="configurations.pagarme_pix.status == 1 ? 'required': ''"
                  v-slot="{ errors, valid }">
                  <base-input
                    class="top-margin-large"
                    name="pagarme_expires_at"
                    :label="text_expire"
                    :description="text_description_expire"
                    :error="errors[0]"
                    maxlength="2"
                    :valid="valid"
                    mask="number"
                    v-model="configurations.pagarme_pix.expires_at">
                  </base-input>
                </validation-provider>

              </base-card>
            </div>

            <div class="col-xs-12 col-sm-8">

              <base-card class="padding-large top-margin-large">
                <span class="text-x-large text-dark visible-block top-margin-large bottom-margin-medium">{{ text_credit_card }}</span>
                <validation-provider
                  tag="div"
                  name="pagarme_credit_card_title"
                  v-slot="{ errors, valid }">
                  <base-input
                    :label="text_title"
                    name="pagarme_credit_card_title"
                    mask="alphanumeric"
                    maxlength="70"
                    v-model="configurations.pagarme_credit_card_title"
                    :error="errors[0]"
                    :valid="valid">
                  </base-input>
                </validation-provider>

                <div class="row small-space-xs bottom-xs top-margin-large">

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    name="pagarme_credit_card_parcela_minima"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_installment_min_value"
                      name="pagarme_credit_card_parcela_minima"
                      v-model="configurations.pagarme_parcela_minima"
                      mask="brazilCurrency"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    :rules="configurations.pagarme_status == 1 ? 'required' : ''"
                    name="pagarme_parcela_qtdmax"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_installments_qty_max"
                      name="pagarme_parcela_qtdmax"
                      v-model="configurations.pagarme_parcela_qtdmax"
                      mask="positiveInteger"
                      maxlength="3"
                      :error="errors[0]"
                      :valid="valid"
                      required>
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    :class="(configurations.pagarme_config_parcelamento == Type_ConfigParcelamento.PorParcela) ? 'hidden' : 'col-xs'"
                    name="pagarme_credit_card_porcentagem_juros"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_interest"
                      name="gpagarme_credit_card_porcentagem_juros"
                      v-model="configurations.pagarme_parcela_juros"
                      mask="percentage"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>
                </div>

                <div class="row small-space-xs bottom-xs top-margin-large">

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    name="pagarme_credit_card_config_parcelamento"
                    v-slot="{ errors, valid }">
                    <base-select
                      name="pagarme_credit_card_config_parcelamento"
                      :label="text_installment_config_type"
                      v-model="configurations.pagarme_config_parcelamento"
                      :valid="valid"
                      :error="errors[0]">
                      <option
                        v-for="(value, key) in Type_ConfigParcelamento.getEnumList()"
                        :key="key"
                        :value="key">
                        { value }
                      </option>
                    </base-select>
                  </validation-provider>
                </div>

                <div v-if="(configurations.pagarme_config_parcelamento == Type_ConfigParcelamento.Padrao)"
                     class="row small-space-xs bottom-xs top-margin-large">

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    name="pagarme_credit_card_parcela_comdesconto"
                    :rules="{required: true, max_value: {max: configurations.pagarme_parcela_qtdmax}}"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_installments_with_discount"
                      name="pagarme_credit_card_parcela_comdesconto"
                      v-model="configurations.pagarme_parcela_comdesconto"
                      mask="positiveInteger"
                      maxlength="3"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    name="pagarme_credit_card_parcela_desconto"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_discount_number"
                      name="pagarme_credit_card_parcela_desconto"
                      v-model="configurations.pagarme_parcela_desconto"
                      mask="percentage"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    name="pagarme_credit_card_parcela_semjuros"
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_installments_without_interest"
                      name="pagarme_credit_card_parcela_semjuros"
                      v-model="configurations.pagarme_parcela_semjuros"
                      mask="positiveInteger"
                      maxlength="3"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>
                </div>

                <div v-if="(configurations.pagarme_config_parcelamento == Type_ConfigParcelamento.PorParcela)"
                     v-for="(value, keyParcela) in configurations.pagarme_parcelamento_configs"
                     class="row small-space-xs bottom-xs top-margin-large">

                  <div class="col-xs-12">
                    <span class="field-label">{text_parcela} {keyParcela+1}: </span>
                  </div>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    :name=`configurations.pagarme_parcelamento_configs[${keyParcela}].val_minimo`
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_installment_min_total"
                      :name=`configurations.pagarme_parcelamento_configs[${keyParcela}].val_minimo`
                      v-model="configurations.pagarme_parcelamento_configs[keyParcela].val_minimo"
                      mask="brazilCurrency"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    :name=`configurations.pagarme_parcelamento_configs[${keyParcela}].tipo_calculo`
                    v-slot="{ errors, valid }">
                    <base-select
                      :name=`configurations.pagarme_parcelamento_configs[${keyParcela}].tipo_calculo`
                      :label="text_installment_calc_type"
                      v-model="configurations.pagarme_parcelamento_configs[keyParcela].tipo_calculo"
                      :valid="valid"
                      :error="errors[0]">
                      <option
                        v-for="(value, key) in Type_CalculoParcelamento.getEnumList()"
                        :key="key"
                        :value="key">
                        { value }
                      </option>
                    </base-select>
                  </validation-provider>

                  <validation-provider
                    tag="div"
                    class="col-xs"
                    :name=`configurations.pagarme_parcelamento_configs[${keyParcela}].percentual_calculo`
                    v-slot="{ errors, valid }">
                    <base-input
                      :label="text_installment_percent"
                      :name=`configurations.pagarme_parcelamento_configs[${keyParcela}].percentual_calculo`
                      v-model="configurations.pagarme_parcelamento_configs[keyParcela].percentual_calculo"
                      mask="percentage"
                      :error="errors[0]"
                      :valid="valid">
                    </base-input>
                  </validation-provider>
                </div>

                <div v-for="(value, key) in configurations.pagarme_credit_card" :key="key" class="row small-space-xs bottom-xs top-margin-small bottom-border-gray">
                  <div class="top-margin-large bottom-padding-small col-xs-12">
                    <validation-provider
                      tag="div"
                      :name=`pagarme_status_${value.descricao}`
                      v-slot="{ errors, valid }">
                      <base-checkbox
                        class="text-capitalize"
                        :label="value.descricao"
                        :name=`pagarme_status_${value.descricao}`
                        v-model="configurations.pagarme_credit_card[key].status"
                        :checked="value.status"
                        value="1"
                        unchecked-value="0">
                      </base-checkbox>
                    </validation-provider>
                  </div>

                  <div v-if="(configurations.pagarme_config_parcelamento == Type_ConfigParcelamento.PorBandeira)"
                       class="row small-space-xs bottom-xs col-xs">
                    <validation-provider
                      tag="div"
                      class="col-xs"
                      :name=`pagarme_valor_minimo_${value.descricao}`
                      v-slot="{ errors, valid }">
                      <base-input
                        :label="text_min_value"
                        :name=`pagarme_valor_minimo_${value.descricao}`
                        v-model="configurations.pagarme_credit_card[key].valor_minimo"
                        mask="brazilCurrency"
                        :error="errors[0]"
                        :valid="valid">
                      </base-input>
                    </validation-provider>

                    <validation-provider
                      tag="div"
                      class="col-xs"
                      :name=`pagarme_total_parcela_${value.descricao}`
                      v-slot="{ errors, valid }">
                      <base-select
                        :name=`pagarme_total_parcela_${value.descricao}`
                        :label="text_installments_total"
                        v-model="configurations.pagarme_credit_card[key].total_parcela"
                        :valid="valid"
                        :error="errors[0]">
                        <option
                          v-for="index in 12"
                          :key="index"
                          :value="index">
                          { index + 'x' }
                        </option>
                      </base-select>
                    </validation-provider>

                    <validation-provider
                      tag="div"
                      class="col-xs"
                      :name=`pagarme_parcela_juros_interest_${value.descricao}`
                      v-slot="{ errors, valid }">
                      <base-select
                        :name=`pagarme_parcela_juros_${value.descricao}`
                        :label="text_installments_without_interest"
                        v-model="configurations.pagarme_credit_card[key].parcela_juros"
                        :valid="valid"
                        :error="errors[0]">
                        <option
                          v-for="index in 12"
                          :key="index"
                          :value="index">
                          { index + 'x' }
                        </option>
                      </base-select>
                    </validation-provider>

                  </div>
                </div>

              </base-card>
            </div>
          </div>
        </div>
        <div v-show="tabs[3].active">
          <div class="row">
            <div class="col-xs-12 col-sm-8">
              <base-card class="padding-large">

                <base-textarea
                  :label="text_instrucao"
                  name="pagarme_instrucao"
                  maxheight="180px"
                  type="text"
                  v-model="configurations.pagarme_instrucao"
                  rows="4"
                  :maxlength="maxlengthTextarea"
                  >
                </base-textarea>

              </base-card>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>

{% endblock %}
