Merge pull request #1288 from Alfresco/dev-mvitale-1276

Dynamic diagram size
This commit is contained in:
Mario Romano 2016-12-15 19:05:24 +00:00 committed by GitHub
commit d50845cf4d
4 changed files with 13 additions and 9 deletions

View File

@ -0,0 +1,3 @@
.diagram {
border: 1px solid lightgray; overflow:auto
}

View File

@ -1,4 +1,4 @@
<div *ngIf="diagram"> <div *ngIf="diagram" class="diagram">
<div *ngFor="let element of diagram.elements"> <div *ngFor="let element of diagram.elements">
<div [ngSwitch]="element.type"> <div [ngSwitch]="element.type">
<div *ngSwitchCase="'StartEvent'"> <div *ngSwitchCase="'StartEvent'">

View File

@ -25,6 +25,7 @@ import { DiagramModel, DiagramElementModel } from '../models/diagram.model';
@Component({ @Component({
moduleId: module.id, moduleId: module.id,
selector: 'activiti-diagram', selector: 'activiti-diagram',
styleUrls: ['./diagram.component.css'],
templateUrl: './diagram.component.html' templateUrl: './diagram.component.html'
}) })
export class DiagramComponent { export class DiagramComponent {
@ -52,6 +53,9 @@ export class DiagramComponent {
@Output() @Output()
onError = new EventEmitter(); onError = new EventEmitter();
PADDING_WIDTH: number = 60;
PADDING_HEIGHT: number = 60;
private diagram: DiagramModel; private diagram: DiagramModel;
private elementRef: ElementRef; private elementRef: ElementRef;
@ -66,10 +70,6 @@ export class DiagramComponent {
this.elementRef = elementRef; this.elementRef = elementRef;
} }
ngOnInit() {
this.raphaelService.setting(this.width, this.height);
}
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
this.reset(); this.reset();
this.diagramColorService.setTotalColors(this.metricColor); this.diagramColorService.setTotalColors(this.metricColor);
@ -80,6 +80,7 @@ export class DiagramComponent {
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.setMetricValueToDiagramElement(this.diagram, this.metricPercentages, this.metricType); this.setMetricValueToDiagramElement(this.diagram, this.metricPercentages, this.metricType);
this.onSuccess.emit(res); this.onSuccess.emit(res);
}, },

View File

@ -16,10 +16,10 @@
*/ */
export class DiagramModel { export class DiagramModel {
diagramBeginX: string; diagramBeginX: number;
diagramBeginY: string; diagramBeginY: number;
diagramHeight: string; diagramHeight: number;
diagramWidth: string; diagramWidth: number;
elements: DiagramElementModel[] = []; elements: DiagramElementModel[] = [];
flows: DiagramFlowElementModel[] = []; flows: DiagramFlowElementModel[] = [];
pools: DiagramPoolElementModel[] = []; pools: DiagramPoolElementModel[] = [];