Ir para o conteúdo principal

Botões e ações personalizadas em listagens

Botões e ações personalizadas em listagens

Dentro da plataforma, você encontrará listagens do tipo tabela e rolagem, e a elas podem ser adicionados botões personalizados cujas ações você mesmo poderá definir.

   
image-1652948925548.png

Exemplo dos tipos de tabela onde a personalização pode ser aplicada:

Nota: esses botões personalizados só poderão ser adicionados dentro das plataformas, desde que a listagem/tabela onde desejam utilizá-los esteja usando data tables do tipo rolagem. Não é possível usá-los para a listagem de ativos da plataforma. Para poder utilizar essas funções, é necessário ter conhecimento de linguagem JavaScript. Recomendamos primeiro testar seu código no console do navegador e, em seguida, subir esse código JavaScript para sua plataforma.


Exemplo passo a passo

1. Definimos primeiro o objeto do botão

var btn =  {
  campos: ["id"],             //object atribute send to function
  class: "bt xs green ico",   //button class
  function: "test_function",       //function to execute, its your new function
  icon: "i-radio-check",      //icon defined on out library
  id: "fun1-",                //its added to button id atrributte
  title: "func1"              //its a title of button
}

2. Depois que temos o botão definido, devemos adicioná-lo à tabela. No exemplo abaixo o adicionamos à tabela de lugares.

customPlaform.tableAddAction( '#tbl-lugares', 'addButton', btn );
3. Para saber como se chamam as tabelas, podemos executar o seguinte comando. Este retornará os nomes das tabelas e os atributos das mesmas.
customPlaform.tables_loaded

4. Devemos agora criar a função que executará o botão.

function test_function( idelement ){
  alert('My test_function [idelement:'+idelement+']');
}

Aqui deixamos o exemplo de código completo. Para testá-lo, basta colar na console e depois ir à lista de lugares, onde vocês verão um novo botão verde.

var btn =  {
  campos: ["id"], //object atribute send to function
  class: "bt xs green ico", //button class
  function: "test_function", //function to execute
  icon: "i-radio-check", //ícone da biblioteca
  id: "fun1-", //nomes + id de elemento.
  title: "func1"}

customPlaform.tableAddAction( '#tbl-lugares', 'addButton', btn );

function test_function( idelement ){
  alert('My test_function [idelement:'+idelement+']');
}

Assim ficará o novo botão verde que foi adicionado à lista de lugares da plataforma.

api_botones_2.png