Немного проблем с настройкой и сохранением построителя диаграмм в AlloyUI 3.03 - PullRequest
1 голос
/ 29 марта 2019

Можете ли вы помочь мне настроить узел и относительное CSS AllouUI DiagramBuilder?

После нескольких попыток и, прежде всего, спасибо за помощь предыдущих сообщений по тому же инструменту

AlloyUI (построитель диаграмм) расширяет

Добавление пользовательского узла в Alloyui DiagramBuilder в JAVA

Как добавить пользовательские узлы и свойства в построитель диаграмм AlloyUI

Мне удалось создать новые пользовательские узлы, но CSS не работает так, как я ожидал:

  1. Если я изменю атрибут NAME узла, получимприменение стиля, определенного на листе CSS (только цвет в данный момент), но я теряю включение вкладки Настройки.

  2. Если я расширяю узел схемы класса css (.diagramnode;) с нужным фоном, изменение игнорируется.

JS:

<script type="text/javascript">
   YUI().use('aui-diagram-builder',

       function(Y) {

        //definizione del nuovo DropDown
        Y.CustomDropDownCellEditor = Y.Component
          .create({
           NAME : 'CustomDropDownCellEditor',
           EXTENDS : Y.DropDownCellEditor
          });

        //definizione del nuovo nodo 
        Y.DiagramNodeCustomWithDropDown = Y.Component
          .create({
           NAME : 'diagram-node',
           ATTRS : {
            type : {
             value : 'customTaskWithDropDown'
            },
            currency : {
             validator : Y.Lang.isValue
            }
           },
           EXTENDS : Y.DiagramNodeTask,
           prototype : {
            initializer : function() {
             this.SERIALIZABLE_ATTRS
               .push('choseOne');
            },
            //configura ed inserisce la dropDown
            getPropertyModel : function() { 
             var model = Y.DiagramNodeTask.superclass.getPropertyModel
               .apply(this, arguments);
             var values = new Y.CustomDropDownCellEditor(
               {
                options : {
                 dollar : 'Dollar',
                 euro : 'Euro',
                 yen : 'Yen',
                 gold : 'Gold'
                }
               });

             model
               .push({
                name : 'Currency',
                attributeName : 'currency',
                editor : values
               });

             return model;
            }
           }
          });

        //definiziane del secondo nodo custom
        Y.DiagramNodeCustomWithTwoMoreField = Y.Component
          .create({
           NAME : 'diagram-node',
           ATTRS : {
            type : {
             value : 'customWithTwoMoreField'
            },
            price : {
             validator : Y.Lang.isString,
             value : 'A Custom default'
            },
            cost : {
             validator : Y.Lang.isString,
             value : 'A Custom default'
            }
           },
           EXTENDS : Y.DiagramNodeTask,
           prototype : {
            getPropertyModel : function() {
             var model = Y.DiagramNodeTask.superclass.getPropertyModel
               .apply(this,
                 arguments);
             model
               .push({
                attributeName : 'price',
                name : 'Price'
               });
             model.push({
              attributeName : 'cost',
              name : 'Cost'
             });
             return model;
            }
           }
          });

        Y.DiagramBuilder.types['customTaskWithDropDown'] = Y.DiagramNodeCustomWithDropDown;
        Y.DiagramBuilder.types['customWithTwoMoreField'] = Y.DiagramNodeCustomWithTwoMoreField;

        //ORIGINALE
        var availableFields = [ 
        ....., {
         iconClass : 'diagram-node-task-icon',
         label : 'Limited Chose',
         type : 'customTaskWithDropDown'
        }, {
         iconClass : 'diagram-node-state-icon',
         label : 'Description State',
         type : 'customWithTwoMoreField'
        } .....
        ];

        new Y.DiagramBuilder({
         availableFields : availableFields,
         boundingBox : '#DiagramBuilderContainer',
         fields : [ {
          name : 'HellGate',
          type : 'start',
          xy : [ 10, 10 ]
         } ],
         srcNode : '#DiagramBuilderBuilder'
        }).render();
       });

CSS:

.customdropdowncelleditor-hidden {
    display: none;
}
.diagramnodecustomwithdropdown {
    background-color: #00FFFF ;
}

.diagramnodecustomwithtwomorefield {
    background-color: #FF0090 ;
}

Как определить дваразные стили для DiagramNodeCustomWithDropDown и DiagramNodeCustomWithTwoMoreField узлы?Мне нужно определить фон и границу, пока ничего больше.

1 Ответ

0 голосов
/ 02 апреля 2019

Чтобы продолжить, я сейчас пытаюсь сохранить диаграмму в моей базе данных в формате json (логически проходя через форму и сервлет )

препятствие передо мной: как сохранить результат функции JS на скрытом входе: Y.DiagramBuilder (). ToJSON () ??

возможно, полезно знать, что я работаю в Liferay 7.1 ...

Вот моя страница JSP:

<div id="DiagramBuilderContainer">
            <div id="DiagramBuilderBuilder"></div>
            <div>
                <portlet:actionURL var="editDiagramCampaign" name="editDiagramCampaign" >
                    <portlet:param name="mvcPath" value="/campaign-aui-diagramBuilder.jsp" />
                    <portlet:param name="redirect" value="<%=currentURL%>" /> 
                    <portlet:param name="campaignId" value="<%=String.valueOf(campaignId)%>" />
                </portlet:actionURL>
                <aui:form action="<%=editDiagramCampaign%>" method="post" name="saveDiagramForm">
                    <aui:model-context bean="<%=campaign%>" model="<%= Campaign.class %>" />
                    <aui:button-row>
                        <aui:input  type="hidden" id="diagramBuilderHiddenJSON" name="diagramBuilderHiddenJSON" value="" />
                        <aui:button type="submit" id="saveDiagram"              name="saveDiagram"          value="Salva Diagramma"
                                onClick="updateDiagramBuilderHiddenJSON();" primary="true" />
                    </aui:button-row>
                </aui:form>

            </div>
        </div>

        <script type="text/javascript">
            YUI().use('aui-diagram-builder',
                function(Y) { ( *read above if u need it*)  });
        </script>

UPDATE:

Вот решение:

    var availableFields = [ {...},  {...}, {...}, {...}, {...} ];

 /** RETRIVE SAVED JSON DIAGRAM OR CREATE NEW ONE  **/
    var diagramBuilderObj = null;
    var _campaignDiagramJSON = JSON.parse( '<%=campaignDiagramJSON%>' ) ;
    if ( _campaignDiagramJSON && _campaignDiagramJSON != "" ) {
     diagramBuilderObj = new Y.DiagramBuilder({ 
      availableFields : availableFields,
      boundingBox : '#DiagramBuilderContainer', 
      fields : _campaignDiagramJSON.nodes,
      srcNode : '#DiagramBuilderBuilder' 
     }) ;
     diagramBuilderObj.render(); 
    } else {
     diagramBuilderObj = new Y.DiagramBuilder({
      availableFields : availableFields,
      boundingBox : '#DiagramBuilderContainer',
      fields : [ {
       name : 'Start Here',
       type : 'start',
       xy : [ 10, 10 ]
      } ],
      srcNode : '#DiagramBuilderBuilder'
     });
     diagramBuilderObj.render();
    }

/** SAVE MODIFIED JSON DIAGRAM TROUGH FORM **/
    Y.one('#<portlet:namespace/>'+'saveDiagramButton').on('click', function() {
     Y.one('#<portlet:namespace/>'+'diagramBuilderHiddenJSON').set('value', JSON.stringify( diagramBuilderObj.toJSON() ) );
    });

НОВОЕ ОБНОВЛЕНИЕ:

Блин , это еще не конец ... и здесь у меня действительно кончились идеи, и я не могу найти поддержку где-либо еще:

преобразование в json и сохранение на БД работает, но восстановление из json завершается неудачно со следующей ошибкой

TypeError: n.get(...) is undefined[Ulteriori informazioni] combo:15:2351
    prepareTransition http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/aui-property-builder/aui-property-builder-min.js&/o/frontend-js-web/aui/matrix/matrix-min.js&/o/frontend-js-web/aui/graphics/graphics-min.js&/o/frontend-js-web/aui/graphics-svg-default/graphics-svg-default-min.js&/o/frontend-js-web/aui/graphics-svg/graphics-svg-min.js&/o/frontend-js-web/aui/aui-diagram-builder-connector/aui-diagram-builder-connector-min.js&/o/frontend-js-web/aui/aui-diagram-node-manager-base/aui-diagram-node-manager-base-min.js&/o/frontend-js-web/aui/aui-diagram-node/aui-diagram-node-min.js&/o/frontend-js-web/aui/aui-diagram-node-state/aui-diagram-node-state-min.js&/o/frontend-js-web/aui/aui-diagram-node-condition/aui-diagram-node-condition-min.js&/o/frontend-js-web/aui/aui-diagram-node-end/aui-diagram-node-end-min.js&/o/frontend-js-web/aui/aui-diagram-node-fork/aui-diagram-node-fork-min.js&/o/frontend-js-web/aui/aui-diagram-node-join/aui-diagram-node-join-min.js:15
    _setTransitions http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/aui-property-builder/aui-property-builder-min.js&/o/frontend-js-web/aui/matrix/matrix-min.js&/o/frontend-js-web/aui/graphics/graphics-min.js&/o/frontend-js-web/aui/graphics-svg-default/graphics-svg-default-min.js&/o/frontend-js-web/aui/graphics-svg/graphics-svg-min.js&/o/frontend-js-web/aui/aui-diagram-builder-connector/aui-diagram-builder-connector-min.js&/o/frontend-js-web/aui/aui-diagram-node-manager-base/aui-diagram-node-manager-base-min.js&/o/frontend-js-web/aui/aui-diagram-node/aui-diagram-node-min.js&/o/frontend-js-web/aui/aui-diagram-node-state/aui-diagram-node-state-min.js&/o/frontend-js-web/aui/aui-diagram-node-condition/aui-diagram-node-condition-min.js&/o/frontend-js-web/aui/aui-diagram-node-end/aui-diagram-node-end-min.js&/o/frontend-js-web/aui/aui-diagram-node-fork/aui-diagram-node-fork-min.js&/o/frontend-js-web/aui/aui-diagram-node-join/aui-diagram-node-join-min.js:16
    forEach self-hosted:262
    forEach jQuery
    _setTransitions http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/aui-property-builder/aui-property-builder-min.js&/o/frontend-js-web/aui/matrix/matrix-min.js&/o/frontend-js-web/aui/graphics/graphics-min.js&/o/frontend-js-web/aui/graphics-svg-default/graphics-svg-default-min.js&/o/frontend-js-web/aui/graphics-svg/graphics-svg-min.js&/o/frontend-js-web/aui/aui-diagram-builder-connector/aui-diagram-builder-connector-min.js&/o/frontend-js-web/aui/aui-diagram-node-manager-base/aui-diagram-node-manager-base-min.js&/o/frontend-js-web/aui/aui-diagram-node/aui-diagram-node-min.js&/o/frontend-js-web/aui/aui-diagram-node-state/aui-diagram-node-state-min.js&/o/frontend-js-web/aui/aui-diagram-node-condition/aui-diagram-node-condition-min.js&/o/frontend-js-web/aui/aui-diagram-node-end/aui-diagram-node-end-min.js&/o/frontend-js-web/aui/aui-diagram-node-fork/aui-diagram-node-fork-min.js&/o/frontend-js-web/aui/aui-diagram-node-join/aui-diagram-node-join-min.js:16
    jQuery 7
    syncConnectionsUI http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/aui-property-builder/aui-property-builder-min.js&/o/frontend-js-web/aui/matrix/matrix-min.js&/o/frontend-js-web/aui/graphics/graphics-min.js&/o/frontend-js-web/aui/graphics-svg-default/graphics-svg-default-min.js&/o/frontend-js-web/aui/graphics-svg/graphics-svg-min.js&/o/frontend-js-web/aui/aui-diagram-builder-connector/aui-diagram-builder-connector-min.js&/o/frontend-js-web/aui/aui-diagram-node-manager-base/aui-diagram-node-manager-base-min.js&/o/frontend-js-web/aui/aui-diagram-node/aui-diagram-node-min.js&/o/frontend-js-web/aui/aui-diagram-node-state/aui-diagram-node-state-min.js&/o/frontend-js-web/aui/aui-diagram-node-condition/aui-diagram-node-condition-min.js&/o/frontend-js-web/aui/aui-diagram-node-end/aui-diagram-node-end-min.js&/o/frontend-js-web/aui/aui-diagram-node-fork/aui-diagram-node-fork-min.js&/o/frontend-js-web/aui/aui-diagram-node-join/aui-diagram-node-join-min.js:15
    syncConnectionsUI http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/aui-diagram-node-start/aui-diagram-node-start-min.js&/o/frontend-js-web/aui/aui-diagram-node-task/aui-diagram-node-task-min.js&/o/frontend-js-web/aui/aui-diagram-builder/aui-diagram-builder-min.js:3
    each jQuery
    forEach self-hosted:262
    jQuery 2
    syncConnectionsUI http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/aui-diagram-node-start/aui-diagram-node-start-min.js&/o/frontend-js-web/aui/aui-diagram-node-task/aui-diagram-node-task-min.js&/o/frontend-js-web/aui/aui-diagram-builder/aui-diagram-builder-min.js:3
    syncUI http://localhost:8080/combo/?browserId=firefox&minifierType=&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/aui-diagram-node-start/aui-diagram-node-start-min.js&/o/frontend-js-web/aui/aui-diagram-node-task/aui-diagram-node-task-min.js&/o/frontend-js-web/aui/aui-diagram-builder/aui-diagram-builder-min.js:3
    renderer http://localhost:8080/combo?browserId=firefox&minifierType=js&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/event-hover/event-hover.js&/o/frontend-js-web/aui/event-key/event-key.js&/o/frontend-js-web/aui/event-mouseenter/event-mouseenter.js&/o/frontend-js-web/aui/event-mousewheel/event-mousewheel.js&/o/frontend-js-web/aui/event-outside/event-outside.js&/o/frontend-js-web/aui/event-resize/event-resize.js&/o/frontend-js-web/aui/event-simulate/event-simulate.js&/o/frontend-js-web/aui/event-synthetic/event-synthetic.js&/o/frontend-js-web/aui/intl/intl.js&/o/frontend-js-web/aui/io-base/io-base.js&/o/frontend-js-web/aui/io-form/io-form.js&/o/frontend-js-web/aui/io-queue/io-queue.js&/o/frontend-js-web/aui/io-upload-iframe/io-upload-iframe.js&/o/frontend-js-web/aui/io-xdr/io-xdr.js&/o/frontend-js-web/aui/json-parse/json-parse.js&/o/frontend-js-web/aui/json-stringify/json-stringify.js&/o/frontend-js-web/aui/node-base/node-base.js&/o/frontend-js-web/aui/node-core/node-core.js&/o/frontend-js-web/aui/node-event-delegate/node-event-delegate.js&/o/frontend-js-web/aui/node-event-simulate/node-event-simulate.js&/o/frontend-js-web/aui/node-focusmanager/node-focusmanager.js&/o/frontend-js-web/aui/node-pluginhost/node-pluginhost.js&/o/frontend-js-web/aui/node-screen/node-screen.js&/o/frontend-js-web/aui/node-style/node-style.js&/o/frontend-js-web/aui/oop/oop.js&/o/frontend-js-web/aui/plugin/plugin.js&/o/frontend-js-web/aui/pluginhost-base/pluginhost-base.js&/o/frontend-js-web/aui/pluginhost-config/pluginhost-config.js&/o/frontend-js-web/aui/querystring-stringify-simple/querystring-stringify-simple.js&/o/frontend-js-web/aui/queue-promote/queue-promote.js&/o/frontend-js-web/aui/selector-css2/selector-css2.js&/o/frontend-js-web/aui/selector-css3/selector-css3.js&/o/frontend-js-web/aui/selector-native/selector-native.js&/o/frontend-js-web/aui/selector/selector.js&/o/frontend-js-web/aui/widget-base/widget-base.js&/o/frontend-js-web/aui/widget-htmlparser/widget-htmlparser.js&/o/frontend-js-web/aui/widget-skin/widget-skin.js:11923
    _defRenderFn http://localhost:8080/combo?browserId=firefox&minifierType=js&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/event-hover/event-hover.js&/o/frontend-js-web/aui/event-key/event-key.js&/o/frontend-js-web/aui/event-mouseenter/event-mouseenter.js&/o/frontend-js-web/aui/event-mousewheel/event-mousewheel.js&/o/frontend-js-web/aui/event-outside/event-outside.js&/o/frontend-js-web/aui/event-resize/event-resize.js&/o/frontend-js-web/aui/event-simulate/event-simulate.js&/o/frontend-js-web/aui/event-synthetic/event-synthetic.js&/o/frontend-js-web/aui/intl/intl.js&/o/frontend-js-web/aui/io-base/io-base.js&/o/frontend-js-web/aui/io-form/io-form.js&/o/frontend-js-web/aui/io-queue/io-queue.js&/o/frontend-js-web/aui/io-upload-iframe/io-upload-iframe.js&/o/frontend-js-web/aui/io-xdr/io-xdr.js&/o/frontend-js-web/aui/json-parse/json-parse.js&/o/frontend-js-web/aui/json-stringify/json-stringify.js&/o/frontend-js-web/aui/node-base/node-base.js&/o/frontend-js-web/aui/node-core/node-core.js&/o/frontend-js-web/aui/node-event-delegate/node-event-delegate.js&/o/frontend-js-web/aui/node-event-simulate/node-event-simulate.js&/o/frontend-js-web/aui/node-focusmanager/node-focusmanager.js&/o/frontend-js-web/aui/node-pluginhost/node-pluginhost.js&/o/frontend-js-web/aui/node-screen/node-screen.js&/o/frontend-js-web/aui/node-style/node-style.js&/o/frontend-js-web/aui/oop/oop.js&/o/frontend-js-web/aui/plugin/plugin.js&/o/frontend-js-web/aui/pluginhost-base/pluginhost-base.js&/o/frontend-js-web/aui/pluginhost-config/pluginhost-config.js&/o/frontend-js-web/aui/querystring-stringify-simple/querystring-stringify-simple.js&/o/frontend-js-web/aui/queue-promote/queue-promote.js&/o/frontend-js-web/aui/selector-css2/selector-css2.js&/o/frontend-js-web/aui/selector-css3/selector-css3.js&/o/frontend-js-web/aui/selector-native/selector-native.js&/o/frontend-js-web/aui/selector/selector.js&/o/frontend-js-web/aui/widget-base/widget-base.js&/o/frontend-js-web/aui/widget-htmlparser/widget-htmlparser.js&/o/frontend-js-web/aui/widget-skin/widget-skin.js:11897
    jQuery 3
    render http://localhost:8080/combo?browserId=firefox&minifierType=js&languageId=en_US&b=7102&t=1552559958516&/o/frontend-js-web/aui/event-hover/event-hover.js&/o/frontend-js-web/aui/event-key/event-key.js&/o/frontend-js-web/aui/event-mouseenter/event-mouseenter.js&/o/frontend-js-web/aui/event-mousewheel/event-mousewheel.js&/o/frontend-js-web/aui/event-outside/event-outside.js&/o/frontend-js-web/aui/event-resize/event-resize.js&/o/frontend-js-web/aui/event-simulate/event-simulate.js&/o/frontend-js-web/aui/event-synthetic/event-synthetic.js&/o/frontend-js-web/aui/intl/intl.js&/o/frontend-js-web/aui/io-base/io-base.js&/o/frontend-js-web/aui/io-form/io-form.js&/o/frontend-js-web/aui/io-queue/io-queue.js&/o/frontend-js-web/aui/io-upload-iframe/io-upload-iframe.js&/o/frontend-js-web/aui/io-xdr/io-xdr.js&/o/frontend-js-web/aui/json-parse/json-parse.js&/o/frontend-js-web/aui/json-stringify/json-stringify.js&/o/frontend-js-web/aui/node-base/node-base.js&/o/frontend-js-web/aui/node-core/node-core.js&/o/frontend-js-web/aui/node-event-delegate/node-event-delegate.js&/o/frontend-js-web/aui/node-event-simulate/node-event-simulate.js&/o/frontend-js-web/aui/node-focusmanager/node-focusmanager.js&/o/frontend-js-web/aui/node-pluginhost/node-pluginhost.js&/o/frontend-js-web/aui/node-screen/node-screen.js&/o/frontend-js-web/aui/node-style/node-style.js&/o/frontend-js-web/aui/oop/oop.js&/o/frontend-js-web/aui/plugin/plugin.js&/o/frontend-js-web/aui/pluginhost-base/pluginhost-base.js&/o/frontend-js-web/aui/pluginhost-config/pluginhost-config.js&/o/frontend-js-web/aui/querystring-stringify-simple/querystring-stringify-simple.js&/o/frontend-js-web/aui/queue-promote/queue-promote.js&/o/frontend-js-web/aui/selector-css2/selector-css2.js&/o/frontend-js-web/aui/selector-css3/selector-css3.js&/o/frontend-js-web/aui/selector-native/selector-native.js&/o/frontend-js-web/aui/selector/selector.js&/o/frontend-js-web/aui/widget-base/widget-base.js&/o/frontend-js-web/aui/widget-htmlparser/widget-htmlparser.js&/o/frontend-js-web/aui/widget-skin/widget-skin.js:11881
    <anonima> http://localhost:8080/group/guest/~/control_panel/manage?p_p_id=it_treeffe_feedback_web_portlet_CampaignManagementPortlet&p_p_lifecycle=0&p_p_state=maximized&p_p_mode=view&_it_treeffe_feedback_web_portlet_CampaignManagementPortlet_redirect=http://localhost:8080/group/guest/~/control_panel/manage?p_p_id=it_treeffe_feedback_web_portlet_CampaignManagementPortlet&p_p_lifecycle=0&p_p_state=maximized&p_p_mode=view&_it_treeffe_feedback_web_portlet_CampaignManagementPortlet_mvcPath=%2Fview_campaign_crud_mngToolbar.jsp&_it_treeffe_feedback_web_portlet_CampaignManagementPortlet_cur=1&_it_treeffe_feedback_web_portlet_CampaignManagementPortlet_delta=10&_it_treeffe_feedback_web_portlet_CampaignManagementPortlet_orderByCol=modifiedDate&p_p_auth=O2ifcGJf&_it_treeffe_feedback_web_portlet_CampaignManagementPortlet_mvcPath=/campaign-aui-diagramBuilder.jsp&_it_treeffe_feedback_web_portlet_CampaignManagementPortlet_campaignId=109&p_p_auth=O2ifcGJf line 355 > scriptElement:143
    jQuery 34    

Сценарий построителя диаграмм приведен выше, а затем я оставляю json для бессмысленной диаграммы, используемой для теста.

JSON:

{"nodes":[{"transitions":[{"source":"Tutto Comincia Qui","target":"fork1259","uid":"yui_patched_v3_18_1_2_1554213706673_1417","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector1433","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[657.7999877929688,255.10000610351562],"p2":[988,344]}}],"description":"","name":"Tutto Comincia Qui","required":false,"type":"start","width":40,"height":40,"zIndex":100,"xy":[10,10]},{"transitions":[{"source":"fork1259","target":"condition1779","uid":"yui_patched_v3_18_1_2_1554213706673_1937","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector1953","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[1013,369],"p2":[898,482]}},{"source":"fork1259","target":"condition2254","uid":"yui_patched_v3_18_1_2_1554213706673_2412","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector2428","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[1038,344],"p2":[1220,377]}}],"description":"","name":"fork1259","required":false,"type":"fork","width":60,"height":60,"zIndex":100,"xy":[370.20001220703125,91.89999389648438]},{"transitions":[{"source":"condition1779","target":"customTaskWithDropDown2790","uid":"yui_patched_v3_18_1_2_1554213706673_3313","sourceXY":[60,30],"targetXY":[27.199951171875,4.9000091552734375],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector3329","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[908,492],"p2":[1069.800048828125,621.0999755859375]}},{"source":"condition1779","target":"state3603","uid":"yui_patched_v3_18_1_2_1554213706673_3761","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector3777","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[883,517],"p2":[874.7999877929688,679.0999755859375]}}],"description":"","name":"condition1779","required":false,"type":"condition","width":60,"height":60,"zIndex":100,"xy":[240.20001220703125,239.89999389648438]},{"transitions":[{"source":"condition2254","target":"customTaskWithDropDown2790","uid":"yui_patched_v3_18_1_2_1554213706673_2948","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector2964","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[1245,402],"p2":[1129.800048828125,621.0999755859375]}},{"source":"condition2254","target":"state4334","uid":"yui_patched_v3_18_1_2_1554213706673_4492","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector4508","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[1245,402],"p2":[1302.800048828125,667.0999755859375]}}],"description":"","name":"condition2254","required":false,"type":"condition","width":60,"height":60,"zIndex":100,"xy":[602.2000122070312,124.90000915527344]},{"transitions":[{"source":"customTaskWithDropDown2790","target":"customStateWithTwoMoreField7588","uid":"yui_patched_v3_18_1_2_1554213706673_7746","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector7762","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[1129.800048828125,681.0999755859375],"p2":[1130,788]}}],"description":"","name":"customTaskWithDropDown2790","required":false,"type":"customTaskWithDropDown","width":70,"height":70,"zIndex":100,"xy":[452.20001220703125,394.90000915527344]},{"transitions":[{"source":"state3603","target":"customTaskWithDropDown2790","uid":"yui_patched_v3_18_1_2_1554213706673_7246","sourceXY":[37.20001220703125,20.899993896484375],"targetXY":[7.199951171875,45.899993896484375],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector7262","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[887.7999877929688,692.0999755859375],"p2":[1069.800048828125,681.0999755859375]}}],"description":"","name":"state3603","required":false,"type":"state","width":40,"height":40,"zIndex":100,"xy":[240,452]},{"transitions":[{"source":"state4334","target":"customTaskWithDropDown2790","uid":"yui_patched_v3_18_1_2_1554213706673_6965","sourceXY":[1.199951171875,18.899993896484375],"targetXY":[65.199951171875,34.899993896484375],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector6981","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[1289.800048828125,682.0999755859375],"p2":[1129.800048828125,681.0999755859375]}}],"description":"","name":"state4334","required":false,"type":"state","width":40,"height":40,"zIndex":100,"xy":[672.2000122070312,440.90000915527344]},{"transitions":[{"source":"customStateWithTwoMoreField7588","target":"end8225","uid":"yui_patched_v3_18_1_2_1554213706673_8383","sourceXY":[],"targetXY":[],"connector":{"color":"#27aae1","lazyDraw":false,"name":"connector8399","shapeSelected":{"stroke":{"color":"#ff6600","weight":5,"opacity":0.8}},"shapeHover":{"stroke":{"color":"#ffd700","weight":5,"opacity":0.8}},"p1":[1113,801],"p2":[942,789]}}],"description":"","name":"customStateWithTwoMoreField7588","required":false,"type":"customStateWithTwoMoreField","width":40,"height":40,"zIndex":100,"xy":[495.20001220703125,560.8999938964844]},{"transitions":[],"description":"","name":"end8225","required":false,"type":"end","width":40,"height":40,"zIndex":100,"xy":[294.20001220703125,543.9000091552734]}]}

Кто-нибудь может мне помочь?

ПОСЛЕДНЕЕ ОБНОВЛЕНИЕ (РЕШЕНИЕ): Я опубликовал решение в своем комментарии ЗДЕСЬ Хорошего дня!

...