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

{% block main_content %}

  <validation-observer
    tag="div"
    ref="validationObserver"
    v-slot="{ handleSubmit, invalid }"
    @submit.prevent="onValidationObserverSubmit()" xmlns="">
    <form
      ref="form"
      @submit.prevent="handleSubmit(onSubmit)"

      method="post">

      <the-header
        :title="heading_title"
        {% if help_link %}:help="help_link"{% endif %}
        :breadcrumbs='breadcrumbs'
        :tabs="tabs"
        {% block attributes_the_header %}{% endblock %}
        @update-tabs="onChangeContentTab">
        {% block header_actions %}

          <base-button
            v-if="configurations.bInsert == false"
            @click.native="Action('delete')"
            apperance="outline"
            :disabled="disableForm || disableSubmitButton"
            :loading="btnSubmitLoading">
            { button_excluir }
          </base-button>

          <base-button
            v-if="configurations.bInsert == true"
          @click.native="configurations.bInsert = false"
          apperance="outline"
            :disabled="disableForm || disableSubmitButton"
            :loading="btnSubmitLoading">
          { button_cancel }
          </base-button>

          <base-button
            @click.native="configurations.bInsert = true"
            v-if="configurations.bInsert == false"
            :disabled="disableForm || disableSubmitButton"
            :loading="btnSubmitLoading">

            { button_incluir }
          </base-button>

          <base-button
            v-if="configurations.bInsert == true"
            @click.native="Action('save')"
            :disabled="disableForm || disableSubmitButton"
            :loading="btnSubmitLoading">
            { button_save }
          </base-button>

        {% endblock %}
        <template #notification>
          <base-alert
            v-show="alert.type"
            :apperance="alert.type"
            @close="alert = {}">
            <span v-html="alert.message"></span>
          </base-alert>
        </template>
      </the-header>

      <span v-if="configurations.bInsert == false">{% block content %}{% endblock %}</span>
      <span v-if="configurations.bInsert == true">{% block contentInsert %}{% endblock %}</span>

    </form>
  </validation-observer>
  {% block contentOutForm %}{% endblock %}

{% endblock %}
