memer totp code server communication test

This commit is contained in:
geek 2018-03-14 20:22:29 +09:00
parent a79ebe711a
commit 0b5503e94b
6 changed files with 64 additions and 22 deletions

View File

@ -1,16 +1,14 @@
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { Routes, RouterModule } from '@angular/router'; import { Routes, RouterModule } from '@angular/router';
import {MemberPageComponent} from './member-page.component'; import { MemberPageComponent } from './member-page.component';
import { TotpComponent } from '../../../../packages/settings/member/component/totp/totp.component';
const routes: Routes = [ const routes: Routes = [
{ {
path: '', path: '',
component: MemberPageComponent, component: MemberPageComponent,
// children: [ children: [
// { path: '', component: ProbeListComponent }, { path: '', component: TotpComponent },
// { path: 'noauth', component: NoauthListComponent }, ]
// { path: 'download', component: DownloadComponent },
// ]
} }
]; ];

View File

@ -24,9 +24,9 @@
<mat-card-subtitle>X6AWAK573M5372NM</mat-card-subtitle> <mat-card-subtitle>X6AWAK573M5372NM</mat-card-subtitle>
</mat-card-header> </mat-card-header>
<mat-card-content> <mat-card-content>
<form fxLayout="column" fxLayoutAlign="start stretch" [formGroup]="totpForm" (ngSubmit)="regist()"> <form fxLayout="column" fxLayoutAlign="start stretch" [formGroup]="totpForm" (ngSubmit)="registClick()">
<mat-form-field class="full-width"> <mat-form-field class="full-width">
<input type="number" id="code" class="input" placeholder="Please enter your code" <input type="text" id="code" class="input" placeholder="Please enter your code"
formControlName="code" required matInput> formControlName="code" required matInput>
</mat-form-field> </mat-form-field>
<!--<div *ngIf="formErrors.email" class="help is-danger">--> <!--<div *ngIf="formErrors.email" class="help is-danger">-->

View File

@ -1,8 +1,11 @@
import { Component, OnInit } from '@angular/core'; import { Component, OnInit } from '@angular/core';
import { ActivatedRoute, Router } from '@angular/router'; import { ActivatedRoute, Router } from '@angular/router';
import * as TotpStore from '../../store/totp'; import * as TotpStore from '../../store/totp';
import { Store } from '@ngrx/store'; import { Store, select } from '@ngrx/store';
import {FormBuilder} from '@angular/forms'; import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { TotpSelector } from '../../store';
import {AuthSelector} from "../../../../member/store/index";
import {Member} from "../../../../member/model/Member";
@Component({ @Component({
selector: 'of-totp', selector: 'of-totp',
@ -10,7 +13,14 @@ import {FormBuilder} from '@angular/forms';
styleUrls: ['./totp.component.scss'] styleUrls: ['./totp.component.scss']
}) })
export class TotpComponent implements OnInit { export class TotpComponent implements OnInit {
pending$ = this.store.pipe(select(TotpSelector.select('pending')));
error$ = this.store.pipe(select(TotpSelector.select('error')));
errorMessage: string | null;
totpForm: FormGroup;
formErrors = {
'code': '',
};
constructor(private activatedRoute: ActivatedRoute, constructor(private activatedRoute: ActivatedRoute,
private router: Router, private router: Router,
private store: Store<TotpStore.State>, private store: Store<TotpStore.State>,
@ -18,6 +28,40 @@ export class TotpComponent implements OnInit {
) { } ) { }
ngOnInit() { ngOnInit() {
this.totpForm = this.formBuilder.group({
'code': [
[
]
]
})
this.pending$.subscribe((pending: boolean) => {
if (pending) {
this.totpForm.disable();
} else {
this.totpForm.enable();
}
});
this.error$.subscribe((error) => {
if (error) {
this.errorMessage = error.exception;
} else {
this.errorMessage = null;
}
});
} }
registClick() {
const code = this.totpForm.value['code'];
const secretCode = 'X6AWAK573M5372NM';
this.store.select(AuthSelector.select('member')).subscribe(
(member: Member) => {
this.store.dispatch(new TotpStore.Regist({ member, secretCode, code }));
},
(error) => {
console.log(error);
}
);
}
} }

View File

@ -16,15 +16,15 @@ export class MemberTotpService {
public createTotp(member: Member): Observable<MemberTotp[]> { public createTotp(member: Member): Observable<MemberTotp[]> {
// Todo Store get member object // Todo Store get member object
return this.rpcClient.call<MemberTotp[]>('MemberTotpService.createTotp', {id: '1'}); return this.rpcClient.call<MemberTotp[]>('MemberTotpService.createTotp', {Member: {id:1}});
} }
public regist(member: Member, secretCode: string, code: string): Observable<boolean> { public regist(member: Member, secretCode: string, code: string): Observable<boolean> {
const param = { // const param = {
Member: {id: 1, }, // Member: {id: 1, },
MemberTotp: {id: 1, secretCode: 'dkdkdkdk'}, // MemberTotp: {id: 1, secretCode: 'dkdkdkdk'},
code: '123123' // code: '123123'
}; // };
return this.rpcClient.call<boolean>('MemberTotpService.regist', param); return this.rpcClient.call<boolean>('MemberTotpService.regist', member, secretCode, code);
} }
} }

View File

@ -24,7 +24,7 @@ export const EFFECTS = [
export const selectMemberTotpState = createFeatureSelector<State>(MODULE.name); export const selectMemberTotpState = createFeatureSelector<State>(MODULE.name);
export const AuthSelector = new StateSelector<TotpStore.State>(createSelector( export const TotpSelector = new StateSelector<TotpStore.State>(createSelector(
selectMemberTotpState, selectMemberTotpState,
(state: State) => state.totp (state: State) => state.totp
)); ));

View File

@ -9,9 +9,9 @@ export enum ActionType {
CreateTotpSuccess = '[member.totp] CreateTotpSuccess', CreateTotpSuccess = '[member.totp] CreateTotpSuccess',
CreateTotpFailure = '[member.totp] CreateTotpFailure', CreateTotpFailure = '[member.totp] CreateTotpFailure',
Regist = '[member.auth] SigninCookie', Regist = '[member.totp] Regist',
RegistSuccess = '[member.auth] SigninCookieSuccess', RegistSuccess = '[member.totp] RegistSuccess',
RegistFailure = '[member.auth] SigninCookieFailure', RegistFailure = '[member.totp] RegistFailure',
} }
export class CreateTotp implements Action { export class CreateTotp implements Action {