회원 수정

2022-08-24 09:43:15 +00:00 · 2022-08-24 09:43:15 +00:00 · 0f55e309ee
commit 0f55e309ee
parent 7ce5df45be
3 changed files with 247 additions and 33 deletions
--- a/src/app/modules/admin/member/user/components/view.component.html
+++ b/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'">
-                      <!-- <ng-container *ngFor="let brand of brands"> -->
-                      <mat-option value="brand.id"> brand option </mat-option>
-                      <!-- </ng-container> -->
+                    <mat-select
+                      id="state"
+                      [formControlName]="'state'"
+                      (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-2/3 pr-2">
+
+                  <mat-form-field class="w-1/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>
--- a/src/app/modules/admin/member/user/components/view.component.ts
+++ b/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);
+  }
 }
--- a/src/app/modules/admin/member/user/user.module.ts
+++ b/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 {}