From 25927f070f9c137e4a5817449387899a4d54f362 Mon Sep 17 00:00:00 2001 From: NWalker4483 Date: Wed, 9 Jun 2021 14:55:05 -0400 Subject: [PATCH] . --- package-lock.json | 6 +- package.json | 2 +- src/app/diagram/diagram.component.ts | 19 +++++- src/app/modeler/modeler.component.ts | 92 +++++++++++++++++++--------- 4 files changed, 84 insertions(+), 35 deletions(-) diff --git a/package-lock.json b/package-lock.json index 00a0066..07cc5ad 100644 --- a/package-lock.json +++ b/package-lock.json @@ -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", diff --git a/package.json b/package.json index 738ae10..281c492 100644 --- a/package.json +++ b/package.json @@ -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", diff --git a/src/app/diagram/diagram.component.ts b/src/app/diagram/diagram.component.ts index fcc4fe0..3308b3e 100644 --- a/src/app/diagram/diagram.component.ts +++ b/src/app/diagram/diagram.component.ts @@ -29,10 +29,11 @@ export class DiagramComponent implements ControlValueAccessor, AfterViewInit { @ViewChild('propertiesRef', {static: true}) propertiesRef: ElementRef; @Output() private importDone: EventEmitter = 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, diff --git a/src/app/modeler/modeler.component.ts b/src/app/modeler/modeler.component.ts index d5f6f2e..af715c4 100644 --- a/src/app/modeler/modeler.component.ts +++ b/src/app/modeler/modeler.component.ts @@ -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 }); }); }