# Tela Nova Despesa

<table border="1" id="bkmrk-%C2%A0-projeto%2Fsistema%3Age" style="border-collapse: collapse; width: 100.123%; height: 68px;"><tbody><tr style="border-style: solid;"><td rowspan="3" style="width: 26.6667%; height: 68px; border-color: black; border-top-style: hidden; border-left-style: hidden; border-bottom-style: hidden;">  
 ![Softensistemas Logo](https://www.softensistemas.com.br/assets/img/logo.webp)

</td><td style="width: 36.6667%;">**Projeto/Sistema:**  
[Evolução do Produto GA - Interno](https://docs.softensistemas.com.br/shelves/evolucao-do-produto-ga-interno)

</td><td class="align-center" style="width: 36.6667%;">**Versão do *Template:***  
1.1</td></tr><tr><td style="width: 36.6667%;">**Processo:**  
Tela nova despesa</td><td class="align-center" style="width: 36.6667%;">**Versão do Documento:**  
1.0</td></tr><tr><td style="width: 36.6667%;">**Responsável(eis):**   
Jalile Cornachioni</td><td class="align-center" style="width: 36.6667%;">**Data:**

25/08/2025

</td></tr></tbody></table>

#### **1. Objetivo geral:**

<div id="bkmrk-contas-a-pagar%C2%A0do-m%C3%B3">**Contas a Pagar** do módulo Financeiro foi redesenhado para melhorar a clareza das informações, reduzir tempo de operação, evitar frustrações comuns relatadas por usuários e garantir boas práticas do mercado.</div><div id="bkmrk-"></div>#### **2. Impacto previsto:**

<div id="bkmrk-%231---tela-de-listage"><div>\#1 - Tela de listagem de despesas</div><div><span style="color: #3366ff;">\#2 - Tela de nova despesa</span></div><div>\#3 - Tela de visualização (apenas para despesa paga)</div><div>\#4 - Tela de edição</div><div>\#5 - Tela de pagamento</div></div><div id="bkmrk--0"></div>#### **3. Descrição das alterações**

<span style="color: #3366ff;">**\#2 - Tela de nova despesa**</span>

A tela de Nova Despesa tem como objetivo permitir que o usuário cadastre rapidamente um novo lançamento no Contas a Pagar, informando os dados essenciais. Reposicionamos os campos obrigatórios e mais utilizados para o topo da tela, facilitando o acesso e acelerando o preenchimento. Embora a funcionalidade em si não tenha mudado, o layout foi modernizado para melhorar a experiência do usuário e reduzir o tempo de operação.

3.1 **Header – Informações da Despesa**

- **Título:** Nova Despesa - Identificação visual da área de cadastro da despesa.
- **Preenchimento Automático via IA** - Área para importação de arquivo para preenchimento da despesa de forma automatizada, deita por IA.
- **Campos obrigatórios e prioritários**: Fornecedor, Número do Documento, Descrição, Conta, Categoria, Forma de Pagamento, Data de Vencimento, e Valor da Despesa.
- **Pagamento Agendado**: Toggle Switch para marcar o título como agendado ou não.
- Linha digitável: Campo texto reservado para linha digitável do boleto.
- **Valores default**: Conta = "Caixa Fìsico" e Forma de Pagamento = "Dinheiro".
- **Indicador de status**: Selo “A Vencer” posicionado no topo direito, em amarelo (#FFB300).


**3.2. Grid – Repetição de Lançamentos**

- **Campos de configuração**: Quantidade de lançamentos e período de repetição (ex.: mensal).
- **Tabela de parcelas**: Lista com número da parcela e respectiva data de lançamento.
- **Controles de expansão/retração**: Permitem ocultar ou exibir detalhes dessa seção.

**3.3. Rodapé – Informações Adicionais e Ações**

- **Campo de observação**: Área livre para comentários e detalhes adicionais.
- **Upload de fatura/boleto**: Deve ser utilizado para anexar uma cópia da fatura.
- **Upload de comprovante**: Botão “Adicionar Comprovante” com instruções de formato e tamanho de arquivo.
- **Botões de ação**: “Salvar e Fechar” e “Salvar e Pagar”, posicionados para finalização rápida da operação.

[![image-1756133290280.png](https://docs.softensistemas.com.br/uploads/images/gallery/2025-08/scaled-1680-/image-1756133290280.png)](https://docs.softensistemas.com.br/uploads/images/gallery/2025-08/image-1756133290280.png)

**3.4 Comportamento geral da tela:**

No estado inicial, a sessão "informações da Despesa" deve estar no estado **expanded** (aberto) e os demais accordions renderizados em estado **collapsed** (fechados), exibindo apenas o header de cada seção. O usuário pode expandir ou retrair cada accordion de forma independente, conforme sua necessidade.

#### 4. Link do Protótipo / Telas

<div id="bkmrk-nova-receita">[Nova Receita](https://www.figma.com/design/mN0I8GyW16Nio4YwGf82b1/Melhorias-Clarity?node-id=1611-7588&t=Wg3NsYpjUtd9g1Ng-0)</div><div id="bkmrk--1"><div><button class="button outline icon" data-clipboard-target="#pointer-url" title="Copiar Link" type="button"><svg class="svg-icon" data-icon="copy" role="presentation" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"></svg></button></div>[<svg class="svg-icon" data-icon="edit" role="presentation" viewbox="0 0 24 24" xmlns="http://www.w3.org/2000/svg"></svg>](https://docs.softensistemas.com.br/books/financeiro/page/tela-nova-receita/edit?content-id=bkmrk-5.-telas&content-text=5.%20Telas "Editar Conteúdo")</div>©SOFTEN SISTEMAS 2025

<div id="bkmrk--3"><div><div></div></div></div>