Histórico da Página

Índice

maxLevel	4

01. VISÃO GERAL

Conciliação contábil é a ação de comparar os valores debitados e creditados nas contas de uma organização, para verificar a ocorrência de divergências tributárias e assegurar a precisão contábil. Por meio da comparação do que entra e do que sai, a empresa é capaz de verificar a existência de erros que possam comprometer os valores finais do balanço patrimonial ou fraudes e corrigi-los.

Hoje, os clientes que usam o Protheus fazem essa conciliação de valores por meio de softwares terceiros ou manualmente. Dependendo do tamanho da empresa, essa conciliação pode durar horas, dias ou semanas para ser concluída, além de estar sujeita a erro humano, já que é feita no “olhômetro”. A proposta da tela é solucionar esse problema para que a conciliação seja feita de maneira rápida e fácil, com uma grande redução de riscos sobre erros humanos na hora da execução, além de expandir a solução Protheus para os clientes que usam outros softwares de conciliação contábil.

Informações

title	Atenção

Este conjunto de funcionalidades estará disponível apenas no release 12.1.33

02. ARQUITETURA

draw.io Diagram

border	true
viewerToolbar	true

fitWindow	false
diagramName	Conciliação
simpleViewer	false
width
diagramWidth	1093
revision	2

03. CONFIGURAÇÃO

O desenvolvimento da funcionalidade Conciliação Contábil será realizada na plataforma web, assim, será necessária a utilização de desenvolvimento client-side (Front-End) com a tecnologia Angular e a biblioteca PO-UI e server-side (Back-End) com a tecnologia ADVPL.

A comunicação será realizada através das configurações disponíveis:

Configuração da Porta Multiprotocolo (AppServer.ini):

Tdn: Application Server - Porta Multiprotocolo

Configuração Rest (AppServer.ini):

Tdn: Rest - ADVPL

Criando um novo projeto Angular com PO UI

Pré-requisitos:

Angular CLI - latest - https://cli.angular.io/
Node - latest - https://nodejs.org/en/

Recomendado:

Git Bash - latest - https://git-scm.com/downloads

Após instalar os itens citados acima, é necessário procurar uma pasta onde você gostaria de deixar o seu projeto alocado.

Abra o caminho dessa pasta no seu terminal de preferencia (recomendo o uso do Git Bash) e digite o comando:

Bloco de código

theme	DJango

ng new NOMEDOPROJETO --routing=true --style=scss

Obs: Os parâmetros --routing e --style respectivamente são para que o projeto seja criado com o sistema de rotas já implementado e para que o padrão de arquivos de estilo do projeto sejam no formato SCSS, dessa forma podemos utilizar o pré-processador SASS.

Após ter feito esse processo, precisamos incluir o PO UI no projeto. Para fazer isso, navegue até a pasta principal do seu projeto e rode o seguinte comando:

Bloco de código

theme	DJango

ng add @po-ui/ng-components

No processo de instalação, o terminal irá perguntar se deseja incluir uma estrutura inicial em seu projeto com menu lateral, página e toolbar, utilizando componentes do PO (estrutura padrão dos aplicativos que utilizam PO UI na TOTVS) Basta informar a tecla Y.

Uma última configuração é necessária para que o seu projeto fique no padrão TOTVS. É necessário instalar o tema oficial da TOTVS no PO UI. Rode o seguinte comando na pasta principal do seu projeto:

Bloco de código

theme	DJango

npm install @totvs/po-theme

Depois da instalação ser finalizada, vá até o arquivo angular.json, procure o parâmetro "styles" dentro de "projects" e insira o caminho abaixo:

Bloco de código

theme	DJango

"styles": [
  "node_modules/@totvs/po-theme/css/po-theme-default.min.css"
]

Caso já exista algum caminho dentro de styles que não seja relativo ao tema do PO, não é necessário remover.

Pronto, agora use o comando abaixo na pasta principal do seu projeto para roda-lo:

Bloco de código

theme	DJango

ng serve

Acessando o endereço http://localhost:4200 após o build, você deve ver a estrutura padrão do PO UI.

Fonte: PO UI - Primeiros passos

O desenvolvimento será On-Premises, ou seja, será necessário adicionar o item Conciliação Contábil no Menu Protheus para que esteja disponível, como trata-se de uma funcionalidade web, esses aplicativos devem se armazenados no RPO e possuir um controle de alterações:

Para gerar a compilação dos arquivos Angular (PO UI) que vão no repositório Protheus, basta abrir a pasta principal do projeto, abrir o seu console de preferência (cmd, gitbash, etc) e rodar o comando:

Bloco de código

theme	DJango

ng build -c production

Os arquivos serão gerados dentro da pasta dist dentro da pasta principal do projeto.

Para que o aplicativo Angular seja compilado no repositório Protheus, o conteúdo dentro da pasta dist deverá ser zipado, após, sua extensão mudada para .app. Todo o conteúdo deverá ficar em uma pasta, inclusive o fonte .prw que fará a chamada do app, em seguida, solicitar compilação da pasta:

Exemplo de fonte chamando a função FwCallApp para abertura de rotinas PO-UI no menu Protheus:

Adicionando rotina PREXAMPLE no Menu Protheus:

Tdn: Abrindo Aplicativos Web no Protheus

04. Tela principal

MENU LATERAL

O menu será construído com o componente Menu do PO UI. Quando um novo projeto Angular é criado com o PO UI, o sistema pergunta se o usuário quer gerar uma estrutura padrão que é utilizada nos projetos da TOTVS. Selecionando essa opção, o menu é gerado automaticamente junto com a estrutura, sendo somente necessário adicionar os links.

FILTROS

Solução que possibilita o usuário filtrar os resultados dos registros apresentados na lista de lançamentos contábeis/lançamentos de origem.

Totvs custom tabs box

tabs	Implementação,Imagens
ids	filtros_implementacao,filtros_imagens

Totvs custom tabs box items

default	yes
referencia	filtros_implementacao

Front-End:

Os campos do filtro serão construídos com o componente DynamicForm do PO UI. Será necessário chamar algumas APIs no momento do carregamento da tela:

API que salva os filtros do usuário
API que recupera os filtros já salvos.

Os campos serão por seleção, ou seja, o usuário poderá selecionar todos os itens ou um item específico. Os inputs serão construídos com o módulo MultiSelect do PO UI. (#001)

Abaixo todos os filtros que vão estar disponíveis para configuração:

Filial (multiselect)
Data (de/até) (date)
Conta contábil (multiselect)
Moeda (select)
Conciliar por (select) (dependendo do filtro, abrirá um novo campo para o usuário colocar o número do processo ou extrato bancário) (#003)
Lançamento Padrão (multiselect) (#006)
Filtra entidade (select boolean)
Centro de custo (multiselect)
Item contábil (multiselect)
Clvl (multiselect)
Registros conciliados (select boolean) (#004)
Lote (#002)

Como citado acima, após salvar o formulário, o front fará uma requisição para o back-end enviando os dados que o usuário selecionou nos filtros. Quando o usuário acessar novamente, os filtros estarão salvos. (#007)

Cada campo terá um parâmetro onde será possível adicionar um texto de ajuda para aquele campo específico. O local de exibição da ajuda na tela ainda não está definido. (#008)

Back-End:

Será necessário uma API para salvar os filtros do usuário e uma outra API para recuperar o filtro já salvo.

Para que o filtro que o usuário realizou reflita nos grids, o front vai chamar as APIs que trazem as informações dos grids passando os valores dos filtros como query strings, assim a API vai saber o que filtrar na hora de trazer o resultado.

Os filtros deverão possuir help para facilitar entendimento do usuário.

Serão necessárias disponibilidade das APIs abaixo:

API para informações de Filiais (SM0)

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

{ 
}

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "Branch": [
        {
            "BranchId":"D MG 01"
        },
        {
           "BranchId":"D RJ 01"
        },
        {
            "BranchId":"M PR 01"
        },
        {
            "BranchId":"M SP 01"
        }      
    ]
}

API para informações do Plano de Contas Contábeis (CT1)

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

[
"Branchs": [
	{ "BranchId": "D MG 01"},
	{ "BranchId": "D RJ 02"}
]

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "AccountantAccounts": [
        {
            "BranchId":"D MG 01",
			"Code":"000001"
        },
        {
           "BranchId":"D MG 01",
			"Code":"000003"
        },
        {
           "BranchId":"D MG 01",
			"Code":"000005"
        },
        {
            "BranchId":"D RJ 02",
			"Code":"000001"
        },
	    {
            "BranchId":"D RJ 02",
			"Code":"000005"
        }  
    ]
}

API para informações de Lançamento Padrão (CT5)

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

[
"Branchs": [
    { "BranchId": "D MG 01"},
    { "BranchId": "D RJ 02"}
]

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "StandardReleases": [
        {
            "BranchId":"D MG 01",
			"Code":"595"
        },
        {
           "BranchId":"D MG 01",
			"Code":"596"
        },
        {
           "BranchId":"D MG 01",
			"Code":"598"
        },
        {
            "BranchId":"D RJ 02",
			"Code":"595"
        },
	    {
            "BranchId":"D RJ 02",
			"Code":"597"
        }  
    ]
}

API para informações de Centro de Custo (CTT)

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

[
"Branchs": [
    { "BranchId": "D MG 01"},
    { "BranchId": "D RJ 02"}
]

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "CostCenters": [
        {
            "BranchId":"D MG 01",
			"Code":"CC000001"
        },
        {
           "BranchId":"D MG 01",
			"Code":"CC000002"
        },
        {
           "BranchId":"D MG 01",
			"Code":"CC000005"
        },
        {
            "BranchId":"D RJ 02",
			"Code":"CC000002"
        },
	    {
            "BranchId":"D RJ 02",
			"Code":"CC000003"
        }  
    ]
}

API para informações de Itens Contábeis (CTD)

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

[
"Branchs": [
    { "BranchId": "D MG 01"},
    { "BranchId": "D RJ 02"}
]

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "AccountingItems": [
        {
            "BranchId":"D MG 01",
			"Code":"CTD00001"
        },
        {
           "BranchId":"D MG 01",
			"Code":"CTD00005"
        },
        {
           "BranchId":"D MG 01",
			"Code":"CTD00008"
        },
        {
            "BranchId":"D RJ 02",
			"Code":"CTD00001"
        },
	    {
            "BranchId":"D RJ 02",
			"Code":"CTD00002"
        }  
    ]
}

API para informações de Classe de Valor (CTH)

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

[
"Branchs": [
    { "BranchId": "D MG 01"},
    { "BranchId": "D RJ 02"}
]

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "ValueClasses": [
        {
            "BranchId":"D MG 01",
			"Code":"CTH00001"
        },
        {
           "BranchId":"D MG 01",
			"Code":"CTH00005"
        },
        {
           "BranchId":"D MG 01",
			"Code":"CTH00008"
        },
        {
            "BranchId":"D RJ 02",
			"Code":"CTH00001"
        },
	    {
            "BranchId":"D RJ 02",
			"Code":"CTH00002"
        }  
    ]
}

API para informações de Moedas (SMO)

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

[
"Branchs": [
    { "BranchId": "D MG 01"},
    { "BranchId": "D RJ 02"}
]

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "Currencies": [
        {
            "BranchId":"D MG 01",
			"Code":"01"
        },
        {
           "BranchId":"D MG 01",
			"Code":"02"
        },
        {
           "BranchId":"D MG 01",
			"Code":"03"
        },
        {
            "BranchId":"D RJ 02",
			"Code":"01"
        },
	    {
            "BranchId":"D RJ 02",
			"Code":"02"
        }  
    ]
}

API para informações bancárias (SA6) com a opção Get

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

[
"Branchs": [
    { "BranchId": "D MG 01"},
    { "BranchId": "D RJ 02"}
]

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response
linenumbers	true
collapse	true

{
    "Banks": [
        {
            "BranchId":"D MG 01",
			"Code":"001",
			"Number":"00001",
			"AccountCode":"0000000001"
        },
        {
           "BranchId":"D MG 01",
			"Code":"002",
			"Number":"00001",
			"AccountCode":"0000000001"
        },
        {
           "BranchId":"D MG 01",
			"Code":"001",
			"Number":"00002",
			"AccountCode":"0000000010"
        },
        {
            "BranchId":"D RJ 02",
			"Code":"001",
			"Number":"00001",
			"AccountCode":"0000000005"
        },
	    {
            "BranchId":"D RJ 02",
			"Code":"001",
			"Number":"00003",
			"AccountCode":"0000000008"
        }  
    ]
}

Totvs custom tabs box items

default	no
referencia	filtros_imagens

GRID

Apresenta os lançamentos contábeis e os lançamentos da origem baseados nos filtros que o cliente selecionou.

Totvs custom tabs box

tabs	Implementação,Grid, Modal de Confirmação, Alerta de Status
ids	grid_implementacao,grid_imagem,grid_modal,grid_alert

Totvs custom tabs box items

default	yes
referencia	grid_implementacao

Front-end:

A tabela será construída com o componente Table do PO UI. Na aba Exemplos já existe um exemplo de como construir a tabela no mesmo modelo que o especificado.

Antes do usuário ter acesso as informações do grid, ele precisa primeiro preencher os filtros para que sejam retornados os valores conforme o filtro ele selecionou.

Como citado na seção de filtros, é necessário o front passar uma query string com os filtros selecionados na chamada desses endpoints para que eles realizem o filtro de registros ao buscar no banco de dados.

No final de cada linha, teremos um botão "..." que conterá mais ações que o usuário poderá realizar com o registro selecionado, como Edição, Exclusão, Impressão, etc (as ações citadas estão pendentes de um protótipo de alta fidelidade no Figma com as telas das ações).

Após clicar no botão "Conciliar", um modal (aba 3) será exibido para que o usuário confirme sua ação. O modal será construído com o componente Modal do PO UI. Depois da confirmação do usuário, o sistema irá exibir um alerta para o usuário informando o usuário sobre o resultado da ação (aba 4). O alerta será construído com o Interceptor do PO UI, em conjunto com o back-end.

Abaixo dos grids, haverá dois totalizadores que somarão o valor de cada grid respectivamente.

O usuário poderá configurar a exibição das colunas conforme a sua preferência. O componente do PO UI possibilita o usuário fazer isso.

Back-end:

Será necessária disponibilidade das API abaixo, as consultas serão realizadas conforme os parâmetros informados:

API para Lançamentos Contábeis (CT2) com as opções Get, Post, Put e Delete, receberá os parâmetros: Filial, Data, Número de Lote, Sub-Lote, Documento, Conciliados e Lançamento Padrão. Deve-se preencher o ComboBox com o status do lançamento: Conciliados, Não Conciliados

Na opção Get, deve-se retornar dois objetos, um contendo os registros origens (SF1, SF2, SE1, SE2, SE5) dos lançamentos contábeis recuperados, quando tratar-se de lançamentos contábeis aglutinados, será necessário trazer cada origem relacionada e outro contendo as contabilizações destes registros juntamente com a conciliação quando já ocorreu.

A opção Post, deve realizar a inclusão de novas conciliações de acordo com os parâmetros informados, Put deverá realizar alterações nas Conciliações Contábeis já existentes e finalmente a opção Delete, realizará a exclusão das Conciliações Contábeis selecionadas.

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Request
linenumbers	true
collapse	true

{
	"branchs": [],
	"dataMin": '10/01/2021',
	"dataMax": '21/01/2021',
	"AccountantAccounts": [],
	"conciliateBy": 1 */ 1 = processo, 2 = extrato bancário */,
	"process?": '000000000',
	"bankStatement?": {bank: '', account: '', agency: ''},
	"operation?": [],
	"filterEntity": true,
	"costCenters": [],
	"accountingItems": [],
	"clvl": []
}

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response: Get
linenumbers	true
collapse	true

{
    "OriginEntries":[
		{
			"BranchId":"D MG 01",
			"OriginEntry":"D MG 0103-04-2020001000010000000001",
			"OriginValue":1000.00,
			"Accounted":true,
			"Reconcilied":true
		},
		{
			"BranchId":"D MG 01",
			"OriginEntry":"D MG 0103-04-2020001000010000000001",
			"OriginValue":1000.00,
			"Accounted":true,
			"Reconcilied":true
		},
		{
			"BranchId":"D RJ 02",
			"OriginEntry":"D RJ 0205-04-2020001000020000000010",
			"OriginValue":5000.00,
			"Accounted":true,
			"Reconcilied":false
		},
		{
			"BranchId":"D RJ 02",
			"OriginEntry":"D RJ 0206-04-2020001000020000000002",
			"OriginValue":20000.00,
			"Accounted":true,
			"Reconcilied":true
		}
	],
	"AccountingEntries": [
        {
            "BranchId":"D MG 01",
            "MovementDate":"03-04-2020",
			"BatchNumber":"08850",
			"SubLot":"001",
			"Document":"000001",
			"Item":"001",
			"ItemType":"1",
			"EntryValue":1000.00,
			"Reconcilied":true
        },
        {
           "BranchId":"D MG 01",
            "MovementDate":"03-04-2020",
			"BatchNumber":"08850",
			"SubLot":"001",
			"Document":"000001",
			"Item":"002",
			"ItemType":"2",
			"EntryValue":1000.00,
			"Reconcilied":true
        },
        {
           "BranchId":"D RJ 02",
            "MovementDate":"05-04-2020",
			"BatchNumber":"08850",
			"SubLot":"001",
			"Document":"000001",
			"Item":"001",
			"ItemType":"3",
			"EntryValue":5000.00,
			"Reconcilied":false
        },
        {
            "BranchId":"D RJ 01",
            "MovementDate":"06-04-2020",
			"BatchNumber":"08850",
			"SubLot":"001",
			"Document":"000005",
			"Item":"001",
			"ItemType":"1",
			"EntryValue":20000.00,
			"Reconcilied":true
        }
    ]
}

Bloco de código

language	coldfusion
theme	DJango
firstline	1
title	Json Response: Post, Put e Delete
linenumbers	true
collapse	true

{
	"AccountingEntries": [
		{
			"AccountingEntry": "D MG 0103-04-2020001000010000000001",
			"success": true
		},
		{
			"AccountingEntry": "D MG 0103-04-2020001000010000000002",
			"success": true
		},
		{
			"AccountingEntry": :"D RJ 0205-04-2020001000020000000003",
			"success": false
		},
		{
			"AccountingEntry": :"D RJ 0205-04-2020001000020000000010",
			"success": true
		}
	],
}

Também é necessário que o back-end retorne a propriedade _messages no objeto de retorno nas APIs de exclusão, edição e salvamento da conciliação de registros, como explicado detalhadamente nesta página do PO UI. Resumindo, essa propriedade serve para que o front-end exiba as mensagens de alerta conforme o status da requisição.

05. Campos e Parâmetros

Campo	Titulo	Descrição
XXX_FILIAL	Filial	Filial do Sistema
XXX_CODIGO	Codigo	Codigo da Conciliacao
XXX_CHVORI	Chave Origem	Chave Registro Origem
XXX_CHVCTB	Chave Contabil	Chave Registro Contabil
XXX_USER	Usuario	Usuario da Conciliacao
XXX_DATA	Data Conc	Data da Conciliacao
XXX_HORA	Hora Conc	Hora da Conciliacao

06. Tabelas Utilizadas

XXX - Conciliacao Contabil

Informações

title	Importante

Serão realizadas as gravações de data, hora e usuário responsável pela conciliação.

Totvs custom tabs box items

default	no
referencia	grid_imagem

#002

Totvs custom tabs box items

default	no
referencia	grid_modal

Totvs custom tabs box items

default	no
referencia	grid_alert

HTML

<!-- esconder o menu --> 


<style>
div.theme-default .ia-splitter #main {
    margin-left: 0px;
}
.ia-fixed-sidebar, .ia-splitter-left {
    display: none;
}
#main {
    padding-left: 10px;
    padding-right: 10px;
    overflow-x: hidden;
}

.aui-header-primary .aui-nav,  .aui-page-panel {
    margin-left: 0px !important;
}
.aui-header-primary .aui-nav {
    margin-left: 0px !important;
}
</style>

Árvore de páginas

Versões comparadas

Versão antiga 90

Nova versão 91

Chave

01. VISÃO GERAL

02. ARQUITETURA

03. CONFIGURAÇÃO

Criando um novo projeto Angular com PO UI

Menu

04. Tela principal

MENU LATERAL

FILTROS

GRID

05. Campos e Parâmetros

06. Tabelas Utilizadas