admin module work
This commit is contained in:
parent
68a455d5c4
commit
2fd514d946
@ -39,7 +39,7 @@ export class HeaderComponent implements OnInit, OnDestroy {
|
||||
|
||||
currentTheme = 'default';
|
||||
|
||||
userMenu = [ { title: 'Profile' }, { title: 'Log out' } ];
|
||||
userMenu = [ { title: 'Profile' },{ title: 'Log out' } ];
|
||||
|
||||
constructor(private sidebarService: NbSidebarService,
|
||||
private menuService: NbMenuService,
|
||||
@ -77,7 +77,10 @@ export class HeaderComponent implements OnInit, OnDestroy {
|
||||
let passData = event.item.title
|
||||
|
||||
if(passData == 'Log out'){
|
||||
localStorage.clear();
|
||||
this.router.navigate(['/auth/login'])
|
||||
}else if(passData == 'Profile'){
|
||||
this.router.navigate(['/pages/profile'])
|
||||
}
|
||||
//this.onItemSelection(event.item.title);
|
||||
})
|
||||
|
||||
@ -18,6 +18,13 @@
|
||||
@import './layout';
|
||||
@import './overrides';
|
||||
|
||||
|
||||
.navigation .link nb-icon {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
|
||||
|
||||
// install the framework and custom global styles
|
||||
@include nb-install() {
|
||||
|
||||
@ -31,3 +38,10 @@
|
||||
|
||||
@include nb-overrides();
|
||||
};
|
||||
// .layout-container .content .columns nb-layout-column {
|
||||
// background-image: url('../../../assets/images/login.jpg') !important;
|
||||
// background-repeat: no-repeat;
|
||||
// background-attachment: fixed;
|
||||
// background-size: cover;
|
||||
// }
|
||||
|
||||
@ -10,8 +10,22 @@ import {
|
||||
} from '@nebular/auth';
|
||||
import { LoginComponent } from '../app/pages/auth/login/login.component';
|
||||
import { AuthGuard } from './pages/_guard/auth.guard';
|
||||
export const routes: Routes = [
|
||||
|
||||
|
||||
const token = localStorage.getItem('user_token');
|
||||
console.log(token)
|
||||
let param;
|
||||
if(token != '' && token != undefined && token != null){
|
||||
param = 'page'
|
||||
}else{
|
||||
param = 'auth'
|
||||
}
|
||||
export const routes: Routes = [
|
||||
{
|
||||
path: '',
|
||||
redirectTo: param,
|
||||
pathMatch: 'full',
|
||||
},
|
||||
{
|
||||
path: 'pages',
|
||||
canActivateChild:[AuthGuard],
|
||||
|
||||
@ -14,7 +14,7 @@ export class AuthGuard implements CanActivate, CanActivateChild {
|
||||
if(token != '' && token != undefined && token != null){
|
||||
return true
|
||||
}else{
|
||||
alert("else");
|
||||
// alert("else");
|
||||
// this.router.navigate(['auth/login']);
|
||||
this.router.navigate(['/auth/login'])
|
||||
return false;
|
||||
@ -38,10 +38,10 @@ export class AuthGuard implements CanActivate, CanActivateChild {
|
||||
if(token != '' && token != undefined && token != null){
|
||||
return true
|
||||
}else{
|
||||
setTimeout(() => {
|
||||
// setTimeout(() => {
|
||||
this.router.navigate(['/auth/login']);
|
||||
return false;
|
||||
},1000);
|
||||
// },1000);
|
||||
}
|
||||
|
||||
// if (this.shared.getCurrentUser() != null && this.shared.getToken()) {
|
||||
|
||||
1
src/app/pages/auth/auth/auth.component.html
Normal file
1
src/app/pages/auth/auth/auth.component.html
Normal file
@ -0,0 +1 @@
|
||||
<p>auth works!</p>
|
||||
0
src/app/pages/auth/auth/auth.component.scss
Normal file
0
src/app/pages/auth/auth/auth.component.scss
Normal file
23
src/app/pages/auth/auth/auth.component.spec.ts
Normal file
23
src/app/pages/auth/auth/auth.component.spec.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { AuthComponent } from './auth.component';
|
||||
|
||||
describe('AuthComponent', () => {
|
||||
let component: AuthComponent;
|
||||
let fixture: ComponentFixture<AuthComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ AuthComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(AuthComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
15
src/app/pages/auth/auth/auth.component.ts
Normal file
15
src/app/pages/auth/auth/auth.component.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-auth',
|
||||
templateUrl: './auth.component.html',
|
||||
styleUrls: ['./auth.component.scss']
|
||||
})
|
||||
export class AuthComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
||||
@ -20,11 +20,8 @@ nb-checkbox {
|
||||
// ::ng-deep .nb-theme-default nb-card-header {
|
||||
// display: none !important;
|
||||
// }
|
||||
|
||||
|
||||
.layout-container .content .columns nb-layout-column {
|
||||
background-image: url('../../../../assets/images/login.jpg') !important;
|
||||
background-repeat: no-repeat;
|
||||
background-attachment: fixed;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
|
||||
|
||||
@ -52,6 +52,7 @@ export class LoginComponent implements OnInit {
|
||||
if (res.token !== '') {
|
||||
localStorage.setItem('user_token',res.token);
|
||||
localStorage.setItem('user_role',res.role);
|
||||
localStorage.setItem('roleId',res.roleId);
|
||||
localStorage.setItem('email',JSON.stringify(auth))
|
||||
|
||||
this.showToast('success', 'Login Successfully', 'Welcome..!');
|
||||
|
||||
@ -209,7 +209,8 @@ export class CustomerComponent {
|
||||
|
||||
|
||||
getuserlistApi(){
|
||||
this._api.getusers().subscribe(res => {
|
||||
let param ={}
|
||||
this._api.getusers(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
|
||||
@ -1,8 +1,21 @@
|
||||
import { Component } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-dashboard',
|
||||
templateUrl: './dashboard.component.html',
|
||||
})
|
||||
export class DashboardComponent {
|
||||
|
||||
|
||||
constructor(private router: Router){
|
||||
const token = localStorage.getItem('user_token');
|
||||
console.log(token)
|
||||
|
||||
if(!token){
|
||||
this.router.navigate(['/auth/login']);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
@ -128,6 +128,7 @@ export class DriverComponent {
|
||||
width: '500px',
|
||||
height: '300px',
|
||||
}
|
||||
|
||||
const windowRef: NbWindowRef = this.windowService.open(DriverFormComponent, { title: `New Driver`, buttons: buttonsConfig , });
|
||||
|
||||
|
||||
@ -179,7 +180,8 @@ export class DriverComponent {
|
||||
|
||||
|
||||
getuserlistApi(){
|
||||
this._api.getusers().subscribe(res => {
|
||||
let param ={}
|
||||
this._api.getusers(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
|
||||
34
src/app/pages/order/assign-form/assign-form.component.html
Normal file
34
src/app/pages/order/assign-form/assign-form.component.html
Normal file
@ -0,0 +1,34 @@
|
||||
<form class="form" [formGroup]="driverForm" (ngSubmit)="onSubmit()">
|
||||
|
||||
|
||||
<label for="subject">Drivers:</label> <br />
|
||||
<nb-select formControlName="driver" style="width: 100% !important;" >
|
||||
|
||||
|
||||
<nb-option *ngFor="let user of drivers; index as i; first as isFirst " (click)="checkType(user)" [value]="user.id
|
||||
">{{user.userName }}</nb-option>
|
||||
|
||||
|
||||
</nb-select>
|
||||
<nb-card-footer>
|
||||
<div class="row show-grid" >
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<button type="button" class="cancel" nbButton status="danger" (click)="close()">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<button nbButton status="success" [disabled]="!driverForm.valid" type="submit" >Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</nb-card-footer>
|
||||
</form>
|
||||
10
src/app/pages/order/assign-form/assign-form.component.scss
Normal file
10
src/app/pages/order/assign-form/assign-form.component.scss
Normal file
@ -0,0 +1,10 @@
|
||||
@import '../../../@theme/styles/themes';
|
||||
|
||||
@include nb-install-component() {
|
||||
::ng-deep .form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { AssignFormComponent } from './assign-form.component';
|
||||
|
||||
describe('AssignFormComponent', () => {
|
||||
let component: AssignFormComponent;
|
||||
let fixture: ComponentFixture<AssignFormComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ AssignFormComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(AssignFormComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
81
src/app/pages/order/assign-form/assign-form.component.ts
Normal file
81
src/app/pages/order/assign-form/assign-form.component.ts
Normal file
@ -0,0 +1,81 @@
|
||||
import { Component, Inject, OnInit } from '@angular/core';
|
||||
import { FormControl, FormGroup, Validators } from '@angular/forms';
|
||||
import { NB_WINDOW_CONTEXT, NbWindowRef, NbWindowService } from '@nebular/theme';
|
||||
import { PageapiService } from '../../pageapi.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-assign-form',
|
||||
templateUrl: './assign-form.component.html',
|
||||
styleUrls: ['./assign-form.component.scss']
|
||||
})
|
||||
export class AssignFormComponent {
|
||||
|
||||
|
||||
driverForm:any;
|
||||
drivers:any=[];
|
||||
constructor(@Inject(NB_WINDOW_CONTEXT) public data: any,public _api:PageapiService,private windowService: NbWindowService, private windowRef: NbWindowRef) {
|
||||
console.log(this.data)
|
||||
this.driverForm = new FormGroup({
|
||||
|
||||
|
||||
driver: new FormControl('', [ Validators.required])
|
||||
|
||||
});
|
||||
|
||||
this.getDriverlistApi()
|
||||
}
|
||||
|
||||
close() {
|
||||
this.windowRef.close();
|
||||
}
|
||||
onSubmit(){
|
||||
console.log( this.data , this.driverForm.value)
|
||||
let tmp=[];
|
||||
this.data.forEach(element => {
|
||||
tmp.push({id:element.id ,driverId: this.driverForm.value.driver , status:'Out For Delivery' })
|
||||
|
||||
});
|
||||
|
||||
let param ={driver:tmp}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
this._api.CreateOrder (param).subscribe(res => {
|
||||
if (res.status == 200) {
|
||||
console.log(res)
|
||||
this.windowRef.close(1);
|
||||
}else{
|
||||
this.windowRef.close(0);
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
getDriverlistApi(){
|
||||
let param ={}
|
||||
this._api.getusers(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
let passData = res.data
|
||||
let driver = passData.filter(arr=>{return arr.role == 'DRIVER'})
|
||||
driver.forEach((element:any, index) => {
|
||||
element.index = index +1
|
||||
|
||||
});
|
||||
|
||||
this.drivers = driver
|
||||
// console.log(data)
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
checkType(data){
|
||||
console.log(data)
|
||||
}
|
||||
|
||||
}
|
||||
27
src/app/pages/order/cancel-form/cancel-form.component.html
Normal file
27
src/app/pages/order/cancel-form/cancel-form.component.html
Normal file
@ -0,0 +1,27 @@
|
||||
<form class="form" [formGroup]="cancelForm" (ngSubmit)="onSubmit()">
|
||||
|
||||
<label class="text-label" for="text">Reasons:</label>
|
||||
<textarea nbInput formControlName="reason" id="text"></textarea>
|
||||
|
||||
<nb-card-footer>
|
||||
<div class="row show-grid" >
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<button type="button" class="cancel" nbButton status="danger" (click)="close()">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<button nbButton status="success" [disabled]="!cancelForm.valid" type="submit" >Submit</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</nb-card-footer>
|
||||
</form>
|
||||
10
src/app/pages/order/cancel-form/cancel-form.component.scss
Normal file
10
src/app/pages/order/cancel-form/cancel-form.component.scss
Normal file
@ -0,0 +1,10 @@
|
||||
@import '../../../@theme/styles/themes';
|
||||
|
||||
@include nb-install-component() {
|
||||
::ng-deep .form {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CancelFormComponent } from './cancel-form.component';
|
||||
|
||||
describe('CancelFormComponent', () => {
|
||||
let component: CancelFormComponent;
|
||||
let fixture: ComponentFixture<CancelFormComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ CancelFormComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(CancelFormComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
51
src/app/pages/order/cancel-form/cancel-form.component.ts
Normal file
51
src/app/pages/order/cancel-form/cancel-form.component.ts
Normal file
@ -0,0 +1,51 @@
|
||||
import { Component, Inject, OnInit } from '@angular/core';
|
||||
import { FormControl, FormGroup, Validators } from '@angular/forms';
|
||||
import { NB_WINDOW_CONTEXT, NbWindowRef, NbWindowService } from '@nebular/theme';
|
||||
import { PageapiService } from '../../pageapi.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-cancel-form',
|
||||
templateUrl: './cancel-form.component.html',
|
||||
styleUrls: ['./cancel-form.component.scss']
|
||||
})
|
||||
export class CancelFormComponent {
|
||||
|
||||
cancelForm:any;
|
||||
|
||||
constructor(@Inject(NB_WINDOW_CONTEXT) public data: any,public _api:PageapiService,private windowService: NbWindowService, private windowRef: NbWindowRef) {
|
||||
|
||||
this.cancelForm = new FormGroup({
|
||||
|
||||
|
||||
reason: new FormControl('', [ Validators.required])
|
||||
|
||||
});
|
||||
}
|
||||
|
||||
close() {
|
||||
this.windowRef.close();
|
||||
}
|
||||
onSubmit(){
|
||||
console.log( this.data , this.cancelForm.value)
|
||||
|
||||
|
||||
let param ={id:this.data.id, reason: this.cancelForm.value.reason, status:'canceled'}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
this._api.CreateOrder (param).subscribe(res => {
|
||||
if (res.status == 200) {
|
||||
console.log(res)
|
||||
this.windowRef.close(1);
|
||||
}else{
|
||||
this.windowRef.close(0);
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
49
src/app/pages/order/mixed-form/mixed-form.component.html
Normal file
49
src/app/pages/order/mixed-form/mixed-form.component.html
Normal file
@ -0,0 +1,49 @@
|
||||
|
||||
|
||||
<div *ngFor="let fieldGroup of inputFieldGroups; let i = index">
|
||||
<div>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<div class="row show-grid">
|
||||
<div class="col-6 col-md-3">
|
||||
<div >
|
||||
|
||||
<label for="subject" style=" font-weight: 600;">Mixed Gas {{i+1}}:</label>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div>
|
||||
<input nbInput style="width: 50%;" (keyup)="pass()" [(ngModel)]="fieldGroup.qty" type="number">
|
||||
<!-- <input nbInput type="number" min="0" [(ngModel)]="item.qty"> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div >
|
||||
<!-- <input nbInput type="text" [(ngModel)]="item.productSpec"> -->
|
||||
<input nbInput style=" width: 100%;" (keyup)="pass()" [(ngModel)]="fieldGroup.productSpec" type="text">
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-6 col-md-3">
|
||||
<div >
|
||||
<nb-actions size="medium">
|
||||
<nb-action icon="plus-circle-outline" class="custom-action-icon" [nbTooltip]="'Add'" (click)="addInputFieldGroup()"></nb-action>
|
||||
|
||||
<nb-action icon="minus-circle-outline" [nbTooltip]="'Remove'" (click)="removeInputFieldGroup(i)"></nb-action>
|
||||
</nb-actions>
|
||||
<!-- <button nbButton status="success" (click)="addInputFieldGroup()" style="margin-right: 1rem;"> Add </button> -->
|
||||
<!-- <button nbButton status="danger" (click)="removeInputFieldGroup(i)">Remove</button> -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
5
src/app/pages/order/mixed-form/mixed-form.component.scss
Normal file
5
src/app/pages/order/mixed-form/mixed-form.component.scss
Normal file
@ -0,0 +1,5 @@
|
||||
div{
|
||||
margin-top: 1rem;
|
||||
}
|
||||
|
||||
|
||||
23
src/app/pages/order/mixed-form/mixed-form.component.spec.ts
Normal file
23
src/app/pages/order/mixed-form/mixed-form.component.spec.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { MixedFormComponent } from './mixed-form.component';
|
||||
|
||||
describe('MixedFormComponent', () => {
|
||||
let component: MixedFormComponent;
|
||||
let fixture: ComponentFixture<MixedFormComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ MixedFormComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(MixedFormComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
52
src/app/pages/order/mixed-form/mixed-form.component.ts
Normal file
52
src/app/pages/order/mixed-form/mixed-form.component.ts
Normal file
@ -0,0 +1,52 @@
|
||||
import { Component, EventEmitter, OnInit, Output } from '@angular/core';
|
||||
import { PageapiService } from '../../pageapi.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-mixed-form',
|
||||
templateUrl: './mixed-form.component.html',
|
||||
styleUrls: ['./mixed-form.component.scss']
|
||||
})
|
||||
export class MixedFormComponent implements OnInit {
|
||||
|
||||
setData:any =[];
|
||||
|
||||
@Output() childButtonEvent = new EventEmitter();
|
||||
|
||||
inputFieldGroups: { qty: string, productSpec: string }[] = [{ qty: '0', productSpec: '' }]; // Array to hold input field groups
|
||||
constructor(public _api:PageapiService) {
|
||||
|
||||
this._api.orderDetails_observable$.subscribe((res) => {
|
||||
console.log('booked', res);
|
||||
|
||||
if(res){
|
||||
this. setData = res.data
|
||||
if( this. setData['ProductDetails.productName'] == "Mixed Gas"){
|
||||
|
||||
|
||||
this.inputFieldGroups[0].qty = this. setData.qty
|
||||
this.inputFieldGroups[0].productSpec = this. setData.productSpec
|
||||
// this.inputFieldGroups.push({ qty: this. setData.qty, productSpec: this. setData.productSpec });
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
addInputFieldGroup() {
|
||||
this.inputFieldGroups.push({ qty: '0', productSpec: '' }); // Add a new input field group to the array
|
||||
this.childButtonEvent.emit( this.inputFieldGroups);
|
||||
}
|
||||
|
||||
removeInputFieldGroup(index: number) {
|
||||
console.log( this.inputFieldGroups)
|
||||
this.inputFieldGroups.splice(index, 1); // Remove the input field group at the specified index
|
||||
this.childButtonEvent.emit( this.inputFieldGroups);
|
||||
}
|
||||
|
||||
pass(){
|
||||
this.childButtonEvent.emit( this.inputFieldGroups);
|
||||
}
|
||||
|
||||
}
|
||||
129
src/app/pages/order/order-form/order-form.component.html
Normal file
129
src/app/pages/order/order-form/order-form.component.html
Normal file
@ -0,0 +1,129 @@
|
||||
<nb-card>
|
||||
<nb-card-header>
|
||||
|
||||
|
||||
<div class="row show-grid">
|
||||
<div class="col-md-6">
|
||||
<div> {{fieldTitle}}</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div style=" text-align: end;">
|
||||
<button (click)="back()" nbButton status="success" hero>
|
||||
Back
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nb-card-header>
|
||||
|
||||
<nb-card-body>
|
||||
|
||||
<div class="row show-grid">
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<nb-select selected="" [(ngModel)]="selectCustomer" >
|
||||
|
||||
<nb-option value="" hidden>Select Customer</nb-option>
|
||||
|
||||
<nb-option *ngFor="let user of customer; index as i; first as isFirst " (click)="checkType(user)" [value]="user['CusDetails.cusName']
|
||||
">{{user['CusDetails.cusName']
|
||||
}}</nb-option>
|
||||
|
||||
</nb-select>
|
||||
<!-- <input type="text" nbInput fullWidth placeholder="Project">-->
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<!-- <nb-select selected="DRIVER" >
|
||||
<nb-option value="DRIVER">DRIVER</nb-option>
|
||||
|
||||
</nb-select> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<!-- <nb-select selected="DRIVER" >
|
||||
<nb-option value="DRIVER">DRIVER</nb-option>
|
||||
|
||||
</nb-select> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<div class="row show-grid" *ngIf="product.length>0">
|
||||
<div class="col-6 col-md-3">
|
||||
<div>
|
||||
<label for="subject" style=" font-weight: 600;">Products: ( <span style="color:#ba0404">{{selectCustomerData['CusDetails.cusType'] ||setData['OrderDetails.CusDetails.cusType'] }}</span>)</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div>
|
||||
<label for="subject" style=" font-weight: 600;width: 30%;">Qty:</label>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<label for="subject" style=" font-weight: 600;">Specification:</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div *ngFor="let item of product; index as j">
|
||||
|
||||
<div class="row show-grid">
|
||||
<div class="col-6 col-md-3">
|
||||
<div *ngIf=" item.productName != 'Mixed Gas'">
|
||||
<label for="subject" style=" font-weight: 600;">{{ item.productName }}</label>
|
||||
<!-- <nb-checkbox [(ngModel)]="item.checked">{{ item.productName }}</nb-checkbox> -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div *ngIf=" item.productName != 'Mixed Gas'">
|
||||
|
||||
<input nbInput type="number" min="0" style="width: 50%;" [(ngModel)]="item.qty">
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div *ngIf=" item.productName != 'Mixed Gas'">
|
||||
<!-- <input nbInput type="text" [(ngModel)]="item.productSpec"> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<ngx-mixed-form (childButtonEvent)="receivedMessageHandler($event)"
|
||||
(onInitEvent)="receiveAutoMsgHandler($event)" *ngIf=" item.productName == 'Mixed Gas'"></ngx-mixed-form>
|
||||
</div>
|
||||
|
||||
|
||||
<nb-card-footer>
|
||||
<div class="row show-grid" *ngIf="product.length>0">
|
||||
<div class="col-6 col-md-3">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-3">
|
||||
<div>
|
||||
<button nbButton status="success" (click)="save()" style="margin-right: 10px;" type="submit" >Submit</button>
|
||||
<button type="button" class="cancel" nbButton status="danger" (click)="back()">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</nb-card-footer>
|
||||
</nb-card-body>
|
||||
</nb-card>
|
||||
54
src/app/pages/order/order-form/order-form.component.scss
Normal file
54
src/app/pages/order/order-form/order-form.component.scss
Normal file
@ -0,0 +1,54 @@
|
||||
nb-card-body {
|
||||
overflow: visible;
|
||||
padding-top: 0;
|
||||
|
||||
> * {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.full-name-inputs,
|
||||
.validation-checkboxes {
|
||||
display: flex;
|
||||
margin: 0 -0.5rem;
|
||||
|
||||
> * {
|
||||
margin: 0 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-radio {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.demo-items {
|
||||
flex: 1 0 33%;
|
||||
}
|
||||
|
||||
nb-select{
|
||||
width: 100%;
|
||||
}
|
||||
@import '../../../@theme/styles/themes';
|
||||
|
||||
@include nb-install-component() {
|
||||
.list-card {
|
||||
nb-card-header {
|
||||
border-bottom: none;
|
||||
}
|
||||
|
||||
nb-card-body {
|
||||
padding: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
nb-card-body{
|
||||
min-height: 100%;
|
||||
}
|
||||
|
||||
input[type=number]::-webkit-inner-spin-button,
|
||||
input[type=number]::-webkit-outer-spin-button {
|
||||
-webkit-appearance: none;
|
||||
-moz-appearance: none;
|
||||
appearance: none;
|
||||
margin: 0;
|
||||
}
|
||||
23
src/app/pages/order/order-form/order-form.component.spec.ts
Normal file
23
src/app/pages/order/order-form/order-form.component.spec.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { OrderFormComponent } from './order-form.component';
|
||||
|
||||
describe('OrderFormComponent', () => {
|
||||
let component: OrderFormComponent;
|
||||
let fixture: ComponentFixture<OrderFormComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ OrderFormComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(OrderFormComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
239
src/app/pages/order/order-form/order-form.component.ts
Normal file
239
src/app/pages/order/order-form/order-form.component.ts
Normal file
@ -0,0 +1,239 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { PageapiService } from '../../pageapi.service';
|
||||
import { NbComponentStatus, NbGlobalPhysicalPosition, NbGlobalPosition, NbToastrService, NbWindowControlButtonsConfig, NbWindowRef, NbWindowService } from '@nebular/theme';
|
||||
import { SmartTableData } from '../../../@core/data/smart-table';
|
||||
import { OrderSummaryFormComponent } from '../order-summary-form/order-summary-form.component';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-order-form',
|
||||
templateUrl: './order-form.component.html',
|
||||
styleUrls: ['./order-form.component.scss']
|
||||
})
|
||||
export class OrderFormComponent implements OnInit {
|
||||
customer:any =[];
|
||||
product:any =[];
|
||||
mixedGas:any =[];
|
||||
selectCustomer:any ="";
|
||||
items = [
|
||||
{ label: 'Item 1', quantity: 0 },
|
||||
{ label: 'Item 2', quantity: 0 },
|
||||
{ label: 'Item 3', quantity: 0 }
|
||||
];
|
||||
fieldTitle:any =' New Order'
|
||||
minimize = false;
|
||||
maximize = false;
|
||||
fullScreen = true;
|
||||
close = true;
|
||||
formData:any=[]
|
||||
index = 1;
|
||||
destroyByClick = true;
|
||||
duration = 2000;
|
||||
hasIcon = true;
|
||||
setData:any =[];
|
||||
position: NbGlobalPosition = NbGlobalPhysicalPosition.TOP_RIGHT;
|
||||
preventDuplicates = false;
|
||||
status: NbComponentStatus = 'primary';
|
||||
selectCustomerData :any =[];
|
||||
constructor(private route :ActivatedRoute,private router: Router,public _api:PageapiService,private toastrService: NbToastrService,private service: SmartTableData ,private windowService: NbWindowService) {
|
||||
|
||||
this._api.orderDetails_observable$.subscribe((res) => {
|
||||
console.log('booked', res);
|
||||
|
||||
if(res){
|
||||
this. setData = res.data
|
||||
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
}
|
||||
receivedMessageHandler(res){
|
||||
console.log(res, this.product)
|
||||
let tmp =[];
|
||||
this.product.forEach(element => {
|
||||
if(element.productName == "Mixed Gas"){
|
||||
|
||||
tmp.push(element)
|
||||
}
|
||||
|
||||
});
|
||||
let tmp2 = [];
|
||||
res.forEach(element => {
|
||||
tmp2.push({"productName": tmp[0].productName , id: tmp[0].id ,qty:element.qty, productSpec:element.productSpec})
|
||||
});
|
||||
this.mixedGas = tmp2
|
||||
console.log(tmp2)
|
||||
}
|
||||
receiveAutoMsgHandler(p) {
|
||||
console.log(p)
|
||||
}
|
||||
ngOnInit(): void {
|
||||
console.log(this.setData)
|
||||
if(this.setData != undefined){
|
||||
|
||||
|
||||
if( Object.keys(this.setData).length != 0){
|
||||
this.fieldTitle = 'Edit Order'
|
||||
}
|
||||
}
|
||||
this.getuserlistApi()
|
||||
|
||||
}
|
||||
|
||||
|
||||
getuserlistApi(){
|
||||
let param={}
|
||||
this._api.getusers(param).subscribe(res => {
|
||||
|
||||
if(res.status == 200){
|
||||
|
||||
let passData = res.data
|
||||
|
||||
let customer = passData.filter(arr=>{return arr.role == 'CUSTOMER'})
|
||||
customer.forEach((element:any, index) => {
|
||||
element.index = index +1
|
||||
|
||||
});
|
||||
console.log(customer)
|
||||
this.customer = customer
|
||||
if( Object.keys(this.setData).length != 0){
|
||||
this.selectCustomer = this.setData['OrderDetails.CusDetails.cusName']
|
||||
this.setData['OrderDetails.CusDetails.cusType']
|
||||
this.getProductlistApi( this.setData['OrderDetails.CusDetails.cusType'])
|
||||
// console.log(data)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
getProductlistApi(param){
|
||||
let data ={type : param}
|
||||
this._api.getProducts(data).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
let passData = res.data
|
||||
let product = passData
|
||||
|
||||
product.forEach((element:any, index) => {
|
||||
element.index = index +1
|
||||
element.qty = 0;
|
||||
});
|
||||
|
||||
this.product = product
|
||||
if(this.setData != undefined){
|
||||
if( Object.keys(this.setData).length != 0){
|
||||
|
||||
|
||||
this.product.forEach(element => {
|
||||
if(element.productName == this.setData['ProductDetails.productName'] ){
|
||||
element.qty = this.setData.qty
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
// console.log(data)
|
||||
|
||||
}else{
|
||||
this.product = [];
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
checkType(data){
|
||||
console.log(data)
|
||||
this.selectCustomerData = data
|
||||
let productType = data['CusDetails.cusType']
|
||||
console.log(productType)
|
||||
this. getProductlistApi(productType)
|
||||
|
||||
}
|
||||
cancel(){
|
||||
|
||||
}
|
||||
|
||||
save(){
|
||||
|
||||
console.log(this.selectCustomer)
|
||||
let product= this.product.filter(arr=>{return arr.qty != 0})
|
||||
|
||||
console.log( product)
|
||||
if(this.setData != undefined){
|
||||
|
||||
|
||||
if( Object.keys(this.setData).length != 0){
|
||||
product.forEach(element => {
|
||||
element.productSpec = this. setData.productSpec
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const buttonsConfig: NbWindowControlButtonsConfig = {
|
||||
minimize: this.minimize,
|
||||
maximize: this.maximize,
|
||||
fullScreen: this.fullScreen,
|
||||
close: this.close,
|
||||
};
|
||||
let config= {
|
||||
hasBackdrop: true,
|
||||
width: '500px',
|
||||
height: '300px',
|
||||
}
|
||||
|
||||
|
||||
let results = [ ...this.mixedGas, ...product];
|
||||
|
||||
if(results.length>0){
|
||||
|
||||
|
||||
|
||||
let passData = {name:this.selectCustomer,product:results,customerData:this.selectCustomerData}
|
||||
|
||||
const windowRef: NbWindowRef = this.windowService.open(OrderSummaryFormComponent, { title: ` Order Summary (`+this.selectCustomer+`)`, context:passData,buttons: buttonsConfig , });
|
||||
|
||||
|
||||
|
||||
// Subscribe to the afterClosed event
|
||||
windowRef.onClose.subscribe((data) => {
|
||||
// Handle the window closure
|
||||
console.log(data);
|
||||
if(data == 1){
|
||||
this.showToast('success', 'Data Saved Successfully', 'New Order Placed..!');
|
||||
// this.getuserlistApi();
|
||||
setTimeout(() => {
|
||||
this.router.navigate(['../'], { relativeTo: this.route });
|
||||
}, 500);
|
||||
console.log('Window closed 123');
|
||||
}else if(data == 0){
|
||||
this.showToast('warning', 'Somthing is Wrong...!', 'Order Placed Failed..!');
|
||||
}
|
||||
});
|
||||
}else{
|
||||
this.showToast('warning', 'Please Fill Request Fields...!', '');
|
||||
}
|
||||
}
|
||||
private showToast(type: NbComponentStatus, title: string, body: string) {
|
||||
const config = {
|
||||
status: type,
|
||||
destroyByClick: this.destroyByClick,
|
||||
duration: this.duration,
|
||||
hasIcon: this.hasIcon,
|
||||
position: this.position,
|
||||
preventDuplicates: this.preventDuplicates,
|
||||
};
|
||||
const titleContent = title ? ` ${title}` : '';
|
||||
|
||||
this.index += 1;
|
||||
this.toastrService.show(
|
||||
body,
|
||||
`${titleContent}`,
|
||||
config);
|
||||
}
|
||||
|
||||
back(){
|
||||
this.router.navigate(['../'], { relativeTo: this.route });
|
||||
}
|
||||
}
|
||||
@ -0,0 +1,77 @@
|
||||
<div class="row show-grid" *ngIf="product.length>0">
|
||||
<div class="col-6 col-md-12">
|
||||
<!-- <div style="text-align: center;">
|
||||
Name : <label for="subject" style=" font-weight: 600;">{{ data.name }}</label>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="col-6 col-md-12">
|
||||
<div>
|
||||
|
||||
<ul >
|
||||
<div class="row show-grid">
|
||||
<div class="col-6 col-md-4">
|
||||
<div style=" font-weight: 600;">
|
||||
Products
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div style=" font-weight: 600;">
|
||||
Qty
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-6">
|
||||
<div style=" font-weight: 600;">
|
||||
Specification
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<li *ngFor="let item of data.product" >
|
||||
|
||||
|
||||
<div class="row show-grid">
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
{{ item.productName }}
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-2">
|
||||
<div>
|
||||
{{ item.qty }}
|
||||
<!-- <input nbInput type="number" [(ngModel)]="item.qty"> -->
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-6">
|
||||
<div>
|
||||
{{ item.productSpec }}
|
||||
<!-- <input nbInput type="number" [(ngModel)]="item.qty"> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</li>
|
||||
</ul>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="row show-grid" >
|
||||
<div class="col-6">
|
||||
<div>
|
||||
<button type="button" class="cancel" nbButton status="danger" (click)="cancel()">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="col-6">
|
||||
<div>
|
||||
<button nbButton status="success" (click)="save()" type="submit" >Confirm</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
@ -0,0 +1,3 @@
|
||||
div{
|
||||
padding: 1px;
|
||||
}
|
||||
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { OrderSummaryFormComponent } from './order-summary-form.component';
|
||||
|
||||
describe('OrderSummaryFormComponent', () => {
|
||||
let component: OrderSummaryFormComponent;
|
||||
let fixture: ComponentFixture<OrderSummaryFormComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ OrderSummaryFormComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(OrderSummaryFormComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,74 @@
|
||||
import { Component, Inject, OnInit } from '@angular/core';
|
||||
import { NB_WINDOW_CONTEXT, NbWindowRef, NbWindowService } from '@nebular/theme';
|
||||
import { PageapiService } from '../../pageapi.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-order-summary-form',
|
||||
templateUrl: './order-summary-form.component.html',
|
||||
styleUrls: ['./order-summary-form.component.scss']
|
||||
})
|
||||
export class OrderSummaryFormComponent implements OnInit {
|
||||
customer:any =[];
|
||||
product:any =[];
|
||||
setData:any =[];
|
||||
constructor(@Inject(NB_WINDOW_CONTEXT) public data: any,public _api:PageapiService,private windowService: NbWindowService, private windowRef: NbWindowRef) {
|
||||
|
||||
console.log(this.data)
|
||||
this.customer = this.data.name
|
||||
this.product = this.data.product
|
||||
|
||||
this._api.orderDetails_observable$.subscribe((res) => {
|
||||
console.log('booked', res);
|
||||
|
||||
if(res){
|
||||
this. setData = res.data
|
||||
|
||||
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
this.customer = this.data.name
|
||||
this.product = this.data.product
|
||||
}
|
||||
|
||||
save(){
|
||||
console.log(this.data)
|
||||
let cus = this.data.customerData['CusDetails.id']
|
||||
let role = localStorage.getItem('user_role')
|
||||
let param;
|
||||
if(this.setData != undefined){
|
||||
if(this.setData.hasOwnProperty('id')){
|
||||
param ={id:this.setData.id,customerId:cus,status:'ordered' , product: this.data.product ,createdBy:role }
|
||||
}else{
|
||||
param ={customerId:cus,status:'ordered' , product: this.data.product ,createdBy:role }
|
||||
}
|
||||
}else{
|
||||
param ={customerId:cus,status:'ordered' , product: this.data.product ,createdBy:role }
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
this._api.CreateOrder (param).subscribe(res => {
|
||||
if (res.status == 200) {
|
||||
console.log(res)
|
||||
this.windowRef.close(1);
|
||||
}else{
|
||||
this.windowRef.close(0);
|
||||
}
|
||||
})
|
||||
}
|
||||
cancel(){
|
||||
this.windowService
|
||||
console.log( this.windowService)
|
||||
this.windowRef.close();
|
||||
}
|
||||
}
|
||||
62
src/app/pages/order/order.component.html
Normal file
62
src/app/pages/order/order.component.html
Normal file
@ -0,0 +1,62 @@
|
||||
<nb-card>
|
||||
<nb-card-header>
|
||||
|
||||
<div class="row show-grid">
|
||||
<div class="col-md-6">
|
||||
<div> <nb-icon icon="shopping-bag-outline"></nb-icon> Order Management</div>
|
||||
</div>
|
||||
<div class="col-md-6">
|
||||
<div style=" text-align: end;">
|
||||
<!-- <button (click)="Assign()" nbButton status="primary" hero>
|
||||
Assign Driver
|
||||
</button> -->
|
||||
<!-- <button (click)="addOrder()" nbButton status="primary" hero>
|
||||
Add Order
|
||||
</button> -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</nb-card-header>
|
||||
|
||||
<nb-card-body>
|
||||
<ng2-smart-table [settings]="settings" (userRowSelect)="onUserRowSelect($event)" [source]="source" (edit)="onSaveConfirm($event)"
|
||||
(create)="onCreateConfirm($event)" (delete)="onDeleteConfirm($event)">
|
||||
</ng2-smart-table>
|
||||
</nb-card-body>
|
||||
|
||||
|
||||
<nb-card-footer>
|
||||
<form class="form" [formGroup]="driverForm" (ngSubmit)="onSubmit()">
|
||||
<div class="row show-grid">
|
||||
<div class="col-md-4">
|
||||
<div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div>
|
||||
|
||||
<!-- <label for="subject">Drivers:</label> <br /> -->
|
||||
<nb-select selected="" formControlName="driver" style="width: 100% !important;" >
|
||||
<nb-option value="">Select Drivers</nb-option>
|
||||
|
||||
<nb-option *ngFor="let user of drivers; index as i; first as isFirst " (click)="checkType(user)" [value]="user.id
|
||||
">{{user.userName }}</nb-option>
|
||||
|
||||
|
||||
</nb-select>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-md-4">
|
||||
<div style=" text-align: end;">
|
||||
<button [disabled]="!driverForm.valid" type="submit" nbButton status="primary" hero>
|
||||
Assign Orders
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</form>
|
||||
</nb-card-footer>
|
||||
|
||||
</nb-card>
|
||||
23
src/app/pages/order/order.component.scss
Normal file
23
src/app/pages/order/order.component.scss
Normal file
@ -0,0 +1,23 @@
|
||||
|
||||
td ,input[type="checkbox"] {
|
||||
font-size: 1px !important;
|
||||
}
|
||||
|
||||
.highlight-cell {
|
||||
background-color: yellow;
|
||||
/* Add any other styling properties as desired */
|
||||
}
|
||||
|
||||
::ng-deep .ng2-smart-action-multiple-select{
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
::ng-deep .ng2-smart-action-multiple-select > input{
|
||||
width:15px;
|
||||
height:15px;
|
||||
display: unset;
|
||||
}
|
||||
|
||||
::ng-deep .desired-value-row{
|
||||
color: red !important;
|
||||
}
|
||||
23
src/app/pages/order/order.component.spec.ts
Normal file
23
src/app/pages/order/order.component.spec.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { OrderComponent } from './order.component';
|
||||
|
||||
describe('OrderComponent', () => {
|
||||
let component: OrderComponent;
|
||||
let fixture: ComponentFixture<OrderComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ OrderComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(OrderComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
376
src/app/pages/order/order.component.ts
Normal file
376
src/app/pages/order/order.component.ts
Normal file
@ -0,0 +1,376 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { DomSanitizer } from '@angular/platform-browser';
|
||||
|
||||
import { LocalDataSource } from 'ng2-smart-table';
|
||||
import { SmartTableData } from '../../@core/data/smart-table';
|
||||
import { PageapiService } from '../pageapi.service';
|
||||
import { NbToastrService, NbWindowControlButtonsConfig, NbWindowRef, NbWindowService } from '@nebular/theme';
|
||||
|
||||
|
||||
|
||||
import {
|
||||
NbComponentStatus,
|
||||
NbGlobalLogicalPosition,
|
||||
NbGlobalPhysicalPosition,
|
||||
NbGlobalPosition,
|
||||
|
||||
NbToastrConfig,
|
||||
} from '@nebular/theme';
|
||||
import { Router } from '@angular/router';
|
||||
import { CancelFormComponent } from './cancel-form/cancel-form.component';
|
||||
import { AssignFormComponent } from './assign-form/assign-form.component';
|
||||
import { FormControl, FormGroup, Validators } from '@angular/forms';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-order',
|
||||
templateUrl: './order.component.html',
|
||||
styleUrls: ['./order.component.scss']
|
||||
})
|
||||
export class OrderComponent {
|
||||
|
||||
settings:any =[];
|
||||
source: LocalDataSource = new LocalDataSource();
|
||||
minimize = false;
|
||||
maximize = false;
|
||||
fullScreen = true;
|
||||
close = true;
|
||||
formData:any=[]
|
||||
index = 1;
|
||||
destroyByClick = true;
|
||||
duration = 2000;
|
||||
selectedRows:any=[];
|
||||
hasIcon = true;
|
||||
position: NbGlobalPosition = NbGlobalPhysicalPosition.TOP_RIGHT;
|
||||
preventDuplicates = false;
|
||||
drivers:any=[];
|
||||
status: NbComponentStatus = 'primary';
|
||||
driverForm:any =[];
|
||||
constructor(private domSanitizer: DomSanitizer, private router:Router,private toastrService: NbToastrService,private service: SmartTableData,public _api:PageapiService,private windowService: NbWindowService) {
|
||||
const data = this.service.getData();
|
||||
|
||||
this.settings = {
|
||||
selectMode: 'multi',
|
||||
|
||||
actions: {
|
||||
|
||||
position: 'right', // left|right
|
||||
},
|
||||
mode: 'external',
|
||||
userRowSelect: (selectedRows: any[]) => {
|
||||
this.handleRowSelection(selectedRows);
|
||||
},
|
||||
add: {
|
||||
addButtonContent: '<i class="nb-plus"></i>',
|
||||
createButtonContent: '<i class="nb-checkmark"></i>',
|
||||
cancelButtonContent: '<i class="nb-close"></i>',
|
||||
},
|
||||
edit: {
|
||||
editButtonContent: '<i class="nb-edit"></i>',
|
||||
saveButtonContent: '<i class="nb-checkmark"></i>',
|
||||
cancelButtonContent: '<i class="nb-close"></i>',
|
||||
},
|
||||
delete: {
|
||||
deleteButtonContent: '<i class="nb-trash"></i>',
|
||||
confirmDelete: true,
|
||||
},
|
||||
columns: {
|
||||
|
||||
index: {
|
||||
title: 'ID',
|
||||
type: 'number',
|
||||
width:"10px"
|
||||
},
|
||||
orderId: {
|
||||
title: 'Order ID',
|
||||
type: 'string',
|
||||
|
||||
},
|
||||
'OrderDetails.CusDetails.cusName': {
|
||||
title: 'Customer Name',
|
||||
type: 'string',
|
||||
width:"40px"
|
||||
},
|
||||
'ProductDetails.productName': {
|
||||
title: 'Product',
|
||||
type: 'string',
|
||||
|
||||
},
|
||||
qty: {
|
||||
title: 'Qty',
|
||||
type: 'string',
|
||||
width:"10px",
|
||||
rowClass: (row) => {
|
||||
// Function to determine the row class based on the value of a specific column
|
||||
const columnName = 'qty'; // Specify the name of the desired column
|
||||
const desiredValue = 'qty'; // Specify the desired value for the row color
|
||||
|
||||
if (row[columnName] === desiredValue) {
|
||||
return 'desired-value-row'; // CSS class for rows with the desired value
|
||||
} else {
|
||||
return ''; // CSS class for other rows
|
||||
}
|
||||
}
|
||||
},
|
||||
status: {
|
||||
title: 'Status',
|
||||
type: 'string',
|
||||
valuePrepareFunction: (cell, row) => {
|
||||
// Add a string value to the column
|
||||
|
||||
if(cell == "Out For Delivery"){
|
||||
return cell + " ("+ row["UserDetails.userName"]+")";
|
||||
|
||||
}else{
|
||||
|
||||
}
|
||||
return cell ; // Modify this as per your requirement
|
||||
}
|
||||
|
||||
},
|
||||
reason: {
|
||||
title: 'Cancel Reason',
|
||||
type: 'string',
|
||||
width:"25px"
|
||||
},
|
||||
|
||||
},
|
||||
};
|
||||
|
||||
|
||||
this.getorderlistApi()
|
||||
|
||||
this. getDriverlistApi()
|
||||
|
||||
this.driverForm = new FormGroup({
|
||||
|
||||
|
||||
driver: new FormControl('', [ Validators.required])
|
||||
|
||||
});
|
||||
|
||||
|
||||
}
|
||||
|
||||
onDeleteConfirm(event): void {
|
||||
console.log(event)
|
||||
let passData = event.data
|
||||
|
||||
const buttonsConfig: NbWindowControlButtonsConfig = {
|
||||
minimize: this.minimize,
|
||||
maximize: this.maximize,
|
||||
fullScreen: this.fullScreen,
|
||||
close: this.close,
|
||||
};
|
||||
const windowRef: NbWindowRef = this.windowService.open(CancelFormComponent, { title: `Cancel Product`, context: event.data
|
||||
, buttons: buttonsConfig });
|
||||
|
||||
|
||||
|
||||
// Subscribe to the afterClosed event
|
||||
windowRef.onClose.subscribe((data) => {
|
||||
// Handle the window closure
|
||||
console.log(data);
|
||||
if(data == 1){
|
||||
this.showToast('success', 'Data Changed Successfully', 'Order Cancel Completed..!');
|
||||
this.getorderlistApi();
|
||||
console.log('Window closed 123');
|
||||
}else if(data == 0){
|
||||
this.showToast('warning', 'Somthing is Wrong...!', 'Order Cancel Failed..!');
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
|
||||
}
|
||||
|
||||
getFuelColor(w){
|
||||
console.log(w)
|
||||
}
|
||||
onCreateConfirm(event) {
|
||||
console.log("Create Event In Console")
|
||||
console.log(event);
|
||||
const buttonsConfig: NbWindowControlButtonsConfig = {
|
||||
minimize: this.minimize,
|
||||
maximize: this.maximize,
|
||||
fullScreen: this.fullScreen,
|
||||
close: this.close,
|
||||
};
|
||||
let config= {
|
||||
hasBackdrop: true,
|
||||
width: '500px',
|
||||
height: '300px',
|
||||
}
|
||||
this.addOrder()
|
||||
}
|
||||
|
||||
onSaveConfirm(event) {
|
||||
console.log("Edit Event In Console")
|
||||
console.log(event);
|
||||
|
||||
const buttonsConfig: NbWindowControlButtonsConfig = {
|
||||
minimize: this.minimize,
|
||||
maximize: this.maximize,
|
||||
fullScreen: this.fullScreen,
|
||||
close: this.close,
|
||||
};
|
||||
console.log("add")
|
||||
this._api.orderDetails.next(event)
|
||||
|
||||
|
||||
|
||||
this.router.navigate(['/pages/order/add'])
|
||||
}
|
||||
|
||||
|
||||
getorderlistApi(){
|
||||
let param ={}
|
||||
this._api.getOrders(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
let passData = res.data
|
||||
passData.sort((a: any, b: any) => {
|
||||
return b.id - a.id;
|
||||
});
|
||||
passData.forEach((element:any, index) => {
|
||||
element.index = index +1
|
||||
|
||||
});
|
||||
// console.log(data)
|
||||
this.source.load(passData);
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
private showToast(type: NbComponentStatus, title: string, body: string) {
|
||||
const config = {
|
||||
status: type,
|
||||
destroyByClick: this.destroyByClick,
|
||||
duration: this.duration,
|
||||
hasIcon: this.hasIcon,
|
||||
position: this.position,
|
||||
preventDuplicates: this.preventDuplicates,
|
||||
};
|
||||
const titleContent = title ? ` ${title}` : '';
|
||||
|
||||
this.index += 1;
|
||||
this.toastrService.show(
|
||||
body,
|
||||
`${titleContent}`,
|
||||
config);
|
||||
}
|
||||
|
||||
addOrder(){
|
||||
console.log("add")
|
||||
this._api.orderDetails.next(null)
|
||||
this.router.navigate(['/pages/order/add'])
|
||||
}
|
||||
|
||||
handleRowSelection(selectedRows: any[]) {
|
||||
// Get the selected row data
|
||||
const selectedData = selectedRows.map(row => row.data);
|
||||
console.log(selectedData);
|
||||
}
|
||||
onUserRowSelect(event) {
|
||||
console.log(event)
|
||||
this.selectedRows = event.selected;
|
||||
}
|
||||
|
||||
Assign(){
|
||||
console.log(1)
|
||||
if(this.selectedRows.length>0){
|
||||
|
||||
|
||||
const buttonsConfig: NbWindowControlButtonsConfig = {
|
||||
minimize: this.minimize,
|
||||
maximize: this.maximize,
|
||||
fullScreen: this.fullScreen,
|
||||
close: this.close,
|
||||
};
|
||||
const windowRef: NbWindowRef = this.windowService.open(AssignFormComponent, { title: `Assign Driver`, context: this.selectedRows
|
||||
|
||||
, buttons: buttonsConfig });
|
||||
|
||||
|
||||
|
||||
// Subscribe to the afterClosed event
|
||||
windowRef.onClose.subscribe((data) => {
|
||||
// Handle the window closure
|
||||
console.log(data);
|
||||
if(data == 1){
|
||||
this.showToast('success', 'Data Changed Successfully', 'Driver Assign Completed..!');
|
||||
this.getorderlistApi();
|
||||
console.log('Window closed 123');
|
||||
}else if(data == 0){
|
||||
this.showToast('warning', 'Somthing is Wrong...!', 'Driver Assign Failed..!');
|
||||
}
|
||||
|
||||
|
||||
});
|
||||
}else{
|
||||
this.showToast('warning', 'Somthing is Wrong...!', 'Please Select Orders..!');
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
getDriverlistApi(){
|
||||
let param ={}
|
||||
this._api.getusers(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
let passData = res.data
|
||||
let driver = passData.filter(arr=>{return arr.role == 'DRIVER'})
|
||||
driver.sort((a: any, b: any) => {
|
||||
return b.id - a.id;
|
||||
});
|
||||
driver.forEach((element:any, index) => {
|
||||
element.index = index +1
|
||||
|
||||
});
|
||||
|
||||
|
||||
|
||||
this.drivers = driver
|
||||
// console.log(data)
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
onSubmit(){
|
||||
if(this.selectedRows.length>0){
|
||||
|
||||
|
||||
console.log( this.selectedRows , this.driverForm.value)
|
||||
let tmp=[];
|
||||
this.selectedRows.forEach(element => {
|
||||
tmp.push({id:element.id ,driverId: this.driverForm.value.driver , status:'Out For Delivery' })
|
||||
|
||||
});
|
||||
|
||||
let param ={driver:tmp}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
this._api.CreateOrder (param).subscribe(res => {
|
||||
if (res.status == 200) {
|
||||
console.log(res)
|
||||
this.showToast('success', 'Data Changed Successfully', 'Orders Assign Completed..!');
|
||||
this.getorderlistApi();
|
||||
}else{
|
||||
this.showToast('warning', 'Somthing is Wrong...!', 'Orders Assign Failed..!');
|
||||
}
|
||||
})
|
||||
}else{
|
||||
this.showToast('warning', 'Somthing is Wrong...!', 'Please Select Orders..!');
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
@ -10,18 +10,25 @@ import { environment } from '../../environments/environment';
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class PageapiService {
|
||||
public orderDetails:BehaviorSubject<any> = new BehaviorSubject<any>([]);
|
||||
public orderDetails_observable$ = this.orderDetails.asObservable();
|
||||
private apiUrl = environment.apiEndpoint;
|
||||
constructor(private _http: HttpClient) { }
|
||||
|
||||
|
||||
getusers(): Observable<any> {
|
||||
getusers(param): Observable<any> {
|
||||
//console.log(params.email)
|
||||
return this._http.get<any>(this.apiUrl + "getusers")
|
||||
return this._http.post<any>(this.apiUrl + "getusers",param)
|
||||
|
||||
}
|
||||
getProducts(): Observable<any> {
|
||||
getProducts(param): Observable<any> {
|
||||
//console.log(params.email)
|
||||
return this._http.get<any>(this.apiUrl + "getProducts")
|
||||
return this._http.post<any>(this.apiUrl + "getProducts",param)
|
||||
|
||||
}
|
||||
|
||||
getOrders(param): Observable<any> {
|
||||
//console.log(params.email)
|
||||
return this._http.post<any>(this.apiUrl + "getOrders",param)
|
||||
|
||||
}
|
||||
addUserFormDetails(addParams): Observable<any> {
|
||||
@ -37,8 +44,11 @@ export class PageapiService {
|
||||
return this._http.post(this.apiUrl + 'CreateProducts', addParams)
|
||||
|
||||
}
|
||||
CreateOrder(addParams): Observable<any> {
|
||||
return this._http.post(this.apiUrl + 'CreateOrder', addParams)
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
@ -10,7 +10,7 @@ export const MENU_ITEMS: NbMenuItem[] = [
|
||||
{
|
||||
title: 'Orders',
|
||||
icon: 'shopping-bag-outline',
|
||||
link: '/pages/dashboard',
|
||||
link: '/pages/order',
|
||||
home: true,
|
||||
},
|
||||
{
|
||||
@ -49,6 +49,12 @@ export const MENU_ITEMS: NbMenuItem[] = [
|
||||
link: '/pages/dashboard',
|
||||
home: true,
|
||||
},
|
||||
{
|
||||
title: 'Settings',
|
||||
icon: 'settings-2-outline',
|
||||
link: '/pages/profile',
|
||||
home: true,
|
||||
},
|
||||
// {
|
||||
// title: 'Auth',
|
||||
// icon: 'lock-outline',
|
||||
|
||||
@ -7,9 +7,14 @@ import { UsersComponent } from './users/users.component';
|
||||
import { CustomerComponent } from './customer/customer.component';
|
||||
import { DriverComponent } from './driver/driver.component';
|
||||
import { ProductComponent } from './product/product.component';
|
||||
import { AuthGuard } from './_guard/auth.guard';
|
||||
import { OrderComponent } from './order/order.component';
|
||||
import { OrderFormComponent } from './order/order-form/order-form.component';
|
||||
import { ProfileComponent } from './profile/profile.component';
|
||||
|
||||
const routes: Routes = [{
|
||||
path: '',
|
||||
|
||||
component: PagesComponent,
|
||||
children: [
|
||||
{
|
||||
@ -34,14 +39,21 @@ const routes: Routes = [{
|
||||
path: 'product',
|
||||
component: ProductComponent,
|
||||
},
|
||||
|
||||
{
|
||||
path: 'order',
|
||||
component: OrderComponent,
|
||||
},
|
||||
{
|
||||
path: 'profile',
|
||||
component: ProfileComponent,
|
||||
},
|
||||
{
|
||||
path: 'order/add',
|
||||
component: OrderFormComponent,
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
path: '',
|
||||
redirectTo: 'dashboard',
|
||||
pathMatch: 'full',
|
||||
},
|
||||
|
||||
],
|
||||
}];
|
||||
|
||||
|
||||
@ -16,3 +16,4 @@
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { NbDialogModule, NbMenuModule } from '@nebular/theme';
|
||||
import { NgModule,NO_ERRORS_SCHEMA ,CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
|
||||
import { NbDialogModule, NbListModule, NbMenuModule } from '@nebular/theme';
|
||||
|
||||
import { ThemeModule } from '../@theme/theme.module';
|
||||
import { PagesComponent } from './pages.component';
|
||||
@ -30,6 +30,14 @@ import { DriverComponent } from './driver/driver.component';
|
||||
import { DriverFormComponent } from './driver/driver-form/driver-form.component';
|
||||
import { ProductComponent } from './product/product.component';
|
||||
import { ProductFormComponent } from './product/product-form/product-form.component';
|
||||
import { OrderComponent } from './order/order.component';
|
||||
import { OrderFormComponent } from './order/order-form/order-form.component';
|
||||
import { OrderSummaryFormComponent } from './order/order-summary-form/order-summary-form.component';
|
||||
import { CancelFormComponent } from './order/cancel-form/cancel-form.component';
|
||||
import { AssignFormComponent } from './order/assign-form/assign-form.component';
|
||||
import { ProfileComponent } from './profile/profile.component';
|
||||
import { MixedFormComponent } from './order/mixed-form/mixed-form.component';
|
||||
import { AuthComponent } from './auth/auth/auth.component';
|
||||
@NgModule({
|
||||
imports: [
|
||||
PagesRoutingModule,
|
||||
@ -54,6 +62,7 @@ import { ProductFormComponent } from './product/product-form/product-form.compon
|
||||
NbIconModule,
|
||||
NbInputModule,
|
||||
ThemeModule,
|
||||
NbListModule,
|
||||
NbDialogModule.forChild(),
|
||||
Ng2SmartTableModule,
|
||||
],
|
||||
@ -68,7 +77,16 @@ import { ProductFormComponent } from './product/product-form/product-form.compon
|
||||
DriverFormComponent,
|
||||
ProductComponent,
|
||||
ProductFormComponent,
|
||||
OrderComponent,
|
||||
OrderFormComponent,
|
||||
OrderSummaryFormComponent,
|
||||
CancelFormComponent,
|
||||
AssignFormComponent,
|
||||
ProfileComponent,
|
||||
MixedFormComponent,
|
||||
AuthComponent,
|
||||
],
|
||||
schemas: [CUSTOM_ELEMENTS_SCHEMA,NO_ERRORS_SCHEMA],
|
||||
})
|
||||
export class PagesModule {
|
||||
}
|
||||
|
||||
@ -169,7 +169,8 @@ export class ProductComponent {
|
||||
|
||||
|
||||
getProductlistApi(){
|
||||
this._api.getProducts().subscribe(res => {
|
||||
let param ={}
|
||||
this._api.getProducts(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
|
||||
77
src/app/pages/profile/profile.component.html
Normal file
77
src/app/pages/profile/profile.component.html
Normal file
@ -0,0 +1,77 @@
|
||||
<form class="form" [formGroup]="userForm" (ngSubmit)="onSubmit()">
|
||||
<div class="row">
|
||||
<div class="col-lg-10">
|
||||
<nb-card>
|
||||
<nb-card-header>Profile Settings</nb-card-header>
|
||||
<nb-card-body>
|
||||
<input type="text" nbInput fullWidth formControlName="userName" placeholder="Name">
|
||||
<ng-container nbInputErrorMessage>
|
||||
<div style="color:#7c0e0e" *ngIf="userForm.get('userName').hasError('required') && userForm.get('userName').touched">Name is required.</div>
|
||||
|
||||
|
||||
</ng-container>
|
||||
<div class="full-name-inputs">
|
||||
<input type="password" formControlName="password" nbInput fullWidth placeholder="New Password">
|
||||
<ng-container nbInputErrorMessage>
|
||||
|
||||
|
||||
<!-- <div style="color:#7c0e0e" *ngIf="!userForm.get('password')?.errors?.required">
|
||||
Password length must be greater than or equal to 8 and password must contain one or more uppercase , lowercase , numeric and special characters
|
||||
</div> -->
|
||||
<div style="color:#7c0e0e" *ngIf="userForm.get('password')?.invalid && (userForm.get('password')?.dirty || userForm.get('password')?.touched) && userForm.get('password')?.errors?.required">
|
||||
Password is required
|
||||
</div>
|
||||
</ng-container>
|
||||
<input type="password" formControlName="password2" nbInput fullWidth placeholder="Confirm Password">
|
||||
<ng-container nbInputErrorMessage>
|
||||
|
||||
|
||||
<!-- <div style="color:#7c0e0e" *ngIf="!userForm.get('password')?.errors?.required">
|
||||
Password length must be greater than or equal to 8 and password must contain one or more uppercase , lowercase , numeric and special characters
|
||||
</div> -->
|
||||
<div style="color:#7c0e0e" *ngIf="userForm.get('password2')?.invalid && (userForm.get('password2')?.dirty || userForm.get('password2')?.touched) && userForm.get('password2')?.errors?.required">
|
||||
Confirm Password is required
|
||||
</div>
|
||||
</ng-container>
|
||||
</div>
|
||||
<input type="email" formControlName="email" nbInput fullWidth placeholder="E-mail">
|
||||
<ng-container nbInputErrorMessage>
|
||||
<div style="color:#7c0e0e" *ngIf="userForm.get('email').hasError('required') && userForm.get('email').touched">Email is required.</div>
|
||||
|
||||
<div style="color:#7c0e0e" *ngIf="!userForm.get('email')?.errors?.required && (userForm.get('email')?.errors?.pattern)">
|
||||
Please enter a valid email address
|
||||
</div>
|
||||
</ng-container>
|
||||
<input type="number" formControlName="mobileNo" nbInput fullWidth placeholder="Mobile No">
|
||||
<ng-container nbInputErrorMessage>
|
||||
<div style="color:#7c0e0e" *ngIf="userForm.get('mobileNo').hasError('required') && userForm.get('mobileNo').touched">Mobile No is required.</div>
|
||||
|
||||
|
||||
</ng-container>
|
||||
<nb-card-footer>
|
||||
<div class="row show-grid" >
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
<button type="button" class="cancel" nbButton status="danger" (click)="close()">Cancel</button>
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4">
|
||||
<div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<div class="col-6 col-md-4" style="text-align: end;">
|
||||
<div>
|
||||
<button nbButton status="success" type="submit" >Save</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</nb-card-footer>
|
||||
</nb-card-body>
|
||||
</nb-card>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</form>
|
||||
27
src/app/pages/profile/profile.component.scss
Normal file
27
src/app/pages/profile/profile.component.scss
Normal file
@ -0,0 +1,27 @@
|
||||
nb-card-body {
|
||||
overflow: visible;
|
||||
padding-top: 0;
|
||||
|
||||
> * {
|
||||
margin-top: 1rem;
|
||||
}
|
||||
}
|
||||
|
||||
.full-name-inputs,
|
||||
.validation-checkboxes {
|
||||
display: flex;
|
||||
margin: 0 -0.5rem;
|
||||
|
||||
> * {
|
||||
margin: 0 0.5rem;
|
||||
}
|
||||
}
|
||||
|
||||
.checkbox-radio {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.demo-items {
|
||||
flex: 1 0 33%;
|
||||
}
|
||||
|
||||
23
src/app/pages/profile/profile.component.spec.ts
Normal file
23
src/app/pages/profile/profile.component.spec.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { ProfileComponent } from './profile.component';
|
||||
|
||||
describe('ProfileComponent', () => {
|
||||
let component: ProfileComponent;
|
||||
let fixture: ComponentFixture<ProfileComponent>;
|
||||
|
||||
beforeEach(async () => {
|
||||
await TestBed.configureTestingModule({
|
||||
declarations: [ ProfileComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
|
||||
fixture = TestBed.createComponent(ProfileComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
89
src/app/pages/profile/profile.component.ts
Normal file
89
src/app/pages/profile/profile.component.ts
Normal file
@ -0,0 +1,89 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { FormControl, FormGroup, Validators } from '@angular/forms';
|
||||
import { PageapiService } from '../pageapi.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ngx-profile',
|
||||
templateUrl: './profile.component.html',
|
||||
styleUrls: ['./profile.component.scss']
|
||||
})
|
||||
export class ProfileComponent implements OnInit {
|
||||
userForm: FormGroup | any; formData:any =[]
|
||||
constructor(public _api:PageapiService) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
|
||||
this.userForm = new FormGroup({
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// role: new FormControl('', [Validators.required]),
|
||||
userName: new FormControl('', [Validators.required]),
|
||||
// contactNo: new FormControl('', [Validators.required, Validators.maxLength(20)]),
|
||||
mobileNo: new FormControl('', [Validators.required, Validators.minLength(10),Validators.maxLength(10)]),
|
||||
// lastName: new FormControl('', [Validators.required, Validators.maxLength(20)]),
|
||||
email: new FormControl('', [Validators.required, Validators.email,Validators.pattern(
|
||||
'[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+.[a-zA-Z]{2,63}$',
|
||||
)]),
|
||||
// password: new FormControl('', [Validators.required, Validators.minLength(6)]),
|
||||
password: new FormControl('', [Validators.required,Validators.pattern(
|
||||
'^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*_=+-]).{8,16}$'
|
||||
)]),
|
||||
password2: new FormControl('', [Validators.required,Validators.pattern(
|
||||
'^(?=.*[a-z])(?=.*[A-Z])(?=.*[0-9])(?=.*[!@#$%^&*_=+-]).{8,16}$'
|
||||
)]),
|
||||
});
|
||||
let userRole = localStorage.getItem('roleId');
|
||||
|
||||
this. getuserlistApi(userRole)
|
||||
}
|
||||
close(){
|
||||
|
||||
}
|
||||
|
||||
onSubmit(){
|
||||
this.formData =[]
|
||||
this.formData= new FormData();
|
||||
let tmp = this.userForm .value
|
||||
let userRole = localStorage.getItem('roleId');
|
||||
this.formData.append('id', userRole);
|
||||
|
||||
|
||||
this.formData.append('userName',tmp.userName)
|
||||
this.formData.append('email', tmp.email);
|
||||
if(tmp.password != null && tmp.password2 != null){
|
||||
if(tmp.password == tmp.password2){
|
||||
this.formData.append('password', tmp.password);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
this.formData.append('mobileNo', tmp.mobileNo);
|
||||
|
||||
this._api.addUserFormDetails (this.formData).subscribe(res => {
|
||||
if (res.status == 200) {
|
||||
console.log(res)
|
||||
|
||||
}else{
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
getuserlistApi(id){
|
||||
let param={id:id}
|
||||
this._api.getusers(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
let passData = res.data[0]
|
||||
passData.password = null
|
||||
this.userForm.patchValue(passData)
|
||||
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
@ -177,7 +177,8 @@ export class UsersComponent {
|
||||
|
||||
|
||||
getuserlistApi(){
|
||||
this._api.getusers().subscribe(res => {
|
||||
let param ={}
|
||||
this._api.getusers(param).subscribe(res => {
|
||||
console.log(res)
|
||||
if(res.status == 200){
|
||||
|
||||
|
||||
@ -9,6 +9,6 @@
|
||||
// The list of which env maps to which file can be found in `.angular-cli.json`.
|
||||
|
||||
export const environment = {
|
||||
apiEndpoint:'http://192.168.1.29:8081/api/',
|
||||
apiEndpoint:'http://192.168.1.200:8081/api/',
|
||||
production: false,
|
||||
};
|
||||
|
||||
@ -4,7 +4,7 @@
|
||||
<meta charset="utf-8">
|
||||
<title>VNMS</title>
|
||||
|
||||
<base href="/">
|
||||
<base href="./">
|
||||
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||||
<link rel="icon" type="image/png" href="favicon.png">
|
||||
|
||||
Loading…
Reference in New Issue
Block a user