From 1f828b5f956fa0365ccdc8b1d45c56648ac9cd2d Mon Sep 17 00:00:00 2001 From: byung eun park Date: Thu, 29 Aug 2019 17:27:05 +0900 Subject: [PATCH] =?UTF-8?q?=ED=9A=8C=EC=9B=90=EC=88=98=EC=A0=95=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../user-detail/user-detail.component.html | 19 +++++- .../user-detail/user-detail.component.ts | 63 +++++++++++++++++-- .../user-regist/user-regist.component.ts | 2 +- src/modules/user/model/user.model.ts | 1 + src/modules/user/service/user.service.ts | 30 +++++++++ 5 files changed, 109 insertions(+), 6 deletions(-) diff --git a/src/app/pages/users/user/component/user-detail/user-detail.component.html b/src/app/pages/users/user/component/user-detail/user-detail.component.html index 08cfea2..25a8e36 100644 --- a/src/app/pages/users/user/component/user-detail/user-detail.component.html +++ b/src/app/pages/users/user/component/user-detail/user-detail.component.html @@ -55,7 +55,7 @@ fxFlex="1 0 auto" name="userForm" [formGroup]="userForm" - (ngSubmit)="registUser()" + (ngSubmit)="updateUser()" >
기본정보
@@ -110,6 +110,23 @@ vpn_key + + 패스워드 확인은 필수 사항입니다! + + + 패스워드가 일치하지 않습니다! + diff --git a/src/app/pages/users/user/component/user-detail/user-detail.component.ts b/src/app/pages/users/user/component/user-detail/user-detail.component.ts index d3011d9..8b7737f 100644 --- a/src/app/pages/users/user/component/user-detail/user-detail.component.ts +++ b/src/app/pages/users/user/component/user-detail/user-detail.component.ts @@ -1,7 +1,15 @@ import { Component, OnDestroy, OnInit, ViewEncapsulation } from '@angular/core'; -import { FormBuilder, FormGroup } from '@angular/forms'; +import { + AbstractControl, + FormBuilder, + FormGroup, + Validators, + ValidationErrors, + ValidatorFn +} from '@angular/forms'; import { Subject } from 'rxjs'; -import { takeUntil } from 'rxjs/operators'; +import { take } from 'rxjs/operators'; +import { takeUntil } from 'rxjs/internal/operators'; import { fuseAnimations } from 'src/@fuse/animations'; import { User } from 'src/modules/user/model/user.model'; @@ -52,6 +60,12 @@ export class UserDetailComponent implements OnInit, OnDestroy { this.initializeForm(); }); + this.userForm + .get('password') + .valueChanges.pipe(takeUntil(this._unsubscribeAll)) + .subscribe(() => { + this.userForm.get('passwordConfirm').updateValueAndValidity(); + }); } /** @@ -75,17 +89,33 @@ export class UserDetailComponent implements OnInit, OnDestroy { } ], password: '', + passwordConfirm: ['', confirmPasswordValidator], email: this.user.email, - nickname: this.user.nickname, + nickname: [this.user.nickname, Validators.required], phone: this.user.phone, descriptions: this.user.descriptions }); } // ----------------------------------------------------------------------------------------------------- - // @ Public methods + // @ Public methodsAbstractControl // ----------------------------------------------------------------------------------------------------- + updateUser(): void { + let updateUser: User = this.userForm.value; + const pw: string = this.userForm.get('password').value; + this.userService + .updateUser(this.user.id, updateUser, pw) + .pipe(take(1)) + .subscribe( + res => { + console.log(res); + }, + err => { + console.log(err); + } + ); + } /** * Update status */ @@ -101,3 +131,28 @@ export class UserDetailComponent implements OnInit, OnDestroy { // this.order.status.unshift(newStatus); } } + +export const confirmPasswordValidator: ValidatorFn = ( + control: AbstractControl +): ValidationErrors | null => { + if (!control.parent || !control) { + return null; + } + + const password = control.parent.get('password'); + const passwordConfirm = control.parent.get('passwordConfirm'); + + if (!password || !passwordConfirm) { + return null; + } + + if (passwordConfirm.value === '') { + return null; + } + + if (password.value === passwordConfirm.value) { + return null; + } + + return { passwordsNotMatching: true }; +}; diff --git a/src/app/pages/users/user/component/user-regist/user-regist.component.ts b/src/app/pages/users/user/component/user-regist/user-regist.component.ts index aa5299d..bbfa76b 100644 --- a/src/app/pages/users/user/component/user-regist/user-regist.component.ts +++ b/src/app/pages/users/user/component/user-regist/user-regist.component.ts @@ -11,7 +11,7 @@ import { Subject } from 'rxjs'; import { takeUntil } from 'rxjs/internal/operators'; import { take } from 'rxjs/operators'; import { fuseAnimations } from 'src/@fuse/animations'; -import { User } from 'src/modules/user/model/user.model'; + import { SignupRequest } from 'src/modules/auth/model/auth-signup-request.model'; import { AuthService } from 'src/modules/auth/service/auth.service'; @Component({ diff --git a/src/modules/user/model/user.model.ts b/src/modules/user/model/user.model.ts index 418e314..2b82d26 100644 --- a/src/modules/user/model/user.model.ts +++ b/src/modules/user/model/user.model.ts @@ -2,6 +2,7 @@ import { Role } from './role.model'; import { DateAudit } from 'src/modules/common/data/model/audit'; export interface User extends DateAudit { + id?: number; username?: string; nickname?: string; email?: string; diff --git a/src/modules/user/service/user.service.ts b/src/modules/user/service/user.service.ts index 6e053d8..f03c5dc 100644 --- a/src/modules/user/service/user.service.ts +++ b/src/modules/user/service/user.service.ts @@ -4,6 +4,7 @@ import { Observable } from 'rxjs'; import { User } from 'src/modules/user/model/user.model'; import { API_BASE_URL } from 'src/modules/common/type/injection-token.type'; import { Page } from 'src/modules/common/data/model/page'; +import { map } from 'rxjs/operators'; @Injectable() export class UserService { @@ -19,4 +20,33 @@ export class UserService { public getUser(id: number): Observable { return this.httpClient.get(`${this.apiBaseUrl}/users/${id}`, {}); } + + public updateUser( + id: number, + newUser: User, + newPassword: string + ): Observable { + const username = newUser.username; + const password = newPassword; + const email = newUser.email; + const phone = newUser.phone; + const descriptions = newUser.descriptions; + const nickname = newUser.nickname; + + return this.httpClient + .put(`${this.apiBaseUrl}/users/${id}`, { + username, + nickname, + email, + password, + descriptions, + phone + }) + .pipe( + map(res => { + console.log('update response: ' + res); + return res; + }) + ); + } }