diff --git a/src/app/modules/admin/report/loosing/components/index.ts b/src/app/modules/admin/report/loosing/components/index.ts index 04759eb..4e9e32b 100644 --- a/src/app/modules/admin/report/loosing/components/index.ts +++ b/src/app/modules/admin/report/loosing/components/index.ts @@ -1,3 +1,4 @@ import { ListComponent } from './list.component'; +import { ViewComponent } from './view.component'; -export const COMPONENTS = [ListComponent]; +export const COMPONENTS = [ListComponent, ViewComponent]; diff --git a/src/app/modules/admin/report/loosing/components/list.component.html b/src/app/modules/admin/report/loosing/components/list.component.html index cb999c1..cc5cb7b 100644 --- a/src/app/modules/admin/report/loosing/components/list.component.html +++ b/src/app/modules/admin/report/loosing/components/list.component.html @@ -123,6 +123,7 @@ mat-flat-button class="bet-mat-small-8" [color]="'primary'" + (click)="__viewLoosingDetail(info.id)" > 상세보기 상세보기 삭제 삭제!', + icon: this._formBuilder.group({ + show: true, + name: 'heroicons_outline:exclamation', + color: 'warn', + }), + actions: this._formBuilder.group({ + confirm: this._formBuilder.group({ + show: true, + label: '삭제', + color: 'warn', + }), + cancel: this._formBuilder.group({ + show: true, + label: '취소', + }), + }), + dismissible: true, + }); // Get the products this._loosingService.loosings$ .pipe(takeUntil(this._unsubscribeAll)) @@ -138,6 +164,20 @@ export class ListComponent implements OnInit, AfterViewInit, OnDestroy { // @ Private methods // ----------------------------------------------------------------------------------------------------- + __viewLoosingDetail(loosing: Loosing): void { + let url: string = 'report/loosing/' + loosing.id; + this.router.navigateByUrl(url); + } + + __onClickRemoveBtn(event: MouseEvent, id: string): void { + // Open the dialog and save the reference of it + const dialogRef = this._fuseConfirmationService.open(this.configForm.value); + + // Subscribe to afterClosed from the dialog reference + dialogRef.afterClosed().subscribe((result) => { + console.log(result); + }); + } /** * Create product */ diff --git a/src/app/modules/admin/report/loosing/components/view.component.html b/src/app/modules/admin/report/loosing/components/view.component.html new file mode 100644 index 0000000..cda689c --- /dev/null +++ b/src/app/modules/admin/report/loosing/components/view.component.html @@ -0,0 +1,189 @@ +
+
+
+
+ +
+
+ 기본데이터 +
+ + +
+ +
+ + + + + +
+ +
+ + + + + +
+ +
+ + + +
+
+ +
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
번호 + + {{ i + 1 }} + + 시작일 + + {{ info.startDate }} + + 종료일 + + {{ info.endDate }} + + + 기본데이터 + + {{ + info.defaultCount + }} + + + + 루징데이터 + + {{ + info.loosingCount + }} + + + 삭제 + +
+
+
+
+
+
+
diff --git a/src/app/modules/admin/report/loosing/components/view.component.ts b/src/app/modules/admin/report/loosing/components/view.component.ts new file mode 100644 index 0000000..ebaeeb7 --- /dev/null +++ b/src/app/modules/admin/report/loosing/components/view.component.ts @@ -0,0 +1,162 @@ +import { + AfterViewInit, + ChangeDetectionStrategy, + ChangeDetectorRef, + Component, + OnDestroy, + OnInit, + ViewChild, + ViewEncapsulation, +} from '@angular/core'; + +import { MatPaginator } from '@angular/material/paginator'; +import { MatSort } from '@angular/material/sort'; +import { map, merge, Observable, Subject, switchMap, takeUntil } from 'rxjs'; +import { fuseAnimations } from '@fuse/animations'; +import { FuseConfirmationService } from '@fuse/services/confirmation'; + +import { Loosing } from '../models/loosing'; + +import { LoosingService } from '../services/loosing.service'; +import { Router } from '@angular/router'; +import { MatTableDataSource } from '@angular/material/table'; + +@Component({ + selector: 'loosing-view', + templateUrl: './view.component.html', + styles: [ + /* language=SCSS */ + ` + .inventory-grid { + grid-template-columns: 60px auto 40px; + + @screen sm { + grid-template-columns: 40px 70px 70px 70px 70px 100px; + } + + @screen md { + grid-template-columns: 40px 70px 70px 70px 70px 100px; + } + + @screen lg { + grid-template-columns: 40px 70px 70px 70px 70px 100px; + } + } + `, + ], + 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; + + loosings$!: Observable; + + isLoading = false; + + loosingDataSource: MatTableDataSource = new MatTableDataSource(); + + private _unsubscribeAll: Subject = new Subject(); + + headerTableColumns: string[] = [ + 'index', + 'startDate', + 'endDate', + 'defaultDataTotalCount', + 'loosingDataTotalCount', + 'removeBtn', + ]; + + displayedTableColumns: string[] = [ + 'index', + 'startDate', + 'endDate', + 'defaultDataTotalCount', + 'defaultDataViewBtn', + 'loosingDataTotalCount', + 'loosingDataViewBtn', + 'removeBtn', + ]; + + /** + * Constructor + */ + constructor( + private _changeDetectorRef: ChangeDetectorRef, + private _fuseConfirmationService: FuseConfirmationService, + private _loosingService: LoosingService, + private router: Router + ) {} + + // ----------------------------------------------------------------------------------------------------- + // @ Lifecycle hooks + // ----------------------------------------------------------------------------------------------------- + + /** + * On init + */ + ngOnInit(): void { + // Get the products + this._loosingService.loosings$ + .pipe(takeUntil(this._unsubscribeAll)) + .subscribe((loosings: Loosing[] | undefined) => { + if (!loosings) { + return; + } + + this.loosingDataSource.data = loosings; + // 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 + // ----------------------------------------------------------------------------------------------------- + + /* viewUserDetail(id: string): void { + let url: string = 'member/user/' + id; + this.router.navigateByUrl(url); + } */ + // ----------------------------------------------------------------------------------------------------- + // @ 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/report/loosing/loosing.routing.ts b/src/app/modules/admin/report/loosing/loosing.routing.ts index c20ec61..92c7c01 100644 --- a/src/app/modules/admin/report/loosing/loosing.routing.ts +++ b/src/app/modules/admin/report/loosing/loosing.routing.ts @@ -1,10 +1,12 @@ import { Route } from '@angular/router'; import { ListComponent } from './components/list.component'; -import { ViewComponent } from '../../member/user/components/view.component'; +import { ViewComponent } from './components/view.component'; -import { LoosingsResolver } from './resolvers/loosing.resolver'; -import { UserResolver } from '../../member/user/resolvers/user.resolver'; +import { + LoosingsResolver, + LoosingResolver, +} from './resolvers/loosing.resolver'; export const loosingRoutes: Route[] = [ { @@ -18,7 +20,7 @@ export const loosingRoutes: Route[] = [ path: ':id', component: ViewComponent, resolve: { - users: UserResolver, + loosing: LoosingResolver, }, }, ];