Dashboard de Despesas e Receitas

Descrição da Interface

O Dashboard de Despesas e Receitas apresenta uma visão abrangente das finanças relacionadas à frota de veículos. Esta interface está organizada em seções que exibem diferentes aspectos das despesas e receitas, tanto para o período atual quanto para os últimos 12 meses. A tela possui uma estrutura de painéis (cards) bem definida, com dados categorizados por tipo de despesa/receita e por veículo, além de gráficos comparativos que facilitam a análise financeira da frota. Para acessar a opção utilize o menu DASHBOARDS e a opção DESPESAS.

Elementos da Interface

Seção Superior - Despesas dos Últimos 12 Meses

1. Cabeçalho Totalização:

   • Exibe o valor total de despesas dos últimos 12 meses (R$ -64.382,40)

2. Painel "Total de Despesas por Tipo - 12 meses":

   • Lista de despesas agrupadas por categorias
   • Cada linha inclui: ranking, tipo de despesa, percentual, valor em reais
   • Tipos de despesas incluem:
     • Alimentação (80,75%)
     • Abastecimento Externo (4,35%)
     • Borracharia (3,11%)
     • Abastecimento Interno (2,72%)
     • E outras categorias com percentuais menores

3. Painel "Total de Despesas por Veículo":

   • Lista de despesas agrupadas por veículo
   • Cada linha inclui: ranking, placa/identificação do veículo, percentual, valor em reais
   • Itens organizados por valor de despesa em ordem decrescente
   • Exemplos: OEB-2320 (73,03%), SLU-SD66 (8,55%), NHY-3620 (3,88%)

Seção Intermediária - Receitas dos Últimos 12 Meses

1. Cabeçalho Totalização:

   • Exibe o valor total de receitas dos últimos 12 meses (R$ 8.283,23)

2. Painel "Total de Receitas por Tipo - 12 meses":

   • Lista de receitas agrupadas por categorias
   • Cada linha inclui: ranking, tipo de receita, percentual, valor em reais
   • Tipos de receitas incluem:
     • Frete Durafix (69,34%)
     • Frete Pago por Cliente (30,66%)

3. Painel "Total de Receitas por Veículo":

   • Lista de receitas agrupadas por veículo
   • Cada linha inclui: ranking, placa/identificação do veículo, percentual, valor em reais
   • Exemplos: SLU-SD66 (69,34%), ODX-1939 (30,66%)

Seção de Gráfico

1. Gráfico de Barras "Despesas x Receitas dos 12 últimos meses":
   • Eixo X: Meses (04-2024 a 03-2025)
   • Eixo Y: Valores em reais
   • Barras em vermelho: despesas (valores negativos)
   • Barras em azul/roxo: receitas (valores positivos)
   • Legenda: "Receitas R$ 8.283,23" e "Despesas R$ -64.382,40"
   • Instrução: "Clique no mês de uma receita/despesa para atualizar os quadros abaixo"
   • Valores específicos visíveis para alguns meses

Seção Inferior - Detalhamento por Mês Selecionado (11-2024)

1. Cabeçalho Despesa Total:

   • Valor total da despesa do mês selecionado (R$ 46.960,18)
   • Percentual de comparação com o mês anterior (+9.292,04%)

2. Painel "Despesas por Tipo - 11-2024":

   • Lista de despesas do mês agrupadas por categorias
   • Cada linha inclui: ranking, tipo de despesa, percentual, valor em reais
   • Destaque para Alimentação (96,25% - R$ 45.200,30)

3. Painel "Despesas por Veículo - 11-2024":

   • Lista de despesas do mês agrupadas por veículo
   • Cada linha inclui: ranking, placa/identificação do veículo, percentual, valor em reais
   • Destaque para OEB-2320 (96,32% - R$ 45.231,39)

4. Cabeçalho Receita Total:

   • Valor total da receita do mês selecionado (R$ 5.743,23)
   • Percentual de comparação com o mês anterior (+126,11%)

5. Painel "Receitas por Tipo - 11-2024":

   • Lista com tipo de receita, percentual, valor em reais
   • Apenas Frete Durafix (100% - R$ 5.743,23)

6. Painel "Receitas por Veículo - 11-2024":

   • Lista com veículo, percentual, valor em reais
   • Apenas SLU-SD66 (100% - R$ 5.743,23)

Elementos Interativos

1. Botões de navegação em cada painel (setas para rolar quando há mais itens)
2. Gráfico interativo - permite clicar em um mês para filtrar os dados
3. Links nos itens de lista - ao clicar em um tipo de despesa ou veículo, exibe uma janela popup com os detalhes daquele item
4. Popup de detalhamento (não visível nas imagens, mas referenciado no código)

Propósito e Fluxo de Trabalho

O propósito desta tela é fornecer uma visão completa das finanças relacionadas à frota, permitindo:

1. Análise de tendências - através do gráfico de 12 meses
2. Identificação de gastos principais - visualizando os itens que mais impactam o orçamento
3. Comparação de eficiência entre veículos - detalhando receitas e despesas por unidade
4. Acompanhamento de variações mensais - com indicadores percentuais de variação
5. Detalhamento de transações específicas - através da funcionalidade de popup

Fluxo de trabalho típico:

1. O usuário acessa o dashboard para visualizar o panorama financeiro da frota
2. Analisa os dados consolidados dos últimos 12 meses (parte superior)
3. Observa o gráfico para identificar meses atípicos ou tendências
4. Clica em um mês específico no gráfico para analisar em detalhe
5. Verifica os dados detalhados do mês selecionado na parte inferior
6. Se necessário, clica em um tipo de despesa ou veículo para ver as transações individuais

Guia Passo a Passo

Como Navegar pelo Dashboard

1. Acessar o Dashboard de Despesas:

   • No menu principal, selecione a opção "Dashboard de Despesas"
   • A tela carregará automaticamente os dados dos últimos 12 meses

2. Analisar Dados Consolidados:

   • Observe os totais de despesas e receitas dos últimos 12 meses no topo da página
   • Verifique as listas de "Total de Despesas por Tipo" e "Total de Despesas por Veículo"
   • Use as setas de navegação caso haja mais itens do que cabem na visualização

3. Consultar Detalhes de uma Despesa ou Receita:

   • Clique no nome do tipo de despesa/receita ou no nome do veículo
   • Um popup se abrirá mostrando todas as transações relacionadas
   • Na janela de detalhamento, você pode ver: número de índice, tipo, nome, data, valor e placa

4. Filtrar por Mês Específico:

   • No gráfico de barras "Despesas x Receitas dos 12 últimos meses", clique na barra do mês desejado
   • Os painéis inferiores serão atualizados automaticamente para mostrar apenas os dados daquele mês
   • Observe o percentual de variação em relação ao mês anterior

5. Fechar Popups de Detalhamento:

   • Clique no botão de fechar (X) no canto superior do popup
   • Ou clique fora da área do popup

Como Interpretar os Dados

1. Análise de Tendências:

   • Use o gráfico de barras para identificar meses com despesas ou receitas atípicas
   • Compare os valores mensais para detectar padrões sazonais

2. Identificação de Problemas:

   • Observe os tipos de despesas com percentuais maiores
   • Verifique os veículos que estão gerando mais despesas em relação às suas receitas

3. Comparação de Desempenho:

   • Compare a proporção entre receitas e despesas para cada veículo
   • Identifique veículos que possam estar operando de forma ineficiente

Perguntas Frequentes

1. Como identificar o veículo que mais gera despesas?

No painel "Total de Despesas por Veículo", os veículos são listados em ordem decrescente de valor. O veículo no topo da lista é o que gerou mais despesas no período.

2. Como posso ver as transações individuais de um determinado tipo de despesa?

Clique no nome do tipo de despesa (por exemplo, "ALIMENTAÇÃO") em qualquer um dos painéis. Um popup será exibido mostrando todas as transações daquele tipo para o período selecionado.

3. Por que alguns valores de despesas aparecem como negativos no gráfico?

No contexto financeiro do sistema, despesas são representadas como valores negativos (saídas) e receitas como valores positivos (entradas), facilitando a visualização do impacto no caixa.

4. Como posso comparar as despesas de um mês específico com o mês anterior?

Clique no mês desejado no gráfico de barras. Na seção inferior, ao lado do valor total, o sistema exibe a variação percentual em relação ao mês anterior (por exemplo, "+9.292,04% comparado ao mês anterior").

5. É possível exportar esses dados para análise externa?

O sistema atualmente não mostra um botão de exportação visível na interface. Consulte o administrador do sistema sobre recursos de exportação disponíveis.

6. Como são calculados os percentuais em cada categoria?

Os percentuais são calculados dividindo o valor de cada item pelo valor total da categoria. Por exemplo, se Alimentação representa R$ 45.200,30 de um total de R$ 46.960,18 em despesas, seu percentual será de aproximadamente 96,25%.

7. Por que algumas despesas aparecem com 0,00%?

Valores muito pequenos em relação ao total podem resultar em percentuais próximos a zero. O sistema arredonda esses valores para exibição, mas considera os valores reais nos cálculos.

8. Posso filtrar por um veículo específico?

A interface principal não mostra filtros diretos por veículo, mas ao clicar no nome do veículo nos painéis, você pode ver seus detalhes específicos.

Regras de Negócio e Funcionamento Interno

Carregamento de Dados

O dashboard realiza várias chamadas ao servidor para obter os diferentes conjuntos de dados. O processo começa com a função fetchDados() que é executada automaticamente quando o componente é montado. Esta função:

1. Busca dados através da API REST "DashboardDespesas/Carregar"
2. Recebe um objeto de resposta contendo todos os dados financeiros
3. Processa os dados em vários subconjuntos para popular cada painel
4. Calcula estatísticas como percentuais e totalizações

Os dados são organizados em listas categorizadas:

• graficoDespesasDoMes.analyticsData - despesas do mês por tipo
• graficoReceitasDoMes.analyticsData - receitas do mês por tipo
• graficoDespesasDoMes.analyticsDataPorVeiculo - despesas do mês por veículo
• graficoReceitasDoMes.analyticsDataPorVeiculo - receitas do mês por veículo
• totalListaDespesasPorTipo - despesas totais por tipo (12 meses)
• totalListaReceitasPorTipo - receitas totais por tipo (12 meses)
• listaTotalDespesasSomatorioPorVeiculo - despesas totais por veículo (12 meses)
• listaTotalReceitasSomatorioPorVeiculo - receitas totais por veículo (12 meses)

Filtragem por Período

O sistema permite duas abordagens para filtrar dados por período:

1. Filtro por parâmetro MesAno: Se um mês/ano específico for passado para a API, os dados retornados serão filtrados para aquele período.

2. Filtro por clique no gráfico: Quando o usuário clica em uma barra no gráfico, a função carregarDados(indiceGrafico) é chamada, que:

   • Extrai o mês/ano do array listaCategorias usando o índice da barra clicada
   • Atualiza a variável labelMes para refletir o período selecionado
   • Chama fetchDados() com o novo período para atualizar todos os painéis

Detalhamento de Transações

Quando um usuário clica em um tipo de despesa/receita ou veículo específico, o sistema:

1. Determina se a solicitação é para o mês atual ou para os últimos 12 meses usando funções como fetchListaDespesaVeiculoMes() ou fetchListaDespesaVeiculo12Mes()
2. Define os parâmetros apropriados para a API (intervalo de datas, ID do veículo, tipo)
3. Faz a chamada à API e recebe uma lista detalhada de transações
4. Exibe as transações em um popup (controlado pelo objeto popupLista)

Formatação de Valores

O sistema utiliza funções de formatação para apresentar os valores de forma consistente:

• formatarNumero() - formata números para exibição (ex: 1,234.56)
• formatarMoedaReal() - formata valores monetários incluindo o símbolo da moeda (ex: R$ 1.234,56)

Tratamento de Valores Parcelados

O sistema considera tanto despesas normais quanto parceladas em seus cálculos. No backend, as consultas SQL recuperam:

• Despesas normais (isPagamentoParcelado = 0) diretamente da tabela DespesasVeiculos
• Pagamentos parcelados (isPagamentoParcelado = 1) através de junção com a tabela PagamentosDespesasReceitas

Isso garante que todas as obrigações financeiras sejam refletidas corretamente, independentemente da forma de pagamento.

Cálculo de Comparações

O sistema oferece comparações porcentuais entre períodos:

• Para o mês selecionado, mostra a variação percentual em relação ao mês anterior
• O cálculo é feito através da fórmula: ((valorAtual/valorAnterior) - 1) * 100
• Valores positivos indicam aumento, valores negativos indicam redução

Por exemplo, uma despesa de R$ 46.960,18 em 11-2024 comparada com um valor menor no mês anterior resultou em +9.292,04% de aumento.

Agrupamentos e Categorizações

O sistema aplica diversas regras de negócio para categorizar transações, incluindo:

• Padronização de nomes de tipos (ex: transformando "ABASTECIMENTOINTERNO" em "ABASTECIMENTO INTERNO")
• Concatenação de placa e nome do veículo (ex: "placa / labelVeiculo")
• Ordenação de listas por valor total em ordem decrescente
• Cálculo de percentuais baseados no total da categoria

Estes processamentos garantem uma visualização consistente e significativa dos dados financeiros.