[ADF-1142] Process instance details - should show the comment componen (#2116)

* Add a comment button in the process details component has we have for the task details

* Update process-instance-details.component.css

* Update process-instance-details.component.html
This commit is contained in:
Maurizio Vitale 2017-07-24 14:35:40 +01:00 committed by Eugenio Romano
parent 3d2e764d3d
commit b8da5bf45b
4 changed files with 39 additions and 0 deletions

View File

@ -8,3 +8,10 @@
overflow: visible;
padding: 10px;
}
.adf-comments-dialog {
position: fixed;
top: 50%;
transform: translate(0, -50%);
width: 40%;
}

View File

@ -5,6 +5,9 @@
[processInstance]="processInstanceDetails"
(showProcessDiagram)="onShowProcessDiagram($event)">
</adf-process-instance-header>
<div class="mdl-cell mdl-cell--4-col">
<button type="button" md-button md-raised-button (click)="showCommentsDialog()">{{'DETAILS.LABELS.COMMENTS'|translate}}</button>
</div>
<div class="mdl-card mdl-shadow--2dp activiti-process-container">
<div class="mdl-cell mdl-cell--12-col">
<adf-process-instance-tasks
@ -16,4 +19,14 @@
<div class="mdl-cell mdl-cell--4-col" data-automation-id="header-status" *ngIf="isRunning()">
<button type="button" (click)="cancelProcess()" class="mdl-button">{{ 'DETAILS.BUTTON.CANCEL' | translate }}</button>
</div>
<dialog class="mdl-dialog adf-comments-dialog" #dialogComments>
<div class="mdl-dialog__content">
<adf-process-instance-comments #activiticomments
[readOnly]="!isRunning()"
[processInstanceId]="processInstanceDetails.id">
</adf-process-instance-comments>
<br><br>
<button type="button" md-button md-raised-button (click)="closeCommentsDialog()">{{ 'DETAILS.BUTTON.CLOSE' | translate }}</button>
</div>
</dialog>
</div>

View File

@ -25,6 +25,8 @@ import { ProcessService } from './../services/process.service';
import { ProcessInstanceHeaderComponent } from './process-instance-header.component';
import { ProcessInstanceTasksComponent } from './process-instance-tasks.component';
declare let dialogPolyfill: any;
@Component({
selector: 'adf-process-instance-details, activiti-process-instance-details',
templateUrl: './process-instance-details.component.html',
@ -41,6 +43,9 @@ export class ProcessInstanceDetailsComponent implements OnChanges {
@ViewChild(ProcessInstanceTasksComponent)
tasksList: ProcessInstanceTasksComponent;
@ViewChild('dialogComments')
commentsDialog: any;
@Input()
showTitle: boolean = true;
@ -104,6 +109,19 @@ export class ProcessInstanceDetailsComponent implements OnChanges {
}
}
public showCommentsDialog(): void {
if (!this.commentsDialog.nativeElement.showModal) {
dialogPolyfill.registerDialog(this.commentsDialog.nativeElement);
}
this.commentsDialog.nativeElement.showModal();
}
public closeCommentsDialog(): void {
if (this.commentsDialog) {
this.commentsDialog.nativeElement.close();
}
}
isRunning(): boolean {
return this.processInstanceDetails && !this.processInstanceDetails.ended;
}

View File

@ -25,6 +25,7 @@
},
"BUTTON": {
"CANCEL": "Cancel Process",
"CLOSE": "Close",
"SHOW_DIAGRAM": "Show Diagram",
"DRAG-ATTACHMENT": "Drop Files Here...",
"UPLOAD-ATTACHMENT": "Upload Attachment"