102 lines
3.9 KiB
HTML
102 lines
3.9 KiB
HTML
<h2>Incentives</h2>
|
|
|
|
<form class="flex-col" [formRoot]="form">
|
|
<div class="row-container">
|
|
<mat-form-field class="flex-auto">
|
|
<mat-label>Date</mat-label>
|
|
<input
|
|
matInput
|
|
#dateElement
|
|
[matDatepicker]="date"
|
|
(focus)="dateElement.select()"
|
|
[formField]="form.date"
|
|
autocomplete="off"
|
|
/>
|
|
<mat-datepicker-toggle matSuffix [for]="date"></mat-datepicker-toggle>
|
|
<mat-datepicker #date></mat-datepicker>
|
|
</mat-form-field>
|
|
</div>
|
|
<div class="row-container">
|
|
Total Incentive: <strong>{{ voucher().incentive | number: '1.2-2' }}</strong> Total Points:
|
|
<strong>{{ totalPoints() | number: '1.2-2' }}</strong> Point Value:
|
|
<strong>{{ pointValue() | number: '1.2-2' }}</strong>
|
|
</div>
|
|
<mat-table #table [dataSource]="model().incentives">
|
|
<!-- Name Column -->
|
|
<ng-container matColumnDef="name">
|
|
<mat-header-cell *matHeaderCellDef>Name</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.name }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Designation Column -->
|
|
<ng-container matColumnDef="designation">
|
|
<mat-header-cell *matHeaderCellDef>Designation</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.designation }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Department Column -->
|
|
<ng-container matColumnDef="department">
|
|
<mat-header-cell *matHeaderCellDef>Department</mat-header-cell>
|
|
<mat-cell *matCellDef="let row">{{ row.department }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- DaysWorked Column -->
|
|
<ng-container matColumnDef="daysWorked">
|
|
<mat-header-cell *matHeaderCellDef class="right">DaysWorked</mat-header-cell>
|
|
<mat-cell *matCellDef="let row" class="right">{{ row.daysWorked | number: '1.2-2' }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Points Column -->
|
|
<ng-container matColumnDef="points">
|
|
<mat-header-cell *matHeaderCellDef class="center">Service Points</mat-header-cell>
|
|
<mat-cell *matCellDef="let row; let i = index" class="center">
|
|
@if (form.incentives[i]) {
|
|
<mat-form-field class="flex-auto">
|
|
<button mat-icon-button color="warn" matPrefix (click)="less(i)">
|
|
<mat-icon>remove</mat-icon>
|
|
</button>
|
|
<input
|
|
type="number"
|
|
matInput
|
|
[formField]="form.incentives[i].points"
|
|
autocomplete="off"
|
|
class="flex-auto"
|
|
/>
|
|
<button mat-icon-button color="primary" matSuffix (click)="more(i)">
|
|
<mat-icon>add</mat-icon>
|
|
</button>
|
|
</mat-form-field>
|
|
}
|
|
</mat-cell>
|
|
</ng-container>
|
|
|
|
<!-- Amount Column -->
|
|
<ng-container matColumnDef="amount">
|
|
<mat-header-cell *matHeaderCellDef class="right">Amount</mat-header-cell>
|
|
<mat-cell *matCellDef="let row; let i = index" class="right">{{ amount(row, i) | currency: 'INR' }}</mat-cell>
|
|
</ng-container>
|
|
|
|
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
|
|
<mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>
|
|
</mat-table>
|
|
</form>
|
|
|
|
<div class="row-container">
|
|
<button mat-raised-button color="primary" (click)="save()" [disabled]="!canSave()">
|
|
{{ voucher().id ? 'Update' : 'Save' }}
|
|
</button>
|
|
@if (voucher().id) {
|
|
<button mat-raised-button (click)="post()" [disabled]="voucher().posted || !auth.allowed('post-vouchers')">
|
|
{{ voucher().posted ? 'Posted' : 'Post' }}
|
|
</button>
|
|
<button mat-raised-button color="warn" (click)="confirmDelete()" [disabled]="!canSave()">Delete</button>
|
|
}
|
|
</div>
|
|
@if (voucher().id) {
|
|
<div class="row-container">
|
|
Created on <strong>{{ voucher().creationDate | localTime }}</strong> and Last Edited on
|
|
<strong>{{ voucher().lastEditDate | localTime }}</strong> by <strong>{{ voucher().user.name }}</strong
|
|
>. {{ voucher().poster ? 'Posted by ' + voucher().poster : '' }}
|
|
</div>
|
|
}
|