consulta_debitos-inscricao.html
Atualizado em
02/06/2026 11h28
consulta_debitos-inscricao.html
— 22 KB
Conteúdo do arquivo
<!DOCTYPE html>
<html lang="pt-BR">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!--FAVICON-->
<link rel="shortcut icon" href="./assets/img/favicon.ico">
<!-- Fonte Rawline-->
<link rel="stylesheet"
href="https://cdngovbr-ds.estaleiro.serpro.gov.br/design-system/fonts/rawline/css/rawline.css" />
<!-- Fonte Raleway-->
<link rel="stylesheet"
href="https://fonts.googleapis.com/css?family=Raleway:300,400,500,600,700,800,900&display=swap" />
<!-- Fontawesome-->
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css"
integrity="sha512-Kc323vGBEqzTmouAECnVceyQqyqdsSiqLQISBL29aUW4U/M7pSPA/gEUZQqv1cwx4OnYxTxve5UMg5GT6L4JJg=="
crossorigin="anonymous" referrerpolicy="no-referrer" />
<!--CSS GOVBR-->
<link rel="stylesheet" href="./govbr/core.min.css" />
<!--JS GOVBR-->
<script src="./govbr/core.min.js"></script>
<!--UTILS-->
<script src="./assets/js/utils.js"></script>
<!--FUNCOES ESPECIFICAS DO NEGOCIO-->
<script src="./assets/js/inscricao_dau.js"></script>
<!--HTML2CANVAS-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.1/html2canvas.min.js"
integrity="sha512-BNaRQnYJYiPSqHHDb58B0yaPfCu+Wgds8Gp/gU33kqBtgNS4tSPHuGibyoeqMV/TJlSKda6FXzoEyYGjTe+vXA=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<!--JSPDF-->
<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.1/jspdf.umd.min.js"
integrity="sha512-qZvrmS2ekKPF2mSznTQsxqPgnpkI4DNTlrdUmTzrDgektczlKNRRhy5X5AAOnx5S09ydFYWWNSfcEqDTTHgtNA=="
crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<style>
:root {
--font-size-scale-base: 5px;
--font-size-scale-down-01: 0.833em;
--font-size-scale-down-02: 0.694em;
--font-size-scale-down-03: 0.579em;
--font-size-scale-up-01: 1.2em;
--font-size-scale-up-02: 1.44em;
--font-size-scale-up-03: 1.728em;
--font-size-scale-up-04: 2.074em;
--font-size-scale-up-05: 2.488em;
--font-size-scale-up-06: 2.986em;
--font-size-scale-up-07: 3.583em;
--font-size-scale-up-08: 4,299em;
--font-size-scale-up-09: 5.159em;
--font-size-scale-up-10: 6.191em;
--font-size-scale-up-11: 7.429em;
}
.container, .container-lg {
--grid-maxwidth: 98%;
}
@media (min-width: 680px) {
:root {
--font-size-scale-base: 5px;
}
}
@media (min-width: 768px) {
:root {
--font-size-scale-base: 7px;
}
}
@media (min-width: 992px) {
:root {
--font-size-scale-base: 11px;
}
}
@media (min-width: 1280px) {
:root {
--font-size-scale-base: 14px;
}
}
@media (min-width: 1600px) {
:root {
--font-size-scale-base: 16px;
}
}
.br-input input {
padding-left: 1px !important;
padding-right: 1px !important;
}
.cabecalho-com-ajuda {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
position: relative;
}
.tooltip-ajuda {
position: relative;
display: inline-flex;
align-items: center;
cursor: help;
}
.icone-ajuda {
color: #1351b4;
font-size: 0.95rem;
}
.tooltip-texto {
visibility: hidden;
opacity: 0;
width: 360px;
background-color: #1351b4;
color: #fff;
text-align: left;
border-radius: 6px;
padding: 0.75rem;
position: absolute;
z-index: 1000;
bottom: 130%;
left: 50%;
transform: translateX(-50%);
transition: opacity 0.2s ease, visibility 0.2s ease;
font-size: 0.75rem;
line-height: 1.4;
text-transform: none;
font-weight: 400;
box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25);
}
.tooltip-texto::after {
content: "";
position: absolute;
top: 100%;
left: 50%;
margin-left: -6px;
border-width: 6px;
border-style: solid;
border-color: #1351b4 transparent transparent transparent;
}
.tooltip-ajuda:hover .tooltip-texto,
.tooltip-ajuda:focus .tooltip-texto {
visibility: visible;
opacity: 1;
}
.text-down-00 {font-size: 14px !important;}
.fix {
top: 0px !important;
}
@media print {
body * {
display: none;
}
html :after {
content: 'Use o botão Gerar Documento na própria página. O documento impresso ou salvo por outros meios não tem validade.';
visibility: visible;
display: block;
position: fixed;
text-align: center;
color: red;
font-size: x-large;
padding: 5px;
top: 2px;
}
}
</style>
<title class="page-title"></title>
</head>
<!--TEMPLATE LINHA ORDINARIA DA TABELA DEBITOS CONTROLADOS POR PROCESSO-->
<template id="id-template-debito-processo">
<tr>
<!-- CNPJ/CPF -->
<td class="text-center p-1 ">
<div class="br-input obrigatorio">
<input class="text-center cpfcnpj" type="text" onchange="handleValidarCPFCNPJ(this)" name="CNPJ/CPF">
</div>
</td>
<!-- NÚMERO DO PROCESSO/DEBCAD -->
<td class="text-center p-1 ">
<div class="br-input obrigatorio">
<input class="text-center processo-debcad" type="text" maxlength="20" onchange="handleValidarProcessoOuDEBCAD(this)" name="Número do Processo/Debcad">
</div>
</td>
<!-- FILLER -->
<td class="text-center p-1 ">
</td>
<!--AÇÕES-->
<td class="text-center p-1 acoes">
<button class="br-button" onclick="excluirLinha(this, false)">
<i class="fa fa-trash-alt"></i>
</button>
</td>
</tr>
</template>
<!--TEMPLATE LINHA ORDINARIA DA TABELA DEBITOS CONTROLADOS POR OUTROS SISTEMAS-->
<template id="id-template-debito-outros">
<tr>
<!-- CNPJ/CPF -->
<td class="text-center p-1">
<div class="br-input obrigatorio">
<input class="text-center cpfcnpj" type="text" onchange="handleValidarCPFCNPJ(this)" name="CNPJ/CPF"/>
</div>
</td>
<!-- CNO -->
<td class="text-center p-1 ">
<div class="br-input">
<input class="text-center codigo-cnoa" type="text" maxlength="15" onchange="handleValidarCNO(this)" name="CNO"/>
</div>
</td>
<!-- CODIGO DE RECEITA -->
<td class="text-center p-1 ">
<div class="br-input obrigatorio">
<input class="text-center codigo-receita" type="text" maxlength="7" oninput="mascaraCodigoReceita(this)" onchange="handleValidarReceita(this)" name="Código de Receita"/>
</div>
</td>
<!-- PERIODO DE APURACAO (calendario) -->
<td class="text-center p-1 ">
<div class="br-input obrigatorio">
<input class="text-center periodo-apuracao" type="text" maxlength="10" oninput="aplicarMascaraPA(this)" onchange="handleValidarPA(this)" name="Período Apuração"/>
</div>
</td>
<!-- VENCIMENTO DO TRIBUTO -->
<td class="text-center p-1 ">
<div class="br-input obrigatorio">
<input class="text-center vencimento-tributo" type="text" maxlength="10" oninput="aplicarMascaraData(this)" onchange="handleValidarPA(this, tipos=['DMA'])" name="Vencimento do Tributo"/>
</div>
</td>
<!--VALOR ATUALIZADO DO CREDITO TRIBUTARIO -->
<td class="text-center p-1 ">
<div class="br-input obrigatorio">
<input class="text-center original" type="text" oninput="validarValorNaoNegativo(this)" onchange="handleValidarValorNaoNegativo(this)" name="Valor atualizado do Crédito Tributário"/>
</div>
</td>
<!--AÇÕES-->
<td class="text-center p-1 acoes">
<button class="br-button" onclick="excluirLinha(this, false)">
<i class="fa fa-trash-alt "></i>
</button>
</td>
</tr>
</template>
<body class="d-flex flex-column" style="background-color: #f8f8f8; min-height: 100vh;">
<!--PRINCIPAL-->
<main class="flex-grow-1">
<!--HEADER-->
<section id="id-cabecalho" class="paraPDF_01" name="naoJSON">
<header class="br-header">
<div class="container-lg">
<!--TOP-->
<div class="header-top">
<div class="header-logo">
<svg version="1.1" id="Camada_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 374.7 134.9" style="enable-background:new 0 0 374.7 134.9;" xml:space="preserve">
<style type="text/css">
.st0 {
fill: #2864AE;
}
.st1 {
fill: #46AD44;
}
.st2 {
fill: #FABD10;
}
</style>
<path class="st0" d="M40.1,84.7c8.9,0,16-7.5,16-18.7c0-8.1-4.8-17.2-16-17.2c-9.3,0-14.2,8.2-14.2,18.1C25.9,78.3,32.6,84.7,40.1,84.7zM80.4,95.5c0,29.8-14.5,39.4-43.8,39.4c-12,0-21.9-2.5-27.7-4.6l1.3-19.8c7.7,3.8,14.1,6,24.5,6c14.5,0,22.3-6.8,22.3-21.1v-3.9h-0.3c-6,8.5-14.4,12.4-24.4,12.4C12.4,104,0,88.9,0,67.4c0-21.6,10.2-37.8,32.8-37.8c10.7,0,19.4,5.9,24.7,14.8h0.3V31.3h22.7L80.4,95.5L80.4,95.5z" />
<polygon class="st1" points="181.6,103.9 209.5,103.9 235.8,31.7 211.4,31.7 196.6,83.1 196.3,83.1 181.6,31.7 155.3,31.7 " />
<path class="st2" d="M139,67.8c0-10.8-4.7-20.4-16.2-20.4c-11.5,0-16.2,9.6-16.2,20.4c0,10.7,4.7,20.2,16.2,20.2C134.3,88,139,78.5,139,67.8z M80.8,67.8c0-24,18.1-37.8,42-37.8s42,13.9,42,37.8c0,23.8-18.1,37.7-42,37.7C99,105.5,80.8,91.6,80.8,67.8z" />
<path class="st0" d="M238.6,93.7c0,6.5-5.3,11.8-11.8,11.8c-6.5,0-11.8-5.3-11.8-11.8c0-6.5,5.3-11.8,11.8-11.8 C233.3,81.8,238.6,87.1,238.6,93.7z" />
<path class="st0" d="M281,49.2c-9.1,0-15.2,8-15.2,18.8c0,10.5,6.9,18.4,15.2,18.4c9.4,0,15.1-7.9,15.1-19.4C296.1,57.5,290.7,49.2,281,49.2z M240.9,0h25.1v41h0.3c6.4-8,14.8-10.9,24.8-10.9c20,0,30.9,19,30.9,36.4c0,21.3-11.5,39.1-33,39.1c-11.5,0-21.6-6.5-24.8-14.6h-0.3v12.9h-23L240.9,0L240.9,0z" />
<path class="st2" d="M373.4,51.7c-2.8-0.8-5.5-0.8-8.5-0.8c-11.6,0-18.1,8.4-18.1,22.6v30.5h-24.9V31.7h22.7V45h0.3c4.3-9.1,10.5-15,21.3-15c2.9,0,6,0.4,8.5,0.8L373.4,51.7z" />
</svg>
</div>
</div>
<!--BOTTOM-->
<div class="header-bottom">
<!--MENU-->
<div class="header-menu">
<!--TITULOS-->
<div class="header-info">
<div class="header-title"></div>
<!-- <div class="header-subtitle"></div> -->
</div>
</div>
</div>
</div>
</header>
</section>
<!--SECAO DEBITOS CONTROLADOS POR PROCESSO-->
<section id="id-debitos-processo" name="Seção Débitos controlados por processo/debcad" class="secao container mb-5 paraPDF_01">
<h1 class="mt-5">Débitos controlados por Processo/DEBCAD</h1>
<div class="row">
<!--TABELA-->
<div class="col-12 ">
<div class="br-table" data-random="data-random">
<table class=""> <!-- obrigatorio -->
<caption>Detalhamento dos Débitos a Habilitar</caption>
<thead>
<tr>
<th id="CPFCNPJ" class="text-center text-up-01 p-1 col-3">CPF/CNPJ do débito</th>
<th id="processo-debcad" class="text-center text-up-01 p-1 col-3">Número do Processo/DEBCAD</th>
<th id="filler" class="text-center text-up-01 p-1 col-5"></th>
<th class="text-center text-up-01 p-1 col-1 acoes">Ações</th>
</tr>
</thead>
<tbody id="tabelaDebitosProcessoBody" class="multiPagina_11_13"></tbody> <!-- A tabela será preenchida dinamicamente com JavaScript -->
</table>
</div>
</div>
<!--BOTOES INCLUIR NOVO DEBITO E CONFIRMAR TOTAL DE DEBITOS-->
<div class="col-12 my-5 text-center d-flex justify-content-around naoPDF">
<div>
<button id="btnIncluirNovoDebito" onclick="incluirNovoDebitoProcesso()" class="br-button secondary">Incluir novo débito</button>
</div>
</div>
</div>
</section>
<!--SECAO DEBITOS CONTROLADOS POR OUTROS SISTEMAS-->
<section id="id-debitos-outros" name="Seção Débitos controlados por outros sistemas" class="secao container mb-5 paraPDF_02">
<h1 class="mt-5">Débitos controlados por outros sistemas</h1>
<div class="row">
<!--TABELA-->
<div class="col-12">
<div class="br-table" data-random="data-random">
<table class=""> <!-- obrigatorio -->
<caption>Detalhamento dos Débitos a Habilitar</caption>
<thead>
<tr>
<th id="CPFCNPJ" class="text-center text-up-01 p-1 col-3">CPF/CNPJ do débito</th>
<th id="cno" class="text-center text-up-01 p-1 col-3">
<span class="cabecalho-com-ajuda">
CNO
<span class="tooltip-ajuda" tabindex="0" aria-label="Ajuda sobre o campo CNO">
<i class="fas fa-circle-info icone-ajuda"></i>
<span class="tooltip-texto">
Preencha este campo caso se trate de débito relacionado à construção civil
</span>
</span>
</span>
</th>
<th id="codigo-receita" class="text-center text-up-01 p-1 col-1">
<span class="cabecalho-com-ajuda">
Código de Receita
<span class="tooltip-ajuda" tabindex="0" aria-label="Ajuda sobre o campo Código de Receita">
<i class="fas fa-circle-info icone-ajuda"></i>
<span class="tooltip-texto">
Preencha este campo com 4 ou 6 dígitos.
</span>
</span>
</span>
</th>
<th id="periodo-apuracao" class="text-center text-up-01 p-1 col-2">
<span class="cabecalho-com-ajuda">
Período de<br>Apuração
<span class="tooltip-ajuda" tabindex="0" aria-label="Ajuda sobre o campo Período de Apuração">
<i class="fas fa-circle-info icone-ajuda"></i>
<span class="tooltip-texto">
Informe conforme o tributo: DD/MM/AAAA (data específica), MM/AAAA (mensal), AAAA (anual).
</span>
</span>
</span>
</th>
<th id="vencimento-tributo" class="text-center text-up-01 p-1 col-2">Vencimento<br>do Tributo</th>
<th id="valor-atualizado" class="text-center text-up-01 p-1 col-2">Valor atualizado<br>(principal+multa+juros)</th>
<th class="text-center text-up-01 p-1 col-1 acoes">Ações</th>
</tr>
</thead>
<tbody id="tabelaDebitosOutrosBody" class="multiPagina_13_13"></tbody> <!-- A tabela será preenchida dinamicamente com JavaScript -->
</table>
</div>
</div>
<!--BOTOES INCLUIR NOVO DEBITO E CONFIRMAR TOTAL DE DEBITOS-->
<div class="col-12 my-5 text-center d-flex justify-content-around naoPDF">
<div>
<button id="btnIncluirNovoDebito" onclick="incluirNovoDebitoOutros()" class="br-button secondary">Incluir novo débito</button>
</div>
</div>
</div>
</section>
<!--GERAR DOCUMENTO-->
<section id="id-btn-gerar-documento" class="container mb-5" name="gerar_documento">
<div class="row justify-content-between">
<div class="col text-center my-3">
<button onclick="gerarDocumento()" class="br-button primary">Gerar Documento</button>
</div>
</div>
<div class="row justify-content-between">
<div id="id-aguardar" class="col text-center br-loading d-none" role="progressbar" aria-label="Gerando documento PDF">Aguarde</div>
</div>
</section>
</main>
<!-- MODAL -->
<div class="br-scrim-util foco" id="modal-scrim" data-scrim="true">
<div class="div br-modal medium" id="id-modal-generico" aria-modal="true" role="dialog"
aria-labelledby="modal-generico">
<!--HEADER-->
<div class="br-modal-header">
<div class="modal-title" id="id-modal-generico-titulo">Mensagem</div>
<button class="br-button close circle" type="button" data-dismiss="true" aria-label="Fechar">
<i class="fas fa-times" aria-hidden="true"></i>
</button>
</div>
<!--BODY-->
<div class="br-modal-body">
<p id="id-elemento-mensagem"></p>
</div>
<!--FOOTER-->
<div class="br-modal-footer justify-content-end">
<button id="id-entendi" class="br-button primary" type="button" data-dismiss="true">Entendi</button>
</div>
</div>
</div>
<!--FOOTER-->
<section id="id-rodape" class="mt-5xh">
<br-footer>
<footer role="contentinfo" aria-label="Footer" class="br-footer">
<div class="container">
<div class="logo text-sm-left">
<img alt="govbr" src="assets/img/logo_govbr_branco.png">
</div>
<section aria-label="Redes Sociais" class="d-sm-block secondary-info">
<div class="row align-items-end justify-content-between py-5">
<div role="list" class="col assigns text-right">
<span class="sr-only">Parceiros</span>
<a role="listitem" target="_blank" class="ml-4 partner"
href="https://www.gov.br/receitafederal/pt-br" aria-label="Receita Federal">
<img alt="receitafederal" src="assets/img/logo_rfb_branco.png">
</a>
<!-- <a role="listitem" target="_blank" class="ml-4 partner"
href="https://www.gov.br/empresas-e-negocios/pt-br/redesim"
aria-label="Empresas & Negócios">
<img alt="redesim" src="assets/img/logo_redesim_branco.svg">
</a> -->
<a role="listitem" target="_blank" class="ml-4 partner"
href="https://www.gov.br/acessoainformacao/pt-br" aria-label="Acesso à Informação">
<img alt="acessoainformacao" src="assets/img/logo_acesso_informacao.png">
</a>
</div>
</div>
</section>
</div>
<section aria-label="Informações Legais" class="container-fluid">
<span class="br-divider my-3"></span>
<div class="info">
<div class="text-down-01 text-medium pb-3">Versão 1.0.0 - Termo de uso e Política de Privacidade
</div>
</div>
</section>
</footer>
</br-footer>
</section>
</body>
</html>