pd allocation view more components added

This commit is contained in:
gandhimathi 2018-11-28 11:43:25 +05:30
parent 14e49cded4
commit 0c8872e1e6
10 changed files with 172 additions and 61 deletions

View File

@ -0,0 +1,17 @@
<h1 mat-dialog-title class="paragraph_change">{{data.first_name}}</h1>
<mat-dialog-content>
<mat-card *ngFor="let moreDat of data.pd_details; let z=index;">
<mat-card-content>
<ol>
<li>{{moreDat.pd_type_name}} ( ID : {{moreDat.pd_id}} )</li>
<li>{{moreDat.applicant_name}}</li>
<li>{{moreDat.pd_status}}<span *ngIf="moreDat.scheduled_on"> ( {{moreDat.scheduled_on}} ) </span></li>
</ol>
</mat-card-content>
</mat-card>
</mat-dialog-content>
<mat-dialog-actions>
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right" mat-dialog-close><mat-icon>close</mat-icon></button>
</mat-dialog-actions>

View File

@ -0,0 +1,9 @@
.paragraph_change {
color: #e00201 !important;
}
ol {
list-style-type: none;
}
ol li:first-child {
color: #62B013;
}

View File

@ -0,0 +1,25 @@
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
import { AllocationViewMoreComponent } from './allocation-view-more.component';
describe('AllocationViewMoreComponent', () => {
let component: AllocationViewMoreComponent;
let fixture: ComponentFixture<AllocationViewMoreComponent>;
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [ AllocationViewMoreComponent ]
})
.compileComponents();
}));
beforeEach(() => {
fixture = TestBed.createComponent(AllocationViewMoreComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});

View File

@ -0,0 +1,18 @@
import { Component, OnInit, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
@Component({
selector: 'app-allocation-view-more',
templateUrl: './allocation-view-more.component.html',
styleUrls: ['./allocation-view-more.component.scss']
})
export class AllocationViewMoreComponent implements OnInit {
constructor(private dialogRef: MatDialogRef<AllocationViewMoreComponent>,
@Inject(MAT_DIALOG_DATA) public data: any) {
}
ngOnInit() {
}
}

View File

@ -1,49 +1,62 @@
<div style="height: 550px;">
<div style="text-align: right">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="closeAllocationComponent()"><mat-icon>close</mat-icon></button>
</div>
<mat-card style="width: 1000px;">
<mat-card-header>
<mat-card-title>{{pageTitle}}</mat-card-title>
</mat-card-header>
<mat-card-content>
<!-- <form [formGroup]="_pdAllocationForm" (submit)="onSubmit()"> -->
<div *ngIf="pdOfficerList.length > 0" >
<div fxLayout="row wrap" fxFlex="100%">
<div fxLayout="row wrap" fxFlex="22%" *ngFor="let officer of pdOfficerList; ">
<mat-card fxFlex="100%">
<mat-card-content style="text-align:center">
<mat-radio-button [value]="officer" (change)="selectPdOfficer(officer)"></mat-radio-button>
<img [src]="officer.profile_url ||'https://image.ibb.co/mGjZB9/usernew.png'" alt="No Image" style="border-radius:50%;width:100px;height:100px;"><br>
<span>{{officer.first_name}}</span>
<br>
<span>{{officer.mobile_no}}</span><br>
<span>PD in hand - {{officer.count}}</span>
</mat-card-content>
</mat-card>
</div>
</div>
</div>
<mat-list *ngIf="pdOfficerList.length == 0">
<mat-list-item>
<p>No PD officer available.</p>
</mat-list-item>
</mat-list>
<!-- </form> -->
</mat-card-content>
<mat-card-actions>
<div style="text-align:right;">
<button mat-raised-button mat-icon-button (click)="updatePdOfficer(selectedItem)" class="mr-1 mb-1 hover-icon" type="button"><mat-icon>save</mat-icon></button>
</div>
</mat-card-actions>
</mat-card>
<h2 mat-dialog-title>
<div fxFlex="70">
{{pageTitle}}
</div>
<div fxFlex="30" align="end">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="closeAllocationComponent()" matTooltip="Close" matTooltipPosition="below"><mat-icon>close</mat-icon></button>
</div>
</h2>
<mat-dialog-content class="mat-typography">
<!-- <form [formGroup]="_pdAllocationForm" (submit)="onSubmit()"> -->
<mat-list role="list" *ngIf="pdOfficerList.length > 0">
<mat-list-item role="listitem" *ngFor="let officer of pdOfficerList; let i = index">
<div fxFlex="100">
<div fxLayout="row wrap">
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="30" fxFlex.lg="30" fxFlex.xl="30">
<mat-radio-button color="primary" [value]="officer" (change)="selectedItem = $event.value">
{{officer.first_name}}
</mat-radio-button>
</div>
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="30" fxFlex.lg="30" fxFlex.xl="30">
<span>{{officer.mobile_no}}</span>
</div>
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="40" fxFlex.lg="40" fxFlex.xl="40">
<span class="view_more" (click)="viewMoreDetails(officer)" matTooltip="View More" matTooltipPosition="right">PD in hand - {{officer.count}}</span>
</div>
</div>
</div>
</mat-list-item>
</mat-list>
<mat-list *ngIf="pdOfficerList.length == 0">
<mat-list-item>
<p>No PD officer available.</p>
</mat-list-item>
</mat-list>
<!-- </form> -->
</mat-dialog-content>
<mat-dialog-actions >
<div fxFlex="50" align="left">
<p *ngIf="selectedItem">Currently Selected: {{selectedItem.first_name}}</p>
</div>
<div fxFlex="50" align="right">
<button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="closeAllocationComponent()" matTooltip="Close" matTooltipPosition="below"><mat-icon>close</mat-icon></button>
<button mat-raised-button mat-icon-button (click)="updatePdOfficer(selectedItem)" class="mr-1 mb-1 hover-icon" type="button" matTooltip="Allocate" matTooltipPosition="below"><mat-icon>save</mat-icon></button>
</div>
</mat-dialog-actions>
<notifier-container></notifier-container>

View File

@ -1,3 +1,14 @@
.example-full-width{
width: 100%;
}
}
.view_more {
cursor: pointer;
color: #e00201 !important;
// text-decoration-line: underline;
// text-decoration-style: dotted;
// font-weight: bold;
}
.text_change {
color: #e00201 !important;
}

View File

@ -1,8 +1,9 @@
import { Component, OnInit, Inject } from '@angular/core';
import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
import { MatDialog, MatDialogRef, MAT_DIALOG_DATA , DialogPosition} from '@angular/material';
import { FormBuilder, FormGroup, Validators, FormControl, FormArray } from '@angular/forms';
import { NotifierService } from 'angular-notifier';
import { PdTrigerService } from '../../../pd-service/pd-triger.service';
import { AllocationViewMoreComponent } from './../allocation-view-more/allocation-view-more.component';
@Component({
selector: 'app-pd-allocation',
@ -17,10 +18,11 @@ export class PdAllocationComponent implements OnInit {
notifier : NotifierService;
selectedItem:any;
isDisabled: boolean;
constructor( notifier: NotifierService,
private _fb: FormBuilder,
private dialogRef: MatDialogRef<PdAllocationComponent>,
private _pd: PdTrigerService,
private _pd: PdTrigerService, private dialog: MatDialog,
@Inject(MAT_DIALOG_DATA) public data: any) {
this.notifier=notifier;
}
@ -48,23 +50,16 @@ export class PdAllocationComponent implements OnInit {
}
}, error => this.errorMessage = <any> error);
}
// select pd officer list
selectPdOfficer(selected:any){
this.isDisabled=false;
this.selectedItem=selected;
// this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
}
/** To update pd officer*/
updatePdOfficer(allocateDate:any) {
if(this.isDisabled){
updatePdOfficer(allocateDetails:any) {
if(!allocateDetails){
this.notifier.notify('warning', 'Please Choose PD Officer.!');
}
else {
let updateData = {
"pd_id":this.data.pd_id,
"fk_pd_allocated_to":allocateDate.fk_user_id,
"fk_pd_allocated_to":allocateDetails.fk_user_id,
}
this._pd.updatePdOfficer(updateData).subscribe(
result => {
@ -87,4 +82,22 @@ export class PdAllocationComponent implements OnInit {
closeAllocationComponent(): void {
this.dialogRef.close();
}
// pd officer view more
viewMoreDetails(details:any){
if(Number(details.count) > 0) {
const dialogSchedule = this.dialog.open(AllocationViewMoreComponent, {
data: details,
disableClose: true,
position: { right: '0'},
// hasBackdrop:false
});
// dialogSchedule.afterClosed()
// .subscribe(dataresult => {
// });
}
else {
this.notifier.notify('warning', 'No PD In Hand');
}
}
}

View File

@ -114,6 +114,8 @@ export class ViewPdComponent implements OnInit, OnDestroy {
if(pdData.fk_pd_type == 1){
const dialogRef = this.dialog.open(PdAllocationComponent, {
data: pdData,
width: '60%',
maxHeight: '60%',
disableClose: true
});
dialogRef.afterClosed()

View File

@ -66,6 +66,7 @@ import { TelePdAllocationComponent } from './list-pd/tele-pd-allocation/tele-pd-
import { PdReportComponent } from './list-pd/pd-report/pd-report.component';
import {RentalInfoComponent} from "./list-pd/start-pd/forms/rental-info/rental-info.component";
import { AllocationViewMoreComponent } from './list-pd/allocation-view-more/allocation-view-more.component';
/**
@ -140,7 +141,7 @@ const pdCustomNotifierOptions: NotifierOptions = {
// AgmCoreModule.forRoot({apiKey: 'AIzaSyBtdO5k6CRntAMJCF-H5uZjTCoSGX95cdk'}), OwlDateTimeModule,
// OwlNativeDateTimeModule,
// ],
declarations: [RentalInfoComponent, TelePdAllocationComponent, FinancialInfoComponent, BusinessInfoComponent, EmploymentInfoComponent, StockComponent, BankingDetailsComponent, ListPdComponent, FamilyDetailsComponent, AddressComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, CurrentLoanComponent, AssetsInfoComponent, LoanDetailsComponent, OtherIncomeComponent, SupplierInfoComponent, PersonalInfoComponent, LenderRepresentativeComponent, PdReportComponent, AssessedIncomeComponent],
declarations: [RentalInfoComponent, TelePdAllocationComponent, FinancialInfoComponent, BusinessInfoComponent, EmploymentInfoComponent, StockComponent, BankingDetailsComponent, ListPdComponent, FamilyDetailsComponent, AddressComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, CurrentLoanComponent, AssetsInfoComponent, LoanDetailsComponent, OtherIncomeComponent, SupplierInfoComponent, PersonalInfoComponent, LenderRepresentativeComponent, PdReportComponent, AssessedIncomeComponent, AllocationViewMoreComponent],
// exports: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent],
// providers: [PdTrigerService, GetGeometricLocationService],
@ -172,9 +173,9 @@ const pdCustomNotifierOptions: NotifierOptions = {
OwlNativeDateTimeModule,
],
// declarations: [ListPdComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, AssetsInfoComponent],
exports: [PdAllocationComponent, SmartPdAllocationComponent, TelePdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent,RentalInfoComponent, AssessedIncomeComponent],
exports: [PdAllocationComponent, SmartPdAllocationComponent, TelePdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent, CurrentLoanComponent, LoanDetailsComponent, OtherIncomeComponent, AssetsInfoComponent, AddressComponent, FamilyDetailsComponent, BankingDetailsComponent, StockComponent, EmploymentInfoComponent, BusinessInfoComponent, FinancialInfoComponent, LenderRepresentativeComponent,RentalInfoComponent, AssessedIncomeComponent, AllocationViewMoreComponent],
providers: [PdTrigerService, GetGeometricLocationService],
entryComponents: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, TelePdAllocationComponent]
entryComponents: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, TelePdAllocationComponent, AllocationViewMoreComponent]
})
export class ManagePdModule {
}

View File

@ -112,6 +112,8 @@ export class QcViewComponent implements OnInit, OnDestroy {
if(pdData.fk_pd_type == 1){
const dialogRef = this.dialog.open(PdAllocationComponent, {
data: pdData,
width: '60%',
maxHeight: '60%',
disableClose: true
});
dialogRef.afterClosed()