You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
mohemm_srca/Mohem/src/app/profile/performance-evaluation/performance-evaluation.comp...

77 lines
2.1 KiB
HTML

<ion-content class="colorBG">
<div class="header-div">
<ion-buttons slot="start">
<ion-back-button color="light" class="btnBack" defaultHref="/home"></ion-back-button>
</ion-buttons>
<p class="proTitles">{{ts.trPK('userProfile','performance')}}</p>
<div class="profilediv" (click)="openPersonalInfo()">
<img class="profileImg" [src]="user_image">
</div>
<!-- <ion-img class="profileImg" [src]="imageSrc"></ion-img> -->
<ion-grid>
<div class="grid">
<ion-row>
<p class="Text">Performance Evaluation</p>
<div class="gauge">
<ngx-charts-gauge [view]="view" [scheme]="colorScheme" [results]="performanceData" [min]="0" [max]="100"
[angleSpan]="240" [startAngle]="-120" [bigSegments]="5"
[smallSegments]="10" (select)="onSelect($event)">
</ngx-charts-gauge>
</div>
</ion-row>
</div>
<!-- <div>
<div *ngFor="let data of performanceData">
<ion-row class="gridvalue">
<ion-col >
<div class="performancecolor" [style.background]="data.color"></div>
<br>
<label class="label"> Your Performance In </label>
<label class="labelvalue"> {{data.value}} </label>
<label class="label"> {{data.name}} </label>
</ion-col>
</ion-row>
</div>
</div> -->
<!-- class="gridvalue" -->
<!-- ///// -->
<div>
<div *ngIf="performanceData">
<div >
<ion-row >
<ion-col *ngFor="let data of performanceData ;let i = index" [ngClass]="length % 2 != 0 && i == length - 1 ? 'rightgrid' : 'leftgrid'" >
<div class="performancecolor" [style.background]="data.color"></div>
<br>
<label class="label"> Your Performance In </label>
<label class="label"> {{data.name}} </label>
<br>
<label class="labelvalue"> {{data.value}} </label>
<label class="percentage"> %</label>
</ion-col>
</ion-row>
</div>
</div>
</div>
</ion-grid>
</div>
</ion-content>