# Tela de edição da 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: 49.9999%; height: 10px; border-color: black; border-style: solid;"><span style="color: #000000;">**Projeto/Sistema:**</span>  
<span style="color: #000000;">GERENCIAMENTO DE PROJETOS</span></td><td class="align-center" style="width: 23.3333%; height: 10px; border-color: black; border-style: solid;"><span style="color: #000000;">**Versão do *Template:***</span>  
<span style="color: #000000;">1.2</span></td></tr><tr style="border-style: solid;"><td style="width: 49.9999%; height: 29px; border-color: black; border-style: solid;"><span style="color: #000000;">**Processo:**</span>  
<span style="color: #000000;">Tela de edição da despesa</span></td><td class="align-center" style="width: 23.3333%; height: 29px; border-color: black; border-style: solid;"><span style="color: #000000;">**Versão do Documento:**</span>  
<span style="color: #000000;">1.0</span></td></tr><tr style="border-style: solid;"><td style="width: 49.9999%; height: 29px; border-color: black; border-style: solid;"><span style="color: #000000;">**Responsável(eis):** </span>  
<span style="color: #000000;">Jalile Cornachioni</span></td><td class="align-center" style="width: 23.3333%; height: 29px; border-color: black; border-style: solid;"><span style="color: #000000;">**Data:** </span>

<span style="color: #000000;">25/08/2025</span>

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

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

<div id="bkmrk-contas-a-pagar-do-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>\#2 - Tela de nova despesa</div><div>\#3 - Tela de visualização (apenas para despesa paga)</div><div><span style="color: #3366ff;">\#4 - Tela de edição</span></div><div>\#5 - Tela de pagamento</div></div>#### **3. Descrição das alterações**

<span style="color: #3366ff;">**\#4 - Tela de edição da despesa**</span>

O objetivo da mudança é **modernizar o layout da tela de edição de despesa**, tornando a experiência do usuário mais clara, intuitiva e alinhada ao padrão visual atualizado do sistema.

##### 3.1 Detalhes da tela

**3.1.1 Header (Cabeçalho)**

**Objetivo**: Apresentar de forma clara a identificação do título, status e ações principais.

- **Título da página:** *Editar despesa*  \[Número da despesa\]" (ex.: despesa 12345-1/3)
- **Ícone** **indicando registro e anexo:** Icon de relógio para indicar agendado e clips para títulos com anexo.
- **Status do título:** Label: "À vencer", "Vencido"
- **Informações de criação**: Label: "Criado em \[Data\] por \[Usuário\]"

**3.1.2 Informações da Despesa**

- **Fornecedor**(campo bloqueado, apenas visualização).
- **Número do Documento** e **Descrição**.
- **Conta**, **Categoria**, **Forma de Pagamento**.
- **Data de Vencimento**.
- **Valor da Despesa**(com validações de edição).
- **Pagamento Agendado**
- **Linha digitável**

**3.1.3 Alterações de valores**

- **Valor Original** (bloqueado).
- **Juros/Multa** (editável conforme status).
- **Desconto** (editável conforme status).
- **Valor da Despesa final** (cálculo automático com destaque).

**3.1.4 Informações adicionais**

- **Observação** (texto livre).
- **Comprovantes**: upload de arquivos (limite de tamanho, extensões permitidas, múltiplos anexos).

**3.1.5 Botões de ação:**

- **Salvar e Fechar:** Salva alterações e fecha a tela voltando para a tela de listagem de despesas
- **Salvar e Pagar :** Salva alterações e abre tela de pagamento

#### 4. Link do Protótipo 

<div id="bkmrk-edi%C3%A7%C3%A3o-da-despesa">[Edição da despesa](https://www.figma.com/design/mN0I8GyW16Nio4YwGf82b1/Melhorias-Clarity?node-id=1611-4799&t=Wg3NsYpjUtd9g1Ng-0)</div>#### 5. Telas

[![Modelo 81 (2).png](https://docs.softensistemas.com.br/uploads/images/gallery/2025-08/scaled-1680-/modelo-81-2.png)](https://docs.softensistemas.com.br/uploads/images/gallery/2025-08/modelo-81-2.png)

©SOFTEN SISTEMAS 2025