<!-- [
        'name',
        'email',
        'password',
        'idTelegram',
        'pessoaFisica'
        'cpf',
        'cep',
        'logradouro',
        'bairro',
        'cidade',
        'uf',
        'pais',
    ]-->

<script src="https://code.jquery.com/jquery-3.5.0.js"></script>
<script type="text/javascript">
    $(document).ready(function() {
        $("#notificarTelegram").click(function() {
            if ($(this).is(':checked')) {
                $("#idTelegramLabel").css('display', 'block');
                $("#idTelegram").css('display', 'block');
                $("#idTelegram").removeAttr("readonly");
            } else {
                $("#idTelegramLabel").css('display', 'none');

            }
        });

    });
</script>
<script>
    /* Máscaras ER */
function mascara(o,f){
    v_obj=o
    v_fun=f
    setTimeout("execmascara()",1)
}
function execmascara(){
    v_obj.value=v_fun(v_obj.value)
}
function mtel(v){
    v=v.replace(/\D/g,""); //Remove tudo o que não é dígito
    v=v.replace(/^(\d{2})(\d)/g,"($1) $2"); //Coloca parênteses em volta dos dois primeiros dígitos
    v=v.replace(/(\d)(\d{4})$/,"$1-$2"); //Coloca hífen entre o quarto e o quinto dígitos
    return v;
}
function id( el ){
	return document.getElementById( el );
}
window.onload = function(){
	id('telefone').onkeyup = function(){
		mascara( this, mtel );
	}
}
</script>
<div class="form-group">
    <label for="name" class="control-label">Nome</label>
    <input class="form-control" name="name" type="text" id="name" required>
</div>
<div class="form-group">
    <label for="email" class="control-label">E-mail</label>
    <input class="form-control" name="email" type="email" id="email" required>
    <!-- div class="form-check">
        <label class="form-check-label">
            <input type="checkbox" class="form-check-input" name="notificarEmail" value="">Desejo receber notificações
            das minhas solicitações por e-mail
        </label>
    </div -->
</div>
<div class="form-group">
    <label for="password" class="control-label">Senha</label>
    <input class="form-control" name="password" type="password" id="password" required>
</div>
<div class="form-group">
    <label for="telefone" class="control-label">Telefone</label>
    <input class="form-control" name="telefone" type="tel" id="telefone" required maxlength="16">
</div>
<div class="form-group">
    <div class="form-check">
        <label class="form-check-label">
            <input id="notificarTelegram" type="checkbox" class="form-check-input" name="notificarTelegram"
                value="">Desejo receber notificações das minhas solicitações pelo Telegram
        </label>
    </div>
    <label id="idTelegramLabel" for="idTelegram" class="control-label" style="display: none;">ID do Telegram</label>
    <spam class="text-danger">Caso não saiba onde achar <a href="{{ url('/telegram') }}" target="__blank">clique aqui</a></spam>
    <input class="form-control" name="idTelegram" type="text" id="idTelegram"  readonly required style="display: none;">
</div>
<div class="form-group">
    <label for="pessoaFisica" class="control-label">Tipo de Pessoa</label>
    <div class="form-check">
        <label class="form-check-label">
            <input type="radio" class="form-check-input" name="pessoaFisica" value="true">Pessoa Física
        </label>
    </div>
    <div class="form-check">
        <label class="form-check-label">
            <input type="radio" class="form-check-input" name="pessoaFisica" value="false">Pessoa Jurídica
        </label>
    </div>
</div>
<script type="text/javascript">
$(function() {
    $(".cpf").focus(function() {
        TestaCPF(this);
    })
});

    function limpa_formulário_cep() {
            //Limpa valores do formulário de cep.
            document.getElementById('rua').value=("");
            document.getElementById('bairro').value=("");
            document.getElementById('cidade').value=("");
            document.getElementById('uf').value=("");
            document.getElementById('ibge').value=("");
    }

    function meu_callback(conteudo) {
        if (!("erro" in conteudo)) {
            //Atualiza os campos com os valores.
            document.getElementById('rua').value=(conteudo.logradouro);
            document.getElementById('bairro').value=(conteudo.bairro);
            document.getElementById('cidade').value=(conteudo.localidade);
            document.getElementById('uf').value=(conteudo.uf);
            document.getElementById('ibge').value=(conteudo.ibge);
        } //end if.
        else {
            //CEP não Encontrado.
            limpa_formulário_cep();
            alert("CEP não encontrado.");
        }
    }

    function pesquisacep(valor) {

        //Nova variável "cep" somente com dígitos.
        var cep = valor.replace(/\D/g, '');

        //Verifica se campo cep possui valor informado.
        if (cep != "") {

            //Expressão regular para validar o CEP.
            var validacep = /^[0-9]{8}$/;

            //Valida o formato do CEP.
            if(validacep.test(cep)) {

                //Preenche os campos com "..." enquanto consulta webservice.
                document.getElementById('rua').value="...";
                document.getElementById('bairro').value="...";
                document.getElementById('cidade').value="...";
                document.getElementById('uf').value="...";


                //Cria um elemento javascript.
                var script = document.createElement('script');

                //Sincroniza com o callback.
                script.src = 'https://viacep.com.br/ws/'+ cep + '/json/?callback=meu_callback';

                //Insere script no documento e carrega o conteúdo.
                document.body.appendChild(script);

            } //end if.
            else {
                //cep é inválido.
                limpa_formulário_cep();
                alert("Formato de CEP inválido.");
            }
        } //end if.
        else {
            //cep sem valor, limpa formulário.
            limpa_formulário_cep();
        }
    };


</script>

<div class="form-group">
    <label for="cpf_cnpj" class="control-label">{{ 'CPF ou CNPJ (Apenas Números)' }}</label>
    <input name="cpf" id="cpf" type="text" class="form-control" size="40" maxlength="18"onblur="validaFormato(this);" onkeypress="return (apenasNumeros(event))"  required />
</div>
<div class="form-group">
    <label for="cep" class="control-label">CEP</label>
    <input class="form-control" name="cep" type="text" id="cep" value="" size="10" maxlength="9" onblur="pesquisacep(this.value);" required />
</div>
<div class="form-group">
    <label for="logradouro" class="control-label">Logradouro</label>
    <input class="form-control" name="logradouro" type="text" id="rua" required>
</div>
<div class="form-group">
    <label for="bairro" class="control-label">Bairro</label>
    <input class="form-control" name="bairro" type="text" id="bairro" required>
</div>
<div class="form-group">
    <label for="cidade" class="control-label">Cidade</label>
    <input class="form-control" name="cidade" type="texte" id="cidade" required>
</div>
<div class="form-group">
    <label for="uf" class="control-label">Estado</label>
    <input class="form-control" name="uf" type="text" id="uf" required>
</div>
<div class="form-group">
    <label for="pais" class="control-label">País</label>
    <input class="form-control" name="pais" type="text" id="pais" required>
</div>
<div class="form-group">
    <button class="btn btn-success" type="submit">
        @if ($formMode == 'create')
            Realizar Cadastro
        @else
            Editar
        @endif
    </button>
</div>
