Commit ec1245d5 authored by dev0tion's avatar dev0tion

Make create form a reactive form

parent e6bcd1ba
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormControl, Validators, FormBuilder } from '@angular/forms';
import { Router } from '@angular/router';
import { GlobalService } from '../shared/services/global.service';
import { ApiService } from '../shared/services/api.service';
import { WalletLoad } from '../shared/classes/wallet-load';
import { FormGroup, FormControl, Validators, FormBuilder } from '@angular/forms';
@Component({
selector: 'app-login',
......
......@@ -2,26 +2,26 @@
<h1>
Please create a new wallet.
</h1>
<div class="form-group">
<label for="name">Name:</label>
<input class="form-control" type="text" #walletName required>
</div>
<div class="form-group">
<label for="password">Password:</label>
<input class="form-control" type="password" #walletPassword required>
</div>
<div class="form-group">
<label for="networklabel">Network:</label>
<select name="network" #walletNetwork>
<form [formGroup]="createWalletForm" (ngSubmit)="onCreateClicked()">
<div class="form-group">
<label>Name:</label>
<input class="form-control" formControlName="walletName" type="text" placeholder="Enter a name for your wallet.">
</div>
<div class="form-group">
<label>Password:</label>
<input class="form-control" formControlName="walletPassword" type="password" placeholder="Enter a password for your wallet.">
</div>
<div class="form-group">
<label>Network:</label>
<select name="network" formControlName="selectNetwork">
<option value="main">Main</option>
<option value="test">Testnet</option>
</select>
</div>
<div class="form-group">
<label for="path">Path:</label>
<input class="form-control" type="text" #walletPath required>
</div>
<button type="submit" (click)="createWallet(walletPassword.value, walletNetwork.value, walletPath.value, walletName.value)">Create</button>
</div>
<div class="form-group">
<button type="submit" [disabled]="!createWalletForm.valid" class="btn btn-success">Create Wallet</button>
</div>
</form>
<div>
<label>Mnemonic:</label>
</div>
......
import { Component, Injectable } from '@angular/core';
import { FormGroup, FormControl, Validators, FormBuilder } from '@angular/forms';
import { GlobalService } from '../../shared/services/global.service';
import { ApiService } from '../../shared/services/api.service';
import { WalletCreation } from '../../shared/classes/wallet-creation';
......@@ -12,22 +14,28 @@ import { Mnemonic } from '../../shared/classes/mnemonic';
})
export class CreateComponent {
constructor(private apiService: ApiService) {}
constructor(private globalService: GlobalService, private apiService: ApiService, private fb: FormBuilder) {
this.createWalletForm = fb.group({
"walletName": ["", Validators.required],
"walletPassword": ["", Validators.required],
"selectNetwork": ["main", Validators.required]
});
}
private newWallet: WalletCreation;
private createWalletForm: FormGroup;
private responseMessage: string;
private errorMessage: string;
private createWallet(password: string, network: string, folderPath: string, name: string, ) {
this.newWallet = new WalletCreation();
this.newWallet.password = password;
this.newWallet.network = network;
this.newWallet.folderPath = folderPath;
this.newWallet.name = name;
private onCreateClicked() {
this.newWallet = new WalletCreation(this.createWalletForm.get("walletPassword").value, this.createWalletForm.get("selectNetwork").value, this.globalService.getWalletPath(), this.createWalletForm.get("walletName").value);
this.createWallet(this.newWallet);
}
private createWallet(wallet: WalletCreation) {
this.apiService
.createWallet(this.newWallet)
.createWallet(wallet)
.subscribe(
response => {
if (response.status >= 200 && response.status < 400){
......
......@@ -8,8 +8,8 @@ import { RecoverComponent } from './recover/recover.component';
const routes: Routes = [
{ path: '', redirectTo: 'setup', pathMatch: 'full'},
{ path: 'setup', component: SetupComponent },
{ path: 'setup/create', component: CreateComponent },
{ path: 'setup/recover', component: RecoverComponent }
{ path: 'create', component: CreateComponent },
{ path: 'recover', component: RecoverComponent }
];
@NgModule({
......
import { CommonModule } from '@angular/common';
import { NgModule } from '@angular/core';
import { ReactiveFormsModule } from '@angular/forms';
import { SetupComponent } from './setup.component';
import { CreateComponent } from './create/create.component';
......@@ -12,6 +13,7 @@ import { RecoverComponent } from './recover/recover.component';
@NgModule({
imports: [
CommonModule,
ReactiveFormsModule,
SetupRoutingModule,
SharedModule.forRoot()
],
......
export class WalletCreation {
constructor(password: string, network:string, folderPath: string, name: string) {
this.password = password;
this.network = network;
this.folderPath = folderPath;
this.name = name;
}
password: string;
network: string;
folderPath: string;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment