agmission/Development/client/src/app/partner-customers/partner-customer-list/partner-customer-list.component.html

52 lines
2.3 KiB
HTML

<div class="ui-g">
<div class="ui-g-12">
<div class="card">
<p-table #dt [value]="partnerCustomers" [columns]="cols" [paginator]="true" [rows]="15" [pageLinks]="5"
[rowsPerPageOptions]="[10, 15, 30]" [alwaysShowPaginator]="true" dataKey="_id" [resetPageOnSort]="false"
stateStorage="session" stateKey="pctb-ops" [responsive]="true" [loading]="loading">
<ng-template pTemplate="caption">
<div class="ui-g ui-g-nopad">
<div class="ui-g-6 ui-g-nopad" style="text-align: left">
<span class="table-caption-1" i18n="@@partnerCustomersTableCaption">Partner Customers</span>
</div>
<div class="ui-g-6 ui-g-nopad" style="text-align: right">
<button pButton type="button" icon="ui-icon-refresh" class="ui-button-secondary"
(click)="reloadCustomers()" pTooltip="Refresh customer list"
i18n-pTooltip="@@refreshCustomerList"></button>
</div>
</div>
</ng-template>
<ng-template pTemplate="header" let-columns>
<tr>
<th *ngFor="let col of columns" [pSortableColumn]="col.field" [width]="col.width">
{{col.header}}
<p-sortIcon [field]="col.field"></p-sortIcon>
</th>
</tr>
<tr>
<th *ngFor="let col of columns">
<input *ngIf="col.filtered" pInputText type="text"
(input)="dt.filter($event.target.value, col.field, col.filterMatchMode)"
[placeholder]="searchPlaceholder + ' ' + col.header" class="ui-column-filter ui-fluid">
</th>
</tr>
</ng-template>
<ng-template pTemplate="body" let-customer let-columns="columns">
<tr>
<td *ngFor="let col of columns">
<span class="ui-column-title">{{col.header}}</span>
<!-- Special handling for package column to show descriptive names -->
<span *ngIf="col.field === 'package'">{{getPackageName(customer.package)}}</span>
<!-- Default display for other columns -->
<span *ngIf="col.field !== 'package'">{{customer[col.field]}}</span>
</td>
</tr>
</ng-template>
</p-table>
</div>
</div>
</div>