inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-26 17:24:56 +00:00
Code Issues Packages Projects Releases Wiki Activity

[ADF-402] Process Diagram Widget - Show the current process state (#1867)

Browse Source 
* Fixes for activiti process diagram

Fix to show the current process state. ADF issue no ADF-402

* #ADF-402 fix to show process state and unit tests changes

* fixed test for pipeline to match new angular4 changes on simple change (#1868)

* [DW-50]: New features for accordion-group component (#1851)

[ADF-557] -  Add a new property called showIcon as input to hide/show filter icons.

* [ADF-242] Select the first in the list when the report is deleted (#1862)

* ADF-242 Select the first in the list when the report is deleted

* Update README.md

* Fixes for activiti process diagram

Fix to show the current process state. ADF issue no ADF-402

* #ADF-402 fix to show process state and unit tests changes

* #ADF-402 Removed error logging and modified documentation
This commit is contained in:
Deepak Paul 2017-05-10 04:03:12 +05:30 committed by Eugenio Romano
parent bac2a45d18
commit 3482cc57be
13 changed files with 4738 additions and 4 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
ng2-components/ng2-activiti-diagrams/README.md
View File

@ -104,7 +104,12 @@ Follow the 3 steps below:
This component shows the diagram of a process. This component shows the diagram of a process.
```html ```html
<activiti-diagrams [processDefinitionId]="processDefinitionId"></activiti-diagrams> <activiti-diagram [processDefinitionId]="processDefinitionId"></activiti-diagram>
```
Or below component shows the diagram of a running process instance with the activities highlighted according to their state (Active/Completed/Pending).
```html
<activiti-diagram [processInstanceId]="processInstanceId"></activiti-diagram>
``` ```
Usage example of this component : Usage example of this component :
@ -165,7 +170,9 @@ platformBrowserDynamic().bootstrapModule(AppModule);
| Name | Description | | Name | Description |
| --- | --- | | --- | --- |
| `metricPercentage` | The array that contains the percentage of the time for each element | | `metricPercentages` | The array that contains the percentage of the time for each element |
| `metricColor` | The array that contains the color for each element |
| `metricType` | The string that specifies the metric type |
## Build from sources ## Build from sources

352
ng2-components/ng2-activiti-diagrams/src/assets/diagramActivities.mock.ts
View File

@ -26,6 +26,32 @@ export let userTask = {
properties: [{}] properties: [{}]
}; };
export let userTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake User task',
type: 'UserTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let userTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake User task',
type: 'UserTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let manualTask = { export let manualTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Manual task', name: 'Fake Manual task',
@ -37,6 +63,32 @@ export let manualTask = {
properties: [{}] properties: [{}]
}; };
export let manualTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Manual task',
type: 'ManualTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let manualTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Manual task',
type: 'ManualTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let serviceTask = { export let serviceTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Service task', name: 'Fake Service task',
@ -48,6 +100,32 @@ export let serviceTask = {
properties: [{}] properties: [{}]
}; };
export let serviceTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Service task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let serviceTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Service task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let receiveTask = { export let receiveTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Receive task', name: 'Fake Receive task',
@ -59,6 +137,32 @@ export let receiveTask = {
properties: [{}] properties: [{}]
}; };
export let receiveTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Receive task',
type: 'ReceiveTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let receiveTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Receive task',
type: 'ReceiveTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let scriptTask = { export let scriptTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Script task', name: 'Fake Script task',
@ -70,6 +174,32 @@ export let scriptTask = {
properties: [{}] properties: [{}]
}; };
export let scriptTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Script task',
type: 'ScriptTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let scriptTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Script task',
type: 'ScriptTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let businessRuleTask = { export let businessRuleTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake BusinessRule task', name: 'Fake BusinessRule task',
@ -81,6 +211,32 @@ export let businessRuleTask = {
properties: [{}] properties: [{}]
}; };
export let businessRuleTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake BusinessRule task',
type: 'BusinessRuleTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let businessRuleTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake BusinessRule task',
type: 'BusinessRuleTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}]
};
export let mailTask = { export let mailTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Mail task', name: 'Fake Mail task',
@ -93,6 +249,34 @@ export let mailTask = {
taskType: 'mail' taskType: 'mail'
}; };
export let mailTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Mail task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'mail'
};
export let mailTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Mail task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'mail'
};
export let camelTask = { export let camelTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Camel task', name: 'Fake Camel task',
@ -105,6 +289,34 @@ export let camelTask = {
taskType: 'camel' taskType: 'camel'
}; };
export let camelTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Camel task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'camel'
};
export let camelTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Camel task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'camel'
};
export let restCallTask = { export let restCallTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Rest Call task', name: 'Fake Rest Call task',
@ -117,6 +329,34 @@ export let restCallTask = {
taskType: 'rest_call' taskType: 'rest_call'
}; };
export let restCallTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Rest Call task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'rest_call'
};
export let restCallTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Rest Call task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'rest_call'
};
export let muleTask = { export let muleTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Mule task', name: 'Fake Mule task',
@ -129,6 +369,34 @@ export let muleTask = {
taskType: 'mule' taskType: 'mule'
}; };
export let muleTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Mule task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'mule'
};
export let muleTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Mule task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'mule'
};
export let alfrescoPublishTask = { export let alfrescoPublishTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Alfresco Publish task', name: 'Fake Alfresco Publish task',
@ -141,6 +409,34 @@ export let alfrescoPublishTask = {
taskType: 'alfresco_publish' taskType: 'alfresco_publish'
}; };
export let alfrescoPublishTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Alfresco Publish task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'alfresco_publish'
};
export let alfrescoPublishTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Alfresco Publish task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'alfresco_publish'
};
export let googleDrivePublishTask = { export let googleDrivePublishTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Google Drive Publish task', name: 'Fake Google Drive Publish task',
@ -153,6 +449,34 @@ export let googleDrivePublishTask = {
taskType: 'google_drive_publish' taskType: 'google_drive_publish'
}; };
export let googleDrivePublishTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Google Drive Publish task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'google_drive_publish'
};
export let googleDrivePublishTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Google Drive Publish task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'google_drive_publish'
};
export let boxPublishTask = { export let boxPublishTask = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Box Publish task', name: 'Fake Box Publish task',
@ -164,3 +488,31 @@ export let boxPublishTask = {
properties: [{}], properties: [{}],
taskType: 'box_publish' taskType: 'box_publish'
}; };
export let boxPublishTaskActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Box Publish task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'box_publish'
};
export let boxPublishTaskCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
name: 'Fake Box Publish task',
type: 'ServiceTask',
width: 82,
height: 67,
x: 75.56890135999998,
y: 30,
properties: [{}],
taskType: 'box_publish'
};

104
ng2-components/ng2-activiti-diagrams/src/assets/diagramBoundary.mock.ts
View File

@ -26,6 +26,32 @@ export let boundaryTimeEvent = {
eventDefinition: {type: 'timer'} eventDefinition: {type: 'timer'}
}; };
export let boundaryTimeEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'timer'}
};
export let boundaryTimeEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'timer'}
};
export let boundaryErrorEvent = { export let boundaryErrorEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent', type: 'BoundaryEvent',
@ -37,6 +63,32 @@ export let boundaryErrorEvent = {
eventDefinition: {type: 'error'} eventDefinition: {type: 'error'}
}; };
export let boundaryErrorEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'error'}
};
export let boundaryErrorEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'error'}
};
export let boundarySignalEvent = { export let boundarySignalEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent', type: 'BoundaryEvent',
@ -48,6 +100,32 @@ export let boundarySignalEvent = {
eventDefinition: {type: 'signal'} eventDefinition: {type: 'signal'}
}; };
export let boundarySignalEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'signal'}
};
export let boundarySignalEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'signal'}
};
export let boundaryMessageEvent = { export let boundaryMessageEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent', type: 'BoundaryEvent',
@ -58,3 +136,29 @@ export let boundaryMessageEvent = {
properties: [{}], properties: [{}],
eventDefinition: {type: 'message'} eventDefinition: {type: 'message'}
}; };
export let boundaryMessageEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'message'}
};
export let boundaryMessageEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'BoundaryEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'message'}
};

179
ng2-components/ng2-activiti-diagrams/src/assets/diagramEvents.mock.ts
View File

@ -25,6 +25,30 @@ export let startEvent = {
properties: [{}] properties: [{}]
}; };
export let startEventActive = {
completed: false,
current: true,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
properties: [{}]
};
export let startEventCompleted = {
completed: true,
current: false,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
properties: [{}]
};
export let startTimeEvent = { export let startTimeEvent = {
id: 'startEvent1', id: 'startEvent1',
type: 'StartEvent', type: 'StartEvent',
@ -36,6 +60,32 @@ export let startTimeEvent = {
properties: [{}] properties: [{}]
}; };
export let startTimeEventActive = {
completed: false,
current: true,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'timer'},
properties: [{}]
};
export let startTimeEventCompleted = {
completed: true,
current: false,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'timer'},
properties: [{}]
};
export let startSignalEvent = { export let startSignalEvent = {
id: 'startEvent1', id: 'startEvent1',
type: 'StartEvent', type: 'StartEvent',
@ -47,6 +97,32 @@ export let startSignalEvent = {
properties: [{}] properties: [{}]
}; };
export let startSignalEventActive = {
completed: false,
current: true,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'signal'},
properties: [{}]
};
export let startSignalEventCompleted = {
completed: true,
current: false,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'signal'},
properties: [{}]
};
export let startMessageEvent = { export let startMessageEvent = {
id: 'startEvent1', id: 'startEvent1',
type: 'StartEvent', type: 'StartEvent',
@ -58,6 +134,32 @@ export let startMessageEvent = {
properties: [{}] properties: [{}]
}; };
export let startMessageEventActive = {
completed: false,
current: true,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'message'},
properties: [{}]
};
export let startMessageEventCompleted = {
completed: true,
current: false,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'message'},
properties: [{}]
};
export let startErrorEvent = { export let startErrorEvent = {
id: 'startEvent1', id: 'startEvent1',
type: 'StartEvent', type: 'StartEvent',
@ -69,6 +171,32 @@ export let startErrorEvent = {
properties: [{}] properties: [{}]
}; };
export let startErrorEventActive = {
completed: false,
current: true,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'error'},
properties: [{}]
};
export let startErrorEventCompleted = {
completed: true,
current: false,
id: 'startEvent1',
type: 'StartEvent',
width: 30,
height: 30,
x: 15,
y: 48.5,
eventDefinition: {type: 'error'},
properties: [{}]
};
export let endEvent = { export let endEvent = {
id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E', id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E',
type: 'EndEvent', type: 'EndEvent',
@ -79,6 +207,30 @@ export let endEvent = {
properties: [{}] properties: [{}]
}; };
export let endEventActive = {
completed: false,
current: true,
id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E',
type: 'EndEvent',
width: 28,
height: 28,
x: 15,
y: 48.5,
properties: [{}]
};
export let endEventCompleted = {
completed: true,
current: false,
id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E',
type: 'EndEvent',
width: 28,
height: 28,
x: 15,
y: 48.5,
properties: [{}]
};
export let endErrorEvent = { export let endErrorEvent = {
id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E', id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E',
type: 'EndEvent', type: 'EndEvent',
@ -89,3 +241,30 @@ export let endErrorEvent = {
eventDefinition: {type: 'error'}, eventDefinition: {type: 'error'},
properties: [{}] properties: [{}]
}; };
export let endErrorEventActive = {
completed: false,
current: true,
id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E',
type: 'EndEvent',
width: 28,
height: 28,
x: 15,
y: 48.5,
eventDefinition: {type: 'error'},
properties: [{}]
};
export let endErrorEventCompleted = {
completed: true,
current: false,
id: 'sid-CED2A8DB-47E2-4057-A7B8-3ABBE5CE795E',
type: 'EndEvent',
width: 28,
height: 28,
x: 15,
y: 48.5,
eventDefinition: {type: 'error'},
properties: [{}]
};

96
ng2-components/ng2-activiti-diagrams/src/assets/diagramGateways.mock.ts
View File

@ -25,6 +25,30 @@ export let exclusiveGatway = {
properties: [{}] properties: [{}]
}; };
export let exclusiveGatwayActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ExclusiveGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};
export let exclusiveGatwayCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ExclusiveGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};
export let inclusiveGatway = { export let inclusiveGatway = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'InclusiveGateway', type: 'InclusiveGateway',
@ -35,6 +59,30 @@ export let inclusiveGatway = {
properties: [{}] properties: [{}]
}; };
export let inclusiveGatwayActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'InclusiveGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};
export let inclusiveGatwayCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'InclusiveGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};
export let parallelGatway = { export let parallelGatway = {
id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC', id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC',
type: 'ParallelGateway', type: 'ParallelGateway',
@ -45,6 +93,30 @@ export let parallelGatway = {
properties: [{}] properties: [{}]
}; };
export let parallelGatwayActive = {
completed: false,
current: true,
id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC',
type: 'ParallelGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};
export let parallelGatwayCompleted = {
completed: true,
current: false,
id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC',
type: 'ParallelGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};
export let eventGatway = { export let eventGatway = {
id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC', id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC',
type: 'EventGateway', type: 'EventGateway',
@ -54,3 +126,27 @@ export let eventGatway = {
y: 30, y: 30,
properties: [{}] properties: [{}]
}; };
export let eventGatwayActive = {
completed: false,
current: true,
id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC',
type: 'EventGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};
export let eventGatwayCompleted = {
completed: true,
current: false,
id: 'sid-14EE23CE-0731-4E23-80F3-C557DA2A0CFC',
type: 'EventGateway',
width: 40,
height: 40,
x: 40,
y: 30,
properties: [{}]
};

106
ng2-components/ng2-activiti-diagrams/src/assets/diagramIntermediate.mock.ts
View File

@ -26,6 +26,33 @@ export let intermediateCatchingTimeEvent = {
eventDefinition: {type: 'timer'} eventDefinition: {type: 'timer'}
}; };
export let intermediateCatchingTimeEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'timer'}
};
export let intermediateCatchingTimeEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'timer'}
};
export let intermediateCatchingErrorEvent = { export let intermediateCatchingErrorEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent', type: 'IntermediateCatchEvent',
@ -37,6 +64,32 @@ export let intermediateCatchingErrorEvent = {
eventDefinition: {type: 'error'} eventDefinition: {type: 'error'}
}; };
export let intermediateCatchingErrorEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'error'}
};
export let intermediateCatchingErrorEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'error'}
};
export let intermediateCatchingSignalEvent = { export let intermediateCatchingSignalEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent', type: 'IntermediateCatchEvent',
@ -48,6 +101,33 @@ export let intermediateCatchingSignalEvent = {
eventDefinition: {type: 'signal'} eventDefinition: {type: 'signal'}
}; };
export let intermediateCatchingSignalEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'signal'}
};
export let intermediateCatchingSignalEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'signal'}
};
export let intermediateCatchingMessageEvent = { export let intermediateCatchingMessageEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent', type: 'IntermediateCatchEvent',
@ -58,3 +138,29 @@ export let intermediateCatchingMessageEvent = {
properties: [{}], properties: [{}],
eventDefinition: {type: 'message'} eventDefinition: {type: 'message'}
}; };
export let intermediateCatchingMessageEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'message'}
};
export let intermediateCatchingMessageEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'IntermediateCatchEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'message'}
};

48
ng2-components/ng2-activiti-diagrams/src/assets/diagramStructural.mock.ts
View File

@ -25,6 +25,30 @@ export let subProcess = {
properties: [{}] properties: [{}]
}; };
export let subProcessActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'SubProcess',
width: 300,
height: 200,
x: 40,
y: 30,
properties: [{}]
};
export let subProcessCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'SubProcess',
width: 300,
height: 200,
x: 40,
y: 30,
properties: [{}]
};
export let eventSubProcess = { export let eventSubProcess = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'EventSubProcess', type: 'EventSubProcess',
@ -34,3 +58,27 @@ export let eventSubProcess = {
y: 30, y: 30,
properties: [{}] properties: [{}]
}; };
export let eventSubProcessActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'EventSubProcess',
width: 300,
height: 200,
x: 40,
y: 30,
properties: [{}]
};
export let eventSubProcessCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'EventSubProcess',
width: 300,
height: 200,
x: 40,
y: 30,
properties: [{}]
};

104
ng2-components/ng2-activiti-diagrams/src/assets/diagramThrow.mock.ts
View File

@ -26,6 +26,32 @@ export let throwTimeEvent = {
eventDefinition: {type: 'timer'} eventDefinition: {type: 'timer'}
}; };
export let throwTimeEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'timer'}
};
export let throwTimeEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'timer'}
};
export let throwErrorEvent = { export let throwErrorEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent', type: 'ThrowEvent',
@ -37,6 +63,32 @@ export let throwErrorEvent = {
eventDefinition: {type: 'error'} eventDefinition: {type: 'error'}
}; };
export let throwErrorEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'error'}
};
export let throwErrorEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'error'}
};
export let throwSignalEvent = { export let throwSignalEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent', type: 'ThrowEvent',
@ -48,6 +100,32 @@ export let throwSignalEvent = {
eventDefinition: {type: 'signal'} eventDefinition: {type: 'signal'}
}; };
export let throwSignalEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'signal'}
};
export let throwSignalEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'signal'}
};
export let throwMessageEvent = { export let throwMessageEvent = {
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7', id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent', type: 'ThrowEvent',
@ -58,3 +136,29 @@ export let throwMessageEvent = {
properties: [{}], properties: [{}],
eventDefinition: {type: 'message'} eventDefinition: {type: 'message'}
}; };
export let throwMessageEventActive = {
completed: false,
current: true,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'message'}
};
export let throwMessageEventCompleted = {
completed: true,
current: false,
id: 'sid-C05B7CB7-1CFD-4AE4-9E01-C2C91E35E5A7',
type: 'ThrowEvent',
width: 31,
height: 31,
x: 40,
y: 30,
properties: [{}],
eventDefinition: {type: 'message'}
};

3692
ng2-components/ng2-activiti-diagrams/src/components/diagram.component.spec.ts
View File

File diff suppressed because it is too large Load Diff

27
ng2-components/ng2-activiti-diagrams/src/components/diagram.component.ts
View File

@ -31,6 +31,9 @@ export class DiagramComponent {
@Input() @Input()
processDefinitionId: any; processDefinitionId: any;
@Input()
processInstanceId: any;
@Input() @Input()
metricPercentages: any; metricPercentages: any;
@ -71,14 +74,34 @@ export class DiagramComponent {
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
this.reset(); this.reset();
this.diagramColorService.setTotalColors(this.metricColor); this.diagramColorService.setTotalColors(this.metricColor);
this.getProcessDefinitionModel(this.processDefinitionId); if (this.processDefinitionId) {
this.getProcessDefinitionModel(this.processDefinitionId);
} else {
this.getRunningProcessDefinitionModel(this.processInstanceId);
}
}
getRunningProcessDefinitionModel(processInstanceId: string) {
this.diagramsService.getRunningProcessDefinitionModel(processInstanceId).subscribe(
(res: any) => {
this.diagram = new DiagramModel(res);
this.raphaelService.setting(this.diagram.diagramWidth + this.PADDING_WIDTH,
this.diagram.diagramHeight + this.PADDING_HEIGHT);
this.setMetricValueToDiagramElement(this.diagram, this.metricPercentages, this.metricType);
this.onSuccess.emit(res);
},
(err: any) => {
this.onError.emit(err);
}
);
} }
getProcessDefinitionModel(processDefinitionId: string) { getProcessDefinitionModel(processDefinitionId: string) {
this.diagramsService.getProcessDefinitionModel(processDefinitionId).subscribe( this.diagramsService.getProcessDefinitionModel(processDefinitionId).subscribe(
(res: any) => { (res: any) => {
this.diagram = new DiagramModel(res); this.diagram = new DiagramModel(res);
this.raphaelService.setting(this.diagram.diagramWidth + this.PADDING_WIDTH, this.diagram.diagramHeight + this.PADDING_HEIGHT); this.raphaelService.setting(this.diagram.diagramWidth + this.PADDING_WIDTH,
this.diagram.diagramHeight + this.PADDING_HEIGHT);
this.setMetricValueToDiagramElement(this.diagram, this.metricPercentages, this.metricType); this.setMetricValueToDiagramElement(this.diagram, this.metricPercentages, this.metricType);
this.onSuccess.emit(res); this.onSuccess.emit(res);
}, },

4
ng2-components/ng2-activiti-diagrams/src/components/raphael/raphael-multiline-text.component.ts
View File

@ -74,6 +74,10 @@ export class RaphaelMultilineTextDirective extends RaphaelBase implements OnInit
} }
private formatText(textPaper, text, elementWidth) { private formatText(textPaper, text, elementWidth) {
let pText = 'abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ';
textPaper.attr({
'text': pText
});
let letterWidth = textPaper.getBBox().width / text.length; let letterWidth = textPaper.getBBox().width / text.length;
let removedLineBreaks = text.split('\n'); let removedLineBreaks = text.split('\n');
let actualRowLength = 0, formattedText = []; let actualRowLength = 0, formattedText = [];

8
ng2-components/ng2-activiti-diagrams/src/models/diagram.model.ts
View File

@ -50,6 +50,8 @@ export class DiagramModel {
} }
export class DiagramElementModel { export class DiagramElementModel {
completed: boolean;
current: boolean;
height: string; height: string;
id: string; id: string;
name: string; name: string;
@ -65,6 +67,8 @@ export class DiagramElementModel {
constructor(obj?: any) { constructor(obj?: any) {
if (obj) { if (obj) {
this.completed = obj.completed || false;
this.current = obj.current || false;
this.height = obj.height || ''; this.height = obj.height || '';
this.id = obj.id || ''; this.id = obj.id || '';
this.name = obj.name || ''; this.name = obj.name || '';
@ -102,6 +106,8 @@ export class DiagramElementPropertyModel {
} }
export class DiagramFlowElementModel { export class DiagramFlowElementModel {
completed: boolean;
current: boolean;
id: string; id: string;
properties: any[] = []; properties: any[] = [];
sourceRef: string; sourceRef: string;
@ -111,6 +117,8 @@ export class DiagramFlowElementModel {
constructor(obj?: any) { constructor(obj?: any) {
if (obj) { if (obj) {
this.completed = obj.completed || false;
this.current = obj.current || false;
this.id = obj.id; this.id = obj.id;
this.properties = obj.properties; this.properties = obj.properties;
this.sourceRef = obj.sourceRef; this.sourceRef = obj.sourceRef;

11
ng2-components/ng2-activiti-diagrams/src/services/diagrams.service.ts
View File

@ -40,6 +40,17 @@ export class DiagramsService {
}).catch(err => this.handleError(err)); }).catch(err => this.handleError(err));
} }
getRunningProcessDefinitionModel(processInstanceId: string): Observable<any> {
let url = `${this.settingsService.getBPMApiBaseUrl()}/app/rest/process-instances/${processInstanceId}/model-json`;
let options = this.getRequestOptions();
return this.http
.get(url, options)
.map((res: any) => {
let body = res.json();
return body;
}).catch(err => this.handleError(err));
}
public getHeaders(): Headers { public getHeaders(): Headers {
return new Headers({ return new Headers({
'Accept': 'application/json', 'Accept': 'application/json',