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

This commit is contained in:
병준 박 2022-09-01 10:33:08 +00:00
commit bd76e7f253
6 changed files with 127 additions and 65 deletions

View File

@ -33,24 +33,6 @@
</mat-form-field> </mat-form-field>
<button mat-flat-button [color]="'primary'">메모저장</button> <button mat-flat-button [color]="'primary'">메모저장</button>
</div> </div>
<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 <div
*ngIf="__isSearchOpened" *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" 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"
@ -130,6 +112,26 @@
</button> </button>
</div> </div>
</div> </div>
<div
*ngIf="__checkedUsers.length > 0"
class="relative flex flex-col sm:flex-row flex-0 sm:items-center py-4 px-6 md:px-8 border-b"
>
<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>
<!-- Main --> <!-- Main -->
<div class="flex flex-auto overflow-hidden"> <div class="flex flex-auto overflow-hidden">
<!-- Products list --> <!-- Products list -->
@ -143,10 +145,11 @@
<div <div
class="withdraw-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" class="withdraw-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> <mat-checkbox
(change)="__onChangeChkUsersAll($event)"
></mat-checkbox>
</div> </div>
<div> <div>
구분 구분
<hr style="margin: 7px 0px" /> <hr style="margin: 7px 0px" />
@ -198,10 +201,12 @@
<div <div
class="withdraw-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b" class="withdraw-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> <mat-checkbox
#chkUsers
(change)="__onChangeChkUsers($event)"
></mat-checkbox>
</div> </div>
<div> <div>
회원 회원
<hr style="margin: 7px 0px" /> <hr style="margin: 7px 0px" />

View File

@ -5,7 +5,9 @@ import {
Component, Component,
OnDestroy, OnDestroy,
OnInit, OnInit,
QueryList,
ViewChild, ViewChild,
ViewChildren,
ViewEncapsulation, ViewEncapsulation,
} from '@angular/core'; } from '@angular/core';
import { import {
@ -14,7 +16,7 @@ import {
FormGroup, FormGroup,
Validators, Validators,
} from '@angular/forms'; } from '@angular/forms';
import { MatCheckboxChange } from '@angular/material/checkbox'; import { MatCheckbox, MatCheckboxChange } from '@angular/material/checkbox';
import { MatPaginator } from '@angular/material/paginator'; import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort'; import { MatSort } from '@angular/material/sort';
import { import {
@ -75,7 +77,10 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatPaginator) private _paginator!: MatPaginator; @ViewChild(MatPaginator) private _paginator!: MatPaginator;
@ViewChild(MatSort) private _sort!: MatSort; @ViewChild(MatSort) private _sort!: MatSort;
@ViewChildren('chkUsers') chkUsers!: QueryList<MatCheckbox>;
bankWithdraw$!: Observable<MemberBankWithdrawModel[] | undefined>; bankWithdraw$!: Observable<MemberBankWithdrawModel[] | undefined>;
__checkedUsers: string[] = [];
__isSearchOpened = false; __isSearchOpened = false;
isLoading = false; isLoading = false;
@ -199,6 +204,27 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
// @ Private methods // @ Private methods
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
__onChangeChkUsersAll(event: MatCheckboxChange): void {
let checked = event.checked;
this.chkUsers.forEach((c, i) => {
c.checked = checked;
});
this.__updateCheckedUsers();
}
__onChangeChkUsers(event: MatCheckboxChange): void {
this.__updateCheckedUsers();
}
__updateCheckedUsers(): void {
this.__checkedUsers = [];
this.chkUsers.forEach((c, i) => {
if (c.checked) {
this.__checkedUsers.push(c.value);
}
});
}
/** /**
* Create product * Create product
*/ */

View File

@ -90,7 +90,7 @@
</div> </div>
<div <div
*ngIf="__checkedCustomers" *ngIf="__checkedUsers.length > 0"
class="relative flex flex-col sm:flex-row flex-0 sm:items-center py-4 px-6 md:px-8 border-b" class="relative flex flex-col sm:flex-row flex-0 sm:items-center py-4 px-6 md:px-8 border-b"
> >
<div> <div>
@ -114,7 +114,7 @@
> >
<div style="text-align: center"> <div style="text-align: center">
<mat-checkbox <mat-checkbox
(change)="__onChangeChkCustomersAll($event)" (change)="__onChangeChkUsersAll($event)"
></mat-checkbox> ></mat-checkbox>
</div> </div>
<div>번호</div> <div>번호</div>
@ -156,7 +156,7 @@
<div style="text-align: center"> <div style="text-align: center">
<mat-checkbox <mat-checkbox
#chkUsers #chkUsers
(change)="__onChangeChkCustomers()" (change)="__onChangeChkUsers($event)"
></mat-checkbox> ></mat-checkbox>
</div> </div>
<!-- 일련번호 --> <!-- 일련번호 -->

View File

@ -74,7 +74,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChildren('chkUsers') chkUsers!: QueryList<MatCheckbox>; @ViewChildren('chkUsers') chkUsers!: QueryList<MatCheckbox>;
customers$!: Observable<Customer[] | undefined>; customers$!: Observable<Customer[] | undefined>;
__checkedCustomers: string[] = []; __checkedUsers: string[] = [];
isLoading = false; isLoading = false;
searchInputControl = new FormControl(); searchInputControl = new FormControl();
@ -182,6 +182,27 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
// @ Private methods // @ Private methods
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
__onChangeChkUsersAll(event: MatCheckboxChange): void {
let checked = event.checked;
this.chkUsers.forEach((c, i) => {
c.checked = checked;
});
this.__updateCheckedUsers();
}
__onChangeChkUsers(event: MatCheckboxChange): void {
this.__updateCheckedUsers();
}
__updateCheckedUsers(): void {
this.__checkedUsers = [];
this.chkUsers.forEach((c, i) => {
if (c.checked) {
this.__checkedUsers.push(c.value);
}
});
}
/** /**
* toggle the search * toggle the search
* Used in 'bar' * Used in 'bar'
@ -211,33 +232,4 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
__trackByFn(index: number, item: any): any { __trackByFn(index: number, item: any): any {
return item.id || index; return item.id || index;
} }
onClickCustomers(typeNum: number): void {
if (this.__checkedCustomers.length === 0) {
return;
}
this.__checkedCustomers.map((v) => {});
}
__onChangeChkCustomersAll(event: MatCheckboxChange): void {
let checked = event.checked;
this.chkUsers.forEach((c, i) => {
c.checked = checked;
});
this.__onChangeChkCustomers();
}
__onChangeChkUsers(event: MatCheckboxChange): void {
this.__onChangeChkCustomers();
}
__onChangeChkCustomers(): void {
this.__checkedCustomers = [];
this.chkUsers.forEach((c, i) => {
if (c.checked) {
this.__checkedCustomers.push(c.value);
}
});
}
} }

View File

@ -93,6 +93,16 @@
</div> </div>
</div> </div>
<div
*ngIf="__checkedUsers.length > 0"
class="relative flex flex-col sm:flex-row flex-0 sm:items-center py-4 px-6 md:px-8 border-b"
>
<div>
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
디비에서 완전삭제
</button>
</div>
</div>
<!-- Main --> <!-- Main -->
<div class="flex flex-auto overflow-hidden"> <div class="flex flex-auto overflow-hidden">
<!-- Products list --> <!-- Products list -->
@ -106,10 +116,11 @@
<div <div
class="message-grid z-10 sticky top-0 grid gap-4 py-4 px-6 md:px-8shadow text-md font-semibold text-secondary bg-gray-50 dark:bg-black dark:bg-opacity-5" class="message-grid z-10 sticky top-0 grid gap-4 py-4 px-6 md:px-8shadow text-md font-semibold text-secondary bg-gray-50 dark:bg-black dark:bg-opacity-5"
> >
<div class="hidden lg:block"> <div style="text-align: center">
<mat-checkbox></mat-checkbox> <mat-checkbox
(change)="__onChangeChkUsersAll($event)"
></mat-checkbox>
</div> </div>
<div class="hidden lg:block"> <div class="hidden lg:block">
제목 제목
<hr style="margin: 7px 0px" /> <hr style="margin: 7px 0px" />
@ -141,10 +152,12 @@
<div <div
class="message-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b" class="message-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
> >
<div class="hidden lg:block"> <div style="text-align: center">
<mat-checkbox></mat-checkbox> <mat-checkbox
#chkUsers
(change)="__onChangeChkUsers($event)"
></mat-checkbox>
</div> </div>
<!-- 제목 --> <!-- 제목 -->
<div class="hidden lg:block"> <div class="hidden lg:block">
{{ message.title }} {{ message.title }}

View File

@ -5,7 +5,9 @@ import {
Component, Component,
OnDestroy, OnDestroy,
OnInit, OnInit,
QueryList,
ViewChild, ViewChild,
ViewChildren,
ViewEncapsulation, ViewEncapsulation,
} from '@angular/core'; } from '@angular/core';
import { import {
@ -14,7 +16,7 @@ import {
FormGroup, FormGroup,
Validators, Validators,
} from '@angular/forms'; } from '@angular/forms';
import { MatCheckboxChange } from '@angular/material/checkbox'; import { MatCheckbox, MatCheckboxChange } from '@angular/material/checkbox';
import { MatPaginator } from '@angular/material/paginator'; import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort'; import { MatSort } from '@angular/material/sort';
import { import {
@ -65,7 +67,10 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatPaginator) private _paginator!: MatPaginator; @ViewChild(MatPaginator) private _paginator!: MatPaginator;
@ViewChild(MatSort) private _sort!: MatSort; @ViewChild(MatSort) private _sort!: MatSort;
@ViewChildren('chkUsers') chkUsers!: QueryList<MatCheckbox>;
messages$!: Observable<Message[] | undefined>; messages$!: Observable<Message[] | undefined>;
__checkedUsers: string[] = [];
isLoading = false; isLoading = false;
searchInputControl = new FormControl(); searchInputControl = new FormControl();
@ -173,6 +178,27 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
// @ Private methods // @ Private methods
// ----------------------------------------------------------------------------------------------------- // -----------------------------------------------------------------------------------------------------
__onChangeChkUsersAll(event: MatCheckboxChange): void {
let checked = event.checked;
this.chkUsers.forEach((c, i) => {
c.checked = checked;
});
this.__updateCheckedUsers();
}
__onChangeChkUsers(event: MatCheckboxChange): void {
this.__updateCheckedUsers();
}
__updateCheckedUsers(): void {
this.__checkedUsers = [];
this.chkUsers.forEach((c, i) => {
if (c.checked) {
this.__checkedUsers.push(c.value);
}
});
}
/** /**
* Create product * Create product
*/ */