ing

@overflow/member/component/member-modify-password.component.html

@@ -47,26 +47,4 @@
             </table>
           </form>
     </div>
-    <div class="ui-g-12 ui-md-3 ui-lg-5 login-descript">
+</div>
-        <table class="login-table">
-            <tr>
-                <td>
-                    <div class="login-panel ui-fluid">
-                        <div class="ui-g">
-                            <div class="ui-g-12">
-                                <img src="assets/layout/images/login/login_img_01.png">
-                                <p><br>
-                                    overFlow는 여러분의 서버에 발생하는<br>
-                                    변화를 항상 지켜보고 있습니다.<br><br>
-                                    
-                                    서버에 발생하는 모든 변화를 세분화 하여<br>
-                                    실시간으로 알려 드립니다.
-                                </p>
-                            </div>
-                        </div>
-                    </div>
-                </td>
-            </tr>
-        </table>
-    </div>
-</div>

@overflow/member/component/member-reset-password.component.html

@@ -18,13 +18,13 @@
                                         {{ formErrors.email }}
                                     </div>
                                 </div>
-                    
+
                                 <div class="ui-g-12">
                                     <button type="submit" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-icon-left">
                                         <span class="ui-button-icon-left ui-c fa fa-fw ui-icon-cached"></span>
                                         <span class="ui-button-text ui-c">Reset Password</span>
                                     </button>
-                    
+
                                     <a href="/auth/signin" >Sign In</a>
                                     |
                                     <a href="/auth/signup" >Sign Up</a>
@@ -36,26 +36,5 @@
             </table>
         </form>
     </div>
-    <div class="ui-g-12 ui-md-3 ui-lg-5 login-descript">
+
-        <table class="login-table">
+</div>
-            <tr>
-                <td>
-                    <div class="login-panel ui-fluid">
-                        <div class="ui-g">
-                            <div class="ui-g-12">
-                                <img src="assets/layout/images/login/login_img_01.png">
-                                <p><br>
-                                    overFlow는 여러분의 서버에 발생하는<br>
-                                    변화를 항상 지켜보고 있습니다.<br><br>
-                                    
-                                    서버에 발생하는 모든 변화를 세분화 하여<br>
-                                    실시간으로 알려 드립니다.
-                                </p>
-                            </div>
-                        </div>
-                    </div>
-                </td>
-            </tr>
-        </table>
-    </div>
-</div>

@overflow/member/component/member-signup.component.html

@@ -5,7 +5,7 @@
   [(visible)]="termsDisplay"
   [showHeader]="true"
   [closeOnEscape]="false">
-  <of-member-terms (close)="onTermsDisplayClose()"></of-member-terms>
+  <of-member-terms (close)="termsDisplay = false"></of-member-terms>
 </p-dialog>
 <p-dialog
   header="Privacy Policy Info"
@@ -14,7 +14,18 @@
   [(visible)]="policyDisplay"
   [showHeader]="true"
   [closeOnEscape]="false">
-  <of-member-policy (close)="onPolicyDisplayClose()"></of-member-policy>
+  <of-member-policy (close)="policyDisplay = false"></of-member-policy>
+</p-dialog>
+
+<p-dialog
+  header="Membership is welcome."
+  [modal]="true"
+  [width]="800"
+  [(visible)]="signupComplete"
+  [showHeader]="true"
+  [closeOnEscape]="false"
+  (onHide)="closeSignup()">
+  <div>Membership is welcome. </div>
 </p-dialog>
 
 
@@ -39,7 +50,7 @@
                              placeholder="Email"
                              formControlName="email"
                              required
-                             value="geekhot@hotmail.co.kr" />
+                              />
                       <div *ngIf="email.touched && !email.valid" class="ui-message ui-messages-error ui-corner-all">
                           Invalid email
                       </div>
@@ -125,8 +136,16 @@
 
                 <div class="ui-g-12 ui-g-padding-15">
                   <p class="font-s">
-                    <p-checkbox name="groupname" value="val1" label="이용약관과 개인정보 정책에 동의 합니다." [(ngModel)]="selectedValues"></p-checkbox>
+                    <p-checkbox
+                      name="groupname"
+                      label="이용약관과 개인정보 정책에 동의 합니다."
+                      [formControl]="signupForm.controls['selectPolicy']"
+                      binary="true"></p-checkbox>
+                    <!--{{signupForm.get('selectPolicy').value}}-->
                   </p>
+                  <div *ngIf="selectPolicy.touched && !selectPolicy.valid" class="ui-message ui-messages-error ui-corner-all">
+                    please check
+                  </div>
                   <a href="javascript:void(0)" (click)="termsDisplayOpen()">Terms Of Use</a>
                   |
                   <a href="javascript:void(0)" (click)="policyDisplayOpen()">Privacy Policy</a>
@@ -136,7 +155,7 @@
                     <div class="content-section implementation">
 
                       <recaptcha
-                        [formControl]="myRecaptcha"
+                        [formControl]="signupForm.controls['captcha']"
                         (scriptLoad)="onScriptLoad()"
                         (scriptError)="onScriptError()"
                       ></recaptcha>
@@ -158,26 +177,4 @@
       </table>
     </form>
   </div>
-  <div class="ui-g-12 ui-md-3 ui-lg-5 login-descript">
-    <table class="login-table">
-      <tr>
-        <td>
-          <div class="login-panel ui-fluid">
-            <div class="ui-g">
-              <div class="ui-g-12">
-                <img src="assets/layout/images/login/login_img_01.png">
-                <p><br>
-                  overFlow는 여러분의 서버에 발생하는<br>
-                  변화를 항상 지켜보고 있습니다.<br><br>
-
-                  서버에 발생하는 모든 변화를 세분화 하여<br>
-                  실시간으로 알려 드립니다.
-                </p>
-              </div>
-            </div>
-          </div>
-        </td>
-      </tr>
-    </table>
-  </div>
 </div>

@overflow/member/component/member-signup.component.ts

@@ -3,7 +3,7 @@ import {
   OnDestroy,
   OnInit,
   Output,
-  EventEmitter,
+  EventEmitter, Input,
 } from '@angular/core';
 import { FormGroup, FormBuilder, Validators, AbstractControl, FormControl, ValidationErrors } from '@angular/forms';
 import { Member } from '@overflow/commons-typescript/model/member';
@@ -14,8 +14,9 @@ import { Member } from '@overflow/commons-typescript/model/member';
 })
 export class MemberSignupComponent implements OnInit, OnDestroy {
   @Output() signup = new EventEmitter<{member: Member, password: string}>();
+  @Output() doneSignup = new EventEmitter();
 
-  myRecaptcha = new FormControl(false);
+  @Input() signupComplete;
 
   signupForm: FormGroup;
   email: AbstractControl;
@@ -24,6 +25,8 @@ export class MemberSignupComponent implements OnInit, OnDestroy {
   name: AbstractControl;
   phone: AbstractControl;
   company: AbstractControl;
+  selectPolicy: AbstractControl;
+  captcha: AbstractControl;
   termsDisplay = false;
   policyDisplay = false;
 
@@ -83,6 +86,12 @@ export class MemberSignupComponent implements OnInit, OnDestroy {
           Validators.required
         ]
       ],
+      'selectPolicy': [
+        false, [ Validators.requiredTrue ],
+      ],
+      'captcha': [
+        false, [ Validators.requiredTrue ],
+      ]
     });
     this.email = this.signupForm.controls['email'];
     this.password = this.signupForm.controls['password'];
@@ -90,6 +99,8 @@ export class MemberSignupComponent implements OnInit, OnDestroy {
     this.name = this.signupForm.controls['name'];
     this.phone = this.signupForm.controls['phone'];
     this.company = this.signupForm.controls['company'];
+    this.selectPolicy = this.signupForm.controls['selectPolicy'];
+    this.captcha = this.signupForm.controls['captcha'];
   }
 
   pwMatchValidator(control: FormControl): ValidationErrors {
@@ -104,10 +115,6 @@ export class MemberSignupComponent implements OnInit, OnDestroy {
   }
 
   signupFormSubmit() {
-    if (!this.myRecaptcha.valid) {
-      console.log('dddddddd');
-      return;
-    }
     const signupValue = Object.assign({}, this.signupForm.value);
     const password = signupValue.password;
     const member: Member = {
@@ -122,16 +129,13 @@ export class MemberSignupComponent implements OnInit, OnDestroy {
   termsDisplayOpen() {
     this.termsDisplay = true;
   }
-  onTermsDisplayClose() {
-    this.termsDisplay = false;
-  }
 
   policyDisplayOpen() {
     this.policyDisplay = true;
   }
 
-  onPolicyDisplayClose() {
+  closeSignup() {
-    this.policyDisplay = false;
+    this.doneSignup.emit();
   }
 
   onScriptLoad() {

@overflow/member/container/member-signup-container.component.html

@@ -1 +1 @@
-<of-member-signup (signup)="onSignup($event)"></of-member-signup>
+<of-member-signup [signupComplete]="signupComplete$ | async" (signup)="onSignup($event)" (doneSignup)="onDoneSignup()" ></of-member-signup>

@overflow/member/container/member-signup-container.component.ts

@@ -1,12 +1,14 @@
 import {
-  Component,
+  Component, EventEmitter,
   OnDestroy,
-  OnInit,
+  OnInit, Output,
 } from '@angular/core';
 import { Member } from '@overflow/commons-typescript/model/member';
-import { Store } from '@ngrx/store';
+import {select, Store} from '@ngrx/store';
 
 import * as MemberEntityStore from '../store/entity/member';
+import { MemberSignupContainerSelector } from '../store';
+import {Observable} from 'rxjs';
 
 @Component({
   selector: 'of-member-signup-container',
@@ -14,11 +16,16 @@ import * as MemberEntityStore from '../store/entity/member';
 })
 export class MemberSignupContainerComponent implements OnInit, OnDestroy {
 
+  @Output() doneSignup = new EventEmitter();
+
+  signupComplete$: Observable<boolean>;
+
   constructor(
     private store: Store<any>,
   ) { }
 
   ngOnInit() {
+    this.signupComplete$ = this.store.pipe(select(MemberSignupContainerSelector.selectSignupComplete));
   }
 
   ngOnDestroy() {
@@ -27,4 +34,8 @@ export class MemberSignupContainerComponent implements OnInit, OnDestroy {
   onSignup(info: {member: Member, password: string}) {
     this.store.dispatch(new MemberEntityStore.Signup(info));
   }
+
+  onDoneSignup() {
+    this.doneSignup.emit();
+  }
 }

@overflow/member/store/container/signup/member-signup.reducer.ts

@@ -12,6 +12,7 @@ export function reducer(state = initialState, action: Actions): State {
   switch (action.type) {
     case ActionType.Signup: {
       return {
+        signupComplete: false,
         pending: true,
         error: null,
       };
@@ -19,6 +20,7 @@ export function reducer(state = initialState, action: Actions): State {
 
     case ActionType.SignupSuccess: {
       return {
+        signupComplete: true,
         pending: false,
         error: null,
       };
@@ -26,6 +28,7 @@ export function reducer(state = initialState, action: Actions): State {
 
     case ActionType.SignupFailure: {
       return {
+        signupComplete: false,
         pending: false,
         error: action.payload,
       };

@overflow/member/store/container/signup/member-signup.state.ts

@@ -3,17 +3,20 @@ import { Selector, createSelector } from '@ngrx/store';
 import { RESTClientError } from '@loafer/ng-rest';
 
 export interface State {
+  signupComplete: boolean;
   pending: boolean;
   error: RESTClientError;
 }
 
 export const initialState: State = {
+  signupComplete: false,
   pending: false,
   error: null,
 };
 
 export function getSelectors(selector: Selector<any, State>) {
   return {
+    selectSignupComplete: createSelector(selector, (state: State) => state.signupComplete),
     selectPending: createSelector(selector, (state: State) => state.pending),
     selectError: createSelector(selector, (state: State) => state.error),
   };

@overflow/member/store/container/totp/member-totp.reducer.ts

@@ -37,6 +37,59 @@ export function reducer(state = initialState, action: Actions): State {
       };
     }
 
+    case ActionType.Regist: {
+      return {
+        secretKey: null,
+        sourceURI: null,
+        pending: true,
+        error: null,
+      };
+    }
+
+    case ActionType.RegistSuccess: {
+      return {
+        secretKey: null,
+        sourceURI: null,
+        pending: true,
+        error: null,
+      };
+    }
+
+    case ActionType.RegistFailure: {
+      return {
+        secretKey: null,
+        sourceURI: null,
+        pending: true,
+        error: action.payload,
+      };
+    }
+
+    case ActionType.CheckCodeForMember: {
+      return {
+        secretKey: null,
+        sourceURI: null,
+        pending: true,
+        error: null,
+      };
+    }
+
+    case ActionType.CheckCodeForMemberSuccess: {
+      return {
+        secretKey: null,
+        sourceURI: null,
+        pending: true,
+        error: null,
+      };
+    }
+
+    case ActionType.CheckCodeForMemberFailure: {
+      return {
+        secretKey: null,
+        sourceURI: null,
+        pending: true,
+        error: action.payload,
+      };
+    }
     default: {
       return state;
     }

@overflow/member/store/container/totp/member-totp.state.ts

@@ -1,11 +1,11 @@
 import { Selector, createSelector } from '@ngrx/store';
-import { RESTClientError } from '@loafer/ng-rest';
+import { RPCClientError } from '@loafer/ng-rpc';
 
 export interface State {
   secretKey: string;
   sourceURI: string;
   pending: boolean;
-  error: RESTClientError;
+  error: RPCClientError;
 }
 
 export const initialState: State = {

@overflow/member/store/entity/member-totp/member-totp.action.ts

@@ -1,6 +1,6 @@
 import { Action } from '@ngrx/store';
 
-import { RESTClientError } from '@loafer/ng-rest';
+import { RPCClientError } from '@loafer/ng-rpc';
 
 import { Member } from '@overflow/commons-typescript/model/member';
 
@@ -33,7 +33,7 @@ export class CreateTotpSuccess implements Action {
 export class CreateTotpFailure implements Action {
   readonly type = ActionType.CreateTotpFailure;
 
-  constructor(public payload: RESTClientError) {}
+  constructor(public payload: RPCClientError) {}
 }
 
 // ----------------------------------------------------------------------------------------
@@ -51,7 +51,7 @@ export class RegistSuccess implements Action {
 export class RegistFailure implements Action {
   readonly type = ActionType.RegistFailure;
 
-  constructor(public payload: RESTClientError) {}
+  constructor(public payload: RPCClientError) {}
 }
 
 // ----------------------------------------------------------------------------------------
@@ -71,7 +71,7 @@ export class CheckCodeForMemberSuccess implements Action {
 export class CheckCodeForMemberFailure implements Action {
   readonly type = ActionType.CheckCodeForMemberFailure;
 
-  constructor(public payload: RESTClientError) {}
+  constructor(public payload: RPCClientError) {}
 }
 
 export type Actions =

src/app/pages/auth/signup/signup-page.component.html

@@ -1,6 +1,6 @@
 <div class="ui-g">
   <div class="ui-g-12 ui-md-9 ui-lg-7">
-    <of-member-signup-container></of-member-signup-container>
+    <of-member-signup-container (doneSignup)="signupComplete()"></of-member-signup-container>
   </div>
   <div class="ui-g-12 ui-md-3 ui-lg-5 login-descript">
     <table class="login-table">
@@ -24,4 +24,4 @@
       </tr>
     </table>
   </div>
-</div>
+</div>

src/app/pages/auth/signup/signup-page.component.ts

@@ -1,5 +1,5 @@
 import { Component, OnInit } from '@angular/core';
-import { ActivatedRoute } from '@angular/router';
+import {ActivatedRoute, Router} from '@angular/router';
 
 @Component({
   selector: 'of-pages-auth-signup',
@@ -10,6 +10,7 @@ export class SignupPageComponent implements OnInit {
   returnURL: string;
 
   constructor(
+    private router: Router,
     private activatedRoute: ActivatedRoute,
   ) { }
 
@@ -19,4 +20,8 @@ export class SignupPageComponent implements OnInit {
 
   initForm() {
   }
+
+  signupComplete() {
+    this.router.navigate(['/auth/signin']);
+  }
 }