Produto
Ficha do item de catálogo — forehead com galeria, etiquetas de tipo e área de preço/compra (BRL por unidade + Adicionar ao carrinho) + abas de ancoragem (Informações gerais, Unidades organizacionais, Contratos) sobre seções numeradas.
O ponto de partida: a tela cheia de Produto — Subheader com as ações por status, Forehead, caixa de identificação e as abas (Especificações · Dados comerciais · Fornecimento & logística · Manuais & documentos · Unidades organizacionais · Contrato · Itens relacionados). As seções abaixo detalham cada parte.
Além da tela cheia, Produto — como todo documento — também abre em modal ao clicar no item na index, sem sair da listagem. Mesma anatomia (Forehead, abas, ações); muda só a moldura. No mobile vira um modal-sheet que sobe quase até o topo (o header da index fica aparente atrás); o ícone expandir abre o formato page.
Boas práticas
Produto segue o chassi de Estrutura de Documento. Esta página cobre só o que é próprio do tipo — abas, status e ações.
Anatomia & abas
As abas do documento, na ordem — “Especificações” é a aba padrão. O Forehead, a caixa de identificação e o corpo seguem o chassi de Estrutura de Documento.
Especificações
Atributos técnicos em grid 4→3→2→1 (item genérico/crítico, tipo de material, aplicação, origem, margem, país, lote, validade/Anvisa) — a aba padrão.
Dados comerciais
Campos comerciais (moeda, MRP, estocável, serviço) + seção colapsável Impostos + Exceções de ICMS e Exceção de IPI (colapsáveis XL com cards internos MD, badge Ativo/Inativo).
Fornecimento & logística
Embalagem (colapsável, grid) + Fabricantes (colapsável → tabela padrão com busca/gráfico/mais-ações).
Manuais & documentos
Tabela de arquivos (Nome→drawer, Usuário, Data, Tamanho, Categoria, Descrição, Revisão) com seleção múltipla, download por linha e "Baixar selecionados".
Unidades organizacionais
Texto de contexto + tabela (Código, Nome, Preço orçado para a unidade) — o preço local substitui o global só naquela UO.
Contrato
Contratos do item em tabela, com Visão horizontal (tabela normal) e Visão vertical (transposta: campos nas linhas, fornecedor no topo de cada coluna); coluna Quantidade com stepper + carrinho.
Itens relacionados
Carrossel (UCarousel) com os mesmos cards do Card View (imagem, badges, preço, fornecedor, tags, stepper + carrinho, favoritar).
Status
Os status semânticos de Produto — o badge no Forehead muda com a etapa do fluxo.
| Status | Significado |
|---|---|
| Normal | Item disponível para compra. |
| Especial | Item com condição/tratamento especial. |
| Bloqueado | Indisponível para compra. |
Ações
Onde ficam as ações de Produto — a primária aparece conforme o status; o excedente recolhe em “Mais ações”.
| Zona | Ação | Quando |
|---|---|---|
| Subheader | Editar | Atualiza os atributos do item. |
| Subheader | Adicionar ao carrinho | Ação primária do catálogo — leva o item ao carrinho (preço BRL por unidade no forehead). |
| Mais ações | Favoritar, Adicionar à lista, Histórico de preços, Exportar | Recolhidas por baixa frequência. |
Particularidades
O que distingue Produto dos demais documentos.
Sem "locais"
A ficha não tem Entrega/Faturamento/Cobrança; disponibilidade vira a aba Unidades organizacionais.
Forehead expandido ⇄ recolhido
O forehead começa expandido (galeria + detalhes + painel de preços) e colapsa numa barra compacta ao rolar; a barra recolhida fica fixa junto das abas. "Ver mais" volta ao topo expandido.
Área de compra no forehead
O forehead traz preço (BRL/EUR por unidade) e Adicionar ao carrinho — a ação primária do catálogo.
Abas de ancoragem
Abas como âncoras (scroll-spy) sobre seções numeradas no mesmo corpo.
Relações & ciclo de vida
Os documentos com que Produto se conecta no ME.
Componentes usados
A tela é montada com componentes do EletroDS — a mecânica de cada um (variantes, estados, props) vive em Componentes.