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,4 +1,4 @@
<div class="container m-b-20" fxLayout="row" fxLayoutAlign="end" fxLayoutGap="20px">
<div class="container m-b-20 layout-row align-end gap-20px">
<div #buttonTreeView>
<mat-button-toggle-group [formControl]="viewGroup">
<mat-button-toggle value="listView">
@@ -25,8 +25,8 @@
<!-- List View -->
<div class="container" [hidden]="viewGroup.value !== 'listView'">
<div #filter fxLayout="row" fxLayoutGap="20px">
<mat-form-field fxFlex>
<div #filter class="layout-row gap-20px">
<mat-form-field class="flex-fill">
<mat-label>{{ 'labels.inputs.Filter' | translate }}</mat-label>
<input matInput (keyup)="applyFilter($event.target.value)" />
</mat-form-field>
@@ -110,14 +110,14 @@
<!-- Tree View -->
<div class="container" [hidden]="viewGroup.value !== 'treeView'">
<div class="m-b-20" fxLayout="row" fxLayoutAlign="start" fxLayoutGap="20px">
<div class="m-b-20 layout-row align-start gap-20px">
<button mat-raised-button (click)="toggleExpandCollapse()">
{{ (isTreeExpanded ? 'labels.buttons.Collapse All' : 'labels.buttons.Expand All') | translate }}
</button>
</div>
<div fxLayout="row" fxLayoutGap="4%" fxLayout.lt-md="column">
<div class="mat-elevation-z8" fxFlex>
<div class="layout-row gap-4percent responsive-column">
<div class="mat-elevation-z8 flex">
<mat-tree [dataSource]="nestedTreeDataSource" [treeControl]="nestedTreeControl" class="gl-account-tree">
<mat-tree-node *matTreeNodeDef="let node" matTreeNodeToggle>
<li class="mat-tree-node">
@@ -151,55 +151,55 @@
</mat-tree>
</div>
<div fxFlex="48%" *ngIf="glAccount">
<div class="flex-48" *ngIf="glAccount">
<mat-card>
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="50%" class="header">
<div class="layout-row-wrap">
<div class="flex-50 header">
{{ 'labels.inputs.Account Name' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.name }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.GL Code' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.glCode }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.Account Type' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ 'labels.inputs.accounting.' + glAccount.type | translate }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.Account Usage' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.usage }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.Manual Entries Allowed' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.manualEntriesAllowed }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.Description' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.description }}
</div>
</div>
@@ -212,7 +212,7 @@
<ng-template #templateButtonTreeView let-popover="popover">
<h2>{{ 'labels.heading.Tree View' | translate }}</h2>
<p class="mw300">{{ 'labels.text.Alternative way-Tree view' | translate }}</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -232,7 +232,7 @@
<ng-template #templateButtonAddAccount let-popover="popover">
<h2>{{ 'labels.heading.Add Account' | translate }}</h2>
<p class="mw300">{{ 'labels.text.Create New GL Account' | translate }}</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -255,7 +255,7 @@
<ng-template #templateFilter let-popover="popover">
<h4>{{ 'labels.heading.Search bar to filter GL accounts.' | translate }}</h4>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -280,7 +280,7 @@
<h4 class="mw300">
{{ 'labels.heading.List of chart of all the accounts being used by your organization.' | translate }}
</h4>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -1,6 +1,5 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { Resolve } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
@@ -12,7 +11,7 @@ import { AccountingService } from '../accounting.service';
* Chart of acocunts data resolver.
*/
@Injectable()
export class ChartOfAccountsResolver implements Resolve<Object> {
export class ChartOfAccountsResolver {
/**
* @param {AccountingService} accountingService Accounting service.
*/
@@ -1,6 +1,5 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { Resolve } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
@@ -12,7 +11,7 @@ import { AccountingService } from '../../accounting.service';
* Chart of accounts template data resolver.
*/
@Injectable()
export class ChartOfAccountsTemplateResolver implements Resolve<Object> {
export class ChartOfAccountsTemplateResolver {
/**
* @param {AccountingService} accountingService Accounting service.
*/
@@ -2,8 +2,8 @@
<mat-card>
<form #accountFormRef [formGroup]="glAccountForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
<mat-form-field fxFlex="48%">
<div class="layout-row-wrap gap-2px responsive-column">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Account Type' | translate }}</mat-label>
<mat-select required formControlName="type">
<mat-option *ngFor="let accountType of accountTypeData" [value]="accountType.id">
@@ -16,7 +16,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Account Name' | translate }}</mat-label>
<input matInput required formControlName="name" />
<mat-error *ngIf="glAccountForm.controls.name.hasError('required')">
@@ -25,7 +25,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Account Usage' | translate }}</mat-label>
<mat-select required formControlName="usage">
<mat-option *ngFor="let accountUsage of accountUsageData" [value]="accountUsage.id">
@@ -38,7 +38,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.GL Code' | translate }}</mat-label>
<input matInput required formControlName="glCode" />
<mat-error *ngIf="glAccountForm.controls.glCode.hasError('required')">
@@ -48,7 +48,7 @@
</mat-form-field>
<mifosx-gl-account-selector
fxFlex="48%"
class="flex-48"
[inputFormControl]="glAccountForm.controls.parentId"
[glAccountList]="parentData"
[required]="false"
@@ -56,7 +56,7 @@
>
</mifosx-gl-account-selector>
<mat-form-field fxFlex="28%">
<mat-form-field class="flex-28">
<mat-label>{{ 'labels.inputs.Tag' | translate }}</mat-label>
<mat-select formControlName="tagId">
<mat-option *ngFor="let tag of tagData" [value]="tag.id">
@@ -65,20 +65,20 @@
</mat-select>
</mat-form-field>
<div fxFlex="18%" class="manual-entries-allowed-wrapper">
<div class="manual-entries-allowed-wrapper flex-18">
<mat-checkbox labelPosition="before" formControlName="manualEntriesAllowed" class="manual-entries-allowed">
{{ 'labels.inputs.Manual Entries Allowed' | translate }}
</mat-checkbox>
</div>
<mat-form-field fxFlex="98%">
<mat-form-field class="flex-98">
<mat-label>{{ 'labels.inputs.Description' | translate }}</mat-label>
<textarea matInput formControlName="description" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
</mat-form-field>
</div>
</mat-card-content>
<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]="[cancelRoute]">
{{ 'labels.buttons.Cancel' | translate }}
</button>
@@ -105,7 +105,7 @@
>{{ 'labels.inputs.Chart of Accounts' | translate }}</a
>
</p>
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column">
<div class="layout-row align-end gap-2px responsive-column">
<button mat-raised-button color="warn" (click)="popover.close(); configurationWizardService.closeConfigWizard()">
{{ 'labels.buttons.Close' | translate }}
</button>
@@ -2,8 +2,8 @@
<mat-card>
<form [formGroup]="glAccountForm" (ngSubmit)="submit()">
<mat-card-content>
<div fxLayout="row wrap" fxLayoutGap="2%" fxLayout.lt-md="column">
<mat-form-field fxFlex="48%">
<div class="layout-row-wrap gap-2px responsive-column">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Account Type' | translate }}</mat-label>
<mat-select required formControlName="type">
<mat-option *ngFor="let accountType of accountTypeData" [value]="accountType.id">
@@ -16,7 +16,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Account Name' | translate }}</mat-label>
<input matInput required formControlName="name" />
<mat-error *ngIf="glAccountForm.controls.name.hasError('required')">
@@ -25,7 +25,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.Account Usage' | translate }}</mat-label>
<mat-select required formControlName="usage">
<mat-option *ngFor="let accountUsage of accountUsageData" [value]="accountUsage.id">
@@ -38,7 +38,7 @@
</mat-error>
</mat-form-field>
<mat-form-field fxFlex="48%">
<mat-form-field class="flex-48">
<mat-label>{{ 'labels.inputs.GL Code' | translate }}</mat-label>
<input matInput required formControlName="glCode" />
<mat-error *ngIf="glAccountForm.controls.glCode.hasError('required')">
@@ -48,7 +48,7 @@
</mat-form-field>
<mifosx-gl-account-selector
fxFlex="48%"
class="flex-48"
[inputFormControl]="glAccountForm.controls.parentId"
[glAccountList]="parentData"
[required]="false"
@@ -56,7 +56,7 @@
>
</mifosx-gl-account-selector>
<mat-form-field fxFlex="28%">
<mat-form-field class="flex-28">
<mat-label>{{ 'labels.inputs.Tag' | translate }}</mat-label>
<mat-select formControlName="tagId">
<mat-option *ngFor="let tag of tagData" [value]="tag.id">
@@ -65,7 +65,7 @@
</mat-select>
</mat-form-field>
<div fxFlex="18%" class="manual-entries-allowed-wrapper">
<div class="manual-entries-allowed-wrapper flex-18">
<mat-checkbox
labelPosition="before"
required
@@ -76,14 +76,14 @@
</mat-checkbox>
</div>
<mat-form-field fxFlex="98%">
<mat-form-field class="flex-98">
<mat-label>{{ 'labels.inputs.Description' | translate }}</mat-label>
<textarea matInput formControlName="description" cdkTextareaAutosize cdkAutosizeMinRows="2"></textarea>
</mat-form-field>
</div>
</mat-card-content>
<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>
@@ -1,6 +1,6 @@
/** Angular Imports */
import { Injectable } from '@angular/core';
import { Resolve, ActivatedRouteSnapshot } from '@angular/router';
import { ActivatedRouteSnapshot } from '@angular/router';
/** rxjs Imports */
import { Observable } from 'rxjs';
@@ -13,7 +13,7 @@ import { AccountingService } from '../accounting.service';
* GL Account and chart of accounts template data resolver.
*/
@Injectable()
export class GlAccountAndChartOfAccountsTemplateResolver implements Resolve<Object> {
export class GlAccountAndChartOfAccountsTemplateResolver {
/**
* @param {AccountingService} accountingService Accounting service.
*/
@@ -1,4 +1,4 @@
<div fxLayout="row" fxLayoutAlign="end" fxLayoutGap="2%" fxLayout.lt-md="column" class="container m-b-20">
<div class="layout-row align-end gap-2px responsive-column container m-b-20">
<span *mifosxHasPermission="'CREATE_GLACCOUNT'">
<button
mat-raised-button
@@ -38,68 +38,68 @@
<div class="container">
<mat-card>
<mat-card-content>
<div fxLayout="row wrap" class="content">
<div fxFlex="50%" class="header">
<div class="layout-row-wrap">
<div class="flex-50 header">
{{ 'labels.inputs.Account Type' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ 'labels.inputs.accounting.' + glAccount.type?.value | translate }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.GL Code' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.glCode }}
</div>
<div fxFlex="50%" class="header" *ngIf="glAccount.parent">
<div class="flex-50 header" *ngIf="glAccount.parent">
{{ 'labels.inputs.Parent Account Name' | translate }}
</div>
<div fxFlex="50%" *ngIf="glAccount.parent">
<div class="flex-50" *ngIf="glAccount.parent">
<a class="tab-link" [routerLink]="['/accounting/chart-of-accounts/gl-accounts/view/' + glAccount.parent.id]">
<mifosx-gl-account-display [glAccount]="glAccount.parent"></mifosx-gl-account-display>
</a>
</div>
<div fxFlex="50%" class="header" *ngIf="glAccount.tagId.id">
<div class="flex-50 header" *ngIf="glAccount.tagId.id">
{{ 'labels.inputs.Tag' | translate }}
</div>
<div fxFlex="50%" *ngIf="glAccount.tagId.id">
<div class="flex-50" *ngIf="glAccount.tagId.id">
{{ glAccount.tagId.name }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.Account Usage' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.usage?.value }}
</div>
<div fxFlex="50%" class="header">
<div class="flex-50 header">
{{ 'labels.inputs.Manual Entries Allowed' | translate }}
</div>
<div fxFlex="50%">
<div class="flex-50">
{{ glAccount.manualEntriesAllowed | yesNo }}
</div>
<div fxFlex="50%" class="header" *ngIf="glAccount.description">
<div class="flex-50 header" *ngIf="glAccount.description">
{{ 'labels.inputs.Description' | translate }}
</div>
<div fxFlex="50%" *ngIf="glAccount.description">
<div class="flex-50" *ngIf="glAccount.description">
{{ glAccount.description }}
</div>
</div>
</mat-card-content>
<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" color="primary" mat-raised-button (click)="goBack()">
{{ 'labels.buttons.Back' | translate }}
</button>