56 lines
2.4 KiB
HTML
56 lines
2.4 KiB
HTML
@if (settleOptionsResource.isLoading()) {
|
|
<app-skeleton-loader type="card" [count]="1" />
|
|
} @else if (settleOptionsResource.error()) {
|
|
<app-error-state (retryAction)="settleOptionsResource.reload()" />
|
|
} @else {
|
|
<h2 mat-dialog-title>Receive Payment</h2>
|
|
<mat-dialog-content>
|
|
<form class="flex-col">
|
|
<mat-table
|
|
#table
|
|
[dataSource]="formModel().amounts"
|
|
[trackBy]="trackByRow"
|
|
[style.visibility]="displayTable() ? 'visible' : 'hidden'"
|
|
>
|
|
<!-- Name Column -->
|
|
<ng-container matColumnDef="name">
|
|
<mat-header-cell *matHeaderCellDef class="bold">Amount</mat-header-cell>
|
|
<mat-cell *matCellDef="let row; let i = index" (click)="maxAmount(row, i)">{{ row.name }}</mat-cell>
|
|
<mat-footer-cell *matFooterCellDef class="bold">Balance</mat-footer-cell>
|
|
</ng-container>
|
|
<!-- Amount Column -->
|
|
<ng-container matColumnDef="amount">
|
|
<mat-header-cell *matHeaderCellDef class="center bold" class="flex-auto">{{
|
|
data.amount | currency: 'INR'
|
|
}}</mat-header-cell>
|
|
<mat-cell *matCellDef="let row; let i = index" class="center flex-auto">
|
|
<mat-form-field>
|
|
<input matInput type="number" [formField]="form.amounts[i].amount" autocomplete="off" />
|
|
</mat-form-field>
|
|
</mat-cell>
|
|
<mat-footer-cell *matFooterCellDef class="bold">{{ balance() | currency: 'INR' }}</mat-footer-cell>
|
|
</ng-container>
|
|
<mat-header-row *matHeaderRowDef="displayedColumns"></mat-header-row>
|
|
<mat-row *matRowDef="let row; columns: displayedColumns"></mat-row>
|
|
<mat-footer-row *matFooterRowDef="displayedColumns"></mat-footer-row>
|
|
</mat-table>
|
|
<mat-form-field class="flex-auto" [style.visibility]="displayReason() ? 'visible' : 'hidden'">
|
|
<mat-label>Reason</mat-label>
|
|
<input
|
|
type="text"
|
|
matInput
|
|
#son
|
|
[formField]="form.son"
|
|
autocomplete="off"
|
|
(focus)="select(son.value) && son.select()"
|
|
(input)="select(son.value)"
|
|
/>
|
|
</mat-form-field>
|
|
</form>
|
|
</mat-dialog-content>
|
|
<mat-dialog-actions align="end">
|
|
<button mat-button [mat-dialog-close]>Cancel</button>
|
|
<button type="button" mat-button (click)="accept()" color="primary" [disabled]="!!balance()">Ok</button>
|
|
</mat-dialog-actions>
|
|
}
|