Sineedge/sparqsineedge
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Ri multistoried_building_details changes

Browse Source
This commit is contained in:
gandhimathi 2019-03-26 12:08:24 +05:30
parent a16432e118
commit b652f09ca5
3 changed files with 250 additions and 53 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

104
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/rental-verification/rental-verification.component.html
View File

@ -178,7 +178,7 @@
</mat-form-field>
<!-- end -->
<!-- start type of units -->
<mat-form-field style="width:48%" appearance="outline">
<mat-form-field style="width:67%" appearance="outline">
<mat-label>Type of Units as per Loan Applicants</mat-label>
<mat-select placeholder=""
formControlName="unit_type" [compareWith]="compareObjects" required>
@ -193,19 +193,109 @@
<mat-label>Specify Other Unit Type</mat-label>
<input matInput autocomplete="off" placeholder="" formControlName="other_unit_type" required>
</mat-form-field>
<mat-form-field style="width:15%" appearance="outline" *ngIf="_rentalForm.controls['no_floor']">
<mat-label>No of Floors</mat-label>
<input matInput OnlyNumber autocomplete="off" placeholder="" formControlName="no_floor" maxlength="2">
</mat-form-field>
<mat-form-field style="width:15%;" appearance="outline" *ngIf="_rentalForm.controls['no_units']">
<mat-form-field style="width:67%;" appearance="outline" *ngIf="_rentalForm.controls['no_units']">
<mat-label>Tot No of Units</mat-label>
<input OnlyNumber matInput autocomplete="off" placeholder="" formControlName="no_units" maxlength="3">
</mat-form-field>
<!-- end -->
<mat-form-field style="width:30%" appearance="outline" *ngIf="_rentalForm.controls['no_floor']">
<mat-label>No of Floors</mat-label>
<input matInput OnlyNumber autocomplete="off" placeholder="" formControlName="no_floor" (keyup)="generateFloor($event)" maxlength="2">
</mat-form-field>
<mat-form-field style="width:30%;" appearance="outline" *ngIf="_rentalForm.controls['multistoried_total_area']">
<mat-label>Total Area Given on Rent</mat-label>
<input matInput OnlyNumber autocomplete="off" placeholder="" formControlName="multistoried_total_area" required><!--maxlength="3"-->
</mat-form-field>
<!-- end area covered -->
<!-- start unit of measurement -->
<mat-form-field style="width:28%" appearance="outline" *ngIf="_rentalForm.controls['multistoried_uom']">
<mat-label>Unit of Measurement</mat-label>
<mat-select placeholder=""
formControlName="multistoried_uom" [compareWith]="compareSingleObjects" (selectionChange)="generateMultistoriedOtherUOM(_rentalForm.value)" required>
<mat-option *ngFor="let unitM of unitMeasurementList" [value]="unitM">
{{unitM.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:25%" appearance="outline" *ngIf="_rentalForm.controls['multistoried_other_uom']">
<mat-label>Other Unit of Measurement</mat-label>
<input matInput autocomplete="off" placeholder="" formControlName="multistoried_other_uom" required>
</mat-form-field>
<!-- end Uom -->
<!-- end -->
</div>
</mat-card-content>
</mat-card>
<!-- this is for multistoried floor details -->
<ng-container formArrayName="multistoried_building_details" *ngIf="_rentalForm.value.multistoried_building_details.length>0">
<mat-card *ngFor="let floor of _rentalForm.controls.multistoried_building_details['controls']; let f=index;let flast = last" [formGroupName]="f">
<mat-card-header>
<mat-form-field style="width:100%; margin-top: 2%;" appearance="outline">
<mat-label>Floor Level Name</mat-label>
<input matInput autocomplete="off" placeholder="" formControlName="floor_level" required>
</mat-form-field>
</mat-card-header>
<mat-card-content>
<mat-form-field style="width:46%" appearance="outline">
<mat-label>No of Units</mat-label>
<input OnlyNumber matInput autocomplete="off" placeholder="" formControlName="no_units_in_floor" (keyup)="generateFloorUnit(floor.value,f)" required>
</mat-form-field>
<mat-form-field style="width:46%" appearance="outline">
<mat-label>Is Rent Same for All Units</mat-label>
<mat-select placeholder="" formControlName="unit_rent_difference_options" (selectionChange)="generateFloorUnit(floor.value,f)" required>
<mat-option value="1">Yes</mat-option>
<mat-option value="0">No</mat-option>
</mat-select>
</mat-form-field>
<!-- start floor unit array details -->
<!-- -->
<div [ngSwitch]="floor.value.unit_rent_difference_options">
<!-- this is for same rent for all unit -->
<ng-container *ngSwitchCase="1">
<div formArrayName="floor_unit_details" *ngIf="floor.value.floor_unit_details.length>0">
<div fxLayout="row wrap" class="align-margin" *ngFor="let fUnits of floor.controls.floor_unit_details['controls']; let fu=index;" [formGroupName]="fu">
<mat-form-field style="width:46%" appearance="outline">
<mat-label>Rent per Unit</mat-label>
<input OnlyNumber matInput autocomplete="off" placeholder="" formControlName="rent_per_unit" (keyup)="calculateSameRentAmt(floor.value,f)" required>
<mat-hint align="start" style="font-size:90%" *ngIf="fUnits.value.rent_per_unit != ''">{{"&#8377;"}} {{fUnits.value.rent_per_unit | numberToWords}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:46%" appearance="outline">
<mat-label>Amount</mat-label>
<input OnlyNumber matInput autocomplete="off" placeholder="" formControlName="amount" readonly required>
<mat-hint align="start" style="font-size:90%" *ngIf="fUnits.value.amount != ''">{{"&#8377;"}} {{fUnits.value.amount | numberToWords}} Only</mat-hint>
</mat-form-field>
</div>
</div>
</ng-container>
<!-- this is for different rent for all unit -->
<ng-container *ngSwitchCase="0">
<div fxLayout="row wrap" class="align-margin" formArrayName="floor_unit_details" *ngIf="floor.value.floor_unit_details.length>0">
<div class="rent-unit" fxFlex.xs="100" fxFlex.sm="45" fxFlex.md="45" fxFlex.lg="45" fxFlex.xl="45" *ngFor="let fUnits of floor.controls.floor_unit_details['controls']; let fu=index;" [formGroupName]="fu">
<mat-form-field style="width:100%" appearance="outline">
<mat-label>Rent Unit {{fu+1}} </mat-label>
<input OnlyNumber matInput autocomplete="off" placeholder="" formControlName="amount" required>
<mat-hint align="start" style="font-size:90%" *ngIf="fUnits.value.amount != ''">{{"&#8377;"}} {{fUnits.value.amount | numberToWords}} Only</mat-hint>
</mat-form-field>
</div>
</div>
</ng-container>
</div>
<!-- end floor unit array details-->
</mat-card-content>
</mat-card>
</ng-container>
<!-- end floor details -->
<!-- this is for property unit details-->
<ng-container formArrayName="property_unit_details" *ngIf="_rentalForm.value.property_unit_details.length>0">

7
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/rental-verification/rental-verification.component.scss
View File

@ -9,6 +9,9 @@
justify-content: center !important;
}
.align-margin {
margin-left: 4%;
margin-right: 4%;
margin-left: 2%;
margin-right: 2%;
}
.rent-unit {
margin-left: 2%;
}

192
ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/forms/rental-verification/rental-verification.component.ts
View File

@ -152,9 +152,13 @@ export class RentalVerificationComponent implements OnInit {
});
// observe unit type changes
this._rentalForm.controls['unit_type'].valueChanges.subscribe(val => {
this._rentalForm.controls['unit_type'].valueChanges.subscribe(val => {
val.id==1 ? this._rentalForm.addControl('other_unit_type', new FormControl('', Validators.required)) : this._rentalForm.removeControl('other_unit_type');
val.group_id==1 && val.id==7 ? this._rentalForm.addControl('no_floor', new FormControl('')) : val.group_id==2 && val.id==7 ? this._rentalForm.addControl('no_floor', new FormControl('')) : this._rentalForm.removeControl('no_floor');
val.group_id==1 && val.id==6 ? this._rentalForm.removeControl('no_units') : val.group_id==2 && val.id==7 ? this._rentalForm.removeControl('no_units') : this._rentalForm.addControl('no_units', new FormControl(''));
val.group_id==1 && val.id==6 ? this._rentalForm.addControl('no_floor', new FormControl('',Validators.required)) : val.group_id==2 && val.id==7 ? this._rentalForm.addControl('no_floor', new FormControl('',Validators.required)) : this._rentalForm.removeControl('no_floor');
val.group_id==1 && val.id==6 ? this._rentalForm.addControl('multistoried_total_area', new FormControl('',Validators.required)) : val.group_id==2 && val.id==7 ? this._rentalForm.addControl('multistoried_total_area', new FormControl('',Validators.required)) : this._rentalForm.removeControl('multistoried_total_area');
val.group_id==1 && val.id==6 ? this._rentalForm.addControl('multistoried_uom', new FormControl('',Validators.required)) : val.group_id==2 && val.id==7 ? this._rentalForm.addControl('multistoried_uom', new FormControl('',Validators.required)) : this._rentalForm.removeControl('multistoried_uom');
val.group_id==1 && val.id==6 ? '' : val.group_id==2 && val.id==7 ? '' : this._rentalForm.setControl('multistoried_building_details', this._fb.array([]));
});
// observe visit address
@ -206,6 +210,7 @@ export class RentalVerificationComponent implements OnInit {
nature_property: ['',Validators.required],
unit_type:['',Validators.required],
no_units:[''],
multistoried_building_details: this._fb.array([]),
property_unit_details : this._fb.array([]),
done_third_party_check :['',Validators.required],
rental_remark: [''],
@ -267,7 +272,24 @@ loadFormData(){
rentalVal.formid = this.form_id;
rentalVal.other_name_person_type ? this._rentalForm.addControl('other_name_person_type', new FormControl('', Validators.required)): this._rentalForm.removeControl('other_name_person_type');
rentalVal.other_sighted_documents ? this._rentalForm.addControl('other_sighted_documents', new FormControl('', Validators.required)) : this._rentalForm.removeControl('other_sighted_documents');
//get Multistoried Building Details
if(data.records.multistoried_building_details){
let selectedMultistoriedBuilding = Object.keys(data.records.multistoried_building_details).map(function (key) {
return data.records.multistoried_building_details[key];
});
if(selectedMultistoriedBuilding.length>0){
let control: any = <FormArray>this._rentalForm.controls['multistoried_building_details'];
selectedMultistoriedBuilding.forEach((floorElement,floorIndex)=>{
control.push(this.createFloorDetails(''));
let unitControl = control.controls[floorIndex];
unitControl= <FormArray> unitControl.controls['floor_unit_details'];
floorElement.floor_unit_details.forEach((unitElement,unitIndex) => {
floorElement.unit_rent_difference_options=="0" ? unitControl.push(this.createFloorUnitDetails(2)) : unitControl.push(this.createFloorUnitDetails(1));
});
});
}
}
// get property unit details
if(data.records.property_unit_details){
let selectedUnitDetails = Object.keys(data.records.property_unit_details).map(function (key) {
@ -439,6 +461,10 @@ generateTenantOptions(value:any,index:number){
value.unit_measurement.id=="1" ? control.controls[index].addControl('other_unit_measurement', new FormControl('', Validators.required)) : control.controls[index].removeControl('other_unit_measurement');
}
// generate multistoried other uom
generateMultistoriedOtherUOM(value: any){
value.multistoried_uom.id=="1" ? this._rentalForm.addControl('multistoried_other_uom', new FormControl('', Validators.required)) : this._rentalForm.removeControl('multistoried_other_uom');
}
// generate Rent AgreementSeen
generateRentAgreementSeen(value: any,index:number){
let control: any = <FormArray>this._rentalForm.controls['property_unit_details'];
@ -657,50 +683,128 @@ else {
}
// generate floor rows
// generateFloor(e:any): void{
// let control = <FormArray>this._rentalForm.controls['floor_details'];
// if(e.target.value && Math.round(e.target.value)!=0){
generateFloor(e:any): void{
let control = <FormArray>this._rentalForm.controls['multistoried_building_details'];
if(e.target.value && Math.round(e.target.value)!=0){
// if(Math.round(e.target.value) > this._rentalForm.value.floor_details.length){
// let rowValue = Math.round(e.target.value)-this._rentalForm.value.floor_details.length;
// for(let i=rowValue;i>0;i--){
// control.push(this.createFloorDetails(''));
// }
// }
// else if(Math.round(e.target.value) < this._rentalForm.value.floor_details.length){
// let rowValue = this._rentalForm.value.floor_details.length-Math.round(e.target.value);
// for(let i=rowValue;i>0;i--){
// control.removeAt(this._rentalForm.value.floor_details.length-1);
// }
// }
// }
// else if(e.target.value && Math.round(e.target.value)==0){
// control.controls = [];
// control.setValue([]);
// }
// else{
// control.controls = [];
// control.setValue([]);
// }
// e.stopPropagation();
// }
if(Math.round(e.target.value) > this._rentalForm.value.multistoried_building_details.length){
let rowValue = Math.round(e.target.value)-this._rentalForm.value.multistoried_building_details.length;
for(let i=rowValue;i>0;i--){
control.push(this.createFloorDetails(''));
}
}
else if(Math.round(e.target.value) < this._rentalForm.value.multistoried_building_details.length){
let rowValue = this._rentalForm.value.multistoried_building_details.length-Math.round(e.target.value);
for(let i=rowValue;i>0;i--){
control.removeAt(this._rentalForm.value.multistoried_building_details.length-1);
}
}
}
else if(e.target.value && Math.round(e.target.value)==0){
control.controls = [];
control.setValue([]);
}
else{
control.controls = [];
control.setValue([]);
}
e.stopPropagation();
}
// create floor details
// createFloorDetails(details){
// if(details){
// return this._fb.group({
// floor_level: [this._rentalForm.value.floor_details.length==0 ? 'Ground Floor' : this._rentalForm.value.floor_details.length+' Floor', Validators.compose([Validators.required])],
// no_units_on_floor: ['', Validators.compose([Validators.required])],
// });
// }
// else{
// return this._fb.group({
// floor_level: [this._rentalForm.value.floor_details.length==0 ? 'Ground Floor' : this._rentalForm.value.floor_details.length+' Floor', Validators.compose([Validators.required])],
// no_units_in_floor: ['', Validators.compose([Validators.required])],
// });
// }
// }
createFloorDetails(details){
if(details){
return this._fb.group({
floor_level: [this._rentalForm.value.multistoried_building_details.length==0 ? 'Ground Floor' : this._rentalForm.value.multistoried_building_details.length+' Floor', Validators.compose([Validators.required])],
no_units_in_floor: ['', Validators.compose([Validators.required])],
unit_rent_difference_options : ['', Validators.compose([Validators.required])],
floor_unit_details : this._fb.array([]),
});
}
else{
return this._fb.group({
floor_level: [this._rentalForm.value.multistoried_building_details.length==0 ? 'Ground Floor' : this._rentalForm.value.multistoried_building_details.length+' Floor', Validators.compose([Validators.required])],
no_units_in_floor: ['', Validators.compose([Validators.required])],
unit_rent_difference_options : ['', Validators.compose([Validators.required])],
floor_unit_details : this._fb.array([]),
});
}
}
// generate floor unit details
generateFloorUnit(values:any, index:number){
let control: any = <FormArray>this._rentalForm.controls['multistoried_building_details'];
control = control.controls[index];
control= <FormArray> control.controls['floor_unit_details'];
if(values.no_units_in_floor>0 && values.unit_rent_difference_options=="0"){
if(Math.round(values.no_units_in_floor) > control.value.length){
let rowValue = Math.round(values.no_units_in_floor)-control.value.length;
for(let i=rowValue;i>0;i--){
control.push(this.createFloorUnitDetails(2));
}
}
else if(Math.round(values.no_units_in_floor) < control.value.length){
let rowValue = control.value.length-Math.round(values.no_units_in_floor);
for(let i=rowValue;i>0;i--){
control.removeAt(control.value.length-1);
}
}
else if(Math.round(values.no_units_in_floor)==0){
control.controls = [];
control.setValue([]);
}
else{
control.controls = [];
control.setValue([]);
}
}
else if(values.no_units_in_floor>0 && values.unit_rent_difference_options=="1") {
control.controls = [];
control.setValue([]);
control.push(this.createFloorUnitDetails(1));
this.calculateSameRentAmt(control.value,index);
}
else {
control.controls = [];
control.setValue([]);
}
}
// create floor unit details
createFloorUnitDetails(type:number){
if(type==1){
return this._fb.group({
rent_per_unit: ['', Validators.compose([Validators.required])],
amount: ['', Validators.compose([Validators.required])],
});
}
else if(type==2){
return this._fb.group({
amount: ['', Validators.compose([Validators.required])],
});
}
}
// calculate same rent amount
calculateSameRentAmt(values: any, index: number){
if(values.unit_rent_difference_options=="1"){
let control: any = <FormArray>this._rentalForm.controls['multistoried_building_details'];
control = control.controls[index];
control= <FormArray> control.controls['floor_unit_details'];
if(control.value[control.value.length-1].rent_per_unit>0 && values.no_units_in_floor>0){
control.controls[control.value.length-1].controls['amount'].setValue(control.value[control.value.length-1].rent_per_unit * values.no_units_in_floor);
}
else{
control.controls[control.value.length-1].controls['amount'].setValue('');
}
}
}
// compare objects for merge two master table details
compareObjects(o1: any, o2: any) {
if(o1.id == o2.id && o1.group_id == o2.group_id)