Como fazer um validador de CNPJ em Tyepscript e Ionic 4
Published: 2023-10-25 00:26:17

Neste artigo, irei ensinar como fazer a validação do CNPJ (Cadastro Nacional da Pessoa Física), que possui uma lógica similar, utilizando uma fórmula matemática para verificar o DV (Dígito Verificador) do CNPJ, que é conhecida como “módulo 12”.

O CNPJ é formado por 14 dígitos, divididos em três blocos. Usando como exemplo o CNPJ fictício 11.222.333/0001–44, temos que, o primeiro bloco (11.22.333) representa o número da inscrição da empresa; o segundo bloco (0001), localizado após a barra, representa um código único que identifica a matriz/filial da empresa; por fim, o terceiro bloco (44), que são os dois dígitos finais, são os dígitos verificadores. O cálculo do DV é feito de maneira similar ao do CPF, mas não entrarei em detalhes neste artigo. Vamos então ao código comentado de validação de CPF em Typescript.

**Código em typescript, com Ionic**

```
import { Component } from '@angular/core';
import { ModalController, AlertController, NavParams } from '@ionic/angular';

@Component({
  selector: 'nota-fiscal-empresa',
  templateUrl: './nota-fiscal-empresa.component.html',
  styleUrls: ['./nota-fiscal-empresa.component.scss'],
})

export class NotaFiscalEmpresaComponent {
  cnpj: any;
  strCNPJ: any;

  constructor(
    private modalController: ModalController,
    private alertController: AlertController,
  ) { }

  //Função que irá testar se o CNPJ é valido 
  testaCNPJ() {
    // Verifica se a variável cnpj é igua a "undefined", exibindo uma msg de erro
    if (this.cnpj === undefined) {
      this.cnpjAlert();
      return false;
    }

    // Esta função retira os caracteres . / - da string do cnpj, deixando apenas os números 
    var strCNPJ = this.cnpj.replace('.', '').replace('.', '').replace('/', '').replace('-', '');

    // Testa as sequencias que possuem todos os dígitos iguais e se o cnpj não tem 14 dígitos, retonando falso e exibindo uma msg de erro
    if (strCNPJ === '00000000000000' || strCNPJ === '11111111111111' || strCNPJ === '22222222222222' || strCNPJ === '33333333333333' ||
      strCNPJ === '44444444444444' || strCNPJ === '55555555555555' || strCNPJ === '66666666666666' || strCNPJ === '77777777777777' ||
      strCNPJ === '88888888888888' || strCNPJ === '99999999999999' || strCNPJ.length !== 14) {
      this.cnpjAlert();
      return false;
    }

    // A variável numeros pega o bloco com os números sem o DV, a variavel digitos pega apenas os dois ultimos numeros (Digito Verificador).
    var tamanho = strCNPJ.length - 2;
    var numeros = strCNPJ.substring(0, tamanho);
    var digitos = strCNPJ.substring(tamanho);
    var soma = 0;
    var pos = tamanho - 7;

    // Os quatro blocos seguintes de funções irá reaizar a validação do CNPJ propriamente dito, conferindo se o DV bate. Caso alguma das funções não consiga verificar
    // o DV corretamente, mostrará uma mensagem de erro ao usuário e retornará falso, para que o usário posso digitar novamente um número 
    for (let i = tamanho; i >= 1; i--) {
      soma += numeros.charAt(tamanho - i) * pos--;
      if (pos < 2) {
        pos = 9;
      }
    }

    var resultado = soma % 11 < 2 ? 0 : 11 - soma % 11;
    if (resultado != digitos.charAt(0)) {
      this.cnpjAlert();
      return false;
    }

    tamanho = tamanho + 1;
    numeros = strCNPJ.substring(0, tamanho);
    soma = 0;
    pos = tamanho - 7;
    for (let k = tamanho; k >= 1; k--) {
      soma += numeros.charAt(tamanho - k) * pos--;
      if (pos < 2) {
        pos = 9;
      }
    }

    resultado = soma % 11 < 2 ? 0 : 11 - soma % 11;
    if (resultado != digitos.charAt(1)) {
      this.cnpjAlert();
      return false;
    }

    this.update();
    return true;
  }

  //Caso o CNPJ será valido, irá realizar a gravação do mesmo na variável strCNPJ
  async update() {
    await this.modalController.dismiss(this.strCNPJ);
  }

  //Exibe uma mensagem de alerta ao usuário, caso o número do CNPJ seja inválido
  async cnpjAlert() {
    const alert = await this.alertController.create({
      header: 'CNPJ Inválido!',
      message: 'Digite um número de CNJP válido para prosseguir',
      buttons: ['OK']
    });
    await alert.present();
  }
}
```

**Código HTML**

```
<ion-header>
  <ion-toolbar color="tertiary">
    <div class="headerTittle">
      <h1>CNPJ na Nota</h1>
    </div>
  </ion-toolbar>
  <ion-toolbar>
    <!-- Botão que ativará a função para testar o CNPJ -->
    <div class="headerButton" (click)="testaCNPJ()">
      Inserir CNPJ
    </div>
  </ion-toolbar>
</ion-header>

<ion-content>
  <!--Neste campo, o usuário irá inserir o CNPJ, que será guardado  na variável cnpj-->
  <ion-input class="cnpj" placeholder="Insira o CNPJ" name="cnpj" type="text" [(ngModel)]="cnpj"></ion-input>
</ion-content>
```