Upgrading to Angular 20:
Replaced checked in package-lock.json by regenerated one. Ran ng update @angular/core@20 @angular/cli@20 Ran npm install @angular-builders/jest@^20.0.0 @fortawesome/angular-fontawesome@^3.0.0 @swimlane/ngx-graph@^11 Ran npm install ngx-mat-select-search@^8.0.2. Ran ng update @angular/material@20. Updated all eslint and typescript to the latest versions. Removed @angular-devkit/schematics. Updated fontawesome. Updated rxjs and tslib. Moved required node version from 16 to 20. Updated jest-preset-angular. Set preserveWhitespaces to false. Corrected two type declarations in two typescript files to make ng serve run without errors. Removed unused angular-devkit/schematics from view-user.component.ts . Updated list of supported browsers. Upgraded prettier. Ran prettier . --write the first time. Ran prettier . --write the second time. Ran ng generate @angular/core:inject with defaults, excepted a handful of files. Fixed remaining eslint problems. Added dist directory to ignores in eslint.config.js. Let prettier fix formatting, almost everything is just line breaks. Made htmlhint ignore @if and @for Angular constructs. Updated node version in Github workflow to 22.12.0 (build.yml). Updated .env.ts. Updated Angular datetime format strings from YYYY-MM-DD to yyyy-MM-dd. Merged changes from dev into angular20 branch.
This commit is contained in:
Felix van Hove
@@ -3,91 +3,109 @@
|
||||
<div class="flex-48">
|
||||
<mat-card class="layout-column">
|
||||
<mat-card-content class="layout-column">
|
||||
<mat-form-field *ngIf="!(officeData === undefined || officeData === null)">
|
||||
<mat-label>{{ 'labels.inputs.Office' | translate }}</mat-label>
|
||||
<mat-select [formControl]="officeSelector">
|
||||
<mat-option *ngFor="let office of officeData" [value]="office.id">
|
||||
{{ office.name }}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
@if (!(officeData === undefined || officeData === null)) {
|
||||
<mat-form-field>
|
||||
<mat-label>{{ 'labels.inputs.Office' | translate }}</mat-label>
|
||||
<mat-select [formControl]="officeSelector">
|
||||
@for (office of officeData; track office) {
|
||||
<mat-option [value]="office.id">
|
||||
{{ office.name }}
|
||||
</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
}
|
||||
|
||||
<mat-form-field *ngIf="!(employeeData === undefined || employeeData === null)">
|
||||
<mat-label>{{ employeeData.length ? 'Officer' : 'No Associated Officers' }}</mat-label>
|
||||
<mat-select [formControl]="employeeSelector">
|
||||
<mat-option *ngFor="let employee of employeeData" [value]="employee.id">
|
||||
{{ employee.displayName }}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
@if (!(employeeData === undefined || employeeData === null)) {
|
||||
<mat-form-field>
|
||||
<mat-label>{{ employeeData.length ? 'Officer' : 'No Associated Officers' }}</mat-label>
|
||||
<mat-select [formControl]="employeeSelector">
|
||||
@for (employee of employeeData; track employee) {
|
||||
<mat-option [value]="employee.id">
|
||||
{{ employee.displayName }}
|
||||
</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
}
|
||||
|
||||
<mat-form-field *ngIf="!(centerData === undefined || centerData === null)">
|
||||
<mat-label>{{ centerData.length ? 'Center' : 'No Associated Centers' }}</mat-label>
|
||||
<mat-select [formControl]="centerSelector">
|
||||
<mat-option *ngFor="let center of centerData" [value]="center.id">
|
||||
{{ center.name }}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
@if (!(centerData === undefined || centerData === null)) {
|
||||
<mat-form-field>
|
||||
<mat-label>{{ centerData.length ? 'Center' : 'No Associated Centers' }}</mat-label>
|
||||
<mat-select [formControl]="centerSelector">
|
||||
@for (center of centerData; track center) {
|
||||
<mat-option [value]="center.id">
|
||||
{{ center.name }}
|
||||
</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
}
|
||||
|
||||
<mat-form-field *ngIf="!(groupData === undefined || groupData === null)">
|
||||
<mat-label>{{ groupData.length ? 'Group' : 'No Associated Groups' }}</mat-label>
|
||||
<mat-select [formControl]="groupSelector">
|
||||
<mat-option *ngFor="let group of groupData" [value]="group.id">
|
||||
{{ group.name }}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
@if (!(groupData === undefined || groupData === null)) {
|
||||
<mat-form-field>
|
||||
<mat-label>{{ groupData.length ? 'Group' : 'No Associated Groups' }}</mat-label>
|
||||
<mat-select [formControl]="groupSelector">
|
||||
@for (group of groupData; track group) {
|
||||
<mat-option [value]="group.id">
|
||||
{{ group.name }}
|
||||
</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
}
|
||||
|
||||
<mat-form-field *ngIf="!(clientData === undefined || clientData === null)">
|
||||
<mat-label>{{ clientData.length ? 'Client' : 'No Associated Clients' }}</mat-label>
|
||||
<mat-select [formControl]="clientSelector">
|
||||
<mat-option *ngFor="let client of clientData" [value]="client.id">
|
||||
{{ client.displayName }}
|
||||
</mat-option>
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
@if (!(clientData === undefined || clientData === null)) {
|
||||
<mat-form-field>
|
||||
<mat-label>{{ clientData.length ? 'Client' : 'No Associated Clients' }}</mat-label>
|
||||
<mat-select [formControl]="clientSelector">
|
||||
@for (client of clientData; track client) {
|
||||
<mat-option [value]="client.id">
|
||||
{{ client.displayName }}
|
||||
</mat-option>
|
||||
}
|
||||
</mat-select>
|
||||
</mat-form-field>
|
||||
}
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
</div>
|
||||
|
||||
<div class="flex-48">
|
||||
<mat-card class="layout-column" *ngIf="selectedItem">
|
||||
<ng-container *ngIf="selectedItem.itemType === 'office'">
|
||||
<mifosx-office-navigation
|
||||
[officeData]="selectedItem"
|
||||
[employeeData]="employeeData"
|
||||
></mifosx-office-navigation>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="selectedItem.itemType === 'employee'">
|
||||
<mifosx-staff-navigation [employeeData]="selectedItem" [centerData]="centerData"></mifosx-staff-navigation>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="selectedItem.itemType === 'center'">
|
||||
<mifosx-center-navigation
|
||||
[centerData]="selectedItem"
|
||||
[groupData]="groupData"
|
||||
[centerAccountsData]="selectedItemAccounts"
|
||||
[centerSummaryData]="selectedItemSummary"
|
||||
></mifosx-center-navigation>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="selectedItem.itemType === 'group'">
|
||||
<mifosx-group-navigation
|
||||
[groupData]="selectedItem"
|
||||
[clientData]="clientData"
|
||||
[groupAccountsData]="selectedItemAccounts"
|
||||
></mifosx-group-navigation>
|
||||
</ng-container>
|
||||
|
||||
<ng-container *ngIf="selectedItem.itemType === 'client'">
|
||||
<mifosx-client-navigation
|
||||
[clientData]="selectedItem"
|
||||
[clientAccountsData]="selectedItemAccounts"
|
||||
></mifosx-client-navigation>
|
||||
</ng-container>
|
||||
</mat-card>
|
||||
@if (selectedItem) {
|
||||
<mat-card class="layout-column">
|
||||
@if (selectedItem.itemType === 'office') {
|
||||
<mifosx-office-navigation
|
||||
[officeData]="selectedItem"
|
||||
[employeeData]="employeeData"
|
||||
></mifosx-office-navigation>
|
||||
}
|
||||
@if (selectedItem.itemType === 'employee') {
|
||||
<mifosx-staff-navigation [employeeData]="selectedItem" [centerData]="centerData"></mifosx-staff-navigation>
|
||||
}
|
||||
@if (selectedItem.itemType === 'center') {
|
||||
<mifosx-center-navigation
|
||||
[centerData]="selectedItem"
|
||||
[groupData]="groupData"
|
||||
[centerAccountsData]="selectedItemAccounts"
|
||||
[centerSummaryData]="selectedItemSummary"
|
||||
></mifosx-center-navigation>
|
||||
}
|
||||
@if (selectedItem.itemType === 'group') {
|
||||
<mifosx-group-navigation
|
||||
[groupData]="selectedItem"
|
||||
[clientData]="clientData"
|
||||
[groupAccountsData]="selectedItemAccounts"
|
||||
></mifosx-group-navigation>
|
||||
}
|
||||
@if (selectedItem.itemType === 'client') {
|
||||
<mifosx-client-navigation
|
||||
[clientData]="selectedItem"
|
||||
[clientAccountsData]="selectedItemAccounts"
|
||||
></mifosx-client-navigation>
|
||||
}
|
||||
</mat-card>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user