Skip to content

Commit 4be5f89

Browse files
committed
[NAE-1684] Frontend component for data field caseRef
- finish with load a net and show it in petriflow lib
1 parent 3492f30 commit 4be5f89

File tree

10 files changed

+184
-11
lines changed

10 files changed

+184
-11
lines changed

projects/netgrif-components-core/src/lib/resources/engine-endpoint/petri-net-resource.service.ts

Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -14,6 +14,7 @@ import {Page} from '../interface/page';
1414
import {processMessageResponse} from '../../utility/process-message-response';
1515
import {AbstractResourceService} from '../abstract-endpoint/abstract-resource.service';
1616
import RolesAndPermissions from '../../process/rolesAndPermissions';
17+
import {PetriNetImport} from '../interface/petri-net-import';
1718

1819
@Injectable({
1920
providedIn: 'root'
@@ -170,4 +171,16 @@ export class PetriNetResourceService extends AbstractResourceService {
170171
return this._resourceProvider.delete$<MessageResource>('petrinet/' + netId, this.SERVER_URL)
171172
.pipe(switchMap(processMessageResponse));
172173
}
174+
175+
/**
176+
* get One Net by ID
177+
*
178+
* **Request Type:** GET
179+
*
180+
* **Request URL:** {{baseUrl}}/api/petrinet/{id}
181+
*/
182+
public getNetByCaseId(caseId: string, params?: Params): Observable<PetriNetImport> {
183+
return this._resourceProvider.get$('petrinet/case/' + caseId, this.SERVER_URL, params)
184+
.pipe(map(r => this.changeType(r, undefined)));
185+
}
173186
}
Lines changed: 11 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,11 @@
1+
import {Position} from './position';
2+
3+
export interface ArcImport {
4+
destinationId: string;
5+
sourceId: string;
6+
importId: string;
7+
multiplicity: number;
8+
stringId: string;
9+
breakpoints: Array<Position>;
10+
type: string;
11+
}
Lines changed: 9 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,9 @@
1+
import {TransitionImport} from './transition-import';
2+
import {PlaceImport} from './place-import';
3+
import {ArcImport} from './arc-import';
4+
5+
export interface PetriNetImport {
6+
transitions: Array<TransitionImport>;
7+
places: Array<PlaceImport>;
8+
arcs: Array<ArcImport>;
9+
}
Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
import {Position} from './position';
2+
3+
export interface PlaceImport {
4+
importId: string;
5+
isStatic: boolean;
6+
position: Position;
7+
stringId: string;
8+
title: object;
9+
tokens: number;
10+
}
Lines changed: 5 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,5 @@
1+
2+
export interface Position {
3+
x: number;
4+
y: number;
5+
}
Lines changed: 8 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,8 @@
1+
import {Position} from './position';
2+
3+
export interface TransitionImport {
4+
importId: string;
5+
position: Position;
6+
stringId: string;
7+
title: object;
8+
}

projects/netgrif-components-core/src/lib/resources/public-api.ts

Lines changed: 5 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -44,7 +44,11 @@ export * from './interface/user-resource';
4444
export * from './interface/create-case-request-body';
4545
export * from './interface/ldapGroupResponseBody';
4646
export * from './interface/task-pair';
47-
47+
export * from './interface/arc-import';
48+
export * from './interface/place-import';
49+
export * from './interface/transition-import';
50+
export * from './interface/position';
51+
export * from './interface/petri-net-import';
4852
export * from './types/nae-date-type';
4953

5054
/* ABSTRACTIONS */

projects/netgrif-components-core/src/lib/side-menu/content-components/new-case/abstract-new-case.component.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -148,12 +148,12 @@ export abstract class AbstractNewCaseComponent implements OnDestroy {
148148
this._caseResourceService.createCase(newCase)
149149
.subscribe(
150150
(response: EventOutcomeMessageResource) => {
151-
this._snackBarService.openSuccessSnackBar(response.outcome.message === undefined
151+
this._snackBarService.openSuccessSnackBar(response.outcome?.message === undefined
152152
? this._translate.instant('side-menu.new-case.createCase') + ' ' + newCase.title
153153
: response.outcome.message);
154154
this._sideMenuControl.close({
155155
opened: false,
156-
message: response.outcome.message === undefined
156+
message: response.outcome?.message === undefined
157157
? 'Confirm new case setup'
158158
: response.outcome.message
159159
,
Lines changed: 6 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -1,5 +1,10 @@
11
.outer {
22
display: flex;
3-
min-height: 50%;
3+
min-height: 300px;
4+
width: 100%;
45
max-height: 100%;
56
}
7+
8+
.canvas {
9+
width: 100%;
10+
}
Lines changed: 115 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1,10 +1,21 @@
11
import {AfterViewInit, Component, Input} from '@angular/core';
2-
import {CaseRefField} from '@netgrif/components-core';
2+
import {CaseRefField, CaseResourceService, PetriNetResourceService, ArcImport} from '@netgrif/components-core';
33
import {
4+
PetriflowArc,
45
PetriflowCanvasConfigurationService,
56
PetriflowCanvasFactoryService,
6-
PetriflowCanvasService
7+
PetriflowCanvasService,
8+
PetriflowInhibitorArc,
9+
PetriflowPlace,
10+
PetriflowPlaceTransitionArc, PetriflowReadArc,
11+
PetriflowResetArc,
12+
PetriflowTransition,
13+
PetriflowTransitionPlaceArc
714
} from '@netgrif/petriflow.svg';
15+
import {
16+
Arc, InhibitorArc, ReadArc, RegularPlaceTransitionArc,
17+
RegularTransitionPlaceArc, ResetArc
18+
} from '@netgrif/petri.svg';
819

920
@Component({
1021
selector: 'nc-case-ref-field',
@@ -16,15 +27,112 @@ export class CaseRefFieldComponent implements AfterViewInit{
1627
@Input() public dataField: CaseRefField;
1728

1829
constructor(private _petriflowCanvasService: PetriflowCanvasService, private _petriflowFactoryService: PetriflowCanvasFactoryService,
19-
private _petriflowConfigService: PetriflowCanvasConfigurationService){
30+
private _petriflowConfigService: PetriflowCanvasConfigurationService, private _caseResourceService: CaseResourceService,
31+
private _petriNetResourceService: PetriNetResourceService){
2032
}
2133

2234
ngAfterViewInit(): void {
23-
const transition = this._petriflowFactoryService.createTransition(new DOMPoint(100, 100));
24-
this._petriflowConfigService.addTransitionEvents(transition);
35+
this._petriNetResourceService.getNetByCaseId(this.dataField.value).subscribe(net => {
36+
if (net) {
37+
const trans: Array<PetriflowTransition> = [];
38+
const places: Array<PetriflowPlace> = [];
39+
let minX: number = 1000;
40+
let minY: number = 1000;
41+
net.transitions.forEach((value) => {
42+
const transition = this._petriflowFactoryService.createTransition(new DOMPoint(value.position.x, value.position.y));
43+
transition.changeId(value.stringId);
44+
minX = Math.min(minX, value.position.x);
45+
minY = Math.min(minY, value.position.y);
46+
this._petriflowConfigService.addTransitionEvents(transition);
47+
trans.push(transition);
48+
})
49+
net.places.forEach((value) => {
50+
const place = this._petriflowFactoryService.createPlace(value.tokens, new DOMPoint(value.position.x, value.position.y));
51+
place.changeId(value.stringId);
52+
minX = Math.min(minX, value.position.x);
53+
minY = Math.min(minY, value.position.y);
54+
this._petriflowConfigService.addPlaceEvents(place);
55+
places.push(place);
56+
})
57+
net.arcs.forEach((arc) => {
58+
let source: PetriflowPlace | PetriflowTransition = trans.find(value => value.canvasElement.label.textContent === arc.sourceId);
59+
let destination: PetriflowPlace | PetriflowTransition;
60+
if (source === undefined) {
61+
source = places.find(value => value.canvasElement.label.textContent === arc.sourceId);
62+
destination = trans.find(value => value.canvasElement.label.textContent === arc.destinationId);
63+
} else {
64+
destination = places.find(value => value.canvasElement.label.textContent === arc.destinationId);
65+
}
66+
if (source === undefined || destination === undefined) {
67+
console.error("Can't find source or destination for arc [" + arc.importId + "]");
68+
} else {
69+
const newArc: Arc = this.createArc(arc, source, destination);
70+
const petriflowArc: PetriflowArc<Arc> = this.createPetriflowArc(arc, newArc, source);
71+
this._petriflowCanvasService.canvas.container.appendChild(newArc.container);
72+
this._petriflowCanvasService.petriflowElementsCollection.arcs.push(petriflowArc);
73+
arc.breakpoints?.forEach(value => {
74+
minX = Math.min(minX, value.x);
75+
minY = Math.min(minY, value.y);
76+
});
77+
}
78+
});
79+
this._petriflowCanvasService.panzoom?.moveTo(-minX+20, -minY+20);
80+
setTimeout(() => {
81+
this._petriflowCanvasService.panzoom?.pause();
82+
})
83+
}
84+
});
85+
}
2586

26-
const place = this._petriflowFactoryService.createPlace(1, new DOMPoint(150, 100));
27-
this._petriflowConfigService.addPlaceEvents(place);
87+
private createArc(arc: ArcImport, source: PetriflowTransition | PetriflowPlace, destination: PetriflowPlace | PetriflowTransition) {
88+
if (source instanceof PetriflowPlace) {
89+
switch (arc.type) {
90+
case 'arc': {
91+
return this._petriflowFactoryService.createArc(RegularPlaceTransitionArc, source.canvasElement, destination.canvasElement, arc.breakpoints, arc.multiplicity);
92+
}
93+
case 'reset': {
94+
return this._petriflowFactoryService.createArc(ResetArc, source.canvasElement, destination.canvasElement, arc.breakpoints, arc.multiplicity);
95+
}
96+
case 'inhibitor': {
97+
return this._petriflowFactoryService.createArc(InhibitorArc, source.canvasElement, destination.canvasElement, arc.breakpoints, arc.multiplicity);
98+
}
99+
case 'read': {
100+
return this._petriflowFactoryService.createArc(ReadArc, source.canvasElement, destination.canvasElement, arc.breakpoints, arc.multiplicity);
101+
}
102+
default: {
103+
return undefined;
104+
}
105+
}
106+
} else if (arc.type === 'arc') {
107+
return this._petriflowFactoryService.createArc(RegularTransitionPlaceArc, source.canvasElement, destination.canvasElement, arc.breakpoints, arc.multiplicity);
108+
} else {
109+
return undefined;
110+
}
28111
}
29112

113+
private createPetriflowArc(arc: ArcImport, newArc: Arc, source: PetriflowTransition | PetriflowPlace) {
114+
if (source instanceof PetriflowPlace) {
115+
switch (arc.type) {
116+
case 'arc': {
117+
return this._petriflowFactoryService.createArc(PetriflowPlaceTransitionArc, newArc);
118+
}
119+
case 'reset': {
120+
return this._petriflowFactoryService.createArc(PetriflowResetArc, newArc);
121+
}
122+
case 'inhibitor': {
123+
return this._petriflowFactoryService.createArc(PetriflowInhibitorArc, newArc);
124+
}
125+
case 'read': {
126+
return this._petriflowFactoryService.createArc(PetriflowReadArc, newArc);
127+
}
128+
default: {
129+
return undefined;
130+
}
131+
}
132+
} else if (arc.type === 'arc') {
133+
return this._petriflowFactoryService.createArc(PetriflowTransitionPlaceArc, newArc);
134+
} else {
135+
return undefined;
136+
}
137+
}
30138
}

0 commit comments

Comments
 (0)