sartography
/
cr-connect-bpmn
mirror of https://github.com/sartography/cr-connect-bpmn.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

.

This commit is contained in:
NWalker4483 2021-06-09 14:55:05 -04:00
parent 4114554b61
commit 25927f070f
4 changed files with 84 additions and 35 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
package-lock.json generated
View File

@ -5527,9 +5527,9 @@
}
},
"diagram-js-code-editor": {
"version": "1.0.4",
"resolved": "https://registry.npmjs.org/diagram-js-code-editor/-/diagram-js-code-editor-1.0.4.tgz",
"integrity": "sha512-Mez70gLxG+XYQ+mVd2D88qH/tgXqFwsiCS0hncOc+B02X6HVNJtn10GyLsr5418+O/1Sal0pEgFitQCZoiTceA==",
"version": "1.0.6",
"resolved": "https://registry.npmjs.org/diagram-js-code-editor/-/diagram-js-code-editor-1.0.6.tgz",
"integrity": "sha512-4sCboTOtnUkh7lgGoqOt6aE/ENmJKpUYc1oLDFu6BWIPHPIxPwXgll98sTsZHfXEZGIQq9vfD68yvV+eGAeybg==",
"requires": {
"ace": "^1.3.0",
"ace-builds": "^1.4.12",

2
package.json
View File

@ -42,7 +42,7 @@
"camunda-bpmn-moddle": "^4.4.0",
"camunda-dmn-moddle": "^1.0.0",
"diagram-js": "^6.6.1",
"diagram-js-code-editor": "^1.0.4",
"diagram-js-code-editor": "^1.0.6",
"diagram-js-minimap": "^2.0.3",
"dmn-js": "^7.5.1",
"dmn-js-properties-panel": "^0.3.5",

19
src/app/diagram/diagram.component.ts
View File

@ -29,10 +29,11 @@ export class DiagramComponent implements ControlValueAccessor, AfterViewInit {
@ViewChild('propertiesRef', {static: true}) propertiesRef: ElementRef;
@Output() private importDone: EventEmitter<ImportEvent> = new EventEmitter();
private diagramType: FileType;
private modeler: BpmnModeler | DmnModeler;
public modeler: BpmnModeler | DmnModeler;
private xml = '';
private svg;
private disabled = false;
public eventBus;
// Hack so we can spy on this function
private _formatDate = formatDate;
@ -204,9 +205,25 @@ export class DiagramComponent implements ControlValueAccessor, AfterViewInit {
}
});
this.eventBus = this.modeler.get('eventBus');
this.eventBus.on('editor.scripts.request', () => {
this.api.listScripts().subscribe((data) => {
this.modeler.get('eventBus').fire('editor.scripts.response', { scripts: data });
})
});
// this.modeler.get('eventBus').on('editor.objects.request', () => {
// let data = [{userId: "int", description: "string"}]
// this.modeler.get('eventBus').fire('editor.scripts.response', {objects: data});
// });
return this.modeler as BpmnModeler;
}
private validate(){
}
private initializeDMNModeler(): DmnModeler {
this.modeler = new DmnModeler({
container: this.containerRef.nativeElement,

92
src/app/modeler/modeler.component.ts
View File

@ -1,9 +1,9 @@
import {DatePipe} from '@angular/common';
import {AfterViewInit, Component, ElementRef, ViewChild} from '@angular/core';
import {MatBottomSheet} from '@angular/material/bottom-sheet';
import {MatDialog} from '@angular/material/dialog';
import {MatSnackBar} from '@angular/material/snack-bar';
import {ActivatedRoute, Params, Router} from '@angular/router';
import { DatePipe } from '@angular/common';
import { AfterViewInit, Component, ElementRef, ViewChild } from '@angular/core';
import { MatBottomSheet } from '@angular/material/bottom-sheet';
import { MatDialog } from '@angular/material/dialog';
import { MatSnackBar } from '@angular/material/snack-bar';
import { ActivatedRoute, Params, Router } from '@angular/router';
import {
ApiErrorsComponent,
@ -15,13 +15,13 @@ import {
newFileFromResponse,
WorkflowSpec
} from 'sartography-workflow-lib';
import {FileMetaDialogComponent} from '../_dialogs/file-meta-dialog/file-meta-dialog.component';
import {NewFileDialogComponent} from '../_dialogs/new-file-dialog/new-file-dialog.component';
import {ConfirmDialogComponent} from '../_dialogs/confirm-dialog/confirm-dialog.component';
import {BpmnWarning} from '../_interfaces/bpmn-warning';
import {FileMetaDialogData, NewFileDialogData} from '../_interfaces/dialog-data';
import {ImportEvent} from '../_interfaces/import-event';
import {DiagramComponent} from '../diagram/diagram.component';
import { FileMetaDialogComponent } from '../_dialogs/file-meta-dialog/file-meta-dialog.component';
import { NewFileDialogComponent } from '../_dialogs/new-file-dialog/new-file-dialog.component';
import { ConfirmDialogComponent } from '../_dialogs/confirm-dialog/confirm-dialog.component';
import { BpmnWarning } from '../_interfaces/bpmn-warning';
import { FileMetaDialogData, NewFileDialogData } from '../_interfaces/dialog-data';
import { ImportEvent } from '../_interfaces/import-event';
import { DiagramComponent } from '../diagram/diagram.component';
@Component({
selector: 'app-modeler',
@ -64,7 +64,7 @@ export class ModelerComponent implements AfterViewInit {
private draftXml = '';
private svg = '';
@ViewChild(DiagramComponent) private diagramComponent: DiagramComponent;
@ViewChild('fileInput', {static: true}) fileInput: ElementRef;
@ViewChild('fileInput', { static: true }) fileInput: ElementRef;
private diagramType: FileType;
private workflowSpecId: string;
private fileMetaId: number;
@ -82,17 +82,48 @@ export class ModelerComponent implements AfterViewInit {
ngAfterViewInit(): void {
this.diagramComponent.registerOnChange((newXmlValue: string, newSvgValue: string) => {
console.log('ModelerComponent > DiagramComponent > onChange');
if (this.draftXml !== newXmlValue + ' ') {
if (this.draftXml !== newXmlValue + ' ') {
// When we initialize a new dmn, the component registers a change even if nothing
// changes. So . . . we check to make sure it *really* changed before updating the draftXml.
this.draftXml = newXmlValue;
}
this.svg = newSvgValue;
});
this.diagramComponent.modeler.get('eventBus').on('editor.validate.request', (request) => {
this.saveChanges();
console.log("Validating...", request.code);
this.api.validateWorkflowSpecification(this.diagramFileMeta.workflow_spec_id).subscribe(apiErrors => {
// apiErrors =
console.log(33);
if (apiErrors && apiErrors.length > 0) {
let passing = true;
let data = {};
apiErrors.forEach((error) => {
if (error.code == "validation_break") {
data = error.task_data;
}
else
{
passing = false;
}
});
this.diagramComponent.eventBus.fire('editor.validate.response', { passing: true, msg: "msg", data: data});
// this.bottomSheet.open(ApiErrorsComponent, { data: { apiErrors: apiErrors } });
} else {
// this.snackBar.open('Workflow specification is valid!', 'Ok', { duration: 5000 });
}
});
});
if (this.requestFileClick) {
this.fileInput.nativeElement.click();
this.requestFileClick = false;
}
}
handleImported(event: ImportEvent) {
@ -103,18 +134,18 @@ export class ModelerComponent implements AfterViewInit {
} = event;
if (type === 'success') {
this.snackBar.open(`Rendered diagram with ${warnings.length} warnings`, 'Ok', {duration: 5000});
this.snackBar.open(`Rendered diagram with ${warnings.length} warnings`, 'Ok', { duration: 5000 });
}
if (type === 'error') {
this.bottomSheet.open(ApiErrorsComponent, {data: {apiErrors: [error]}});
this.bottomSheet.open(ApiErrorsComponent, { data: { apiErrors: [error] } });
}
this.importError = error;
this.importWarnings = warnings;
// if this is a new file then we force a change to the file
if (this.isNew ) {
if (this.isNew) {
this.draftXml = this.xml + ' ';
this.isNew = false;
} else {
@ -139,7 +170,7 @@ export class ModelerComponent implements AfterViewInit {
}
getFileName() {
// return this.diagramFile ? this.diagramFile.name : this.fileName || 'No file selected';
// return this.diagramFile ? this.diagramFile.name : this.fileName || 'No file selected';
return this.diagramFileMeta ? this.diagramFileMeta.name : this.fileName || 'No file selected';
}
@ -149,13 +180,14 @@ export class ModelerComponent implements AfterViewInit {
maxWidth: '300px',
data: {
title: 'Unsaved Changes!',
message : 'Are you sure you want to abandon changes?',
message: 'Are you sure you want to abandon changes?',
}
});
dialogRef.afterClosed().subscribe(dialogResult => {
if (dialogResult) {
this.router.navigate(['/home', this.workflowSpec.name]);
}});
}
});
} else {
this.router.navigate(['/home', this.workflowSpec.name]);
}
@ -196,9 +228,9 @@ export class ModelerComponent implements AfterViewInit {
validate() {
this.api.validateWorkflowSpecification(this.diagramFileMeta.workflow_spec_id).subscribe(apiErrors => {
if (apiErrors && apiErrors.length > 0) {
this.bottomSheet.open(ApiErrorsComponent, {data: {apiErrors: apiErrors}});
this.bottomSheet.open(ApiErrorsComponent, { data: { apiErrors: apiErrors } });
} else {
this.snackBar.open('Workflow specification is valid!', 'Ok', {duration: 5000});
this.snackBar.open('Workflow specification is valid!', 'Ok', { duration: 5000 });
}
});
}
@ -289,7 +321,7 @@ export class ModelerComponent implements AfterViewInit {
private loadFilesFromDb() {
this.api.getWorkflowSpecification(this.workflowSpecId).subscribe(wfs => {
this.workflowSpec = wfs;
this.api.getFileMetas({workflow_spec_id: wfs.id}).subscribe(files => {
this.api.getFileMetas({ workflow_spec_id: wfs.id }).subscribe(files => {
this.bpmnFiles = [];
files.forEach(f => {
if ((f.type === FileType.BPMN) || (f.type === FileType.DMN)) {
@ -321,7 +353,7 @@ export class ModelerComponent implements AfterViewInit {
type: fileType,
workflow_spec_id: this.workflowSpec.id,
};
this.diagramFile = new File([this.xml], data.fileName, {type: 'text/xml'});
this.diagramFile = new File([this.xml], data.fileName, { type: 'text/xml' });
if (this.workflowSpec && isNumberDefined(fileMetaId)) {
@ -329,14 +361,14 @@ export class ModelerComponent implements AfterViewInit {
this.api.updateFileData(this.diagramFileMeta, this.diagramFile).subscribe(() => {
this.api.updateFileMeta(this.diagramFileMeta).subscribe(() => {
this.loadFilesFromDb();
this.snackBar.open(`Saved changes to file ${this.diagramFileMeta.name}.`, 'Ok', {duration: 5000});
this.snackBar.open(`Saved changes to file ${this.diagramFileMeta.name}.`, 'Ok', { duration: 5000 });
});
});
} else {
// Add new file meta
this.api.addFile({workflow_spec_id: this.workflowSpec.id}, this.diagramFileMeta, this.diagramFile).subscribe(fileMeta => {
this.api.addFile({ workflow_spec_id: this.workflowSpec.id }, this.diagramFileMeta, this.diagramFile).subscribe(fileMeta => {
this.router.navigate(['/modeler', this.workflowSpec.id, fileMeta.id]);
this.snackBar.open(`Saved new file ${fileMeta.name} to workflow spec ${this.workflowSpec.name}.`, 'Ok', {duration: 5000});
this.snackBar.open(`Saved new file ${fileMeta.name} to workflow spec ${this.workflowSpec.name}.`, 'Ok', { duration: 5000 });
}, () => {
// if this fails, we make sure that the file is treated as still new,
// and we make the user re-enter the file details as they weren't actually saved.
@ -349,7 +381,7 @@ export class ModelerComponent implements AfterViewInit {
private saveFileChanges() {
this.xml = this.draftXml;
this.diagramFile = new File([this.xml], this.diagramFileMeta.name, {type: 'text/xml'});
this.diagramFile = new File([this.xml], this.diagramFileMeta.name, { type: 'text/xml' });
// Propose removal
// if (this.svg && this.svg !== '') {
@ -359,7 +391,7 @@ export class ModelerComponent implements AfterViewInit {
this.api.updateFileData(this.diagramFileMeta, this.diagramFile).subscribe(newFileMeta => {
this.diagramFileMeta = newFileMeta;
this.snackBar.open(`Saved changes to file metadata ${this.diagramFileMeta.name}.`, 'Ok', {duration: 5000});
this.snackBar.open(`Saved changes to file metadata ${this.diagramFileMeta.name}.`, 'Ok', { duration: 5000 });
});
}