Timeline: toda tabela com data vira uma linha do tempo.

As vendas mais recentes, agrupadas por dia

Você não escreve consulta. Aponta a tabela e diz qual campo é o título, qual é o corpo e qual é a data. A página ordena os registros, agrupa por dia e desenha o trilho.

Uma tag monta a página inteira

No código gerado, a página cabe numa tag só. O mesmo formato serve para histórico de pedidos, movimentação de estoque, auditoria e atendimento.

<mad-timelinemodel="Venda"title_field="titulo_timeline"   {{-- accessor: cliente + valor --}}body_field="resumo_timeline"    {{-- accessor: vendedor · pagamento · itens --}}date_field="data_venda"color_field="status"date_format="d/m/Y":limit="14"cards />

Quando usar a timeline

A timeline serve para contar a história de alguma coisa: o que aconteceu, em que ordem e em que dia. Ela é feita para ler de cima a baixo, sem colunas nem grade de dias.

• Histórico do cliente. Pedidos, contatos e chamados em ordem de data, para quem vai atender saber o que já aconteceu.
• Movimentação de estoque. Entradas e saídas de um produto, cada uma com a sua cor.
• Auditoria. Quem mudou o quê e quando, com as mudanças agrupadas por dia.
• Acompanhamento de pedido. Pago, separado, enviado: cada passo com a sua data e o seu ícone.

Se a pessoa precisa filtrar, ordenar por outras colunas ou exportar, a listagem é o tipo certo. Se ela precisa ver a semana e o mês em grade, ou mudar a data arrastando, use o calendário. Você também pode descrever a timeline em português e pedir ao agente de IA, que cria a página com o PHP e o Blade.

O que você configura

Tudo fica na mesma tag. Estes são os atributos do exemplo e o que cada um muda.

Tabela model

De onde vêm as entradas. Aqui, a tabela de vendas.

Título e corpo title_field

O campo que vira o título de cada entrada. O texto logo abaixo vem do body_field.

Data date_field

O campo que ordena as entradas e decide em que dia cada uma é agrupada. O formato do selo vai em date_format.

Cor color_field

O campo que dá a cor de cada entrada. Aqui, o status da venda.

Quantidade limit

Quantas entradas a página mostra. O exemplo para em 14.

Cards cards

Mostra cada entrada num card. Sem ele, a entrada fica numa linha simples.

O que vai para o projeto Laravel

A timeline é uma classe em app/Control com a view <mad-timeline>. Os itens podem vir de três lugares:

• Título e corpo em accessors do model. No exemplo, titulo_timeline e resumo_timeline são accessors do model Venda. Um junta cliente e valor, o outro junta vendedor, pagamento e itens.
• Itens montados em PHP. Sem tabela, a lista sai de um método da tela (:items="$that->timelineItems()"), com data, título, corpo, ícone e cor de cada item.
• Itens escritos na view. Para uma linha do tempo fixa, cada entrada é uma tag <mad-timeline-item>, com título, data e ícone.

Como toda tela do MadBuilder, esses arquivos abrem no seu editor, vão para o seu Git e aceitam código à mão em blocos protegidos, que continuam lá quando a tela é gerada de novo. Veja como o código é gerado.

Perguntas sobre a timeline

E mais

Veja também o Calendário ou os tipos de página.