회원수정 진행중

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

@@ -40,7 +40,7 @@
                 <span>가입일자</span>
                 <span class="mx-2">&bull;</span>
                 <span>{{
-                  selectedUser?.getCreatedAt() | date: "yyyy/MM/dd HH:mm"
+                  currentMember?.getCreatedAt() | date: "yyyy/MM/dd HH:mm"
                 }}</span>
               </div>
               <div class="flex items-center text-secondary my-1">
@@ -130,33 +130,36 @@
 
     <!-- Drawer content -->
     <mat-drawer-content class="flex flex-col">
-      <form class="flex flex-col w-full" [formGroup]="memberViewForm">
-        <!-- Main -->
-        <div class="flex-auto px-6 pt-9 pb-12 md:p-8 md:pb-12 lg:p-12">
-          <!-- Panel header -->
-          <div class="flex items-center">
-            <!-- Drawer toggle -->
-            <button
-              class="lg:hidden -ml-2"
-              mat-icon-button
-              (click)="drawer.toggle()"
-            >
-              <mat-icon [svgIcon]="'heroicons_outline:menu'"></mat-icon>
-            </button>
+      <!-- Main -->
+      <div class="flex-auto px-6 pt-9 pb-12 md:p-8 md:pb-12 lg:p-12">
+        <!-- Panel header -->
+        <div class="flex items-center">
+          <!-- Drawer toggle -->
+          <button
+            class="lg:hidden -ml-2"
+            mat-icon-button
+            (click)="drawer.toggle()"
+          >
+            <mat-icon [svgIcon]="'heroicons_outline:menu'"></mat-icon>
+          </button>
 
-            <!-- Panel title -->
-            <div
-              class="ml-2 lg:ml-0 text-3xl font-bold tracking-tight leading-none"
-            >
-              {{ getPanelInfo(selectedPanel).title }}
-            </div>
+          <!-- Panel title -->
+          <div
+            class="ml-2 lg:ml-0 text-3xl font-bold tracking-tight leading-none"
+          >
+            {{ getPanelInfo(selectedPanel).title }}
           </div>
+        </div>
 
-          <!-- Load settings panel -->
-          <div class="mt-8">
-            <ng-container [ngSwitch]="selectedPanel">
-              <!-- Account -->
-              <ng-container *ngSwitchCase="'account'">
+        <!-- Load settings panel -->
+        <div class="mt-8">
+          <ng-container [ngSwitch]="selectedPanel">
+            <!-- Account -->
+            <ng-container *ngSwitchCase="'accountInfo'">
+              <form
+                class="flex flex-col w-full"
+                [formGroup]="memberDefaultForm"
+              >
                 <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>아이디</mat-label>
@@ -174,14 +177,6 @@
                       [formControlName]="'signinPw'"
                     />
                   </mat-form-field>
-                  <mat-form-field class="w-1/3 pr-2">
-                    <mat-label>환전비밀번호</mat-label>
-                    <input
-                      id="exchangePw"
-                      matInput
-                      [formControlName]="'exchangePw'"
-                    />
-                  </mat-form-field>
                 </div>
                 <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
@@ -242,49 +237,7 @@
                     </mat-select>
                   </mat-form-field>
                 </div>
-                <div class="flex">
-                  <mat-form-field class="w-1/3 pr-2">
-                    <mat-label>은행명</mat-label>
 
-                    <mat-select
-                      [formControlName]="'bankId'"
-                      placeholder="은행 선택"
-                    >
-                      <mat-option
-                        *ngFor="let bank of banks"
-                        [value]="bank.getId()"
-                      >
-                        {{ bank.getName() }}
-                      </mat-option>
-                      <!-- <mat-option [value]="'0'"> 국민은행 </mat-option> -->
-                    </mat-select>
-                    <!-- <mat-error
-                *ngIf="
-                  composeForm.get('bankId')?.hasError('required')
-                "
-              >
-                은행명은 필수 입력입니다.
-              </mat-error> -->
-                  </mat-form-field>
-
-                  <mat-form-field class="w-1/3 pr-2">
-                    <mat-label>계좌번호</mat-label>
-                    <input
-                      type="text"
-                      matInput
-                      [formControlName]="'accountNumber'"
-                    />
-                  </mat-form-field>
-                  <mat-form-field class="w-1/3 pr-2">
-                    <mat-label>예금주</mat-label>
-                    <input
-                      id="accountHolder"
-                      type="text"
-                      matInput
-                      [formControlName]="'accountHolder'"
-                    />
-                  </mat-form-field>
-                </div>
                 <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>콤프</mat-label>
@@ -318,7 +271,7 @@
                     <mat-label>사이트변경</mat-label>
 
                     <mat-select
-                      [formControlName]="'changeSite'"
+                      [formControlName]="'siteId'"
                       placeholder="사이트 선택"
                     >
                       <mat-option
@@ -361,13 +314,80 @@
                     게임머니확인
                   </button>
                 </div>
+
+                <ng-container *ngTemplateOutlet="commonButton"></ng-container>
+              </form>
+            </ng-container>
+            <ng-container *ngSwitchCase="'bankInfo'">
+              <form class="flex flex-col w-full" [formGroup]="memberBankForm">
+                <div class="flex">
+                  <mat-form-field class="w-1/2 pr-2">
+                    <mat-label>환전비밀번호</mat-label>
+                    <input
+                      id="exchangePw"
+                      matInput
+                      [formControlName]="'exchangePw'"
+                    />
+                  </mat-form-field>
+                  <mat-form-field class="w-1/2 pr-2">
+                    <mat-label>은행명</mat-label>
+
+                    <mat-select
+                      [formControlName]="'bankId'"
+                      placeholder="은행 선택"
+                    >
+                      <mat-option
+                        *ngFor="let bank of banks"
+                        [value]="bank.getId()"
+                      >
+                        {{ bank.getName() }}
+                      </mat-option>
+                      <!-- <mat-option [value]="'0'"> 국민은행 </mat-option> -->
+                    </mat-select>
+                    <!-- <mat-error
+                *ngIf="
+                  composeForm.get('bankId')?.hasError('required')
+                "
+              >
+                은행명은 필수 입력입니다.
+              </mat-error> -->
+                  </mat-form-field>
+                </div>
+                <div class="flex">
+                  <mat-form-field class="w-1/2 pr-2">
+                    <mat-label>계좌번호</mat-label>
+                    <input
+                      type="text"
+                      matInput
+                      [formControlName]="'accountNumber'"
+                    />
+                  </mat-form-field>
+                  <mat-form-field class="w-1/2 pr-2">
+                    <mat-label>예금주</mat-label>
+                    <input
+                      id="accountHolder"
+                      type="text"
+                      matInput
+                      [formControlName]="'accountHolder'"
+                    />
+                  </mat-form-field>
+                </div>
+
                 <mat-form-field class="w-full fuse-mat-textarea">
                   <mat-label>메모</mat-label>
-                  <textarea matInput name="memo" row="5"></textarea>
+                  <textarea
+                    matInput
+                    name="memo"
+                    [formControlName]="'description'"
+                    row="5"
+                  ></textarea>
                 </mat-form-field>
-              </ng-container>
-              <!-- Security -->
-              <ng-container *ngSwitchCase="'security'">
+                <ng-container *ngTemplateOutlet="commonButton"></ng-container>
+              </form>
+            </ng-container>
+            <!-- Security -->
+            <ng-container *ngSwitchCase="'settleInfo'">
+              <form class="flex flex-col w-full" [formGroup]="memberSettleForm">
                 <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>바카라 요율</mat-label>
@@ -403,6 +423,7 @@
                     </div>
                   </mat-form-field>
                 </div>
+
                 <div class="flex">
                   <mat-form-field class="w-1/3 pr-2">
                     <mat-label>기타 게임 요율</mat-label>
@@ -475,9 +496,15 @@
                     </mat-radio-button>
                   </mat-radio-group>
                 </div>
-              </ng-container>
-              <!-- Plan & Billing -->
-              <ng-container *ngSwitchCase="'plan-billing'">
+              </form>
+              <ng-container *ngTemplateOutlet="commonButton"></ng-container>
+            </ng-container>
+            <!-- Plan & Billing -->
+            <ng-container *ngSwitchCase="'gameInfo'">
+              <form
+                class="flex flex-col w-full"
+                [formGroup]="memberGameSettingForm"
+              >
                 <div class="flex">
                   <span class="w-1/3 pr-2">
                     <mat-slide-toggle [color]="'primary'">
@@ -510,15 +537,30 @@
                     <mat-label>/ 0원(이전일: 0원)</mat-label>
                   </span>
                 </div>
-              </ng-container>
-              <!-- Notifications -->
-              <ng-container *ngSwitchCase="'notifications'"
-                ><div>내역</div>
-              </ng-container>
+              </form>
+              <ng-container *ngTemplateOutlet="commonButton"></ng-container>
             </ng-container>
-          </div>
+            <!-- Notifications -->
+            <ng-container *ngSwitchCase="'historyInfo'"
+              ><div>내역</div>
+            </ng-container>
+          </ng-container>
         </div>
-      </form>
+      </div>
     </mat-drawer-content>
   </mat-drawer-container>
 </div>
+
+<ng-template #commonButton>
+  <div class="flex items-center w-full border-t divide-x">
+    <button
+      class="-ml-4"
+      mat-flat-button
+      [color]="'primary'"
+      (click)="__modifyMember()"
+    >
+      수정
+    </button>
+    <button class="-ml-4" mat-flat-button [color]="'primary'">목록으로</button>
+  </div>
+</ng-template>

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

@@ -32,7 +32,10 @@ import { FuseConfirmationService } from '@fuse/services/confirmation';
 import { User } from '../models/user';
 import { UserService } from '../services/user.service';
 import { ActivatedRoute } from '@angular/router';
-import { GetMemberResponse } from 'app/modules/proto/c2se/member_pb';
+import {
+  GetMemberResponse,
+  UpdateMemberRequest,
+} from 'app/modules/proto/c2se/member_pb';
 import { MemberModel } 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';
@@ -44,6 +47,7 @@ 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';
 
 @Component({
   selector: 'user-view',
@@ -82,12 +86,17 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
 
   isLoading = false;
   searchInputControl = new FormControl();
-  memberViewForm!: FormGroup;
-  /* selectedUser?: User; */
-  selectedUser?: MemberModel;
+
+  memberDefaultForm!: FormGroup;
+  memberBankForm!: FormGroup;
+  memberSettleForm!: FormGroup;
+  memberGameSettingForm!: FormGroup;
+
+  /* currentMember?: User; */
+  currentMember?: MemberModel;
 
   panels: any[] = [];
-  selectedPanel: string = 'account';
+  selectedPanel: string = 'accountInfo';
 
   memberLevels!: MemberLevel[];
   banks!: Bank[];
@@ -119,29 +128,34 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
    * On init
    */
   ngOnInit(): void {
-    this.memberViewForm = this._formBuilder.group({
+    this.memberDefaultForm = this._formBuilder.group({
       id: [''],
       username: [{ value: '', disabled: true }],
       signinPw: [{ value: '' }],
-      exchangePw: [''],
-      description: [''],
-      tags: [[]],
+
       nickname: [{ value: '', disabled: true }],
       ownCash: [''],
       mobilePhoneNumber: [''],
       levelId: [''],
       state: [''],
       isExcahngeMoney: [''],
-      bankId: [''],
-      accountNumber: [''],
-      accountHolder: [''],
       comp: [''],
       coupon: [''],
       recommender: [{ value: '', disabled: true }],
-      changeSite: [''],
+      siteId: [''],
       recommendCount: [''],
       hodingGameMoney: [{ value: '0', disabled: true }],
-      memo: [''],
+    });
+
+    this.memberBankForm = this._formBuilder.group({
+      bankId: [''],
+      accountNumber: [''],
+      accountHolder: [''],
+      exchangePw: [''],
+      description: [''],
+    });
+
+    this.memberSettleForm = this._formBuilder.group({
       bacaraRate: [],
       rulletRate: [],
       dragonRate: [],
@@ -151,28 +165,36 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
       slotRusingRate: [],
     });
 
+    this.memberGameSettingForm = this._formBuilder.group({});
+
     this.panels = [
       {
-        id: 'account',
+        id: 'accountInfo',
         icon: 'heroicons_outline:user-circle',
         title: '기본정보',
         description: 'Manage your public profile and private information',
       },
       {
-        id: 'security',
+        id: 'bankInfo',
+        icon: 'heroicons_outline:user-circle',
+        title: '계좌정보',
+        description: 'Manage your public profile and private information',
+      },
+      {
+        id: 'settleInfo',
         icon: 'heroicons_outline:lock-closed',
         title: '정산설정',
         description: 'Manage your password and 2-step verification preferences',
       },
       {
-        id: 'plan-billing',
+        id: 'gameInfo',
         icon: 'heroicons_outline:credit-card',
         title: '게임설정',
         description:
           'Manage your subscription plan, payment method and billing information',
       },
       {
-        id: 'notifications',
+        id: 'historyInfo',
         icon: 'heroicons_outline:bell',
         title: '내역',
         description: "Manage when you'll be notified on which channels",
@@ -211,18 +233,18 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
     this._activatedRoute.data.subscribe((data) => {
       let member: GetMemberResponse.Result = data['member'];
 
-      this.selectedUser = member.getMember();
+      this.currentMember = member.getMember();
 
       /* console.log('dddd', listMemberResult.getMembersList()); */
-      this.memberViewForm.patchValue({
-        username: this.selectedUser?.getUsername(),
+      this.memberDefaultForm.patchValue({
+        username: this.currentMember?.getUsername(),
         signinPw: '',
         exchangePw: '',
-        mobilePhoneNumber: this.selectedUser?.getMobilePhoneNumber(),
-        levelId: this.selectedUser?.getMemberLevel()?.getId(),
-        state: this.selectedUser?.getState(),
-        nickname: this.selectedUser?.getNickname(),
-        bankId: this.selectedUser?.getBankAccount()?.getId(),
+        mobilePhoneNumber: this.currentMember?.getMobilePhoneNumber(),
+        levelId: this.currentMember?.getMemberLevel()?.getId(),
+        state: this.currentMember?.getState(),
+        nickname: this.currentMember?.getNickname(),
+        bankId: this.currentMember?.getBankAccount()?.getId(),
       });
       // Mark for check
       this._changeDetectorRef.markForCheck();
@@ -274,15 +296,77 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
   }
 
   __modifyMember(): void {
-    const valueForm = this.memberViewForm.value;
-    console.log('v: ', valueForm);
-    /* this._memberService.updateMember(
-      this.selectedUser!.getId(),
-      this.selectedUser!.getSite()!.getId(),
-      this.selectedUser!.getMemberLevel()!.getId(),
-      'beteran',
-      valueForm.mobilePhoneNumber
-    ); */
+    if (!this.currentMember?.getId()) {
+      return;
+    }
+
+    const req = new UpdateMemberRequest();
+    req.setId(this.currentMember?.getId());
+
+    switch (this.selectedPanel) {
+      case 'accountInfo':
+        {
+          const {
+            username,
+            signinPw,
+            nickname,
+            ownCash,
+            mobilePhoneNumber,
+            levelId,
+            state,
+            isExcahngeMoney,
+            comp,
+            coupon,
+            siteId,
+            hodingGameMoney,
+          } = this.memberDefaultForm.value;
+          if (!!signinPw && signinPw == '') {
+            req.setPassword(signinPw);
+          }
+          if (!!levelId && levelId == '') {
+            req.setMemberLevelId(levelId);
+          }
+          if (!!mobilePhoneNumber && mobilePhoneNumber == '') {
+            req.setMobilePhoneNumber(mobilePhoneNumber);
+          }
+          if (!!siteId && siteId == '') {
+            req.setSiteId(siteId);
+          }
+        }
+
+        break;
+      case 'bankInfo':
+        {
+          if (!this.memberBankForm.valid) {
+            return;
+          }
+          const { exchangePw, accountHolder, accountNumber, description } =
+            this.memberBankForm.value;
+
+          const bank = new UpdateMemberRequest.BankAccount();
+          const bankId = this.currentMember?.getBankAccount()?.getId();
+          if (!!bankId) {
+            bank.setId(bankId);
+            bank.setAccountNumber(accountNumber);
+            bank.setName(accountHolder);
+            bank.setExchangePassword(exchangePw);
+          }
+          req.setBankAccount(bank);
+        }
+
+        break;
+      case 'settleInfo':
+        break;
+      case 'gameInfo':
+        break;
+      case 'historyInfo':
+        break;
+      default:
+        break;
+    }
+    this._memberService.updateMember(req).then((result) => {
+      console.log(result);
+    });
   }
 
   /**

src/app/modules/polyglot/member/services/member.service.ts

@@ -117,30 +117,8 @@ export class MemberService {
     );
   }
 
-  updateMember(
-    id: string,
-    siteId: string,
-    memberLevelId: string,
-    password: string,
-    mobilePhoneNumber: string
-  ): Promise<UpdateMemberResponse.Result> {
+  updateMember(req: UpdateMemberRequest): Promise<UpdateMemberResponse.Result> {
     return new Promise<UpdateMemberResponse.Result>((resolve, reject) => {
-      let req = new UpdateMemberRequest();
-      req.setId(id);
-
-      if (!!siteId) {
-        req.setSiteId(siteId);
-      }
-      if (!!memberLevelId) {
-        req.setMemberLevelId(memberLevelId);
-      }
-      if (!!password) {
-        req.setPassword(password);
-      }
-      if (!!mobilePhoneNumber) {
-        req.setMobilePhoneNumber(mobilePhoneNumber);
-      }
-
       this.__natsService
         .request<UpdateMemberResponse.Result>(
           SUBJECT_UPDATE_MEMBER,