po-angular icon indicating copy to clipboard operation
po-angular copied to clipboard

PoTableColumn - property - Ler um objeto JavaScript

Open thiagogoncalves opened this issue 5 years ago • 12 comments

Qual o comportamento atual?

Ao criar uma tabela(po-table) e ler um objeto JSON, gostaria de poder setar na coluna(objeto PoTableColumn) o valor que esta dentro de um objeto JavaScript, por exemplo:

Objeto: { client: { fantasyName: 'Nome fantasia' } }

Definição das colunas no componente. columns: Array<PoTableColumn> = [ { property: 'client.fantasyName', label: 'Cliente' } ];

Que comportamento você esperava ver?

Exibir o valor do campo dentro do objeto. Atualmente eu precisei fazer um "forEach" e setar manualmente numa nova propriedade do objeto.

Ambiente

  • Portinari: 1.13
  • Angular: 8
  • Browser(s): Google Chrome
  • Operating System (e.g. Windows, macOS, Ubuntu): Linux

thiagogoncalves avatar Oct 20 '19 23:10 thiagogoncalves

Boa! isso faz muita falta neste componente

joao-arthur-moreira avatar Oct 21 '19 13:10 joao-arthur-moreira

Ola Thiago!

Esta implementação seria o que você necessita? https://stackblitz.com/edit/portinariui-ztrahf

Caso não seja você poderia dar mais detalhes do seu código?

Aguardo seu retorno, qualquer dúvida estou a disposição.

rafaellygruber avatar Oct 21 '19 17:10 rafaellygruber

Oi Rafaelly, tudo bem ?

Seria quase isso. No caso o objeto estaria na variável "items".

`columns= [{ property: 'client.nameFantasy', label: 'Nome Fantasia' }];

items = [ { client: { nameFantasy: 'Nome do cliente' } } ];`

Att. Thiago Gonçalves dos Santos

thiagogoncalves avatar Oct 21 '19 18:10 thiagogoncalves

Ola, tudo bem.

Uma dúvida para entender melhor a demanda, no caso que existem muitos itens, como saber qual deles deve ser utilizado como 'property'?

Por exemplo:

`columns= [{ property: 'client.nameFantasy', label: 'Nome Fantasia' }];

items = [ { client: { nameFantasy: 'Nome do cliente 1' } }, { client: { nameFantasy: 'Nome do cliente 2' } }, { client: { nameFantasy: 'Nome do cliente 3' } }, ]

Nesse caso, seriam criadas 3 colunas (uma para cada nameFantasy) ?

Aguardo seu retorno.

rafaellygruber avatar Oct 21 '19 18:10 rafaellygruber

Oi Rafaelly,

Não serio o contrário, 1 coluna com 3 linhas. Olha o exemplo que construi abaixo:

https://stackblitz.com/edit/portinariui-sewq3s

Att. Thiago Gonçalves dos Santos

On Mon, Oct 21, 2019 at 3:44 PM Rafaelly G. Schoeffel < [email protected]> wrote:

Ola, tudo bem.

Uma dúvida para entender melhor a demanda, no caso que existem muitos itens, como saber qual deles deve ser utilizado como 'property'?

Por exemplo:

`columns= [{ property: 'client.nameFantasy', label: 'Nome Fantasia' }];

items = [ { client: { nameFantasy: 'Nome do cliente 1' } }, { client: { nameFantasy: 'Nome do cliente 2' } }, { client: { nameFantasy: 'Nome do cliente 3' } }, ]

Nesse caso, seriam criadas 3 colunas (uma para cada nameFantasy) ?

Aguardo seu retorno.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/portinariui/portinari-angular/issues/132?email_source=notifications&email_token=ABI4XWTTHN7A63PPGLJ4G4TQPX2CPA5CNFSM4JCWTBW2YY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGOEB3LZKI#issuecomment-544652457, or unsubscribe https://github.com/notifications/unsubscribe-auth/ABI4XWRIVSKXRXHFTGFEJVLQPX2CPANCNFSM4JCWTBWQ .

-- Thiago Gonçalves dos Santos. Cel.: (47) 99136-6482

thiagogoncalves avatar Oct 21 '19 19:10 thiagogoncalves

Ola Thiago! Consegui entender, obrigada pelas informações.

Encaminhei sua sugestão de melhoria para análise de nosso PO e aqui tem uma solução paliativa que imagino que seja parecida com a que você já implementou.

Qualquer dúvida estou a disposição

rafaellygruber avatar Oct 21 '19 20:10 rafaellygruber

Link da solução paliativa: https://stackblitz.com/edit/portinariui-ztrahf

rafaellygruber avatar Oct 21 '19 20:10 rafaellygruber

Alguma novidade sobre esta funcionalidade ?

Segue documentação do componente table do PrimeNG https://www.primefaces.org/primeng/#/table

ficaria bem legal se pudesse ler as propriedades de um objeto como no PrimeNG exemplo: cliente.nome cliente.endereco cliente.nomeFantasia

joao-arthur-moreira avatar Feb 28 '20 12:02 joao-arthur-moreira

Tive o mesmo problema, como solução paliativa usei Cell Template, mas acredito que a melhor forma seria poder setar direto no 'property' como já mencionado acima.

Minha solução paliativa:

  const pessoa = { 
    "codigo": 1,
    "nome": "João Silva",
    "endereco": { 
          "logradouro": "Rua do Abacaxi",
          "numero": "10",
          "complemento": null,
          "bairro": "Brasil",
          "cep": "38.400-121",
          "cidade": "Uberlândia",
          "estado": "MG" },
    "ativo": true 
  }
  readonly colunas: Array<PoTableColumn> = [
    { property: 'codigo', label: 'Cógido' },
    { property: 'nome', label: 'Nome' },
    { property: 'cidade', label: 'Cidade', type: 'cellTemplate' },
    { property: 'estado', label: 'Estado', type: 'cellTemplate' },
    { property: 'ativo', label: 'Status', type: 'cellTemplate' }
  ];
<po-table class="po-md-12" [p-columns]="colunas" [p-items]="pessoas" p-striped="true" [p-actions]="acoes"
    p-loading="1" p-height="380"
    p-loading-show-more="1"
    (p-show-more)="carregarMais()">

  <ng-template p-table-cell-template let-column="column" let-row="row">

    <span *ngIf="column.property === 'cidade'">{{ row.endereco.cidade }}</span>
    <span *ngIf="column.property === 'estado'">{{ row.endereco.estado }}</span>
    <a href="" *ngIf="column.property === 'ativo'">{{ row.ativo === true? 'Ativo' : 'Inativo' }}</a>
    
  </ng-template>
</po-table>

CarlosEReis avatar Dec 11 '20 16:12 CarlosEReis

Como está o andamento dessa issue? Seria algo interessante que tenho interesse em tentar desenvolver

afucher avatar Oct 29 '21 21:10 afucher

Esta em nosso backlog,

Visto a necessidade, vamos verificar a possibilidade de incluir nas próximas versões, mas seria uma colaboração muito importante caso puder faze-la.

Caso não puder vamos preparar para as proximas versões.

jhonyeduardo avatar Oct 29 '21 21:10 jhonyeduardo

Esta em nosso backlog,

Visto a necessidade, vamos verificar a possibilidade de incluir nas próximas versões, mas seria uma colaboração muito importante caso puder faze-la.

Caso não puder vamos preparar para as proximas versões.

Ahh não devo conseguir mexer em breve nisso, então se vão priorizar blza :)

afucher avatar Oct 30 '21 18:10 afucher