<div *ngIf="!processInstanceDetails">{{ 'DETAILS.MESSAGES.NONE'|translate }}</div>
<div *ngIf="processInstanceDetails">
    <h2 class="mdl-card__title-text">{{processInstanceDetails.name}}</h2>
    <activiti-process-instance-header [processInstance]="processInstanceDetails" (processCancelled)="processCancelled()" #activitiprocessheader></activiti-process-instance-header>
    <div class="mdl-grid">
        <div class="mdl-cell mdl-cell--8-col">
            <activiti-process-instance-tasks [processInstanceId]="processInstanceDetails.id" (taskFormCompleted)="taskFormCompleted()" #activitiprocesstasks></activiti-process-instance-tasks>
        </div>
        <div class="mdl-cell mdl-cell--4-col">
            <activiti-process-instance-comments [processInstanceId]="processInstanceDetails.id" #activitiprocesscomments></activiti-process-instance-comments>
        </div>
    </div>
</div>
