...
 
Commits (4)
......@@ -189,3 +189,9 @@ ActionBar,
background-color: #0092a8;
color: #0092a8;
}
.text-link {
font-weight: bold;
color: #0092a8;
text-decoration: underline;
}
<Label class="p-10 m-b-10" text="Backup Code: "></Label>
<Label class="p-10 m-b-10" [text]="code"></Label>
<Button
<StackLayout #printArea>
<Label class="p-10 m-b-10" text="Backup Code: "></Label>
<Label class="p-10 m-b-10" [text]="code"></Label>
<Button
(tap)="generateBarcode()"
id="barcode"
text="Step 3: Generate Backup Code Page"
></Button>
<Image
></Button>
<Image
#barcodeImg
id="barcode-img"
height="500"
stretch="aspectFill"
class="text-center"
></Image>
<app-button text="Step 4: Print" type="text" (tap)="print()"></app-button>
></Image>
<app-button text="Step 4: Print" type="text" (tap)="print()"></app-button>
</StackLayout>
import { Component, Input, ViewChild } from "@angular/core";
import { Component, Input, ViewChild, ElementRef } from "@angular/core";
import { Printer } from "nativescript-printer";
import { Image } from "tns-core-modules/ui/image";
......
<Scrollview #printArea>
<StackLayout class="auth-form-body">
<ns-action-bar-container></ns-action-bar-container>
<account-frame
title="Change Backup Code"
submitText="Next"
(onSubmit)="onSubmit()"
>
<Label class="text-label m-b-20" textWrap="true" (tap)="learnMore()">
<FormattedString>
<Span
text="Replace your old backup code with a new one. Not sure what this is? "
></Span>
<Span text="Learn More &#8250;" class="text-link"></Span>
</FormattedString>
</Label>
<app-non-field-errors
*ngIf="nonFieldErrors"
[nonFieldErrors]="nonFieldErrors"
></app-non-field-errors>
<app-text-field
#password
autocorrect="false"
autocapitalizationType="none"
type="password"
label="Step 1: Verify Password"
label="Verify Password"
returnKeyType="next"
[isFormSubmitted]="form.isSubmitted"
[ngrxFormControl]="form.controls.oldPassword"
></app-text-field>
<app-button text="Step 2: Submit" (tap)="onSubmit()"></app-button>
<progress-indicator
[inProgress]="hasStarted"
inProgressText="Verifying"
></progress-indicator>
<app-download-backup-code
*ngIf="hasFinished"
[code]="backupCode"
></app-download-backup-code>
</StackLayout>
</Scrollview>
</account-frame>
......@@ -38,7 +38,6 @@ export class ManageBackupCodeComponent implements OnDestroy {
onSubmit() {
if (this.form.isValid) {
alert("submitted and valid");
this.newBackupCode.emit();
}
}
......@@ -46,4 +45,8 @@ export class ManageBackupCodeComponent implements OnDestroy {
ngOnDestroy() {
this.reset.emit();
}
learnMore() {
alert("TODO: create learn more page and navigate to it");
}
}
......@@ -47,8 +47,8 @@ export class SideDrawer {
templates: [
{ title: "Passwords" },
// {title: "Groups"},
{ title: "Change Account Password" },
{ title: "Manage Backup Code" },
{ title: "Change Account Password & Backup Code" },
{ title: "Change Backup Code" },
{ title: "Import" },
{ title: "Export" },
{ title: "Error Reporting" },
......
......@@ -37,13 +37,11 @@
</FlexboxLayout>
<StackLayout orientation="vertical">
<Label
class="p-10 m-b-10"
<app-non-field-errors
*ngIf="nonFieldErrors"
[text]="nonFieldErrors"
backgroundColor="#f0f0f0"
flexGrow="1"
></Label>
[nonFieldErrors]="nonFieldErrors"
></app-non-field-errors>
<ng-content></ng-content>
</StackLayout>
</StackLayout>
......
import { Component, Input } from "@angular/core";
@Component({
selector: "app-non-field-errors",
template: `
<Label
class="p-10 m-b-10"
[text]="nonFieldErrors"
backgroundColor="#f0f0f0"
flexGrow="1"
></Label>
`
})
export class NonFieldErrorsComponent {
@Input() nonFieldErrors?: string[];
}
......@@ -16,6 +16,7 @@ import { NsCheckboxComponent } from "./ns-checkbox/ns-checkbox.component";
import { ServerSelectComponent } from "./server-select/server-select.component";
import { AccountFrameComponent } from "./account-frame/account-frame.component";
import { BulletListComponent } from "./bullet-list/bullet-list.component.tns";
import { NonFieldErrorsComponent } from "./non-field-errors/non-field-errors.component";
export const COMPONENTS = [
ButtonComponent,
......@@ -29,7 +30,8 @@ export const COMPONENTS = [
TextLinkComponent,
ServerSelectComponent,
AccountFrameComponent,
BulletListComponent
BulletListComponent,
NonFieldErrorsComponent
];
@NgModule({
......