got to the previous page in history after device was added
Chris Veilleux
parent
4a5a146536
commit
21ae056716
|
|
@ -1,130 +1,129 @@
|
||||||
|
<!-- Show a horizontal stepper on larger devices -->
|
||||||
|
<mat-horizontal-stepper *ngIf="!alignVertical" labelPosition="bottom">
|
||||||
|
<!-- Use font awesome icons in the stepper to indicate progress -->
|
||||||
|
<ng-template matStepperIcon="done">
|
||||||
|
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
||||||
|
</ng-template>
|
||||||
|
<ng-template matStepperIcon="edit">
|
||||||
|
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
||||||
|
</ng-template>
|
||||||
|
|
||||||
<!-- Show a horizontal stepper on larger devices -->
|
<mat-step label="Preferences" *ngIf="!preferences" [stepControl]="preferencesForm">
|
||||||
<mat-horizontal-stepper *ngIf="!alignVertical" labelPosition="bottom">
|
<form [formGroup]="preferencesForm" (ngSubmit)="onPreferencesSubmit()">
|
||||||
<!-- Use font awesome icons in the stepper to indicate progress -->
|
<account-device-preferences
|
||||||
<ng-template matStepperIcon="done">
|
[preferencesForm]="preferencesForm"
|
||||||
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
[deviceSetup]="true"
|
||||||
</ng-template>
|
>
|
||||||
<ng-template matStepperIcon="edit">
|
</account-device-preferences>
|
||||||
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<mat-step label="Preferences" *ngIf="!preferences" [stepControl]="preferencesForm">
|
|
||||||
<form [formGroup]="preferencesForm" (ngSubmit)="onPreferencesSubmit()">
|
|
||||||
<account-device-preferences
|
|
||||||
[preferencesForm]="preferencesForm"
|
|
||||||
[deviceSetup]="true"
|
|
||||||
>
|
|
||||||
</account-device-preferences>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
|
||||||
<button mat-button matStepperNext [disabled]="!preferencesForm.valid">
|
|
||||||
NEXT
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</mat-step>
|
|
||||||
|
|
||||||
<mat-step label="Defaults" *ngIf="!preferences" [stepControl]="defaultsForm">
|
|
||||||
<form [formGroup]="defaultsForm" (ngSubmit)="onDefaultsSubmit()">
|
|
||||||
<account-device-edit
|
|
||||||
[deviceForm]="defaultsForm"
|
|
||||||
[action]="'default setup'"
|
|
||||||
>
|
|
||||||
</account-device-edit>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
|
||||||
<button mat-button matStepperNext [disabled]="!defaultsForm.valid">
|
|
||||||
NEXT
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</mat-step>
|
|
||||||
|
|
||||||
<mat-step label="Device" [stepControl]="deviceForm">
|
|
||||||
<form [formGroup]="deviceForm" (ngSubmit)="onDeviceSubmit()">
|
|
||||||
<account-device-edit
|
|
||||||
[deviceForm]="deviceForm"
|
|
||||||
[action]="'device setup'"
|
|
||||||
[defaults]="defaults"
|
|
||||||
>
|
|
||||||
</account-device-edit>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
|
||||||
<button mat-button matStepperNext [disabled]="!deviceForm.valid">
|
|
||||||
NEXT
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</mat-step>
|
|
||||||
|
|
||||||
<mat-step label="Done!">
|
|
||||||
<account-device-add-complete [wakeWord]="deviceForm.controls['wakeWord'].value">
|
|
||||||
</account-device-add-complete>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
<button mat-button>FINISHED</button>
|
<button mat-button matStepperNext [disabled]="!preferencesForm.valid">
|
||||||
|
NEXT
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</mat-step>
|
</form>
|
||||||
</mat-horizontal-stepper>
|
</mat-step>
|
||||||
|
|
||||||
<!-- Show a vertical stepper on smaller devices -->
|
<mat-step label="Defaults" *ngIf="!preferences" [stepControl]="defaultsForm">
|
||||||
<mat-vertical-stepper *ngIf="alignVertical">
|
<form [formGroup]="defaultsForm" (ngSubmit)="onDefaultsSubmit()">
|
||||||
<!-- Use font awesome icons in the stepper to indicate progress -->
|
<account-device-edit
|
||||||
<ng-template matStepperIcon="done">
|
[deviceForm]="defaultsForm"
|
||||||
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
[action]="'default setup'"
|
||||||
</ng-template>
|
>
|
||||||
<ng-template matStepperIcon="edit">
|
</account-device-edit>
|
||||||
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
|
||||||
</ng-template>
|
|
||||||
|
|
||||||
<mat-step label="Preferences" *ngIf="!preferences" [stepControl]="preferencesForm">
|
|
||||||
<form [formGroup]="preferencesForm" (ngSubmit)="onPreferencesSubmit()">
|
|
||||||
<account-device-preferences
|
|
||||||
[preferencesForm]="preferencesForm"
|
|
||||||
[deviceSetup]="true"
|
|
||||||
>
|
|
||||||
</account-device-preferences>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
|
||||||
<button mat-button matStepperNext [disabled]="!preferencesForm.valid">
|
|
||||||
NEXT
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</mat-step>
|
|
||||||
|
|
||||||
<mat-step label="Defaults" *ngIf="!preferences" [stepControl]="defaultsForm">
|
|
||||||
<form [formGroup]="defaultsForm" (ngSubmit)="onDefaultsSubmit()">
|
|
||||||
<account-device-edit
|
|
||||||
[deviceForm]="defaultsForm"
|
|
||||||
[action]="'default setup'"
|
|
||||||
>
|
|
||||||
</account-device-edit>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
|
||||||
<button mat-button matStepperNext [disabled]="!defaultsForm.valid">
|
|
||||||
NEXT
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</mat-step>
|
|
||||||
|
|
||||||
<mat-step label="Device" [stepControl]="deviceForm">
|
|
||||||
<form [formGroup]="deviceForm" (ngSubmit)="onDeviceSubmit()">
|
|
||||||
<account-device-edit
|
|
||||||
[deviceForm]="deviceForm"
|
|
||||||
[action]="'device setup'"
|
|
||||||
[defaults]="defaults"
|
|
||||||
>
|
|
||||||
</account-device-edit>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
|
||||||
<button mat-button matStepperNext [disabled]="!deviceForm.valid">
|
|
||||||
NEXT
|
|
||||||
</button>
|
|
||||||
</div>
|
|
||||||
</form>
|
|
||||||
</mat-step>
|
|
||||||
|
|
||||||
<mat-step label="Done!">
|
|
||||||
<account-device-add-complete [wakeWord]="deviceForm.controls['wakeWord'].value">
|
|
||||||
</account-device-add-complete>
|
|
||||||
<div fxLayout="row" fxLayoutAlign="end">
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
<button mat-button>FINISHED</button>
|
<button mat-button matStepperNext [disabled]="!defaultsForm.valid">
|
||||||
|
NEXT
|
||||||
|
</button>
|
||||||
</div>
|
</div>
|
||||||
</mat-step>
|
</form>
|
||||||
</mat-vertical-stepper>
|
</mat-step>
|
||||||
|
|
||||||
|
<mat-step label="Device" [stepControl]="deviceForm">
|
||||||
|
<form [formGroup]="deviceForm" (ngSubmit)="onDeviceSubmit()">
|
||||||
|
<account-device-edit
|
||||||
|
[deviceForm]="deviceForm"
|
||||||
|
[action]="'device setup'"
|
||||||
|
[defaults]="defaults"
|
||||||
|
>
|
||||||
|
</account-device-edit>
|
||||||
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
|
<button mat-button matStepperNext [disabled]="!deviceForm.valid">
|
||||||
|
NEXT
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</mat-step>
|
||||||
|
|
||||||
|
<mat-step label="Done!">
|
||||||
|
<account-device-add-complete [wakeWord]="deviceForm.controls['wakeWord'].value">
|
||||||
|
</account-device-add-complete>
|
||||||
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
|
<button mat-button (click)="onFinished()">FINISHED</button>
|
||||||
|
</div>
|
||||||
|
</mat-step>
|
||||||
|
</mat-horizontal-stepper>
|
||||||
|
|
||||||
|
<!-- Show a vertical stepper on smaller devices -->
|
||||||
|
<mat-vertical-stepper *ngIf="alignVertical">
|
||||||
|
<!-- Use font awesome icons in the stepper to indicate progress -->
|
||||||
|
<ng-template matStepperIcon="done">
|
||||||
|
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
||||||
|
</ng-template>
|
||||||
|
<ng-template matStepperIcon="edit">
|
||||||
|
<fa-icon [icon]="stepDoneIcon"></fa-icon>
|
||||||
|
</ng-template>
|
||||||
|
|
||||||
|
<mat-step label="Preferences" *ngIf="!preferences" [stepControl]="preferencesForm">
|
||||||
|
<form [formGroup]="preferencesForm" (ngSubmit)="onPreferencesSubmit()">
|
||||||
|
<account-device-preferences
|
||||||
|
[preferencesForm]="preferencesForm"
|
||||||
|
[deviceSetup]="true"
|
||||||
|
>
|
||||||
|
</account-device-preferences>
|
||||||
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
|
<button mat-button matStepperNext [disabled]="!preferencesForm.valid">
|
||||||
|
NEXT
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</mat-step>
|
||||||
|
|
||||||
|
<mat-step label="Defaults" *ngIf="!preferences" [stepControl]="defaultsForm">
|
||||||
|
<form [formGroup]="defaultsForm" (ngSubmit)="onDefaultsSubmit()">
|
||||||
|
<account-device-edit
|
||||||
|
[deviceForm]="defaultsForm"
|
||||||
|
[action]="'default setup'"
|
||||||
|
>
|
||||||
|
</account-device-edit>
|
||||||
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
|
<button mat-button matStepperNext [disabled]="!defaultsForm.valid">
|
||||||
|
NEXT
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</mat-step>
|
||||||
|
|
||||||
|
<mat-step label="Device" [stepControl]="deviceForm">
|
||||||
|
<form [formGroup]="deviceForm" (ngSubmit)="onDeviceSubmit()">
|
||||||
|
<account-device-edit
|
||||||
|
[deviceForm]="deviceForm"
|
||||||
|
[action]="'device setup'"
|
||||||
|
[defaults]="defaults"
|
||||||
|
>
|
||||||
|
</account-device-edit>
|
||||||
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
|
<button mat-button matStepperNext [disabled]="!deviceForm.valid">
|
||||||
|
NEXT
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
</form>
|
||||||
|
</mat-step>
|
||||||
|
|
||||||
|
<mat-step label="Done!">
|
||||||
|
<account-device-add-complete [wakeWord]="deviceForm.controls['wakeWord'].value">
|
||||||
|
</account-device-add-complete>
|
||||||
|
<div fxLayout="row" fxLayoutAlign="end">
|
||||||
|
<button mat-button (click)="onFinished()">FINISHED</button>
|
||||||
|
</div>
|
||||||
|
</mat-step>
|
||||||
|
</mat-vertical-stepper>
|
||||||
|
|
|
||||||
|
|
@ -1,18 +1,14 @@
|
||||||
import { Component, OnInit } from '@angular/core';
|
import { Component, OnInit } from '@angular/core';
|
||||||
import { MediaChange, MediaObserver } from '@angular/flex-layout';
|
import { MediaChange, MediaObserver } from '@angular/flex-layout';
|
||||||
import {
|
import {FormBuilder, FormGroup, Validators } from '@angular/forms';
|
||||||
FormBuilder,
|
|
||||||
FormGroup,
|
|
||||||
Validators
|
|
||||||
} from '@angular/forms';
|
|
||||||
import { ActivatedRoute } from '@angular/router';
|
import { ActivatedRoute } from '@angular/router';
|
||||||
|
|
||||||
import { faCheck } from '@fortawesome/free-solid-svg-icons';
|
import { faCheck } from '@fortawesome/free-solid-svg-icons';
|
||||||
import { Subscription } from 'rxjs';
|
import { Subscription } from 'rxjs';
|
||||||
|
|
||||||
import { AccountPreferences } from '../../../../shared/models/preferences.model';
|
import { AccountDefaults } from '@account/models/defaults.model';
|
||||||
import { DeviceService } from '../../../../core/http/device.service';
|
import { AccountPreferences } from '@account/models/preferences.model';
|
||||||
import { AccountDefaults } from '../../../../shared/models/defaults.model';
|
import { DeviceService } from '@account/http/device.service';
|
||||||
|
|
||||||
@Component({
|
@Component({
|
||||||
selector: 'account-device-add',
|
selector: 'account-device-add',
|
||||||
|
|
@ -114,4 +110,8 @@ export class DeviceAddComponent implements OnInit {
|
||||||
onDefaultsSubmit() {
|
onDefaultsSubmit() {
|
||||||
this.deviceService.addAccountDefaults(this.defaultsForm).subscribe();
|
this.deviceService.addAccountDefaults(this.defaultsForm).subscribe();
|
||||||
}
|
}
|
||||||
|
|
||||||
|
onFinished() {
|
||||||
|
window.history.back();
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue