<div class="container-fluid" >
    <div class="row justify-content-center">
      <div class="col-12">
        <div class="row align-items-center mb-4">
          <div class="col">
            <h2 class="h5 page-title">
              <small class="text-muted text-uppercase">بطاقة انشغالية  عاملين</small>
            </h2>
          </div>
          <div class="col-auto">
            <button
              type="button"
              class="btn mr-1 btn-secondary m-1"
            >
              طباعة
            </button>
            
            <button
            [routerLink]="['/reports/definition',projectId]"    
            type="button" class="btn mr-1 btn-secondary m-1">
            بطاقة التعريف 
                      </button>
            
            <button
            [routerLink]="['/reports/steps-tracks',projectId,'track',trackId]"    
            type="button" class="btn mr-1 btn-secondary m-1">
              تقرير متابعة المراحل
            </button>
            <button *ngIf="project.currentState.toLowerCase()=='completed'" type="button" class="btn mr-1 btn-secondary m-1">
              تقرير انجاز 
            </button>
            <button
              type="button"
              [routerLink]="['/reports/timeline/', project.id]"
              class="btn mr-1 btn-secondary m-1"
            >
              تقرير خطة زمنية
            </button>
          </div>
        </div>
        
        <div class="card shadow" id="pdfContent" *ngIf="project && track && employeesTrack ">
          <div class="card-body p-5">
            <project-header [projectInfo]="project.projectInfo"></project-header>
            <project-subjective [project]="project"> </project-subjective>
            <hr />
            
            <p>
                <strong>
                    قائمة متابعة العاملين لعملية المتابعة التي حدثت بتاريخ {{track.trackInfo.trackDate | date}}
                </strong>
            </p>
            <p>
              <strong>الوضع الراهن : </strong>{{track.trackInfo.statusDescription}}
              <br>
              <strong>وضع عملية المتابعة : </strong>{{track.trackInfo.isCompleted ?  "مكتملة" : "غير مكتملة"}}
              <br>
              <strong>الملاحظات : </strong>{{track.notes}}
              <br>
              
          </p>
          
            <employee-trak-table
            [employeeTrack]="employeesTrack" >

            </employee-trak-table>
            
            <hr>
            
            <project-footer
              [proposer]="project.proposer"
              [executer]="project.executer"
              [projectManager]="project.projectManager"
              [teamLeader]="project.teamLeader"
            >
            </project-footer>
          </div>
          <!-- /.card-body -->
        </div>

        
        <card-skeleton *ngIf="!(project && track && employeesTrack )">

        </card-skeleton>
        
        <!-- /.card -->
      </div>
      <!-- /.col-12 -->
    </div>
  </div>
  