Skip to content

Commit

Permalink
Email changes and Admin set email and password page
Browse files Browse the repository at this point in the history
  • Loading branch information
@aniketeknathjadhav
aniketeknathjadhav committed Feb 9, 2021
1 parent 8a36cc3 commit 9cff575
Show file tree
Hide file tree
Showing 8 changed files with 329 additions and 171 deletions.
150 changes: 79 additions & 71 deletions FewaTelemedicine/ClientApp/src/app/provider/forgot-password/forgot-password.component.html
View file
Original file line number Diff line number Diff line change
@@ -1,81 +1,89 @@
<div class="introSection">
<div class="intro-form">
<div class="introBackIcon">
<img src="/assets/img/stethoscope.png" class="img-fluid">
</div>
<div class="intro-formSec text-center">
<h2>Forgot Password?</h2>
<h1>Enter the email address or username associated with your account</h1>
<h6>We will email you a link to reset password</h6>
<form [formGroup]="form" *ngIf="showOtpSection">
<div class="intro-formList">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter your email address or username" formControlName="email_username">
</div>
<div *ngIf="loginFormControls.email_username.touched && loginFormControls.email_username.invalid" style="color: red;">
<div *ngIf="loginFormControls.email_username.errors.required">Email or username is required.</div>
</div>
<button type="submit" class="btn submitBtn" [disabled]="disableSubmitButton" (click)="sendOTP()">Send</button>
<p>Back to Login?<a href="javascript:" routerLink="/provider/login"> Sign In</a></p>
</div>
</form>
<form [formGroup]="form" *ngIf="showOtpVerifySection">
<div class="intro-formList">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter your one time password" formControlName="otp">
</div>
<div *ngIf="loginFormControls.otp.touched && loginFormControls.otp.invalid" style="color: red;">
<div *ngIf="loginFormControls.otp.errors.required">One time password is required.</div>
</div>
<button type="submit" class="btn submitBtn" [disabled]="disableSubmitButton" (click)="verifyOTP()">Confirm</button><br><br>
<!-- <div class="countdown-section text-left" id="countdown" >{{countDownTime}}</div> -->
<button type="submit" class="btn submitBtn" [disabled]="disableResendButton" (click)="resendOTP()">Resend</button>
<p>Back to Login?<a href="javascript:" routerLink="/provider/login"> Sign In</a></p>
<div class="intro-form">
<div class="introBackIcon">
<img src="/assets/img/stethoscope.png" class="img-fluid">
</div>
</form>
<form [formGroup]="form" *ngIf="showResetPasswordSection">
<div class="intro-formList">
<div class="form-group">
<input type="password" class="form-control" placeholder="Enter your new password" formControlName="password">
</div>
<div *ngIf="loginFormControls.password.touched && loginFormControls.password.invalid" style="color: red;">
<div *ngIf="loginFormControls.password.errors.required">Password is required.</div>
</div>
<div class="form-group">
<input type="password" class="form-control" placeholder="Confirm your password" formControlName="confirm_password">
</div>
<div *ngIf="loginFormControls.confirm_password.touched && loginFormControls.confirm_password.invalid" style="color: red;">
<div *ngIf="loginFormControls.confirm_password.errors.required">Password is required.</div>
<div *ngIf="loginFormControls.confirm_password.errors.confirmedValidator">Password doesn't matched.</div>
</div>
<button type="submit" class="btn submitBtn" (click)="resetPassword()">Submit</button>
<p>Back to Login?<a href="javascript:" routerLink="/provider/login"> Sign In</a></p>
<div class="intro-formSec text-center">
<ng-container *ngIf="showOtpSection">
<h2>Forgot Password?</h2>
<h1>Enter the email address associated with your account</h1>
<h6>We will email you a link to reset password</h6>
</ng-container>
<h1 *ngIf="showOtpVerifySection">Verify OTP</h1>
<h1 *ngIf="showResetPasswordSection">Reset your password</h1>
<form [formGroup]="form" *ngIf="showOtpSection">
<div class="intro-formList">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter your email address or username" formControlName="email_username">
</div>
<div *ngIf="loginFormControls.email_username.touched && loginFormControls.email_username.invalid
|| loginFormControls.email_username.dirty && loginFormControls.email_username.invalid" style="color: red;">
<div *ngIf="loginFormControls.email_username.errors.required">Email is required.</div>
</div>
<button type="submit" class="btn submitBtn" [disabled]="disableSubmitButton" (click)="sendOTP()">Send</button>
<p>Back to Login?<a href="javascript:" routerLink="/provider/login"> Sign In</a></p>
</div>
</form>
<form [formGroup]="form" *ngIf="showOtpVerifySection">
<div class="intro-formList">
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter your one time password" formControlName="otp">
</div>
<div *ngIf="loginFormControls.otp.touched && loginFormControls.otp.invalid
|| loginFormControls.otp.dirty && loginFormControls.otp.invalid" style="color: red;">
<div *ngIf="loginFormControls.otp.errors.required">One time password is required.</div>
</div>
<button type="submit" class="btn submitBtn" [disabled]="disableSubmitButton" (click)="verifyOTP()">Confirm</button><br><br>
<div class="countdown-section text-left" id="countdown" *ngIf="showCountDown"></div>
<button type="submit" class="btn submitBtn" [disabled]="disableResendButton" (click)="resendOTP()">Resend</button>
<p>Back to Login?<a href="javascript:" routerLink="/provider/login"> Sign In</a></p>
</div>
</form>
<form [formGroup]="form" *ngIf="showResetPasswordSection">
<div class="intro-formList">
<div class="form-group">
<input type="password" class="form-control" placeholder="Enter your new password" formControlName="password">
</div>
<div *ngIf="loginFormControls.password.touched && loginFormControls.password.invalid
|| loginFormControls.password.dirty && loginFormControls.password.invalid" style="color: red;">
<div *ngIf="loginFormControls.password.errors.required">Password is required.</div>
</div>
<div class="form-group">
<input type="password" class="form-control" placeholder="Confirm your password" formControlName="confirm_password">
</div>
<div *ngIf="loginFormControls.confirm_password.touched && loginFormControls.confirm_password.invalid
|| loginFormControls.confirm_password.dirty && loginFormControls.confirm_password.invalid" style="color: red;">
<div *ngIf="loginFormControls.confirm_password.errors.required">Password is required.</div>
<div *ngIf="loginFormControls.confirm_password.errors.confirmedValidator">Password doesn't matched.</div>
</div>
<button type="submit" class="btn submitBtn" (click)="resetPassword()">Submit</button>
<p>Back to Login?<a href="javascript:" routerLink="/provider/login"> Sign In</a></p>
</div>
</form>
</div>
</form>
</div>

</div>
</div>

<div class="intro-about">
<div class="intro-content">
<div class="into-logo">
<img [src]="global.practiceObj.logoPath" class="img-fluid">
</div>
<div class="intro-bannercontent">
<p>{{global.practiceObj.description}}</p>
<ul>
<li>
<span>
<div class="intro-about">
<div class="intro-content">
<div class="into-logo">
<img [src]="global.practiceObj.logoPath" class="img-fluid">
</div>
<div class="intro-bannercontent">
<p>{{global.practiceObj.description}}</p>
<ul>
<li>
<span>
<svg id="Layer_1" enable-background="new 0 0 512.021 512.021" height="512"
viewBox="0 0 512.021 512.021" width="512" xmlns="http://www.w3.org/2000/svg">
<g>
<path d="m367.988 512.021c-16.528 0-32.916-2.922-48.941-8.744-70.598-25.646-136.128-67.416-189.508-120.795s-95.15-118.91-120.795-189.508c-8.241-22.688-10.673-46.108-7.226-69.612 3.229-22.016 11.757-43.389 24.663-61.809 12.963-18.501 30.245-33.889 49.977-44.5 21.042-11.315 44.009-17.053 68.265-17.053 7.544 0 14.064 5.271 15.645 12.647l25.114 117.199c1.137 5.307-.494 10.829-4.331 14.667l-42.913 42.912c40.482 80.486 106.17 146.174 186.656 186.656l42.912-42.913c3.838-3.837 9.361-5.466 14.667-4.331l117.199 25.114c7.377 1.581 12.647 8.101 12.647 15.645 0 24.256-5.738 47.224-17.054 68.266-10.611 19.732-25.999 37.014-44.5 49.977-18.419 12.906-39.792 21.434-61.809 24.663-6.899 1.013-13.797 1.518-20.668 1.519zm-236.349-479.321c-31.995 3.532-60.393 20.302-79.251 47.217-21.206 30.265-26.151 67.49-13.567 102.132 49.304 135.726 155.425 241.847 291.151 291.151 34.641 12.584 71.866 7.64 102.132-13.567 26.915-18.858 43.685-47.256 47.217-79.251l-95.341-20.43-44.816 44.816c-4.769 4.769-12.015 6.036-18.117 3.168-95.19-44.72-172.242-121.772-216.962-216.962-2.867-6.103-1.601-13.349 3.168-18.117l44.816-44.816z" />
</g>
</svg>
</span>{{global.practiceObj.contactNumber}}
</li>
<li>
<span>
</li>
<li>
<span>
<svg version="1.1" id="Capa_1" xmlns="http://www.w3.org/2000/svg"
xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px" viewBox="0 0 512 512"
style="enable-background:new 0 0 512 512;" xml:space="preserve">
Expand Down Expand Up @@ -120,9 +128,9 @@ <h6>We will email you a link to reset password</h6>
</g>
</svg>
</span>{{global.practiceObj.email}}
</li>
</ul>
</div>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
41 changes: 27 additions & 14 deletions FewaTelemedicine/ClientApp/src/app/provider/forgot-password/forgot-password.component.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -23,11 +23,13 @@ export class ForgotPasswordComponent implements OnInit {
providerForm: FormGroup;
countDownTime: number = 60;
form: FormGroup = new FormGroup({});
showCountDown = true;
constructor(public httpClient: HttpClient,
public routing: Router,
public global: Global,
public _snackBar: MatSnackBar,
public fb: FormBuilder) {
public fb: FormBuilder,
public router: Router) {
this.initForm();
}

Expand Down Expand Up @@ -62,17 +64,19 @@ export class ForgotPasswordComponent implements OnInit {
}

countDown(): void {
this.showCountDown=true;
var countDown = setInterval(() => {
this.countDownTime--;
// if (document.getElementById('countdown')) {
// document.getElementById('countdown').innerHTML = this.countDownTime.toString();
if (document.getElementById('countdown')) {
document.getElementById('countdown').innerHTML = "Resend OTP in " + this.countDownTime.toString() + "s";
if (this.countDownTime === 0) {
this.disableResendButton = false;
clearInterval(countDown);
this.showCountDown=false;
}
// } else {
// clearInterval(countDown);
// }
} else {
clearInterval(countDown);
}
}, 1000);
}

Expand All @@ -92,11 +96,11 @@ export class ForgotPasswordComponent implements OnInit {
res => this.error(res));
}

popUpSnackBar() {
this._snackBar.open('You can resend otp after one minute', 'Dismiss', {
duration: 10000,
popUpSnackBar(message: string,duration:number) {
this._snackBar.open(message, 'Dismiss', {
duration: duration,
verticalPosition: 'top'
});
});
}

resendOTP() {
Expand All @@ -115,7 +119,7 @@ export class ForgotPasswordComponent implements OnInit {
this.httpClient.post(this.global.apiUrl + "Security/VerifyOTP", this.providerObj)
.subscribe(res => this.successVerify(res),
res => this.error(res));
//alert("OTP Verified");

}

resetPassword() {
Expand All @@ -134,7 +138,8 @@ export class ForgotPasswordComponent implements OnInit {

successOTP(res) {
if (res) {
this.popUpSnackBar();
let message = "Your OTP is sent to your email address. It may take few minutes for the email delivery. Please check your promotions/spam folder as well. You may request another OTP after a minute by clicking Resend OTP."
this.popUpSnackBar(message,25000);
this.showOtpSection = false;
this.showOtpVerifySection = true;
this.disableSubmitButton = false;
Expand All @@ -147,7 +152,8 @@ export class ForgotPasswordComponent implements OnInit {

successResendOTP(res) {
if (res) {
this.popUpSnackBar();
let message = "Your OTP is sent to your email address again. It may take few minutes for the email delivery. Please check your promotions/spam folder as well. You may request another OTP after a minute by clicking Resend OTP."
this.popUpSnackBar(message,25000);
this.disableResendButton = true;
// this.showResetPasswordSection=true;
// this.disableResendButton=false;
Expand All @@ -166,6 +172,8 @@ export class ForgotPasswordComponent implements OnInit {
this.showOtpVerifySection = false;
this.showResetPasswordSection = true;
this.disableSubmitButton = false;
let message = "OTP is verified! Please reset your password"
this.popUpSnackBar(message,6000);
}
else
alert(res);
Expand All @@ -175,7 +183,12 @@ export class ForgotPasswordComponent implements OnInit {
successResetPassword(res) {
if (res) {
this.disableSubmitButton = false;
this.routing.navigate(["/provider/login"]);
this.router.navigate(['/provider/login']).then((navigated: boolean) => {
if(navigated) {
let message = "Your new password is set successfully! Please login with your username and new password"
this.popUpSnackBar(message , 7000)
}
});
}
else
alert(res);
Expand Down
Loading

0 comments on commit 9cff575

Please sign in to comment.