Upgrade to Angular 16

Merge `angular-update-16` into `dev` branch
This commit is contained in:
Adam Saghy
2025-05-23 18:47:20 +02:00
parent c7c2f60182
commit 19a14e5b5b
882 changed files with 14895 additions and 14340 deletions
@@ -1,15 +1,15 @@
<div class="container p-b-20">
<h3>{{ 'labels.heading.Loan Details' | translate }}</h3>
<div fxLayout="row wrap" fxLayout.lt-md="column">
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Repayment Strategy' | translate }}</span>
<span fxFlex="50%">{{ loanDetails.transactionProcessingStrategyName | translateKey: 'catalogs' }}</span>
<div class="responsive-column">
<div class="flex-fill layout-row">
<span class="flex-50">{{ 'labels.inputs.Repayment Strategy' | translate }}</span>
<span class="flex-50">{{ loanDetails.transactionProcessingStrategyName | translateKey: 'catalogs' }}</span>
</div>
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Repayments' | translate }}</span>
<span fxFlex="50%"
<div class="flex-fill layout-row">
<span class="flex-50">{{ 'labels.inputs.Repayments' | translate }}</span>
<span class="flex-50"
>{{ loanDetails.numberOfRepayments }} every {{ loanDetails.repaymentEvery }}&nbsp;{{
loanDetails.repaymentFrequencyType.value | translateKey: 'catalogs'
}}
@@ -32,31 +32,31 @@
</span>
</div>
<div fxFlexFill *ngIf="loanDetails.fixedLength">
<span fxFlex="50%"> {{ 'labels.inputs.Fixed Length' | translate }} </span>
<span fxFlex="50%">
<div class="flex-fill layout-row" *ngIf="loanDetails.fixedLength">
<span class="flex-50"> {{ 'labels.inputs.Fixed Length' | translate }} </span>
<span class="flex-50">
{{ loanDetails.fixedLength }} {{ loanDetails.repaymentFrequencyType.value | translateKey: 'catalogs' }}</span
>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Amortization' | translate }} </span>
<span fxFlex="50%"> {{ loanDetails.amortizationType.value | translateKey: 'catalogs' }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Amortization' | translate }} </span>
<span class="flex-50"> {{ loanDetails.amortizationType.value | translateKey: 'catalogs' }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.fixedPrincipalPercentagePerInstallment">
<span fxFlex="50%"> {{ 'labels.inputs.Principal Percentage Per Installment' | translate }} </span>
<span fxFlex="50%"> {{ loanDetails.fixedPrincipalPercentagePerInstallment | formatNumber }} %</span>
<div class="flex-fill layout-row" *ngIf="loanDetails.fixedPrincipalPercentagePerInstallment">
<span class="flex-50"> {{ 'labels.inputs.Principal Percentage Per Installment' | translate }} </span>
<span class="flex-50"> {{ loanDetails.fixedPrincipalPercentagePerInstallment | formatNumber }} %</span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Equal Amortization' | translate }} </span>
<span fxFlex="50%"> {{ loanDetails.isEqualAmortization | yesNo }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Equal Amortization' | translate }} </span>
<span class="flex-50"> {{ loanDetails.isEqualAmortization | yesNo }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Interest' | translate }} </span>
<span fxFlex="50%">
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Interest' | translate }} </span>
<span class="flex-50">
{{ loanDetails.annualInterestRate | formatNumber }} % {{ 'labels.text.per annum' | translate }} ({{
loanDetails.interestRatePerPeriod
}}
@@ -64,189 +64,191 @@
</span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Interest Type' | translate }} </span>
<span fxFlex="50%"> {{ 'labels.text.' + loanDetails.interestType.value | translate }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Interest Type' | translate }} </span>
<span class="flex-50"> {{ 'labels.text.' + loanDetails.interestType.value | translate }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Enable Down Payments' | translate }}:</span>
<span fxFlex="50%">{{ loanDetails.enableDownPayment | yesNo }}</span>
<div class="flex-fill layout-row">
<span class="flex-50">{{ 'labels.inputs.Enable Down Payments' | translate }}:</span>
<span class="flex-50">{{ loanDetails.enableDownPayment | yesNo }}</span>
</div>
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Loan Charge-off behaviour' | translate }}:</span>
<span fxFlex="50%">{{ loanDetails.chargeOffBehaviour.value | translateKey: 'catalogs' }}</span>
<div class="flex-fill layout-row">
<span class="flex-50">{{ 'labels.inputs.Loan Charge-off behaviour' | translate }}:</span>
<span class="flex-50">{{ loanDetails.chargeOffBehaviour.value | translateKey: 'catalogs' }}</span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Enable income capitalization' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.enableIncomeCapitalization | yesNo }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Enable income capitalization' | translate }}</span>
<span class="flex-50"> {{ loanDetails.enableIncomeCapitalization | yesNo }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.enableIncomeCapitalization">
<span fxFlex="50%"> {{ 'labels.inputs.Income capitalization calculation type' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.capitalizedIncomeCalculationType?.value | translateKey: 'catalogs' }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.enableIncomeCapitalization">
<span class="flex-50"> {{ 'labels.inputs.Income capitalization calculation type' | translate }}</span>
<span class="flex-50">
{{ loanDetails.capitalizedIncomeCalculationType?.value | translateKey: 'catalogs' }}
</span>
</div>
<div fxFlexFill *ngIf="loanDetails.enableIncomeCapitalization">
<span fxFlex="50%"> {{ 'labels.inputs.Income capitalization strategy' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.capitalizedIncomeStrategy?.value | translateKey: 'catalogs' }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.enableIncomeCapitalization">
<span class="flex-50"> {{ 'labels.inputs.Income capitalization strategy' | translate }}</span>
<span class="flex-50"> {{ loanDetails.capitalizedIncomeStrategy?.value | translateKey: 'catalogs' }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.enableIncomeCapitalization">
<span fxFlex="50%"> {{ 'labels.inputs.Income capitalization type' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.capitalizedIncomeType?.value | translateKey: 'catalogs' }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.enableIncomeCapitalization">
<span class="flex-50"> {{ 'labels.inputs.Income capitalization type' | translate }}</span>
<span class="flex-50"> {{ loanDetails.capitalizedIncomeType?.value | translateKey: 'catalogs' }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Grace: On Principal Payment' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.graceOnPrincipalPayment }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Grace: On Principal Payment' | translate }}</span>
<span class="flex-50"> {{ loanDetails.graceOnPrincipalPayment }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Grace: On Interest Payment' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.graceOnInterestPayment }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Grace: On Interest Payment' | translate }}</span>
<span class="flex-50"> {{ loanDetails.graceOnInterestPayment }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Grace on Arrears Ageing' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.graceOnArrearsAgeing }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Grace on Arrears Ageing' | translate }}</span>
<span class="flex-50"> {{ loanDetails.graceOnArrearsAgeing }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Enable installment level Delinquency' | translate }} </span>
<span fxFlex="50%"> {{ loanDetails.enableInstallmentLevelDelinquency | yesNo }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Enable installment level Delinquency' | translate }} </span>
<span class="flex-50"> {{ loanDetails.enableInstallmentLevelDelinquency | yesNo }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Fund Source' | translate }} </span>
<span fxFlex="50%" *ngIf="loanDetails.fundName"> {{ loanDetails.fundName }} </span>
<span fxFlex="50%" *ngIf="!loanDetails.fundName"> {{ 'labels.inputs.Unassigned' | translate }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Fund Source' | translate }} </span>
<span class="flex-50" *ngIf="loanDetails.fundName"> {{ loanDetails.fundName }} </span>
<span class="flex-50" *ngIf="!loanDetails.fundName"> {{ 'labels.inputs.Unassigned' | translate }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Interest Free Period' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.graceOnInterestCharged }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Interest Free Period' | translate }}</span>
<span class="flex-50"> {{ loanDetails.graceOnInterestCharged }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Interest Calculation Period' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.interestCalculationPeriodType.value | translateKey: 'catalogs' }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Interest Calculation Period' | translate }}</span>
<span class="flex-50"> {{ loanDetails.interestCalculationPeriodType.value | translateKey: 'catalogs' }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%">
<div class="flex-fill layout-row">
<span class="flex-50">
{{ 'labels.inputs.Allow Partial Interest Calculation with same as repayment' | translate }}</span
>
<span fxFlex="50%"> {{ loanDetails.allowPartialPeriodInterestCalculation | yesNo }} </span>
<span class="flex-50"> {{ loanDetails.allowPartialPeriodInterestCalculation | yesNo }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Is interest recognition on disbursement date?' | translate }}:</span>
<span fxFlex="50%">{{ loanDetails.interestRecognitionOnDisbursementDate | yesNo }}</span>
<div class="flex-fill layout-row">
<span class="flex-50">{{ 'labels.inputs.Is interest recognition on disbursement date?' | translate }}:</span>
<span class="flex-50">{{ loanDetails.interestRecognitionOnDisbursementDate | yesNo }}</span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Submitted on' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.timeline.submittedOnDate | dateFormat }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Submitted on' | translate }}</span>
<span class="flex-50"> {{ loanDetails.timeline.submittedOnDate | dateFormat }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Approved on' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.timeline.approvedOnDate | dateFormat }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Approved on' | translate }}</span>
<span class="flex-50"> {{ loanDetails.timeline.approvedOnDate | dateFormat }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Disbursed on' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.timeline.actualDisbursementDate | dateFormat }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Disbursed on' | translate }}</span>
<span class="flex-50"> {{ loanDetails.timeline.actualDisbursementDate | dateFormat }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Matures on' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.timeline.expectedMaturityDate | dateFormat }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Matures on' | translate }}</span>
<span class="flex-50"> {{ loanDetails.timeline.expectedMaturityDate | dateFormat }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.canDefineInstallmentAmount">
<span fxFlex="50%"> {{ 'labels.inputs.Fixed EMI amount' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.fixedEmiAmount | formatNumber }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.canDefineInstallmentAmount">
<span class="flex-50"> {{ 'labels.inputs.Fixed EMI amount' | translate }}</span>
<span class="flex-50"> {{ loanDetails.fixedEmiAmount | formatNumber }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.isTopup">
<span fxFlex="50%"> {{ 'labels.inputs.Is Topup Loan' | translate }}?</span>
<span fxFlex="50%"> {{ loanDetails.isTopup | yesNo }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.isTopup">
<span class="flex-50"> {{ 'labels.inputs.Is Topup Loan' | translate }}?</span>
<span class="flex-50"> {{ loanDetails.isTopup | yesNo }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.isTopup">
<span fxFlex="50%"> {{ 'labels.inputs.Loan closed with Topup' | translate }} </span>
<span fxFlex="50%">
<div class="flex-fill layout-row" *ngIf="loanDetails.isTopup">
<span class="flex-50"> {{ 'labels.inputs.Loan closed with Topup' | translate }} </span>
<span class="flex-50">
<a href="#">{{ loanDetails.closureLoanAccountNo }}</a>
</span>
</div>
<div fxFlexFill *ngIf="loanDetails.isTopup">
<span fxFlex="50%"> {{ 'labels.inputs.Topup closure amount' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.topupAmount | formatNumber }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.isTopup">
<span class="flex-50"> {{ 'labels.inputs.Topup closure amount' | translate }}</span>
<span class="flex-50"> {{ loanDetails.topupAmount | formatNumber }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Recalculate Interest based on new terms' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.isInterestRecalculationEnabled | yesNo }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Recalculate Interest based on new terms' | translate }}</span>
<span class="flex-50"> {{ loanDetails.isInterestRecalculationEnabled | yesNo }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Days in year' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.daysInYearType.value | translateKey: 'catalogs' }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Days in year' | translate }}</span>
<span class="flex-50"> {{ loanDetails.daysInYearType.value | translateKey: 'catalogs' }} </span>
</div>
<div fxFlexFill>
<span fxFlex="50%"> {{ 'labels.inputs.Days in month' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.daysInMonthType.value | translateKey: 'catalogs' }} </span>
<div class="flex-fill layout-row">
<span class="flex-50"> {{ 'labels.inputs.Days in month' | translate }}</span>
<span class="flex-50"> {{ loanDetails.daysInMonthType.value | translateKey: 'catalogs' }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.isInterestRecalculationEnabled">
<span fxFlex="50%"> {{ 'labels.inputs.Interest recalculation compounding on' | translate }}</span>
<span fxFlex="50%">
<div class="flex-fill layout-row" *ngIf="loanDetails.isInterestRecalculationEnabled">
<span class="flex-50"> {{ 'labels.inputs.Interest recalculation compounding on' | translate }}</span>
<span class="flex-50">
{{
loanDetails.interestRecalculationData.interestRecalculationCompoundingType.value | translateKey: 'catalogs'
}}
</span>
</div>
<div fxFlexFill *ngIf="loanDetails.isInterestRecalculationEnabled">
<span fxFlex="50%"> {{ 'labels.inputs.Advance payments adjustment type' | translate }}</span>
<span fxFlex="50%">
<div class="flex-fill layout-row" *ngIf="loanDetails.isInterestRecalculationEnabled">
<span class="flex-50"> {{ 'labels.inputs.Advance payments adjustment type' | translate }}</span>
<span class="flex-50">
{{ loanDetails.interestRecalculationData.rescheduleStrategyType.value | translateKey: 'catalogs' }}
</span>
</div>
<div fxFlexFill *ngIf="loanDetails.isInterestRecalculationEnabled">
<span fxFlex="50%"> {{ 'labels.inputs.Frequency for recalculate Outstanding Principal' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.interestRecalculationData.calendarData.humanReadable }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.isInterestRecalculationEnabled">
<span class="flex-50"> {{ 'labels.inputs.Frequency for recalculate Outstanding Principal' | translate }}</span>
<span class="flex-50"> {{ loanDetails.interestRecalculationData.calendarData.humanReadable }} </span>
</div>
<div
fxFlexFill
class="flex-fill layout-row"
*ngIf="
loanDetails.isInterestRecalculationEnabled &&
loanDetails.interestRecalculationData.interestRecalculationCompoundingType.id !== 0
"
>
<span fxFlex="50%"> {{ 'labels.inputs.Frequency for compounding' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.interestRecalculationData.compoundingCalendarData.humanReadable }} </span>
<span class="flex-50"> {{ 'labels.inputs.Frequency for compounding' | translate }}</span>
<span class="flex-50"> {{ loanDetails.interestRecalculationData.compoundingCalendarData.humanReadable }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.isVariableInstallmentsAllowed">
<span fxFlex="50%"> {{ 'labels.inputs.Variable Installments Allowed' | translate }}</span>
<span fxFlex="50%"> {{ loanDetails.isVariableInstallmentsAllowed | yesNo }} </span>
<div class="flex-fill layout-row" *ngIf="loanDetails.isVariableInstallmentsAllowed">
<span class="flex-50"> {{ 'labels.inputs.Variable Installments Allowed' | translate }}</span>
<span class="flex-50"> {{ loanDetails.isVariableInstallmentsAllowed | yesNo }} </span>
</div>
<div fxFlexFill *ngIf="loanDetails.isVariableInstallmentsAllowed">
<span fxFlex="50%"> {{ 'labels.inputs.Gap between Installments' | translate }}</span>
<span fxFlex="50%">
<div class="flex-fill layout-row" *ngIf="loanDetails.isVariableInstallmentsAllowed">
<span class="flex-50"> {{ 'labels.inputs.Gap between Installments' | translate }}</span>
<span class="flex-50">
{{ loanDetails.minimumGap | formatNumber }}&nbsp;{{ 'labels.text.Days' | translate }}&nbsp;, Max:{{
loanDetails.maximumGap | formatNumber
}}&nbsp;{{ 'labels.text.Days' | translate }})
}}&nbsp;{{ 'labels.text.Days' | translate }}
</span>
</div>
</div>
@@ -1,23 +1,23 @@
<div class="tab-container mat-typography">
<div fxFlexFill *ngIf="existActiveTransfer">
<div class="flex-fill" *ngIf="existActiveTransfer">
<h3>{{ 'labels.heading.Active Asset Transfer' | translate }}</h3>
<div fxLayout="row" fxLayoutGap="32px" class="asset-transfer-container">
<div class="layout-row gap-32px asset-transfer-container">
<table>
<tbody>
<tr>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Status' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
<div [ngClass]="itemStatus(activeTransferData.status)">
<fa-icon icon="stop"></fa-icon>
<span class="m-l-10 external-asset-owner-status">{{ activeTransferData.status }}</span>
</div>
</td>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Owner External Id' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
<mifosx-external-identifier
externalId="{{ activeTransferData.owner.externalId }}"
completed="true"
@@ -25,71 +25,71 @@
</td>
</tr>
<tr>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Settlement Date' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
{{ activeTransferData.settlementDate | dateFormat }}
</td>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Effective Date' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
{{ activeTransferData.effectiveFrom | dateFormat }}
</td>
</tr>
<tr>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Details' | translate }} :</b>
</td>
<td fxFlex="75%" class="left">
<td class="flex-75 left">
<table>
<tbody>
<tr>
<td fxFlex="50%">
<td class="flex-50">
<b>{{ 'labels.inputs.Principal Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">
<td class="flex-50 r-amount">
{{ activeTransferData.details.totalPrincipalOutstanding | formatNumber }}
</td>
</tr>
<tr>
<td fxFlex="50%">
<td class="flex-50">
<b>{{ 'labels.inputs.Interest Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">
<td class="flex-50 r-amount">
{{ activeTransferData.details.totalInterestOutstanding | formatNumber }}
</td>
</tr>
<tr>
<td fxFlex="50%">
<td class="flex-50">
<b>{{ 'labels.inputs.Fees Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">
<td class="flex-50 r-amount">
{{ activeTransferData.details.totalFeeChargesOutstanding | formatNumber }}
</td>
</tr>
<tr>
<td fxFlex="50%">
<td class="flex-50">
<b>{{ 'labels.inputs.Penalties Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">
<td class="flex-50 r-amount">
{{ activeTransferData.details.totalPenaltyChargesOutstanding | formatNumber }}
</td>
</tr>
<tr>
<td fxFlex="50%">
<td class="flex-50">
<b>{{ 'labels.inputs.Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">
<td class="flex-50 r-amount">
{{ activeTransferData.details.totalOutstanding | formatNumber }}
</td>
</tr>
<tr>
<td fxFlex="50%">
<td class="flex-50">
<b>{{ 'labels.inputs.Overpaid' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">{{ activeTransferData.details.totalOverpaid | formatNumber }}</td>
<td class="flex-50 r-amount">{{ activeTransferData.details.totalOverpaid | formatNumber }}</td>
</tr>
</tbody>
</table>
@@ -100,16 +100,16 @@
</div>
</div>
<div fxLayout="row" fxLayoutAlign="start center">
<h3 fxFlex="90%">{{ 'labels.heading.External Asset Owner' | translate }}</h3>
<div class="layout-row align-start-center">
<h3 class="flex-90">{{ 'labels.heading.External Asset Owner' | translate }}</h3>
<div fxFlex="10%" *ngIf="canBeSold()">
<div class="flex-10" *ngIf="canBeSold()">
<button mat-raised-button class="f-right" color="primary" (click)="saleLoan()" *mifosxHasPermission="'SALE_LOAN'">
<fa-icon icon="dollar-sign" class="m-r-10"></fa-icon>{{ 'labels.buttons.Sell Loan' | translate }}
</button>
</div>
<div fxFlex="10%" *ngIf="canBeCancelled()">
<div class="flex-10" *ngIf="canBeCancelled()">
<button
mat-raised-button
class="f-right"
@@ -121,7 +121,7 @@
</button>
</div>
<div fxFlex="10%" *ngIf="canBeBuyed()">
<div class="flex-10" *ngIf="canBeBuyed()">
<button
mat-raised-button
class="f-right"
@@ -1,19 +1,19 @@
<table>
<tbody>
<tr>
<td fxFlex="25%" class="m-l-5">
<td class="m-l-5 flex-25">
<b>{{ 'labels.inputs.Status' | translate }} :</b>
</td>
<td fxFlex="25%" class="m-l-5 left">
<td class="flex-25 m-l-5 left">
<div [ngClass]="itemStatus(transferData.status)">
<fa-icon icon="stop"></fa-icon>
<span class="m-l-5 status">{{ transferData.status }}</span>
</div>
</td>
<td fxFlex="25%" class="m-l-5">
<td class="m-l-5 flex-25">
<b>{{ 'labels.inputs.Owner External Id' | translate }} :</b>
</td>
<td fxFlex="25%" class="m-l-5 left">
<td class="flex-25 m-l-5 left">
<mifosx-external-identifier
externalId="{{ transferData.owner.externalId }}"
completed="true"
@@ -21,65 +21,65 @@
</td>
</tr>
<tr>
<td fxFlex="25%" class="m-l-5">
<td class="m-l-5 flex-25">
<b>{{ 'labels.inputs.Settlement Date' | translate }} :</b>
</td>
<td fxFlex="25%" class="m-l-5">
<td class="m-l-5 flex-25">
{{ transferData.settlementDate | dateFormat }}
</td>
<td fxFlex="25%" class="m-l-5">
<td class="m-l-5 flex-25">
<b>{{ 'labels.inputs.Effective Date' | translate }} :</b>
</td>
<td fxFlex="25%" class="m-l-5">
<td class="m-l-5 flex-25">
{{ transferData.effectiveFrom | dateFormat }}
</td>
</tr>
<tr>
<td fxFlex="25%" class="m-l-5">
<td class="m-l-5 flex-25">
<b>{{ 'labels.inputs.Details' | translate }} :</b>
</td>
<td fxFlex="75%" class="left">
<td class="flex-75 left">
<table>
<tbody>
<tr>
<td fxFlex="50%" class="m-l-5">
<td class="flex-50 m-l-5">
<b>{{ 'labels.inputs.Principal Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">{{ transferData.details.totalPrincipalOutstanding | formatNumber }}</td>
<td class="flex-50 r-amount">{{ transferData.details.totalPrincipalOutstanding | formatNumber }}</td>
</tr>
<tr>
<td fxFlex="50%" class="m-l-5">
<td class="flex-50 m-l-5">
<b>{{ 'labels.inputs.Interest Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">{{ transferData.details.totalInterestOutstanding | formatNumber }}</td>
<td class="flex-50 r-amount">{{ transferData.details.totalInterestOutstanding | formatNumber }}</td>
</tr>
<tr>
<td fxFlex="50%" class="m-l-5">
<td class="flex-50 m-l-5">
<b>{{ 'labels.inputs.Fees Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">
<td class="flex-50 r-amount">
{{ transferData.details.totalFeeChargesOutstanding | formatNumber }}
</td>
</tr>
<tr>
<td fxFlex="50%" class="m-l-5">
<td class="flex-50 m-l-5">
<b>{{ 'labels.inputs.Penalties Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">
<td class="flex-50 r-amount">
{{ transferData.details.totalPenaltyChargesOutstanding | formatNumber }}
</td>
</tr>
<tr>
<td fxFlex="50%" class="m-l-5">
<td class="flex-50 m-l-5">
<b>{{ 'labels.inputs.Outstanding' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">{{ transferData.details.totalOutstanding | formatNumber }}</td>
<td class="flex-50 r-amount">{{ transferData.details.totalOutstanding | formatNumber }}</td>
</tr>
<tr>
<td fxFlex="50%" class="m-l-5">
<td class="flex-50 m-l-5">
<b>{{ 'labels.inputs.Overpaid' | translate }} :</b>
</td>
<td fxFlex="50%" class="r-amount">{{ transferData.details.totalOverpaid | formatNumber }}</td>
<td class="flex-50 r-amount">{{ transferData.details.totalOverpaid | formatNumber }}</td>
</tr>
</tbody>
</table>
@@ -1,20 +1,20 @@
<div class="tab-container mat-typography">
<ng-container *ngIf="loanDetails.summary">
<h3>{{ 'labels.heading.Performance History' | translate }}</h3>
<div fxLayout="row" fxLayoutGap="32px" class="performance-history-container">
<div class="layout-row gap-32px performance-history-container">
<table>
<tbody>
<tr>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Number of Repayments' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
{{ loanDetails?.numberOfRepayments | formatNumber }}
</td>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Maturity Date' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
{{ loanDetails?.timeline.expectedMaturityDate | dateFormat }}
</td>
</tr>
@@ -192,46 +192,46 @@
<div *ngIf="!loanDetails.summary">
<h3>{{ 'labels.heading.Loan Purpose' | translate }}</h3>
<div class="container">
<div fxLayout="row wrap" fxLayout.lt-md="column">
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Loan Purpose' | translate }}:</span>
<span fxFlex="50%" *ngIf="loanDetails.loanPurposeName">
<div class="layout-row-wrap responsive-column">
<div class="flex-contents">
<span class="flex-50">{{ 'labels.inputs.Loan Purpose' | translate }}:</span>
<span class="flex-50" *ngIf="loanDetails.loanPurposeName">
{{ loanDetails.loanPurposeName }}
</span>
<span fxFlex="50%" *ngIf="!loanDetails.loanPurposeName">
<span class="flex-50" *ngIf="!loanDetails.loanPurposeName">
{{ 'labels.inputs.Not Provided' | translate }}
</span>
</div>
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Proposed Amount' | translate }}:</span>
<span fxFlex="50%">{{
<div class="flex-contents">
<span class="flex-50">{{ 'labels.inputs.Proposed Amount' | translate }}:</span>
<span class="flex-50">{{
loanDetails.proposedPrincipal | currency: currencyCode : 'symbol-narrow' : '1.2-2'
}}</span>
</div>
<div fxFlexFill *ngIf="showApprovedAmountBasedOnStatus()">
<span fxFlex="50%">{{ 'labels.inputs.Approved Amount' | translate }}:</span>
<span fxFlex="50%">{{
<div class="flex-contents" *ngIf="showApprovedAmountBasedOnStatus()">
<span class="flex-50">{{ 'labels.inputs.Approved Amount' | translate }}:</span>
<span class="flex-50">{{
loanDetails.approvedPrincipal | currency: currencyCode : 'symbol-narrow' : '1.2-2'
}}</span>
</div>
<div fxFlexFill *ngIf="showDisbursedAmountBasedOnStatus()">
<span fxFlex="50%">{{ 'labels.inputs.Disburse Amount' | translate }}:</span>
<span fxFlex="50%">{{ loanDetails.principal | currency: currencyCode : 'symbol-narrow' : '1.2-2' }}</span>
<div class="flex-contents" *ngIf="showDisbursedAmountBasedOnStatus()">
<span class="flex-50">{{ 'labels.inputs.Disburse Amount' | translate }}:</span>
<span class="flex-50">{{ loanDetails.principal | currency: currencyCode : 'symbol-narrow' : '1.2-2' }}</span>
</div>
<div fxFlexFill *ngIf="loanDetails.balloonRepaymentAmount > 0">
<span fxFlex="50%">{{ 'labels.inputs.Balloon Repayment Amount' | translate }}:</span>
<span fxFlex="50%">{{
<div class="flex-contents" *ngIf="loanDetails.balloonRepaymentAmount > 0">
<span class="flex-50">{{ 'labels.inputs.Balloon Repayment Amount' | translate }}:</span>
<span class="flex-50">{{
loanDetails.balloonRepaymentAmount | currency: currencyCode : 'symbol-narrow' : '1.2-2'
}}</span>
</div>
<div fxFlexFill>
<span fxFlex="50%">{{ 'labels.inputs.Arrears By' | translate }}:</span>
<span fxFlex="50%">{{ 'labels.inputs.Not Provided' | translate }}</span>
<div class="flex-contents">
<span class="flex-50">{{ 'labels.inputs.Arrears By' | translate }}:</span>
<span class="flex-50">{{ 'labels.inputs.Not Provided' | translate }}</span>
</div>
</div>
</div>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="collateralForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field>
<mat-label>{{ 'labels.inputs.Collateral Type' | translate }}</mat-label>
<mat-select required formControlName="collateralTypeId">
@@ -31,7 +31,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../loan-collateral']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -1,11 +1,11 @@
<div class="container mat-elevation-z8">
<mat-card>
<div class="m-b-20" fxLayout="column" *ngIf="maturityDate">
<div class="m-b-20 layout-column" *ngIf="maturityDate">
<span class="m-r-10">{{ 'Maturity Date' | translateKey: 'inputs' }} : {{ maturityDate | dateFormat }}</span>
</div>
<form [formGroup]="interestPauseLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="startDatePicker.open()">
<mat-label>{{ 'labels.inputs.Start Date' | translate }}</mat-label>
<input
@@ -41,7 +41,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="loanChargeForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field>
<mat-label>{{ 'labels.inputs.Charge' | translate }}</mat-label>
<mat-select required formControlName="chargeId">
@@ -54,7 +54,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center">
<mat-card-actions class="layout-row layout-xs-column layout-align-center gap-5px">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,11 +2,11 @@
<mat-card>
<form [formGroup]="adjustLoanChargeForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field appearance="fill">
<mat-label>{{ 'labels.inputs.Amount' | translate }}</mat-label>
<span matTextSuffix class="m-l-10">{{ loanDetailsData.currency.code }}</span>
<span fxFlex="auto"></span>
<span class="flex-auto"></span>
<input type="number" matInput required class="right-input" formControlName="amount" />
<mat-error *ngIf="adjustLoanChargeForm.controls.amount.hasError('required')">
{{ 'labels.inputs.Amount' | translate }} {{ 'labels.commons.is' | translate }}
@@ -28,8 +28,8 @@
</mat-select>
</mat-form-field>
<div fxFlexFill>
<span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
<div class="flex-fill">
<span class="expandcollapsebutton m-l-10 m-t-40 flex-75" (click)="addPaymentDetails()">
<mat-slide-toggle>
<div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
<span class="m-l-10">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
@@ -71,7 +71,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../..']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="approveLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="approvedDatePicker.open()">
<mat-label>{{ 'labels.inputs.Approved On' | translate }}</mat-label>
<input
@@ -55,7 +55,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="saleLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="settlementDatePicker.open()">
<mat-label>{{ 'labels.inputs.Settlement Date' | translate }}</mat-label>
<input
@@ -45,7 +45,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="assignOfficerForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field>
<mat-label> {{ 'labels.inputs.To Loan Officer' | translate }}</mat-label>
<mat-select required formControlName="toLoanOfficerId">
@@ -35,7 +35,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="chargeoffLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="transactionDatePicker.open()">
<mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
<input
@@ -45,7 +45,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="closeLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="closedDatePicker.open()">
<mat-label>{{ 'labels.inputs.Closed On' | translate }}</mat-label>
<input
@@ -27,7 +27,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,13 +2,13 @@
<mat-card>
<form [formGroup]="newGuarantorForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-checkbox labelPosition="before" formControlName="existingClient">
{{ 'labels.inputs.Existing Client' | translate }}
</mat-checkbox>
<ng-container *ngIf="!showClientDetailsForm">
<mat-form-field fxFlex="30%">
<mat-form-field class="flex-30">
<mat-label>{{ 'labels.inputs.name' | translate }}</mat-label>
<input matInput formControlName="name" [matAutocomplete]="clientsAutocomplete" />
<mat-error *ngIf="newGuarantorForm.controls.name.hasError('required')">
@@ -121,7 +121,7 @@
</ng-container>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="disbursementForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="disbursementDatePicker.open()">
<mat-label>{{ 'labels.inputs.Disbursement On' | translate }}</mat-label>
<input
@@ -40,7 +40,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="disbursementLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="actualDisbursementDatePicker.open()">
<mat-label>{{ 'labels.inputs.Disbursed On' | translate }}</mat-label>
<input
@@ -43,8 +43,8 @@
</mat-select>
</mat-form-field>
<div fxFlexFill>
<span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
<div class="flex-fill">
<span class="expandcollapsebutton m-l-10 m-t-40 flex-75" (click)="addPaymentDetails()">
<mat-slide-toggle>
<div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
<span class="m-l-10">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
@@ -86,7 +86,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -1,17 +1,17 @@
<div class="container mat-elevation-z8">
<mat-card>
<mat-card-content>
<div fxLayout="column" class="m-b-10">
<div class="m-b-10 layout-column">
<mifosx-repayment-schedule-tab
*ngIf="repaymentScheduleDetails"
fxFlex="100%"
class="flex-100"
[repaymentScheduleDetails]="repaymentScheduleDetails"
[forEditing]="true"
>
</mifosx-repayment-schedule-tab>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="foreclosureForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="transactionsDatePicker.open()">
<mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
<input
@@ -52,7 +52,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="creditBalanceLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="transactionDatePicker.open()">
<mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
<input
@@ -40,7 +40,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="reagingLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field>
<mat-label>{{ 'labels.inputs.Number of Installments' | translate }}</mat-label>
<input type="number" matInput required formControlName="numberOfInstallments" />
@@ -51,7 +51,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,21 +2,21 @@
<mat-card>
<form [formGroup]="reamortizeLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field>
<mat-label>{{ 'labels.inputs.Reason' | translate }}</mat-label>
<input matInput formControlName="note" />
</mat-form-field>
</div>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field>
<mat-label>{{ 'labels.inputs.External Id' | translate }}</mat-label>
<input matInput formControlName="externalId" />
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="rescheduleLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="rescheduleDatePicker.open()">
<mat-label>{{ 'labels.inputs.Reschedule from Installment On' | translate }}</mat-label>
<input
@@ -111,7 +111,7 @@
</ng-container>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -3,7 +3,7 @@
<form [formGroup]="loanScreenReportForm" (ngSubmit)="generate()">
<mat-card-content>
<div>
<mat-form-field fxFlex>
<mat-form-field class="flex-fill">
<mat-label>{{ 'labels.inputs.Loan Screen Reports' | translate }}</mat-label>
<mat-select formControlName="templateId">
<mat-option *ngFor="let template of templatesData" [value]="template.id">
@@ -17,7 +17,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -31,8 +31,8 @@
</div>
<div #output class="container">
<mat-card fxLayout="column" fxLayoutGap="3%">
<div fxLayoutAlign="end">
<mat-card class="layout-column gap-3percent">
<div class="layout-align-end">
<button mat-stroked-button color="primary" [disabled]="!template" (click)="print()">
<fa-icon icon="file" class="m-r-10"></fa-icon>
{{ 'labels.buttons.Print' | translate }}
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="closeLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="closedDatePicker.open()">
<mat-label>{{ 'labels.inputs.Closed On' | translate }}</mat-label>
<input
@@ -27,7 +27,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="repaymentLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="transactionDatePicker.open()">
<mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
<input
@@ -21,36 +21,36 @@
</mat-error>
</mat-form-field>
<div fxLayout="row wrap" class="content" *ngIf="showDetails()">
<div fxFlex="50%" class="mat-body-strong">
<div class="layout-row-wrap" *ngIf="showDetails()">
<div class="flex-50 mat-body-strong">
{{ 'Principal' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ dataObject.principalPortion | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Interest' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ dataObject.interestPortion | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Fees' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ dataObject.feeChargesPortion | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Penalties' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ dataObject.penaltyChargesPortion | formatNumber }}
</div>
</div>
@@ -77,8 +77,8 @@
</mat-select>
</mat-form-field>
<div fxFlexFill>
<span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
<div class="flex-fill">
<span class="expandcollapsebutton m-l-10 m-t-40 flex-75" (click)="addPaymentDetails()">
<mat-slide-toggle>
<div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
<span class="m-l-10">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
@@ -120,7 +120,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="prepayLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="transactionDatePicker.open()">
<mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
<input
@@ -21,36 +21,36 @@
</mat-error>
</mat-form-field>
<div fxLayout="row wrap" class="content">
<div fxFlex="50%" class="mat-body-strong">
<div class="layout-row-wrap">
<div class="flex-50 mat-body-strong">
{{ 'Principal' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ prepayData.principalPortion | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Interest' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ prepayData.interestPortion | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Fees' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ prepayData.feeChargesPortion | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Penalties' | translate }}
</div>
<div fxFlex="50%" class="r-amount right-label">
<div class="flex-50 r-amount right-label">
{{ prepayData.penaltyChargesPortion | formatNumber }}
</div>
</div>
@@ -77,8 +77,8 @@
</mat-select>
</mat-form-field>
<div fxFlexFill>
<span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
<div class="flex-fill">
<span class="expandcollapsebutton m-l-10 m-t-40 flex-75" (click)="addPaymentDetails()">
<mat-slide-toggle>
<div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
<span class="m-l-10">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
@@ -120,7 +120,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="recoveryRepaymentLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="transactionDatePicker.open()">
<mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
<input
@@ -43,8 +43,8 @@
</mat-select>
</mat-form-field>
<div fxFlexFill>
<span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
<div class="flex-fill">
<span class="expandcollapsebutton m-l-10 m-t-40 flex-75" (click)="addPaymentDetails()">
<mat-slide-toggle>
<div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
<span class="m-l-10">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
@@ -86,7 +86,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="rejectLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="rejectedDatePicker.open()">
<mat-label>{{ 'labels.inputs.Rejected On' | translate }}</mat-label>
<input
@@ -27,7 +27,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -1,13 +1,13 @@
<div class="container mat-elevation-z8">
<mat-card>
<mat-card-content>
<div fxLayout="column">
<mat-form-field fxFlex>
<div class="layout-column">
<mat-form-field class="flex-fill">
<mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
<textarea matInput [formControl]="note"></textarea>
</mat-form-field>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -1,14 +1,14 @@
<div class="container mat-elevation-z8">
<mat-card>
<mat-card-content>
<div fxLayout="column">
<mat-form-field fxFlex>
<div class="layout-column">
<mat-form-field class="flex-fill">
<mat-label>{{ 'labels.inputs.Note' | translate }}</mat-label>
<textarea matInput required [formControl]="note" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -1,7 +1,7 @@
<div class="container mat-elevation-z8">
<mat-card>
<div class="view-guarantors-account-tables" fxLayout="row" fxLayoutGap="2%">
<div fxFlex="49%">
<div class="view-guarantors-account-tables layout-row gap-2percent">
<div class="flex-49">
<table>
<tbody>
<tr>
@@ -37,7 +37,7 @@
</table>
</div>
<div fxFlex="49%">
<div class="flex-49">
<table>
<tbody>
<tr>
@@ -71,16 +71,16 @@
</div>
</div>
<div fxFlexFill *ngIf="guarantorDetails" fxLayout="row wrap" fxLayout.lt-md="column">
<div *ngIf="guarantorDetails" class="layout-row-wrap responsive-column flex-fill">
<!-- guarantors details table -->
<div class="heading-content">
<div fxLayout="column" fxFlex="50%">
<div class="layout-column flex-50">
<div class="heading-name">
<h3>{{ 'labels.heading.Guarantors Details' | translate }}</h3>
</div>
</div>
<div fxLayout="column" fxFlex="50%">
<div fxLayout="row" fxLayoutAlign="flex-end">
<div class="layout-column flex-50">
<div class="layout-row align-flex-end">
<button mat-raised-button class="f-right" color="primary" (click)="toggleGuarantorsDetailsOverview()">
{{ showDeletedGuarantorsAccounts ? 'Hide Deleted Guarantors' : 'Show Deleted Guarantors' }}
</button>
@@ -89,7 +89,7 @@
</div>
<table
fxFlexFill
class="flex-fill"
mat-table
[dataSource]="guarantorDetails | accountsFilter: 'guarantor' : showDeletedGuarantorsAccounts"
>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="loanInterestForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="interestDatePicker.open()">
<mat-label>{{ 'labels.inputs.Interest waived on' | translate }}</mat-label>
<input
@@ -35,7 +35,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<form [formGroup]="withdrawnByClientLoanForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="withdrawnOnDatePicker.open()">
<mat-label>{{ 'labels.inputs.Withdrawn On' | translate }}</mat-label>
<input
@@ -27,7 +27,7 @@
</mat-form-field>
</div>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -2,7 +2,7 @@
<mat-card>
<mat-card-content>
<form [formGroup]="writeOffForm">
<div fxLayout="column">
<div class="layout-column">
<mat-form-field (click)="writeOffDatePicker.open()">
<mat-label>{{ 'labels.inputs.Write off on' | translate }}</mat-label>
<input
@@ -33,7 +33,7 @@
</div>
</form>
<mat-card-actions fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5px">
<mat-card-actions class="layout-row align-center gap-5px responsive-column">
<button type="button" mat-raised-button [routerLink]="['../../general']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -1,27 +1,27 @@
<div class="tab-container mat-typography">
<div fxLayout="row" fxLayoutAlign="start center">
<h3 fxFlex="90%">{{ 'labels.inputs.Loan Collateral Details' | translate }}</h3>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px" class="action-buttons">
<div class="layout-row align-start-center">
<h3 class="flex-90">{{ 'labels.inputs.Loan Collateral Details' | translate }}</h3>
<div class="layout-row gap-20px align-end align-items-center action-buttons">
<button mat-raised-button color="primary" [routerLink]="['../actions/Add Collateral']">
{{ 'labels.buttons.Add Collateral' | translate }}
</button>
</div>
</div>
<div fxLayout="row" fxLayoutGap="32px" *ngIf="loanCollaterals?.length > 0" class="performance-history-container">
<div class="layout-row gap-32px performance-history-container" *ngIf="loanCollaterals?.length > 0">
<table>
<tbody>
<tr>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Number of Collaterals' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
{{ loanCollaterals?.length | formatNumber }}
</td>
<td fxFlex="25%">
<td class="flex-25">
<b>{{ 'labels.inputs.Total Amount' | translate }} :</b>
</td>
<td fxFlex="25%" class="left">
<td class="flex-25 left">
{{ totalAmount | formatNumber }}
</td>
</tr>
@@ -61,7 +61,7 @@
</table>
</div>
<div fxLayout="row" fxLayoutAlign="flex-end" class="m-t-20 m-b-10" *ngIf="allowPause">
<div class="layout-row m-t-20 m-b-10 align-end align-items-center" *ngIf="allowPause">
<button
mat-raised-button
color="primary"
@@ -1,12 +1,12 @@
<div class="container">
<div fxFlexFill>
<span fxFlex="40%">{{ 'labels.inputs.Maximum allowed outstanding balance' | translate }}:</span>
<span fxFlex="60%">{{ loanDetails.maxOutstandingLoanBalance | formatNumber }}</span>
<div class="flex-fill">
<span class="flex-40">{{ 'labels.inputs.Maximum allowed outstanding balance' | translate }}:</span>
<span class="flex-60">{{ loanDetails.maxOutstandingLoanBalance | formatNumber }}</span>
</div>
<h3>{{ 'labels.heading.Loan Tranche Details' | translate }}</h3>
<div fxLayout="row" class="margin-t" fxLayout.xs="column" fxLayoutAlign="flex-end" fxLayoutGap="2%">
<div class="layout-row margin-t layout-xs-column layout-align-end gap-2percent">
<button mat-raised-button color="primary" *ngIf="showAddTrancheButtons()" (click)="addDisbursementDataEntry()">
<fa-icon icon="plus" class="m-r-10"></fa-icon>{{ 'labels.buttons.Add' | translate }}
</button>
@@ -1,5 +1,5 @@
<mat-card class="account-card">
<mat-card-header fxLayout="column" class="header">
<mat-card-header class="header layout-column">
<mat-card-title-group class="header-title-group">
<div class="profile-image-container">
<div>
@@ -16,8 +16,8 @@
<div class="mat-typography account-card-title">
<mat-card-title>
<div fxLayout="row" fxLayout.lt-md="column">
<div fxFlex="60%">
<div class="layout-row responsive-column">
<div class="flex-60">
<h3>
<i
class="fa fa-stop"
@@ -72,7 +72,7 @@
</div>
</div>
<div *ngIf="loanDetailsData.summary" class="loans-overview mat-typography" fxFlex="40%">
<div *ngIf="loanDetailsData.summary" class="loans-overview mat-typography flex-30">
<h3>{{ 'labels.heading.Account Overview' | translate }}</h3>
<table class="account-overview">
<tbody>
@@ -107,9 +107,7 @@
</table>
</div>
<span fxFlex="auto"></span>
<div fxFlex="4%">
<div class="flex-5">
<button
mat-icon-button
[matMenuTriggerFor]="accountMenu"
@@ -162,7 +160,7 @@
</mat-card-header>
<mat-card-content>
<nav mat-tab-nav-bar class="navigation-tabs">
<nav mat-tab-nav-bar class="navigation-tabs" [tabPanel]="tabPanel">
<a
mat-tab-link
[routerLink]="['./general']"
@@ -354,7 +352,8 @@
</a>
</ng-container>
</nav>
<router-outlet></router-outlet>
<mat-tab-nav-panel #tabPanel>
<router-outlet></router-outlet>
</mat-tab-nav-panel>
</mat-card-content>
</mat-card>
@@ -1,5 +1,5 @@
<div class="container">
<div fxLayout="row" class="m-t-20" fxLayoutAlign="end center" *ngIf="!forEditing">
<div class="layout-row m-t-20 align-end align-items-center" *ngIf="!forEditing">
<button mat-raised-button color="primary" (click)="exportToPDF()">
<fa-icon icon="download" class="m-r-10"></fa-icon>Export to PDF
</button>
@@ -7,19 +7,19 @@
<table mat-table [dataSource]="repaymentScheduleDetails.periods" *ngIf="!forEditing" id="repaymentSchedule">
<ng-container matColumnDef="number">
<th mat-header-cell class="center" *matHeaderCellDef>#</th>
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef>#</th>
<td mat-cell class="right" *matCellDef="let item">{{ item.period }}</td>
<td mat-footer-cell *matFooterCellDef>&nbsp;</td>
</ng-container>
<ng-container matColumnDef="days">
<th mat-header-cell class="center" *matHeaderCellDef>{{ 'labels.inputs.Days' | translate }}</th>
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Days' | translate }}</th>
<td mat-cell class="center" *matCellDef="let item" [ngClass]="installmentStyle(item)">{{ item.daysInPeriod }}</td>
<td mat-footer-cell class="center" *matFooterCellDef><b> Total</b></td>
</ng-container>
<ng-container matColumnDef="date">
<th mat-header-cell class="center" *matHeaderCellDef>{{ 'labels.inputs.Date' | translate }}</th>
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Date' | translate }}</th>
<td mat-cell class="m-r-5" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.dueDate | dateFormat }}
</td>
@@ -27,7 +27,9 @@
</ng-container>
<ng-container matColumnDef="paiddate">
<th mat-header-cell class="center" *matHeaderCellDef>{{ 'labels.inputs.Paid Date' | translate }}</th>
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Paid Date' | translate }}
</th>
<td mat-cell class="center" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.obligationsMetOnDate | dateFormat }}
</td>
@@ -43,7 +45,9 @@
</ng-container>
<ng-container matColumnDef="balanceOfLoan">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Balance Of Loan' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Balance Of Loan' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.principalLoanBalanceOutstanding | formatNumber }}
</td>
@@ -51,7 +55,9 @@
</ng-container>
<ng-container matColumnDef="principalDue">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Principal Due' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Principal Due' | translate }}
</th>
<td mat-cell class="check r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.principalDue | formatNumber }}
</td>
@@ -63,7 +69,9 @@
</ng-container>
<ng-container matColumnDef="interest">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Interest' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Interest' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.interestOriginalDue | formatNumber }}
</td>
@@ -75,7 +83,7 @@
</ng-container>
<ng-container matColumnDef="fees">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Fees' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Fees' | translate }}</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.feeChargesDue | formatNumber }}
</td>
@@ -87,7 +95,9 @@
</ng-container>
<ng-container matColumnDef="penalties">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Penalties' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Penalties' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.penaltyChargesDue | formatNumber }}
</td>
@@ -99,7 +109,7 @@
</ng-container>
<ng-container matColumnDef="due">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Due' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Due' | translate }}</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.totalDueForPeriod | formatNumber }}
</td>
@@ -111,7 +121,7 @@
</ng-container>
<ng-container matColumnDef="paid">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Paid' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Paid' | translate }}</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.totalPaidForPeriod | formatNumber }}
</td>
@@ -121,7 +131,9 @@
</ng-container>
<ng-container matColumnDef="inadvance">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.In advance' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.In advance' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.totalPaidInAdvanceForPeriod | formatNumber }}
</td>
@@ -131,7 +143,7 @@
</ng-container>
<ng-container matColumnDef="late">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Late' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Late' | translate }}</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.totalPaidLateForPeriod | formatNumber }}
</td>
@@ -142,7 +154,9 @@
<ng-container *ngIf="isWaived">
<ng-container matColumnDef="waived">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Waived' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Waived' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item" [ngClass]="installmentStyle(item)">
{{ item.totalWaivedForPeriod | formatNumber }}
</td>
@@ -161,7 +175,9 @@
</ng-container>
<ng-container matColumnDef="outstanding">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Outstanding' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Outstanding' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item">{{ item.totalOutstandingForPeriod | formatNumber }}</td>
<td mat-footer-cell class="r-amount" *matFooterCellDef>
<b> {{ repaymentScheduleDetails.totalOutstanding | currency: currencyCode : 'symbol-narrow' : '1.2-2' }} </b>
@@ -173,19 +189,19 @@
</ng-container>
<ng-container matColumnDef="header-amount">
<th mat-header-cell class="center" *matHeaderCellDef [attr.colspan]="2">
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef [attr.colspan]="2">
{{ 'labels.inputs.Loan Amount and Balance' | translate }}
</th>
</ng-container>
<ng-container matColumnDef="header-total-cost">
<th mat-header-cell class="center" *matHeaderCellDef [attr.colspan]="3">
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef [attr.colspan]="3">
{{ 'labels.inputs.Total Cost of Loan' | translate }}
</th>
</ng-container>
<ng-container matColumnDef="header-installment-totals">
<th mat-header-cell class="center" *matHeaderCellDef [attr.colspan]="6">
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef [attr.colspan]="6">
{{ 'labels.inputs.Installment Totals' | translate }}
</th>
</ng-container>
@@ -204,14 +220,15 @@
mat-table
[dataSource]="repaymentScheduleDetails.periods"
*ngIf="forEditing && repaymentScheduleDetails.periods.length > 0"
id="repaymentScheduleEdit"
>
<ng-container matColumnDef="number">
<th mat-header-cell class="center" *matHeaderCellDef>#</th>
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef>#</th>
<td mat-cell *matCellDef="let item">{{ item.period }}</td>
</ng-container>
<ng-container matColumnDef="date">
<th mat-header-cell class="center" *matHeaderCellDef>{{ 'labels.inputs.Date' | translate }}</th>
<th mat-header-cell class="center mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Date' | translate }}</th>
<td mat-cell class="m-r-10" *matCellDef="let item">
<ng-container>
{{ item.dueDate | dateFormat }}
@@ -220,14 +237,18 @@
</ng-container>
<ng-container matColumnDef="balanceOfLoan">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Balance Of Loan' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Balance Of Loan' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item">
{{ item.principalLoanBalanceOutstanding | formatNumber }}
</td>
</ng-container>
<ng-container matColumnDef="principalDue">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Principal Due' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Principal Due' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item">
<ng-container>
{{ item.principalDue | formatNumber }}
@@ -236,17 +257,21 @@
</ng-container>
<ng-container matColumnDef="interest">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Interest' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Interest' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item">{{ item.interestOriginalDue | formatNumber }}</td>
</ng-container>
<ng-container matColumnDef="fees">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Fees' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>{{ 'labels.inputs.Fees' | translate }}</th>
<td mat-cell class="r-amount" *matCellDef="let item">{{ item.feeChargesDue | formatNumber }}</td>
</ng-container>
<ng-container matColumnDef="due">
<th mat-header-cell class="r-amount" *matHeaderCellDef>{{ 'labels.inputs.Installment Amount' | translate }}</th>
<th mat-header-cell class="r-amount mat-header-cell" *matHeaderCellDef>
{{ 'labels.inputs.Installment Amount' | translate }}
</th>
<td mat-cell class="r-amount" *matCellDef="let item">
<span *ngIf="!item.changed">
{{ item.totalDueForPeriod | formatNumber }}
@@ -37,3 +37,19 @@ table {
.overdued {
color: $status-matured;
}
#repaymentSchedule,
#repaymentScheduleEdit {
width: 100%;
}
.mat-header-cell {
color: rgba($color: #000, $alpha: 54%);
font-size: 12px;
font-weight: 500;
}
div.container {
overflow: auto;
max-width: 100%;
}
@@ -1,5 +1,5 @@
<div class="container">
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px" class="action-buttons">
<div class="layout-row gap-20px align-end align-items-center action-buttons">
<button mat-raised-button color="primary" [routerLink]="['../actions/Reschedule']">
{{ 'labels.buttons.Reschedule' | translate }}
</button>
@@ -1,5 +1,5 @@
<div class="container">
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px" class="transaction-buttons" *ngIf="checkStatus()">
<div class="layout-row transaction-buttons align-end gap-20px" *ngIf="checkStatus()">
<mat-checkbox [formControl]="hideReversedParam" (click)="hideReversed()" class="accruals">
{{ 'labels.inputs.Hide Reversed' | translate }}</mat-checkbox
>
@@ -3,6 +3,7 @@
.container {
padding-bottom: 2%;
max-width: 100%;
.transaction-buttons {
padding-bottom: 1rem;
@@ -127,11 +127,11 @@ export class TransactionsTabComponent implements OnInit {
}
hideAccruals() {
this.filterTransactions(this.hideReversedParam.value, !this.hideAccrualsParam.value);
this.filterTransactions(this.hideReversedParam.value, this.hideAccrualsParam.value);
}
hideReversed() {
this.filterTransactions(!this.hideReversedParam.value, this.hideAccrualsParam.value);
this.filterTransactions(this.hideReversedParam.value, this.hideAccrualsParam.value);
}
filterTransactions(hideReversed: boolean, hideAccrual: boolean): void {
@@ -1,7 +1,7 @@
<div class="container">
<mat-card>
<form [formGroup]="editTransactionForm" (ngSubmit)="submit()">
<mat-card-content fxLayout="column">
<mat-card-content class="layout-column">
<mat-form-field (click)="dueDatePicker.open()">
<mat-label>{{ 'labels.inputs.Transaction Date' | translate }}</mat-label>
<input
@@ -42,8 +42,9 @@
</mat-select>
</mat-form-field>
<div fxFlexFill>
<span fxFlex="75%" class="expandcollapsebutton m-l-10 m-t-40" (click)="addPaymentDetails()">
<div class="flex-fill">
<span class="expandcollapsebutton m-l-10 m-t-40 flex-75">
(click)="addPaymentDetails()">
<mat-slide-toggle>
<div [className]="showPaymentDetails ? 'enabled' : 'disabled'">
<span class="m-l-10">{{ 'labels.inputs.Show Payment Details' | translate }}</span>
@@ -77,7 +78,7 @@
<input formControlName="bankNumber" matInput />
</mat-form-field>
<mat-card-actions fxLayoutGap="5px" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center">
<mat-card-actions class="layout-row layout-xs-column layout-align-center gap-5px">
<button type="button" mat-raised-button [routerLink]="['../']">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -1,6 +1,6 @@
<form class="m-t-20" fxLayout="column" [formGroup]="transactionsReportForm" (ngSubmit)="generate()">
<div fxLayout="row" fxLayoutGap="3%" fxLayoutAlign="center">
<mat-form-field fxFlex="30%" (click)="fromDatePicker.open()">
<form class="layout-column m-t-20" [formGroup]="transactionsReportForm" (ngSubmit)="generate()">
<div class="layout-row layout-align-center gap-3percent">
<mat-form-field class="flex-fill" (click)="fromDatePicker.open()">
<mat-label>{{ 'labels.inputs.From Date' | translate }}</mat-label>
<input
matInput
@@ -18,7 +18,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="30%" (click)="toDatePicker.open()">
<mat-form-field class="flex-fill flex-30" (click)="toDatePicker.open()">
<mat-label>{{ 'labels.inputs.To Date' | translate }}</mat-label>
<input
matInput
@@ -37,7 +37,7 @@
</mat-form-field>
</div>
<div class="generate-button" fxLayout="row" fxLayout.xs="column" fxLayoutAlign="center" fxLayoutGap="5%">
<div class="generate-button layout-row layout-xs-column layout-align-center gap-5percent">
<button type="button" mat-raised-button [routerLink]="['../']">{{ 'labels.buttons.Cancel' | translate }}</button>
<button mat-raised-button color="primary" [disabled]="!transactionsReportForm.valid">
<fa-icon icon="cogs" class="m-r-10"></fa-icon>{{ 'labels.buttons.Generate Report' | translate }} &nbsp;
@@ -1,9 +1,4 @@
<div
fxLayoutAlign="end"
class="container m-b-20 transaction-buttons"
fxLayoutGap="2%"
*ngIf="!transactionData.type.contra"
>
<div class="container m-b-20 transaction-buttons layout-align-end gap-2percent" *ngIf="!transactionData.type.contra">
<span *mifosxHasPermission="'ADJUST_LOAN'">
<button mat-raised-button color="primary" [routerLink]="'edit'" [disabled]="!allowEdition">
<fa-icon icon="edit" class="m-r-10"></fa-icon>{{ 'Edit' | translate }}
@@ -23,64 +18,64 @@
<div class="container">
<mat-card>
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="100%" [ngClass]="loanTransactionColor()"></div>
<div class="layout-row-wrap card-content">
<div class="flex-100" [ngClass]="loanTransactionColor()"></div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Transaction Id' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.id }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="transactionData.toLoanTransactionRelation">
<div class="flex-50 mat-body-strong" *ngIf="transactionData.toLoanTransactionRelation">
{{ 'Repayment Transaction' | translate }}
</div>
<div fxFlex="50%" *ngIf="transactionData.toLoanTransactionRelation">
<div class="flex-50" *ngIf="transactionData.toLoanTransactionRelation">
<a [href]="loanTransactionRelatedLink(transactionData.toLoanTransactionRelation.fromLoanTransaction)">
{{ transactionData.toLoanTransactionRelation.fromLoanTransaction }}
</a>
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Type' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.type.value }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Transaction Date' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.date | dateFormat }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Currency' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.currency.name }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'Amount' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.amount | currency: transactionData.currency.code : 'symbol-narrow' : '1.2-2' }}
</div>
<div fxFlex="50%" class="mat-body-strong" *ngIf="transactionData.externalId">
<div class="flex-50 mat-body-strong" *ngIf="transactionData.externalId">
{{ 'External Id' | translate }}
</div>
<div fxFlex="50%" *ngIf="transactionData.externalId">
<div class="flex-50" *ngIf="transactionData.externalId">
<mifosx-external-identifier
externalId="{{ transactionData.externalId }}"
completed="true"
@@ -89,7 +84,7 @@
<mat-divider *ngIf="existTransactionRelations" [inset]="true"></mat-divider>
<div fxFlex="100%" class="mat-body-strong" *ngIf="existTransactionRelations">
<div class="mat-body-strong flex-100" *ngIf="existTransactionRelations">
{{ 'Linked Transactions' | translate }}
<br />
@@ -128,7 +123,7 @@
</mifosx-transaction-payment-detail>
</div>
<div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row layout-align-center gap-2percent column-on-mobile">
<button type="button" mat-raised-button color="primary" [routerLink]="['../']">
{{ 'labels.buttons.Back' | translate }}
</button>
@@ -4,7 +4,7 @@
.container {
max-width: 37rem;
.content {
.card-content {
div {
margin: 1rem 0;
word-wrap: break-word;
@@ -1,10 +1,6 @@
<div
*ngIf="loansAccountData.status.value === 'Active' && chargeData.amountOutstanding !== 0"
fxLayout="row"
fxLayoutAlign="end"
fxLayoutGap="2%"
fxLayout.lt-md="column"
class="container m-b-20"
class="layout-row align-end gap-2percent layout-xs-column container m-b-20"
>
<button mat-raised-button color="primary" *mifosxHasPermission="'WAIVE_SAVINGSACCOUNTCHARGE'" (click)="editCharge()">
<fa-icon icon="flag" class="m-r-10"></fa-icon>
@@ -42,11 +38,7 @@
<div
*ngIf="loansAccountData.status.value === 'Submitted and pending approval'"
fxLayout="row"
fxLayoutAlign="end"
fxLayoutGap="2%"
fxLayout.lt-md="column"
class="container m-b-20"
class="layout-row align-end gap-2percent layout-xs-column container m-b-20"
>
<button mat-raised-button color="primary" *mifosxHasPermission="'UPDATE_SAVINGSACCOUNTCHARGE'" (click)="editCharge()">
<fa-icon icon="edit" class="m-r-10"></fa-icon>
@@ -61,99 +53,99 @@
<div class="container">
<mat-card>
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="100%" [ngClass]="loanChargeColor()"></div>
<div class="layout-row-wrap">
<div class="flex-100" [ngClass]="loanChargeColor()"></div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.name' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.name }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Charge Type' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.penalty ? 'Penalty' : 'Fees' }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Currency' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.currency.displayLabel }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Payment due at' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.chargeTimeType.value }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Payment due as of' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.dueDate | dateFormat }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Calculation Type' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.chargeCalculationType.value }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Due' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.amount | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Paid' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.amountPaid | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Waived' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.amountWaived | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Outstanding' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.amountOutstanding | formatNumber }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Submitted On Date' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ chargeData.submittedOnDate | dateFormat }}
</div>
</div>
<div fxLayout="row" fxLayoutAlign="center" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row layout-align-center gap-2percent column-on-mobile">
<button type="button" mat-raised-button color="primary" [routerLink]="['../']">
{{ 'labels.buttons.Back' | translate }}
</button>