From 8f57de6952d162458fd3baa66e40f524625267af Mon Sep 17 00:00:00 2001 From: JUNG YI DAM Date: Sat, 6 Aug 2022 11:15:09 +0000 Subject: [PATCH] =?UTF-8?q?=EB=8F=84=EB=A9=94=EC=9D=B8=20=EC=84=A4?= =?UTF-8?q?=EC=A0=95=20page=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/app.routing.ts | 7 + src/app/mock-api/apps/settings/domain/api.ts | 73 ++++++++ src/app/mock-api/apps/settings/domain/data.ts | 52 ++++++ src/app/mock-api/common/navigation/data.ts | 7 + src/app/mock-api/index.ts | 2 + .../admin/settings/domain/components/index.ts | 3 + .../domain/components/list.component.html | 169 ++++++++++++++++++ .../domain/components/list.component.ts | 164 +++++++++++++++++ .../admin/settings/domain/domain.module.ts | 44 +++++ .../admin/settings/domain/domain.routing.ts | 15 ++ .../domain/resolvers/domain.resolver.ts | 39 ++++ .../domain/services/domain.service.ts | 58 ++++++ src/assets/i18n/en.json | 7 + src/assets/i18n/ko.json | 1 + 14 files changed, 641 insertions(+) create mode 100644 src/app/mock-api/apps/settings/domain/api.ts create mode 100644 src/app/mock-api/apps/settings/domain/data.ts create mode 100644 src/app/modules/admin/settings/domain/components/index.ts create mode 100644 src/app/modules/admin/settings/domain/components/list.component.html create mode 100644 src/app/modules/admin/settings/domain/components/list.component.ts create mode 100644 src/app/modules/admin/settings/domain/domain.module.ts create mode 100644 src/app/modules/admin/settings/domain/domain.routing.ts create mode 100644 src/app/modules/admin/settings/domain/resolvers/domain.resolver.ts create mode 100644 src/app/modules/admin/settings/domain/services/domain.service.ts diff --git a/src/app/app.routing.ts b/src/app/app.routing.ts index 5fd0efe..dde90a8 100644 --- a/src/app/app.routing.ts +++ b/src/app/app.routing.ts @@ -354,6 +354,13 @@ export const appRoutes: Route[] = [ 'app/modules/admin/settings/indexing/indexing.module' ).then((m: any) => m.IndexingModule), }, + { + path: 'domain', + loadChildren: () => + import('app/modules/admin/settings/domain/domain.module').then( + (m: any) => m.DomainModule + ), + }, ], }, { diff --git a/src/app/mock-api/apps/settings/domain/api.ts b/src/app/mock-api/apps/settings/domain/api.ts new file mode 100644 index 0000000..d5b8503 --- /dev/null +++ b/src/app/mock-api/apps/settings/domain/api.ts @@ -0,0 +1,73 @@ +import { Injectable } from '@angular/core'; +import { assign, cloneDeep } from 'lodash-es'; +import { FuseMockApiService, FuseMockApiUtils } from '@fuse/lib/mock-api'; +import { domainSetting as domainSettingData } from './data'; + +@Injectable({ + providedIn: 'root', +}) +export class DomainSettingMockApi { + private _domainSetting: any = domainSettingData; + + /** + * Constructor + */ + constructor(private _fuseMockApiService: FuseMockApiService) { + // Register Mock API handlers + this.registerHandlers(); + } + + // ----------------------------------------------------------------------------------------------------- + // @ Public methods + // ----------------------------------------------------------------------------------------------------- + + /** + * Register Mock API handlers + */ + registerHandlers(): void { + // ----------------------------------------------------------------------------------------------------- + // @ BasicSetting - GET + // ----------------------------------------------------------------------------------------------------- + this._fuseMockApiService + .onGet('api/apps/settings/domain', 300) + .reply(({ request }) => { + // Clone the deposits + let domainSetting: any | null = cloneDeep(this._domainSetting); + + // Return the response + return [ + 200, + { + domainSetting, + }, + ]; + }); + + // ----------------------------------------------------------------------------------------------------- + // @ BasicSetting - PATCH + // ----------------------------------------------------------------------------------------------------- + this._fuseMockApiService + .onPatch('api/apps/settings/domain') + .reply(({ request }) => { + // Get the id and deposit + const domainSetting = cloneDeep(request.body.domainSetting); + + // Prepare the updated basicSetting + let updatedBasicSetting = null; + + // Find the deposit and update it + // this._basicSetting.forEach((item, index, bs) => { + // if (item.id === id) { + // // Update the deposit + // basicSetting[index] = assign({}, basicSetting[index], deposit); + + // // Store the updated deposit + // updatedDeposit = deposits[index]; + // } + // }); + + // Return the response + return [200, domainSetting]; + }); + } +} diff --git a/src/app/mock-api/apps/settings/domain/data.ts b/src/app/mock-api/apps/settings/domain/data.ts new file mode 100644 index 0000000..b1e57a1 --- /dev/null +++ b/src/app/mock-api/apps/settings/domain/data.ts @@ -0,0 +1,52 @@ +/* eslint-disable */ + +export const domainSetting = { + domain: [ + { + idx: '4', + domain: 'nsky-8989.com', + designFolder: 'NEW-SKY', + siteName: '뉴스카이', + expiryDate: '2023-06-29', + periodOfUse: '328일', + memo: '', + }, + { + idx: '3', + domain: 'nsky-3040', + designFolder: 'NEW-SKY', + siteName: '뉴스카이', + expiryDate: '2023-05-05', + periodOfUse: '273일', + memo: '미사용', + }, + { + idx: '2', + domain: 'nsky-5858.com', + designFolder: 'NEW-SKY', + siteName: '뉴스카이', + expiryDate: '2023-05-05', + periodOfUse: '273일', + memo: '조치원라인', + }, + { + idx: '1', + domain: 'nsky-9988.com', + designFolder: 'NEW-SKY', + siteName: '뉴스카이', + expiryDate: '2023-05-04', + periodOfUse: '272일', + memo: '', + }, + ], + bota: [ + { + domain: '.', + designFolder: '.', + siteName: '.', + expiryDate: '.', + periodOfUse: '.', + memo: '.', + }, + ], +}; diff --git a/src/app/mock-api/common/navigation/data.ts b/src/app/mock-api/common/navigation/data.ts index 4f0a539..a23c738 100644 --- a/src/app/mock-api/common/navigation/data.ts +++ b/src/app/mock-api/common/navigation/data.ts @@ -453,6 +453,13 @@ export const defaultNavigation: FuseNavigationItem[] = [ icon: 'heroicons_outline:cog', link: '/settings/indexing', }, + { + id: 'settings.domain', + title: 'Domain-Setting', + type: 'basic', + icon: 'heroicons_outline:cog', + link: '/settings/domain', + }, ], }, ]; diff --git a/src/app/mock-api/index.ts b/src/app/mock-api/index.ts index 0af8229..2998cd3 100644 --- a/src/app/mock-api/index.ts +++ b/src/app/mock-api/index.ts @@ -49,6 +49,7 @@ import { EvoSettingMockApi } from './apps/settings/evo/api'; import { GameSettingMockApi } from './apps/settings/game/api'; import { LadderSettingMockApi } from './apps/settings/ladder/api'; import { IndexingSettingMockApi } from './apps/settings/indexing/api'; +import { DomainSettingMockApi } from './apps/settings/domain/api'; import { ReportDailyMockApi } from './apps/report/daily/api'; import { ReportMonthlyMockApi } from './apps/report/monthly/api'; import { ReportDailyPartnerMockApi } from './apps/report/daily-partner/api'; @@ -122,6 +123,7 @@ export const mockApiServices = [ GameSettingMockApi, LadderSettingMockApi, IndexingSettingMockApi, + DomainSettingMockApi, ReportDailyMockApi, ReportMonthlyMockApi, ReportDailyPartnerMockApi, diff --git a/src/app/modules/admin/settings/domain/components/index.ts b/src/app/modules/admin/settings/domain/components/index.ts new file mode 100644 index 0000000..04759eb --- /dev/null +++ b/src/app/modules/admin/settings/domain/components/index.ts @@ -0,0 +1,3 @@ +import { ListComponent } from './list.component'; + +export const COMPONENTS = [ListComponent]; diff --git a/src/app/modules/admin/settings/domain/components/list.component.html b/src/app/modules/admin/settings/domain/components/list.component.html new file mode 100644 index 0000000..f78df1b --- /dev/null +++ b/src/app/modules/admin/settings/domain/components/list.component.html @@ -0,0 +1,169 @@ +
+
+
+
+ +
+
+ 도메인 관리 +
+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
번호 + + {{ info.idx }} + + 도메인 + + {{ info.domain }} + + 디자인 폴더 + + {{ info.designFolder }} + + 사이트명 + + {{ info.siteName }} + + 만료일 + + {{ info.expiryDate }} + + 남은 기간 + + {{ info.periodOfUse }} + + 메모 + + + + + 도메인 삭제 + +
+
+
+ +
+
+ 도메인 등록 +
+
+ + + + + + + + + + + + + + + + + +
도메인(필수)디자인 폴더(옵션)사이트명(옵션)만료일(옵션)메모(옵션)도메인 등록
+ + + + + + + + + + + + + + + + + + + +
+
+
+
+
+
+
diff --git a/src/app/modules/admin/settings/domain/components/list.component.ts b/src/app/modules/admin/settings/domain/components/list.component.ts new file mode 100644 index 0000000..b677369 --- /dev/null +++ b/src/app/modules/admin/settings/domain/components/list.component.ts @@ -0,0 +1,164 @@ +import { + AfterViewInit, + ChangeDetectionStrategy, + ChangeDetectorRef, + Component, + OnDestroy, + OnInit, + ViewChild, + ViewEncapsulation, +} from '@angular/core'; +import { + FormBuilder, + FormControl, + FormGroup, + Validators, +} from '@angular/forms'; + +import { MatTableDataSource } from '@angular/material/table'; +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 { DomainService } from '../services/domain.service'; +import { MatSelectChange } from '@angular/material/select'; + +@Component({ + selector: 'settings-domain-list', + templateUrl: './list.component.html', + styles: [ + /* language=SCSS */ + ` + .settings-domain-grid { + grid-template-columns: 60px auto 40px; + + @screen sm { + grid-template-columns: 60px auto 60px 72px; + } + + @screen md { + grid-template-columns: 60px 60px auto 112px 72px; + } + + @screen lg { + grid-template-columns: 60px 60px auto 112px 96px 96px 72px; + } + } + `, + ], + encapsulation: ViewEncapsulation.None, + changeDetection: ChangeDetectionStrategy.OnPush, + animations: fuseAnimations, +}) +export class ListComponent implements OnInit, AfterViewInit, OnDestroy { + @ViewChild(MatPaginator) private _paginator!: MatPaginator; + @ViewChild(MatSort) private _sort!: MatSort; + + domainSettingTableColumns: string[] = [ + 'idx', + 'domain', + 'designFolder', + 'siteName', + 'expiryDate', + 'periodOfUse', + 'memo', + 'deleteBtn', + ]; + + domainRegistrationTableColumns: string[] = [ + 'domain', + 'designFolder', + 'siteName', + 'expiryDate', + 'memo', + 'updateBtn', + ]; + + domainSettingDataSource: MatTableDataSource = new MatTableDataSource(); + domainRegistrationDataSource: MatTableDataSource = + new MatTableDataSource(); + + private _unsubscribeAll: Subject = new Subject(); + + /** + * Constructor + */ + constructor( + private _changeDetectorRef: ChangeDetectorRef, + private _fuseConfirmationService: FuseConfirmationService, + private _formBuilder: FormBuilder, + private _domainService: DomainService + ) {} + + // ----------------------------------------------------------------------------------------------------- + // @ Lifecycle hooks + // ----------------------------------------------------------------------------------------------------- + + /** + * On init + */ + ngOnInit(): void { + // Get the products + this._domainService.domainSetting$ + .pipe(takeUntil(this._unsubscribeAll)) + .subscribe((domainSetting: any | undefined) => { + this.domainSettingDataSource = domainSetting.domain; + this.domainRegistrationDataSource = domainSetting.bota; + // Mark for check + this._changeDetectorRef.markForCheck(); + }); + } + + /** + * 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; + } +} diff --git a/src/app/modules/admin/settings/domain/domain.module.ts b/src/app/modules/admin/settings/domain/domain.module.ts new file mode 100644 index 0000000..e0da8ce --- /dev/null +++ b/src/app/modules/admin/settings/domain/domain.module.ts @@ -0,0 +1,44 @@ +import { NgModule } from '@angular/core'; +import { RouterModule } from '@angular/router'; + +import { MatButtonModule } from '@angular/material/button'; +import { MatFormFieldModule } from '@angular/material/form-field'; +import { MatIconModule } from '@angular/material/icon'; +import { MatInputModule } from '@angular/material/input'; +import { MatPaginatorModule } from '@angular/material/paginator'; +import { MatProgressBarModule } from '@angular/material/progress-bar'; +import { MatRippleModule } from '@angular/material/core'; +import { MatSortModule } from '@angular/material/sort'; +import { MatSelectModule } from '@angular/material/select'; +import { MatTooltipModule } from '@angular/material/tooltip'; +import { MatTableModule } from '@angular/material/table'; + +import { TranslocoModule } from '@ngneat/transloco'; + +import { SharedModule } from 'app/shared/shared.module'; + +import { COMPONENTS } from './components'; + +import { domainRoutes } from './domain.routing'; + +@NgModule({ + declarations: [COMPONENTS], + imports: [ + TranslocoModule, + SharedModule, + RouterModule.forChild(domainRoutes), + + MatButtonModule, + MatFormFieldModule, + MatIconModule, + MatInputModule, + MatPaginatorModule, + MatProgressBarModule, + MatRippleModule, + MatSortModule, + MatSelectModule, + MatTooltipModule, + MatTableModule, + ], +}) +export class DomainModule {} diff --git a/src/app/modules/admin/settings/domain/domain.routing.ts b/src/app/modules/admin/settings/domain/domain.routing.ts new file mode 100644 index 0000000..1243f44 --- /dev/null +++ b/src/app/modules/admin/settings/domain/domain.routing.ts @@ -0,0 +1,15 @@ +import { Route } from '@angular/router'; + +import { ListComponent } from './components/list.component'; + +import { DomainResolver } from './resolvers/domain.resolver'; + +export const domainRoutes: Route[] = [ + { + path: '', + component: ListComponent, + resolve: { + domain: DomainResolver, + }, + }, +]; diff --git a/src/app/modules/admin/settings/domain/resolvers/domain.resolver.ts b/src/app/modules/admin/settings/domain/resolvers/domain.resolver.ts new file mode 100644 index 0000000..a0349cf --- /dev/null +++ b/src/app/modules/admin/settings/domain/resolvers/domain.resolver.ts @@ -0,0 +1,39 @@ +import { Injectable } from '@angular/core'; +import { + ActivatedRouteSnapshot, + Resolve, + Router, + RouterStateSnapshot, +} from '@angular/router'; +import { catchError, Observable, throwError } from 'rxjs'; + +import { DomainService } from '../services/domain.service'; + +@Injectable({ + providedIn: 'root', +}) +export class DomainResolver implements Resolve { + /** + * Constructor + */ + constructor(private _domainService: DomainService) {} + + // ----------------------------------------------------------------------------------------------------- + // @ Public methods + // ----------------------------------------------------------------------------------------------------- + + /** + * Resolver + * + * @param route + * @param state + */ + resolve( + route: ActivatedRouteSnapshot, + state: RouterStateSnapshot + ): Observable<{ + domainSetting: any; + }> { + return this._domainService.getDomainSetting(); + } +} diff --git a/src/app/modules/admin/settings/domain/services/domain.service.ts b/src/app/modules/admin/settings/domain/services/domain.service.ts new file mode 100644 index 0000000..d07228f --- /dev/null +++ b/src/app/modules/admin/settings/domain/services/domain.service.ts @@ -0,0 +1,58 @@ +import { Injectable } from '@angular/core'; +import { HttpClient } from '@angular/common/http'; +import { + BehaviorSubject, + filter, + map, + Observable, + of, + switchMap, + take, + tap, + throwError, +} from 'rxjs'; + +@Injectable({ + providedIn: 'root', +}) +export class DomainService { + // Private + private __domainSetting = new BehaviorSubject(undefined); + + /** + * Constructor + */ + constructor(private _httpClient: HttpClient) {} + + // ----------------------------------------------------------------------------------------------------- + // @ Accessors + // ----------------------------------------------------------------------------------------------------- + + /** + * Getter for game + */ + get domainSetting$(): Observable { + return this.__domainSetting.asObservable(); + } + + // ----------------------------------------------------------------------------------------------------- + // @ Public methods + // ----------------------------------------------------------------------------------------------------- + + /** + * Get powerballs + * + * + */ + getDomainSetting(): Observable<{ + domainSetting: any; + }> { + return this._httpClient + .get<{ domainSetting: any }>('api/apps/settings/domain') + .pipe( + tap((response) => { + this.__domainSetting.next(response.domainSetting); + }) + ); + } +} diff --git a/src/assets/i18n/en.json b/src/assets/i18n/en.json index ee08612..f112d2e 100644 --- a/src/assets/i18n/en.json +++ b/src/assets/i18n/en.json @@ -28,6 +28,13 @@ "Evolution": "Evolution", "Slot": "Slot", "Current User": "Current User", + "Basic-Setting": "Basic-Setting", + "Ladder-Setting": "Ladder-Setting", + "Game-Setting": "Game-Setting", + "Evo-Setting": "Evo-Setting", + "Branch-Setting": "Branch-Setting", + "Indexing-Setting": "Indexing-Setting", + "Domain-Setting": "Domain-Setting", "Daily": "Daily", "Monthly": "Monthly", "Daily Partner": "Daily Partner", diff --git a/src/assets/i18n/ko.json b/src/assets/i18n/ko.json index c80298c..f5db970 100644 --- a/src/assets/i18n/ko.json +++ b/src/assets/i18n/ko.json @@ -34,6 +34,7 @@ "Evo-Setting": "에볼류션/보타 금액설정", "Branch-Setting": "대본벌 계좌 설정", "Indexing-Setting": "서버 인덱싱", + "Domain-Setting": "도메인 설정", "Daily": "일일현황", "Monthly": "월 현황", "report-management": "보고서관리",