Error when trying to associate components (task/annotation)

Users
1

I’m trying to create an association between a task and an annotation, how to do it, I’m getting errors like:

Error: no shape type specified
at ElementFactory.createElement (ElementFactory.js:168:13)
at ElementFactory.create (ElementFactory.js:129:15)
at ElementFactory.createConnection (ElementFactory.js:68:15)
at createConnectedAnnotation (CustomPalette.js:82:46)
at Object.click (CustomPalette.js:132:15)

Este é um trecho do codigo do meu componente Customizado:




export default class CustomPalette {
  constructor(bpmnFactory, create, elementFactory, palette, translate, modeling) {
    this.bpmnFactory = bpmnFactory;
    this.create = create;
    this.elementFactory = elementFactory;
    this.translate = translate;
    this.modeling = modeling;

    palette.registerProvider(this);
  }

  getPaletteEntries(element) {
    const {
      bpmnFactory,
      create,
      elementFactory,
      translate,
      modeling
    } = this;

    function getSelectedElementData() {
      const element = modeler._current.element; // Obtenha o elemento atualmente selecionado
      const elementData = {};

      // Exemplo: Acesse o nome e a descrição do elemento (pode variar dependendo das suas necessidades)
      elementData.name = element.businessObject.name;
      elementData.description = element.businessObject.documentation && element.businessObject.documentation[0].text;

      return elementData;
    }

    function createTask(suitabilityScore) {
      const businessObject = bpmnFactory.create('bpmn:Task');
      businessObject.suitable = suitabilityScore;
      const shape = elementFactory.createShape({
        type: 'bpmn:Task',
        businessObject: businessObject
      });

      return shape;
    }

    function createAnnotation(annotationText) {
      if (modeler) {
        const propertiesPanel = getSelectedElementData();
      }
      const businessObject = bpmnFactory.create('bpmn:TextAnnotation', {
        text: annotationText
      });
      const annotation = elementFactory.createShape({
        type: 'bpmn:TextAnnotation',
        businessObject: businessObject,
        y: 80,
        width: 120,
        height: 70,
      });
      return annotation;
    }

    function createConnectedAnnotation(event, annotationText, task) {
      const annotation = createAnnotation(annotationText);
      create.start(event, [task, annotation]);
    
      // Create connection manually between task and annotation
      const connection = bpmnFactory.create('bpmn:Association', {
        source: task.businessObject,
        target: annotation.businessObject,
      });
    
      // Add the connection to the modeler
      const connectionShape = elementFactory.createConnection(connection);
      modeling.createConnection(connectionShape);
    }
    
    
    

    return function (entries) {

      // delete entries['tool-separator'];
      delete entries['space-tool'];
      delete entries['lasso-tool'];
      // delete entries['global-connect-tool'];
      delete entries['create.task'];
      delete entries['create.subprocess-expanded'];
      delete entries['create.start-event'];
      delete entries['create.data-object'];
      delete entries['create.data-store'];
      delete entries['create.end-event'];
      delete entries['create.exclusive-gateway'];
      delete entries['create.group'];
      delete entries['create.intermediate-event'];
      delete entries['create.participant-expanded'];
      delete entries['reate.intermediate-event'];
      delete entries['reate.intermediate-event'];
      delete entries['reate.intermediate-event'];



      // Add remaining entries to paletteEntries
      const paletteEntries = {
        ...entries, // Copy existing entries
        'create.low-task': {
          group: 'activity',
          title: translate('Cria uma Captação'),
          imageUrl: Captacao.dataURL,
          action: {
            dragstart: function (event) {
              const task = createTask(SUITABILITY_SCORE_LOW);
              const annotation = createAnnotation('Informe a descrição do componente');
              task.businessObject.documentation = [annotation.businessObject];
              create.start(event, [task, annotation]);

            },
            click: function (event) {
               const task = createTask(SUITABILITY_SCORE_LOW);
               /*
              const annotation = createAnnotation('Informe a descrição do componente');             
              task.businessObject.documentation = [annotation.businessObject];
              create.start(event, [task, annotation]); */
              createConnectedAnnotation(event,'Informe a descrição do componente',task);
            }
          }
        },

Thanks

2

Please share a running / prototypical example that clearly shows what you’re trying to achieve, what is working and what is not.

Use our existing starter projects to quickly hack it or share your existing, partial solution on GitHub or via a CodeSandbox. Provide the necessary pointers that allow us to quickly understand where you got stuck.

This way we may be able to help you in a constructive manner.

Thanks :heart: