Page Comparison

...

validation: regular-expression

action-buttions:

search:

name: Search

statistic:

name: Statistic

monitor:

name: Monitor

previous:

name: Previous       # or <--

next:

name: Next             # or -->

service-instance-rendering-details:

max-page-num: 10

• • • • The Service List panel supports pagination, which will be controlled by the Navigation buttons.
      • Queries a service list from the SO Request DB through the Monitoring REST APIs.
      • Action buttons are enabled/disabled based on data population and/or context.

...

• Service List Get Service Instance Monitoring
  • Capabilities
    • Select a row and click the Monitor button. Then, it will go to open the Service instance (maps into process instance in Camunda) monitoring widge widget for the selected Service instance on the secondary/pop-up browser page.
  • Design
    • when a user clicks on a row, highlight the selected row and enable the Monitor button.
    • Once the Monitor button is clicked, go to the Service Instance Rendering and Deail widget, passing key fields such as service instance id, which will be mapped into the process instance id to find a matched process instance id in Camunda database in the Service Instnce Rendering and Detail widget.

...

• • Service Instance Rendering and Detail ViewWidget
    • Capabilities
      • Get a process definition XML through the Service Id and Process instance association.
      • use Camunda REST API, getGET /process-defintion/{id}/xml
      • Get the state of a process instance from the activity-instances
      • Use Camunda REST API, get/process-instance/{id}/activity-instances
      • Render the BPMN XML with bpmn.io and places markers on top of it, and provide Service instance detail views.
    • Design
      • This widget will be on the secondary/pop-up browser page. 
        • The Service List page will be the primiary page, so the user can open multiple Service Instance Rendering and Detail pages.
        • The number of pages can be limited to the default 10, but it can be configured.
      • The search criteria fields are for display only, and they cannot be changed.
      • The Detail panel is scrollable and display contents with the tag: value formt.
      • Query a process instance with the matched 'service instance id' process variable'serviceInstanceId' process variable.
        • get a process instande id: query bases on the process variable, 
          • GET /history/variable-instance/{variableValue}, where {variableValue} = 'serviceIntanceId' ;
        • query BPML XML based on a process instance id
          • GET /process-definition/{id}/xml
        • query the process instance detail such as process variables
          • GET /process-instance/{id}/variables
          • Display the process variables on the Service Instance Detail panel
        • query and activity instance (tree) for the process instance id
          • GET /process-instance/{id}/activity-instances
          • The response provides child activity instance info. By using this we can find the parent and child process instnce id and definition id.
            • If the current process instance id has its parent, enable the Drill-Up button.
          • When a user clicks on a task, display the task varables
            • GET /task/{id}variables
            • When the task activity type is call activity, it enables the Drill-Down button.
      • Render the process instance diagram with the retrieved XML.

        • use bpmn.io javascript library for the XML rendering and event attachements for process instance tasks.

bpmnViewer.importXML (xmlDiagram, function(err) {

if (err) { ... }

var canvas = bpmnViewer.get('canvas');

canvas.zoom ('fit-viewport');

var eventBus = bpmnViewer.get('eventBus');

// you may hook into any of the following events
var events = [
    'element.hover',
    'element.out',
    'element.click',
    'element.dblclick',
    'element.mousedown',
    'element.mouseup'
];

events.forEach(function(event) {

eventBus.on(event, function(e) {

log(event, 'on', e.element.id);

• • • • The Close button is always enabled.

• Rendering code example
  • Import BPMN XML string through Camunda REST APIs and render the BPMN workflow.
  • Attache overlay events on the Call Activities for drilling down and display details.

...