inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-10-01 14:41:32 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add DiagramExclusiveGatway

Browse Source
This commit is contained in:
mauriziovitale84
2016-10-21 10:06:50 +01:00
parent 7f3754da4f
commit 125065ed6f
9 changed files with 211 additions and 8 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
ng2-components/ng2-activiti-analytics/src/components/diagrams/diagram-exclusive-gateway.component.html Normal file
View File

@@ -0,0 +1,4 @@
<raphael-rhombus [center]="center" [width]="data.width" [height]="data.height" [stroke]="data.stroke" [strokeWidth]="2"
[fillColors]="data.fillColors" [fillOpacity]="data.fillOpacity"></raphael-rhombus>
<raphael-cross [center]="center" [width]="data.width" [height]="data.height" [stroke]="data.stroke" [strokeWidth]="data.strokeWidth"
[fillColors]="data.fillColors" [fillOpacity]="data.fillOpacity"></raphael-cross>

48
ng2-components/ng2-activiti-analytics/src/components/diagrams/diagram-exclusive-gateway.component.ts Normal file
View File

@@ -0,0 +1,48 @@
/*!
* @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, ElementRef, Input, Output, EventEmitter } from '@angular/core';
import { DiagramColorService } from './services/diagram-color.service';
@Component({
moduleId: module.id,
selector: 'diagram-exclusive-gateway',
templateUrl: './diagram-exclusive-gateway.component.html',
styleUrls: ['./diagram-exclusive-gateway.component.css']
})
export class DiagramExclusiveGatwayComponent {
@Input()
data: any;
@Output()
onError = new EventEmitter();
center: any = {};
constructor(public elementRef: ElementRef,
private diagramColorService: DiagramColorService) {}
ngOnInit() {
this.center.x = this.data.x;
this.center.y = this.data.y;
this.data.stroke = this.diagramColorService.getBpmnColor(this.data, DiagramColorService.MAIN_STROKE_COLOR);
this.data.fillColors = this.diagramColorService.getFillColour(this.data.id);
this.data.fillOpacity = this.diagramColorService.getFillOpacity();
this.data.strokeWidth = 3;
}
}

7
ng2-components/ng2-activiti-analytics/src/components/diagrams/diagram.component.html
View File

@@ -4,13 +4,12 @@
<div *ngSwitchCase="'StartEvent'">
<diagram-event [data]="element" [radius]="15" [strokeWidth]="1"></diagram-event>
</div>
</div>
<div [ngSwitch]="element.type">
<div *ngSwitchCase="'ExclusiveGateway'">
<diagram-exclusive-gateway [data]="element"></diagram-exclusive-gateway>
</div>
<div *ngSwitchCase="'EndEvent'">
<diagram-event [data]="element" [radius]="14" [strokeWidth]="4"></diagram-event>
</div>
</div>
<div [ngSwitch]="element.type">
<div *ngSwitchCase="'UserTask'">
<diagram-task [data]="element"></diagram-task>
</div>

5
ng2-components/ng2-activiti-analytics/src/components/diagrams/index.ts
View File

@@ -19,6 +19,7 @@ import { DiagramComponent } from './diagram.component';
import { DiagramEventComponent } from './diagram-event.component';
import { DiagramTaskComponent } from './diagram-task.component';
import { DiagramSequenceFlowComponent } from './diagram-sequence-flow.component';
import { DiagramExclusiveGatwayComponent } from './diagram-exclusive-gateway.component';
import { DiagramColorService } from './services/diagram-color.service';
@@ -27,12 +28,14 @@ export * from './diagram.component';
export * from './diagram-event.component';
export * from './diagram-task.component';
export * from './diagram-sequence-flow.component';
export * from './diagram-exclusive-gateway.component';
export const DIAGRAM_DIRECTIVES: any[] = [
DiagramComponent,
DiagramEventComponent,
DiagramTaskComponent,
DiagramSequenceFlowComponent
DiagramSequenceFlowComponent,
DiagramExclusiveGatwayComponent
];
export const DIAGRAM_PROVIDERS: any[] = [

7
ng2-components/ng2-activiti-analytics/src/components/diagrams/services/diagram-color.service.ts
View File

@@ -23,6 +23,9 @@ export class DiagramColorService {
static CURRENT_COLOR = '#017501';
static COMPLETED_COLOR = '#2632aa';
static ACTIVITY_STROKE_COLOR = '#bbbbbb';
static MAIN_STROKE_COLOR = '#585858';
static ACTIVITY_FILL_COLOR = '#f9f9f9';
static TASK_STROKE = '1';
static TASK_HIGHLIGHT_STROKE = '2';
@@ -41,9 +44,11 @@ export class DiagramColorService {
}
getFillColour(key: string) {
if (this.totalColors.hasOwnProperty(key)) {
if (this.totalColors && this.totalColors.hasOwnProperty(key)) {
let colorPercentage = this.totalColors[key];
return this.convertColorToHsb(colorPercentage);
} else {
return DiagramColorService.ACTIVITY_FILL_COLOR;
}
}

8
ng2-components/ng2-activiti-analytics/src/components/raphael/index.ts
View File

@@ -19,16 +19,22 @@ import { RaphaelCircleDirective } from './raphael-circle.component';
import { RaphaelRectDirective } from './raphael-rect.component';
import { RaphaelTextDirective } from './raphael-text.component';
import { RaphaelFlowArrowDirective } from './raphael-flow-arrow.component';
import { RaphaelCrossDirective } from './raphael-cross.component';
import { RaphaelRhombusDirective } from './raphael-rhombus.component';
// primitives
export * from './raphael-circle.component';
export * from './raphael-rect.component';
export * from './raphael-text.component';
export * from './raphael-flow-arrow.component';
export * from './raphael-cross.component';
export * from './raphael-rhombus.component';
export const RAPHAEL_DIRECTIVES: any[] = [
RaphaelCircleDirective,
RaphaelRectDirective,
RaphaelTextDirective,
RaphaelFlowArrowDirective
RaphaelFlowArrowDirective,
RaphaelCrossDirective,
RaphaelRhombusDirective
];

71
ng2-components/ng2-activiti-analytics/src/components/raphael/raphael-cross.component.ts Normal file
View File

@@ -0,0 +1,71 @@
/*!
* @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 { Directive, OnInit, ElementRef, Input, Output, EventEmitter } from '@angular/core';
import { Point } from './models/point';
import { RaphaelBase } from './raphael-base';
import { RaphaelService } from './raphael.service';
@Directive({selector: 'raphael-cross'})
export class RaphaelCrossDirective extends RaphaelBase implements OnInit {
@Input()
center: Point;
@Input()
width: number;
@Input()
height: number;
@Input()
fillColors: any;
@Input()
stroke: any;
@Input()
strokeWidth: any;
@Input()
fillOpacity: any;
@Output()
onError = new EventEmitter();
constructor(public elementRef: ElementRef,
raphaelService: RaphaelService) {
super(elementRef, raphaelService);
}
ngOnInit() {
console.log(this.elementRef);
let opts = {'stroke-width': this.strokeWidth, 'fill': this.fillColors, 'stroke': this.stroke, 'fill-opacity': this.fillOpacity};
this.draw(this.center, this.width, this.height, opts);
}
public draw(center: Point, width: number, height: number, opts?: any) {
let quarterWidth = width / 4;
let quarterHeight = height / 4;
return this.paper.path(
'M' + (center.x + quarterWidth + 3) + ' ' + (center.y + quarterHeight + 3) +
'L' + (center.x + 3 * quarterWidth - 3) + ' ' + (center.y + 3 * quarterHeight - 3) +
'M' + (center.x + quarterWidth + 3) + ' ' + (center.y + 3 * quarterHeight - 3) +
'L' + (center.x + 3 * quarterWidth - 3) + ' ' + (center.y + quarterHeight + 3)
).attr(opts);
}
}

67
ng2-components/ng2-activiti-analytics/src/components/raphael/raphael-rhombus.component.ts Normal file
View File

@@ -0,0 +1,67 @@
/*!
* @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 { Directive, OnInit, ElementRef, Input, Output, EventEmitter } from '@angular/core';
import { Point } from './models/point';
import { RaphaelBase } from './raphael-base';
import { RaphaelService } from './raphael.service';
@Directive({selector: 'raphael-rhombus'})
export class RaphaelRhombusDirective extends RaphaelBase implements OnInit {
@Input()
center: Point;
@Input()
width: number;
@Input()
height: number;
@Input()
fillColors: any;
@Input()
stroke: any;
@Input()
strokeWidth: any;
@Input()
fillOpacity: any;
@Output()
onError = new EventEmitter();
constructor(public elementRef: ElementRef,
raphaelService: RaphaelService) {
super(elementRef, raphaelService);
}
ngOnInit() {
console.log(this.elementRef);
let opts = {'stroke-width': this.strokeWidth, 'fill': this.fillColors, 'stroke': this.stroke, 'fill-opacity': this.fillOpacity};
this.draw(this.center, this.width, this.height, opts);
}
public draw(center: Point, width: number, height: number, opts?: any) {
this.paper.path('M' + center.x + ' ' + (center.y + (height / 2)) +
'L' + (center.x + (width / 2)) + ' ' + (center.y + height) +
'L' + (center.x + width) + ' ' + (center.y + (height / 2)) +
'L' + (center.x + (width / 2)) + ' ' + center.y + 'z'
).attr(opts);
}
}

2
ng2-components/ng2-activiti-analytics/src/models/report.model.ts
View File

@@ -120,7 +120,7 @@ export class ReportQuery {
this.status = obj && obj.status || null;
this.taskName = obj && obj.taskName || null;
this.dateRangeInterval = obj && obj.dateRangeInterval || null;
this.typeFiltering = obj && obj.typeFiltering || false;
this.typeFiltering = obj && obj.typeFiltering || true;
this.slowProcessInstanceInteger = obj && obj.slowProcessInstanceInteger || 0;
this.duration = obj && obj.duration || 0;
this.dateRange = new ReportDateRange(obj);