File size: 2,139 Bytes
7054af0
1
Crie uma interface web responsiva para o cadastro e gerenciamento de "Orçamentos" utilizando HTML, CSS e JavaScript puro (pode usar Bootstrap 5 se desejar).   A tela deve conter:  - Título: "Orçamentos" - Um botão para "Novo Orçamento" - No botão `Novo Orçamento`, por favor abra um offcanvas, com 1/3 de largura em relação à tela principal. - Abra o OffCanvas da direita para a esquerda (right offcanvas) de forma suave. - Uma tabela para listar orçamentos existentes com as colunas:     - Número do Orçamento     - Nome do Cliente Potencial     - Vendedor Responsável     - Data de Criação     - Data de Validade     - Status do Orçamento (ex: Em Elaboração, Aguardando Análise, Análise Concluída, Convertido em Pedido de Venda, Cancelado)     - Ações (Visualizar, Editar, Duplicar, Cancelar, Converter em Pedido de Venda) - Um campo de busca/filtro por cliente, vendedor, status e data. - Ao clicar em "Visualizar" ou "Editar", abrir um modal ou ir para uma nova tela com os detalhes completos do Orçamento, incluindo:     - Dados do Cliente Potencial     - Vendedor Responsável     - Status, Observações     - Lista de itens do orçamento, com as colunas:         - Produto (Nome)         - Categoria do Produto         - Fornecedor Sugerido         - Quantidade         - Valor Unitário Orçado         - Status do Item (Pendente, Aprovado para Compra, etc.)         - Ações por item (Editar, Remover)     - Botão para "Adicionar Item", que abre um formulário inline ou modal para seleção de Produto, Fornecedor, Quantidade e Valor.     - Botão para "Enviar para Análise de Compra"     - Botão para "Cancelar Orçamento" 	- Histórico de eventos/ações do orçamento no final da tela - Alertas de Confirmações devem usar o SweetAlert2. - Para as tabelas, utilize o datatables. - Interface deve ser moderna, clean, responsiva, com feedback visual nas ações (sucesso/erro). - Utilize ícones modernos (FontAwesome ou Bootstrap Icons), cores suaves e espaçamento adequado. - Por favor, gere no modo dark (tema escuro). - Ao invés de usar `tailwindcss`, por favor, utilize o `Bootstrap 5.3.2`.