ing
This commit is contained in:
parent
26593a1507
commit
e1cf7d74b6
|
@ -12,6 +12,9 @@ import { CovalentModule } from './commons/ui/covalent/covalent.module';
|
||||||
|
|
||||||
import { AppComponent } from './app.component';
|
import { AppComponent } from './app.component';
|
||||||
|
|
||||||
|
import { RESTService } from './commons/service/rest.service';
|
||||||
|
import { RPCService } from './commons/service/rpc.service';
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
declarations: [
|
declarations: [
|
||||||
AppComponent,
|
AppComponent,
|
||||||
|
@ -25,6 +28,9 @@ import { AppComponent } from './app.component';
|
||||||
CovalentModule,
|
CovalentModule,
|
||||||
HttpClientModule,
|
HttpClientModule,
|
||||||
],
|
],
|
||||||
|
providers: [
|
||||||
|
RESTService, RPCService,
|
||||||
|
],
|
||||||
bootstrap: [AppComponent]
|
bootstrap: [AppComponent]
|
||||||
})
|
})
|
||||||
export class AppModule { }
|
export class AppModule { }
|
||||||
|
|
|
@ -1,2 +0,0 @@
|
||||||
export interface State {
|
|
||||||
}
|
|
|
@ -4,31 +4,45 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
|
||||||
import { Observable } from 'rxjs/Observable';
|
import { Observable } from 'rxjs/Observable';
|
||||||
|
|
||||||
import 'rxjs/add/operator/do';
|
import 'rxjs/add/operator/do';
|
||||||
|
import 'rxjs/add/operator/timeout';
|
||||||
|
|
||||||
@Injectable()
|
@Injectable()
|
||||||
export class RESTService {
|
export class RESTService {
|
||||||
private baseURL: string;
|
private baseURL: string;
|
||||||
|
private readonly httpHeaders: HttpHeaders;
|
||||||
|
|
||||||
constructor(
|
constructor(
|
||||||
@Inject(HttpClient) private httpClient: HttpClient,
|
@Inject(HttpClient) private _httpClient: HttpClient,
|
||||||
) {
|
) {
|
||||||
|
this.httpHeaders = new HttpHeaders()
|
||||||
}
|
|
||||||
|
|
||||||
public get<T>(entry: string, ...args: any[]): Observable<T> {
|
|
||||||
const headers: HttpHeaders = new HttpHeaders();
|
|
||||||
headers
|
|
||||||
.set('Accept', 'application/json')
|
.set('Accept', 'application/json')
|
||||||
.set('Content-Type', 'application/json');
|
.set('Content-Type', 'application/json');
|
||||||
|
}
|
||||||
|
|
||||||
this.httpClient
|
public get httpClient(): HttpClient {
|
||||||
.get<T>('')
|
return this._httpClient;
|
||||||
.do(
|
}
|
||||||
(data: any) => {
|
|
||||||
|
|
||||||
}
|
public get<T>(entry: string, params?: {[param: string]: string | string[]}): Observable<T> {
|
||||||
);
|
const headers: HttpHeaders = this.httpHeaders;
|
||||||
return undefined;
|
|
||||||
|
return this._httpClient
|
||||||
|
.get<T>('', {
|
||||||
|
headers: headers,
|
||||||
|
params: params,
|
||||||
|
responseType: 'json',
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
public post<T>(entry: string, body: any | null, params?: {[param: string]: string | string[]}): Observable<T> {
|
||||||
|
const headers: HttpHeaders = this.httpHeaders;
|
||||||
|
|
||||||
|
return this._httpClient
|
||||||
|
.post<T>('', body, {
|
||||||
|
headers: headers,
|
||||||
|
params: params,
|
||||||
|
responseType: 'json',
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
|
@ -33,11 +33,15 @@ export class RPCService {
|
||||||
return undefined;
|
return undefined;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public callTimeout<T>(method: string, ...args: any[]): Observable<T> {
|
||||||
|
return undefined;
|
||||||
|
}
|
||||||
|
|
||||||
public send(method: string, ...args: any[]): void {
|
public send(method: string, ...args: any[]): void {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
private sendData(data: Object): void {
|
private sendInternal(data: Object): void {
|
||||||
this.wsSocketSubject.next(data);
|
this.wsSocketSubject.next(data);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
@ -1,17 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { ModifyComponent } from './modify.component';
|
|
||||||
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
ModifyComponent,
|
|
||||||
],
|
|
||||||
exports: [
|
|
||||||
ModifyComponent
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class ModifyModule { }
|
|
|
@ -1,24 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { ResetPasswordComponent } from './reset-password.component';
|
|
||||||
import { RouterModule } from '@angular/router';
|
|
||||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
||||||
import { MaterialModule } from 'app/commons/ui/material/material.module';
|
|
||||||
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
RouterModule,
|
|
||||||
FormsModule,
|
|
||||||
ReactiveFormsModule,
|
|
||||||
MaterialModule,
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
ResetPasswordComponent,
|
|
||||||
],
|
|
||||||
exports: [
|
|
||||||
ResetPasswordComponent
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class ResetPasswordModule { }
|
|
|
@ -1,25 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { RouterModule } from '@angular/router';
|
|
||||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
||||||
|
|
||||||
import { SigninComponent } from './signin.component';
|
|
||||||
import { MaterialModule } from 'app/commons/ui/material/material.module';
|
|
||||||
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
RouterModule,
|
|
||||||
FormsModule,
|
|
||||||
ReactiveFormsModule,
|
|
||||||
MaterialModule,
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
SigninComponent,
|
|
||||||
],
|
|
||||||
exports: [
|
|
||||||
SigninComponent,
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class SigninModule { }
|
|
|
@ -1,23 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { SignupComponent } from './signup.component';
|
|
||||||
import { MaterialModule } from 'app/commons/ui/material/material.module';
|
|
||||||
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
|
||||||
import { RouterModule } from '@angular/router';
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
RouterModule,
|
|
||||||
FormsModule,
|
|
||||||
ReactiveFormsModule,
|
|
||||||
MaterialModule,
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
SignupComponent,
|
|
||||||
],
|
|
||||||
exports: [
|
|
||||||
SignupComponent
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class SignupModule { }
|
|
36
src/app/packages/member/member-store.module.ts
Normal file
36
src/app/packages/member/member-store.module.ts
Normal file
|
@ -0,0 +1,36 @@
|
||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { StoreModule } from '@ngrx/store';
|
||||||
|
import { StoreDevtoolsModule } from '@ngrx/store-devtools';
|
||||||
|
import {
|
||||||
|
StoreRouterConnectingModule,
|
||||||
|
RouterStateSerializer,
|
||||||
|
} from '@ngrx/router-store';
|
||||||
|
import { EffectsModule } from '@ngrx/effects';
|
||||||
|
import { combineReducers, ActionReducer, ActionReducerMap, MetaReducer } from '@ngrx/store';
|
||||||
|
|
||||||
|
import * as AuthStore from './store/auth';
|
||||||
|
import * as SignupStore from './store/signup';
|
||||||
|
|
||||||
|
|
||||||
|
export interface State {
|
||||||
|
auth: AuthStore.State;
|
||||||
|
signup: SignupStore.Signup;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const reducers = {
|
||||||
|
auth: AuthStore.reducer,
|
||||||
|
signup: SignupStore.reducer,
|
||||||
|
};
|
||||||
|
|
||||||
|
export const EFFECTS = [
|
||||||
|
AuthStore.Effects,
|
||||||
|
SignupStore.Effects,
|
||||||
|
];
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
imports: [
|
||||||
|
StoreModule.forFeature('', reducers),
|
||||||
|
EffectsModule.forFeature(EFFECTS),
|
||||||
|
],
|
||||||
|
})
|
||||||
|
export class MemberStoreModule { }
|
|
@ -1,21 +1,38 @@
|
||||||
import { NgModule } from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import { CommonModule } from '@angular/common';
|
import { CommonModule } from '@angular/common';
|
||||||
import { ModifyModule } from 'app/packages/member/component/modify/modify.module';
|
import { RouterModule } from '@angular/router';
|
||||||
import { SigninModule } from 'app/packages/member/component/signin/signin.module';
|
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
|
||||||
import { SignupModule } from 'app/packages/member/component/signup/signup.module';
|
|
||||||
import { ResetPasswordModule } from 'app/packages/member/component/reset-password/reset-password.module';
|
import { MaterialModule } from 'app/commons/ui/material/material.module';
|
||||||
import { MemberService } from 'app/packages/member/service/member.service';
|
|
||||||
|
import { ModifyComponent } from './component/modify.component';
|
||||||
|
import { SigninComponent } from './component/signin.component';
|
||||||
|
import { SignupComponent } from './component/signup.component';
|
||||||
|
import { ResetPasswordComponent } from './component/reset-password.component';
|
||||||
|
import { MemberService } from './service/member.service';
|
||||||
|
|
||||||
|
import { MemberStoreModule } from './member-store.module';
|
||||||
|
|
||||||
|
export const COMPONENTS = [
|
||||||
|
ModifyComponent,
|
||||||
|
SigninComponent,
|
||||||
|
SignupComponent,
|
||||||
|
ResetPasswordComponent,
|
||||||
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
CommonModule,
|
CommonModule,
|
||||||
ModifyModule,
|
RouterModule,
|
||||||
SigninModule,
|
FormsModule,
|
||||||
SignupModule,
|
ReactiveFormsModule,
|
||||||
ResetPasswordModule,
|
MaterialModule,
|
||||||
|
MemberStoreModule,
|
||||||
],
|
],
|
||||||
|
declarations: COMPONENTS,
|
||||||
|
exports: COMPONENTS,
|
||||||
providers: [
|
providers: [
|
||||||
MemberService,
|
MemberService,
|
||||||
]
|
],
|
||||||
})
|
})
|
||||||
export class MemberModule { }
|
export class MemberModule { }
|
||||||
|
|
|
@ -1,4 +1,4 @@
|
||||||
export class Member {
|
export interface Member {
|
||||||
id: number;
|
id: number;
|
||||||
email: string;
|
email: string;
|
||||||
password: string;
|
password: string;
|
||||||
|
|
|
@ -1,5 +1,9 @@
|
||||||
import { Injectable } from '@angular/core';
|
import { Injectable } from '@angular/core';
|
||||||
import { RPCService } from 'app/commons/service/rpc.service';
|
import { Observable } from 'rxjs/Observable';
|
||||||
|
|
||||||
|
import 'rxjs/add/operator/map';
|
||||||
|
|
||||||
|
import { RESTService } from 'app/commons/service/rest.service';
|
||||||
|
|
||||||
import { Member } from '../model/member';
|
import { Member } from '../model/member';
|
||||||
|
|
||||||
|
@ -7,19 +11,16 @@ import { Member } from '../model/member';
|
||||||
export class MemberService {
|
export class MemberService {
|
||||||
|
|
||||||
public constructor(
|
public constructor(
|
||||||
private rpcService: RPCService,
|
private restService: RESTService,
|
||||||
) {
|
) {
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
public signin(email: string, password: string) {
|
public signin(email: string, password: string): Observable<Member> {
|
||||||
this.rpcService.call<Member>('MemberService.signin', email, password).subscribe(
|
return this.restService.post('/member/signin', '').map((member: Member) => member);
|
||||||
(member: Member) => {
|
}
|
||||||
|
|
||||||
},
|
public signup(member: Member): Observable<Member> {
|
||||||
(error: any) => {
|
return this.restService.post('/member/signup', '').map((_member: Member) => _member);
|
||||||
|
|
||||||
}
|
|
||||||
);
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
59
src/app/packages/member/store/auth.action.ts
Normal file
59
src/app/packages/member/store/auth.action.ts
Normal file
|
@ -0,0 +1,59 @@
|
||||||
|
import { Action } from '@ngrx/store';
|
||||||
|
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
|
||||||
|
export enum ActionType {
|
||||||
|
Signin = '[member.auth] Signin',
|
||||||
|
SigninSuccess = '[member.auth] SigninSuccess',
|
||||||
|
SigninFailure = '[member.auth] SigninFailure',
|
||||||
|
SigninRedirect = '[member.auth] SigninRedirect',
|
||||||
|
Signout = '[member.auth] Signout',
|
||||||
|
SignoutSuccess = '[member.auth] SignoutSuccess',
|
||||||
|
SignoutFailure = '[member.auth] SignoutFailure',
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Signin implements Action {
|
||||||
|
readonly type = ActionType.Signin;
|
||||||
|
|
||||||
|
constructor(public payload: {email: string, password: string}) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SigninSuccess implements Action {
|
||||||
|
readonly type = ActionType.SigninSuccess;
|
||||||
|
|
||||||
|
constructor(public payload: { member: Member }) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SigninFailure implements Action {
|
||||||
|
readonly type = ActionType.SigninFailure;
|
||||||
|
|
||||||
|
constructor(public payload: any) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SigninRedirect implements Action {
|
||||||
|
readonly type = ActionType.SigninRedirect;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Signout implements Action {
|
||||||
|
readonly type = ActionType.Signout;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SignoutSuccess implements Action {
|
||||||
|
readonly type = ActionType.SignoutSuccess;
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SignoutFailure implements Action {
|
||||||
|
readonly type = ActionType.SignoutFailure;
|
||||||
|
|
||||||
|
constructor(public payload: any) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export type Actions =
|
||||||
|
| Signin
|
||||||
|
| SigninSuccess
|
||||||
|
| SigninFailure
|
||||||
|
| SigninRedirect
|
||||||
|
| Signout
|
||||||
|
| SignoutSuccess
|
||||||
|
| SignoutFailure
|
||||||
|
;
|
15
src/app/packages/member/store/auth.effect.spec.ts
Normal file
15
src/app/packages/member/store/auth.effect.spec.ts
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import { TestBed, inject } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { Effects } from './auth.effect';
|
||||||
|
|
||||||
|
describe('Auth.Effects', () => {
|
||||||
|
beforeEach(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
providers: [Effects]
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should be created', inject([Effects], (effects: Effects) => {
|
||||||
|
expect(effects).toBeTruthy();
|
||||||
|
}));
|
||||||
|
});
|
58
src/app/packages/member/store/auth.effect.ts
Normal file
58
src/app/packages/member/store/auth.effect.ts
Normal file
|
@ -0,0 +1,58 @@
|
||||||
|
import { Injectable } from '@angular/core';
|
||||||
|
import { Router } from '@angular/router';
|
||||||
|
|
||||||
|
import { Effect, Actions, ofType } from '@ngrx/effects';
|
||||||
|
import { Action } from '@ngrx/store';
|
||||||
|
|
||||||
|
import { Observable } from 'rxjs/Observable';
|
||||||
|
import { of } from 'rxjs/observable/of';
|
||||||
|
|
||||||
|
import 'rxjs/add/operator/catch';
|
||||||
|
import 'rxjs/add/operator/do';
|
||||||
|
import 'rxjs/add/operator/exhaustMap';
|
||||||
|
import 'rxjs/add/operator/map';
|
||||||
|
import 'rxjs/add/operator/take';
|
||||||
|
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
import { MemberService } from '../service/member.service';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Signin,
|
||||||
|
SigninSuccess,
|
||||||
|
SigninFailure,
|
||||||
|
ActionType,
|
||||||
|
} from './auth.action';
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class Effects {
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private actions$: Actions,
|
||||||
|
private memberService: MemberService,
|
||||||
|
private router: Router
|
||||||
|
) { }
|
||||||
|
|
||||||
|
@Effect()
|
||||||
|
signin$: Observable<Action> = this.actions$
|
||||||
|
.ofType(ActionType.Signin)
|
||||||
|
.map((action: Signin) => action.payload)
|
||||||
|
.exhaustMap(payload =>
|
||||||
|
this.memberService
|
||||||
|
.signin(payload.email, payload.password)
|
||||||
|
.map(member => new SigninSuccess({ member }))
|
||||||
|
.catch(error => of(new SigninFailure(error)))
|
||||||
|
);
|
||||||
|
|
||||||
|
@Effect({ dispatch: false })
|
||||||
|
signinSuccess$ = this.actions$
|
||||||
|
.ofType(ActionType.SigninSuccess)
|
||||||
|
.do(() => this.router.navigate(['/']));
|
||||||
|
|
||||||
|
@Effect({ dispatch: false })
|
||||||
|
signinRedirect$ = this.actions$
|
||||||
|
.ofType(ActionType.SigninRedirect, ActionType.Signout)
|
||||||
|
.do(authed => {
|
||||||
|
this.router.navigate(['/login']);
|
||||||
|
});
|
||||||
|
|
||||||
|
}
|
73
src/app/packages/member/store/auth.reducer.ts
Normal file
73
src/app/packages/member/store/auth.reducer.ts
Normal file
|
@ -0,0 +1,73 @@
|
||||||
|
import {
|
||||||
|
Actions,
|
||||||
|
ActionType,
|
||||||
|
} from './auth.action';
|
||||||
|
|
||||||
|
import {
|
||||||
|
State,
|
||||||
|
initialState,
|
||||||
|
} from './auth.state';
|
||||||
|
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
|
||||||
|
export function reducer(state = initialState, action: Actions): State {
|
||||||
|
switch (action.type) {
|
||||||
|
case ActionType.Signin: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: null,
|
||||||
|
isPending: true,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.SigninSuccess: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
isSignin: true,
|
||||||
|
error: null,
|
||||||
|
isPending: false,
|
||||||
|
member: action.payload.member,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.SigninFailure: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
isSignin: false,
|
||||||
|
error: action.payload,
|
||||||
|
isPending: false,
|
||||||
|
member: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.Signout: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: null,
|
||||||
|
isPending: true,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.SigninSuccess: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
isSignin: false,
|
||||||
|
error: null,
|
||||||
|
isPending: false,
|
||||||
|
member: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.SigninFailure: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: action.payload,
|
||||||
|
isPending: false,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
default: {
|
||||||
|
return state;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
20
src/app/packages/member/store/auth.state.ts
Normal file
20
src/app/packages/member/store/auth.state.ts
Normal file
|
@ -0,0 +1,20 @@
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
|
||||||
|
export interface State {
|
||||||
|
isSignin: boolean;
|
||||||
|
error: string | null;
|
||||||
|
isPending: boolean;
|
||||||
|
member: Member | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const initialState: State = {
|
||||||
|
isSignin: false,
|
||||||
|
error: null,
|
||||||
|
isPending: false,
|
||||||
|
member: null,
|
||||||
|
};
|
||||||
|
|
||||||
|
export const isSignin = (state: State) => state.isSignin;
|
||||||
|
export const getMember = (state: State) => state.member;
|
||||||
|
export const getError = (state: State) => state.error;
|
||||||
|
export const isPending = (state: State) => state.isPending;
|
4
src/app/packages/member/store/auth.ts
Normal file
4
src/app/packages/member/store/auth.ts
Normal file
|
@ -0,0 +1,4 @@
|
||||||
|
export * from './auth.action';
|
||||||
|
export * from './auth.effect';
|
||||||
|
export * from './auth.reducer';
|
||||||
|
export * from './auth.state';
|
33
src/app/packages/member/store/signup.action.ts
Normal file
33
src/app/packages/member/store/signup.action.ts
Normal file
|
@ -0,0 +1,33 @@
|
||||||
|
import { Action } from '@ngrx/store';
|
||||||
|
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
|
||||||
|
export enum ActionType {
|
||||||
|
Signup = '[member.signup] Signup',
|
||||||
|
SignupSuccess = '[member.signup] SignupSuccess',
|
||||||
|
SignupFailure = '[member.signup] SignupFailure',
|
||||||
|
}
|
||||||
|
|
||||||
|
export class Signup implements Action {
|
||||||
|
readonly type = ActionType.Signup;
|
||||||
|
|
||||||
|
constructor(public payload: {member: Member}) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SignupSuccess implements Action {
|
||||||
|
readonly type = ActionType.SignupSuccess;
|
||||||
|
|
||||||
|
constructor(public payload: { member: Member }) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export class SignupFailure implements Action {
|
||||||
|
readonly type = ActionType.SignupFailure;
|
||||||
|
|
||||||
|
constructor(public payload: any) {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export type Actions =
|
||||||
|
| Signup
|
||||||
|
| SignupSuccess
|
||||||
|
| SignupFailure
|
||||||
|
;
|
15
src/app/packages/member/store/signup.effect.spec.ts
Normal file
15
src/app/packages/member/store/signup.effect.spec.ts
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import { TestBed, inject } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { Effects } from './signup.effect';
|
||||||
|
|
||||||
|
describe('Signup.Effects', () => {
|
||||||
|
beforeEach(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
providers: [Effects]
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should be created', inject([Effects], (effects: Effects) => {
|
||||||
|
expect(effects).toBeTruthy();
|
||||||
|
}));
|
||||||
|
});
|
51
src/app/packages/member/store/signup.effect.ts
Normal file
51
src/app/packages/member/store/signup.effect.ts
Normal file
|
@ -0,0 +1,51 @@
|
||||||
|
import { Injectable } from '@angular/core';
|
||||||
|
import { Router } from '@angular/router';
|
||||||
|
|
||||||
|
import { Effect, Actions, ofType } from '@ngrx/effects';
|
||||||
|
import { Action } from '@ngrx/store';
|
||||||
|
|
||||||
|
import { Observable } from 'rxjs/Observable';
|
||||||
|
import { of } from 'rxjs/observable/of';
|
||||||
|
|
||||||
|
import 'rxjs/add/operator/catch';
|
||||||
|
import 'rxjs/add/operator/do';
|
||||||
|
import 'rxjs/add/operator/exhaustMap';
|
||||||
|
import 'rxjs/add/operator/map';
|
||||||
|
import 'rxjs/add/operator/take';
|
||||||
|
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
import { MemberService } from '../service/member.service';
|
||||||
|
|
||||||
|
import {
|
||||||
|
Signup,
|
||||||
|
SignupSuccess,
|
||||||
|
SignupFailure,
|
||||||
|
ActionType,
|
||||||
|
} from './signup.action';
|
||||||
|
|
||||||
|
@Injectable()
|
||||||
|
export class Effects {
|
||||||
|
|
||||||
|
constructor(
|
||||||
|
private actions$: Actions,
|
||||||
|
private memberService: MemberService,
|
||||||
|
private router: Router
|
||||||
|
) { }
|
||||||
|
|
||||||
|
@Effect()
|
||||||
|
signup$: Observable<Action> = this.actions$
|
||||||
|
.ofType(ActionType.Signup)
|
||||||
|
.map((action: Signup) => action.payload)
|
||||||
|
.exhaustMap(payload =>
|
||||||
|
this.memberService
|
||||||
|
.signup(payload.member)
|
||||||
|
.map(member => new SignupSuccess({ member }))
|
||||||
|
.catch(error => of(new SignupFailure(error)))
|
||||||
|
);
|
||||||
|
|
||||||
|
@Effect({ dispatch: false })
|
||||||
|
signupSuccess$ = this.actions$
|
||||||
|
.ofType(ActionType.SignupSuccess)
|
||||||
|
.do(() => this.router.navigate(['/']));
|
||||||
|
|
||||||
|
}
|
45
src/app/packages/member/store/signup.reducer.ts
Normal file
45
src/app/packages/member/store/signup.reducer.ts
Normal file
|
@ -0,0 +1,45 @@
|
||||||
|
import {
|
||||||
|
Actions,
|
||||||
|
ActionType,
|
||||||
|
} from './signup.action';
|
||||||
|
|
||||||
|
import {
|
||||||
|
State,
|
||||||
|
initialState,
|
||||||
|
} from './signup.state';
|
||||||
|
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
|
||||||
|
export function reducer(state = initialState, action: Actions): State {
|
||||||
|
switch (action.type) {
|
||||||
|
case ActionType.Signup: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: null,
|
||||||
|
isPending: true,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.SignupSuccess: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: null,
|
||||||
|
isPending: false,
|
||||||
|
member: action.payload.member,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
case ActionType.SignupFailure: {
|
||||||
|
return {
|
||||||
|
...state,
|
||||||
|
error: action.payload,
|
||||||
|
isPending: false,
|
||||||
|
member: null,
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|
||||||
|
default: {
|
||||||
|
return state;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
17
src/app/packages/member/store/signup.state.ts
Normal file
17
src/app/packages/member/store/signup.state.ts
Normal file
|
@ -0,0 +1,17 @@
|
||||||
|
import { Member } from '../model/member';
|
||||||
|
|
||||||
|
export interface State {
|
||||||
|
error: string | null;
|
||||||
|
isPending: boolean;
|
||||||
|
member: Member | null;
|
||||||
|
}
|
||||||
|
|
||||||
|
export const initialState: State = {
|
||||||
|
error: null,
|
||||||
|
isPending: false,
|
||||||
|
member: null,
|
||||||
|
};
|
||||||
|
|
||||||
|
export const getMember = (state: State) => state.member;
|
||||||
|
export const getError = (state: State) => state.error;
|
||||||
|
export const isPending = (state: State) => state.isPending;
|
5
src/app/packages/member/store/signup.ts
Normal file
5
src/app/packages/member/store/signup.ts
Normal file
|
@ -0,0 +1,5 @@
|
||||||
|
export * from './signup.action';
|
||||||
|
export * from './signup.effect';
|
||||||
|
export * from './signup.reducer';
|
||||||
|
export * from './signup.state';
|
||||||
|
|
|
@ -2,15 +2,19 @@ import { NgModule } from '@angular/core';
|
||||||
import { Routes, RouterModule } from '@angular/router';
|
import { Routes, RouterModule } from '@angular/router';
|
||||||
import { AuthPageComponent } from './auth-page.component';
|
import { AuthPageComponent } from './auth-page.component';
|
||||||
|
|
||||||
|
import { SigninPageComponent } from './signin/signin-page.component';
|
||||||
|
import { SignupPageComponent } from './signup/signup-page.component';
|
||||||
|
import { ResetPasswordPageComponent } from './reset-password/reset-password-page.component';
|
||||||
|
|
||||||
const routes: Routes = [
|
const routes: Routes = [
|
||||||
{
|
{
|
||||||
path: '',
|
path: '',
|
||||||
component: AuthPageComponent,
|
component: AuthPageComponent,
|
||||||
children: [
|
children: [
|
||||||
{ path: '', redirectTo: 'signin' },
|
{ path: '', redirectTo: 'signin' },
|
||||||
{ path: 'signin', loadChildren: './signin/signin-page.module#SigninPageModule' },
|
{ path: 'signin', component: SigninPageComponent },
|
||||||
{ path: 'signup', loadChildren: './signup/signup-page.module#SignupPageModule' },
|
{ path: 'signup', component: SignupPageComponent },
|
||||||
{ path: 'reset-password', loadChildren: './reset-password/reset-password-page.module#ResetPasswordPageModule' },
|
{ path: 'reset-password', component: ResetPasswordPageComponent },
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
|
@ -1,15 +1,30 @@
|
||||||
import { NgModule } from '@angular/core';
|
import { NgModule } from '@angular/core';
|
||||||
import { CommonModule } from '@angular/common';
|
import { CommonModule } from '@angular/common';
|
||||||
|
|
||||||
|
import { FlexLayoutModule } from '@angular/flex-layout';
|
||||||
|
|
||||||
|
import { MemberModule } from 'app/packages/member/member.module';
|
||||||
|
|
||||||
import { AuthPageComponent } from './auth-page.component';
|
import { AuthPageComponent } from './auth-page.component';
|
||||||
import { AuthPageRoutingModule } from './auth-page-routing.module';
|
import { AuthPageRoutingModule } from './auth-page-routing.module';
|
||||||
|
|
||||||
|
import { SigninPageComponent } from './signin/signin-page.component';
|
||||||
|
import { SignupPageComponent } from './signup/signup-page.component';
|
||||||
|
import { ResetPasswordPageComponent } from './reset-password/reset-password-page.component';
|
||||||
|
|
||||||
|
export const COMPONENTS = [
|
||||||
|
AuthPageComponent,
|
||||||
|
SigninPageComponent,
|
||||||
|
SignupPageComponent,
|
||||||
|
ResetPasswordPageComponent,
|
||||||
|
];
|
||||||
|
|
||||||
@NgModule({
|
@NgModule({
|
||||||
imports: [
|
imports: [
|
||||||
CommonModule,
|
CommonModule,
|
||||||
AuthPageRoutingModule,
|
AuthPageRoutingModule,
|
||||||
|
MemberModule,
|
||||||
],
|
],
|
||||||
declarations: [
|
declarations: COMPONENTS,
|
||||||
AuthPageComponent,
|
|
||||||
]
|
|
||||||
})
|
})
|
||||||
export class AuthPageModule { }
|
export class AuthPageModule { }
|
||||||
|
|
|
@ -1,16 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { Routes, RouterModule } from '@angular/router';
|
|
||||||
import { ResetPasswordPageComponent } from './reset-password-page.component';
|
|
||||||
|
|
||||||
const routes: Routes = [
|
|
||||||
{
|
|
||||||
path: '',
|
|
||||||
component: ResetPasswordPageComponent,
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [RouterModule.forChild(routes)],
|
|
||||||
exports: [RouterModule]
|
|
||||||
})
|
|
||||||
export class ResetPasswordPageRoutingModule { }
|
|
|
@ -1,20 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { ResetPasswordPageRoutingModule } from './reset-password-page-routing.module';
|
|
||||||
import { ResetPasswordPageComponent } from './reset-password-page.component';
|
|
||||||
import {ResetPasswordModule} from 'app/packages/member/component/reset-password/reset-password.module';
|
|
||||||
import {FlexLayoutModule} from '@angular/flex-layout';
|
|
||||||
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
ResetPasswordPageRoutingModule,
|
|
||||||
ResetPasswordModule,
|
|
||||||
FlexLayoutModule
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
ResetPasswordPageComponent,
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class ResetPasswordPageModule { }
|
|
|
@ -1,16 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { Routes, RouterModule } from '@angular/router';
|
|
||||||
import { SigninPageComponent } from './signin-page.component';
|
|
||||||
|
|
||||||
const routes: Routes = [
|
|
||||||
{
|
|
||||||
path: '',
|
|
||||||
component: SigninPageComponent,
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [RouterModule.forChild(routes)],
|
|
||||||
exports: [RouterModule]
|
|
||||||
})
|
|
||||||
export class SigninPageRoutingModule { }
|
|
|
@ -1,19 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { SigninPageRoutingModule } from './signin-page-routing.module';
|
|
||||||
import { SigninPageComponent } from './signin-page.component';
|
|
||||||
import { SigninModule } from 'app/packages/member/component/signin/signin.module';
|
|
||||||
import { FlexLayoutModule } from '@angular/flex-layout';
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
SigninPageRoutingModule,
|
|
||||||
SigninModule,
|
|
||||||
FlexLayoutModule
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
SigninPageComponent,
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class SigninPageModule { }
|
|
|
@ -1,16 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { Routes, RouterModule } from '@angular/router';
|
|
||||||
import { SignupPageComponent } from './signup-page.component';
|
|
||||||
|
|
||||||
const routes: Routes = [
|
|
||||||
{
|
|
||||||
path: '',
|
|
||||||
component: SignupPageComponent,
|
|
||||||
}
|
|
||||||
];
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [RouterModule.forChild(routes)],
|
|
||||||
exports: [RouterModule]
|
|
||||||
})
|
|
||||||
export class SignupPageRoutingModule { }
|
|
|
@ -1,19 +0,0 @@
|
||||||
import { NgModule } from '@angular/core';
|
|
||||||
import { CommonModule } from '@angular/common';
|
|
||||||
import { SignupPageRoutingModule } from './signup-page-routing.module';
|
|
||||||
import { SignupPageComponent } from './signup-page.component';
|
|
||||||
import { FlexLayoutModule } from '@angular/flex-layout';
|
|
||||||
import { SignupModule } from 'app/packages/member/component/signup/signup.module';
|
|
||||||
|
|
||||||
@NgModule({
|
|
||||||
imports: [
|
|
||||||
CommonModule,
|
|
||||||
SignupPageRoutingModule,
|
|
||||||
FlexLayoutModule,
|
|
||||||
SignupModule
|
|
||||||
],
|
|
||||||
declarations: [
|
|
||||||
SignupPageComponent,
|
|
||||||
]
|
|
||||||
})
|
|
||||||
export class SignupPageModule { }
|
|
10
yarn.lock
10
yarn.lock
|
@ -1422,18 +1422,14 @@ combined-stream@^1.0.5, combined-stream@~1.0.5:
|
||||||
dependencies:
|
dependencies:
|
||||||
delayed-stream "~1.0.0"
|
delayed-stream "~1.0.0"
|
||||||
|
|
||||||
commander@2:
|
commander@2, commander@^2.12.1, commander@^2.9.0, commander@~2.13.0:
|
||||||
version "2.14.1"
|
version "2.13.0"
|
||||||
resolved "https://registry.yarnpkg.com/commander/-/commander-2.14.1.tgz#2235123e37af8ca3c65df45b026dbd357b01b9aa"
|
resolved "https://registry.yarnpkg.com/commander/-/commander-2.13.0.tgz#6964bca67685df7c1f1430c584f07d7597885b9c"
|
||||||
|
|
||||||
commander@2.12.x:
|
commander@2.12.x:
|
||||||
version "2.12.2"
|
version "2.12.2"
|
||||||
resolved "https://registry.yarnpkg.com/commander/-/commander-2.12.2.tgz#0f5946c427ed9ec0d91a46bb9def53e54650e555"
|
resolved "https://registry.yarnpkg.com/commander/-/commander-2.12.2.tgz#0f5946c427ed9ec0d91a46bb9def53e54650e555"
|
||||||
|
|
||||||
commander@^2.12.1, commander@^2.9.0, commander@~2.13.0:
|
|
||||||
version "2.13.0"
|
|
||||||
resolved "https://registry.yarnpkg.com/commander/-/commander-2.13.0.tgz#6964bca67685df7c1f1430c584f07d7597885b9c"
|
|
||||||
|
|
||||||
common-tags@^1.3.1:
|
common-tags@^1.3.1:
|
||||||
version "1.7.2"
|
version "1.7.2"
|
||||||
resolved "https://registry.yarnpkg.com/common-tags/-/common-tags-1.7.2.tgz#24d9768c63d253a56ecff93845b44b4df1d52771"
|
resolved "https://registry.yarnpkg.com/common-tags/-/common-tags-1.7.2.tgz#24d9768c63d253a56ecff93845b44b4df1d52771"
|
||||||
|
|
Loading…
Reference in New Issue
Block a user