<div class="form-group container">
<div *ngIf="performanceEvaluation">
<!--<div class="border"></div>-->
<div class="panel panel-default">
<div class="panel-heading"><span>{{performanceEvaluation.consultantFirstName}} {{performanceEvaluation.consultantLastName}}</span></div>
<div class="panel-title"><span>Review Period: </span></div>
<p class="panel-title">{{performanceEvaluation.reviewPeriodStartDate | date: 'dd MMMM yyyy'}} - {{performanceEvaluation.reviewPeriodEndDate | date: 'dd MMMM yyyy'}}</p><br />
<label><span>Career Path: </span></label>
<p>{{performanceEvaluation.careerPathModel.name}}</p>
<label><span>Title: </span></label>
<p>{{performanceEvaluation.titleModel.name}}</p>
<label><span>Manager: </span></label>
<p>{{performanceEvaluation.manager.firstName}} {{performanceEvaluation.manager.lastName}}</p>
<label><span>Reviewer: </span></label>
<p>{{performanceEvaluation.reviewer.firstName}} {{performanceEvaluation.reviewer.lastName}}</p>
<div class="form-group container" *ngIf="performanceEvaluation">
<span class="label label-default">Skill Name</span>
<input type="text" class="form-control" [(ngModel)]="capa.description" placeholder="name" /><br />
<span class="label label-default">Skill Description</span>
<input type="text" class="form-control" [(ngModel)]="capa.description" placeholder="name" /><br />
<span class="label label-default">Reason</span>
<input type="text" class="form-control" [(ngModel)]="capa.reason" placeholder="name" /><br />
<span class="label label-default">Suggested Action</span>
<input type="text" class="form-control" [(ngModel)]="capa.suggestedAction" placeholder="name" /><br />
<span class="label label-default">Date of creation</span>
<text-box class="form-control">{{capa.dateOfCreation | date: 'dd/MM/yyyy'}}</text-box><br />
<span class="label label-default">Status</span>
<text-box class="form-control">{{capa.status.name}}</text-box><br />
<span class="label label-default">Organisational unit</span>
<text-box class="form-control">{{capa.organisationalUnit.name}}, {{capa.organisationalUnit.address}}</text-box><br />
<div class="border"></div>
<div class="panel-heading"><h3><label>Feedbacks for Skills: </label></h3></div>
<div *ngFor="let feedback of performanceEvaluation.peFeedbacks">
<div class="panel panel-default">
<div class="panel-heading"><span>{{feedback.skill.name}}</span></div>
<label><span>Skill Description:</span></label>
<p>{{feedback.skill.description}}</p>
<div><label><span>Grade: </span> </label></div>
<p>{{feedback.grade.description}} - <label>{{feedback.grade.name}}</label></p>
<label><span>Grade Comment:</span></label>
<p>{{feedback.comment}}</p>
<!--<div class="border-gray"></div>-->
<!--<button type="button" class="btn btn-default" *ngIf="!capa.capaDetails" (click)="goToImplementationDetails(capa.id)">Add implementation details</button>
<button type="button" class="btn btn-default" *ngIf="capa.capaDetails" (click)="goToImplementationDetails(capa.id)">View implementation details</button>-->
<!--<td><button type="button" class="btn btn-default" *ngIf="new" (click)="editCapa(capa.id)">Edit Capa</button></td>-->
<!--<button type="button" class="btn btn-default" (click)="goBack()">Back</button>-->
<div *ngIf="performanceEvaluation">
<div class="form-group container">
<div class="border-green"></div><br />
<div class="panel panel-default">
<div class="panel-heading"><span>Areas Of Improvement:</span></div>
<p>{{performanceEvaluation.areasOfImprovement}}</p>
<!--<button type="button" class="btn btn-primary">Primary</button>-->
<div *ngIf="performanceEvaluation">
<div class="form-group container">
<div class="panel panel-default">
<div class="panel-heading"><span>User Comments:</span></div>
<p>{{performanceEvaluation.userComments}}</p>
<div class="border-green"></div>
<!--<button type="button" class="btn btn-primary">Primary</button>-->