open-learning-exchange/planet

<mat-toolbar>
  <button class="btnBack" mat-icon-button routerLink="/manager">
    <mat-icon>arrow_back</mat-icon>
  </button>
  <span i18n>Certifications</span>
  <span class="toolbar-fill"></span>
  <mat-icon>search</mat-icon>
  <mat-form-field class="font-size-1 margin-lr-3">
    <input matInput (keyup)="applyFilter($event.target.value)" [value]="certifications.filter" i18n-placeholder placeholder="Type certification name to search">
  </mat-form-field>
  <button mat-raised-button color="primary" (click)="resetSearch()" [disabled]="certifications.filter === ''" i18n><span>Clear</span></button>
</mat-toolbar>

<div class="space-container">
  <mat-toolbar class="primary-color font-size-1">
    <a i18n mat-mini-fab routerLink="add"><mat-icon>add</mat-icon></a>
  </mat-toolbar>
  <div *ngIf="!emptyData; else notFoundMessage" class="view-container view-full-height view-table">
    <mat-table #table [dataSource]="certifications" matSort [matSortDisableClear]="true">
      <ng-container matColumnDef="name">
        <mat-header-cell i18n *matHeaderCellDef mat-sort-header="name">Certification Name</mat-header-cell>
        <mat-cell *matCellDef="let element">{{element.name}}</mat-cell>
      </ng-container>
      <ng-container matColumnDef="action">
        <mat-header-cell *matHeaderCellDef i18n>Actions</mat-header-cell>
        <mat-cell *matCellDef="let element">
            <a mat-raised-button color="primary" [routerLink]="[ 'update/' + element._id ]" (click)="$event.stopPropagation()" i18n>
              <mat-icon>edit</mat-icon>Edit
            </a>
          <button mat-raised-button color="warn" (click)="$event.stopPropagation(); deleteClick(element)" i18n>
            <mat-icon>delete</mat-icon>Delete
          </button>
        </mat-cell>
      </ng-container>
      <mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
      <mat-row class="cursor-pointer" *matRowDef="let row; columns: displayedColumns;" [routerLink]="[ 'view/' + row._id ]"></mat-row>
    </mat-table>
    <mat-paginator #paginator
      [pageSize]="50"
      [pageSizeOptions]="[5, 10, 20, 50, 100, 200]">
    </mat-paginator>
  </div>
  <ng-template #notFoundMessage>
    <div i18n class="view-container" i18n>No Certifications Found</div>
  </ng-template>
</div>