AppStd/DigitalData.UserManager
8
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

feat: enhance NavMenuComponent with updateService integration

Browse Source 
- Added MatBadgeModule for update count display.
- Integrated `updateService` to show update count in the save button.
- Added change listener to update button count dynamically.
- Improved HTML structure with updated menu and button functionalities.
This commit is contained in:
Developer 02
2024-08-06 15:32:51 +02:00
parent 0fe9cb7126
commit e00c113bee
3 changed files with 12 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/nav-menu/nav-menu.component.html
View File

@@ -31,7 +31,7 @@
<div class="navbar-collapse justify-content-end me-5"> <div class="navbar-collapse justify-content-end me-5">
<a class="navbar-brand" [routerLink]="['/']">User Manager Portal</a> <a class="navbar-brand" [routerLink]="['/']">User Manager Portal</a>
<button *ngIf="isLogedIn()" class="btn"> <button *ngIf="isLogedIn()" class="btn">
<mat-icon class="scale-pulse" (click)="updateService.executeAll()">save</mat-icon> <mat-icon class="scale-pulse" [matBadge]="updateActCount === 0 ? '' : updateActCount" (click)="updateService.executeAll()">save</mat-icon>
</button> </button>
<button *ngIf="isLogedIn()" class="btn"> <button *ngIf="isLogedIn()" class="btn">
<mat-icon class="scale-pulse" (click)="creationService.openDialog()">add_to_photos</mat-icon> <mat-icon class="scale-pulse" (click)="creationService.openDialog()">add_to_photos</mat-icon>

9
DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/components/nav-menu/nav-menu.component.ts
View File

@@ -9,10 +9,11 @@ import { MatIconModule } from '@angular/material/icon';
import { RefreshService } from '../../services/refresh.service'; import { RefreshService } from '../../services/refresh.service';
import { CreationService } from '../../services/creation.service'; import { CreationService } from '../../services/creation.service';
import { UpdateService } from '../../services/update.service'; import { UpdateService } from '../../services/update.service';
import {MatBadgeModule} from '@angular/material/badge';
@Component({ @Component({
standalone: true, standalone: true,
imports: [RouterModule, CommonModule, ColorModeBttnComponent, MatIconModule], imports: [RouterModule, CommonModule, ColorModeBttnComponent, MatIconModule, MatBadgeModule],
selector: 'app-nav-menu', selector: 'app-nav-menu',
templateUrl: './nav-menu.component.html', templateUrl: './nav-menu.component.html',
styleUrls: ['./nav-menu.component.css'] styleUrls: ['./nav-menu.component.css']
@@ -23,8 +24,14 @@ export class NavMenuComponent {
} }
isExpanded = false; isExpanded = false;
updateActCount: number;
constructor(private dialog: MatDialog, private authService: AuthenticationService, public refreshService: RefreshService, public creationService : CreationService, public updateService: UpdateService) { constructor(private dialog: MatDialog, private authService: AuthenticationService, public refreshService: RefreshService, public creationService : CreationService, public updateService: UpdateService) {
this.authService.isAuthenticated().then().catch() this.authService.isAuthenticated().then().catch()
this.updateActCount = this.updateService.totalCount;
this.updateService.addChangeListener(() => {
this.updateActCount = updateService.totalCount;
})
} }
get isDarkTheme(): boolean { get isDarkTheme(): boolean {

6
DigitalData.UserManager.API/ClientApp/user_manager_ui/src/app/services/update.service.ts
View File

@@ -51,9 +51,9 @@ export class UpdateService {
} }
//change listeners //change listeners
private changeListeners: Array<(updateService: UpdateService) => void> = new Array(); private changeListeners: Array<() => void> = new Array();
addChangeListener(action: (updateService: UpdateService) => void) { addChangeListener(action: () => void) {
this.changeListeners.push(action) this.changeListeners.push(action)
} }
@@ -62,6 +62,6 @@ export class UpdateService {
} }
private executeAllChangeListeners() { private executeAllChangeListeners() {
this.changeListeners.forEach(e => e(this)); this.changeListeners.forEach(e => e());
} }
} }