
<div  class="col-sm-10 col-md-4 col-lg-4 candidateCard" (mouseover)="over()"
      (mouseleave)="onUnovering()"  >



  <div class="cdt_top_card">
<div (click)="Selected(coach.coachDetails.userInfoMstr.userInfoMstrId)">
    <!--<app-candidate-info [fullName]="coach.coachDetails.userInfoMstr.fullName" [experienceLevel]=" " [jobId]="coach.coachDetails.jobId"> </app-candidate-info>-->
    <a class="IMG">
      {{ Initials(coach.coachDetails.userInfoMstr.fullName) }}
    </a>
    <img  *ngIf="!status" class="coachStatus" src="{{imageUrl}}/assets/img/pgflow/check-green.png"/>
    <img  *ngIf="status" class="coachStatus" src="{{imageUrl}}/assets/img/pgflow/orange-circle.png"/>
    <div class="candidate">
      <h4 class="cursorPointer" >
        {{coach.coachDetails.userInfoMstr.fullName}}
      </h4>
      <h5 class="mstSkill">
        <span *ngFor="let skillM of skillMstrs(coach.coachDetails); let row=index">{{skillM}} <span *ngIf="row+1 !== skillMstrs(coach.coachDetails).length"> ,</span></span> &nbsp;  <span class="exp_level hide"></span>
      </h5>


    <app-skills [skills]="coach.coachDetails.userInfoMstr.pgUserSkillMapping"></app-skills>


  </div>
</div>
  <!--<div class="line"></div>-->
  <div>
  <div class="col-sm-12 col-md-12 col-lg-12 cdt_bottom_card" *ngIf="!status; else statusChange">

    <div class="assignCandidateToCoach">

      <div class="assignHere cursorPointer">

                    <span>
                      <img src="{{imageUrl}}/assets/img/pgflow/coach_icon@2x.png"/>Assign Candidate</span>
      </div>
    </div>

  </div>
    <ng-template #statusChange>

      <div *ngIf="!isRow">
        <!-- stop propagation to card click -->
        <div class="status_change">
          <div name="reject" class="btnWidth _reject" (click)="confirmApprove(coach.coachDetails.userInfoMstr.userInfoMstrId, 'REJECTED')">
            Reject
          </div>

          <div name="approve" class="btnWidth success" (click)="confirmReject(coach.coachDetails.userInfoMstr.userInfoMstrId, 'ACTIVE ')">
            Select
          </div>
        </div>
      </div>

    </ng-template>
  </div>
</div>
</div>
