rsanchez
2017-03-21 a6e1ace2b6bdba8c08a4acfa42433f3ac073b747
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
<td-layout-card-over cardWidth="70">
  <md-toolbar role="toolbar" class="mat-secondary">
    <span class="push-left-sm">
        <span class="md-title" i18n>Applications</span>
    </span>
    <span class="push-left-sm" *ngIf="filteredItems < data.length">
        <span class="md-body-1">{{filteredItems}} of {{data.length}} applications filtered</span>
    </span>
    <td-search-box #searchBox class="push-right-sm" placeholder="Search here" (searchDebounce)="search($event)" flex>
    </td-search-box>
    <button md-mini-fab color="accent" (click)="create()" [mdTooltip]="$L.get('Create a new application')">
        <md-icon>add</md-icon>
      </button>
  </md-toolbar>
     <div flex="84" layout-align="center end" layout="column">
    <td-data-table 
      [data]="filteredData" 
      [columns]="columns" 
      [sortable]="true"
      [sortBy]="sortBy"
      (sortChange)="sort($event)"
      style="width: 100%">
      <template tdDataTableTemplate="creation_timestamp" let-row="row" let-value="value">
         <span>{{value | date: 'medium'}}</span>
      </template>
      <template tdDataTableTemplate="menu" let-row="row" let-index="index">
        <div layout="row" layout-align="end center">
          <button md-icon-button (click)="edit(row.id)" color="primary"><md-icon>edit</md-icon></button>
        </div>
      </template>
    </td-data-table>
    <td-paging-bar #pagingBar [pageSizes]="[10, 20, 40]" [total]="filteredTotal" (change)="page($event)" [hidden]="pagingBar.total <= 10">
      <span td-paging-bar-label hide-xs>Rows per page:</span> {{pagingBar.range}} <span hide-xs>of {{pagingBar.total}}</span>
    </td-paging-bar>
  </div>
</td-layout-card-over>