bet/beteran-backend-app-browser
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

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

Browse Source
This commit is contained in:
이담 정 2022-08-01 10:02:20 +00:00
commit bb3a876fdf
26 changed files with 795 additions and 820 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

18
src/app/mock-api/apps/board/notice-oneline/api.ts
View File

@ -33,29 +33,13 @@ export class BoardNoticeOnelineMockApi {
.reply(({ request }) => {
// Get available queries
const search = request.params.get('search');
const sort = request.params.get('sort') || 'name';
const order = request.params.get('order') || 'asc';
const page = parseInt(request.params.get('page') ?? '1', 10);
const size = parseInt(request.params.get('size') ?? '10', 10);
// Clone the noticeOnelines
let noticeOnelines: any[] | null = cloneDeep(this._noticeOnelines);
// Sort the noticeOnelines
if (sort === 'sku' || sort === 'name' || sort === 'active') {
noticeOnelines.sort((a, b) => {
const fieldA = a[sort].toString().toUpperCase();
const fieldB = b[sort].toString().toUpperCase();
return order === 'asc'
? fieldA.localeCompare(fieldB)
: fieldB.localeCompare(fieldA);
});
} else {
noticeOnelines.sort((a, b) =>
order === 'asc' ? a[sort] - b[sort] : b[sort] - a[sort]
);
}
// If search exists...
if (search) {
// Filter the noticeOnelines

41
src/app/mock-api/apps/board/notice-oneline/data.ts
View File

@ -2,6 +2,7 @@
export const noticeOnelines = [
{
id: '1',
idx: 25,
site: 'All',
title: '-입금문의안내(필독)-',
@ -10,4 +11,44 @@ export const noticeOnelines = [
views: 65,
state: '노출',
},
{
id: '2',
idx: 26,
site: 'All',
title: '-입금문의안내(필독)-',
writer: '관리자',
writeDate: '2021-06-08 00:43',
views: 65,
state: '노출',
},
{
id: '3',
idx: 27,
site: 'All',
title: '-입금문의안내(필독)-',
writer: '관리자',
writeDate: '2021-06-08 00:43',
views: 65,
state: '노출',
},
{
id: '4',
idx: 28,
site: 'All',
title: '-입금문의안내(필독)-',
writer: '관리자',
writeDate: '2021-06-08 00:43',
views: 65,
state: '노출',
},
{
id: '5',
idx: 29,
site: 'All',
title: '-입금문의안내(필독)-',
writer: '관리자',
writeDate: '2021-06-08 00:43',
views: 65,
state: '노출',
},
];

18
src/app/mock-api/apps/board/notice/api.ts
View File

@ -33,29 +33,13 @@ export class BoardNoticeMockApi {
.reply(({ request }) => {
// Get available queries
const search = request.params.get('search');
const sort = request.params.get('sort') || 'name';
const order = request.params.get('order') || 'asc';
const page = parseInt(request.params.get('page') ?? '1', 10);
const size = parseInt(request.params.get('size') ?? '10', 10);
// Clone the notices
let notices: any[] | null = cloneDeep(this._notices);
// Sort the notices
if (sort === 'sku' || sort === 'name' || sort === 'active') {
notices.sort((a, b) => {
const fieldA = a[sort].toString().toUpperCase();
const fieldB = b[sort].toString().toUpperCase();
return order === 'asc'
? fieldA.localeCompare(fieldB)
: fieldB.localeCompare(fieldA);
});
} else {
notices.sort((a, b) =>
order === 'asc' ? a[sort] - b[sort] : b[sort] - a[sort]
);
}
// If search exists...
if (search) {
// Filter the notices

34
src/app/mock-api/apps/board/notice/data.ts
View File

@ -2,6 +2,40 @@
export const notices = [
{
id: '1',
idx: 80,
site: '',
title:
'게임멈춤,튕기는 현상및 계좌문의시 확인및 입금전후 확인사항 대한 공지사항',
writer: '관리자',
writeDate: '2021-10-25 02:25',
views: 136,
state: '노출',
},
{
id: '2',
idx: 80,
site: '',
title:
'게임멈춤,튕기는 현상및 계좌문의시 확인및 입금전후 확인사항 대한 공지사항',
writer: '관리자',
writeDate: '2021-10-25 02:25',
views: 136,
state: '노출',
},
{
id: '3',
idx: 80,
site: 'all',
title:
'게임멈춤,튕기는 현상및 계좌문의시 확인및 입금전후 확인사항 대한 공지사항',
writer: '관리자',
writeDate: '2021-10-25 02:25',
views: 136,
state: '노출',
},
{
id: '4',
idx: 80,
site: '',
title:

3
src/app/modules/admin/board/notice-oneline/components/index.ts
View File

@ -1,3 +1,4 @@
import { ListComponent } from './list.component';
import { ReditComponent } from './redit.component';
export const COMPONENTS = [ListComponent];
export const COMPONENTS = [ListComponent, ReditComponent];

227
src/app/modules/admin/board/notice-oneline/components/list.component.html
View File

@ -10,117 +10,82 @@
<mat-progress-bar [mode]="'indeterminate'"></mat-progress-bar>
</div>
<!-- Title -->
<div class="text-4xl font-extrabold tracking-tight">한줄공지</div>
<div class="text-4xl font-extrabold tracking-tight">쪽지함</div>
<!-- Actions -->
<div class="flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4">
<!-- Memo -->
<!-- <mat-form-field>
<ng-container *ngIf="dailys$ | async as dailys">
<ng-container
*ngFor="let daily of dailys; trackBy: __trackByFn"
>
<div
class="inventory-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
>
<fieldset>
총 파트너수:{{ daily.totalPartnerCount }} 총 보유머니:{{
daily.totalHoldingMoney
}}
총 콤프:{{ daily.totalComp }} 총 합계:{{
daily.total
}}
</fieldset>
</div>
</ng-container>
</ng-container>
</mat-form-field> -->
<!-- SelectBox -->
<!-- <mat-form-field>
<mat-select placeholder="리스트수">
<mat-option value="40">40</mat-option>
<mat-option value="60">60</mat-option>
<mat-option value="80">80</mat-option>
<mat-option value="100">100</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="레벨">
<mat-option value="level1">LV.1</mat-option>
<mat-option value="level2">LV.2</mat-option>
<mat-option value="level3">LV.3</mat-option>
<mat-option value="level4">LV.4</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="상태">
<mat-option value="">정상</mat-option>
<mat-option value="">대기</mat-option>
<mat-option value="">탈퇴</mat-option>
<mat-option value="">휴면</mat-option>
<mat-option value="">블랙</mat-option>
<mat-option value="">정지</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="제한">
<mat-option value="">카지노제한</mat-option>
<mat-option value="">슬롯제한</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="입금">
<mat-option value="">계좌입금</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="내용">
<mat-option value="">카지노콤프</mat-option>
<mat-option value="">슬롯콤프</mat-option>
<mat-option value="">배팅콤프</mat-option>
<mat-option value="">첫충콤프</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="입금">
<mat-option value="">계좌입금</mat-option>
</mat-select>
</mat-form-field> -->
<mat-form-field>
<mat-select placeholder="아이디">
<mat-option value="">아이디</mat-option>
<mat-option value="">닉네임</mat-option>
<mat-option value="">이름</mat-option>
<mat-option value="">사이트</mat-option>
</mat-select>
</mat-form-field>
<div class="flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4">
<!-- Search -->
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded min-w-64"
>
<mat-icon
class="icon-size-5"
matPrefix
[svgIcon]="'heroicons_solid:search'"
></mat-icon>
<input
matInput
[formControl]="searchInputControl"
[autocomplete]="'off'"
[placeholder]="'Search'"
/>
</mat-form-field>
<!-- Add user button -->
<button mat-icon-button (click)="__onClickSearch()">
<mat-icon [svgIcon]="'heroicons_outline:search'"></mat-icon>
</button>
<button
class="ml-4"
mat-flat-button
[color]="'primary'"
(click)="__onClickReditBtn($event, '0')"
>
<mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon>
<span class="ml-2 mr-1">등록</span>
</button>
</div>
</div>
<!-- Search --><!-- Search -->
<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"
>
<!-- Actions -->
<div fxLayout="row wrap" class="items-center mt-6 sm:mt-0 sm:ml-0">
<!-- Search -->
<!-- Add user button -->
<button
mat-flat-button
[color]="'primary'"
fxFlex
(click)="__createProduct()"
>
<!-- <mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon> -->
<span class="ml-2 mr-1">검색하기</span>
<mat-icon [svgIcon]="'heroicons_outline:search'"></mat-icon>
<span class="ml-2 mr-1">Search</span>
</button>
</div>
<!-- Card inception -->
<div class="col-span-2 sm:col-span-1">
<mat-form-field
class="fuse-mat-no-subscript w-full"
[floatLabel]="'always'"
>
<input
matInput
[matDatepicker]="picker1"
[placeholder]="'Choose a date'"
/>
<mat-datepicker-toggle
matSuffix
[for]="picker1"
></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
</div>
<!-- Card expiration -->
<div class="col-span-2 sm:col-span-1">
<mat-form-field
class="fuse-mat-no-subscript w-full"
[floatLabel]="'always'"
>
<input
matInput
[matDatepicker]="picker2"
[placeholder]="'Choose a date'"
/>
<mat-datepicker-toggle
matSuffix
[for]="picker2"
></mat-datepicker-toggle>
<mat-datepicker #picker2></mat-datepicker>
</mat-form-field>
</div>
</div>
<!-- Main -->
@ -130,21 +95,25 @@
class="flex flex-col flex-auto sm:mb-18 overflow-hidden sm:overflow-y-auto"
>
<ng-container *ngIf="noticeOnelines$ | async as noticeOnelines">
<ng-container *ngIf="noticeOnelines.length > 0; else noNoticeOneline">
<ng-container *ngIf="noticeOnelines.length > 0; else noUser">
<div class="grid">
<!-- Header -->
<div
class="inventory-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"
matSort
matSortDisableClear
class="inventory-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 sm:block">번호</div>
<div class="hidden sm:block">사이트</div>
<div class="hidden sm:block">제목</div>
<div class="hidden sm:block">작성자</div>
<div class="hidden sm:block">작성일</div>
<div class="hidden sm:block">조회</div>
<div class="hidden sm:block">상태</div>
<div class="hidden lg:block">번호</div>
<div class="hidden lg:block">사이트</div>
<div class="hidden lg:block">제목</div>
<div class="hidden lg:block">
작성자
<hr style="margin: 7px 0px" />
작성일
</div>
<div class="hidden lg:block">
조회
<hr style="margin: 7px 0px" />
상태
</div>
</div>
<!-- Rows -->
<ng-container *ngIf="noticeOnelines$ | async as noticeOnelines">
@ -158,37 +127,39 @@
class="inventory-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
>
<!-- 번호 -->
<div class="hidden sm:block truncate">
<div class="hidden lg:block">
{{ noticeOneline.idx }}
</div>
<!-- 사이트 -->
<div class="hidden sm:block truncate">
<div class="hidden lg:block">
{{ noticeOneline.site }}
</div>
<!-- 제목 -->
<div class="hidden sm:block truncate">
<div
class="hidden lg:block"
style="cursor: pointer"
(click)="__onClickReditBtn($event, noticeOneline.id)"
>
{{ noticeOneline.title }}
</div>
<!-- 작성자 -->
<div class="hidden sm:block truncate">
<!-- 작성자 || 작성일 -->
<div class="hidden lg:block">
{{ noticeOneline.writer }}
</div>
<!-- 작성일 -->
<div class="hidden sm:block truncate">
<hr style="margin: 7px 0px" />
{{ noticeOneline.writeDate }}
</div>
<!-- 조회 -->
<div class="hidden sm:block truncate">
<!-- 조회 || 상태 -->
<div class="hidden lg:block">
{{ noticeOneline.views }}
</div>
<!-- 상태 -->
<div class="hidden sm:block truncate">
<hr style="margin: 7px 0px" />
{{ noticeOneline.state }}
</div>
<!-- management -->
</div>
</ng-container>
<!-- 등록 -->
<button mat-flat-button [color]="'primary'">등록</button>
</ng-container>
</div>
@ -204,11 +175,11 @@
</ng-container>
</ng-container>
<ng-template #noNoticeOneline>
<ng-template #noUser>
<div
class="p-8 sm:p-16 border-t text-4xl font-semibold tracking-tight text-center"
>
There are no noticeOnelines!
There are no data!
</div>
</ng-template>
</div>

99
src/app/modules/admin/board/notice-oneline/components/list.component.ts
View File

@ -8,28 +8,13 @@ import {
ViewChild,
ViewEncapsulation,
} from '@angular/core';
import {
FormBuilder,
FormControl,
FormGroup,
Validators,
} from '@angular/forms';
import { MatCheckboxChange } from '@angular/material/checkbox';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import {
debounceTime,
map,
merge,
Observable,
Subject,
switchMap,
takeUntil,
} from 'rxjs';
import { fuseAnimations } from '@fuse/animations';
import { FuseConfirmationService } from '@fuse/services/confirmation';
import { FormBuilder, FormControl } from '@angular/forms';
import { MatPaginator } from '@angular/material/paginator';
import { Observable, Subject, takeUntil } from 'rxjs';
import { fuseAnimations } from '@fuse/animations';
import { User } from '../../../member/user/models/user';
import { NoticeOneline } from '../models/notice-oneline';
import { NoticeOnelinePagination } from '../models/notice-oneline-pagination';
import { NoticeOnelineService } from '../services/notice-oneline.service';
@ -42,18 +27,18 @@ import { Router } from '@angular/router';
/* language=SCSS */
`
.inventory-grid {
grid-template-columns: 60px auto 40px;
grid-template-columns: 40px 40px auto 200px 200px;
@screen sm {
grid-template-columns: 60px 60px 60px 60px 60px 60px auto 60px;
grid-template-columns: 40px 40px auto 200px 200px;
}
@screen md {
grid-template-columns: 60px 60px 60px 60px 60px 60px auto 60px 60px;
grid-template-columns: 40px 40px auto 300px 200px;
}
@screen lg {
grid-template-columns: 60px 70px 70px 70px 70px 100px 60px 60px auto 60px 60px 60px 60px;
grid-template-columns: 40px 40px auto 300px 200px;
}
}
`,
@ -64,16 +49,16 @@ import { Router } from '@angular/router';
})
export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatPaginator) private _paginator!: MatPaginator;
@ViewChild(MatSort) private _sort!: MatSort;
noticeOnelines$!: Observable<NoticeOneline[] | undefined>;
users$!: Observable<User[] | undefined>;
isLoading = false;
searchInputControl = new FormControl();
selectedNoticeOneline?: NoticeOneline;
pagination?: NoticeOnelinePagination;
__isSearchOpened = false;
private _unsubscribeAll: Subject<any> = new Subject<any>();
/**
@ -81,8 +66,6 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
*/
constructor(
private _changeDetectorRef: ChangeDetectorRef,
private _fuseConfirmationService: FuseConfirmationService,
private _formBuilder: FormBuilder,
private _noticeOnelineService: NoticeOnelineService,
private router: Router
) {}
@ -113,45 +96,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
/**
* After view init
*/
ngAfterViewInit(): void {
if (this._sort && this._paginator) {
// Set the initial sort
this._sort.sort({
id: 'name',
start: 'asc',
disableClear: true,
});
// Mark for check
this._changeDetectorRef.markForCheck();
// If the noticeOneline changes the sort order...
this._sort.sortChange
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
// Reset back to the first page
this._paginator.pageIndex = 0;
});
// Get products if sort or page changes
merge(this._sort.sortChange, this._paginator.page)
.pipe(
switchMap(() => {
this.isLoading = true;
return this._noticeOnelineService.getNoticeOnelines(
this._paginator.pageIndex,
this._paginator.pageSize,
this._sort.active,
this._sort.direction
);
}),
map(() => {
this.isLoading = false;
})
)
.subscribe();
}
}
ngAfterViewInit(): void {}
/**
* On destroy
@ -166,14 +111,24 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
// @ Public methods
// -----------------------------------------------------------------------------------------------------
viewUserDetail(id: string): void {
let url: string = 'member/user/' + id;
this.router.navigateByUrl(url);
}
// -----------------------------------------------------------------------------------------------------
// @ Private methods
// -----------------------------------------------------------------------------------------------------
/**
* toggle the search
* Used in 'bar'
*/
__onClickTItle(noticeOneline: NoticeOneline): void {}
__onClickSearch(): void {
this.__isSearchOpened = !this.__isSearchOpened;
}
__onClickReditBtn(event: MouseEvent, id: string): void {
const param = id === '0' ? '' : id;
let url: string = 'board/notice-oneline/redit/' + param;
this.router.navigateByUrl(url);
}
/**
* Create product
*/

137
src/app/modules/admin/board/notice-oneline/components/redit.component.html Normal file
View File

@ -0,0 +1,137 @@
<div class="flex flex-col flex-auto min-w-0">
<div class="flex-auto border-t -mt-px pt-4 sm:pt-6">
<div class="w-full max-w-screen-xl mx-auto">
<div class="grid grid-cols-1 sm:grid-cols-6 gap-6 w-full min-w-0">
<!-- Budget distribution -->
<div
class="sm:col-span-6 flex flex-col flex-auto p-6 bg-card shadow rounded-2xl overflow-hidden"
>
<div class="text-lg font-medium tracking-tight leading-6 truncate">
한줄공지 {{ !noticeOneline ? "등록" : "수정" }}
</div>
<div class="flex flex-col flex-auto mt-2 overflow-x-auto">
<form
[formGroup]="noticeOnelineForm"
autocomplete="off"
class="flex flex-col flex-auto p-6 sm:p-8 overflow-y-auto"
>
<!-- 공지적용 -->
<div>
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>공지적용</mat-label>
<mat-select>
<ng-container *ngFor="let type of noticeType">
<mat-option [value]="type.key">
{{ type.value }}
</mat-option>
</ng-container>
</mat-select>
</mat-form-field>
</div>
<!-- 사이트선택 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>사이트선택</mat-label>
<mat-select>
<ng-container *ngFor="let type of siteType">
<mat-option [value]="type.key">
{{ type.value }}
</mat-option>
</ng-container>
</mat-select>
</mat-form-field>
</div>
<!-- 글쓴이 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>글쓴이(아이디)</mat-label>
<input
matInput
readonly="true"
[formControlName]="'writer'"
/>
</mat-form-field>
</div>
<!-- 제목 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>제목</mat-label>
<input matInput readonly="true" [formControlName]="'title'" />
</mat-form-field>
</div>
<!-- 등록시간 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>등록시간</mat-label>
<input matInput [formControlName]="'writerDate'" />
</mat-form-field>
<span
>예) 2001-01-01 23시22분(2001년 1월1일 오후 11시21분)-
<p style="color: red">미등록시 현재일로 등록</p></span
>
</div>
<!-- 조회수 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>조회수</mat-label>
<input matInput readonly="true" [formControlName]="'views'" />
</mat-form-field>
</div>
<!-- Body -->
<!-- <quill-editor class="mt-2"></quill-editor> -->
<mat-form-field
class="mt-8 fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<textarea
matInput
[required]="true"
[rows]="5"
matTextareaAutosize
[formControlName]="'content'"
></textarea>
<mat-label>내용</mat-label>
</mat-form-field>
</form>
</div>
<!-- Actions -->
<div
class="flex flex-col sm:flex-row sm:items-center justify-between mt-4 sm:mt-6"
>
<div class="flex items-center mt-4 sm:mt-0">
<!-- Save as draft -->
<button
class="sm:mx-3"
mat-stroked-button
(click)="__onClickeCancel()"
>
<span>취소</span>
</button>
<!-- Send -->
<button
class="order-first sm:order-last"
mat-flat-button
[color]="'primary'"
(click)="__onClickReditBtn(noticeOneline)"
>
{{ !noticeOneline ? "등록" : "수정" }}
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

149
src/app/modules/admin/board/notice-oneline/components/registration.component.ts → src/app/modules/admin/board/notice-oneline/components/redit.component.ts
View File

@ -8,33 +8,20 @@ import {
ViewChild,
ViewEncapsulation,
} from '@angular/core';
import {
FormBuilder,
FormControl,
FormGroup,
Validators,
} from '@angular/forms';
import { MatCheckboxChange } from '@angular/material/checkbox';
import { ActivatedRoute, Router } from '@angular/router';
import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import {
debounceTime,
map,
merge,
Observable,
Subject,
switchMap,
takeUntil,
} from 'rxjs';
import { Subject, takeUntil } from 'rxjs';
import { fuseAnimations } from '@fuse/animations';
import { FuseConfirmationService } from '@fuse/services/confirmation';
import { User } from 'app/modules/admin/member/user/models/user';
import { UserService } from 'app/modules/admin/member/user/services/user.service';
import { NoticeOnelineService } from '../services/notice-oneline.service';
import { NoticeOneline } from '../models/notice-oneline';
@Component({
selector: 'notice-oneline-registration',
templateUrl: './registration.component.html',
selector: 'notice-oneline-redit',
templateUrl: './redit.component.html',
styles: [
/* language=SCSS */
`
@ -59,14 +46,20 @@ import { UserService } from 'app/modules/admin/member/user/services/user.service
changeDetection: ChangeDetectionStrategy.OnPush,
animations: fuseAnimations,
})
export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
export class ReditComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatPaginator) private _paginator!: MatPaginator;
@ViewChild(MatSort) private _sort!: MatSort;
isLoading = false;
searchInputControl = new FormControl();
selectedProductForm!: FormGroup;
selectedUser?: User;
noticeOnelineForm!: FormGroup;
editMode: boolean = false;
noticeType = NOTICE_ONELINE_TYPE;
siteType = SITE_NOTICE_ONELINE_TYPE;
useOrNotType = USE_OR_NOT_NOTICE_ONELINE_TYPE;
noticeOneline!: NoticeOneline;
private _unsubscribeAll: Subject<any> = new Subject<any>();
@ -77,7 +70,9 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
private _changeDetectorRef: ChangeDetectorRef,
private _fuseConfirmationService: FuseConfirmationService,
private _formBuilder: FormBuilder,
private _userService: UserService
private _route: ActivatedRoute,
private _router: Router,
private _noticeOnelineService: NoticeOnelineService
) {}
// -----------------------------------------------------------------------------------------------------
@ -88,53 +83,32 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
* On init
*/
ngOnInit(): void {
this.selectedProductForm = this._formBuilder.group({
id: [''],
signinId: [{ value: '', disabled: true }],
signinPw: [{ value: '' }],
exchangePw: [''],
description: [''],
tags: [[]],
nickname: [{ value: '', disabled: true }],
ownCash: [''],
phoneNumber: [''],
level: [''],
status: [''],
isExcahngeMoney: [''],
bankname: [''],
accountNumber: [''],
accountHolder: [''],
comp: [''],
coupon: [''],
recommender: [{ value: '', disabled: true }],
changeSite: [''],
recommendCount: [''],
hodingGameMoney: [{ value: '0', disabled: true }],
memo: [''],
bacaraRate: [],
rulletRate: [],
dragonRate: [],
etcRate: [],
slotRate: [],
casinoRusingRate: [],
slotRusingRate: [],
// Create the contact form
this.noticeOnelineForm = this._formBuilder.group({
writer: ['관리자'],
noticeType: [''],
useOrNot: [''],
widthSize: [''],
site: [''],
title: [''],
writerDate: [''],
views: ['0'],
content: [''],
});
// Get the User
this._userService.user$
this._noticeOnelineService.noticeOneline$
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((user: User | undefined) => {
if (!user) {
.subscribe((noticeOneline: NoticeOneline | undefined) => {
if (!noticeOneline) {
return;
}
this.selectedUser = user;
this.selectedProductForm.patchValue(user);
this.noticeOneline = noticeOneline;
this.noticeOnelineForm.patchValue(noticeOneline);
// Mark for check
this._changeDetectorRef.markForCheck();
});
/* this.user$ = this._userService.user$; */
}
/**
@ -159,6 +133,14 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
// @ Private methods
// -----------------------------------------------------------------------------------------------------
__onClickeCancel(): void {
/* let url: string = 'board/customer-template/';
this._router.navigateByUrl(url); */
}
__onClickReditBtn(noticeOneline: NoticeOneline): void {
console.log('click: ', noticeOneline);
}
/**
* Create product
*/
@ -171,6 +153,22 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
*/
__toggleDetails(productId: string): void {}
/**
* Toggle edit mode
*
* @param editMode
*/
toggleEditMode(editMode: boolean | null = null): void {
if (editMode === null) {
this.editMode = !this.editMode;
} else {
this.editMode = editMode;
}
// Mark for check
this._changeDetectorRef.markForCheck();
}
/**
* Track by function for ngFor loops
*
@ -181,3 +179,28 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
return item.id || index;
}
}
export const NOTICE_ONELINE_TYPE = [
{
key: '0',
value: '흐르는공지',
},
];
export const SITE_NOTICE_ONELINE_TYPE = [
{
key: '0',
value: '--전체--',
},
];
export const USE_OR_NOT_NOTICE_ONELINE_TYPE = [
{
key: '0',
value: '사용(노출)',
},
{
key: '1',
value: '미사용',
},
];

2
src/app/modules/admin/board/notice-oneline/components/registration.component.html
View File

@ -1,2 +0,0 @@
<!-- Title -->
<div class="text-4xl font-extrabold tracking-tight">한줄공지 등록</div>

2
src/app/modules/admin/board/notice-oneline/components/view.component.html
View File

@ -1,2 +0,0 @@
<!-- Title -->
<div class="text-4xl font-extrabold tracking-tight">한줄공지-상세page</div>

183
src/app/modules/admin/board/notice-oneline/components/view.component.ts
View File

@ -1,183 +0,0 @@
import {
AfterViewInit,
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
OnDestroy,
OnInit,
ViewChild,
ViewEncapsulation,
} from '@angular/core';
import {
FormBuilder,
FormControl,
FormGroup,
Validators,
} from '@angular/forms';
import { MatCheckboxChange } from '@angular/material/checkbox';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import {
debounceTime,
map,
merge,
Observable,
Subject,
switchMap,
takeUntil,
} from 'rxjs';
import { fuseAnimations } from '@fuse/animations';
import { FuseConfirmationService } from '@fuse/services/confirmation';
import { User } from 'app/modules/admin/member/user/models/user';
import { UserService } from 'app/modules/admin/member/user/services/user.service';
@Component({
selector: 'notice-oneline-view',
templateUrl: './view.component.html',
styles: [
/* language=SCSS */
`
.inventory-grid {
grid-template-columns: 48px auto 40px;
@screen sm {
grid-template-columns: 48px auto 112px 72px;
}
@screen md {
grid-template-columns: 48px 112px auto 112px 72px;
}
@screen lg {
grid-template-columns: 48px 112px auto 112px 96px 96px 72px;
}
}
`,
],
encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush,
animations: fuseAnimations,
})
export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatPaginator) private _paginator!: MatPaginator;
@ViewChild(MatSort) private _sort!: MatSort;
isLoading = false;
searchInputControl = new FormControl();
selectedProductForm!: FormGroup;
selectedUser?: User;
private _unsubscribeAll: Subject<any> = new Subject<any>();
/**
* Constructor
*/
constructor(
private _changeDetectorRef: ChangeDetectorRef,
private _fuseConfirmationService: FuseConfirmationService,
private _formBuilder: FormBuilder,
private _userService: UserService
) {}
// -----------------------------------------------------------------------------------------------------
// @ Lifecycle hooks
// -----------------------------------------------------------------------------------------------------
/**
* On init
*/
ngOnInit(): void {
this.selectedProductForm = this._formBuilder.group({
id: [''],
signinId: [{ value: '', disabled: true }],
signinPw: [{ value: '' }],
exchangePw: [''],
description: [''],
tags: [[]],
nickname: [{ value: '', disabled: true }],
ownCash: [''],
phoneNumber: [''],
level: [''],
status: [''],
isExcahngeMoney: [''],
bankname: [''],
accountNumber: [''],
accountHolder: [''],
comp: [''],
coupon: [''],
recommender: [{ value: '', disabled: true }],
changeSite: [''],
recommendCount: [''],
hodingGameMoney: [{ value: '0', disabled: true }],
memo: [''],
bacaraRate: [],
rulletRate: [],
dragonRate: [],
etcRate: [],
slotRate: [],
casinoRusingRate: [],
slotRusingRate: [],
});
// Get the User
this._userService.user$
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((user: User | undefined) => {
if (!user) {
return;
}
this.selectedUser = user;
this.selectedProductForm.patchValue(user);
// Mark for check
this._changeDetectorRef.markForCheck();
});
/* this.user$ = this._userService.user$; */
}
/**
* After view init
*/
ngAfterViewInit(): void {}
/**
* On destroy
*/
ngOnDestroy(): void {
// Unsubscribe from all subscriptions
this._unsubscribeAll.next(null);
this._unsubscribeAll.complete();
}
// -----------------------------------------------------------------------------------------------------
// @ Public methods
// -----------------------------------------------------------------------------------------------------
// -----------------------------------------------------------------------------------------------------
// @ Private methods
// -----------------------------------------------------------------------------------------------------
/**
* Create product
*/
__createProduct(): void {}
/**
* Toggle product details
*
* @param productId
*/
__toggleDetails(productId: string): void {}
/**
* Track by function for ngFor loops
*
* @param index
* @param item
*/
__trackByFn(index: number, item: any): any {
return item.id || index;
}
}

1
src/app/modules/admin/board/notice-oneline/models/notice-oneline.ts
View File

@ -1,4 +1,5 @@
export interface NoticeOneline {
id: string;
idx?: number;
site?: string;
title?: string;

2
src/app/modules/admin/board/notice-oneline/notice-oneline.module.ts
View File

@ -15,6 +15,7 @@ import { MatGridListModule } from '@angular/material/grid-list';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatRadioModule } from '@angular/material/radio';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { TranslocoModule } from '@ngneat/transloco';
@ -45,6 +46,7 @@ import { noticeOnelineRoutes } from './notice-oneline.routing';
MatSlideToggleModule,
MatRadioModule,
MatCheckboxModule,
MatDatepickerModule,
],
})
export class NoticeOnelineModule {}

23
src/app/modules/admin/board/notice-oneline/notice-oneline.routing.ts
View File

@ -1,24 +1,35 @@
import { Route } from '@angular/router';
import { ListComponent } from './components/list.component';
import { ViewComponent } from '../../member/user/components/view.component';
import { ReditComponent } from './components/redit.component';
import { NoticeOnelinesResolver } from './resolvers/notice-oneline.resolver';
import { UserResolver } from '../../member/user/resolvers/user.resolver';
import {
NoticeOnelinesResolver,
NoticeOnelineResolver,
} from './resolvers/notice-oneline.resolver';
export const noticeOnelineRoutes: Route[] = [
{
path: '',
pathMatch: 'full',
redirectTo: 'list',
},
{
path: 'list',
component: ListComponent,
resolve: {
noticeOnelines: NoticeOnelinesResolver,
},
},
{
path: ':id',
component: ViewComponent,
path: 'redit',
component: ReditComponent,
},
{
path: 'redit/:id',
component: ReditComponent,
resolve: {
users: UserResolver,
noticeOneline: NoticeOnelineResolver,
},
},
];

2
src/app/modules/admin/board/notice-oneline/resolvers/notice-oneline.resolver.ts
View File

@ -38,7 +38,7 @@ export class NoticeOnelineResolver implements Resolve<any> {
state: RouterStateSnapshot
): Observable<NoticeOneline | undefined> {
return this._noticeOnelineService
.getNoticeOnelineById(route.paramMap.get('title'))
.getNoticeOnelineById(route.paramMap.get('id'))
.pipe(
// Error here means the requested product is not available
catchError((error) => {

3
src/app/modules/admin/board/notice/components/index.ts
View File

@ -1,3 +1,4 @@
import { ListComponent } from './list.component';
import { ReditComponent } from './redit.component';
export const COMPONENTS = [ListComponent];
export const COMPONENTS = [ListComponent, ReditComponent];

265
src/app/modules/admin/board/notice/components/list.component.html
View File

@ -12,132 +12,99 @@
<!-- Title -->
<div class="text-4xl font-extrabold tracking-tight">공지사항</div>
<!-- Actions -->
<div class="flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4">
<!-- Memo -->
<!-- <mat-form-field>
<ng-container *ngIf="notices$ | async as notices">
<ng-container
*ngFor="let notice of notices; trackBy: __trackByFn"
>
<div
class="inventory-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
>
<fieldset>
총 파트너수:{{ notice.totalPartnerCount }} 총 보유머니:{{
notice.totalHoldingMoney
}}
총 콤프:{{ notice.totalComp }} 총 합계:{{
notice.total
}}
</fieldset>
</div>
</ng-container>
</ng-container>
</mat-form-field> -->
<!-- SelectBox -->
<!-- <mat-form-field>
<mat-select placeholder="리스트수">
<mat-option value="40">40</mat-option>
<mat-option value="60">60</mat-option>
<mat-option value="80">80</mat-option>
<mat-option value="100">100</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="레벨">
<mat-option value="level1">LV.1</mat-option>
<mat-option value="level2">LV.2</mat-option>
<mat-option value="level3">LV.3</mat-option>
<mat-option value="level4">LV.4</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="상태">
<mat-option value="">정상</mat-option>
<mat-option value="">대기</mat-option>
<mat-option value="">탈퇴</mat-option>
<mat-option value="">휴면</mat-option>
<mat-option value="">블랙</mat-option>
<mat-option value="">정지</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="제한">
<mat-option value="">카지노제한</mat-option>
<mat-option value="">슬롯제한</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="입금">
<mat-option value="">계좌입금</mat-option>
</mat-select>
</mat-form-field> -->
<mat-form-field>
<mat-select placeholder="검색어">
<mat-option value="">작성자</mat-option>
<mat-option value="">글제목</mat-option>
<mat-option value="">글내용</mat-option>
</mat-select>
</mat-form-field>
<!-- <mat-form-field>
<mat-select placeholder="입금">
<mat-option value="">계좌입금</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="아이디">
<mat-option value="">아이디</mat-option>
<mat-option value="">닉네임</mat-option>
<mat-option value="">이름</mat-option>
<mat-option value="">사이트</mat-option>
<mat-option value="">파트너수동지급</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="가입일 정렬">
<mat-option value="">가입일 정렬</mat-option>
<mat-option value="">아이디 정렬</mat-option>
<mat-option value="">닉네임 정렬</mat-option>
<mat-option value="">캐쉬 정렬</mat-option>
<mat-option value="">콤프 정렬</mat-option>
<mat-option value="">쿠폰 정렬</mat-option>
<mat-option value="">입금 정렬</mat-option>
<mat-option value="">출금 정렬</mat-option>
<mat-option value="">차익 정렬</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field>
<mat-select placeholder="내림차순">
<mat-option value="">내림차순</mat-option>
<mat-option value="">오름차순</mat-option>
</mat-select>
</mat-form-field> -->
<div class="flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4">
<!-- Search -->
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded min-w-64"
<div>
<button mat-icon-button (click)="__onClickSearch()">
<mat-icon [svgIcon]="'heroicons_outline:search'"></mat-icon>
</button>
</div>
</div>
</div>
<!-- Search --><!-- Search -->
<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"
>
<!-- Actions -->
<div fxLayout="row wrap" class="items-center mt-6 sm:mt-0 sm:ml-0">
<!-- Search -->
<!-- Add user button -->
<button
mat-flat-button
[color]="'primary'"
fxFlex
(click)="__createProduct()"
>
<mat-icon [svgIcon]="'heroicons_outline:search'"></mat-icon>
<span class="ml-2 mr-1">Search</span>
</button>
</div>
<!-- Card inception -->
<div class="col-span-2 sm:col-span-1">
<mat-form-field
class="fuse-mat-no-subscript w-full"
[floatLabel]="'always'"
>
<mat-icon
class="icon-size-5"
matPrefix
[svgIcon]="'heroicons_solid:search'"
></mat-icon>
<input
matInput
[formControl]="searchInputControl"
[autocomplete]="'off'"
[placeholder]="'Search'"
[matDatepicker]="picker1"
[placeholder]="'Choose a date'"
/>
<mat-datepicker-toggle
matSuffix
[for]="picker1"
></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
</mat-form-field>
<!-- Add user button -->
</div>
<!-- Card expiration -->
<div class="col-span-2 sm:col-span-1">
<mat-form-field
class="fuse-mat-no-subscript w-full"
[floatLabel]="'always'"
>
<input
matInput
[matDatepicker]="picker2"
[placeholder]="'Choose a date'"
/>
<mat-datepicker-toggle
matSuffix
[for]="picker2"
></mat-datepicker-toggle>
<mat-datepicker #picker2></mat-datepicker>
</mat-form-field>
</div>
</div>
<div
class="relative flex flex-col sm:flex-row flex-0 sm:items-center sm:justify-between py-8 px-6 md:px-8 border-b"
>
<!-- Title -->
<div class="text-4xl font-extrabold tracking-tight"></div>
<!-- Actions -->
<div class="flex shrink-0 items-center mt-6 sm:mt-0 sm:ml-4">
<!-- Search -->
<button
class="ml-4"
mat-flat-button
[color]="'primary'"
(click)="__createProduct()"
(click)="__onClickReditBtn($event, '0')"
>
<!-- <mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon> -->
<span class="ml-2 mr-1">검색하기</span>
<mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon>
<span class="ml-2 mr-1">등록</span>
</button>
<button class="ml-4" mat-flat-button [color]="'primary'">
<mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon>
<span class="ml-2 mr-1">숨김</span>
</button>
<button class="ml-4" mat-flat-button [color]="'primary'">
<mat-icon [svgIcon]="'heroicons_outline:plus'"></mat-icon>
<span class="ml-2 mr-1">완전삭제</span>
</button>
</div>
</div>
@ -149,22 +116,28 @@
class="flex flex-col flex-auto sm:mb-18 overflow-hidden sm:overflow-y-auto"
>
<ng-container *ngIf="notices$ | async as notices">
<ng-container *ngIf="notices.length > 0; else noNotice">
<ng-container *ngIf="notices.length > 0; else noUser">
<div class="grid">
<!-- Header -->
<div
class="inventory-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"
matSort
matSortDisableClear
class="inventory-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 sm:block">선택</div>
<div class="hidden sm:block">번호</div>
<div class="hidden sm:block">사이트</div>
<div class="hidden sm:block">제목</div>
<div class="hidden sm:block">작성자</div>
<div class="hidden sm:block">작성일</div>
<div class="hidden sm:block">조회</div>
<div class="hidden sm:block">상태</div>
<div class="hidden lg:block">
<mat-checkbox></mat-checkbox>
</div>
<div class="hidden lg:block">번호</div>
<div class="hidden lg:block">사이트</div>
<div class="hidden lg:block">제목</div>
<div class="hidden lg:block">
작성자
<hr style="margin: 7px 0px" />
작성일
</div>
<div class="hidden lg:block">
조회
<hr style="margin: 7px 0px" />
상태
</div>
</div>
<!-- Rows -->
<ng-container *ngIf="notices$ | async as notices">
@ -174,44 +147,44 @@
<div
class="inventory-grid grid items-center gap-4 py-3 px-6 md:px-8 border-b"
>
<!-- 선택 -->
<div class="hidden sm:block truncate">
<div class="hidden lg:block">
<mat-checkbox></mat-checkbox>
</div>
<!-- 번호 -->
<div class="hidden sm:block truncate">
<div class="hidden lg:block">
{{ notice.idx }}
</div>
<!-- 사이트 -->
<div class="hidden sm:block truncate">
<div class="hidden lg:block">
{{ notice.site }}
</div>
<!-- 제목 -->
<div class="hidden sm:block truncate">
<div
class="hidden lg:block"
style="cursor: pointer"
(click)="__onClickReditBtn($event, notice.id)"
>
{{ notice.title }}
</div>
<!-- 작성자 -->
<div class="hidden sm:block truncate">
<!-- 작성자 || 작성일 -->
<div class="hidden lg:block">
{{ notice.writer }}
</div>
<!-- 작성일 -->
<div class="hidden sm:block truncate">
<hr style="margin: 7px 0px" />
{{ notice.writeDate }}
</div>
<!-- 조회 -->
<div class="hidden sm:block truncate">
<!-- 조회 || 상태 -->
<div class="hidden lg:block">
{{ notice.views }}
</div>
<!-- 상태 -->
<div class="hidden sm:block truncate">
<hr style="margin: 7px 0px" />
{{ notice.state }}
</div>
<!-- management -->
</div>
</ng-container>
</ng-container>
<button mat-flat-button [color]="'primary'">등록</button>
<button mat-flat-button [color]="'primary'">숨김</button>
<button mat-flat-button [color]="'warn'">완전삭제</button>
</div>
<mat-paginator
@ -226,11 +199,11 @@
</ng-container>
</ng-container>
<ng-template #noNotice>
<ng-template #noUser>
<div
class="p-8 sm:p-16 border-t text-4xl font-semibold tracking-tight text-center"
>
There are no notices!
There are no data!
</div>
</ng-template>
</div>

64
src/app/modules/admin/board/notice/components/list.component.ts
View File

@ -42,18 +42,18 @@ import { Router } from '@angular/router';
/* language=SCSS */
`
.inventory-grid {
grid-template-columns: 60px auto 40px;
grid-template-columns: 40px 40px 40px auto 200px 200px;
@screen sm {
grid-template-columns: 60px 60px 60px 60px 60px 60px auto 60px;
grid-template-columns: 40px 40px 40px auto 200px 200px;
}
@screen md {
grid-template-columns: 60px 60px 60px 60px 60px 60px auto 60px 60px;
grid-template-columns: 40px 40px 40px auto 300px 200px;
}
@screen lg {
grid-template-columns: 60px 70px 70px 70px 70px 100px 60px 60px auto 60px 60px 60px 60px;
grid-template-columns: 40px 40px 40px auto 300px 200px;
}
}
`,
@ -67,13 +67,14 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatSort) private _sort!: MatSort;
notices$!: Observable<Notice[] | undefined>;
users$!: Observable<User[] | undefined>;
isLoading = false;
searchInputControl = new FormControl();
selectedNotice?: Notice;
pagination?: NoticePagination;
__isSearchOpened = false;
private _unsubscribeAll: Subject<any> = new Subject<any>();
/**
@ -113,45 +114,7 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
/**
* After view init
*/
ngAfterViewInit(): void {
if (this._sort && this._paginator) {
// Set the initial sort
this._sort.sort({
id: 'name',
start: 'asc',
disableClear: true,
});
// Mark for check
this._changeDetectorRef.markForCheck();
// If the notice changes the sort order...
this._sort.sortChange
.pipe(takeUntil(this._unsubscribeAll))
.subscribe(() => {
// Reset back to the first page
this._paginator.pageIndex = 0;
});
// Get products if sort or page changes
merge(this._sort.sortChange, this._paginator.page)
.pipe(
switchMap(() => {
this.isLoading = true;
return this._noticeService.getNotices(
this._paginator.pageIndex,
this._paginator.pageSize,
this._sort.active,
this._sort.direction
);
}),
map(() => {
this.isLoading = false;
})
)
.subscribe();
}
}
ngAfterViewInit(): void {}
/**
* On destroy
@ -166,14 +129,19 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy {
// @ Public methods
// -----------------------------------------------------------------------------------------------------
viewUserDetail(id: string): void {
let url: string = 'member/user/' + id;
this.router.navigateByUrl(url);
}
// -----------------------------------------------------------------------------------------------------
// @ Private methods
// -----------------------------------------------------------------------------------------------------
__onClickReditBtn(event: MouseEvent, id: string): void {
const param = id === '0' ? '' : id;
let url: string = 'board/notice/redit/' + param;
this.router.navigateByUrl(url);
}
__onClickSearch(): void {
this.__isSearchOpened = !this.__isSearchOpened;
}
/**
* Create product
*/

123
src/app/modules/admin/board/notice/components/redit.component.html Normal file
View File

@ -0,0 +1,123 @@
<div class="flex flex-col flex-auto min-w-0">
<div class="flex-auto border-t -mt-px pt-4 sm:pt-6">
<div class="w-full max-w-screen-xl mx-auto">
<div class="grid grid-cols-1 sm:grid-cols-6 gap-6 w-full min-w-0">
<!-- Budget distribution -->
<div
class="sm:col-span-6 flex flex-col flex-auto p-6 bg-card shadow rounded-2xl overflow-hidden"
>
<div class="text-lg font-medium tracking-tight leading-6 truncate">
공지사항 {{ !notice ? "등록" : "수정" }}
</div>
<div class="flex flex-col flex-auto mt-2 overflow-x-auto">
<form
[formGroup]="noticeForm"
autocomplete="off"
class="flex flex-col flex-auto p-6 sm:p-8 overflow-y-auto"
>
<!-- 글쓴이 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>글쓴이(아이디)</mat-label>
<input
matInput
readonly="true"
[formControlName]="'writer'"
/>
</mat-form-field>
</div>
<!-- 공지적용 -->
<div>
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>공지적용</mat-label>
<mat-select>
<ng-container *ngFor="let type of noticeType">
<mat-option [value]="type.key">
{{ type.value }}
</mat-option>
</ng-container>
</mat-select>
</mat-form-field>
</div>
<!-- 제목 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>제목</mat-label>
<input matInput readonly="true" [formControlName]="'title'" />
</mat-form-field>
</div>
<!-- 등록시간 -->
<div class="mt-8">
<mat-form-field
class="fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<mat-label>등록시간</mat-label>
<input matInput [formControlName]="'writerDate'" />
</mat-form-field>
<span
>예) 2001-01-01 23시22분(2001년 1월1일 오후 11시21분)-
<p style="color: red">미등록시 현재일로 등록</p></span
>
</div>
<!-- Body -->
<!-- <quill-editor class="mt-2"></quill-editor> -->
<mat-form-field
class="mt-8 fuse-mat-dense fuse-mat-no-subscript fuse-mat-rounded fuse-mat-bold w-full"
>
<textarea
matInput
[required]="true"
[rows]="5"
matTextareaAutosize
[formControlName]="'content'"
></textarea>
<mat-label>내용</mat-label>
</mat-form-field>
</form>
</div>
<!-- Actions -->
<div
class="flex flex-col sm:flex-row sm:items-center justify-between mt-4 sm:mt-6"
>
<div class="flex items-center mt-4 sm:mt-0">
<!-- Save as draft -->
<button
class="sm:mx-3"
mat-stroked-button
(click)="__onClickeCancel()"
>
<span>취소</span>
</button>
<!-- Send -->
<button
class="order-first sm:order-last"
mat-flat-button
[color]="'primary'"
(click)="__onClickReditBtn($event, notice)"
>
{{ !notice ? "등록" : "수정" }}
</button>
<button
*ngIf="!!notice"
class="order-first sm:order-last"
mat-flat-button
[color]="'primary'"
>
숨김
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>

129
src/app/modules/admin/board/notice/components/view.component.ts → src/app/modules/admin/board/notice/components/redit.component.ts
View File

@ -8,33 +8,20 @@ import {
ViewChild,
ViewEncapsulation,
} from '@angular/core';
import {
FormBuilder,
FormControl,
FormGroup,
Validators,
} from '@angular/forms';
import { MatCheckboxChange } from '@angular/material/checkbox';
import { ActivatedRoute, Router } from '@angular/router';
import { FormBuilder, FormControl, FormGroup } from '@angular/forms';
import { MatPaginator } from '@angular/material/paginator';
import { MatSort } from '@angular/material/sort';
import {
debounceTime,
map,
merge,
Observable,
Subject,
switchMap,
takeUntil,
} from 'rxjs';
import { Subject, takeUntil } from 'rxjs';
import { fuseAnimations } from '@fuse/animations';
import { FuseConfirmationService } from '@fuse/services/confirmation';
import { User } from 'app/modules/admin/member/user/models/user';
import { UserService } from 'app/modules/admin/member/user/services/user.service';
import { NoticeService } from '../services/notice.service';
import { Notice } from '../models/notice';
@Component({
selector: 'notice-view',
templateUrl: './view.component.html',
selector: 'notice-redit',
templateUrl: './redit.component.html',
styles: [
/* language=SCSS */
`
@ -59,14 +46,18 @@ import { UserService } from 'app/modules/admin/member/user/services/user.service
changeDetection: ChangeDetectionStrategy.OnPush,
animations: fuseAnimations,
})
export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
export class ReditComponent implements OnInit, AfterViewInit, OnDestroy {
@ViewChild(MatPaginator) private _paginator!: MatPaginator;
@ViewChild(MatSort) private _sort!: MatSort;
isLoading = false;
searchInputControl = new FormControl();
selectedProductForm!: FormGroup;
selectedUser?: User;
noticeForm!: FormGroup;
editMode: boolean = false;
noticeType = NOTICE_TYPE;
notice!: Notice;
private _unsubscribeAll: Subject<any> = new Subject<any>();
@ -77,7 +68,9 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
private _changeDetectorRef: ChangeDetectorRef,
private _fuseConfirmationService: FuseConfirmationService,
private _formBuilder: FormBuilder,
private _userService: UserService
private _route: ActivatedRoute,
private _router: Router,
private _noticeService: NoticeService
) {}
// -----------------------------------------------------------------------------------------------------
@ -88,53 +81,28 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
* On init
*/
ngOnInit(): void {
this.selectedProductForm = this._formBuilder.group({
id: [''],
signinId: [{ value: '', disabled: true }],
signinPw: [{ value: '' }],
exchangePw: [''],
description: [''],
tags: [[]],
nickname: [{ value: '', disabled: true }],
ownCash: [''],
phoneNumber: [''],
level: [''],
status: [''],
isExcahngeMoney: [''],
bankname: [''],
accountNumber: [''],
accountHolder: [''],
comp: [''],
coupon: [''],
recommender: [{ value: '', disabled: true }],
changeSite: [''],
recommendCount: [''],
hodingGameMoney: [{ value: '0', disabled: true }],
memo: [''],
bacaraRate: [],
rulletRate: [],
dragonRate: [],
etcRate: [],
slotRate: [],
casinoRusingRate: [],
slotRusingRate: [],
// Create the contact form
this.noticeForm = this._formBuilder.group({
writer: ['관리자'],
noticeType: [''],
title: [''],
writerDate: [''],
content: [''],
});
// Get the User
this._userService.user$
this._noticeService.notice$
.pipe(takeUntil(this._unsubscribeAll))
.subscribe((user: User | undefined) => {
if (!user) {
.subscribe((notice: Notice | undefined) => {
if (!notice) {
return;
}
this.selectedUser = user;
this.selectedProductForm.patchValue(user);
this.notice = notice;
this.noticeForm.patchValue(notice);
// Mark for check
this._changeDetectorRef.markForCheck();
});
/* this.user$ = this._userService.user$; */
}
/**
@ -159,6 +127,14 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
// @ Private methods
// -----------------------------------------------------------------------------------------------------
__onClickeCancel(): void {
/* let url: string = 'board/customer-template/';
this._router.navigateByUrl(url); */
}
__onClickReditBtn(event: MouseEvent, notice: Notice): void {
console.log('click: ', notice);
}
/**
* Create product
*/
@ -171,6 +147,22 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
*/
__toggleDetails(productId: string): void {}
/**
* Toggle edit mode
*
* @param editMode
*/
toggleEditMode(editMode: boolean | null = null): void {
if (editMode === null) {
this.editMode = !this.editMode;
} else {
this.editMode = editMode;
}
// Mark for check
this._changeDetectorRef.markForCheck();
}
/**
* Track by function for ngFor loops
*
@ -181,3 +173,14 @@ export class ViewComponent implements OnInit, AfterViewInit, OnDestroy {
return item.id || index;
}
}
export const NOTICE_TYPE = [
{
key: '0',
value: '공지사항',
},
{
key: '1',
value: '파트너공지',
},
];

2
src/app/modules/admin/board/notice/components/view.component.html
View File

@ -1,2 +0,0 @@
<!-- Title -->
<div class="text-4xl font-extrabold tracking-tight">고객센터-상세page</div>

2
src/app/modules/admin/board/notice/models/notice.ts
View File

@ -1,5 +1,5 @@
export interface Notice {
id?: string;
id: string;
idx?: number;
site?: string;
title?: string;

4
src/app/modules/admin/board/notice/notice.module.ts
View File

@ -15,6 +15,8 @@ import { MatGridListModule } from '@angular/material/grid-list';
import { MatSlideToggleModule } from '@angular/material/slide-toggle';
import { MatRadioModule } from '@angular/material/radio';
import { MatCheckboxModule } from '@angular/material/checkbox';
import { MatDatepickerModule } from '@angular/material/datepicker';
import { MatMomentDateModule } from '@angular/material-moment-adapter';
import { TranslocoModule } from '@ngneat/transloco';
@ -45,6 +47,8 @@ import { noticeRoutes } from './notice.routing';
MatSlideToggleModule,
MatRadioModule,
MatCheckboxModule,
MatDatepickerModule,
MatMomentDateModule,
],
})
export class NoticeModule {}

20
src/app/modules/admin/board/notice/notice.routing.ts
View File

@ -1,24 +1,32 @@
import { Route } from '@angular/router';
import { ListComponent } from './components/list.component';
import { ViewComponent } from '../../member/user/components/view.component';
import { ReditComponent } from './components/redit.component';
import { NoticesResolver } from './resolvers/notice.resolver';
import { UserResolver } from '../../member/user/resolvers/user.resolver';
import { NoticesResolver, NoticeResolver } from './resolvers/notice.resolver';
export const noticeRoutes: Route[] = [
{
path: '',
pathMatch: 'full',
redirectTo: 'list',
},
{
path: 'list',
component: ListComponent,
resolve: {
notices: NoticesResolver,
},
},
{
path: ':id',
component: ViewComponent,
path: 'redit',
component: ReditComponent,
},
{
path: 'redit/:id',
component: ReditComponent,
resolve: {
users: UserResolver,
notice: NoticeResolver,
},
},
];

62
src/app/modules/admin/board/popup/components/redit.component.ts
View File

@ -55,7 +55,6 @@ export class ReditComponent implements OnInit, AfterViewInit, OnDestroy {
searchInputControl = new FormControl();
popupForm!: FormGroup;
editMode: boolean = false;
contact = contacts[0];
categories = categories;
popup: Popup | undefined;
@ -159,20 +158,7 @@ export class ReditComponent implements OnInit, AfterViewInit, OnDestroy {
// Mark for check
this._changeDetectorRef.markForCheck();
}
/**
* Get country info by iso code
*
* @param iso
*/
getCountryByIso(iso: string): Country {
return {
id: '19430ee3-b0fe-4987-a7c8-74453ad5504d',
iso: 'af',
name: 'Afghanistan',
code: '+93',
flagImagePos: '-1px -3180px',
} as Country;
}
/**
* Track by function for ngFor loops
*
@ -184,52 +170,6 @@ export class ReditComponent implements OnInit, AfterViewInit, OnDestroy {
}
}
export const contacts = [
{
id: 'cd5fa417-b667-482d-b208-798d9da3213c',
avatar: 'assets/images/avatars/male-01.jpg',
background: 'assets/images/cards/14-640x480.jpg',
name: 'Dejesus Michael',
emails: [
{
email: 'dejesusmichael@mail.org',
label: '가로',
},
{
email: 'michael.dejesus@vitricomp.io',
label: '세로',
},
],
phoneNumbers: [
{
country: 'bs',
phoneNumber: 'TOP',
label: 'Mobile',
},
{
country: 'bs',
phoneNumber: 'LEFT',
label: 'Work',
},
],
title: 'Track Service Worker',
company: 'Vitricomp',
birthday: '1975-01-10T12:00:00.000Z',
address: '279 Independence Avenue, Calvary, Guam, PO4127',
notes:
'<p>Do incididunt cillum duis eu pariatur enim proident minim officia amet proident consequat consequat qui consequat magna magna occaecat aliquip culpa pariatur velit nisi nostrud irure eu ullamco exercitation sint.</p><p>Cillum deserunt laborum laborum quis nisi enim et aliquip labore excepteur in excepteur labore amet in ipsum ipsum nostrud deserunt lorem nisi voluptate dolor minim enim ut eu cupidatat enim.</p>',
tags: ['56ddbd47-4078-4ddd-8448-73c5e88d5f59'],
},
];
export interface Country {
id: string;
iso: string;
name: string;
code: string;
flagImagePos: string;
}
export const categories = [
{
id: 'b899ec30-b85a-40ab-bb1f-18a596d5c6de',