Crea tu primer plugin

Vamos a crear nuestro primer plugin y te vamos a explicar parte por parte cómo hacerlo. Vamos a usar el ejemplo que hemos visto en la página de Actions.

async function totalumPlugin(trigger, modules) {
    //totalum plugin template, put here plugin code
    const smartForm = trigger.data.smartForm.smartForm;
    const firstSmartForm = trigger.data.smartForm.firstSmartForm;

    let isSmartFormValidBeforeUpdate = false;

    if (...condition) {
        isSmartFormValidBeforeUpdate = true;
    }

    const newAction = {
      actionType: 'isSmartFormValidBeforeUpdate',
      params: {
        smartForm: {
            isSmartFormValidBeforeUpdate: isSmartFormValidBeforeUpdate
        }
      }
    };

    return [newAction];
}

Parte por parte

Async function

Todo el código del plugin va a ocurrir dentro de una función asíncrona para que puedas usar awaits.

Parámetro trigger async function totalumPlugin(trigger, modules)

El parametro trigger es donde te pasamos toda la información que necesitas en tu plugin: el elemento de la row expandida si es un botón de elemento, el smart form, los filtros de la página, toda la data de esa table, etc. Entra en la documentación del Trigger porque está muy completa y bien explicada: Ver todos los datos que nos da el parámetro trigger.

Parámetro modules async function totalumPlugin(trigger, modules)

Los modules del plugin tienes todos las librerías que hemos habilitado para que uses. Serían estas:

const modules = {
      axios: axios,
      qs,
      totalumSdk: totalumSdk,
      openWindow: windowModule,
      dateFns: dateFns,
      jszip: JSZip,
      saveAs: saveAs
    }

Contenido del plugin

Primero obtenemos los datos que necesitamos, recuerda para saber qué estamos obteniendo haz clic aquí y podrás ver todo lo que tiene el parámetro trigger. En este caso queremos obtener el smartForm después de editarlo y antes de editarlo. (el editado y el original)

const smartForm = trigger.data.smartForm.smartForm;
const firstSmartForm = trigger.data.smartForm.firstSmartForm;

Luego seteamos una variable isSmartFormValidBeforeUpdate para controlar si permitiremos que el smart form se actualice o no. Hacemos la condición o lo que sea para decidir si se puede o no actualizar.

let isSmartFormValidBeforeUpdate = false;

if (...condition) {
    isSmartFormValidBeforeUpdate = true;
}

Finalmente creamos la Action correspondiente (recordad mirar la interface de la Action haciendo clic aquí) y ponemos el valor correspondiente de si el smart form es válido o no con lo que no se puede editar.

const newAction = {
  actionType: 'isSmartFormValidBeforeUpdate',
  params: {
    smartForm: {
          isSmartFormValidBeforeUpdate: isSmartFormValidBeforeUpdate
    }
  }
};

  return [newAction];