
<div  class="col-sm-10 col-md-4 col-lg-4 candidateCard" *ngIf="candidate.recommendedCourse.length !== 0">


  <div class="cdt_top_card"  (click)="eventChange(candidate.userDetails.userInfoMstr.userInfoMstrId)">

    <app-candidate-info [fullName]="candidate.userDetails.fullName" [experienceLevel]="candidate.userDetails.resExperienceLevel" [jobId]="candidate.userDetails.jobId"> </app-candidate-info>

    <app-skills [skills]="candidate.userDetails.userInfoMstr.pgUserSkillMapping"></app-skills>


  </div>

  <!--<div class="line"></div>-->


  <div class="col-sm-12 col-md-12 col-lg-12 cdt_bottom_card" (click)="eventChange(candidate.userDetails.userInfoMstr.userInfoMstrId)">


    <div class="col-sm-12 col-md-12 col-lg-12 padd_0 tests">

      <div *ngFor="let course of candidate.recommendedCourse; let rowCount = index;" style="    border-bottom: 1px dashed #ccc;height: 56px;padding-top: 6px;">

        <div class="row" *ngIf="course.type == 'course'">
          <div class=" col-lg-1"></div>
          <div class=" col-lg-1 courseCount">{{rowCount + 1}}</div>
          <div class="col-lg-8"> <h3 class="courseDtls">  {{course.pgCourseDetails.courseName}}</h3>
          </div>
          <div class="col-lg-2">
            <img *ngIf="course.courseStatus == 'COURSE_ASSIGNED' " src="{{imageUrl}}/assets/img/pgflow/coach_unassigned.png">
            <img *ngIf="course.courseStatus != 'COURSE_ASSIGNED' " src="{{imageUrl}}/assets/img/pgflow/coach_assigned.png">
          </div>
        </div>

        <div class="row" *ngIf="course.type == 'assessment'">
          <div class=" col-lg-1"></div>
          <div class=" col-lg-1 courseCount">{{rowCount + 1}}
            <span><img class="assessmentFlag" src="{{imageUrl}}/assets/img/pgflow/Group3.png" alt="F" /></span>

          </div>
          <div class="col-lg-8"> <h3 class="courseDtls">  {{course.pgSkillTrackMstr.description}}</h3>
          </div>
          <div class="col-lg-2">
            <img src="{{imageUrl}}/assets/img/pgflow/coach_assigned.png">
          </div>
        </div>


      </div>


    </div>






  </div>

</div>

<!--<button id="openModalButton" [hidden]="true" data-toggle="modal" data-target="#assignModal"></button>
&lt;!&ndash; Modal &ndash;&gt;
<div id="assignModal" class="modal fade skill-modal" role="dialog">
  <div class="modal-dialog admin-modal-dialog">

    &lt;!&ndash; Modal content&ndash;&gt;
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" id="" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Assign Coach</h4>
      </div>

      <div>
        <h3>Assign coach is UI works!</h3>
      </div>

    </div>

  </div>
</div>-->
