67 lines
3.8 KiB
HTML
67 lines
3.8 KiB
HTML
<div class="ui-g">
|
|
<div class="ui-g-12">
|
|
<div class="card">
|
|
<p-table #dt [value]="customers" [columns]="cols" selectionMode="single" (onRowSelect)="onRowSelect($event)" [paginator]="true" [rows]="15" [pageLinks]="5" [rowsPerPageOptions]="[10, 15, 30]" [alwaysShowPaginator]="true" [(selection)]="curCust" dataKey="_id" [resetPageOnSort]="false" stateStorage="session" stateKey="ctb-ops" [responsive]="true">
|
|
<ng-template pTemplate="caption">
|
|
<div class="ui-g ui-g-nopad">
|
|
<div class="ui-g-6 cc-field-label">
|
|
<span class="table-caption-1" i18n="@@customerList">Customer List</span>
|
|
</div>
|
|
<div class="ui-g-6 cc-field-label">
|
|
<label style="margin-right: 8px;">Self Signup Accounts {{ isSelfSignup ? 'On' : 'Off' }}</label>
|
|
<p-inputSwitch [(ngModel)]="isSelfSignup" (onChange)="onToggle($event)"></p-inputSwitch>
|
|
</div>
|
|
</div>
|
|
</ng-template>
|
|
<ng-template pTemplate="header" let-columns>
|
|
<tr>
|
|
<th *ngFor="let col of columns" [pSortableColumn]="col.field" [style.width]="col.width">
|
|
{{col.header}}
|
|
<p-sortIcon [field]="col.field"></p-sortIcon>
|
|
</th>
|
|
</tr>
|
|
<tr>
|
|
<th *ngFor="let col of columns" [ngSwitch]="col.filtered" class="ui-fluid">
|
|
<div class="input-with-icon" *ngSwitchCase="true">
|
|
<i class="ui-icon-search"></i>
|
|
<input pInputText type="text" (input)="dt.filter($event.target.value, col.field, col.filterMatchMode)" [value]="dt.filters[col.field]?.value">
|
|
</div>
|
|
<p-dropdown *ngIf="[ACTIVE, BILLABLE].includes(col.field)" [options]="statuses" [style]="{'width':'100%'}" [ngModel]="dt.filters[col.field]?.value" (onChange)="dt.filter($event.value, col.field, 'equals')"></p-dropdown>
|
|
|
|
<p-dropdown *ngIf="col.field === PARTNER_NAME" [options]="partners" [style]="{'width':'100%'}" [ngModel]="dt.filters[col.field]?.value" (onChange)="dt.filter($event.value, col.field, 'equals')"></p-dropdown>
|
|
|
|
<span *ngSwitchDefault></span>
|
|
</th>
|
|
</tr>
|
|
</ng-template>
|
|
|
|
<ng-template pTemplate="body" let-rowData let-columns="columns">
|
|
<tr [pSelectableRow]="rowData">
|
|
<td *ngFor="let col of columns" [ngSwitch]="col.field">
|
|
<span class="ui-column-title">{{col.header}}</span>
|
|
<span *ngSwitchCase="CREATED">{{rowData[col.field] | date:'shortDate'}}</span>
|
|
<span *ngSwitchCase="ACTIVE">
|
|
<p-checkbox [ngModel]="rowData[ACTIVE]" disabled binary="true"></p-checkbox>
|
|
</span>
|
|
<span *ngSwitchCase="BILLABLE">
|
|
<p-checkbox [ngModel]="rowData[BILLABLE]" disabled binary="true"></p-checkbox>
|
|
</span>
|
|
<span *ngSwitchCase="PARTNER">{{rowData[col.field]?.name}}</span>
|
|
<span *ngSwitchDefault>{{rowData[col.field]}}</span>
|
|
</td>
|
|
</tr>
|
|
</ng-template>
|
|
|
|
<ng-template pTemplate="paginatorleft" let-state>
|
|
{{ state.totalRecords | i18nPlural: totalItems }}
|
|
</ng-template>
|
|
</p-table>
|
|
<div class="ui-widget-header ui-helper-clearfix toolbar">
|
|
<button type="button" pButton icon="ui-icon-plus" (click)="newCustomer()" i18n-label="@@new" label="New"></button>
|
|
<button type="button" [disabled]="!canEdit" pButton icon="ui-icon-edit" (click)="editCustomer()" i18n-label="@@detail" label="Detail"></button>
|
|
<button type="button" [disabled]="!canEdit" pButton icon="ui-icon-trash" (click)="deleteCustomer()" i18n-label="@@delete" label="Delete"></button>
|
|
<!-- <button type="button" pButton icon="ui-icon-payment" (click)="billableOverview()" i18n-label="@@billing" label="Billing"></button> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div> |