source: Farmatiko/ClientApp/src/app/counter/counter.component.html@ a6bbad1

<app-nav-menu></app-nav-menu>

<mat-tab-group mat-stretch-tabs>
  <mat-tab class="tab" label="Здравствени установи">
  <div class="wrapper">
    <div class="header">
    <h2>Здравствени установи</h2>
  <mat-form-field>
    <input matInput (keyup)="applyFilter($event.target.value)" placeholder="Пронајди установа">
  </mat-form-field>
    </div>    
  <table [dataSource]="dataSource" mat-table matSort class="mat-elevation-z8">
      <ng-container matColumnDef="id">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> id </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.id}} </td>
      </ng-container>

      <ng-container matColumnDef="createdOn">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> createdOn </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.createdOn}} </td>
      </ng-container>
      
      <ng-container matColumnDef="deletedOn">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> deletedOn </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.deletedOn}} </td>
      </ng-container>

      <ng-container matColumnDef="Име">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.name}} </td>
      </ng-container>

      <ng-container matColumnDef="Општина">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Општина </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.municipality}} </td>
      </ng-container>

      <ng-container matColumnDef="Адреса">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Адреса </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.address}} </td>
      </ng-container>

      <ng-container matColumnDef="Тип">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Тип </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.type}} </td>
      </ng-container>

      <ng-container matColumnDef="Е-пошта">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Е-пошта </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.email}} </td>
      </ng-container>

      <ng-container matColumnDef="Телефон">
        <th mat-header-cell *matHeaderCellDef mat-sort-header> Телефон </th>
        <td mat-cell *matCellDef="let facilities"> {{facilities.phone}} </td>
      </ng-container>

        <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
        <tr mat-row *matRowDef="let row; columns: displayedColumns;"></tr>
    </table>
    <mat-paginator #paginator [pageSize]="100" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
  </div>
  </mat-tab>
  <mat-tab class="tab" label="Здравствени работници">
  <div class="wrapper">
    <div class="header">
    <h2>Здравствени работници</h2>
    <mat-form-field>
      <input matInput (keyup)="applyFilterWorkers($event.target.value)" placeholder="Пронајди работник">
    </mat-form-field>
    </div>
      <table [dataSource]="dataSourceWorkers" mat-table matSort class="mat-elevation-z8">
        <ng-container matColumnDef="Име">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> Име </th>
          <td mat-cell *matCellDef="let workers"> {{workers.name}} </td>
        </ng-container>

        <ng-container matColumnDef="Гранка">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> Гранка </th>
          <td mat-cell *matCellDef="let workers"> {{workers.branch}} </td>
        </ng-container>

        <ng-container matColumnDef="Установа">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> Установа </th>
          <td mat-cell *matCellDef="let workers"> {{workers.facility}} </td>
        </ng-container>

        <ng-container matColumnDef="Назив">
          <th mat-header-cell *matHeaderCellDef mat-sort-header> Назив </th>
          <td mat-cell *matCellDef="let workers"> {{workers.title}} </td>
        </ng-container>

          <tr mat-header-row *matHeaderRowDef="displayedColumnsWorkers"></tr>
          <tr mat-row *matRowDef="let row; columns: displayedColumnsWorkers;"></tr>
      </table>
      <mat-paginator #paginator [pageSize]="5" [pageSizeOptions]="[5, 10, 20, 100]"></mat-paginator>
    </div>
    </mat-tab>
  </mat-tab-group>