Merge branch 'feature/BETERAN-BACKEND-APP-BROWSER-init' of https://gitlab.loafle.net/bet/beteran-backend-app-browser into feature/BETERAN-BACKEND-APP-BROWSER-init

2022-08-18 03:39:57 +00:00 · 2022-08-18 03:39:57 +00:00 · c1c9cb038c
commit c1c9cb038c
parent cea7d0152b 26ce63d550
14 changed files with 402 additions and 182 deletions
--- a/src/app/modules/admin/bank/deposit/components/list.component.html
+++ b/src/app/modules/admin/bank/deposit/components/list.component.html
@ -105,8 +105,8 @@
    <div
      class="flex flex-col flex-auto sm:mb-18 overflow-hidden sm:overflow-y-auto"
    >
-      <ng-container *ngIf="deposits$ | async as deposits">
-        <ng-container *ngIf="deposits.length > 0; else noDeposit">
+      <ng-container *ngIf="bankDeposit$ | async as bankDeposit">
+        <ng-container *ngIf="bankDeposit.length > 0; else noDeposit">
          <div class="grid">
            <!-- Header -->
            <div
@ -145,9 +145,13 @@
              <div class="hidden lg:block">삭제</div>
            </div>
            <!-- Rows -->
-            <ng-container *ngIf="deposits$ | async as deposits">
+            <ng-container *ngIf="bankDeposit$ | async as bankDeposit">
              <ng-container
-                *ngFor="let deposit of deposits; trackBy: __trackByFn"
+                *ngFor="
+                  let deposit of bankDeposit;
+                  trackBy: __trackByFn;
+                  let idx = index
+                "
              >
                <div
                  class="deposit-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
@ -155,45 +159,55 @@
                  <div>
                    <mat-checkbox></mat-checkbox>
                  </div>
-                  <div>{{ deposit.highRank }}</div>
+                  <!-- 상부 -->
+                  <div>test {{ idx }}</div>
+                  <!-- 아이디, 닉네임 -->
                  <div>
                    <div
-                      (click)="viewUserDetail(deposit.id!)"
+                      (click)="viewUserDetail(deposit.getMemberId())"
                      style="cursor: pointer"
                    >
-                      {{ deposit.signinId }}
+                      test {{ idx }}
                    </div>
                    <hr style="margin: 7px 0px" />
-                    {{ deposit.nickname }}
+                    test {{ idx }}
                  </div>
+                  <!-- 등급, 레벨, 상태 -->
                  <div>
-                    {{ deposit.rank }}
+                    test {{ idx }}
                    <hr style="margin: 7px 0px" />
-                    LV{{ deposit.level }}
+                    test {{ idx }}
                    <hr style="margin: 7px 0px" />
-                    {{ deposit.state }}
+                    test {{ idx }}
                  </div>
+                  <!-- 예금주 -->
                  <div class="hidden sm:block">
-                    {{ deposit.accountHolder }}
+                    {{ deposit.getName() }}
                  </div>
-                  <div>{{ deposit.calculateType }}</div>
-                  <div>{{ deposit.note }}</div>
-                  <div>{{ deposit.depositAmount }}</div>
+                  <!-- 정산종류 -->
+                  <div>{{ idx % 2 === 0 ? "롤링" : "콤프" }}</div>
+                  <!-- 비고 -->
+                  <div>test {{ idx }}</div>
+                  <!-- 입금예정금액 -->
+                  <div>test {{ idx }}</div>
+                  <!-- 등록날짜, 처리날짜 -->
                  <div class="hidden md:block">
-                    {{ deposit.registrationDate }}
+                    {{ deposit.getCreatedAt() | date: "yyyy-MM-dd HH:mm" }}
                    <hr style="margin: 7px 0px" />
-                    {{ deposit.processDate }}
+                    {{ deposit.getStateChangedAt() | date: "yyyy-MM-dd HH:mm" }}
                  </div>
+                  <!-- 입금, 출금 -->
                  <div class="hidden md:block">
-                    입금{{ deposit.deposit }}
+                    <span>41,200,000원</span>
+
                    <hr style="margin: 7px 0px" />
-                    출금{{ deposit.withdraw }}
+                    <span>19,000,000원</span>
+
                    <hr style="margin: 7px 0px" />
-                    계{{ deposit.totalMoney }}
-                  </div>
-                  <div class="hidden md:block">
-                    {{ deposit.gameMoney }}
+                    <span>22,200,000원</span>
                  </div>
+                  <!-- 게임중머니 -->
+                  <div class="hidden md:block">test {{ idx }}</div>
                  <div class="hidden lg:block">
                    <button
                      mat-flat-button
--- a/src/app/modules/admin/bank/deposit/components/list.component.ts
+++ b/src/app/modules/admin/bank/deposit/components/list.component.ts
@ -22,6 +22,7 @@ import {
  map,
  merge,
  Observable,
+  of,
  Subject,
  switchMap,
  takeUntil,
@ -32,7 +33,9 @@ import { FuseConfirmationService } from '@fuse/services/confirmation';
 import { Deposit } from '../models/deposit';
 import { DepositPagination } from '../models/deposit-pagination';
 import { DepositService } from '../services/deposit.service';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
+import { ListMemberBankDepositsResponse } from 'app/modules/proto/c2se/member_bank_deposit_pb';
+import { MemberBankDeposit } from 'app/modules/proto/models/member_bank_deposit_pb';

@Component({
  selector: 'deposit-list',
@ -69,7 +72,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
  @ViewChild(MatPaginator) private _paginator!: MatPaginator;
  @ViewChild(MatSort) private _sort!: MatSort;

-  deposits$!: Observable<Deposit[] | undefined>;
+  bankDeposit$!: Observable<MemberBankDeposit[] | undefined>;

  __isSearchOpened = false;
  isLoading = false;
@ -83,6 +86,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
   * Constructor
   */
  constructor(
+    private _activatedRoute: ActivatedRoute,
    private _changeDetectorRef: ChangeDetectorRef,
    private _fuseConfirmationService: FuseConfirmationService,
    private _formBuilder: FormBuilder,
@ -110,7 +114,20 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
      });

    // Get the products
-    this.deposits$ = this._depositService.deposits$;
+
+    this._activatedRoute.data.subscribe((data) => {
+      let listBankDepositResult: ListMemberBankDepositsResponse.Result =
+        data['bankDeposit'];
+      this.bankDeposit$ = of(listBankDepositResult.getMemberBankDepositsList());
+
+      console.log(
+        'bankWithdraw: ',
+        listBankDepositResult.getMemberBankDepositsList()
+      );
+
+      // Mark for check
+      this._changeDetectorRef.markForCheck();
+    });
  }

  /**
--- a/src/app/modules/admin/bank/deposit/deposit.routing.ts
+++ b/src/app/modules/admin/bank/deposit/deposit.routing.ts
@ -3,7 +3,10 @@ import { Route } from '@angular/router';
 import { ListComponent } from './components/list.component';
 import { ViewComponent } from '../../member/user/components/view.component';

-import { DepositsResolver } from './resolvers/deposit.resolver';
+import {
+  BankDepositResolver,
+  DepositsResolver,
+} from './resolvers/deposit.resolver';
 import { UserResolver } from '../../dashboards/user/user.resolvers';

 export const depositRoutes: Route[] = [
@ -11,7 +14,7 @@ export const depositRoutes: Route[] = [
    path: '',
    component: ListComponent,
    resolve: {
-      deposits: DepositsResolver,
+      bankDeposit: BankDepositResolver,
    },
  },
  {
--- a/src/app/modules/admin/bank/deposit/resolvers/deposit.resolver.ts
+++ b/src/app/modules/admin/bank/deposit/resolvers/deposit.resolver.ts
@ -5,6 +5,8 @@ import {
  Router,
  RouterStateSnapshot,
 } from '@angular/router';
+import { MemberBankDepositService } from 'app/modules/polyglot/member_bank_deposit/services/member_bank_deposit.service';
+import { ListMemberBankDepositsResponse } from 'app/modules/proto/c2se/member_bank_deposit_pb';
 import { catchError, Observable, throwError } from 'rxjs';

 import { Deposit } from '../models/deposit';
@ -85,3 +87,33 @@ export class DepositsResolver implements Resolve<any> {
    return this._depositService.getDeposits();
  }
 }
+
+@Injectable({
+  providedIn: 'root',
+})
+export class BankDepositResolver implements Resolve<any> {
+  /**
+   * Constructor
+   */
+  constructor(private _bankDepositService: MemberBankDepositService) {}
+
+  // -----------------------------------------------------------------------------------------------------
+  // @ Public methods
+  // -----------------------------------------------------------------------------------------------------
+
+  /**
+   * Resolver
+   *
+   * @param route
+   * @param state
+   */
+  resolve(
+    route: ActivatedRouteSnapshot,
+    state: RouterStateSnapshot
+  ):
+    | Observable<ListMemberBankDepositsResponse.Result>
+    | Promise<ListMemberBankDepositsResponse.Result>
+    | ListMemberBankDepositsResponse.Result {
+    return this._bankDepositService.listMemberBankDeposits();
+  }
+}
--- a/src/app/modules/admin/bank/withdraw/components/list.component.html
+++ b/src/app/modules/admin/bank/withdraw/components/list.component.html
@ -35,6 +35,24 @@
  </div>

  <!-- Search -->
+  <div class="flex items-center mt-2 mb-2 ml-6">
+    <div>
+      <button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
+        환전처리
+      </button>
+    </div>
+    <div>
+      <button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
+        대기처리
+      </button>
+    </div>
+    <div>
+      <button mat-flat-button class="bet-mat-small-8" [color]="'warn'">
+        환전취소
+      </button>
+    </div>
+  </div>
+  <hr style="margin: 7px 0px" />
  <div
    *ngIf="__isSearchOpened"
    class="relative flex flex-col sm:flex-row flex-0 sm:items-center sm:justify-between py-4 px-6 md:px-8 border-b"
@ -91,27 +109,12 @@
  </div>
  <!-- Main -->
  <div class="flex flex-auto overflow-hidden">
-    <div>
-      <button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
-        환전처리
-      </button>
-    </div>
-    <div>
-      <button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
-        대기처리
-      </button>
-    </div>
-    <div>
-      <button mat-flat-button class="bet-mat-small-8" [color]="'warn'">
-        환전취소
-      </button>
-    </div>
    <!-- Products list -->
    <div
      class="flex flex-col flex-auto sm:mb-18 overflow-hidden sm:overflow-y-auto"
    >
-      <ng-container *ngIf="withdraws$ | async as withdraws">
-        <ng-container *ngIf="withdraws.length > 0; else noWithdraw">
+      <ng-container *ngIf="bankWithdraw$ | async as bankWithdraw">
+        <ng-container *ngIf="bankWithdraw.length > 0; else noWithdraw">
          <div class="grid">
            <!-- Header -->
            <div
@ -120,37 +123,54 @@
              <div>
                <mat-checkbox></mat-checkbox>
              </div>
-              <div>상부</div>
+
              <div>
+                구분
+                <hr style="margin: 7px 0px" />
                아이디
                <hr style="margin: 7px 0px" />
                닉네임
              </div>
-              <div>
-                등급
-                <hr style="margin: 7px 0px" />
-                레벨
-                <hr style="margin: 7px 0px" />
-                상태
-              </div>
-              <div class="hidden sm:block">예금주</div>
-              <div>정산종류</div>
-              <div>비고</div>
              <div>환전신청금액</div>
+              <div>정산종류</div>
+              <div>
+                은행명
+                <hr style="margin: 7px 0px" />
+                계좌번호
+                <hr style="margin: 7px 0px" />
+                예금주
+              </div>
+              <div>비고</div>
              <div class="hidden md:block">
                등록날짜
                <hr style="margin: 7px 0px" />
                처리날짜
              </div>
-              <div class="hidden md:block">입금출금</div>
-              <div class="hidden lg:block">회원정보</div>
-              <div class="hidden lg:block">배팅정보</div>
+              <div class="hidden md:block">
+                입금
+                <hr style="margin: 7px 0px" />
+                출금
+                <hr style="margin: 7px 0px" />
+                보유금
+              </div>
+              <div class="hidden lg:block">
+                상위
+                <hr style="margin: 7px 0px" />
+                회원정보
+                <hr style="margin: 7px 0px" />
+                배팅정보
+              </div>
+              <div class="hidden lg:block">상태</div>
              <div class="hidden lg:block">삭제</div>
            </div>
            <!-- Rows -->
-            <ng-container *ngIf="withdraws$ | async as withdraws">
+            <ng-container *ngIf="bankWithdraw$ | async as bankWithdraw">
              <ng-container
-                *ngFor="let withdraw of withdraws; trackBy: __trackByFn"
+                *ngFor="
+                  let withdraw of bankWithdraw;
+                  trackBy: __trackByFn;
+                  let idx = index
+                "
              >
                <div
                  class="withdraw-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
@ -158,43 +178,62 @@
                  <div>
                    <mat-checkbox></mat-checkbox>
                  </div>
-                  <div>{{ withdraw.highRank }}</div>
+
                  <div>
+                    회원
+                    <hr style="margin: 7px 0px" />
                    <div
-                      (click)="viewUserDetail(withdraw.id!)"
+                      (click)="viewUserDetail(withdraw.getMemberId())"
                      style="cursor: pointer"
                    >
-                      {{ withdraw.signinId }}
+                      test {{ idx }}
                    </div>
                    <hr style="margin: 7px 0px" />
-                    {{ withdraw.nickname }}
+                    test {{ idx }}
                  </div>
+                  <!--환전신청금액-->
+                  <div>{{ withdraw.getAccountNumber() }}</div>
+                  <!--정산종류-->
+                  <div>{{ idx % 2 === 0 ? "롤링" : "콤프" }}</div>
+
                  <div>
-                    {{ withdraw.rank }}
+                    <!-- 은행명, 계좌번호, 예금주-->
+                    {{ withdraw.getBankName() }}
                    <hr style="margin: 7px 0px" />
-                    LV{{ withdraw.level }}
+                    LV{{ withdraw.getAccountNumber() }}
                    <hr style="margin: 7px 0px" />
-                    {{ withdraw.state }}
+                    {{ withdraw.getName() }}
                  </div>
-                  <div class="hidden sm:block">
-                    {{ withdraw.accountHolder }}
-                  </div>
-                  <div>{{ withdraw.calculateType }}</div>
-                  <div>{{ withdraw.note }}</div>
-                  <div>{{ withdraw.exchangeApplicationAmount }}</div>
+                  <!-- 비고 -->
+                  <div [matTooltip]="__getMemoTooltop(withdraw)">@</div>
+
+                  <!-- 등록날짜/처리날짜-->
                  <div class="hidden md:block">
-                    {{ withdraw.registrationDate }}
+                    {{ withdraw.getCreatedAt() | date: "yyyy-MM-dd HH:mm" }}
                    <hr style="margin: 7px 0px" />
-                    {{ withdraw.processDate }}
+                    {{
+                      withdraw.getStateChangedAt() | date: "yyyy-MM-dd HH:mm"
+                    }}
                  </div>
+                  <!-- 입금/출금/보유금-->
                  <div class="hidden md:block">
-                    입금{{ withdraw.deposit }}
+                    <span>41,200,000원</span>
+
                    <hr style="margin: 7px 0px" />
-                    출금{{ withdraw.withdraw }}
+                    <span>19,000,000원</span>
+
                    <hr style="margin: 7px 0px" />
-                    계{{ withdraw.totalMoney }}
+                    <span>22,200,000원</span>
                  </div>
                  <div class="hidden lg:block">
+                    <button
+                      mat-flat-button
+                      class="bet-mat-small-8"
+                      [color]="'primary'"
+                    >
+                      [매장]kgon5
+                    </button>
+                    <hr style="margin: 7px 0px" />
                    <button
                      mat-flat-button
                      class="bet-mat-small-8"
@ -202,25 +241,18 @@
                    >
                      회원정보
                    </button>
-                  </div>
-                  <div class="hidden lg:block">
+                    <hr style="margin: 7px 0px" />
                    <button
                      mat-flat-button
                      class="bet-mat-small-8"
                      [color]="'primary'"
                    >
-                      배팅정보
-                    </button>
-                  </div>
-                  <div class="hidden lg:block">
-                    <button
-                      mat-flat-button
-                      class="bet-mat-small-8"
-                      [color]="'primary'"
-                    >
-                      취소
+                      배팅리스트
                    </button>
                  </div>
+
+                  <div class="hidden lg:block">완료</div>
+                  <div class="hidden lg:block">삭제</div>
                </div>
              </ng-container>
            </ng-container>
@ -246,20 +278,5 @@
        </div>
      </ng-template>
    </div>
-    <div>
-      <button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
-        환전처리
-      </button>
-    </div>
-    <div>
-      <button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
-        대기처리
-      </button>
-    </div>
-    <div>
-      <button mat-flat-button class="bet-mat-small-8" [color]="'warn'">
-        환전취소
-      </button>
-    </div>
  </div>
 </div>
--- a/src/app/modules/admin/bank/withdraw/components/list.component.ts
+++ b/src/app/modules/admin/bank/withdraw/components/list.component.ts
@ -22,6 +22,7 @@ import {
  map,
  merge,
  Observable,
+  of,
  Subject,
  switchMap,
  takeUntil,
@ -32,7 +33,9 @@ import { FuseConfirmationService } from '@fuse/services/confirmation';
 import { Withdraw } from '../models/withdraw';
 import { WithdrawPagination } from '../models/withdraw-pagination';
 import { WithdrawService } from '../services/withdraw.service';
-import { Router } from '@angular/router';
+import { ActivatedRoute, Router } from '@angular/router';
+import { ListMemberBankWithdrawsResponse } from 'app/modules/proto/c2se/member_bank_withdraw_pb';
+import { MemberBankWithdraw } from 'app/modules/proto/models/member_bank_withdraw_pb';

@Component({
  selector: 'withdraw-list',
@ -52,9 +55,13 @@ import { Router } from '@angular/router';
        }

        @screen lg {
-          grid-template-columns: 60px 60px auto 112px 96px 96px 72px;
+          grid-template-columns: 40px 140px auto 80px 140px 40px 120px 120px 120px 40px 40px;
        }
      }
+
+      .mat-tooltip {
+        white-space: pre-line;
+      }
    `,
  ],
  encapsulation: ViewEncapsulation.None,
@ -65,7 +72,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
  @ViewChild(MatPaginator) private _paginator!: MatPaginator;
  @ViewChild(MatSort) private _sort!: MatSort;

-  withdraws$!: Observable<Withdraw[] | undefined>;
+  bankWithdraw$!: Observable<MemberBankWithdraw[] | undefined>;

  __isSearchOpened = false;
  isLoading = false;
@ -79,6 +86,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
   * Constructor
   */
  constructor(
+    private _activatedRoute: ActivatedRoute,
    private _changeDetectorRef: ChangeDetectorRef,
    private _fuseConfirmationService: FuseConfirmationService,
    private _formBuilder: FormBuilder,
@ -106,7 +114,22 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
      });

    // Get the products
-    this.withdraws$ = this._withdrawService.withdraws$;
+
+    this._activatedRoute.data.subscribe((data) => {
+      let listBankWithdrawResult: ListMemberBankWithdrawsResponse.Result =
+        data['bankWithdraw'];
+      this.bankWithdraw$ = of(
+        listBankWithdrawResult.getMemberBankWithdrawsList()
+      );
+
+      console.log(
+        'bankWithdraw: ',
+        listBankWithdrawResult.getMemberBankWithdrawsList()
+      );
+
+      // Mark for check
+      this._changeDetectorRef.markForCheck();
+    });
  }

  /**
@ -202,4 +225,13 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
  __trackByFn(index: number, item: any): any {
    return item.id || index;
  }
+
+  __getMemoTooltop(withdraw: MemberBankWithdraw): string {
+    if (!withdraw.getMemo() || withdraw.getMemo() === '') {
+      return '메모없음';
+    }
+
+    const resultMemoTooltip = withdraw.getMemo();
+    return resultMemoTooltip;
+  }
 }
--- a/src/app/modules/admin/bank/withdraw/resolvers/withdraw.resolver.ts
+++ b/src/app/modules/admin/bank/withdraw/resolvers/withdraw.resolver.ts
@ -5,6 +5,8 @@ import {
  Router,
  RouterStateSnapshot,
 } from '@angular/router';
+import { MemberBankWithdrawService } from 'app/modules/polyglot/member_bank_withdraw/services/member_bank_withdraw.service';
+import { ListMemberBankWithdrawsResponse } from 'app/modules/proto/c2se/member_bank_withdraw_pb';
 import { catchError, Observable, throwError } from 'rxjs';

 import { Withdraw } from '../models/withdraw';
@ -85,3 +87,33 @@ export class WithdrawsResolver implements Resolve<any> {
    return this._withdrawService.getWithdraws();
  }
 }
+
+@Injectable({
+  providedIn: 'root',
+})
+export class BankWithdrawResolver implements Resolve<any> {
+  /**
+   * Constructor
+   */
+  constructor(private _bankWithdrawService: MemberBankWithdrawService) {}
+
+  // -----------------------------------------------------------------------------------------------------
+  // @ Public methods
+  // -----------------------------------------------------------------------------------------------------
+
+  /**
+   * Resolver
+   *
+   * @param route
+   * @param state
+   */
+  resolve(
+    route: ActivatedRouteSnapshot,
+    state: RouterStateSnapshot
+  ):
+    | Observable<ListMemberBankWithdrawsResponse.Result>
+    | Promise<ListMemberBankWithdrawsResponse.Result>
+    | ListMemberBankWithdrawsResponse.Result {
+    return this._bankWithdrawService.listMemberBankWithdraws();
+  }
+}
--- a/src/app/modules/admin/bank/withdraw/withdraw.routing.ts
+++ b/src/app/modules/admin/bank/withdraw/withdraw.routing.ts
@ -3,7 +3,10 @@ import { Route } from '@angular/router';
 import { ListComponent } from './components/list.component';
 import { ViewComponent } from '../../member/user/components/view.component';

-import { WithdrawsResolver } from './resolvers/withdraw.resolver';
+import {
+  BankWithdrawResolver,
+  WithdrawsResolver,
+} from './resolvers/withdraw.resolver';
 import { UserResolver } from '../../dashboards/user/user.resolvers';

 export const withdrawRoutes: Route[] = [
@ -11,7 +14,7 @@ export const withdrawRoutes: Route[] = [
    path: '',
    component: ListComponent,
    resolve: {
-      withdraws: WithdrawsResolver,
+      bankWithdraw: BankWithdrawResolver,
    },
  },
  {
--- a/src/app/modules/admin/member/partner/components/list.component.html
+++ b/src/app/modules/admin/member/partner/components/list.component.html
@ -149,12 +149,15 @@
                  <div class="hidden lg:block">
                    {{ partner.getMemberClass()?.getName() }}
                    <hr style="margin: 7px 0px" />
-                    LV{{ partner.getMemberLevel()?.getName() }}
+                    LV
+                    {{ partner.getMemberLevel()?.getName()?.substring(5, 6) }}
                    <hr style="margin: 7px 0px" />
-                    {{ partner.getState() }}
+                    {{ __getStateString(partner) }}
                  </div>
                  <!-- 예금주 -->
-                  <div class="hidden lg:block">예금주</div>
+                  <div class="hidden lg:block">
+                    {{ partner.getBankAccount()?.getName() }}
+                  </div>
                  <!-- 정산종류 -->
                  <div class="hidden lg:block">정산종류</div>
                  <!-- 보유금 -->
--- a/src/app/modules/admin/member/partner/components/list.component.ts
+++ b/src/app/modules/admin/member/partner/components/list.component.ts
@ -367,4 +367,10 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
    `;
    return resultTooltip;
  }
+
+  __getStateString(state: any): string {
+    console.log(state.getState());
+
+    return '정상';
+  }
 }
--- a/src/app/modules/admin/member/user/components/list.component.html
+++ b/src/app/modules/admin/member/user/components/list.component.html
@ -11,24 +11,21 @@
    </div>
    <!-- Title -->
    <div class="text-4xl font-extrabold tracking-tight">User</div>
+
    <!-- Actions -->
    <div class="flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4">
      <!-- Search -->
-      <div>
      <span>총회원수:<span style="color: red">38</span>명</span>&nbsp;&nbsp;
      <span>진행중금액:<span style="color: red">0</span>원</span>&nbsp;&nbsp;
      <span>총 보유머니:<span style="color: red">21,437,873</span>원</span
      >&nbsp;&nbsp;
-        <span>총 콤프:<span style="color: red">394,860</span>원</span
-        >&nbsp;&nbsp;
+      <span>총 콤프:<span style="color: red">394,860</span>원</span>&nbsp;&nbsp;
      <span>총 합계:<span style="color: blue">21,832,733</span>원</span>
-      </div>
      <button mat-icon-button (click)="__onClickSearch()">
        <mat-icon [svgIcon]="'heroicons_outline:search'"></mat-icon>
      </button>
    </div>
  </div>
-
  <!-- Memo -->
  <div
    class="relative flex flex-col sm:flex-row flex-0 sm:items-center sm:justify-between py-4 px-6 md:px-8 border-b"
@ -161,13 +158,13 @@
              matSortDisableClear
              class="user-grid z-10 sticky top-0 grid gap-4 py-4 px-6 md:px-8 shadow text-md font-semibold text-secondary bg-gray-50 dark:bg-black dark:bg-opacity-5"
            >
-              <div>
+              <div style="text-align: center">
                <mat-checkbox></mat-checkbox>
              </div>
-              <div>관리</div>
-              <div>요율</div>
-              <div>상부</div>
-              <div>
+              <div style="text-align: center">관리</div>
+              <div style="text-align: center">요율</div>
+              <div style="text-align: center">상부</div>
+              <div style="text-align: center">
                <div>아이디</div>

                <hr style="margin: 7px 0px" />
@ -175,23 +172,31 @@
                <hr style="margin: 7px 0px" />
                연락처
              </div>
-              <div>
+              <div style="text-align: center">
                등급
                <hr style="margin: 7px 0px" />
                레벨
                <hr style="margin: 7px 0px" />
                상태
              </div>
-              <div class="hidden sm:block">예금주</div>
-              <div class="hidden md:block">보유금</div>
-              <div class="hidden md:block">
+              <div class="hidden sm:block" style="text-align: center">
+                예금주
+              </div>
+              <div class="hidden md:block" style="text-align: center">
+                보유금
+              </div>
+              <div class="hidden md:block" style="text-align: center">
                게임중머니
                <hr style="margin: 7px 0px" />
                금일콤프
              </div>
-              <div class="hidden md:block">총입출</div>
-              <div class="hidden lg:block">카지노->캐쉬</div>
-              <div class="hidden lg:block">로그</div>
+              <div class="hidden md:block" style="text-align: center">
+                총입출
+              </div>
+              <div class="hidden lg:block" style="text-align: center">
+                카지노->캐쉬
+              </div>
+              <div class="hidden lg:block" style="text-align: center">로그</div>
            </div>
            <!-- Rows -->
            <ng-container *ngIf="users$ | async as users">
@ -201,10 +206,10 @@
                <div
                  class="user-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
                >
-                  <div>
+                  <div style="text-align: center">
                    <mat-checkbox></mat-checkbox>
                  </div>
-                  <div class="hidden lg:block">
+                  <div class="hidden lg:block" style="text-align: center">
                    <div
                      mat-button
                      [matMenuTriggerFor]="menu"
@ -243,7 +248,7 @@
                  <div>
                    {{ user.highRank }}
                  </div>
-                  <div>
+                  <div style="text-align: center">
                    <div
                      (click)="viewUserDetail(user.id!)"
                      style="cursor: pointer"
@ -255,36 +260,36 @@
                    <hr style="margin: 7px 0px" />
                    {{ user.phoneNumber }}
                  </div>
-                  <div>
+                  <div style="text-align: center">
                    {{ user.rank }}
                    <hr style="margin: 7px 0px" />
-                    LV{{ user.level }}
+                    {{ user.level }}
                    <hr style="margin: 7px 0px" />
                    {{ user.state }}
                  </div>
-                  <div class="hidden sm:block">
+                  <div class="hidden sm:block" style="text-align: center">
                    {{ user.accountHolder }}
                  </div>
-                  <div class="hidden md:block">
+                  <div class="hidden md:block" style="text-align: center">
                    캐쉬{{ user.ownCash }}
                    <hr style="margin: 7px 0px" />
                    콤프{{ user.ownComp }}P
                    <hr style="margin: 7px 0px" />
                    쿠폰{{ user.ownCoupon }}
                  </div>
-                  <div class="hidden md:block">
+                  <div class="hidden md:block" style="text-align: center">
                    {{ user.gameMoney }}
                    <hr style="margin: 7px 0px" />
                    {{ user.todayComp }}P
                  </div>
-                  <div class="hidden md:block">
+                  <div class="hidden md:block" style="text-align: center">
                    입금{{ user.totalDeposit }}
                    <hr style="margin: 7px 0px" />
                    출금{{ user.totalWithdraw }}
                    <hr style="margin: 7px 0px" />
                    차익{{ user.balance }}
                  </div>
-                  <div class="hidden lg:block">
+                  <div class="hidden lg:block" style="text-align: center">
                    <button
                      mat-flat-button
                      class="bet-mat-small-8"
@ -301,7 +306,7 @@
                      게임머니회수
                    </button>
                  </div>
-                  <div class="hidden lg:block">
+                  <div class="hidden lg:block" style="text-align: center">
                    가입{{ user.registrationDate }}
                    <hr style="margin: 7px 0px" />
                    최종{{ user.finalSigninDate }}
--- a/src/app/modules/admin/member/user/components/view.component.html
+++ b/src/app/modules/admin/member/user/components/view.component.html
@ -111,9 +111,9 @@
                      <mat-form-field class="w-1/3 pr-2">
                        <mat-label>아이디</mat-label>
                        <input
-                          id="signinId"
+                          id="username"
                          matInput
-                          [formControlName]="'signinId'"
+                          [formControlName]="'username'"
                        />
                      </mat-form-field>
                      <mat-form-field class="w-1/3 pr-2">
@ -155,9 +155,9 @@
                      <mat-form-field class="w-1/3 pr-2">
                        <mat-label>핸드폰</mat-label>
                        <input
-                          id="phoneNumber"
+                          id="mobilePhoneNumber"
                          matInput
-                          [formControlName]="'phoneNumber'"
+                          [formControlName]="'mobilePhoneNumber'"
                        />
                      </mat-form-field>
                    </div>
@ -166,17 +166,22 @@
                    <div class="flex">
                      <mat-form-field class="w-1/3 pr-2">
                        <mat-label>레벨</mat-label>
-                        <mat-select id="level" [formControlName]="'level'">
-                          <!-- <ng-container *ngFor="let category of categories"> -->
-                          <mat-option value="level">
-                            cartegory option
+                        <mat-select
+                          [formControlName]="'levelId'"
+                          placeholder="레벨 선택"
+                        >
+                          <mat-option
+                            *ngFor="let level of memberLevels"
+                            [value]="'level.getId()'"
+                          >
+                            {{ level.getName() }}
                          </mat-option>
-                          <!-- </ng-container> -->
+                          <!-- <mat-option [value]="'0'"> 국민은행 </mat-option> -->
                        </mat-select>
                      </mat-form-field>
                      <mat-form-field class="w-1/3 pr-2">
                        <mat-label>상태</mat-label>
-                        <mat-select id="state" [formControlName]="'status'">
+                        <mat-select id="state" [formControlName]="'state'">
                          <!-- <ng-container *ngFor="let brand of brands"> -->
                          <mat-option value="brand.id">
                            brand option
@ -200,14 +205,28 @@
                    <div class="flex">
                      <mat-form-field class="w-1/3 pr-2">
                        <mat-label>은행명</mat-label>
-                        <mat-select [formControlName]="'bankname'">
-                          <!-- <ng-container *ngFor="let brand of brands"> -->
-                          <mat-option value="brand.id">
-                            brand option
+
+                        <mat-select
+                          [formControlName]="'bankId'"
+                          placeholder="은행 선택"
+                        >
+                          <mat-option
+                            *ngFor="let bank of banks"
+                            [value]="bank.getId()"
+                          >
+                            {{ bank.getName() }}
                          </mat-option>
-                          <!-- </ng-container> -->
+                          <!-- <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
@ -257,14 +276,23 @@
                    <div class="flex">
                      <mat-form-field class="w-2/3 pr-2">
                        <mat-label>사이트변경</mat-label>
-                        <mat-select [formControlName]="'changeSite'">
-                          <!-- <ng-container *ngFor="let vendor of vendors"> -->
-                          <mat-option value="vendor.id">
-                            vendor option
+
+                        <mat-select
+                          [formControlName]="'changeSite'"
+                          placeholder="사이트 선택"
+                        >
+                          <mat-option
+                            *ngFor="let site of sites"
+                            [value]="site.getId()"
+                          >
+                            {{ site.getUrl() }}
                          </mat-option>
-                          <!-- </ng-container> -->
                        </mat-select>
+                        <!-- <mat-error *ngIf="composeForm.get('siteId')?.hasError('required')">
+        사이트명은 필수 입력입니다.
+      </mat-error> -->
                      </mat-form-field>
+
                      <mat-form-field class="w-1/3 pr-2">
                        <mat-label>추천횟수</mat-label>
                        <input
--- a/src/app/modules/admin/member/user/components/view.component.ts
+++ b/src/app/modules/admin/member/user/components/view.component.ts
@ -35,6 +35,12 @@ import { ActivatedRoute } from '@angular/router';
 import { GetMemberResponse } 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';
+import { BankService } from 'app/modules/polyglot/bank/services/bank.service';
+import { MemberLevel } from 'app/modules/proto/models/member_level_pb';
+import { Bank } from 'app/modules/proto/models/bank_pb';
+import { SiteService } from 'app/modules/polyglot/site/services/site.service';
+import { Site } from 'app/modules/proto/models/site_pb';

@Component({
  selector: 'user-view',
@ -73,6 +79,10 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
  /* selectedUser?: User; */
  selectedUser?: MemberModel;

+  memberLevels!: MemberLevel[];
+  banks!: Bank[];
+  sites!: Site[];
+
  private _unsubscribeAll: Subject<any> = new Subject<any>();

  /**
@ -84,7 +94,10 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
    private _fuseConfirmationService: FuseConfirmationService,
    private _formBuilder: FormBuilder,
    private _userService: UserService,
-    private _memberService: MemberService
+    private _memberService: MemberService,
+    private _memberLevelService: MemberLevelService,
+    private _bankService: BankService,
+    private _siteService: SiteService
  ) {}

  // -----------------------------------------------------------------------------------------------------
@ -97,18 +110,18 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
  ngOnInit(): void {
    this.memberViewForm = this._formBuilder.group({
      id: [''],
-      signinId: [{ value: '', disabled: true }],
+      username: [{ value: '', disabled: true }],
      signinPw: [{ value: '' }],
      exchangePw: [''],
      description: [''],
      tags: [[]],
      nickname: [{ value: '', disabled: true }],
      ownCash: [''],
-      phoneNumber: [''],
+      mobilePhoneNumber: [''],
      level: [''],
-      status: [''],
+      state: [''],
      isExcahngeMoney: [''],
-      bankname: [''],
+      bankId: [''],
      accountNumber: [''],
      accountHolder: [''],
      comp: [''],
@ -143,6 +156,18 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {

    /* this.user$ = this._userService.user$; */

+    this._siteService
+      .listSites()
+      .then((result) => (this.sites = result.getSitesList()));
+    this._memberLevelService.listMemberLevels().then((result) => {
+      this.memberLevels = result
+        .getMemberLevelsList()
+        .filter((v) => !!v.getShow());
+    });
+    this._bankService
+      .listBanks()
+      .then((result) => (this.banks = result.getBanksList()));
+
    this._activatedRoute.data.subscribe((data) => {
      let member: GetMemberResponse.Result = data['member'];

@ -150,13 +175,14 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {

      /* console.log('dddd', listMemberResult.getMembersList()); */
      this.memberViewForm.patchValue({
-        signinId: this.selectedUser?.getUsername(),
-        signinPw: '1234',
-        exchangePw: '1234',
-        phoneNumber: this.selectedUser?.getMobilePhoneNumber(),
-        level: this.selectedUser?.getMemberLevel()?.getName(),
-        status: this.selectedUser?.getState(),
+        username: this.selectedUser?.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(),
      });
      // Mark for check
      this._changeDetectorRef.markForCheck();
@ -210,12 +236,12 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
  __modifyMember(): void {
    const valueForm = this.memberViewForm.value;
    console.log('v: ', valueForm);
-    this._memberService.updateMember(
+    /* this._memberService.updateMember(
      this.selectedUser!.getId(),
      this.selectedUser!.getSite()!.getId(),
      this.selectedUser!.getMemberLevel()!.getId(),
      'beteran',
-      valueForm.phoneNumber
-    );
+      valueForm.mobilePhoneNumber
+    ); */
  }
 }
--- a/src/app/modules/admin/member/user/user.module.ts
+++ b/src/app/modules/admin/member/user/user.module.ts
@ -19,6 +19,7 @@ import { MatChipsModule } from '@angular/material/chips';
 import { MatMenuModule } from '@angular/material/menu';
 import { MatDividerModule } from '@angular/material/divider';
 import { MatDialogModule } from '@angular/material/dialog';
+import { MatCardModule } from '@angular/material/card';

 import { FuseCardModule } from '@fuse/components/card';

@ -56,6 +57,7 @@ import { userRoutes } from 'app/modules/admin/member/user/user.routing';
    MatMenuModule,
    MatDividerModule,
    MatDialogModule,
+    MatCardModule,

    FuseCardModule,
  ],