menu added
This commit is contained in:
parent
b58711e254
commit
29313a6aff
|
@ -71,7 +71,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.SPORT_RESULT_MANAGEMENT.TITLE',
|
translate: 'NAV.SPORT_RESULT_MANAGEMENT.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/sport-result',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'sportMixManagement',
|
id: 'sportMixManagement',
|
||||||
|
@ -79,7 +79,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.SPORT_MIX_MANAGEMENT.TITLE',
|
translate: 'NAV.SPORT_MIX_MANAGEMENT.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/sport-mix',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'miniGame',
|
id: 'miniGame',
|
||||||
|
@ -87,7 +87,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.MINI_GAME.TITLE',
|
translate: 'NAV.MINI_GAME.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/mini-game',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'miniGameManagement',
|
id: 'miniGameManagement',
|
||||||
|
@ -95,7 +95,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.MINI_GAME_MANAGEMENT.TITLE',
|
translate: 'NAV.MINI_GAME_MANAGEMENT.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/mini-game-settings',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'excelRegist',
|
id: 'excelRegist',
|
||||||
|
@ -103,7 +103,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.EXCEL_REGIST.TITLE',
|
translate: 'NAV.EXCEL_REGIST.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/excel-regist',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'betHistory',
|
id: 'betHistory',
|
||||||
|
@ -111,7 +111,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.BET_HISTORY.TITLE',
|
translate: 'NAV.BET_HISTORY.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/bet-history',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'settlement',
|
id: 'settlement',
|
||||||
|
@ -119,7 +119,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.SETTLEMENT.TITLE',
|
translate: 'NAV.SETTLEMENT.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/settlement',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'itemManagement',
|
id: 'itemManagement',
|
||||||
|
@ -127,15 +127,15 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.ITEM_MANAGEMENT.TITLE',
|
translate: 'NAV.ITEM_MANAGEMENT.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/item-management',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'leagueManagement',
|
id: 'leagueManagement',
|
||||||
title: '종목관리',
|
title: '리그관리',
|
||||||
translate: 'NAV.LEAGUE_MANAGEMENT.TITLE',
|
translate: 'NAV.LEAGUE_MANAGEMENT.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management/league-management',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
id: 'exceptAutoRegist',
|
id: 'exceptAutoRegist',
|
||||||
|
@ -143,7 +143,7 @@ export const navigation: FuseNavigation[] = [
|
||||||
translate: 'NAV.EXCEPT_AUTO_REGIST.TITLE',
|
translate: 'NAV.EXCEPT_AUTO_REGIST.TITLE',
|
||||||
type: 'item',
|
type: 'item',
|
||||||
icon: 'email',
|
icon: 'email',
|
||||||
url: '/sample',
|
url: '/pages/games/management//except-auto-regist',
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
},
|
},
|
||||||
|
|
|
@ -0,0 +1,35 @@
|
||||||
|
<div id="orders" class="page-layout carded fullwidth inner-scroll">
|
||||||
|
|
||||||
|
<!-- TOP BACKGROUND -->
|
||||||
|
<div class="top-bg accent"></div>
|
||||||
|
<!-- / TOP BACKGROUND -->
|
||||||
|
|
||||||
|
<!-- CENTER -->
|
||||||
|
<div class="center">
|
||||||
|
|
||||||
|
<!-- HEADER -->
|
||||||
|
<div class="header accent" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row"
|
||||||
|
fxLayoutAlign.gt-xs="space-between center">
|
||||||
|
|
||||||
|
<!-- APP TITLE -->
|
||||||
|
<div class="logo mb-24 mb-sm-0" fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon class="logo-icon s-32 mr-16" [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
|
||||||
|
shopping_basket
|
||||||
|
</mat-icon>
|
||||||
|
<span class="logo-text h1" [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Orders</span>
|
||||||
|
</div>
|
||||||
|
<!-- / APP TITLE -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<div _ngcontent-yro-c52 class="content p-24">
|
||||||
|
<mat-button-toggle-group name="fontStyle" aria-label="Font Style">
|
||||||
|
<mat-button-toggle value="bold">Bold</mat-button-toggle>
|
||||||
|
<mat-button-toggle value="italic">Italic</mat-button-toggle>
|
||||||
|
<mat-button-toggle value="underline">Underline</mat-button-toggle>
|
||||||
|
</mat-button-toggle-group>
|
||||||
|
</div>
|
||||||
|
<div class="example-button-row">
|
||||||
|
<button mat-raised-button color="accent">Primary</button>
|
||||||
|
</div>
|
|
@ -0,0 +1,4 @@
|
||||||
|
.example-button-row button,
|
||||||
|
.example-button-row a {
|
||||||
|
margin-right: 8px;
|
||||||
|
}
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { ExcelRegistComponent } from './excel-regist.component';
|
||||||
|
|
||||||
|
describe('ExcelRegistComponent', () => {
|
||||||
|
let component: ExcelRegistComponent;
|
||||||
|
let fixture: ComponentFixture<ExcelRegistComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ ExcelRegistComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(ExcelRegistComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,15 @@
|
||||||
|
import { Component, OnInit } from '@angular/core';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-excel-regist',
|
||||||
|
templateUrl: './excel-regist.component.html',
|
||||||
|
styleUrls: ['./excel-regist.component.scss']
|
||||||
|
})
|
||||||
|
export class ExcelRegistComponent implements OnInit {
|
||||||
|
|
||||||
|
constructor() { }
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
13
src/app/pages/games/component/index.ts
Normal file
13
src/app/pages/games/component/index.ts
Normal file
|
@ -0,0 +1,13 @@
|
||||||
|
import { SportResultComponent } from './sport-result/sport-result.component';
|
||||||
|
import { SportMixComponent } from '../component/sport-mix/sport-mix.component';
|
||||||
|
import { MiniGameComponent } from '../component/mini-game/mini-game.component';
|
||||||
|
import { MiniGameSettingsComponent } from '../component/mini-game-settings/mini-game-settings.component';
|
||||||
|
import { ExcelRegistComponent } from '../component/excel-regist/excel-regist.component';
|
||||||
|
|
||||||
|
export const COMPONENTS = [
|
||||||
|
SportResultComponent,
|
||||||
|
SportMixComponent,
|
||||||
|
MiniGameComponent,
|
||||||
|
MiniGameSettingsComponent,
|
||||||
|
ExcelRegistComponent
|
||||||
|
];
|
|
@ -0,0 +1,121 @@
|
||||||
|
<div id="orders" class="page-layout carded fullwidth inner-scroll">
|
||||||
|
|
||||||
|
<!-- TOP BACKGROUND -->
|
||||||
|
<div class="top-bg accent"></div>
|
||||||
|
<!-- / TOP BACKGROUND -->
|
||||||
|
|
||||||
|
<!-- CENTER -->
|
||||||
|
<div class="center">
|
||||||
|
|
||||||
|
<!-- HEADER -->
|
||||||
|
<div class="header accent" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row"
|
||||||
|
fxLayoutAlign.gt-xs="space-between center">
|
||||||
|
|
||||||
|
<!-- APP TITLE -->
|
||||||
|
<div class="logo mb-24 mb-sm-0" fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon class="logo-icon s-32 mr-16" [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
|
||||||
|
shopping_basket
|
||||||
|
</mat-icon>
|
||||||
|
<span class="logo-text h1" [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Orders</span>
|
||||||
|
</div>
|
||||||
|
<!-- / APP TITLE -->
|
||||||
|
|
||||||
|
<!-- SEARCH -->
|
||||||
|
<div class="search-wrapper ml-sm-32">
|
||||||
|
<div class="search" fxFlex fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon>search</mat-icon>
|
||||||
|
<input #filter placeholder="Search for an order">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- / SEARCH -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / HEADER -->
|
||||||
|
|
||||||
|
<!-- CONTENT CARD -->
|
||||||
|
<div class="content-card">
|
||||||
|
|
||||||
|
<mat-table class="orders-table" matSort [@animateStagger]="{value:'50'}" fusePerfectScrollbar>
|
||||||
|
|
||||||
|
<!-- ID Column -->
|
||||||
|
<ng-container matColumnDef="id">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>ID</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">{{order.id}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Reference Column -->
|
||||||
|
<ng-container matColumnDef="reference">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Reference</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">{{order.reference}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Name Column -->
|
||||||
|
<ng-container matColumnDef="customer">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Customer</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.customer.firstName}}
|
||||||
|
{{order.customer.lastName}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Total Price Column -->
|
||||||
|
<ng-container matColumnDef="total">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-md>Total</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-md>
|
||||||
|
<p class="total-price text-truncate">
|
||||||
|
{{order.total | currency:'USD':'symbol'}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Payment Column -->
|
||||||
|
<ng-container matColumnDef="payment">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Payment</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.payment.method}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Status Column -->
|
||||||
|
<ng-container matColumnDef="status">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Status</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="status text-truncate h6 p-4" [ngClass]="order.status[0].color">
|
||||||
|
{{order.status[0].name}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Date Column -->
|
||||||
|
<ng-container matColumnDef="date">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Date</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.date}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<mat-header-row *matHeaderRowDef="displayedColumns; sticky:true"></mat-header-row>
|
||||||
|
|
||||||
|
<mat-row *matRowDef="let order; columns: displayedColumns;" class="order" matRipple
|
||||||
|
[routerLink]="'/apps/e-commerce/orders/'+order.id">
|
||||||
|
</mat-row>
|
||||||
|
</mat-table>
|
||||||
|
|
||||||
|
<mat-paginator #paginator [pageIndex]="0" [pageSize]="10" [pageSizeOptions]="[5, 10, 25, 100]">
|
||||||
|
</mat-paginator>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / CONTENT CARD -->
|
||||||
|
</div>
|
||||||
|
<!-- / CENTER -->
|
||||||
|
</div>
|
|
@ -0,0 +1,122 @@
|
||||||
|
@import "src/@fuse/scss/fuse";
|
||||||
|
|
||||||
|
e-commerce-orders {
|
||||||
|
|
||||||
|
#orders {
|
||||||
|
|
||||||
|
.top-bg {
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
height: 224px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .center {
|
||||||
|
|
||||||
|
> .header {
|
||||||
|
|
||||||
|
.search-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 480px;
|
||||||
|
border-radius: 28px;
|
||||||
|
overflow: hidden;
|
||||||
|
@include mat-elevation(1);
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
line-height: 48px;
|
||||||
|
padding: 0 18px;
|
||||||
|
|
||||||
|
input {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
min-height: 48px;
|
||||||
|
max-height: 48px;
|
||||||
|
padding: 0 16px;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
padding: 8px 0;
|
||||||
|
height: 160px !important;
|
||||||
|
min-height: 160px !important;
|
||||||
|
max-height: 160px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-tab-group,
|
||||||
|
.mat-tab-body-wrapper,
|
||||||
|
.tab-content {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orders-table {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
border-bottom: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
overflow: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
|
.mat-header-row {
|
||||||
|
min-height: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.order {
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-cell {
|
||||||
|
min-width: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-id {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-image {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
|
||||||
|
.product-image {
|
||||||
|
width: 52px;
|
||||||
|
height: 52px;
|
||||||
|
border: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-buttons {
|
||||||
|
flex: 0 1 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quantity-indicator {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 8px;
|
||||||
|
|
||||||
|
& + span {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-icon {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { MiniGameSettingsComponent } from './mini-game-settings.component';
|
||||||
|
|
||||||
|
describe('MiniGameSettingsComponent', () => {
|
||||||
|
let component: MiniGameSettingsComponent;
|
||||||
|
let fixture: ComponentFixture<MiniGameSettingsComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ MiniGameSettingsComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(MiniGameSettingsComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,58 @@
|
||||||
|
import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
|
||||||
|
import { MatPaginator } from '@angular/material/paginator';
|
||||||
|
import { MatSort } from '@angular/material/sort';
|
||||||
|
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
|
||||||
|
|
||||||
|
import { fuseAnimations } from 'src/@fuse/animations';
|
||||||
|
import { FuseUtils } from 'src/@fuse/utils';
|
||||||
|
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-mini-game-settings',
|
||||||
|
templateUrl: './mini-game-settings.component.html',
|
||||||
|
styleUrls: ['./mini-game-settings.component.scss'],
|
||||||
|
animations: fuseAnimations,
|
||||||
|
encapsulation: ViewEncapsulation.None
|
||||||
|
})
|
||||||
|
export class MiniGameSettingsComponent implements OnInit, OnDestroy {
|
||||||
|
|
||||||
|
displayedColumns = ['id', 'reference', 'customer', 'total', 'payment', 'status', 'date'];
|
||||||
|
|
||||||
|
@ViewChild(MatPaginator, { static: true })
|
||||||
|
paginator: MatPaginator;
|
||||||
|
|
||||||
|
@ViewChild('filter', { static: true })
|
||||||
|
filter: ElementRef;
|
||||||
|
|
||||||
|
@ViewChild(MatSort, { static: true })
|
||||||
|
sort: MatSort;
|
||||||
|
|
||||||
|
// Private
|
||||||
|
private _unsubscribeAll: Subject<any>;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this._unsubscribeAll = new Subject();
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
fromEvent(this.filter.nativeElement, 'keyup')
|
||||||
|
.pipe(
|
||||||
|
// takeUntil(this._unsubscribeAll),
|
||||||
|
// debounceTime(150),
|
||||||
|
// distinctUntilChanged()
|
||||||
|
)
|
||||||
|
.subscribe(() => {
|
||||||
|
// if (!this.dataSource) {
|
||||||
|
// return;
|
||||||
|
// }
|
||||||
|
// this.dataSource.filter = this.filter.nativeElement.value;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnDestroy(): void {
|
||||||
|
// Unsubscribe from all subscriptions
|
||||||
|
this._unsubscribeAll.next();
|
||||||
|
this._unsubscribeAll.complete();
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
121
src/app/pages/games/component/mini-game/mini-game.component.html
Normal file
121
src/app/pages/games/component/mini-game/mini-game.component.html
Normal file
|
@ -0,0 +1,121 @@
|
||||||
|
<div id="orders" class="page-layout carded fullwidth inner-scroll">
|
||||||
|
|
||||||
|
<!-- TOP BACKGROUND -->
|
||||||
|
<div class="top-bg accent"></div>
|
||||||
|
<!-- / TOP BACKGROUND -->
|
||||||
|
|
||||||
|
<!-- CENTER -->
|
||||||
|
<div class="center">
|
||||||
|
|
||||||
|
<!-- HEADER -->
|
||||||
|
<div class="header accent" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row"
|
||||||
|
fxLayoutAlign.gt-xs="space-between center">
|
||||||
|
|
||||||
|
<!-- APP TITLE -->
|
||||||
|
<div class="logo mb-24 mb-sm-0" fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon class="logo-icon s-32 mr-16" [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
|
||||||
|
shopping_basket
|
||||||
|
</mat-icon>
|
||||||
|
<span class="logo-text h1" [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Orders</span>
|
||||||
|
</div>
|
||||||
|
<!-- / APP TITLE -->
|
||||||
|
|
||||||
|
<!-- SEARCH -->
|
||||||
|
<div class="search-wrapper ml-sm-32">
|
||||||
|
<div class="search" fxFlex fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon>search</mat-icon>
|
||||||
|
<input #filter placeholder="Search for an order">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- / SEARCH -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / HEADER -->
|
||||||
|
|
||||||
|
<!-- CONTENT CARD -->
|
||||||
|
<div class="content-card">
|
||||||
|
|
||||||
|
<mat-table class="orders-table" matSort [@animateStagger]="{value:'50'}" fusePerfectScrollbar>
|
||||||
|
|
||||||
|
<!-- ID Column -->
|
||||||
|
<ng-container matColumnDef="id">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>ID</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">{{order.id}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Reference Column -->
|
||||||
|
<ng-container matColumnDef="reference">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Reference</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">{{order.reference}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Name Column -->
|
||||||
|
<ng-container matColumnDef="customer">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Customer</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.customer.firstName}}
|
||||||
|
{{order.customer.lastName}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Total Price Column -->
|
||||||
|
<ng-container matColumnDef="total">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-md>Total</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-md>
|
||||||
|
<p class="total-price text-truncate">
|
||||||
|
{{order.total | currency:'USD':'symbol'}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Payment Column -->
|
||||||
|
<ng-container matColumnDef="payment">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Payment</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.payment.method}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Status Column -->
|
||||||
|
<ng-container matColumnDef="status">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Status</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="status text-truncate h6 p-4" [ngClass]="order.status[0].color">
|
||||||
|
{{order.status[0].name}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Date Column -->
|
||||||
|
<ng-container matColumnDef="date">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Date</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.date}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<mat-header-row *matHeaderRowDef="displayedColumns; sticky:true"></mat-header-row>
|
||||||
|
|
||||||
|
<mat-row *matRowDef="let order; columns: displayedColumns;" class="order" matRipple
|
||||||
|
[routerLink]="'/apps/e-commerce/orders/'+order.id">
|
||||||
|
</mat-row>
|
||||||
|
</mat-table>
|
||||||
|
|
||||||
|
<mat-paginator #paginator [pageIndex]="0" [pageSize]="10" [pageSizeOptions]="[5, 10, 25, 100]">
|
||||||
|
</mat-paginator>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / CONTENT CARD -->
|
||||||
|
</div>
|
||||||
|
<!-- / CENTER -->
|
||||||
|
</div>
|
122
src/app/pages/games/component/mini-game/mini-game.component.scss
Normal file
122
src/app/pages/games/component/mini-game/mini-game.component.scss
Normal file
|
@ -0,0 +1,122 @@
|
||||||
|
@import "src/@fuse/scss/fuse";
|
||||||
|
|
||||||
|
e-commerce-orders {
|
||||||
|
|
||||||
|
#orders {
|
||||||
|
|
||||||
|
.top-bg {
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
height: 224px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .center {
|
||||||
|
|
||||||
|
> .header {
|
||||||
|
|
||||||
|
.search-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 480px;
|
||||||
|
border-radius: 28px;
|
||||||
|
overflow: hidden;
|
||||||
|
@include mat-elevation(1);
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
line-height: 48px;
|
||||||
|
padding: 0 18px;
|
||||||
|
|
||||||
|
input {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
min-height: 48px;
|
||||||
|
max-height: 48px;
|
||||||
|
padding: 0 16px;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
padding: 8px 0;
|
||||||
|
height: 160px !important;
|
||||||
|
min-height: 160px !important;
|
||||||
|
max-height: 160px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-tab-group,
|
||||||
|
.mat-tab-body-wrapper,
|
||||||
|
.tab-content {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orders-table {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
border-bottom: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
overflow: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
|
.mat-header-row {
|
||||||
|
min-height: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.order {
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-cell {
|
||||||
|
min-width: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-id {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-image {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
|
||||||
|
.product-image {
|
||||||
|
width: 52px;
|
||||||
|
height: 52px;
|
||||||
|
border: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-buttons {
|
||||||
|
flex: 0 1 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quantity-indicator {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 8px;
|
||||||
|
|
||||||
|
& + span {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-icon {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { MiniGameComponent } from './mini-game.component';
|
||||||
|
|
||||||
|
describe('MiniGameComponent', () => {
|
||||||
|
let component: MiniGameComponent;
|
||||||
|
let fixture: ComponentFixture<MiniGameComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ MiniGameComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(MiniGameComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,57 @@
|
||||||
|
import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
|
||||||
|
import { MatPaginator } from '@angular/material/paginator';
|
||||||
|
import { MatSort } from '@angular/material/sort';
|
||||||
|
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
|
||||||
|
|
||||||
|
import { fuseAnimations } from 'src/@fuse/animations';
|
||||||
|
import { FuseUtils } from 'src/@fuse/utils';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-mini-game',
|
||||||
|
templateUrl: './mini-game.component.html',
|
||||||
|
styleUrls: ['./mini-game.component.scss'],
|
||||||
|
animations: fuseAnimations,
|
||||||
|
encapsulation: ViewEncapsulation.None
|
||||||
|
})
|
||||||
|
export class MiniGameComponent implements OnInit, OnDestroy {
|
||||||
|
|
||||||
|
displayedColumns = ['id', 'reference', 'customer', 'total', 'payment', 'status', 'date'];
|
||||||
|
|
||||||
|
@ViewChild(MatPaginator, { static: true })
|
||||||
|
paginator: MatPaginator;
|
||||||
|
|
||||||
|
@ViewChild('filter', { static: true })
|
||||||
|
filter: ElementRef;
|
||||||
|
|
||||||
|
@ViewChild(MatSort, { static: true })
|
||||||
|
sort: MatSort;
|
||||||
|
|
||||||
|
// Private
|
||||||
|
private _unsubscribeAll: Subject<any>;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this._unsubscribeAll = new Subject();
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
fromEvent(this.filter.nativeElement, 'keyup')
|
||||||
|
.pipe(
|
||||||
|
// takeUntil(this._unsubscribeAll),
|
||||||
|
// debounceTime(150),
|
||||||
|
// distinctUntilChanged()
|
||||||
|
)
|
||||||
|
.subscribe(() => {
|
||||||
|
// if (!this.dataSource) {
|
||||||
|
// return;
|
||||||
|
// }
|
||||||
|
// this.dataSource.filter = this.filter.nativeElement.value;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnDestroy(): void {
|
||||||
|
// Unsubscribe from all subscriptions
|
||||||
|
this._unsubscribeAll.next();
|
||||||
|
this._unsubscribeAll.complete();
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
121
src/app/pages/games/component/sport-mix/sport-mix.component.html
Normal file
121
src/app/pages/games/component/sport-mix/sport-mix.component.html
Normal file
|
@ -0,0 +1,121 @@
|
||||||
|
<div id="orders" class="page-layout carded fullwidth inner-scroll">
|
||||||
|
|
||||||
|
<!-- TOP BACKGROUND -->
|
||||||
|
<div class="top-bg accent"></div>
|
||||||
|
<!-- / TOP BACKGROUND -->
|
||||||
|
|
||||||
|
<!-- CENTER -->
|
||||||
|
<div class="center">
|
||||||
|
|
||||||
|
<!-- HEADER -->
|
||||||
|
<div class="header accent" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row"
|
||||||
|
fxLayoutAlign.gt-xs="space-between center">
|
||||||
|
|
||||||
|
<!-- APP TITLE -->
|
||||||
|
<div class="logo mb-24 mb-sm-0" fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon class="logo-icon s-32 mr-16" [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
|
||||||
|
shopping_basket
|
||||||
|
</mat-icon>
|
||||||
|
<span class="logo-text h1" [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Orders</span>
|
||||||
|
</div>
|
||||||
|
<!-- / APP TITLE -->
|
||||||
|
|
||||||
|
<!-- SEARCH -->
|
||||||
|
<div class="search-wrapper ml-sm-32">
|
||||||
|
<div class="search" fxFlex fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon>search</mat-icon>
|
||||||
|
<input #filter placeholder="Search for an order">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- / SEARCH -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / HEADER -->
|
||||||
|
|
||||||
|
<!-- CONTENT CARD -->
|
||||||
|
<div class="content-card">
|
||||||
|
|
||||||
|
<mat-table class="orders-table" matSort [@animateStagger]="{value:'50'}" fusePerfectScrollbar>
|
||||||
|
|
||||||
|
<!-- ID Column -->
|
||||||
|
<ng-container matColumnDef="id">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>ID</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">{{order.id}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Reference Column -->
|
||||||
|
<ng-container matColumnDef="reference">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Reference</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">{{order.reference}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Name Column -->
|
||||||
|
<ng-container matColumnDef="customer">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Customer</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.customer.firstName}}
|
||||||
|
{{order.customer.lastName}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Total Price Column -->
|
||||||
|
<ng-container matColumnDef="total">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-md>Total</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-md>
|
||||||
|
<p class="total-price text-truncate">
|
||||||
|
{{order.total | currency:'USD':'symbol'}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Payment Column -->
|
||||||
|
<ng-container matColumnDef="payment">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Payment</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.payment.method}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Status Column -->
|
||||||
|
<ng-container matColumnDef="status">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Status</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="status text-truncate h6 p-4" [ngClass]="order.status[0].color">
|
||||||
|
{{order.status[0].name}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Date Column -->
|
||||||
|
<ng-container matColumnDef="date">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Date</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.date}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<mat-header-row *matHeaderRowDef="displayedColumns; sticky:true"></mat-header-row>
|
||||||
|
|
||||||
|
<mat-row *matRowDef="let order; columns: displayedColumns;" class="order" matRipple
|
||||||
|
[routerLink]="'/apps/e-commerce/orders/'+order.id">
|
||||||
|
</mat-row>
|
||||||
|
</mat-table>
|
||||||
|
|
||||||
|
<mat-paginator #paginator [pageIndex]="0" [pageSize]="10" [pageSizeOptions]="[5, 10, 25, 100]">
|
||||||
|
</mat-paginator>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / CONTENT CARD -->
|
||||||
|
</div>
|
||||||
|
<!-- / CENTER -->
|
||||||
|
</div>
|
122
src/app/pages/games/component/sport-mix/sport-mix.component.scss
Normal file
122
src/app/pages/games/component/sport-mix/sport-mix.component.scss
Normal file
|
@ -0,0 +1,122 @@
|
||||||
|
@import "src/@fuse/scss/fuse";
|
||||||
|
|
||||||
|
e-commerce-orders {
|
||||||
|
|
||||||
|
#orders {
|
||||||
|
|
||||||
|
.top-bg {
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
height: 224px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .center {
|
||||||
|
|
||||||
|
> .header {
|
||||||
|
|
||||||
|
.search-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 480px;
|
||||||
|
border-radius: 28px;
|
||||||
|
overflow: hidden;
|
||||||
|
@include mat-elevation(1);
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
line-height: 48px;
|
||||||
|
padding: 0 18px;
|
||||||
|
|
||||||
|
input {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
min-height: 48px;
|
||||||
|
max-height: 48px;
|
||||||
|
padding: 0 16px;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
padding: 8px 0;
|
||||||
|
height: 160px !important;
|
||||||
|
min-height: 160px !important;
|
||||||
|
max-height: 160px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-tab-group,
|
||||||
|
.mat-tab-body-wrapper,
|
||||||
|
.tab-content {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orders-table {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
border-bottom: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
overflow: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
|
.mat-header-row {
|
||||||
|
min-height: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.order {
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-cell {
|
||||||
|
min-width: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-id {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-image {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
|
||||||
|
.product-image {
|
||||||
|
width: 52px;
|
||||||
|
height: 52px;
|
||||||
|
border: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-buttons {
|
||||||
|
flex: 0 1 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quantity-indicator {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 8px;
|
||||||
|
|
||||||
|
& + span {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-icon {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { SportMixComponent } from './sport-mix.component';
|
||||||
|
|
||||||
|
describe('SportMixComponent', () => {
|
||||||
|
let component: SportMixComponent;
|
||||||
|
let fixture: ComponentFixture<SportMixComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ SportMixComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(SportMixComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,57 @@
|
||||||
|
import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
|
||||||
|
import { MatPaginator } from '@angular/material/paginator';
|
||||||
|
import { MatSort } from '@angular/material/sort';
|
||||||
|
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
|
||||||
|
|
||||||
|
import { fuseAnimations } from 'src/@fuse/animations';
|
||||||
|
import { FuseUtils } from 'src/@fuse/utils';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-sport-mix',
|
||||||
|
templateUrl: './sport-mix.component.html',
|
||||||
|
styleUrls: ['./sport-mix.component.scss'],
|
||||||
|
animations: fuseAnimations,
|
||||||
|
encapsulation: ViewEncapsulation.None
|
||||||
|
})
|
||||||
|
export class SportMixComponent implements OnInit, OnDestroy {
|
||||||
|
|
||||||
|
displayedColumns = ['id', 'reference', 'customer', 'total', 'payment', 'status', 'date'];
|
||||||
|
|
||||||
|
@ViewChild(MatPaginator, { static: true })
|
||||||
|
paginator: MatPaginator;
|
||||||
|
|
||||||
|
@ViewChild('filter', { static: true })
|
||||||
|
filter: ElementRef;
|
||||||
|
|
||||||
|
@ViewChild(MatSort, { static: true })
|
||||||
|
sort: MatSort;
|
||||||
|
|
||||||
|
// Private
|
||||||
|
private _unsubscribeAll: Subject<any>;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this._unsubscribeAll = new Subject();
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
fromEvent(this.filter.nativeElement, 'keyup')
|
||||||
|
.pipe(
|
||||||
|
// takeUntil(this._unsubscribeAll),
|
||||||
|
// debounceTime(150),
|
||||||
|
// distinctUntilChanged()
|
||||||
|
)
|
||||||
|
.subscribe(() => {
|
||||||
|
// if (!this.dataSource) {
|
||||||
|
// return;
|
||||||
|
// }
|
||||||
|
// this.dataSource.filter = this.filter.nativeElement.value;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnDestroy(): void {
|
||||||
|
// Unsubscribe from all subscriptions
|
||||||
|
this._unsubscribeAll.next();
|
||||||
|
this._unsubscribeAll.complete();
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
|
@ -0,0 +1,121 @@
|
||||||
|
<div id="orders" class="page-layout carded fullwidth inner-scroll">
|
||||||
|
|
||||||
|
<!-- TOP BACKGROUND -->
|
||||||
|
<div class="top-bg accent"></div>
|
||||||
|
<!-- / TOP BACKGROUND -->
|
||||||
|
|
||||||
|
<!-- CENTER -->
|
||||||
|
<div class="center">
|
||||||
|
|
||||||
|
<!-- HEADER -->
|
||||||
|
<div class="header accent" fxLayout="column" fxLayoutAlign="center center" fxLayout.gt-xs="row"
|
||||||
|
fxLayoutAlign.gt-xs="space-between center">
|
||||||
|
|
||||||
|
<!-- APP TITLE -->
|
||||||
|
<div class="logo mb-24 mb-sm-0" fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon class="logo-icon s-32 mr-16" [@animate]="{value:'*',params:{delay:'50ms',scale:'0.2'}}">
|
||||||
|
shopping_basket
|
||||||
|
</mat-icon>
|
||||||
|
<span class="logo-text h1" [@animate]="{value:'*',params:{delay:'100ms',x:'-25px'}}">Orders</span>
|
||||||
|
</div>
|
||||||
|
<!-- / APP TITLE -->
|
||||||
|
|
||||||
|
<!-- SEARCH -->
|
||||||
|
<div class="search-wrapper ml-sm-32">
|
||||||
|
<div class="search" fxFlex fxLayout="row" fxLayoutAlign="start center">
|
||||||
|
<mat-icon>search</mat-icon>
|
||||||
|
<input #filter placeholder="Search for an order">
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<!-- / SEARCH -->
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / HEADER -->
|
||||||
|
|
||||||
|
<!-- CONTENT CARD -->
|
||||||
|
<div class="content-card">
|
||||||
|
|
||||||
|
<mat-table class="orders-table" matSort [@animateStagger]="{value:'50'}" fusePerfectScrollbar>
|
||||||
|
|
||||||
|
<!-- ID Column -->
|
||||||
|
<ng-container matColumnDef="id">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>ID</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">{{order.id}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Reference Column -->
|
||||||
|
<ng-container matColumnDef="reference">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Reference</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">{{order.reference}}</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Name Column -->
|
||||||
|
<ng-container matColumnDef="customer">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Customer</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.customer.firstName}}
|
||||||
|
{{order.customer.lastName}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Total Price Column -->
|
||||||
|
<ng-container matColumnDef="total">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-md>Total</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-md>
|
||||||
|
<p class="total-price text-truncate">
|
||||||
|
{{order.total | currency:'USD':'symbol'}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Payment Column -->
|
||||||
|
<ng-container matColumnDef="payment">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Payment</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.payment.method}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Status Column -->
|
||||||
|
<ng-container matColumnDef="status">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header>Status</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order">
|
||||||
|
<p class="status text-truncate h6 p-4" [ngClass]="order.status[0].color">
|
||||||
|
{{order.status[0].name}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<!-- Date Column -->
|
||||||
|
<ng-container matColumnDef="date">
|
||||||
|
<mat-header-cell *matHeaderCellDef mat-sort-header fxHide fxShow.gt-sm>Date</mat-header-cell>
|
||||||
|
<mat-cell *matCellDef="let order" fxHide fxShow.gt-sm>
|
||||||
|
<p class="text-truncate">
|
||||||
|
{{order.date}}
|
||||||
|
</p>
|
||||||
|
</mat-cell>
|
||||||
|
</ng-container>
|
||||||
|
|
||||||
|
<mat-header-row *matHeaderRowDef="displayedColumns; sticky:true"></mat-header-row>
|
||||||
|
|
||||||
|
<mat-row *matRowDef="let order; columns: displayedColumns;" class="order" matRipple
|
||||||
|
[routerLink]="'/apps/e-commerce/orders/'+order.id">
|
||||||
|
</mat-row>
|
||||||
|
</mat-table>
|
||||||
|
|
||||||
|
<mat-paginator #paginator [pageIndex]="0" [pageSize]="10" [pageSizeOptions]="[5, 10, 25, 100]">
|
||||||
|
</mat-paginator>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<!-- / CONTENT CARD -->
|
||||||
|
</div>
|
||||||
|
<!-- / CENTER -->
|
||||||
|
</div>
|
|
@ -0,0 +1,122 @@
|
||||||
|
@import "src/@fuse/scss/fuse";
|
||||||
|
|
||||||
|
e-commerce-orders {
|
||||||
|
|
||||||
|
#orders {
|
||||||
|
|
||||||
|
.top-bg {
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
height: 224px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
> .center {
|
||||||
|
|
||||||
|
> .header {
|
||||||
|
|
||||||
|
.search-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
max-width: 480px;
|
||||||
|
border-radius: 28px;
|
||||||
|
overflow: hidden;
|
||||||
|
@include mat-elevation(1);
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
line-height: 48px;
|
||||||
|
padding: 0 18px;
|
||||||
|
|
||||||
|
input {
|
||||||
|
width: 100%;
|
||||||
|
height: 48px;
|
||||||
|
min-height: 48px;
|
||||||
|
max-height: 48px;
|
||||||
|
padding: 0 16px;
|
||||||
|
border: none;
|
||||||
|
outline: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
@include media-breakpoint('xs') {
|
||||||
|
padding: 8px 0;
|
||||||
|
height: 160px !important;
|
||||||
|
min-height: 160px !important;
|
||||||
|
max-height: 160px !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-tab-group,
|
||||||
|
.mat-tab-body-wrapper,
|
||||||
|
.tab-content {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.orders-table {
|
||||||
|
flex: 1 1 auto;
|
||||||
|
border-bottom: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
overflow: auto;
|
||||||
|
-webkit-overflow-scrolling: touch;
|
||||||
|
|
||||||
|
.mat-header-row {
|
||||||
|
min-height: 64px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.order {
|
||||||
|
position: relative;
|
||||||
|
cursor: pointer;
|
||||||
|
height: 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-cell {
|
||||||
|
min-width: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-id {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-image {
|
||||||
|
flex: 0 1 84px;
|
||||||
|
|
||||||
|
.product-image {
|
||||||
|
width: 52px;
|
||||||
|
height: 52px;
|
||||||
|
border: 1px solid rgba(0, 0, 0, .12);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mat-column-buttons {
|
||||||
|
flex: 0 1 80px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.quantity-indicator {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
width: 8px;
|
||||||
|
height: 8px;
|
||||||
|
border-radius: 4px;
|
||||||
|
margin-right: 8px;
|
||||||
|
|
||||||
|
& + span {
|
||||||
|
display: inline-block;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.active-icon {
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
|
@ -0,0 +1,25 @@
|
||||||
|
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||||
|
|
||||||
|
import { SportResultComponent } from './sport-result.component';
|
||||||
|
|
||||||
|
describe('SportResultComponent', () => {
|
||||||
|
let component: SportResultComponent;
|
||||||
|
let fixture: ComponentFixture<SportResultComponent>;
|
||||||
|
|
||||||
|
beforeEach(async(() => {
|
||||||
|
TestBed.configureTestingModule({
|
||||||
|
declarations: [ SportResultComponent ]
|
||||||
|
})
|
||||||
|
.compileComponents();
|
||||||
|
}));
|
||||||
|
|
||||||
|
beforeEach(() => {
|
||||||
|
fixture = TestBed.createComponent(SportResultComponent);
|
||||||
|
component = fixture.componentInstance;
|
||||||
|
fixture.detectChanges();
|
||||||
|
});
|
||||||
|
|
||||||
|
it('should create', () => {
|
||||||
|
expect(component).toBeTruthy();
|
||||||
|
});
|
||||||
|
});
|
|
@ -0,0 +1,56 @@
|
||||||
|
import { Component, ElementRef, OnDestroy, OnInit, ViewChild, ViewEncapsulation } from '@angular/core';
|
||||||
|
import { MatPaginator } from '@angular/material/paginator';
|
||||||
|
import { MatSort } from '@angular/material/sort';
|
||||||
|
import { BehaviorSubject, fromEvent, merge, Observable, Subject } from 'rxjs';
|
||||||
|
|
||||||
|
import { fuseAnimations } from 'src/@fuse/animations';
|
||||||
|
import { FuseUtils } from 'src/@fuse/utils';
|
||||||
|
|
||||||
|
@Component({
|
||||||
|
selector: 'app-sport-result',
|
||||||
|
templateUrl: './sport-result.component.html',
|
||||||
|
styleUrls: ['./sport-result.component.scss'],
|
||||||
|
animations: fuseAnimations,
|
||||||
|
encapsulation: ViewEncapsulation.None
|
||||||
|
})
|
||||||
|
export class SportResultComponent implements OnInit, OnDestroy {
|
||||||
|
|
||||||
|
displayedColumns = ['id', 'reference', 'customer', 'total', 'payment', 'status', 'date'];
|
||||||
|
|
||||||
|
@ViewChild(MatPaginator, { static: true })
|
||||||
|
paginator: MatPaginator;
|
||||||
|
|
||||||
|
@ViewChild('filter', { static: true })
|
||||||
|
filter: ElementRef;
|
||||||
|
|
||||||
|
@ViewChild(MatSort, { static: true })
|
||||||
|
sort: MatSort;
|
||||||
|
|
||||||
|
// Private
|
||||||
|
private _unsubscribeAll: Subject<any>;
|
||||||
|
|
||||||
|
constructor() {
|
||||||
|
this._unsubscribeAll = new Subject();
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnInit() {
|
||||||
|
fromEvent(this.filter.nativeElement, 'keyup')
|
||||||
|
.pipe(
|
||||||
|
// takeUntil(this._unsubscribeAll),
|
||||||
|
// debounceTime(150),
|
||||||
|
// distinctUntilChanged()
|
||||||
|
)
|
||||||
|
.subscribe(() => {
|
||||||
|
// if (!this.dataSource) {
|
||||||
|
// return;
|
||||||
|
// }
|
||||||
|
// this.dataSource.filter = this.filter.nativeElement.value;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
ngOnDestroy(): void {
|
||||||
|
// Unsubscribe from all subscriptions
|
||||||
|
this._unsubscribeAll.next();
|
||||||
|
this._unsubscribeAll.complete();
|
||||||
|
}
|
||||||
|
}
|
15
src/app/pages/games/games-routing.module.ts
Normal file
15
src/app/pages/games/games-routing.module.ts
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { Routes, RouterModule } from '@angular/router';
|
||||||
|
|
||||||
|
const routes: Routes = [
|
||||||
|
{
|
||||||
|
path: 'management',
|
||||||
|
loadChildren: './manage/manage.module#ManageModule'
|
||||||
|
}
|
||||||
|
];
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
imports: [RouterModule.forChild(routes)],
|
||||||
|
exports: [RouterModule]
|
||||||
|
})
|
||||||
|
export class GamesRoutingModule { }
|
15
src/app/pages/games/games.module.ts
Normal file
15
src/app/pages/games/games.module.ts
Normal file
|
@ -0,0 +1,15 @@
|
||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { FuseSharedModule } from 'src/@fuse/shared.module';
|
||||||
|
import { GamesRoutingModule } from './games-routing.module';
|
||||||
|
import { MiniGameSettingsComponent } from './component/mini-game-settings/mini-game-settings.component';
|
||||||
|
import { ExcelRegistComponent } from './component/excel-regist/excel-regist.component';
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
|
||||||
|
imports: [
|
||||||
|
FuseSharedModule,
|
||||||
|
GamesRoutingModule
|
||||||
|
],
|
||||||
|
|
||||||
|
})
|
||||||
|
export class GamesModule { }
|
54
src/app/pages/games/manage/manage-routing.module.ts
Normal file
54
src/app/pages/games/manage/manage-routing.module.ts
Normal file
|
@ -0,0 +1,54 @@
|
||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
import { Routes, RouterModule } from '@angular/router';
|
||||||
|
import { SportResultComponent } from '../component/sport-result/sport-result.component';
|
||||||
|
import { SportMixComponent } from '../component/sport-mix/sport-mix.component';
|
||||||
|
import { MiniGameComponent } from '../component/mini-game/mini-game.component';
|
||||||
|
import { MiniGameSettingsComponent } from '../component/mini-game-settings/mini-game-settings.component';
|
||||||
|
import { ExcelRegistComponent } from '../component/excel-regist/excel-regist.component';
|
||||||
|
|
||||||
|
const routes: Routes = [
|
||||||
|
|
||||||
|
{
|
||||||
|
path: 'sport-result',
|
||||||
|
component: SportResultComponent,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'sport-mix',
|
||||||
|
component: SportMixComponent
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'mini-game',
|
||||||
|
component: MiniGameComponent
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'mini-game-settings',
|
||||||
|
component: MiniGameSettingsComponent
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'excel-regist',
|
||||||
|
component: ExcelRegistComponent
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// path: 'connect',
|
||||||
|
// component: UserConnectComponent
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// path: 'regist',
|
||||||
|
// component: UserRegistComponent
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// path: 'fees',
|
||||||
|
// component: UserFeesComponent
|
||||||
|
// }
|
||||||
|
// ,
|
||||||
|
// {
|
||||||
|
// path: 'attendance',
|
||||||
|
// component: UserAttendanceComponent
|
||||||
|
// }
|
||||||
|
];
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
imports: [RouterModule.forChild(routes)],
|
||||||
|
exports: [RouterModule]
|
||||||
|
})
|
||||||
|
export class ManageRoutingModule { }
|
64
src/app/pages/games/manage/manage.module.ts
Normal file
64
src/app/pages/games/manage/manage.module.ts
Normal file
|
@ -0,0 +1,64 @@
|
||||||
|
import { NgModule } from '@angular/core';
|
||||||
|
|
||||||
|
import { MatButtonModule } from '@angular/material/button';
|
||||||
|
import { MatButtonToggleModule } from '@angular/material/button-toggle';
|
||||||
|
import { MatChipsModule } from '@angular/material/chips';
|
||||||
|
import { MatRippleModule } from '@angular/material/core';
|
||||||
|
import { MatExpansionModule } from '@angular/material/expansion';
|
||||||
|
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 { MatSelectModule } from '@angular/material/select';
|
||||||
|
import { MatSnackBarModule } from '@angular/material/snack-bar';
|
||||||
|
import { MatSortModule } from '@angular/material/sort';
|
||||||
|
import { MatTableModule } from '@angular/material/table';
|
||||||
|
import { MatTabsModule } from '@angular/material/tabs';
|
||||||
|
import { MatDatepickerModule } from '@angular/material/datepicker';
|
||||||
|
import { MatDialogModule } from '@angular/material/dialog';
|
||||||
|
import { MatToolbarModule } from '@angular/material/toolbar';
|
||||||
|
import { MatTooltipModule } from '@angular/material/tooltip';
|
||||||
|
import { CalendarModule as AngularCalendarModule, DateAdapter } from 'angular-calendar';
|
||||||
|
|
||||||
|
import { FuseSharedModule } from 'src/@fuse/shared.module';
|
||||||
|
import { ManageRoutingModule } from './manage-routing.module';
|
||||||
|
import { COMPONENTS } from '../component';
|
||||||
|
|
||||||
|
import { MatStepperModule } from '@angular/material/stepper';
|
||||||
|
|
||||||
|
import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';
|
||||||
|
|
||||||
|
@NgModule({
|
||||||
|
imports: [
|
||||||
|
MatButtonModule,
|
||||||
|
MatButtonToggleModule,
|
||||||
|
MatDatepickerModule,
|
||||||
|
MatDialogModule,
|
||||||
|
MatChipsModule,
|
||||||
|
MatExpansionModule,
|
||||||
|
MatFormFieldModule,
|
||||||
|
MatIconModule,
|
||||||
|
MatInputModule,
|
||||||
|
MatPaginatorModule,
|
||||||
|
MatRippleModule,
|
||||||
|
MatSelectModule,
|
||||||
|
MatSortModule,
|
||||||
|
MatSnackBarModule,
|
||||||
|
MatTableModule,
|
||||||
|
MatTabsModule,
|
||||||
|
MatStepperModule,
|
||||||
|
MatToolbarModule,
|
||||||
|
MatTooltipModule,
|
||||||
|
|
||||||
|
AngularCalendarModule.forRoot({
|
||||||
|
provide: DateAdapter,
|
||||||
|
useFactory: adapterFactory
|
||||||
|
}),
|
||||||
|
|
||||||
|
FuseSharedModule,
|
||||||
|
ManageRoutingModule
|
||||||
|
|
||||||
|
],
|
||||||
|
declarations: [...COMPONENTS],
|
||||||
|
})
|
||||||
|
export class ManageModule { }
|
|
@ -5,6 +5,10 @@ const routes: Routes = [
|
||||||
{
|
{
|
||||||
path: 'users',
|
path: 'users',
|
||||||
loadChildren: './users/users.module#UsersModule'
|
loadChildren: './users/users.module#UsersModule'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
path: 'games',
|
||||||
|
loadChildren: './games/games.module#GamesModule'
|
||||||
}
|
}
|
||||||
];
|
];
|
||||||
|
|
||||||
|
|
|
@ -22,10 +22,7 @@ import { CalendarModule as AngularCalendarModule, DateAdapter } from 'angular-ca
|
||||||
import { FuseSharedModule } from 'src/@fuse/shared.module';
|
import { FuseSharedModule } from 'src/@fuse/shared.module';
|
||||||
import { UserRoutingModule } from './user-routing.module';
|
import { UserRoutingModule } from './user-routing.module';
|
||||||
import { COMPONENTS } from './component';
|
import { COMPONENTS } from './component';
|
||||||
import { UserRegistComponent } from './component/user-regist/user-regist.component';
|
|
||||||
import { MatStepperModule } from '@angular/material/stepper';
|
import { MatStepperModule } from '@angular/material/stepper';
|
||||||
import { UserFeesComponent } from './component/user-fees/user-fees.component';
|
|
||||||
import { UserAttendanceComponent } from './component/user-attendance/user-attendance.component';
|
|
||||||
|
|
||||||
import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';
|
import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';
|
||||||
|
|
||||||
|
@ -59,7 +56,7 @@ import { adapterFactory } from 'angular-calendar/date-adapters/date-fns';
|
||||||
|
|
||||||
UserRoutingModule
|
UserRoutingModule
|
||||||
],
|
],
|
||||||
declarations: [...COMPONENTS, UserRegistComponent, UserFeesComponent, UserAttendanceComponent],
|
declarations: [...COMPONENTS],
|
||||||
|
|
||||||
})
|
})
|
||||||
export class UserModule { }
|
export class UserModule { }
|
||||||
|
|
Loading…
Reference in New Issue
Block a user