회원 수정

src/app/modules/admin/member/user/components/view.component.html

@@ -149,6 +149,16 @@
           >
             {{ getPanelInfo(selectedPanel).title }}
           </div>
+          <fuse-alert
+            class="ml-8 pl-8"
+            *ngIf="changePasswordResultShowAlert"
+            [appearance]="'outline'"
+            [showIcon]="false"
+            [type]="alertConfig.type"
+            [@shake]="alertConfig.type === 'error'"
+          >
+            {{ alertConfig.message }}
+          </fuse-alert>
         </div>
 
         <!-- Load settings panel -->
@@ -169,16 +179,6 @@
                       [formControlName]="'username'"
                     />
                   </mat-form-field>
-                  <mat-form-field class="w-1/3 pr-2">
-                    <mat-label>비밀번호</mat-label>
-                    <input
-                      id="signinPw"
-                      matInput
-                      [formControlName]="'signinPw'"
-                    />
-                  </mat-form-field>
-                </div>
-                <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>닉네임</mat-label>
                     <input
@@ -187,14 +187,6 @@
                       [formControlName]="'nickname'"
                     />
                   </mat-form-field>
-                  <mat-form-field class="w-1/3 pr-2">
-                    <mat-label>보유머니</mat-label>
-                    <input
-                      id="ownCash"
-                      matInput
-                      [formControlName]="'ownCash'"
-                    />
-                  </mat-form-field>
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>핸드폰</mat-label>
                     <input
@@ -204,6 +196,34 @@
                     />
                   </mat-form-field>
                 </div>
+                <div class="flex">
+                  <mat-form-field class="w-1/3 pr-2">
+                    <mat-label>비밀번호</mat-label>
+                    <input
+                      id="signinPw"
+                      matInput
+                      [formControlName]="'signinPw'"
+                    />
+                  </mat-form-field>
+                  <mat-form-field class="w-1/3 pr-2">
+                    <mat-label>비밀번호 확인</mat-label>
+                    <input
+                      id="signinPwConfirm"
+                      matInput
+                      [formControlName]="'signinPwConfirm'"
+                    />
+                  </mat-form-field>
+                  <div class="w-1/3 pr-2 mt-8">
+                    <button
+                      mat-flat-button
+                      [color]="'primary'"
+                      (click)="__changePassword()"
+                    >
+                      비밀번호 수정
+                    </button>
+                  </div>
+                </div>
+
                 <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>레벨</mat-label>
@@ -222,10 +242,16 @@
                   </mat-form-field>
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>상태</mat-label>
-                    <mat-select id="state" [formControlName]="'state'">
+                    <mat-select
-                      <!-- <ng-container *ngFor="let brand of brands"> -->
+                      id="state"
-                      <mat-option value="brand.id"> brand option </mat-option>
+                      [formControlName]="'state'"
-                      <!-- </ng-container> -->
+                      (selectionChange)="onSelectionChangeLanguage($event)"
+                    >
+                      <ng-container *ngFor="let info of memberStateOptions">
+                        <mat-option [value]="info.value">
+                          {{ info.label }}
+                        </mat-option>
+                      </ng-container>
                     </mat-select>
                   </mat-form-field>
                   <mat-form-field class="w-1/3 pr-2">
@@ -239,6 +265,14 @@
                 </div>
 
                 <div class="flex">
+                  <mat-form-field class="w-1/3 pr-2">
+                    <mat-label>보유머니</mat-label>
+                    <input
+                      id="ownCash"
+                      matInput
+                      [formControlName]="'ownCash'"
+                    />
+                  </mat-form-field>
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>콤프</mat-label>
                     <input
@@ -257,6 +291,8 @@
                       [formControlName]="'coupon'"
                     />
                   </mat-form-field>
+                </div>
+                <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>추천인</mat-label>
                     <input
@@ -265,9 +301,8 @@
                       [formControlName]="'recommender'"
                     />
                   </mat-form-field>
-                </div>
+
-                <div class="flex">
+                  <mat-form-field class="w-1/3 pr-2">
-                  <mat-form-field class="w-2/3 pr-2">
                     <mat-label>사이트변경</mat-label>
 
                     <mat-select
@@ -469,12 +504,12 @@
                   </mat-form-field>
                   <span class="w-1/3 pr-2">
                     <mat-slide-toggle [color]="'primary'">
-                      카지노 베팅
+                      첫충콤프
                     </mat-slide-toggle>
                   </span>
                   <span class="w-1/3 pr-2">
                     <mat-slide-toggle [color]="'primary'">
-                      슬롯베팅
+                      매충콤프
                     </mat-slide-toggle>
                   </span>
                 </div>
@@ -513,12 +548,12 @@
                   </span>
                   <span class="w-1/3 pr-2">
                     <mat-slide-toggle [color]="'primary'">
-                      첫충콤프
+                      카지노 베팅
                     </mat-slide-toggle>
                   </span>
                   <span class="w-1/3 pr-2">
                     <mat-slide-toggle [color]="'primary'">
-                      매충콤프
+                      슬롯베팅
                     </mat-slide-toggle>
                   </span>
                 </div>

src/app/modules/admin/member/user/components/view.component.ts

@@ -9,9 +9,11 @@ import {
   ViewEncapsulation,
 } from '@angular/core';
 import {
+  AbstractControl,
   FormBuilder,
   FormControl,
   FormGroup,
+  ValidatorFn,
   Validators,
 } from '@angular/forms';
 import { MatCheckboxChange } from '@angular/material/checkbox';
@@ -34,9 +36,11 @@ import { UserService } from '../services/user.service';
 import { ActivatedRoute } from '@angular/router';
 import {
   GetMemberResponse,
+  UpdateMemberForPasswordRequest,
+  UpdateMemberForStateRequest,
   UpdateMemberRequest,
 } from 'app/modules/proto/c2se/member_pb';
-import { MemberModel } from 'app/modules/proto/models/member_pb';
+import { MemberModel, MemberState } from 'app/modules/proto/models/member_pb';
 import { MemberService } from 'app/modules/polyglot/member/services/member.service';
 import { MemberLevelService } from 'app/modules/polyglot/member_level/services/member_level.service';
 import { BankService } from 'app/modules/polyglot/bank/services/bank.service';
@@ -47,7 +51,8 @@ import { Site } from 'app/modules/proto/models/site_pb';
 import { MatDrawer } from '@angular/material/sidenav';
 
 import { FuseMediaWatcherService } from '@fuse/services/media-watcher';
-import { UpdateBankRequest } from 'app/modules/proto/c2se/bank_pb';
+import { FuseAlertType } from '@fuse/components/alert';
+import { MatSelectChange } from '@angular/material/select';
 
 @Component({
   selector: 'user-view',
@@ -87,11 +92,47 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
   isLoading = false;
   searchInputControl = new FormControl();
 
+  /* NONE: 0;
+  NORMAL: 1;
+  PENDING: 2;
+  WITHDRAWAL: 3;
+  DORMANCY: 4;
+  BLACKLIST: 5;
+  SUSPENDED: 6; */
+  memberStateOptions = [
+    {
+      value: 1,
+      label: '정상',
+    },
+    {
+      value: 2,
+      label: '대기',
+    },
+    {
+      value: 3,
+      label: '탈퇴',
+    },
+    {
+      value: 4,
+      label: '휴면',
+    },
+    {
+      value: 5,
+      label: '블랙',
+    },
+    {
+      value: 6,
+      label: '정지',
+    },
+  ];
+
   memberDefaultForm!: FormGroup;
   memberBankForm!: FormGroup;
   memberSettleForm!: FormGroup;
   memberGameSettingForm!: FormGroup;
 
+  passwordConfirmConfigForm!: FormGroup;
+
   /* currentMember?: User; */
   currentMember?: MemberModel;
 
@@ -102,6 +143,13 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
   banks!: Bank[];
   sites!: Site[];
 
+  alertConfig: { type: FuseAlertType; message: string } = {
+    type: 'success',
+    message: '비밀번호가 수정 되었습니다.',
+  };
+
+  changePasswordResultShowAlert: boolean = false;
+
   private _unsubscribeAll: Subject<any> = new Subject<any>();
 
   /**
@@ -131,8 +179,8 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
     this.memberDefaultForm = this._formBuilder.group({
       id: [''],
       username: [{ value: '', disabled: true }],
-      signinPw: [{ value: '' }],
+      signinPw: [''],
-
+      signinPwConfirm: [''],
       nickname: [{ value: '', disabled: true }],
       ownCash: [''],
       mobilePhoneNumber: [''],
@@ -167,6 +215,28 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
 
     this.memberGameSettingForm = this._formBuilder.group({});
 
+    this.passwordConfirmConfigForm = this._formBuilder.group({
+      title: '알림',
+      message: '비밀번호를 변경 하시겠습니까?',
+      icon: this._formBuilder.group({
+        show: true,
+        name: 'heroicons_outline:exclamation',
+        color: 'warn',
+      }),
+      actions: this._formBuilder.group({
+        confirm: this._formBuilder.group({
+          show: true,
+          label: '확인',
+          color: 'warn',
+        }),
+        cancel: this._formBuilder.group({
+          show: true,
+          label: '취소',
+        }),
+      }),
+      dismissible: true,
+    });
+
     this.panels = [
       {
         id: 'accountInfo',
@@ -235,6 +305,8 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
 
       this.currentMember = member.getMember();
 
+      console.log(this.currentMember?.getState());
+
       /* console.log('dddd', listMemberResult.getMembersList()); */
       this.memberDefaultForm.patchValue({
         username: this.currentMember?.getUsername(),
@@ -398,4 +470,109 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
   trackByFn(index: number, item: any): any {
     return item.id || index;
   }
+
+  __changePassword(): void {
+    const password = this.memberDefaultForm.get('signinPw')?.value as string;
+    const passwordConfirm = this.memberDefaultForm.get('signinPwConfirm')
+      ?.value as string;
+
+    if (!password || !passwordConfirm) {
+      this.changePasswordResultShowAlert = true;
+      this.alertConfig = {
+        type: 'error',
+        message: '비밀번호를 입력하세요.',
+      };
+      this.closeChangePasswordAlert();
+      return;
+    }
+
+    if (password !== passwordConfirm) {
+      this.changePasswordResultShowAlert = true;
+      this.alertConfig = {
+        type: 'error',
+        message: '비밀번호가 일치하지 않습니다.',
+      };
+      this.closeChangePasswordAlert();
+      return;
+    }
+
+    const dialogRef = this._fuseConfirmationService.open(
+      this.passwordConfirmConfigForm.value
+    );
+
+    /* const dialogRef = this._matDialog.open(AddComposeComponent); */
+
+    dialogRef.afterClosed().subscribe((result) => {
+      if (result === 'confirmed') {
+        const req = new UpdateMemberForPasswordRequest();
+        req.setPassword(password);
+        req.setId(this.currentMember!.getId());
+        this._memberService
+          .updateMemberForPassword(req)
+          .then((result) => {
+            this.alertConfig = {
+              type: 'success',
+              message: '비밀번호가 수정 되었습니다.',
+            };
+            this.changePasswordResultShowAlert = true;
+          })
+          .catch((reson) => {
+            this.changePasswordResultShowAlert = true;
+            // Set the alert
+            this.alertConfig = {
+              type: 'error',
+              message: '패스워드 변경이 실패하였습니다.',
+            };
+          })
+          .finally(() => this.closeChangePasswordAlert());
+      }
+    });
+  }
+
+  onSelectionChangeLanguage(event: MatSelectChange) {
+    const state = event.value;
+
+    if (!state) {
+      this.alertConfig = {
+        type: 'error',
+        message: '상태값이 선택 되지 않았습니다.',
+      };
+      this.closeChangePasswordAlert();
+      return;
+    }
+
+    const req = new UpdateMemberForStateRequest();
+    req.setId(this.currentMember!.getId());
+    req.setState(state);
+
+    this._memberService
+      .updateMemberForState(req)
+      .then((result) => {
+        this.changePasswordResultShowAlert = true;
+        this.alertConfig = {
+          type: 'success',
+          message: '회원 상태가 수정 되었습니다.',
+        };
+      })
+      .catch((reson) => {
+        this.changePasswordResultShowAlert = true;
+        // Set the alert
+        this.alertConfig = {
+          type: 'error',
+          message: '회원 상태 변경이 실패하였습니다.',
+        };
+      })
+      .finally(() => this.closeChangePasswordAlert());
+  }
+
+  __changeMemberState(): void {
+    const state = this.memberDefaultForm.get('state')?.value;
+  }
+
+  private closeChangePasswordAlert(): void {
+    setTimeout(() => {
+      this.changePasswordResultShowAlert = false;
+      this._changeDetectorRef.markForCheck();
+    }, 5000);
+  }
 }

src/app/modules/admin/member/user/user.module.ts

@@ -25,6 +25,7 @@ import { MatTabsModule } from '@angular/material/tabs';
 import { MatSidenavModule } from '@angular/material/sidenav';
 
 import { FuseCardModule } from '@fuse/components/card';
+import { FuseAlertModule } from '@fuse/components/alert';
 
 import { TranslocoModule } from '@ngneat/transloco';
 
@@ -66,6 +67,7 @@ import { userRoutes } from 'app/modules/admin/member/user/user.routing';
     MatSidenavModule,
 
     FuseCardModule,
+    FuseAlertModule,
   ],
 })
 export class UserModule {}