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:
Park Byung Eun 2022-08-28 08:18:22 +00:00
commit 62278134f6
6 changed files with 129 additions and 65 deletions

View File

@ -12,10 +12,6 @@
<!-- Title -->
<div class="text-4xl font-extrabold tracking-tight">
<span>{{ title }}</span>
<span
><button mat-icon-button (click)="__onClickLevel()">
<mat-icon [svgIcon]="'alpha-l-box-outline'"></mat-icon></button
></span>
</div>
<div class="flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4">
<!-- Search -->
@ -65,23 +61,32 @@
</div>
<hr style="margin: 7px 0px" />
<div
*ngIf="__isLevelOpened"
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"
*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 fxLayout="row wrap" class="items-center mt-6 sm:mt-0 sm:ml-0">
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV1
<button mat-button [matMenuTriggerFor]="menuChangeMemberState">
상태 변경
</button>
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV2
<mat-menu #menuChangeMemberState="matMenu">
<button mat-menu-item>정상</button>
<button mat-menu-item>대기</button>
<button mat-menu-item>탈퇴</button>
<button mat-menu-item>휴면</button>
<button mat-menu-item>블랙</button>
<button mat-menu-item>정지</button>
</mat-menu>
<button mat-button [matMenuTriggerFor]="menuChangeMemberLevel">
레벨 변경
</button>
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV3
<mat-menu #menuChangeMemberLevel="matMenu">
<ng-container *ngIf="listMemberLevels$ | async as memberLevels">
<ng-container *ngFor="let ml of memberLevels; let i = index">
<button mat-menu-item (click)="__onClickChangeLevel(ml.getId())">
{{ ml.getName() }}
</button>
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV4
</button>
</div>
</ng-container>
</ng-container>
</mat-menu>
</div>
<div class="flex flex-auto overflow-hidden">
<!-- Products list -->
@ -97,6 +102,11 @@
matSortDisableClear
class="partner-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 style="text-align: center">
<mat-checkbox
(change)="__onChangeChkUsersAll($event)"
></mat-checkbox>
</div>
<div class="hidden lg:block">
관리
<hr style="margin: 7px 0px" />
@ -138,6 +148,13 @@
<div
class="partner-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
>
<div style="text-align: center">
<mat-checkbox
#chkUsers
[value]="partner.getId()"
(change)="__onChangeChkUsers($event)"
></mat-checkbox>
</div>
<div class="hidden lg:block">
<div>
<div

View File

@ -5,7 +5,9 @@ import {
Component,
OnDestroy,
OnInit,
QueryList,
ViewChild,
ViewChildren,
ViewEncapsulation,
} from '@angular/core';
import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
@ -47,13 +49,17 @@ import { MatDialog } from '@angular/material/dialog';
import { SiteService } from 'app/modules/polyglot/site/services/site.service';
import { Site } from 'app/modules/proto/models/site_pb';
import { MemberService } from 'app/modules/polyglot/member/services/member.service';
import { MemberModel } from 'app/modules/proto/models/member_pb';
import { MemberModel, MemberState } from 'app/modules/proto/models/member_pb';
import {
ListMembersRequest,
ListMembersResponse,
} from 'app/modules/proto/c2se/member_pb';
import { MatCheckbox, MatCheckboxChange } from '@angular/material/checkbox';
import { ListMemberLevelsResponse } from 'app/modules/proto/c2se/member_level_pb';
import { MemberLevel } from 'app/modules/proto/models/member_level_pb';
import { Pagination } from 'app/modules/proto/protobuf/pagination_pb';
import { VendorService } from 'app/modules/polyglot/api/services/vendor.service';
@Component({
selector: 'partner-list',
templateUrl: './list.component.html',
@ -92,9 +98,10 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatPaginator) private _paginator!: MatPaginator;
@ViewChild(MatSort) private _sort!: MatSort;
/* partners$!: Observable<Partner[] | undefined>; */
@ViewChildren('chkUsers') chkUsers!: QueryList<MatCheckbox>;
listPartner$!: Observable<MemberModel[] | undefined>;
listMemberLevels$!: Observable<MemberLevel[] | undefined>;
__isLevelOpened = false;
isLoading = false;
@ -103,6 +110,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
pagination?: PartnerPagination;
__members: MemberModel[] = [];
__checkedUsers: string[] = [];
title: string = '';
btnTitle: string = '';
@ -189,7 +197,9 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
let listMemberResult: ListMembersResponse.Result = data['listPartner'];
this.listPartner$ = of(listMemberResult.getMembersList());
/* console.log('dddd', listMemberResult.getMembersList()); */
let listMemberLevelsResult: ListMemberLevelsResponse.Result =
data['listMemberLevels'];
this.listMemberLevels$ = of(listMemberLevelsResult.getMemberLevelsList());
// Mark for check
this._changeDetectorRef.markForCheck();
@ -295,14 +305,6 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
*/
__toggleDetails(productId: string): void {}
/**
* toggle the search
* Used in 'bar'
*/
__onClickLevel(): void {
this.__isLevelOpened = !this.__isLevelOpened;
}
/**
* Track by function for ngFor loops
*
@ -417,4 +419,62 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
this.signoutBlockConfigForm.value
);
}
__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);
}
});
}
__onClickChangeLevel(member_level_id: string): void {
console.log('member_level_id', member_level_id);
}
__getMemberState(member: MemberModel): string {
const state = member.getState();
let resultStr = '';
switch (state) {
case MemberState.NONE:
resultStr = '없음';
break;
case MemberState.NORMAL:
resultStr = '정상';
break;
case MemberState.PENDING:
resultStr = '대기';
break;
case MemberState.WITHDRAWAL:
resultStr = '탈퇴';
break;
case MemberState.DORMANCY:
resultStr = '휴면';
break;
case MemberState.BLACKLIST:
resultStr = '블랙리스트';
break;
case MemberState.SUSPENDED:
resultStr = '정지';
break;
default:
break;
}
return resultStr;
}
}

View File

@ -13,6 +13,7 @@ import { MatSortModule } from '@angular/material/sort';
import { MatSelectModule } from '@angular/material/select';
import { MatTooltipModule } from '@angular/material/tooltip';
import { MatGridListModule } from '@angular/material/grid-list';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatMenuModule } from '@angular/material/menu';
import { MatRadioModule } from '@angular/material/radio';
import { MatDividerModule } from '@angular/material/divider';
@ -49,6 +50,7 @@ import { FuseAlertModule } from '@fuse/components/alert';
MatSelectModule,
MatTooltipModule,
MatGridListModule,
MatCheckboxModule,
MatMenuModule,
MatRadioModule,
MatDividerModule,

View File

@ -11,6 +11,7 @@ import {
PartnerListResolver,
PartnersResolver,
} from './resolvers/partner.resolver';
import { ListMemberLevelsResolver } from '../user/resolvers/member-level.resolver';
export const partnerRoutes: Route[] = [
// {
@ -23,6 +24,7 @@ export const partnerRoutes: Route[] = [
component: ListComponent,
resolve: {
listPartner: PartnerListResolver,
listMemberLevels: ListMemberLevelsResolver,
},
},
{

View File

@ -22,11 +22,6 @@
<mat-icon [svgIcon]="'iconsmind:file_excel'"></mat-icon>
</button>
</span>
<span>
<button mat-icon-button (click)="__onClickLevel()">
<mat-icon [svgIcon]="'alpha-l-box-outline'"></mat-icon>
</button>
</span>
</div>
<!-- Actions -->
@ -193,7 +188,7 @@
<!-- actions -->
<div
*ngIf="__checkedUsers.length > 0"
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 py-4 px-6 md:px-8 border-b"
>
<button mat-button [matMenuTriggerFor]="menuChangeMemberState">
상태 변경
@ -206,25 +201,18 @@
<button mat-menu-item>블랙</button>
<button mat-menu-item>정지</button>
</mat-menu>
</div>
<div
*ngIf="__isLevelOpened"
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"
>
<div fxLayout="row wrap" class="items-center mt-6 sm:mt-0 sm:ml-0">
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV1
<button mat-button [matMenuTriggerFor]="menuChangeMemberLevel">
레벨 변경
</button>
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV2
<mat-menu #menuChangeMemberLevel="matMenu">
<ng-container *ngIf="listMemberLevels$ | async as memberLevels">
<ng-container *ngFor="let ml of memberLevels; let i = index">
<button mat-menu-item (click)="__onClickChangeLevel(ml.getId())">
{{ ml.getName() }}
</button>
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV3
</button>
<button mat-flat-button class="bet-mat-small-8" [color]="'primary'">
LV4
</button>
</div>
</ng-container>
</ng-container>
</mat-menu>
</div>
<!-- Main -->
<div class="flex flex-auto overflow-hidden">

View File

@ -91,7 +91,6 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
listMemberLevels$!: Observable<MemberLevel[] | undefined>;
__isSearchOpened = false;
__isLevelOpened = false;
isLoading = false;
searchInputControl = new FormControl();
selectedUser?: User;
@ -248,14 +247,6 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
this.__isSearchOpened = !this.__isSearchOpened;
}
/**
* toggle the search
* Used in 'bar'
*/
__onClickLevel(): void {
this.__isLevelOpened = !this.__isLevelOpened;
}
/**
* Track by function for ngFor loops
*
@ -388,6 +379,10 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
__onMatSortChangeUsers(sort: Sort): void {}
__onClickChangeLevel(member_level_id: string): void {
console.log('member_level_id', member_level_id);
}
__getMemberState(member: MemberModel): string {
const state = member.getState();
let resultStr = '';