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,5 +1,5 @@
<div class="tab-container mat-typography">
<div fxLayout="row" fxLayoutAlign="start">
<div class="layout-row align-start">
<div class="m-b-10">
<h3>{{ 'labels.inputs.Charges' | translate }}</h3>
</div>
@@ -2,8 +2,8 @@
<div class="loading"></div>
</div>
<div class="savings-account-tables" fxLayout="row" fxLayoutGap="2%" *ngIf="!isLoading">
<div fxFlex="49%" fxLayout="column" fxLayoutGap="4%">
<div class="savings-account-tables layout-row gap-2percent" *ngIf="!isLoading">
<div class="flex-49 layout-column gap-4percent">
<div
*ngIf="
!savingsAccountData.status.rejected && !savingsAccountData.status.submittedAndPendingApproval;
@@ -92,7 +92,7 @@
</div>
</div>
<div fxFlex="49%" *ngIf="isActive; else alternateSummary">
<div class="flex-49" *ngIf="isActive; else alternateSummary">
<h4 class="table-headers">{{ 'labels.heading.Account Summary' | translate }}</h4>
<table>
<tbody>
@@ -247,7 +247,7 @@
</div>
<ng-template #alternateSummary>
<div fxFlex="49%">
<div class="flex-49">
<h4 class="table-headers">{{ 'labels.heading.Account Summary' | translate }}</h4>
<table>
<tbody>
@@ -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>
@@ -13,8 +13,8 @@
</div>
<div class="mat-typography account-card-title">
<mat-card-title fxLayout="row" fxLayout.lt-md="column">
<div fxFlex="60%">
<mat-card-title class="layout-row layout-lt-md-column">
<div class="flex-60">
<h3>
<i
class="fa fa-stop"
@@ -46,7 +46,10 @@
</span>
</div>
<div *ngIf="!savingsAccountData.status.rejected && !savingsAccountData.status.submittedAndPendingApproval">
<div
class="flex-30"
*ngIf="!savingsAccountData.status.rejected && !savingsAccountData.status.submittedAndPendingApproval"
>
<h3>{{ 'labels.heading.Account Overview' | translate }}</h3>
<table class="account-overview">
<tbody>
@@ -70,9 +73,7 @@
</table>
</div>
<span fxFlex="auto"></span>
<div fxFlex="5%">
<div class="flex-5">
<button
mat-icon-button
[matMenuTriggerFor]="accountMenu"
@@ -112,7 +113,7 @@
</mat-card-header>
<mat-card-content class="content">
<nav mat-tab-nav-bar class="navigation-tabs" *ngIf="isActive">
<nav mat-tab-nav-bar class="navigation-tabs" *ngIf="isActive" [tabPanel]="tabPanel">
<a
mat-tab-link
[routerLink]="['./general']"
@@ -185,6 +186,8 @@
</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>
@@ -0,0 +1,3 @@
mat-card-title {
display: flex;
}
@@ -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="m-t-20 layout-column" [formGroup]="transactionsReportForm" (ngSubmit)="generate()">
<div class="layout-row layout-align-center gap-3percent">
<mat-form-field class="flex-30" (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-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,10 +1,7 @@
<div class="tab-container mat-typography">
<div class="container">
<div class="mat-elevation-z1 m-b-25" [hidden]="!accountWithTransactions">
<div fxLayout="row" fxLayoutAlign="start">
<div class="m-b-10">
<h3>{{ 'labels.heading.All Transactions' | translate }}</h3>
</div>
<div class="action-button m-b-20" fxLayout="row" fxLayoutGap="20px" *ngIf="checkStatus()">
<div class="layout-row align-end">
<div class="action-button m-b-20 layout-row gap-20px" *ngIf="checkStatus()">
<mat-checkbox [formControl]="hideReversedParam" (click)="hideReversed()" class="accruals">
{{ 'labels.inputs.Hide Reversed' | translate }}</mat-checkbox
>
@@ -121,10 +118,16 @@
<mat-icon><fa-icon icon="eye" size="sm"></fa-icon></mat-icon>
<span>{{ 'labels.text.View Transaction' | translate }}</span>
</button>
<button mat-menu-item *mifosxHasPermission="'ADJUST_LOAN'" (click)="undoTransaction(transaction, $event)">
<mat-icon><fa-icon icon="undo" size="sm"></fa-icon></mat-icon>
<span>{{ 'tooltips.Undo Transaction' | translate }}</span>
</button>
<span *ngIf="!transaction.reversed">
<button
mat-menu-item
*mifosxHasPermission="'ADJUSTTRANSACTION_SAVINGSACCOUNT'"
(click)="undoTransaction(transaction, $event)"
>
<mat-icon><fa-icon icon="undo" size="sm"></fa-icon></mat-icon>
<span>{{ 'tooltips.Undo Transaction' | translate }}</span>
</button>
</span>
<button
mat-menu-item
class="account-action-button"
@@ -147,11 +147,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
@@ -37,8 +37,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>
@@ -72,7 +73,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,4 +1,4 @@
<div fxLayoutAlign="end" class="container m-b-20" fxLayoutGap="2%">
<div class="container transaction-buttons m-b-20 align-end-center gap-2percent" align="end">
<span
*ngIf="
!(
@@ -48,54 +48,54 @@
<div class="container">
<mat-card>
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="100%" [ngClass]="transactionColor()"></div>
<div class="layout-row-wrap card-content">
<div class="flex-100" [ngClass]="transactionColor()"></div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Id' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.id }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.Transaction Type' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.transactionType.value | translateKey: 'catalogs' }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.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">
{{ 'labels.inputs.Currency' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ transactionData.currency.displayLabel }}
</div>
<div fxFlex="50%" class="mat-body-strong">
<div class="flex-50 mat-body-strong">
{{ 'labels.inputs.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.note">
<div class="flex-50 mat-body-strong" *ngIf="transactionData.note">
{{ 'labels.inputs.Note' | translate }}
</div>
<div fxFlex="50%" *ngIf="transactionData.note">
<div class="flex-50" *ngIf="transactionData.note">
{{ transactionData.note }}
</div>
@@ -106,7 +106,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;
@@ -17,6 +17,10 @@
}
}
.transaction-buttons {
margin-top: 3%;
}
.active {
background-color: $status-active;
height: 4px;
@@ -1,5 +1,5 @@
<div class="container">
<nav mat-tab-nav-bar class="navigation-tabs">
<nav mat-tab-nav-bar class="navigation-tabs" [tabPanel]="tabPanel">
<a
mat-tab-link
[routerLink]="['./general']"
@@ -23,5 +23,7 @@
</ng-container>
</nav>
<router-outlet></router-outlet>
<mat-tab-nav-panel #tabPanel>
<router-outlet></router-outlet>
</mat-tab-nav-panel>
</div>
@@ -1,10 +1,6 @@
<div
*ngIf="savingsAccountData.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="accent" *mifosxHasPermission="'PAY_SAVINGSACCOUNTCHARGE'" (click)="payCharge()">
<fa-icon icon="dollar-sign" class="m-r-10"></fa-icon>
@@ -29,11 +25,7 @@
<div
*ngIf="savingsAccountData.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>
@@ -48,89 +40,89 @@
<div class="container">
<mat-card>
<mat-card-content>
<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">
{{ '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' : ('Fee' | translateKey: 'catalogs') }}
</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 | translateKey: 'catalogs' }}
</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 | translateKey: 'catalogs' }}
</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>
<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>