{{ header_minimalist }}

<div id="root">
  <div class="page-loader" v-if="isLoading"></div>
  <section ref="infoMandatory" id="information-mandatory" class="container-fluid vertical-padding-x-large" style="overflow-x:hidden;">
    <div class="row center-xs">
      <div class="col-xs-12 col-sm-8 col-md-5">
        <div class="content-box">

          <validation-observer
            tag="div"
            ref="validationObserver"
            v-slot="{ handleSubmit }"
          >
            <h1 class="heading-1">{ text_account } </h1>
            <p class="top-margin-small text-medium">
              { name } ({document}) { text_info }
            </p>
            <form
              id="form-information"
              ref="form"
              @submit.prevent="handleSubmitForm(handleSubmit)"
              :action="action"
              method="post"
              autocomplete="off"
            >

              <base-alert
                v-show="alert.type"
                :apperance="alert.type"
                @close="alert = {}">
                <span v-text="alert.message"></span>
              </base-alert>

              <validation-provider
                tag="div"
                class="col-xs-12"
                rules="required|cellphone"
                name="celular"
                v-slot="{ errors, valid }"
              >
                <base-input
                  type="tel"
                  name="celular"
                  :label="entry_celular"
                  v-model="celular"
                  maxlength="32"
                  required
                  mask="cellphone"
                  :error="errors[0]"
                  :valid="valid"
                  :disabled="disableForm"
                ></base-input>
              </validation-provider>

              <base-button
                type="submit"
                full
                :disabled="disableForm"
                :loading="btnSubmitLoading"
                class="top-margin-x-large"
              >
                { button_continue }
              </base-button>

            </form>

          </validation-observer>

        </div>

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

<script>
  const DATA = {{ dataVue|json_encode() }};
</script>