Implement create account step (#3073)
This commit is contained in:
parent
c0bcdf4637
commit
5ed6b9fb74
|
@ -28,12 +28,13 @@
|
||||||
Start your 7-Day free trial of Bitwarden for {{ org }}
|
Start your 7-Day free trial of Bitwarden for {{ org }}
|
||||||
</h2>
|
</h2>
|
||||||
</div>
|
</div>
|
||||||
<app-vertical-stepper linear>
|
<app-vertical-stepper #stepper linear>
|
||||||
<!-- Content is for demo purposes. Replace with form components for each step-->
|
<!-- Content is for demo purposes. Replace with form components for each step-->
|
||||||
<app-vertical-step label="Create Account" [editable]="false">
|
<app-vertical-step label="Create Account" [editable]="false" [subLabel]="email">
|
||||||
<!-- Replace content with Registration step -->
|
<app-register-form
|
||||||
<p>This is content of "Step 1" that has editable set to false</p>
|
[isInTrialFlow]="true"
|
||||||
<button bitButton buttonType="primary" cdkStepperNext>Complete step</button>
|
(createdAccount)="createdAccount($event)"
|
||||||
|
></app-register-form>
|
||||||
</app-vertical-step>
|
</app-vertical-step>
|
||||||
<app-vertical-step label="Create Organization" subLabel="It better be a good org">
|
<app-vertical-step label="Create Organization" subLabel="It better be a good org">
|
||||||
<!-- Replace with Org creation step -->
|
<!-- Replace with Org creation step -->
|
||||||
|
|
|
@ -1,7 +1,9 @@
|
||||||
import { Component, OnInit } from "@angular/core";
|
import { Component, OnInit, ViewChild } from "@angular/core";
|
||||||
import { ActivatedRoute } from "@angular/router";
|
import { ActivatedRoute } from "@angular/router";
|
||||||
import { first } from "rxjs";
|
import { first } from "rxjs";
|
||||||
|
|
||||||
|
import { VerticalStepperComponent } from "../vertical-stepper/vertical-stepper.component";
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: "app-trial",
|
selector: "app-trial",
|
||||||
templateUrl: "trial-initiation.component.html",
|
templateUrl: "trial-initiation.component.html",
|
||||||
|
@ -9,6 +11,7 @@ import { first } from "rxjs";
|
||||||
export class TrialInitiationComponent implements OnInit {
|
export class TrialInitiationComponent implements OnInit {
|
||||||
email = "";
|
email = "";
|
||||||
org = "teams";
|
org = "teams";
|
||||||
|
@ViewChild("stepper", { static: true }) verticalStepper: VerticalStepperComponent;
|
||||||
|
|
||||||
constructor(private route: ActivatedRoute) {}
|
constructor(private route: ActivatedRoute) {}
|
||||||
|
|
||||||
|
@ -22,4 +25,9 @@ export class TrialInitiationComponent implements OnInit {
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
createdAccount(email: string) {
|
||||||
|
this.email = email;
|
||||||
|
this.verticalStepper.next();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
@ -3,6 +3,7 @@ import { NgModule } from "@angular/core";
|
||||||
|
|
||||||
import { FormFieldModule } from "@bitwarden/components";
|
import { FormFieldModule } from "@bitwarden/components";
|
||||||
|
|
||||||
|
import { RegisterFormModule } from "../register-form/register-form.module";
|
||||||
import { SharedModule } from "../shared.module";
|
import { SharedModule } from "../shared.module";
|
||||||
import { VerticalStepperModule } from "../vertical-stepper/vertical-stepper.module";
|
import { VerticalStepperModule } from "../vertical-stepper/vertical-stepper.module";
|
||||||
|
|
||||||
|
@ -12,7 +13,13 @@ import { TeamsContentComponent } from "./teams-content.component";
|
||||||
import { TrialInitiationComponent } from "./trial-initiation.component";
|
import { TrialInitiationComponent } from "./trial-initiation.component";
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [SharedModule, CdkStepperModule, VerticalStepperModule, FormFieldModule],
|
imports: [
|
||||||
|
SharedModule,
|
||||||
|
CdkStepperModule,
|
||||||
|
VerticalStepperModule,
|
||||||
|
FormFieldModule,
|
||||||
|
RegisterFormModule,
|
||||||
|
],
|
||||||
declarations: [
|
declarations: [
|
||||||
TrialInitiationComponent,
|
TrialInitiationComponent,
|
||||||
EnterpriseContentComponent,
|
EnterpriseContentComponent,
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
import { Directive, OnInit } from "@angular/core";
|
import { Directive, EventEmitter, Input, OnInit, Output } from "@angular/core";
|
||||||
import { FormBuilder, Validators } from "@angular/forms";
|
import { FormBuilder, Validators } from "@angular/forms";
|
||||||
import { Router } from "@angular/router";
|
import { Router } from "@angular/router";
|
||||||
|
|
||||||
|
@ -28,6 +28,9 @@ import { CaptchaProtectedComponent } from "./captchaProtected.component";
|
||||||
|
|
||||||
@Directive()
|
@Directive()
|
||||||
export class RegisterComponent extends CaptchaProtectedComponent implements OnInit {
|
export class RegisterComponent extends CaptchaProtectedComponent implements OnInit {
|
||||||
|
@Input() isInTrialFlow = false;
|
||||||
|
@Output() createdAccount = new EventEmitter<string>();
|
||||||
|
|
||||||
showPassword = false;
|
showPassword = false;
|
||||||
formPromise: Promise<any>;
|
formPromise: Promise<any>;
|
||||||
masterPasswordScore: number;
|
masterPasswordScore: number;
|
||||||
|
@ -194,7 +197,11 @@ export class RegisterComponent extends CaptchaProtectedComponent implements OnIn
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
this.platformUtilsService.showToast("success", null, this.i18nService.t("newAccountCreated"));
|
this.platformUtilsService.showToast("success", null, this.i18nService.t("newAccountCreated"));
|
||||||
this.router.navigate([this.successRoute], { queryParams: { email: email } });
|
if (this.isInTrialFlow) {
|
||||||
|
this.createdAccount.emit(this.formGroup.get("email")?.value);
|
||||||
|
} else {
|
||||||
|
this.router.navigate([this.successRoute], { queryParams: { email: email } });
|
||||||
|
}
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
this.logService.error(e);
|
this.logService.error(e);
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue