{{ header }}
<div class="background-white bottom-margin-large">
  <div class="container-fluid">
    <div class="row no-space-xs middle-xs">
      <div class="col-xs-12 col-sm col-md">
        <div class="content-box vertical-padding-large">
          <span class="text-dark text-x-large">{{ 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>
      <div class="col-xs-12 col-sm-width-auto col-md-width-auto">
        <div class="content-box vertical-padding-x-large flex flex-row middle-xs">
          <a href="{{ cancel }}" class="btn-default btn-medium btn-outline right-margin-small">
						<span>{{ button_cancel }}</span>
					</a>
					<button type="button" class="btn-default btn-medium btn-primary js-submit-main-form">
						<span>{{ button_save }}</span>
					</button>
        </div>
      </div>
      {% if error_warning %}
        <div class="warning full-width">{{ error_warning }}</div>
      {% endif %}
      <div class="col-xs-12">
        <div class="flex js-tabs" id="tab-info"></div>
      </div>
    </div>
  </div>
</div>
<form action="{{ action }}" method="post" class="js-main-form">
  <div id="tabs_container" class="container-fluid" data-tabs-id="tab-info">
    <div class="row hidden js-error-control" data-tab="{{ tab_general }}">
      <div class="col-xs-12 col-md-6">
        <div class="content-box bottom-padding-large">
          <span class="text-x-large text-dark">{{ tab_general }}</span>
        </div>
        <div class="content-box background-white shadow-small padding-large">
          <div class="row no-space-xs">

            <div id="root" class="field field-medium"> 
              <base-manual title="{{text_info}}">
                <div>{{text_manual}}</div>
              </base-manual>
            </div>

            <label class="field field-medium">
              <span class="field-label">{{ entry_type }}</span>
              <select class="field-entry" name="fields_register_brazil_tipo_de_pessoa" id="pessoa">
                {% for key, cadastro_pessoa in Type_CadastroPessoa.getEnumList(true) %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_tipo_de_pessoa) }}>
                    {{ cadastro_pessoa }}
                  </option>
                {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_status_cnpjcpf }}</span>
              <select class="field-entry" name="fields_register_brazil_status_cnpgcpf">
                {% for key, status in Type_Status.getEnumList() %}
                  <option data-controlled="interests-{{ key }}" value="{{ key }}" {{ ftr_geral.isSelected(key,  fields_register_brazil_status_cnpgcpf) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_disable_interests }}</span>
              <select class="field-entry controller" name="fields_register_brazil_status_interests">
                {% for key, status in Type_Status.getEnumList() %}
                  <option data-controlled="interests-{{ key }}" value="{{ key }}" {{ ftr_geral.isSelected(key,  fields_register_brazil_status_interests is defined  ? fields_register_brazil_status_interests : '', Type_Status.Tp_Desabilitado) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large {{ (fields_register_brazil_status_interests is defined and fields_register_brazil_status_interests) ? '' : 'hidden' }}">
              <span class="field-label">{{ entry_interests_for_old_users }}</span>
              <select class="field-entry" name="fields_register_brazil_status_interests_for_old_users">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key,  fields_register_brazil_status_interests_for_old_users is defined  ? fields_register_brazil_status_interests_for_old_users : '', Type_Status.Tp_Desabilitado) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large {{ (fields_register_brazil_status_interests is defined and fields_register_brazil_status_interests) ? '' : 'hidden' }}">
              <span class="field-label">{{ entry_disable_interests_subcategory }}</span>
              <select class="field-entry" name="fields_register_brazil_status_interests_subcategory">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key,  fields_register_brazil_status_interests_subcategory is defined  ? fields_register_brazil_status_interests_subcategory : '', Type_Status.Tp_Desabilitado) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

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

    <div class="row hidden js-error-control" data-tab="{{ tab_obrigatorio }}">
      <div class="col-xs-12 col-md-6">
        <div class="content-box bottom-padding-large">
          <span class="text-x-large text-dark visible-block">{{ tab_obrigatorio }}</span>
          <span class="text-error text-small visible-block top-margin-small">{{ text_warning_app }}</span>
        </div>

        <div class="content-box background-white shadow-small padding-large">
          <div class="row no-space-xs">
            <label class="field field-medium">
              <span class="field-label">{{ entry_telephone }}</span>
              <select class="field-entry" name="fields_register_brazil_status_telefone">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_telefone) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_celular }}</span>
              <select class="field-entry" name="fields_register_brazil_status_celular">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_celular) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_data_nascimento_required }}</span>
              <select class="field-entry" name="fields_register_brazil_status_data_nascimento_required">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_data_nascimento_required) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

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

    <div class="row hidden js-error-control" data-tab="{{ tab_exibir }}">
      <div class="col-xs-12 col-md-6">
        <div class="content-box bottom-padding-large">
          <span class="text-x-large text-dark">{{ tab_exibir }}</span>
        </div>

        <div class="content-box background-white shadow-small padding-large">
          <div class="row no-space-xs">
            <label class="field field-medium">
              <span class="field-label">{{ entry_telephone2 }}</span>
			        <select class="field-entry" name="fields_register_brazil_status_telefone2">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_telefone2) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_sexo }}</span>
              <select class="field-entry" name="fields_register_brazil_status_sexo">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_sexo) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
              {% if error_fields_register_brazil_status_sexo %}
                <span class="text-x-small text-error js-error">{{ error_fields_register_brazil_status_sexo }}</span>
              {% endif %}
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_data_nascimento }}</span>
              <select class="field-entry" name="fields_register_brazil_status_data_nascimento">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_data_nascimento) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
              {% if error_data_nascimento %}
                <span class="text-x-small text-error js-error">{{ error_data_nascimento }}</span>
              {% endif %}
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_rg }}</span>
              <select class="field-entry" name="fields_register_brazil_status_rg">
                {% for key, status in Type_Status.getEnumList() %}
                  <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_rg) }}>
                    {{ status }}
                  </option>
                {% endfor %}
              </select>
            </label>

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


    <div class="row hidden js-error-control" data-tab="{{ tab_pessoajuridica }}">
      <div class="col-xs-12 col-md-6">

        <div class="content-box bottom-padding-large">
          <span class="text-x-large text-dark">{{ tab_pessoajuridica }}</span>
        </div>

        <div class="content-box background-white shadow-small padding-large">
          <div class="row no-space-xs">
            <label class="field field-medium">
              <span class="field-label">{{ entry_edit_perfil_pj }}</span>
              <select class="field-entry" name="fields_register_brazil_status_perfil_pj">
                  {% for key, status in Type_Status.getEnumList() %}
                    <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_perfil_pj) }}>
                        {{ status }}
                    </option>
                  {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_edit_contribuinte_pj }}</span>
              <select class="field-entry" name="fields_register_brazil_status_contribuinte_pj">
                  {% for key, status in Type_Status.getEnumList() %}
                    <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_contribuinte_pj) }}>
                        {{ status }}
                    </option>
                  {% endfor %}
              </select>
            </label>

            <label class="field field-medium top-padding-large">
              <span class="field-label">{{ entry_edit_ie_pj }}</span>
              <select class="field-entry" name="fields_register_brazil_status_ie_pj">
                  {% for key, status in Type_Status.getEnumList() %}
                    <option value="{{ key }}" {{ ftr_geral.isSelected(key, fields_register_brazil_status_ie_pj) }}>
                        {{ status }}
                    </option>
                  {% endfor %}
              </select>
            </label>

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

  </div>
</form>
{{ footer }}

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