From b06160931796d9874ce52c6be17f430bf257cfc7 Mon Sep 17 00:00:00 2001
From: geek <geek@loafle.com>
Date: Thu, 12 Apr 2018 17:06:15 +0900
Subject: [PATCH] signup signin code modify

---
 .../component/signup/signup.component.html    | 135 +++++++++---------
 .../component/signup/signup.component.ts      |  75 ++++++----
 src/packages/member/service/member.service.ts |   3 +-
 .../member/store/signup/signup.action.ts      |   2 +-
 .../member/store/signup/signup.effect.ts      |   4 +-
 5 files changed, 122 insertions(+), 97 deletions(-)

diff --git a/src/packages/member/component/signup/signup.component.html b/src/packages/member/component/signup/signup.component.html
index ec48f85..db98472 100644
--- a/src/packages/member/component/signup/signup.component.html
+++ b/src/packages/member/component/signup/signup.component.html
@@ -1,71 +1,78 @@
 <form [formGroup]="signupForm" (ngSubmit)="signup()">
-    <div class="card login-panel ui-fluid">
-        <div class="ui-g">
-            <div class="ui-g-12">
-                <img src="assets/layout/images/overFlow_CI_blue_185.png">
-            </div>
-            <div class="ui-g-12">
-                <span class="md-inputfield">
-                    <input id="email" type="email" pInputText class="input ng-dirty ng-invalid" placeholder="Email" formControlName="email" required>
-                    <div *ngIf="email.touched && !email.valid" class="ui-message ui-messages-error ui-corner-all">
-                        Invalid email
-                    </div>
-                </span>
-            </div>
-            <div class="ui-g-12">
-                <span class="md-inputfield">
-                    <input id="password" type="password" pInputText class="input ng-dirty ng-invalid" placeholder="Password" formControlName="password"
-                        required>
-                    <div *ngIf="password.touched && !password.valid" class="ui-message ui-messages-error ui-corner-all">
-                        Invalid password
-                    </div>
-                </span>
-            </div>
-            <div class="ui-g-12">
-                <span class="md-inputfield">
-                    <input id="pwConfirm" type="password" pInputText class="input ng-dirty ng-invalid" placeholder="Retype your password" formControlName="pwConfirm"
-                        required>
-                    <div *ngIf="pwConfirm.touched && !pwConfirm.valid" class="ui-message ui-messages-error ui-corner-all">
-                        Not matched password
-                    </div>
-                </span>
-            </div>
+  <div class="card login-panel ui-fluid">
+    <div class="ui-g">
+      <div class="ui-g-12">
+        <img src="assets/layout/images/overFlow_CI_blue_185.png">
+      </div>
+      <div class="ui-g-12">
+          <span class="md-inputfield">
+              <input type="email"
+                     id="email"
+                     pInputText
+                     class="input ng-dirty ng-invalid"
+                     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>
+          </span>
+      </div>
+      <div class="ui-g-12">
+          <span class="md-inputfield">
+              <input type="password"
+                     id="password"  pInputText class="input ng-dirty ng-invalid" placeholder="Password" formControlName="password"
+                     required>
+              <div *ngIf="password.touched && !password.valid" class="ui-message ui-messages-error ui-corner-all">
+                  Invalid password
+              </div>
+          </span>
+      </div>
+      <div class="ui-g-12">
+          <span class="md-inputfield">
+              <input id="pwConfirm" type="password" pInputText class="input ng-dirty ng-invalid" placeholder="Retype your password" formControlName="pwConfirm"
+                     required>
+              <div *ngIf="pwConfirm.touched && !pwConfirm.valid" class="ui-message ui-messages-error ui-corner-all">
+                  Not matched password
+              </div>
+          </span>
+      </div>
 
-            <div class="ui-g-12">
-                <span class="md-inputfield">
-                    <input id="name" type="text" pInputText class="input ng-dirty ng-invalid" placeholder="Name" formControlName="name" required>
-                    <div *ngIf="name.touched && !name.valid" class="ui-message ui-messages-error ui-corner-all">
-                        Invalid Name
-                    </div>
-                </span>
-            </div>
+      <div class="ui-g-12">
+          <span class="md-inputfield">
+              <input id="name" type="text" pInputText class="input ng-dirty ng-invalid" placeholder="Name" formControlName="name" required>
+              <div *ngIf="name.touched && !name.valid" class="ui-message ui-messages-error ui-corner-all">
+                  Invalid Name
+              </div>
+          </span>
+      </div>
 
-            <div class="ui-g-12">
-                <span class="md-inputfield">
-                    <input id="phone" type="text" pInputText class="input ng-dirty ng-invalid" placeholder="Phone" formControlName="phone" required>
-                    <div *ngIf="phone.touched && !phone.valid" class="ui-message ui-messages-error ui-corner-all">
-                        Invalid phone number
-                    </div>
-                </span>
-            </div>
+      <div class="ui-g-12">
+          <span class="md-inputfield">
+              <input id="phone" type="text" pInputText class="input ng-dirty ng-invalid" placeholder="Phone" formControlName="phone" required>
+              <div *ngIf="phone.touched && !phone.valid" class="ui-message ui-messages-error ui-corner-all">
+                  Invalid phone number
+              </div>
+          </span>
+      </div>
 
-            <div class="ui-g-12">
-                <span class="md-inputfield">
-                    <input id="company" type="text" pInputText class="input ng-dirty ng-invalid" placeholder="Company" formControlName="company" required>
-                    <div *ngIf="company.touched && !company.valid" class="ui-message ui-messages-error ui-corner-all">
-                        Invalid company name
-                    </div>
-                </span>
-            </div>
+      <div class="ui-g-12">
+          <span class="md-inputfield">
+              <input id="company" type="text" pInputText class="input ng-dirty ng-invalid" placeholder="Company" formControlName="company" required>
+              <div *ngIf="company.touched && !company.valid" class="ui-message ui-messages-error ui-corner-all">
+                  Invalid company name
+              </div>
+          </span>
+      </div>
 
-            <div class="ui-g-12">
-                <button type="submit" [disabled]="!signupForm.valid" 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-person"></span>
-                    <span class="ui-button-text ui-c">Sign Up</span>
-                </button>
+      <div class="ui-g-12">
+        <button type="submit" [disabled]="!signupForm.valid" 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-person"></span>
+          <span class="ui-button-text ui-c">Sign Up</span>
+        </button>
 
-                <a href="#">Sign In</a>
-            </div>
-        </div>
+        <a href="#">Sign In</a>
+      </div>
     </div>
-</form>
\ No newline at end of file
+  </div>
+</form>
diff --git a/src/packages/member/component/signup/signup.component.ts b/src/packages/member/component/signup/signup.component.ts
index 05b90b0..468fece 100644
--- a/src/packages/member/component/signup/signup.component.ts
+++ b/src/packages/member/component/signup/signup.component.ts
@@ -2,6 +2,8 @@ import { Component, OnInit } from '@angular/core';
 import { Router } from '@angular/router';
 import { FormGroup, FormBuilder, Validators, AbstractControl, FormControl } from '@angular/forms';
 import { Member } from '../../model';
+import * as AuthStore from '../../store/signup';
+import {Store} from '@ngrx/store';
 
 @Component({
   selector: 'of-member-signup',
@@ -20,7 +22,8 @@ export class SignupComponent implements OnInit {
 
   constructor(
     private router: Router,
-    private formBuilder: FormBuilder
+    private formBuilder: FormBuilder,
+    private store: Store<AuthStore.State>,
   ) { }
 
   ngOnInit() {
@@ -29,35 +32,47 @@ export class SignupComponent implements OnInit {
 
   initForm() {
     this.signupForm = this.formBuilder.group({
-      'email': ['', [
-        Validators.required,
-        Validators.email
-      ]
+      'email': [
+        'geekhot@hotmail.co.kr',
+        [
+          Validators.required,
+          Validators.email
+        ]
       ],
-      'password': ['', [
-        Validators.required,
-        Validators.pattern('^(?=.*[0-9])(?=.*[a-zA-Z])([a-zA-Z0-9]+)$'),
-        Validators.minLength(6),
-        Validators.maxLength(25),
-      ]
+      'password': [
+        '!@#$Qwer1234',
+        [
+          Validators.required,
+          Validators.pattern('^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{6,}$'),
+          Validators.minLength(6),
+          Validators.maxLength(25),
+        ]
       ],
-      'pwConfirm': ['', [
-        Validators.compose([
+      'pwConfirm': [
+        '!@#$Qwer1234',
+        [
+          Validators.compose([
           Validators.required, this.pwMatchValidator
         ])
-      ]
+        ]
       ],
-      'name': ['', [
-        Validators.required
-      ]
+      'name': [
+        'Park',
+        [
+          Validators.required
+        ]
       ],
-      'phone': ['', [
-        Validators.required
-      ]
+      'phone': [
+        '010-3040-0303',
+        [
+          Validators.required
+        ]
       ],
-      'company': ['', [
-        Validators.required
-      ]
+      'company': [
+        'atgame',
+        [
+          Validators.required
+        ]
       ],
     });
     this.email = this.signupForm.controls['email'];
@@ -79,14 +94,16 @@ export class SignupComponent implements OnInit {
   }
 
   signup() {
-    const signinValue = Object.assign({}, this.signupForm.value);
+    const signupValue = Object.assign({}, this.signupForm.value);
+    const password = signupValue.password;
     const member: Member = {
-      email: signinValue.email,
-      password: signinValue.password,
-      name: signinValue.name,
-      phone: signinValue.phone,
-      companyName: signinValue.company,
+      email: signupValue.email,
+      password: signupValue.password,
+      name: signupValue.name,
+      phone: signupValue.phone,
+      companyName: signupValue.company,
     };
+    this.store.dispatch(new AuthStore.Signup({member, password}));
     console.log(member);
   }
 
diff --git a/src/packages/member/service/member.service.ts b/src/packages/member/service/member.service.ts
index 1cd1ab0..5778e97 100644
--- a/src/packages/member/service/member.service.ts
+++ b/src/packages/member/service/member.service.ts
@@ -34,10 +34,11 @@ export class MemberService {
     });
   }
 
-  public signup(member: Member): Observable<Member> {
+  public signup(member: Member, password: string): Observable<Member> {
     return this.restService.request<Member>('post', '/account/signup', {
       body: {
         member: member,
+        password: password,
       },
     });
   }
diff --git a/src/packages/member/store/signup/signup.action.ts b/src/packages/member/store/signup/signup.action.ts
index 9c68f2f..ffd1358 100644
--- a/src/packages/member/store/signup/signup.action.ts
+++ b/src/packages/member/store/signup/signup.action.ts
@@ -13,7 +13,7 @@ export enum ActionType {
 export class Signup implements Action {
   readonly type = ActionType.Signup;
 
-  constructor(public payload: Member) {}
+  constructor(public payload: {member: Member, password: string}) {}
 }
 
 export class SignupSuccess implements Action {
diff --git a/src/packages/member/store/signup/signup.effect.ts b/src/packages/member/store/signup/signup.effect.ts
index 1d5f201..06eed9a 100644
--- a/src/packages/member/store/signup/signup.effect.ts
+++ b/src/packages/member/store/signup/signup.effect.ts
@@ -36,9 +36,9 @@ export class Effects {
   signup$: Observable<Action> = this.actions$
     .ofType(ActionType.Signup)
     .map((action: Signup) => action.payload)
-    .exhaustMap(member =>
+    .exhaustMap(payload =>
       this.memberService
-        .signup(member)
+        .signup(payload.member, payload.password)
         .map(_member => new SignupSuccess(_member))
         .catch(error => of(new SignupFailure(error)))
     );