Skip to content

Ajit Thakor / bo-livebillionbet-ui

Go to a project
Commit 6f390879 by Ajit Thakor
Options

Added ui for manage affiliates

1 parent 896e0975
Expand all
Inline Side-by-side
Showing with 643 additions and 43 deletions
src/app/app.component.spec.ts deleted 100644 → 0
describe('App: Primer', () => {
it('should expect true to be true', () => {
expect(true).toBe(true);
});
});
src/app/components/affiliates/affiliates.module.ts
import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common';
import { MatInputModule, MatExpansionModule,MatDatepickerModule,MatNativeDateModule,MatSelectModule,MatButtonModule,MatButtonToggleModule } from '@angular/material';
import { MatRadioModule,MatTooltipModule,MatCardModule,MatToolbarModule, MatTabsModule, MatSlideToggleModule, MatIconModule, MatInputModule, MatExpansionModule, MatDatepickerModule, MatNativeDateModule, MatSelectModule, MatButtonModule, MatButtonToggleModule } from '@angular/material';
import { NgxDatatableModule } from '@swimlane/ngx-datatable';
import { AffiliateRoutes } from './affiliates.routing';
import { ViewAffiliateComponent } from './view-affiliates/view-affiliate.component';
import { DeleteDialogComponent } from './delete-dialog/delete-dialog.component';
import { EditDialogComponent } from './edit-dialog/edit-dialog.component';
@NgModule({
......@@ -18,10 +20,23 @@ import { ViewAffiliateComponent } from './view-affiliates/view-affiliate.compone
MatNativeDateModule,
MatSelectModule,
MatButtonModule,
MatButtonToggleModule
MatButtonToggleModule,
MatIconModule,
MatSlideToggleModule,
MatToolbarModule,
MatTabsModule,
MatCardModule,
MatTooltipModule,
MatRadioModule
],
declarations: [
ViewAffiliateComponent,
EditDialogComponent,
DeleteDialogComponent
],
entryComponents: [
EditDialogComponent,
DeleteDialogComponent
]
})
......
src/app/components/affiliates/affiliates.routing.ts
......@@ -5,5 +5,5 @@ export const AffiliateRoutes: Routes = [
path: 'view-affiliates',
component: ViewAffiliateComponent,
data: { title: 'MANAGE-AFFILIATES', breadcrumb: 'VIEW-AFFILIATES'}
}
},
];
src/app/components/affiliates/delete-dialog/delete-dialog.component.html 0 → 100644
<h1 matDialogTitle>Delete Dailog</h1>
<div mat-dialog-content>
<!-- <p>Delete: <b>{{ data.userName }}</b> ?</p> -->
<p>Delete: <b>Test User</b> ?</p>
</div>
<div mat-dialog-actions>
<button type="button" mat-raised-button color="primary" (click)="dialogRef.close(true)"
(click)="confirmDelete()">Delete</button>
&nbsp;
<span fxFlex></span>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">No Thanks!</button>
</div>
\ No newline at end of file
src/app/components/affiliates/delete-dialog/delete-dialog.component.ts 0 → 100644
import { Component, Inject, OnInit } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
@Component({
selector: 'app-delete-dialog',
templateUrl: './delete-dialog.component.html',
styleUrls: ['./delete-dialog.component.scss']
})
export class DeleteDialogComponent implements OnInit {
private _dimesionToggle = false;
constructor(public dialogRef: MatDialogRef<DeleteDialogComponent>,@Inject(MAT_DIALOG_DATA) public data: any) { }
togglePosition(): void {
this._dimesionToggle = !this._dimesionToggle;
if (this._dimesionToggle) {
this.dialogRef
.updateSize('500px', '500px')
.updatePosition({ top: '25px', left: '25px' });
} else {
this.dialogRef
.updateSize()
.updatePosition();
}
}
ngOnInit() {
}
}
src/app/components/affiliates/edit-dialog/edit-dialog.component.ts 0 → 100644
import { Component, Inject, OnInit } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA, MatDialog, MatDialogConfig } from '@angular/material';
const defaultDialogConfig = new MatDialogConfig();
@Component({
selector: 'app-edit-dialog',
templateUrl: './edit-dialog.component.html',
styleUrls: ['./edit-dialog.component.scss']
})
export class EditDialogComponent implements OnInit {
private _dimesionToggle = false;
noteDataSource = NOTE_DATA;
dataSource = ELEMENT_DATA;
actionsAlignment: string;
config = {
disableClose: true,
panelClass: 'custom-overlay-pane-class',
hasBackdrop: true,
backdropClass: '',
width: '',
height: '',
minWidth: '',
minHeight: '',
maxWidth: defaultDialogConfig.maxWidth,
maxHeight: '',
position: {
top: '',
bottom: '',
left: '',
right: ''
},
};
constructor(public dialog: MatDialog, public dialogRef: MatDialogRef<EditDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) { }
togglePosition(): void {
this._dimesionToggle = !this._dimesionToggle;
if (this._dimesionToggle) {
this.dialogRef
.updateSize('500px', '500px')
.updatePosition({ top: '25px', left: '25px' });
} else {
this.dialogRef
.updateSize()
.updatePosition();
}
}
ngOnInit() {
}
}
export interface NoteSummaryElement {
noteId: number;
userId: number;
operatorId: number;
createTime: string
category: string;
note: string,
}
const NOTE_DATA: NoteSummaryElement[] = [
{
noteId: 1,
userId: 1,
operatorId: 1,
createTime: '13-12-1992',
category: 'category',
note: 'Add operator',
}, {
noteId: 2,
userId: 1,
operatorId: 1,
createTime: '13-12-1992',
category: 'category',
note: 'Add operator',
}, {
noteId: 3,
userId: 1,
operatorId: 1,
createTime: '13-12-1992',
category: 'category',
note: 'Add operator',
}, {
noteId: 4,
userId: 1,
operatorId: 1,
createTime: '13-12-1992',
category: 'category',
note: 'Add operator',
}, {
noteId: 5,
userId: 1,
operatorId: 1,
createTime: '13-12-1992',
category: 'category',
note: 'Add operator',
}, {
noteId: 6,
userId: 1,
operatorId: 1,
createTime: '13-12-1992',
category: 'category',
note: 'Add operator',
}, {
noteId: 7,
userId: 1,
operatorId: 1,
createTime: '13-12-1992',
category: 'category',
note: 'Add operator',
}
];
export interface DataElement {
userName: string;
wallet: number;
level: number;
createTime: string;
updateTime: string;
lastLoginTime: string;
lastLoginIp: string;
registerIP: string;
withdrawStatus: number;
withdrawReview: number;
status: number;
}
const ELEMENT_DATA: DataElement[] = [
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
{
userName: 'test',
wallet: 10.00,
level: 1,
createTime: '10-12-1992',
updateTime: '10-12-1992',
lastLoginTime: '10-12-1992',
lastLoginIp: '10-12-1992',
registerIP: "192.168.0.1",
withdrawStatus: 0,
withdrawReview: 0,
status: 0,
},
];
src/app/components/affiliates/view-affiliates/view-affiliate.component.html
......@@ -31,26 +31,104 @@
<button mat-button>Clean</button>
</mat-expansion-panel>
<br>
<button mat-raised-button color="primary">Manual Balance Adjustment </button><br>
<ngx-datatable
class="material"
[rows]="rows"
[columns]="[{name:'Username'},
{name:'Wallet'},
{name:'Rate'},
{name:'Affiliate Level'},
{name:'CreateTime'},
{name:'UpdateTime'},
{name:'Last Login Time'},
{name:'Last Login Ip'},
{name:'Register IP'},
{name:'Withdraw Status'},
{name:'Withdraw Review'},
{name:'Status'},
{name:'Action'}]"
[columnMode]="'force'"
[headerHeight]="50"
[footerHeight]="50"
[rowHeight]="'auto'"
[limit]="10">
</ngx-datatable>
\ No newline at end of file
<div fxLayout="row" fxLayoutWrap="wrap">
<div fxFlex="100" fxFlex.gt-sm="100" fxFlex.sm="100">
<div fxFlex.gt-xs="50" fxFlex="100" class="text-sm-right text-xs-left">
<span fxFlex></span>
<button mat-raised-button color="primary" class="mr-1" (click)="addAffiliateDialog()">Add Affiliate </button>
</div>
<div class="mat-box-shadow">
<ngx-datatable class="material bg-white" [columnMode]="'force'" [headerHeight]="50" [footerHeight]="50"
[rowHeight]="50" [limit]="10" [rows]="affDataSource" [columns]="columns">
<ngx-datatable-column name="Username">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.userName }}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Wallet">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.wallet }}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Rate">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.rate }}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Affiliate Level">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.affilateLevel }}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="CreateTime">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.createTime }}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="UpdateTime">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.updateTime}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Last Login Time">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.lastLoginTime}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Last Login IP">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.lastLoginIp}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Register IP">
<ng-template let-row="row" ngx-datatable-cell-template>
{{ row?.registerIP}}
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Withdraw Status">
<ng-template let-row="row" ngx-datatable-cell-template>
<!-- {{ row?.withdrawStatus }} -->
<mat-slide-toggle></mat-slide-toggle>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Withdraw Review">
<ng-template let-row="row" ngx-datatable-cell-template>
<!-- {{ row?.withdrawReview }} -->
<mat-slide-toggle></mat-slide-toggle>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Status">
<ng-template let-row="row" ngx-datatable-cell-template>
<!-- {{ row?.status }} -->
<mat-slide-toggle></mat-slide-toggle>
</ng-template>
</ngx-datatable-column>
<ngx-datatable-column name="Action">
<ng-template let-row="row" let-value="value" ngx-datatable-cell-template>
<button id="modifyButton" matTooltip="Modify" mat-icon-button mat-button-sm (click)="openEditDialog()"
[attr.aria-label]="edit" color="primary">
<mat-icon class="mi16">edit</mat-icon>
</button>
<button id="lockedButton" matTooltip="Delete" mat-icon-button mat-button-sm (click)="openDeleteDialog()"
[attr.aria-label]="delete" color="warn">
<mat-icon class="mi16">close</mat-icon>
</button>
</ng-template>
</ngx-datatable-column>
</ngx-datatable>
</div>
</div>
</div>
\ No newline at end of file
src/app/components/affiliates/view-affiliates/view-affiliate.component.ts
import { Component } from '@angular/core';
import { Component, ViewChild, TemplateRef, Inject } from '@angular/core';
import { MatDialogConfig, MatDialog, MatDialogRef } from '@angular/material';
import { DOCUMENT } from '@angular/platform-browser';
import { DeleteDialogComponent } from '../delete-dialog/delete-dialog.component';
import { EditDialogComponent } from '../edit-dialog/edit-dialog.component';
const defaultDialogConfig = new MatDialogConfig();
@Component({
templateUrl: './view-affiliate.component.html',
styleUrls: ['./view-affiliate.component.scss']
})
export class ViewAffiliateComponent {
affDataSource = AFFILIATE_DATA;
dialogRef: MatDialogRef<any> | null;
lastAfterClosedResult: string;
lastBeforeCloseResult: string;
actionsAlignment: string;
config = {
disableClose: true,
panelClass: 'custom-overlay-pane-class',
hasBackdrop: true,
backdropClass: '',
width: '',
height: '',
minWidth: '',
minHeight: '',
maxWidth: defaultDialogConfig.maxWidth,
maxHeight: '',
position: {
top: '',
bottom: '',
left: '',
right: ''
},
};
deleteDialogconfig = {
disableClose: true,
panelClass: 'custom-overlay-pane-class',
maxWidth: defaultDialogConfig.maxWidth,
maxHeight: '',
position: {
top: '', bottom: '', left: '', right: ''
},
};
@ViewChild(TemplateRef) template: TemplateRef<any>;
constructor(public dialog: MatDialog, @Inject(DOCUMENT) doc: any) {
dialog.afterOpen.subscribe(() => {
if (!doc.body.classList.contains('no-scroll')) {
doc.body.classList.add('no-scroll');
}
});
dialog.afterAllClosed.subscribe(() => {
doc.body.classList.remove('no-scroll');
});
}
openEditDialog() {
this.dialogRef = this.dialog.open(EditDialogComponent, this.config);
this.dialogRef.beforeClose().subscribe((result: string) => {
this.lastBeforeCloseResult = result;
});
this.dialogRef.afterClosed().subscribe((result: string) => {
this.lastAfterClosedResult = result;
this.dialogRef = null;
});
}
openDeleteDialog() {
this.dialogRef = this.dialog.open(DeleteDialogComponent, this.deleteDialogconfig);
this.dialogRef.beforeClose().subscribe((result: string) => {
this.lastBeforeCloseResult = result;
});
this.dialogRef.afterClosed().subscribe((result: string) => {
this.lastAfterClosedResult = result;
this.dialogRef = null;
});
}
}
export interface AffiliateDataElement {
userName: string;
wallet: number;
rate: number;
affilateLevel: number;
createTime: string
updateTime: string
lastLoginTime: string
lastLoginIp: string
registerIP: string;
withdrawStatus: number;
withdrawReview: number;
status: number
}
const AFFILIATE_DATA: AffiliateDataElement[] = [
{
userName: "test",
wallet: 10,
rate: 50,
affilateLevel: 1,
createTime: "13-12-1992 00:00:0000",
updateTime: "13-12-1992 00:00:0000",
lastLoginTime: "13-12-1992 00:00:0000",
lastLoginIp: "0.0.0.0",
registerIP: "0.0.0.0",
withdrawStatus: 1,
withdrawReview: 1,
status: 1,
}, {
userName: "test",
wallet: 10,
rate: 50,
affilateLevel: 1,
createTime: "13-12-1992 00:00:0000",
updateTime: "13-12-1992 00:00:0000",
lastLoginTime: "13-12-1992 00:00:0000",
lastLoginIp: "0.0.0.0",
registerIP: "0.0.0.0",
withdrawStatus: 1,
withdrawReview: 1,
status: 1,
}, {
userName: "test",
wallet: 10,
rate: 50,
affilateLevel: 1,
createTime: "13-12-1992 00:00:0000",
updateTime: "13-12-1992 00:00:0000",
lastLoginTime: "13-12-1992 00:00:0000",
lastLoginIp: "0.0.0.0",
registerIP: "0.0.0.0",
withdrawStatus: 1,
withdrawReview: 1,
status: 1,
}, {
userName: "test",
wallet: 10,
rate: 50,
affilateLevel: 1,
createTime: "13-12-1992 00:00:0000",
updateTime: "13-12-1992 00:00:0000",
lastLoginTime: "13-12-1992 00:00:0000",
lastLoginIp: "0.0.0.0",
registerIP: "0.0.0.0",
withdrawStatus: 1,
withdrawReview: 1,
status: 1,
}, {
userName: "test",
wallet: 10,
rate: 50,
affilateLevel: 1,
createTime: "13-12-1992 00:00:0000",
updateTime: "13-12-1992 00:00:0000",
lastLoginTime: "13-12-1992 00:00:0000",
lastLoginIp: "0.0.0.0",
registerIP: "0.0.0.0",
withdrawStatus: 1,
withdrawReview: 1,
status: 1,
},
];
src/app/components/operators/add-operator-dialog/add-operator-dialog.component.html
......@@ -79,7 +79,7 @@
<hr>
<mat-card-actions>
<button mat-raised-button color="primary" type="submit" [disabled]="!form.valid">Submit</button>
<button mat-raised-button class="shadow-none" (click)="dialogRef.close(true)">Close</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</form>
</mat-card>
\ No newline at end of file
src/app/components/operators/edit-dialog/edit-dialog.component.html
......@@ -41,7 +41,7 @@
<hr>
<mat-card-actions>
<button mat-raised-button color="primary">Update</button>
<button mat-raised-button class="shadow-none" (click)="dialogRef.close(true)">Close</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</form>
</mat-card-content>
......@@ -62,7 +62,7 @@
<hr>
<mat-card-actions>
<button mat-raised-button color="primary">Update</button>
<button mat-raised-button class="shadow-none" (click)="dialogRef.close(true)">Close</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</div>
</div>
......
src/app/components/operators/edit-dialog/edit-dialog.component.ts
......@@ -33,9 +33,7 @@ export class EditDialogComponent implements OnInit {
},
};
constructor(public dialog: MatDialog,
public dialogRef: MatDialogRef<EditDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any) { }
constructor(public dialog: MatDialog, public dialogRef: MatDialogRef<EditDialogComponent>, @Inject(MAT_DIALOG_DATA) public data: any) { }
togglePosition(): void {
this._dimesionToggle = !this._dimesionToggle;
......
src/app/components/players/balance-adjustment-dialog/balance-adjustment-dialog.component.html
......@@ -33,7 +33,7 @@
<hr>
<mat-card-actions>
<button mat-raised-button color="primary">Save</button>
<button mat-raised-button class="shadow-none">Reset</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</form>
</mat-card-content>
......@@ -102,7 +102,7 @@
<hr>
<mat-card-actions>
<button mat-raised-button color="primary">Save</button>
<button mat-raised-button class="shadow-none">Reset</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</form>
</mat-card-content>
......
src/app/components/players/edit-dialog/edit-dialog.component.html
......@@ -52,7 +52,7 @@
<hr>
<mat-card-actions>
<button mat-raised-button color="primary">Update</button>
<button mat-raised-button class="shadow-none">Cancel</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</form>
</mat-card-content>
......@@ -73,7 +73,7 @@
<hr>
<mat-card-actions>
<button mat-raised-button color="primary">Update</button>
<button mat-raised-button class="shadow-none">Cancel</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</div>
</div>
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!