Listagens e tabelas
mad-col-edit
mad-data-grid-edit-cell
mad-data-grid-edit-inline
mad-data-grid-edit-cell / mad-data-grid-edit-inline não são tags
Não existem componentes com esse nome — são os modos "click" e "inline" da prop
edit-mode de <mad-col>. O terceiro modo, "dblclick", é o
padrão quando edit-mode é omitido. Toda edição abaixo grava de verdade em
tutor_pedidos (tabela sandbox do MAD Lab) via
MadDataGrid::onInlineSave, que já vem pronto em qualquer
<mad-grid model="...">.
Clique para editar (edit-mode=click)
Ícone de lápis abre o editor na célula. Texto (descrição) e dinheiro (valor) — persistência real via onInlineSave.
Visible columns
|
Cód.
|
Cliente
|
Descrição
|
Valor
|
|---|---|---|---|
| 1 |
Pedido #1
|
R$ 2.358,46
|
|
| 2 |
Pedido #2
|
R$ 747,15
|
|
| 3 |
Pedido #3
|
R$ 7.424,20
|
|
| 4 |
Pedido #4
|
R$ 8.578,21
|
|
| 5 |
Pedido #5
|
R$ 4.406,22
|
|
| 6 |
Pedido #6
|
R$ 2.329,41
|
resources/views/tutor/examples/grids-inline-avancado/clique.blade.php
<mad-grid model="TutorDemoPedido" database="business" per-page="6" no-export>
<mad-columns>
<mad-col field="id" label="Cód." width="70" right />
<mad-col field="{cliente->nome}" label="Cliente" />
<mad-col field="descricao" label="Descrição" edit edit-type="text" edit-mode="click" />
<mad-col field="valor_total" label="Valor" right money="R$"
edit edit-type="money" edit-mode="click" />
</mad-columns>
</mad-grid>
Sempre editável (edit-mode=inline)
Editor de data sempre visível na célula, sem precisar clicar.
Visible columns
|
Cód.
|
Cliente
|
Data do pedido
|
|---|---|---|
| 1 |
DSTQQSS
|
|
| 2 |
DSTQQSS
|
|
| 3 |
DSTQQSS
|
|
| 4 |
DSTQQSS
|
|
| 5 |
DSTQQSS
|
|
| 6 |
DSTQQSS
|
resources/views/tutor/examples/grids-inline-avancado/inline.blade.php
<mad-grid model="TutorDemoPedido" database="business" per-page="6" no-export>
<mad-columns>
<mad-col field="id" label="Cód." width="70" right />
<mad-col field="{cliente->nome}" label="Cliente" />
<mad-col field="dt_pedido" label="Data do pedido" date="d/m/Y"
edit edit-type="date" edit-mode="inline" />
</mad-columns>
</mad-grid>
Duplo-clique (padrão) + mad-col-edit type=select
edit-mode omitido cai no padrão dblclick. Opções vêm de TutorGridsInlineAvancado::estadoOptions().
Visible columns
|
Cód.
|
Cliente
|
Estado (duplo-clique)
|
|---|---|---|
| 1 |
Enviado
|
|
| 2 |
Cancelado
|
|
| 3 |
Entregue
|
|
| 4 |
Entregue
|
|
| 5 |
Em separação
|
|
| 6 |
Enviado
|
resources/views/tutor/examples/grids-inline-avancado/select.blade.php
@php
// Partial de <x-tutor-demo> = escopo Blade isolado — `$that` não chega
// sozinho; reobtido via o stack estático do MadRenderContext.
$that = \Mad\Component\MadRenderContext::getComponent();
@endphp
<mad-grid model="TutorDemoPedido" database="business" per-page="6" no-export>
<mad-columns>
<mad-col field="id" label="Cód." width="70" right />
<mad-col field="{cliente->nome}" label="Cliente" />
<mad-col field="estado_id" label="Estado (duplo-clique)"
badge="1:info:Novo|2:warning:Em separação|3:primary:Enviado|4:success:Entregue|5:danger:Cancelado">
<mad-col-edit type="select" :opts="$that->estadoOptions()" />
</mad-col>
</mad-columns>
</mad-grid>
app/control/Tutor/TutorGridsInlineAvancado.php
/** Opções do editor <mad-col-edit type="select"> (estado do pedido). */
public function estadoOptions(): array
{
return TutorDemoEstadoPedido::query()->orderBy('ordem')->pluck('nome', 'id')->all();
}
Editor ligado a banco (mad-col-edit type=dbcombo)
Dropdown com busca carregado de TutorDemoCategoria; transform mostra o nome quando a célula não está em edição.
Visible columns
|
Cód.
|
Cliente
|
Categoria (clique)
|
|---|---|---|
| 1 |
Papelaria
|
|
| 2 |
Alimentos
|
|
| 3 |
Eletrônicos
|
|
| 4 |
Brinquedos
|
|
| 5 |
Vestuário
|
|
| 6 |
Livros
|
resources/views/tutor/examples/grids-inline-avancado/dbcombo.blade.php
<mad-grid model="TutorDemoPedido" database="business" per-page="6" no-export>
<mad-columns>
<mad-col field="id" label="Cód." width="70" right />
<mad-col field="{cliente->nome}" label="Cliente" />
<mad-col field="categoria_id" label="Categoria (clique)" transform="TutorGridsInlineAvancado::categoriaNome">
<mad-col-edit type="dbcombo" model="TutorDemoCategoria" display="nome" database="business" mode="click" />
</mad-col>
</mad-columns>
</mad-grid>
app/control/Tutor/TutorGridsInlineAvancado.php
/** Transform de leitura da coluna categoria_id — nome em vez do id cru. */
public static function categoriaNome(mixed $value, object $row): string
{
return TutorDemoCategoria::query()->find($value)?->nome ?? '—';
}
Código-fonte completo da página
app/control/Tutor/TutorGridsInlineAvancado.php
<?php
namespace App\Control\Tutor;
use App\Models\TutorDemo\TutorDemoCategoria;
use App\Models\TutorDemo\TutorDemoEstadoPedido;
use App\Support\Tutor\TutorDemoSeed;
use App\Support\Tutor\TutorPage;
/**
* TutorGridsInlineAvancado — catálogo grids_inline_avancado.
*
* Os "componentes" citados no catálogo (mad-data-grid-edit-cell,
* mad-data-grid-edit-inline) NÃO existem como tags autônomas — confirmado
* via mad_props (ambos retornam "não encontrado") e mad_search_rules (zero
* ocorrência no framework). São os dois modos de `edit-mode` do <mad-col>:
* "click" (ícone lápis, abre o editor ao clicar na célula) e "inline"
* (editor sempre visível, sem clique). O terceiro modo, "dblclick", é o
* default quando `edit-mode` é omitido. O terceiro tag do catálogo,
* <mad-col-edit>, é o filho tipado de <mad-col> que declara o widget do
* editor (texto/número/data/select/dbcombo/...).
*
* A edição AQUI PERSISTE DE VERDADE: <mad-grid model="TutorDemoPedido">
* (sem `self`) compila para \Mad\Grid\MadGrid::_renderFromConfig(), que
* instancia um Mad\Grid\MadGrid próprio — e MadGrid extends MadDataGrid.
* Ou seja, cada grid embutido nesta página já carrega
* MadDataGrid::onInlineSave($id, $field, $value) pronto: clique/duplo-clique/
* inline grava direto via `$modelClass::find($id)->$field = $value; ->save();`
* — sem a página precisar herdar de MadDataGrid nem escrever handler algum.
* tutor_pedidos é tabela sandbox do MAD Lab: seguro editar de verdade.
*/
class TutorGridsInlineAvancado extends TutorPage
{
protected string $catalogKey = 'grids_inline_avancado';
public function mount(array $params = []): void
{
TutorDemoSeed::ensure();
}
/** Opções do editor <mad-col-edit type="select"> (estado do pedido). */
public function estadoOptions(): array
{
return TutorDemoEstadoPedido::query()->orderBy('ordem')->pluck('nome', 'id')->all();
}
/** Transform de leitura da coluna categoria_id — nome em vez do id cru. */
public static function categoriaNome(mixed $value, object $row): string
{
return TutorDemoCategoria::query()->find($value)?->nome ?? '—';
}
}
resources/views/tutor/grids/inline-avancado.blade.php
<x-tutor-page page="grids_inline_avancado">
<mad-callout type="info" title="mad-data-grid-edit-cell / mad-data-grid-edit-inline não são tags" icon="info">
Não existem componentes com esse nome — são os modos "click" e "inline" da prop
<code>edit-mode</code> de <code><mad-col></code>. O terceiro modo, "dblclick", é o
padrão quando <code>edit-mode</code> é omitido. Toda edição abaixo grava de verdade em
<code>tutor_pedidos</code> (tabela sandbox do MAD Lab) via
<code>MadDataGrid::onInlineSave</code>, que já vem pronto em qualquer
<code><mad-grid model="..."></code>.
</mad-callout>
<x-tutor-demo demo="tutor.examples.grids-inline-avancado.clique"
title="Clique para editar (edit-mode=click)"
desc="Ícone de lápis abre o editor na célula. Texto (descrição) e dinheiro (valor) — persistência real via onInlineSave." />
<x-tutor-demo demo="tutor.examples.grids-inline-avancado.inline"
title="Sempre editável (edit-mode=inline)"
desc="Editor de data sempre visível na célula, sem precisar clicar." />
<x-tutor-demo demo="tutor.examples.grids-inline-avancado.select"
title="Duplo-clique (padrão) + mad-col-edit type=select"
desc="edit-mode omitido cai no padrão dblclick. Opções vêm de TutorGridsInlineAvancado::estadoOptions()."
php="TutorGridsInlineAvancado::estadoOptions" />
<x-tutor-demo demo="tutor.examples.grids-inline-avancado.dbcombo"
title="Editor ligado a banco (mad-col-edit type=dbcombo)"
desc="Dropdown com busca carregado de TutorDemoCategoria; transform mostra o nome quando a célula não está em edição."
php="TutorGridsInlineAvancado::categoriaNome" />
</x-tutor-page>