Skip to content

Praful Makani / bo-livebillionbet-ui

Go to a project
Commit bce977f2 by Ajit Thakor
Options

Added ui for manage affiliate

1 parent 6f390879
Inline Side-by-side
Showing with 175 additions and 18 deletions
src/app/app.component.ts
...@@ -29,7 +29,7 @@ export class AppComponent implements OnInit{ ...@@ -29,7 +29,7 @@ export class AppComponent implements OnInit{
this.changePageTitle(); this.changePageTitle();
} }
changePageTitle() { changePageTitle() {
this.router.events.filter(event => event instanceof NavigationEnd).subscribe((routeChange) => {debugger this.router.events.filter(event => event instanceof NavigationEnd).subscribe((routeChange) => {
var routeParts = this.routePartsService.generateRouteParts(this.activeRoute.snapshot); var routeParts = this.routePartsService.generateRouteParts(this.activeRoute.snapshot);
if (!routeParts.length) if (!routeParts.length)
return this.title.setTitle(this.appTitle); return this.title.setTitle(this.appTitle);
......
src/app/app.module.ts
...@@ -46,7 +46,6 @@ import { AppRoutes } from './app.routing'; ...@@ -46,7 +46,6 @@ import { AppRoutes } from './app.routing';
import { AppComponent } from './app.component'; import { AppComponent } from './app.component';
import { BreadcrumbComponent } from './core/breadcrumb/breadcrumb.component'; import { BreadcrumbComponent } from './core/breadcrumb/breadcrumb.component';
import { RoutePartsService } from './services/route-parts/route-parts.service'; import { RoutePartsService } from './services/route-parts/route-parts.service';
import { ManualBalanceAdjustmentComponent } from './components/dialog/manual-balance-adjustment/manual-balance-adjustment.component';
export function createTranslateLoader(http: HttpClient) { export function createTranslateLoader(http: HttpClient) {
return new TranslateHttpLoader(http, './assets/i18n/', '.json'); return new TranslateHttpLoader(http, './assets/i18n/', '.json');
......
src/app/components/affiliates/add-affiliate-dialog/add-affiliate-dialog.component.html 0 → 100644
<mat-card>
<mat-toolbar color="primary">Add Affiliates</mat-toolbar>
<form [formGroup]="form">
<mat-card-content>
<div fxLayout="row wrap">
<div class="pb-1">
<mat-form-field fxFlex style="width: 30%">
<input matInput placeholder="First name" [formControl]="form.controls['fname']" required>
<mat-error
*ngIf="form.controls['fname'].hasError('required') && form.controls['fname'].touched">
You
must include a first name.</mat-error>
<mat-error class="mat-text-warn"
*ngIf="form.controls['fname'].hasError('minlength') && form.controls['fname'].touched">
Your
first name must be at least 5 characters long.</mat-error>
<mat-error class="mat-text-warn"
*ngIf="form.controls['fname'].hasError('maxlength') && form.controls['fname'].touched">
Your
first name cannot exceed 10 characters.</mat-error>
</mat-form-field>
<mat-form-field fxFlex style="width: 30%">
<input matInput placeholder="Last name" [formControl]="form.controls['lname']" required>
<mat-error
*ngIf="form.controls['lname'].hasError('required') && form.controls['lname'].touched"
class="mat-text-warn">You must include a last name.</mat-error>
<mat-error
*ngIf="form.controls['lname'].hasError('minlength') && form.controls['lname'].touched"
class="mat-text-warn">Your last name must be at least 5 characters long.</mat-error>
<mat-error
*ngIf="form.controls['lname'].hasError('maxlength') && form.controls['lname'].touched"
class="mat-text-warn">Your last name cannot exceed 10 characters.</mat-error>
</mat-form-field>
<mat-form-field style="width: 30%">
<input matInput placeholder="User name" [formControl]="form.controls['uname']" required>
<mat-error
*ngIf="form.controls['uname'].hasError('required') && form.controls['uname'].touched"
class="mat-text-warn">You must include a user name.</mat-error>
<mat-error
*ngIf="form.controls['uname'].hasError('minlength') && form.controls['uname'].touched"
class="mat-text-warn">Your user name must be at least 5 characters long.</mat-error>
<mat-error
*ngIf="form.controls['uname'].hasError('maxlength') && form.controls['uname'].touched"
class="mat-text-warn">Your user name cannot exceed 10 characters.</mat-error>
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap">
<div class="pb-1">
<mat-form-field style="width: 30%">
<input matInput placeholder="Password" [formControl]="form.controls['password']" type="password"
required>
<mat-error
*ngIf="form.controls['password'].hasError('required') && form.controls['password'].touched"
class="mat-text-warn ">You must include password.</mat-error>
</mat-form-field>
<mat-form-field style="width: 30%">
<input matInput placeholder="Email address" [formControl]="form.controls['email']" type="email"
required>
<mat-error
*ngIf="form.controls['email'].hasError('required') && form.controls['email'].touched"
class="mat-text-warn">You must include an email address.</mat-error>
<mat-error
*ngIf="form.controls['email'].errors?.email && form.controls['email'].touched"
class="mat-text-warn">You
must include a valid email address.</mat-error>
</mat-form-field>
<mat-form-field style="width: 30%">
<input matInput placeholder="Mobile" required>
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap">
<div class="mb-1">
<mat-form-field style="width: 90%">
<textarea matInput maxlength="256" placeholder="Address" matTextareaAutosize matAutosizeMinRows="2"
matAutosizeMaxRows="5"></textarea>
</mat-form-field>
</div>
<div class="mb-1">
<label>Gender</label>
<mat-radio-group>
<mat-radio-button value="male">Male</mat-radio-button>
<mat-radio-button value="female">Female</mat-radio-button>
</mat-radio-group>
</div>
</div>
</mat-card-content>
<div>
<mat-card-actions>
<button mat-raised-button color="primary" type="submit" [disabled]="!form.valid">Submit</button>
<button mat-raised-button color="accent" (click)="dialogRef.close(false)">Close</button>
</mat-card-actions>
</div>
</form>
</mat-card>
\ No newline at end of file
src/app/components/affiliates/add-affiliate-dialog/add-affiliate-dialog.component.ts 0 → 100644
import { Component, Inject, OnInit } from '@angular/core';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { CustomValidators } from 'ng2-validation';
@Component({
selector: 'app-add-affiliate-dialog',
templateUrl: './add-affiliate-dialog.component.html',
styleUrls: ['./add-affiliate-dialog.component.scss']
})
export class AddAffiliateDialogComponent implements OnInit {
public form: FormGroup;
constructor(public dialogRef: MatDialogRef<AddAffiliateDialogComponent>,
@Inject(MAT_DIALOG_DATA) public data: any, private fb: FormBuilder) { }
ngOnInit() {
this.form = this.fb.group({
fname: [null, Validators.compose([Validators.required, Validators.minLength(5), Validators.maxLength(10)])],
lname: [null, Validators.compose([Validators.required, Validators.minLength(5), Validators.maxLength(10)])],
uname: [null, Validators.compose([Validators.required, Validators.minLength(5), Validators.maxLength(10)])],
email: [null, Validators.compose([Validators.required, CustomValidators.email])],
password: [null, Validators.compose([Validators.required])],
});
}
}
src/app/components/affiliates/affiliates.module.ts
import { NgModule } from '@angular/core'; import { NgModule } from '@angular/core';
import { RouterModule } from '@angular/router'; import { RouterModule } from '@angular/router';
import { CommonModule } from '@angular/common'; import { CommonModule } from '@angular/common';
import { MatRadioModule,MatTooltipModule,MatCardModule,MatToolbarModule, MatTabsModule, MatSlideToggleModule, MatIconModule, MatInputModule, MatExpansionModule, MatDatepickerModule, MatNativeDateModule, MatSelectModule, MatButtonModule, MatButtonToggleModule } from '@angular/material'; import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { MatStepperModule,MatTooltipModule,MatToolbarModule,MatRadioModule,MatSlideToggleModule, MatInputModule, MatExpansionModule, MatDatepickerModule, MatNativeDateModule, MatSelectModule, MatButtonModule, MatButtonToggleModule, MatTabsModule, MatIconModule, MatCardModule } from '@angular/material';
import { NgxDatatableModule } from '@swimlane/ngx-datatable'; import { NgxDatatableModule } from '@swimlane/ngx-datatable';
import { AffiliateRoutes } from './affiliates.routing'; import { AffiliateRoutes } from './affiliates.routing';
import { ViewAffiliateComponent } from './view-affiliates/view-affiliate.component'; import { ViewAffiliateComponent } from './view-affiliates/view-affiliate.component';
import { DeleteDialogComponent } from './delete-dialog/delete-dialog.component'; import { DeleteDialogComponent } from './delete-dialog/delete-dialog.component';
import { EditDialogComponent } from './edit-dialog/edit-dialog.component'; import { EditDialogComponent } from './edit-dialog/edit-dialog.component';
import { AddAffiliateDialogComponent } from './add-affiliate-dialog/add-affiliate-dialog.component';
import { AddAffiliateComponent } from './add-affiliate/add-affiliate.component';
@NgModule({ @NgModule({
...@@ -27,16 +31,22 @@ import { EditDialogComponent } from './edit-dialog/edit-dialog.component'; ...@@ -27,16 +31,22 @@ import { EditDialogComponent } from './edit-dialog/edit-dialog.component';
MatTabsModule, MatTabsModule,
MatCardModule, MatCardModule,
MatTooltipModule, MatTooltipModule,
MatRadioModule ReactiveFormsModule,
MatRadioModule,
FormsModule,
MatStepperModule
], ],
declarations: [ declarations: [
ViewAffiliateComponent, ViewAffiliateComponent,
EditDialogComponent, EditDialogComponent,
DeleteDialogComponent DeleteDialogComponent,
AddAffiliateDialogComponent,
AddAffiliateComponent
], ],
entryComponents: [ entryComponents: [
EditDialogComponent, EditDialogComponent,
DeleteDialogComponent DeleteDialogComponent,
AddAffiliateDialogComponent
] ]
}) })
......
src/app/components/affiliates/affiliates.routing.ts
...@@ -4,6 +4,6 @@ export const AffiliateRoutes: Routes = [ ...@@ -4,6 +4,6 @@ export const AffiliateRoutes: Routes = [
{ {
path: 'view-affiliates', path: 'view-affiliates',
component: ViewAffiliateComponent, component: ViewAffiliateComponent,
data: { title: 'MANAGE-AFFILIATES', breadcrumb: 'VIEW-AFFILIATES'} data: { title: 'MANAGE-AFFILIATES', breadcrumb: 'VIEW-AFFILIATES' }
}, }
]; ];
src/app/components/affiliates/view-affiliates/view-affiliate.component.ts
...@@ -3,6 +3,7 @@ import { MatDialogConfig, MatDialog, MatDialogRef } from '@angular/material'; ...@@ -3,6 +3,7 @@ import { MatDialogConfig, MatDialog, MatDialogRef } from '@angular/material';
import { DOCUMENT } from '@angular/platform-browser'; import { DOCUMENT } from '@angular/platform-browser';
import { DeleteDialogComponent } from '../delete-dialog/delete-dialog.component'; import { DeleteDialogComponent } from '../delete-dialog/delete-dialog.component';
import { EditDialogComponent } from '../edit-dialog/edit-dialog.component'; import { EditDialogComponent } from '../edit-dialog/edit-dialog.component';
import { AddAffiliateDialogComponent } from '../add-affiliate-dialog/add-affiliate-dialog.component';
const defaultDialogConfig = new MatDialogConfig(); const defaultDialogConfig = new MatDialogConfig();
...@@ -17,7 +18,21 @@ export class ViewAffiliateComponent { ...@@ -17,7 +18,21 @@ export class ViewAffiliateComponent {
lastAfterClosedResult: string; lastAfterClosedResult: string;
lastBeforeCloseResult: string; lastBeforeCloseResult: string;
actionsAlignment: string; actionsAlignment: string;
addAffiliateConfig = {
disableClose: true,
panelClass: 'custom-overlay-pane-class',
hasBackdrop: true,
backdropClass: '',
width: '800px',
height: '500px',
position: {
top: '',
bottom: '',
left: '',
right: ''
},
};
config = { config = {
disableClose: true, disableClose: true,
panelClass: 'custom-overlay-pane-class', panelClass: 'custom-overlay-pane-class',
...@@ -58,6 +73,16 @@ export class ViewAffiliateComponent { ...@@ -58,6 +73,16 @@ export class ViewAffiliateComponent {
doc.body.classList.remove('no-scroll'); doc.body.classList.remove('no-scroll');
}); });
} }
addAffiliateDialog() {
this.dialogRef = this.dialog.open(AddAffiliateDialogComponent, this.addAffiliateConfig);
this.dialogRef.beforeClose().subscribe((result: string) => {
this.lastBeforeCloseResult = result;
});
this.dialogRef.afterClosed().subscribe((result: string) => {
this.lastAfterClosedResult = result;
this.dialogRef = null;
});
}
openEditDialog() { openEditDialog() {
this.dialogRef = this.dialog.open(EditDialogComponent, this.config); this.dialogRef = this.dialog.open(EditDialogComponent, this.config);
this.dialogRef.beforeClose().subscribe((result: string) => { this.dialogRef.beforeClose().subscribe((result: string) => {
......
src/app/components/operators/add-operator-dialog/add-operator-dialog.component.ts
...@@ -22,7 +22,6 @@ export class AddOperatorDialogComponent implements OnInit { ...@@ -22,7 +22,6 @@ export class AddOperatorDialogComponent implements OnInit {
lname: [null, Validators.compose([Validators.required, Validators.minLength(5), Validators.maxLength(10)])], lname: [null, Validators.compose([Validators.required, Validators.minLength(5), Validators.maxLength(10)])],
uname: [null, Validators.compose([Validators.required, Validators.minLength(5), Validators.maxLength(10)])], uname: [null, Validators.compose([Validators.required, Validators.minLength(5), Validators.maxLength(10)])],
email: [null, Validators.compose([Validators.required, CustomValidators.email])], email: [null, Validators.compose([Validators.required, CustomValidators.email])],
range: [null, Validators.compose([Validators.required, CustomValidators.range([5, 9])])],
password: [null, Validators.compose([Validators.required])], password: [null, Validators.compose([Validators.required])],
role: [null, Validators.compose([Validators.required, Validators.minLength(2), Validators.maxLength(10)])] role: [null, Validators.compose([Validators.required, Validators.minLength(2), Validators.maxLength(10)])]
}); });
......
src/app/components/payments/payments-routing.module.ts
...@@ -5,12 +5,14 @@ import { WithdrawalsComponent } from './withdrawals/withdrawals.component'; ...@@ -5,12 +5,14 @@ import { WithdrawalsComponent } from './withdrawals/withdrawals.component';
const routes: Routes = [ const routes: Routes = [
{ {
path: 'deposits', path: 'deposits',
component: DepositsComponent component: DepositsComponent,
}, { data: { title: 'MANAGE-PAYMENTS', breadcrumb: 'DEPOSITS' }
path: 'withdrawals', }, {
component: WithdrawalsComponent path: 'withdrawals',
}]; component: WithdrawalsComponent,
data: { title: 'MANAGE-PAYMENTS', breadcrumb: 'WITHDRAWALS' }
}];
@NgModule({ @NgModule({
imports: [RouterModule.forChild(routes)], imports: [RouterModule.forChild(routes)],
......
src/app/core/breadcrumb/breadcrumb.component.ts
...@@ -15,7 +15,6 @@ export class BreadcrumbComponent implements OnInit { ...@@ -15,7 +15,6 @@ export class BreadcrumbComponent implements OnInit {
private routePartsService: RoutePartsService, private routePartsService: RoutePartsService,
private activeRoute: ActivatedRoute private activeRoute: ActivatedRoute
) { ) {
debugger
this.router.events.filter(event => event instanceof NavigationEnd).subscribe((routeChange) => { this.router.events.filter(event => event instanceof NavigationEnd).subscribe((routeChange) => {
this.routeParts = this.routePartsService.generateRouteParts(this.activeRoute.snapshot); this.routeParts = this.routePartsService.generateRouteParts(this.activeRoute.snapshot);
// generate url from parts // generate url from parts
...@@ -27,7 +26,6 @@ export class BreadcrumbComponent implements OnInit { ...@@ -27,7 +26,6 @@ export class BreadcrumbComponent implements OnInit {
item.url += `/${urlSegment.path}` item.url += `/${urlSegment.path}`
}); });
if(i === 0) { if(i === 0) {
debugger
return item; return item;
} }
// prepend previous part to current part // prepend previous part to current part
......
Markdown is supported
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!