# Adicionar suporte a drill no gráfico de tabela
Hoje temos suporte a drill down/anyware para alguns tipos de gráficos, como o gráfico de pizza, ou o de barras. Alem desses precisamos dar suporte ao drill no gráfico de tabela, então será necessário realizar toda a análise e implementação para que isso seja possivél já que os gráficos de tabela, não dão suporte ao drill.
**Exemplo de uso:**
Na tabela abaixo foi configurada dentro do KPI builder para que quando clicarmos sobre alguma linha seja feito um filtro pelo vendedor correspondente a linha clicada.
| Vendedor | Total de Vendas |
| -------- | --------------- |
| João | R$ 10.152,60 |
| Maria | R$ 9.130,02 |
| José | R$ 8.324,88 |
| Pedro | R$ 5.456,93 |
Ao clicarmos na linha do vendedor **João** será carregado o drill de outra tabela, a qual foi configurada para mostrar o cliente e o valor de cada venda que João realizou, como podemos observar abaixo:
| Vendedor | Cliente | Valor da Venda |
| -------- | -------- | ---------------- |
| João | Bruno | R$ 4.523,60 |
| João | Raimundo | R$ 2.235,00 |
| João | Roberto | R$ 1.503,00 |
| João | Ana | R$ 1.891,00 |
**Separação inicial das tarefas e estimativas de hora:**
* (6h) - [Front] - Adicionar a propriedade onClick na AgGrid, e adequar o seu retorno para que faça a mesma função dos outros charts.
* (8h) - [Front] - Modificar o componente Kpi.jsx para que utilize o atributo value no lugar de categoria quando for do tipo tabela e ajustar a montagem dos filtros.
* (2h) - [Front] - Validar se o componente View funcionará de forma correta quando chamado a função onClick pela AgGrid.
* (24h) - [Front] - Possibilitar adicionar drills nos Kpis do tipo tabela dentro do KPI Builder e analisar o que será necessário alterar o back end.
* (20h) - [Back] - Adicionar novo atributo KpiValue na entidade DrillFilter e criar validações sobre os atributos KpiValue e KpiCategory.
* (2h) - [Back] - Gerar migration.
* (2h) - Validar se a alteração no backend não irá impactar no filtro que é criado ao realizar o drill.
* (32h) - Testes na web e mobile.
*Horas de desenvolvimento: 64h
Horas de teste: 32h
Total de horas: 96h***
2. Levantamento técnico
* AgGrid tem suporte para seleção de linha:
```
handleGridReady = ({ api }) => {
this.gridApi = api;
};
handleSelect = () => {
console.log(this.gridApi.getSelectedRows());
};
<AgGri
...
onGridReady={this.handleGridReady}
rowSelection="single"
onSelectionChanged={this.handleSelect}
/>
```