mazdak/UX-fix-changePassword #38

Merged
naeem.ullah merged 2 commits from mazdak/UX-fix-changePassword into dev-pending-01-01-2026 3 weeks ago

@ -44,10 +44,10 @@
<div class="d-flex align-items-center">
<div class="d-none d-lg-inline-block me-3">
<label class="text-muted fw-normal mb-0"
<label class="text-muted fw-normal mb-0 "
[title]="mismatchedDates"
[style]="{'color': dateColor}"
style="font-size: 14px;">
style="font-size: 14px;" >
{{'date' | translate}}: {{date}}
</label>
</div>
@ -60,7 +60,7 @@
aria-haspopup="true"
[attr.aria-expanded]="isDropdownVisible ? 'true' : 'false'">
<img class="rounded-circle header-profile-user" src="assets/images/user-icon.png" alt="user-icon" />
<span class="d-none d-xl-inline-block ms-2 text-muted">{{username}}</span>
<span class="d-none d-xl-inline-block ms-2 fw-sm">{{username}}</span>
<i class="mdi mdi-chevron-down text-muted d-xl-inline-block font-size-22"></i>
</button>

@ -1,4 +1,4 @@
import { Component, HostListener, Inject, PLATFORM_ID } from '@angular/core';
import { Component, HostListener, Inject, OnInit, PLATFORM_ID } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router';
import { SidebarService } from '../../../services/sidebar.service';
import { TranslateModule, TranslateService } from '@ngx-translate/core';
@ -12,7 +12,7 @@ import { AuthenticationService } from '../../../services/authenticate.service';
templateUrl: './header.component.html',
styleUrl: './header.component.scss'
})
export class HeaderComponent {
export class HeaderComponent implements OnInit{
isDropdownVisible: boolean;
isVacDropdownVisible: boolean;
isNotificationsVisible: boolean;
@ -25,9 +25,9 @@ export class HeaderComponent {
},
];
direction: string = 'ltr';
userString;
user;
username;
user: any;
userObj: any;
username : string = '';
mismatchedDates: string = "";
dateColor = "black";
date: any;
@ -42,9 +42,6 @@ export class HeaderComponent {
this.isDropdownVisible = false;
this.isVacDropdownVisible = false;
this.isNotificationsVisible = false;
this.userString = this.storageService.getItem('user');
this.user = JSON.parse(this.userString as string);
this.username = this.user?.username;
this.date = new Date().toISOString().split('T')[0];
}
ngOnInit(): void {
@ -57,6 +54,8 @@ export class HeaderComponent {
this.storageService.setItem('sidebarState', isCollapsed ? 'expanded' : 'collapsed');
}
}
this.userObj = JSON.parse(this.storageService.getItem('user') || '{}');
this.username = this.userObj?.user?.userFullname ?? '';
}
ngAfterViewInit(): void {

@ -96,8 +96,8 @@
{{ 'oldPassword' | translate }}<span
class="mandatory">*</span>
</label>
<div class="password-wrapper position-relative w-100">
<div class="d-flex flex-row align-items-stretch">
<div class="w-100">
<div class="password-wrapper">
<input type="text" id="oldPassword"
class="form-control"
formControlName="oldPassword"
@ -105,7 +105,8 @@
placeholder="{{ 'oldPassword' | translate }}" appNoWhitespaces
/>
<app-password-hide-show #psh class="password-eye align-items-stretch" [showPassword]="true" (onEyeClick)="togglePasswordType()"></app-password-hide-show>
</div>
</div>
<div class="text-danger" *ngIf="changePasswordForm.get('oldPassword')?.touched &&
changePasswordForm.get('oldPassword')?.invalid">
{{ 'fieldRequired' | translate }}
@ -120,22 +121,19 @@
{{ 'enterNewPassword' | translate }}<span
class="mandatory">*</span>
</label>
<div class="password-wrapper position-relative w-100">
<input id="newPassword"
class="form-control"
formControlName="newPassword"
type="{{passwordType1}}"
maxlength="500"
placeholder="{{ 'enterNewPassword' | translate }}" appNoWhitespaces
rows="3" />
<app-password-hide-show #psh1 class="password-eye align-items-stretch" [showPassword]="true" (onEyeClick)="togglePasswordType1()"></app-password-hide-show>
<div class="w-100">
<div class="password-wrapper">
<input id="newPassword" class="form-control" formControlName="newPassword" type="{{passwordType1}}" maxlength="500"
placeholder="{{ 'enterNewPassword' | translate }}" appNoWhitespaces rows="3" />
<app-password-hide-show #psh1 class="password-eye align-items-stretch" [showPassword]="true"
(onEyeClick)="togglePasswordType1()"></app-password-hide-show>
</div>
</div>
<div class="text-danger" *ngIf="newPasswordError$">
<div class="text-danger" *ngIf="newPasswordError$">
{{ newPasswordError$ | translate }}
</div>
</div>
</div>
</div>
@ -147,22 +145,19 @@
{{ 'confirmPassword' | translate }}<span
class="mandatory">*</span>
</label>
<div class="password-wrapper position-relative w-100">
<input id="confirmPassword"
class="form-control"
formControlName="confirmPassword"
type="{{passwordType2}}"
maxlength="500"
placeholder="{{ 'confirmPassword' | translate }}" appNoWhitespaces
rows="3" />
<app-password-hide-show #psh2 class="password-eye align-items-stretch" [showPassword]="true" (onEyeClick)="togglePasswordType2()"></app-password-hide-show>
</div>
<div class="text-danger" *ngIf="confirmPasswordError$">
<div class="w-100">
<div class="password-wrapper">
<input id="confirmPassword" class="form-control" formControlName="confirmPassword" type="{{passwordType2}}"
maxlength="500" placeholder="{{ 'confirmPassword' | translate }}" appNoWhitespaces rows="3" />
<app-password-hide-show #psh2 class="password-eye align-items-stretch" [showPassword]="true"
(onEyeClick)="togglePasswordType2()"></app-password-hide-show>
</div>
<div class="text-danger" *ngIf="confirmPasswordError$">
{{ confirmPasswordError$ | translate }}
</div>
</div>
</div>
</div>
<div class="col-md-6">

Loading…
Cancel
Save