95 lines
3.3 KiB
HTML
95 lines
3.3 KiB
HTML
<!--
|
|
Copyright since 2025 Mifos Initiative
|
|
|
|
This Source Code Form is subject to the terms of the Mozilla Public
|
|
License, v. 2.0. If a copy of the MPL was not distributed with this
|
|
file, You can obtain one at http://mozilla.org/MPL/2.0/.
|
|
-->
|
|
|
|
<div class="layout-row-wrap gap-2px responsive-column">
|
|
@if (!approvalEditMode) {
|
|
<mat-form-field class="flex-48">
|
|
<mat-label>{{ 'labels.inputs.Charge' | translate }}</mat-label>
|
|
<mat-select #charge>
|
|
@for (charge of chargeData | chargesFilter: chargesDataSource : currencyCode.value; track charge) {
|
|
<mat-option [value]="charge">
|
|
{{ charge.name }}
|
|
</mat-option>
|
|
}
|
|
</mat-select>
|
|
</mat-form-field>
|
|
|
|
<div class="flex-48 align-center">
|
|
<button type="button" mat-raised-button color="primary" (click)="addCharge(charge)" [disabled]="!charge.value">
|
|
<fa-icon icon="plus" class="m-r-10"></fa-icon>
|
|
{{ 'labels.buttons.Add' | translate }}
|
|
</button>
|
|
</div>
|
|
}
|
|
|
|
<table
|
|
class="flex-98 mat-elevation-z1"
|
|
mat-table
|
|
[dataSource]="chargesDataSource"
|
|
[hidden]="chargesDataSource.length === 0"
|
|
>
|
|
<ng-container matColumnDef="name">
|
|
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.name' | translate }}</th>
|
|
<td mat-cell *matCellDef="let charge">
|
|
{{ charge.name + ', ' + charge.currency.displaySymbol }}
|
|
</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="chargeCalculationType">
|
|
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Type' | translate }}</th>
|
|
<td mat-cell *matCellDef="let charge">
|
|
{{ charge.chargeCalculationType.value | translateKey: 'catalogs' }}
|
|
</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="amount">
|
|
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Amount' | translate }}</th>
|
|
<td mat-cell *matCellDef="let charge">
|
|
{{ charge.amount || charge.amountOrPercentage }}
|
|
@if (!approvalEditMode) {
|
|
<button mat-icon-button color="primary" (click)="editCharge(charge)">
|
|
<fa-icon icon="pen"></fa-icon>
|
|
</button>
|
|
}
|
|
</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="chargeTimeType">
|
|
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Collected On' | translate }}</th>
|
|
<td mat-cell *matCellDef="let charge">
|
|
{{ charge.chargeTimeType.value | translateKey: 'catalogs' }}
|
|
</td>
|
|
</ng-container>
|
|
|
|
<ng-container matColumnDef="action">
|
|
<th mat-header-cell *matHeaderCellDef>{{ 'labels.inputs.Actions' | translate }}</th>
|
|
<td mat-cell *matCellDef="let charge">
|
|
@if (!approvalEditMode) {
|
|
<button mat-icon-button color="warn" (click)="deleteCharge(charge)">
|
|
<fa-icon icon="trash"></fa-icon>
|
|
</button>
|
|
}
|
|
</td>
|
|
</ng-container>
|
|
|
|
<tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
|
|
<tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
|
|
</table>
|
|
</div>
|
|
|
|
<div class="layout-row responsive-column align-center gap-2px margin-t">
|
|
<button mat-raised-button matStepperPrevious>
|
|
<fa-icon icon="arrow-left" class="m-r-10"></fa-icon>
|
|
{{ 'labels.buttons.Previous' | translate }}
|
|
</button>
|
|
<button mat-raised-button matStepperNext>
|
|
{{ 'labels.buttons.Next' | translate }}
|
|
<fa-icon icon="arrow-right" class="m-l-10"></fa-icon>
|
|
</button>
|
|
</div>
|