search

tbizze / finance2

Projeto para aplicação de gerenciador financeiro.
0 stars 1 forks source link

Front-end: Cadastro de despesa #1

Open tbizze opened 4 months ago

tbizze commented 4 months ago

Proposta de uma tela mult-step, de fácil utilização e que evite erros ao realizar o cadastro. Então, segregar as informações que devem ser passadas em grupos, deixando a tela mais limpa.

  1. Emissor (para quem vai o pagamento)
  2. Classe da despesa
  3. Informações básicas (data emissão/vencimento, número/código/referência, nº da parcela, total de parcelas)
  4. Informações de valores. Pode variar, conforme a classe. Ex.: uma NF pode ter vários itens, outros podem ser de item único.
  5. Notas

Pagamentos parcelados

Quando se tratar de pgto parcelado, se realizará uma cópia do documento de despesa, alterando o nº da parcela. E no campo total de parcelas, informar quantas parcelas aquele documento terá.

Isso porque cada documento estará relacionado a uma baixa. Por isso se copia o documento, para demais parcelas.

NOTAS: Após avançar cada etapa, carregar informações básicas abaixo do indicador de etapas concluído.

Inputs field & Validation Este vídeo implementa mult-step com validação, bem simples e fácil.

tbizze commented 4 months ago

Sugestão de tela: Step #1 - Emissor

A seleção do emissor pode ser

cadastrar-documento-emissor1

NOTA: depois de selecionado o emissor, exibir algumas informações

cadastrar-documento-emissor2

5 Livewire Examples // 11:06 Example 4 - Ingredients Autocomplete Este vídeo mostra um add itens filho, com autocomplete muito interessante. Feito via componente, com isso pode ser reutilizado em outra lugar.

tbizze commented 4 months ago

Sugestão de tela: Step #4 - Item

A seleção da categoria pode ser

cadastrar-documento-item1

Depois de selecionado, pode exibir informações adicionais como categoria pai. E então:

cadastrar-documento-item2

5 Livewire Examples // 11:06 Example 4 - Ingredients Autocomplete Este vídeo mostra um add itens filho, com autocomplete muito interessante. Feito via componente, com isso pode ser reutilizado em outra lugar.

Inputs field Este vídeo mostra em livewire uma maneira bem simples de se fazer mais linhas de inputs.

tbizze commented 4 months ago

Sugestão de tela: Step #5 - Notas

Apresentar formulário para digitar notas/observações.

Vale lembrar que essas notas não aparecerão em relatórios, servindo como registro de informações complementares para esclarecimentos de dúvidas futuras.

Ex.: Um pgto de conta de água. Foi feito cobrança com risco de corte por atrasos. Então foi pago ao operador da Sabesp no portão da unidade.

NOTA: este pode ser um Step a parte, ou ficar na parte inferior do Step 3 - Informações.

tbizze commented 4 months ago

Sugestão de tela: Step #6 - Concluir

Deve conter:

cadastrar-documento-final