mirror of
https://github.com/Alfresco/alfresco-ng2-components.git
synced 2025-05-12 17:04:57 +00:00
125 lines
4.1 KiB
TypeScript
125 lines
4.1 KiB
TypeScript
/*!
|
|
* @license
|
|
* Copyright 2016 Alfresco Software, Ltd.
|
|
*
|
|
* Licensed under the Apache License, Version 2.0 (the "License");
|
|
* you may not use this file except in compliance with the License.
|
|
* You may obtain a copy of the License at
|
|
*
|
|
* http://www.apache.org/licenses/LICENSE-2.0
|
|
*
|
|
* Unless required by applicable law or agreed to in writing, software
|
|
* distributed under the License is distributed on an "AS IS" BASIS,
|
|
* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
* See the License for the specific language governing permissions and
|
|
* limitations under the License.
|
|
*/
|
|
|
|
import { Component, EventEmitter, Input, OnChanges, Output, SimpleChanges } from '@angular/core';
|
|
import { DiagramElementModel } from '../models/diagram/diagramElement.model';
|
|
import { DiagramModel } from '../models/diagram/diagram.model';
|
|
import { DiagramColorService } from '../services/diagram-color.service';
|
|
import { DiagramsService } from '../services/diagrams.service';
|
|
import { RaphaelService } from './raphael/raphael.service';
|
|
|
|
@Component({
|
|
selector: 'adf-diagram',
|
|
styleUrls: ['./diagram.component.css'],
|
|
templateUrl: './diagram.component.html'
|
|
})
|
|
export class DiagramComponent implements OnChanges {
|
|
@Input()
|
|
processDefinitionId: any;
|
|
|
|
@Input()
|
|
processInstanceId: any;
|
|
|
|
@Input()
|
|
metricPercentages: any;
|
|
|
|
@Input()
|
|
metricColor: any;
|
|
|
|
@Input()
|
|
metricType: string = '';
|
|
|
|
@Input()
|
|
width: number = 1000;
|
|
|
|
@Input()
|
|
height: number = 500;
|
|
|
|
@Output()
|
|
success = new EventEmitter();
|
|
|
|
@Output()
|
|
error = new EventEmitter();
|
|
|
|
PADDING_WIDTH: number = 60;
|
|
PADDING_HEIGHT: number = 60;
|
|
|
|
diagram: DiagramModel;
|
|
|
|
constructor(private diagramColorService: DiagramColorService,
|
|
private raphaelService: RaphaelService,
|
|
private diagramsService: DiagramsService) {
|
|
}
|
|
|
|
ngOnChanges(changes: SimpleChanges) {
|
|
this.reset();
|
|
this.diagramColorService.setTotalColors(this.metricColor);
|
|
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.success.emit(res);
|
|
},
|
|
(err: any) => {
|
|
this.error.emit(err);
|
|
}
|
|
);
|
|
}
|
|
|
|
getProcessDefinitionModel(processDefinitionId: string) {
|
|
this.diagramsService.getProcessDefinitionModel(processDefinitionId).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.success.emit(res);
|
|
},
|
|
(err: any) => {
|
|
this.error.emit(err);
|
|
}
|
|
);
|
|
}
|
|
|
|
setMetricValueToDiagramElement(diagram: DiagramModel, metrics: any, metricType: string) {
|
|
for (let key in metrics) {
|
|
if (metrics.hasOwnProperty(key)) {
|
|
let foundElement: DiagramElementModel = diagram.elements.find(
|
|
(element: DiagramElementModel) => element.id === key);
|
|
if (foundElement) {
|
|
foundElement.value = metrics[key];
|
|
foundElement.dataType = metricType;
|
|
}
|
|
}
|
|
}
|
|
}
|
|
|
|
reset() {
|
|
this.raphaelService.reset();
|
|
}
|
|
}
|