gallabs's picture
Add 2 files
19bce99 verified
Crie uma interface web responsiva para o gerenciamento de "Pedidos de Compra" utilizando HTML, CSS e JavaScript puro (ou Bootstrap 5, se preferir). A tela deve conter: - Título: "Pedidos de Compra" - Um botão para "Novo Pedido de Compra" - Uma tabela para listar os pedidos com as colunas: - Número do Pedido de Compra - Fornecedor - Responsável pela Compra - Data de Emissão - Data de Previsão de Entrega - Status do Pedido (Em Elaboração, Aguardando Aprovação, Aprovado, Enviado, Recebido Parcial, Recebido Total, Cancelado) - Valor Total - Ações (Visualizar, Editar, Cancelar, Imprimir) - Filtros por fornecedor, status, responsável e data. - Ao visualizar um pedido, abrir um modal ou tela de detalhe com: - Dados do Fornecedor, Responsável, Condições de Pagamento, Observações - Lista dos Itens do Pedido de Compra, colunas: - Produto (Nome) - Categoria do Produto - Quantidade Solicitada - Valor Unitário Negociado - Valor Total do Item - Quantidade Recebida - Status do Item (Pendente, Recebido, etc.) - Ações por item (Editar, Registrar Recebimento, Remover) - Botão para "Adicionar Item" - Botão para "Enviar para Aprovação" (habilitado apenas enquanto o status for "Em Elaboração") - Botão para "Registrar Recebimento" (parcial/total, conforme status) - Botão para "Cancelar Pedido" (com modal de confirmação) - Histórico de eventos/ações do pedido no final da tela - Confirmações e alertas devem usar modal estilo SweetAlert2. - Layout limpo, organizado, responsivo, com boas práticas de UX para facilitar o dia a dia de quem opera. - Utilize ícones modernos (FontAwesome ou Bootstrap Icons), cores suaves e espaçamento adequado. - Por favor, gere no modo dark (tema escuro), com um botão que alterne entre uma "meia lua, para dark" e "um sol, para modo light".
Por favor, no botão "+ Novo Pedido de Compra". Chame um Modal ou um OffCanvas (com 50% da página) para adicionar um novo "Pedido de Compra" direto desta página, sem precisar buscar num Orçamento. E onde está a engrenagem, mude para uma "meia lua" para o modo dark, e ao alternar para o modo light, alterne o botão para um "sol".
Ponha um ícone (um sino) de notificação, com um badge indicando 6 notificações, e ao clicar, exiba as notificações num DropDown.