diff --git a/smp-angular/src/app/common/alert-message/alert-message.component.css b/smp-angular/src/app/common/alert-message/alert-message.component.css index e624e0941b79a78ef596133b0d355194fb9a70af..c59f2845cff3ca8e0ae7e90de4f90847ad29553a 100644 --- a/smp-angular/src/app/common/alert-message/alert-message.component.css +++ b/smp-angular/src/app/common/alert-message/alert-message.component.css @@ -1,4 +1,9 @@ .alert-message { + position: fixed; + max-width: 70%; + top: 3em; + left: 50%; + transform: translate(-50%, 0); padding: 20px; color: white; opacity: 1; diff --git a/smp-angular/src/app/common/alert-message/alert-message.component.html b/smp-angular/src/app/common/alert-message/alert-message.component.html index b3851d3687e137ee3044479bd82e3245dfbf34ad..9494a75e64e4ef03903911bc57680945a37d4b82 100644 --- a/smp-angular/src/app/common/alert-message/alert-message.component.html +++ b/smp-angular/src/app/common/alert-message/alert-message.component.html @@ -1,8 +1,7 @@ -<div #alertMessage +<div #alertMessage class="mat-elevation-z8" *ngIf="message" [ngClass]="{ 'alert-message': message, 'alert-success': message.type === 'success', - 'alert-error': message.type === 'error', - 'stickyError':showSticky}" + 'alert-error': message.type === 'error'}" id="alertmessage_id" > diff --git a/smp-angular/src/app/common/alert-message/alert-message.component.ts b/smp-angular/src/app/common/alert-message/alert-message.component.ts index 60edc305ff29dfb49c0cb55a5758c92cab66250c..8a8b2ff5af6be8454570949c1c518140700dc27d 100644 --- a/smp-angular/src/app/common/alert-message/alert-message.component.ts +++ b/smp-angular/src/app/common/alert-message/alert-message.component.ts @@ -13,11 +13,13 @@ export class AlertMessageComponent implements OnInit { showSticky:boolean = false; message: any=null; + readonly successTimeout: number = 3000; + constructor(private alertService: AlertMessageService) { } ngOnInit() { - this.alertService.getMessage().subscribe(message => { this.message = message; }); + this.alertService.getMessage().subscribe(message => { this.showMessage(message); }); } clearAlert():void { @@ -33,4 +35,14 @@ export class AlertMessageComponent implements OnInit { return this.message.text; } } + + showMessage(message: any) { + this.message = message; + if (message?.type==='success') { + setTimeout(() => { + this.clearAlert(); + }, this.successTimeout); + } + + } } diff --git a/smp-angular/src/app/common/dialogs/password-change-dialog/password-change-dialog.component.html b/smp-angular/src/app/common/dialogs/password-change-dialog/password-change-dialog.component.html index 2f4807e63bd5d03b41ac2afa4e350dab394e3e59..2b684909a44f0f52fe78057b28b7e0ddfb8f4e3d 100644 --- a/smp-angular/src/app/common/dialogs/password-change-dialog/password-change-dialog.component.html +++ b/smp-angular/src/app/common/dialogs/password-change-dialog/password-change-dialog.component.html @@ -31,13 +31,11 @@ formControlName="new-password" required id="np_id" auto-focus-directive> <mat-icon matSuffix (click)="hideNewPwdFiled = !hideNewPwdFiled">{{hideNewPwdFiled ? 'visibility_off' : 'visibility'}}</mat-icon> - <smp-field-error *ngIf="passwordError('new-password', 'required')">New password is required</smp-field-error > <smp-field-error *ngIf="passwordError('new-password', 'error')">New password must not be equal than old current password! </smp-field-error > <smp-field-error *ngIf="passwordError('new-password', 'pattern')">{{passwordValidationMessage}}</smp-field-error> </mat-form-field> - <mat-form-field style="width:100%"> <mat-label>Confirm New Password</mat-label> <input matInput [type]="hideConfPwdFiled ? 'password' : 'text'" @@ -47,8 +45,6 @@ <smp-field-error *ngIf="passwordError('confirm-new-password', 'error')">Confirm valued does not match new password! </smp-field-error > - <smp-field-error *ngIf="passwordError('confirm-new-password', 'required')">Confirm New password is required - </smp-field-error > </mat-form-field> </div>