This repository has been archived on 2023-08-16. You can view files and clone it, but cannot push or open issues or pull requests.
FoodLoop-Web/src/app/dashboard/payroll-log.component.html
2017-09-19 17:22:19 +01:00

49 lines
1.9 KiB
HTML

<div class="animated fadeIn">
<div class="row">
<div class="col-lg-12">
<div class="card">
<div class="card-header">
<strong>Log of Payroll submissions</strong>
<small>Sorted descending from submission date.</small>
</div>
<div *ngIf="!noPayrollList" class="card-block">
<table class="table table-striped table-hover">
<thead>
<tr>
<th>Entry Period</th>
<th>Gross Payroll</th>
<th>Employees</th>
</tr>
</thead>
<tbody>
<tr payroll-result *ngFor="let payroll of payrollList | paginate: paginateConfig" [payroll]="payroll"></tr>
</tbody>
</table>
<pagination-template #p="paginationApi"
[id]="paginateConfig.id"
(pageChange)="loadPayrolls($event)">
<ul class="pagination">
<li class="page-item" [class.disabled]="p.isFirstPage()">
<a class="page-link clickable" *ngIf="!p.isFirstPage()" (click)="p.previous()">Prev</a>
</li>
<li *ngFor="let page of p.pages" class="page-item" [class.active]="p.getCurrent() === page.value">
<a class="page-link clickable" (click)="p.setCurrent(page.value)" *ngIf="p.getCurrent() !== page.value">
<span>{{ page.label }}</span>
</a>
<div class="page-link" *ngIf="p.getCurrent() === page.value">
<span>{{ page.label }}</span>
</div>
</li>
<li class="page-item" [class.disabled]="p.isLastPage()">
<a class="page-link clickable" *ngIf="!p.isLastPage()" (click)="p.next()">Next</a>
</li>
</ul>
</pagination-template>
</div>
<div *ngIf="noPayrollList" class="card-block">
No Payroll data available.
</div>
</div>
</div>
</div>
</div>