Imagem na grade de dados

** O recurso explicado abaixo foi disponibilizado na versão 17.6.0.611 do DOX Estúdio/Portal, certifique-se de ter a versão devidamente instalada e configurada em seu ambiente. 

Pense neste exemplo de uso:

Você trabalha com um ERP que possui tabela de itens de variados tipos. Pensando em automatizar a consulta, é criado um BPM que traz em uma grade de dados o código do item, a imagem do item, a descrição e adicionais. 

Com este novo recurso criado, a imagem do item ficaria disponível como uma miniatura, conforme gif acima, permitindo a personalização de outros campos sem deixar a grade de tamanho irregular. Caso o usuário clique em cima da miniatura, o tamanho da imagem será mostrado em tela. 

**Atenção: Deve-se ter cuidado para não colocar imagens que excedem o limite do dispositivo.

Abaixo colocamos um exemplo de uso personalizado, com tabelas e consultas no computador local/banco/GED.

Como configurar puxando imagem de uma pasta local do computador?

Antes de configurar o procedimento e as atividades, crie as seguintes tabelas abaixo: 

1 - MODULOS_ERP

CREATE TABLE MODULOS_ERP (
IDMODULO INTEGER NOT NULL PRIMARY KEY,
DESCRICAO VARCHAR (100)); 

Insira alguns dados manualmente, conforme: 

2 - PRODUTOS_EMA

CREATE TABLE PRODUTOS_EMA (
IDPRODUTO INTEGER NOT NULL PRIMARY KEY,
DESCRICAO VARCHAR (100));

Insira alguns dados manualmente, conforme: 

Feito isso, vamos agora criar uma PASTA no computador local (servidor), onde as imagens que queremos colocar na grade estarão armazenadas. Aqui é importante frisarmos que, o nome do arquivo é essencial para que o recurso funcione, pois o SQL irá puxar sempre a DESCRIÇÃO/NOME do arquivo, sem exceções. Caso a descrição da imagem seja um número (como neste exemplo), deve ser buscado esse numero no SQL. 

• Criamos a pasta "ema" dentro da pasta 'www' (C:\Ema Software\Contas ERP\www).
• Dentro da pasta, as imagens foram colocadas de acordo com a ordem das tabelas criadas mais cedo (não é necessário a ordem, criamos assim para melhor entendimento).

Criado as tabelas e pastas locais, vamos iniciar o procedimento. Na primeira atividade, crie duas grades de dados: 

• Módulos - /*MODULOS_ERP*/ (Tipo "Grade de dados")
• Outros produtos - /*PRODUTOS_EMA*/ (Tipo "Grade de dados")

Na primeira grade MODULOS, crie as colunas de acordo com os campos da tabela modulos_erp:

• IDMODULO - Imagem
• DESCRICAO - Texto

Na subdivisão "Origem"

• Diretório: Pasta/Local onde estão armazenadas as imagens. Importante ressaltar que as imagens só serão devidamente mostradas na grade se a pasta estiver dentro da pasta padrão 'www' (C:\Ema Software\Contas ERP\www). 
• Extensão padrão: Aqui é importante dizer que, caso a descrição da imagem retornada não contenha extensão do arquivo, o sistema usará a extensão configurada neste campo por padrão. Neste exemplo que estamos apresentando, buscamos apenas pelo nome do arquivo que não possui a extensão. Como todas as imagens usadas são .png, deixamos essa como padrão.

* O campo do tipo "Imagem" sempre será somente leitura. 

Agora, faça o mesmo com a segunda grade PRODUTOS, criando as colunas de acordo com os campos da tabela produtos_ema: 

• IDPRODUTO - Imagem
• DESCRICAO - Texto

Terminado de configurar ambos os formulários de grade, vamos para os eventos que vão buscar os nomes das imagens. Crie um conector para puxar os módulos da tabela modulos_erp, com o seguinte SQL:

SELECT IDMODULO,
       DESCRICAO
  FROM MODULOS_ERP

O evento é Estrutura de repetição - Carregar, pois estamos trazendo os dados para uma GRADE DE DADOS.

Crie um conector para puxar os produto da tabela produtos_ema, com o seguinte SQL:

SELECT IDPRODUTO,
       DESCRICAO
  FROM PRODUTOS_EMA

Perceba que, em ambos os SQL's os campos que estão sendo selecionados contem a mesma descrição que o campo NOME na coluna da grade de dados. 

Depois de configurado, salve o processo e teste no portal. 

Inserir imagem via JEX/PEX 

Para realizar a inserção de imagem via evento ao sair, a configuração da grade deve ser igual ao que explicamos acima: 

• O campo "Caminho"/"Diretório" contendo um local de onde estão as imagens, seja no computador ou no GED. 
• O campo "Extensão padrão" contendo a extensão que o sistema irá utilizar caso não seja informada extensão para a imagem pelo SQL ou pelo evento ao sair.

Veja no JEX por exemplo: 

valoresRegistroAtual.IMAGEM = 'DOX';

Ou, caso no campo "Extensão padrão" tenha um valor que seja diferente da do arquivo "DOX": 

 valoresRegistroAtual.IMAGEM = 'DOX.png';

Veja no PEX por exemplo: 

loNovoRegistro.AddPair('IMAGEM', 'DOX');

Novamente, colocando a extensão do arquivo junto:

loNovoRegistro.AddPair('IMAGEM', 'DOX.png');

** As únicas extensões possíveis para imagem na grade são: jpg, jpeg, png, gif, webp, e svg.