Radio button : ps

This commit is contained in:
VE10-Sanjeev 2023-11-18 21:04:12 +05:30
parent 68d6fc6bf7
commit ff124fe270
5 changed files with 195 additions and 89 deletions

View File

@ -1,13 +1,12 @@
<section [formGroup]="formGroupN">
<div *ngIf="parent_ques.sub_title" fxLayout="row" >
<div *ngIf="parent_ques.sub_title" fxLayout="row">
<mat-card-subtitle *ngIf="parent_ques.sub_title" fxFlex="100%">
{{parent_ques.sub_title}}
</mat-card-subtitle>
<br style="clear: both;"/>
<br style="clear: both;" />
</div>
<!-- {{formGroupN.value | json}} -->
<mat-form-field style="width: 100%" *ngIf="parent_ques.type == '1' && !parent_ques.is_hidden"
>
<!-- {{formGroupN.value | json}} -->
<mat-form-field style="width: 100%" *ngIf="parent_ques.type == '1' && !parent_ques.is_hidden">
<mat-label>{{parent_ques.question}}</mat-label>
<input matInput
@ -27,29 +26,29 @@
</ng-container>
</mat-form-field>
<mat-form-field style="width:100%"
*ngIf="parent_ques.type == '9'" >
<mat-label>{{parent_ques.question}}</mat-label>
<input matInput [type]="parent_ques.field_type == 'num' || parent_ques.field_type == 'numtoword' ? 'number' : parent_ques.field_type== 'string' || parent_ques.field_type == 'str&numtoword' ? 'text' : parent_ques.field_type"
[formControlName]="parent_ques.question_key" [placeholder]="parent_ques.place_holder"
(change)="onChangeProperty($event,parent_ques,parent_ques.question_key)"
[matAutocomplete]="auto">
<mat-autocomplete #auto="matAutocomplete" (optionSelected) = "onChangeProperty($event,parent_ques,parent_ques.question_key)">
<mat-option *ngFor="let val of autoCompleteAns | async" [value]="val.hasOwnProperty('answer_id') ? val.answer_id : val.answer"
>
<span>{{val.answer}}</span>
</mat-option>
</mat-autocomplete>
<mat-hint
*ngIf="formGroupN.value[parent_ques.question_key] != '' && (parent_ques.field_type == 'numtoword' || parent_ques.field_type == 'str&numtoword')"
align="end" style="font-size: 12px;">{{"&#8377;"}} {{formGroupN.value[parent_ques.question_key] | numberToWords}}
</mat-hint>
<!-- <mat-hint align="end" style="font-size: 11.5px;color: gray;" *ngIf="parent_ques.get('is_amt_in_words').value == true">One Lack</mat-hint> -->
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
{{validation.message}}</mat-error>
</ng-container>
</mat-form-field>
<mat-form-field style="width:100%" *ngIf="parent_ques.type == '9'">
<mat-label>{{parent_ques.question}}</mat-label>
<input matInput
[type]="parent_ques.field_type == 'num' || parent_ques.field_type == 'numtoword' ? 'number' : parent_ques.field_type== 'string' || parent_ques.field_type == 'str&numtoword' ? 'text' : parent_ques.field_type"
[formControlName]="parent_ques.question_key" [placeholder]="parent_ques.place_holder"
(change)="onChangeProperty($event,parent_ques,parent_ques.question_key)" [matAutocomplete]="auto">
<mat-autocomplete #auto="matAutocomplete"
(optionSelected)="onChangeProperty($event,parent_ques,parent_ques.question_key)">
<mat-option *ngFor="let val of autoCompleteAns | async"
[value]="val.hasOwnProperty('answer_id') ? val.answer_id : val.answer">
<span>{{val.answer}}</span>
</mat-option>
</mat-autocomplete>
<mat-hint
*ngIf="formGroupN.value[parent_ques.question_key] != '' && (parent_ques.field_type == 'numtoword' || parent_ques.field_type == 'str&numtoword')"
align="end" style="font-size: 12px;">{{"&#8377;"}} {{formGroupN.value[parent_ques.question_key] | numberToWords}}
</mat-hint>
<!-- <mat-hint align="end" style="font-size: 11.5px;color: gray;" *ngIf="parent_ques.get('is_amt_in_words').value == true">One Lack</mat-hint> -->
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
{{validation.message}}</mat-error>
</ng-container>
</mat-form-field>
<!-- <mat-form-field> -->
<div class="radio-gap" *ngIf="parent_ques.type == '2'">
@ -60,18 +59,21 @@
[value]="val.hasOwnProperty('answer_id') ? val.answer_id : val.answer">{{val.answer}}</mat-radio-button><br />
</mat-radio-group>
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error style="font-size:12px" align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
<mat-error style="font-size:12px" align="end"
*ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
{{validation.message}}</mat-error>
</ng-container>
</div>
<mat-form-field style="width: 100%" *ngIf="parent_ques.type == '3'">
<mat-label>{{parent_ques.question}}</mat-label>
<mat-select [formControlName]="parent_ques.question_key" (selectionChange)="onChangeProperty($event,parent_ques,'','','')">
<mat-select [formControlName]="parent_ques.question_key"
(selectionChange)="onChangeProperty($event,parent_ques,'','','')">
<mat-option>Select</mat-option>
<mat-option *ngFor="let val of parent_ques.answers"
[value]="val.hasOwnProperty('answer_id') ? val.answer_id : val.answer"
(click)="newAnswerCreateDialog(val,parent_ques)" class="large-select-option"><mat-icon *ngIf="val.is_others == '-1'">add_circle_outline</mat-icon> <span>{{val.answer}}</span></mat-option>
(click)="newAnswerCreateDialog(val,parent_ques)" class="large-select-option"><mat-icon
*ngIf="val.is_others == '-1'">add_circle_outline</mat-icon> <span>{{val.answer}}</span></mat-option>
</mat-select>
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
@ -84,11 +86,11 @@
<mat-checkbox class="radio-btn-gap" *ngFor="let val of parent_ques.answers;let i=index"
[value]="val.hasOwnProperty('answer_id') ? val.answer_id : val.answer"
(change)="onChange_checkbox($event,parent_ques);onChangeProperty($event,parent_ques,'','','')">{{val.answer}}</mat-checkbox><br />
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
{{validation.message}}</mat-error>
</ng-container>
{{formGroupN.value[parent_ques.question_key] | json}}
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
{{validation.message}}</mat-error>
</ng-container>
{{formGroupN.value[parent_ques.question_key] | json}}
</div>
<mat-form-field style="width: 100%" *ngIf="parent_ques.type == '4'">
@ -155,8 +157,8 @@
<mat-form-field style="width: 100%" *ngIf="parent_ques.type == '7'">
<mat-label>{{parent_ques.question}}</mat-label>
<textarea matInput type="text" rows="3" (change)="onChangeProperty($event,parent_ques,parent_ques.question_key)" [formControlName]="parent_ques.question_key" placeholder="Enter the Text"
autocomplete="off"></textarea>
<textarea matInput type="text" rows="3" (change)="onChangeProperty($event,parent_ques,parent_ques.question_key)"
[formControlName]="parent_ques.question_key" placeholder="Enter the Text" autocomplete="off"></textarea>
<!-- <mat-error align="end" style="font-style: italic;margin-right: 5px;">Field is Required</mat-error> -->
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
@ -164,25 +166,53 @@
</ng-container>
</mat-form-field>
<mat-form-field style="width: 100%" *ngIf="parent_ques.type == '8'" (click)="ngxFilteredValue.next(parent_ques.answers)">
<mat-form-field style="width: 100%" *ngIf="parent_ques.type == '8'"
(click)="ngxFilteredValue.next(parent_ques.answers)">
<mat-label>{{parent_ques.question}}</mat-label>
<mat-select [formControlName]="parent_ques.question_key" (selectionChange)="onChangeProperty($event,parent_ques,'','','')">
<mat-select [formControlName]="parent_ques.question_key"
(selectionChange)="onChangeProperty($event,parent_ques,'','','')">
<mat-option>
<ngx-mat-select-search [formControl]="commonFilterCtrl" [placeholderLabel]="'Search'"
[noEntriesFoundLabel]="'No Matching Result'" >
<mat-icon ngxMatSelectSearchClear>close</mat-icon>
[noEntriesFoundLabel]="'No Matching Result'">
<mat-icon ngxMatSelectSearchClear>close</mat-icon>
</ngx-mat-select-search>
</mat-option>
<mat-option>Select</mat-option>
<mat-option
*ngFor="let val of ngxFilteredValue | async"
<mat-option *ngFor="let val of ngxFilteredValue | async"
[value]="val.hasOwnProperty('answer_id') ? val.answer_id : val.answer"
(click)="newAnswerCreateDialog(val,parent_ques)" class="large-select-option"><mat-icon *ngIf="val.is_others == '-1'">add_circle_outline</mat-icon> <span>{{val.answer}}</span></mat-option>
(click)="newAnswerCreateDialog(val,parent_ques)" class="large-select-option"><mat-icon
*ngIf="val.is_others == '-1'">add_circle_outline</mat-icon> <span>{{val.answer}}</span></mat-option>
</mat-select>
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
{{validation.message}}</mat-error>
</ng-container>
</mat-form-field>
<mat-form-field style="width:100%" *ngIf="parent_ques.type == '10' && parent_ques.field_type == 'date'">
<mat-label>{{parent_ques.question}}</mat-label>
<input matInput [matDatepicker]="picker" [max]="parent_ques.max_date" [min]="parent_ques.min_date"
[formControlName]="parent_ques.question_key" placeholder="Choose a date">
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<mat-datepicker #picker></mat-datepicker>
<ng-container *ngFor="let validation of parent_ques.validations" ngProjectAs="mat-error">
<mat-error align="end" *ngIf="formGroupN.get(parent_ques.question_key).hasError(validation.name.toLowerCase())">
{{validation.message}}</mat-error>
</ng-container>
</mat-form-field>
<mat-form-field style="width:100%" *ngIf="parent_ques.type == '10' && parent_ques.field_type == 'datetime'">
<mat-label>{{parent_ques.question}}</mat-label>
<input matInput [matDatepicker]="picker" placeholder="Choose a date" [formControlName]="parent_ques.question_key"
[min]="parent_ques.min_date" [max]="parent_ques.max_date" >
<mat-datepicker-toggle matSuffix [for]="picker"></mat-datepicker-toggle>
<!-- <ngx-mat-datetime-picker #picker [showSpinners]="showSpinners" [showSeconds]="showSeconds"
[stepHour]="stepHour" [stepMinute]="stepMinute" [stepSecond]="stepSecond"
[touchUi]="touchUi" [color]="color" [enableMeridian]="enableMeridian"
[disableMinute]="disableMinute" [hideTime]="hideTime">
</ngx-mat-datetime-picker> -->
</mat-form-field>
</section>

View File

@ -6,6 +6,7 @@ import { Observable, ReplaySubject } from 'rxjs';
import { MatDialog } from '@angular/material';
import { AnswerOptionCreateDialogComponent } from '../../answer-option-create-dialog/answer-option-create-dialog.component';
import { LoaderService } from 'app/shared/loaderService/loader.service';
import { DatePipe } from '@angular/common';
@Component({
selector: 'app-dynamic-question-template',

View File

@ -85,67 +85,86 @@
<div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="40" fxFlex.lg="30" fxFlex.xl="30" *ngFor="let master of pdMasterData">
<mat-card style="min-width: 80%;max-width: 100%;box-shadow: 0 5px 11px 0 rgba(0,0,0,.18), 0 4px 15px 0 rgba(0,0,0,.15) !important;">
<mat-card-content style="background-color: whitesmoke;padding:0px !important;">
<mat-list role="list" style="padding-top: 0px !important;">
<mat-list-item role="listitem" style="background-color:#e00201;height:48px !important;">
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="100" align="center" *ngIf="master.pd_sno" style="color:#fff;">
<i class="fa-1x fa fa-check-circle"></i><small style="margin-left: 2%; font-size: inherit">{{master.pd_sno}}</small>
<mat-list role="list" style="padding-top: 0px !important;">
<mat-list-item role="listitem" style="background-color:#e00201;height:48px !important;">
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="100" align="center" *ngIf="master.pd_sno" style="color:#fff;">
<i class="fa-1x fa fa-check-circle"></i><small style="margin-left: 2%; font-size: inherit">{{master.pd_sno}}</small>
</div>
</div>
</div>
</div>
</div>
</mat-list-item>
<mat-list-item role="listitem">
<br />
<mat-list-item role="listitem">
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="50" align="left">
<strong>{{master.lender_short_name}}</strong><br/>
<p style="color:#e00201;margin: 0px;" *ngIf="(master.lender_short_name == 'MWISE' && master.fk_pd_type == '3') || (master.lender_short_name != 'MWISE')" >{{master.pd_type_name}}</p>
</div>
<div fxFlex="50" align="right">
{{master.branch_name}}
</div>
</div>
<div fxFlex="100">
<div fxFlex="50" align="left">
<strong>{{master.lender_short_name}}</strong><br/>
<!-- <p style="color:#e00201;margin: 0px;" *ngIf="(master.lender_short_name == 'MWISE' && master.fk_pd_type == '3') || (master.lender_short_name != 'MWISE')" >{{master.pd_type_name}}</p> -->
</div>
<div fxFlex="50" align="right">
{{master.branch_name}}
</div>
</div>
</div>
</mat-list-item>
</mat-list-item>
<mat-list-item role="listitem" style="height:60px !important;">
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="50" align="left" *ngIf="master.lender_applicant_id">
{{master.lender_applicant_id}}
<mat-list-item role="listitem">
<div fxFlex="row">
<div fxFlex="70">
<div *ngIf="LenderRoleID == '26' && (currentPDStatus == pdStatusCheck.TRIGGERED || currentPDStatus == pdStatusCheck.ALLOCATED || currentPDStatus==pdStatusCheck.SCHEDULED || currentPDStatus == pdStatusCheck.INPROGRESS ); else plaintext">
<mat-radio-group align="start" (change)="changePDTypeValue($event)">
<mat-radio-button *ngFor="let item of credit_pd_type_list" [value]="item.fk_pd_type" [checked]="item.fk_pd_type === defaultPDType">
{{ item.display_name }}
</mat-radio-button>
</mat-radio-group>
</div>
<ng-template #plaintext>
<div *ngFor="let item of credit_pd_type_list" >
<p style="color:#e00201;margin: 0px;" *ngIf="(master.lender_short_name == 'MWISE' && item.fk_pd_type == master.fk_pd_type) || (master.lender_short_name != 'MWISE')"> {{item.display_name}} </p>
</div>
<div fxFlex="50" align="right" *ngIf="master.lender_applicant_id">
{{master.pd_date_of_initiation}}
</ng-template>
</div>
</div>
</div>
</mat-list-item>
</div>
</mat-list-item>
<mat-list-item role="listitem" style="height:auto !important;">
<div fxFlex="row">
<mat-list-item role="listitem" style="height:60px !important;">
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="50" align="left" *ngIf="master.lender_applicant_id">
{{master.lender_applicant_id}}
</div>
<div fxFlex="50" align="right" *ngIf="master.lender_applicant_id">
{{master.pd_date_of_initiation}}
</div>
</div>
</div>
</mat-list-item>
<mat-list-item role="listitem" style="height:auto !important;">
<div fxFlex="row">
<div fxFlex="100">
<div fxFlex="100" align="left" *ngIf="master.product_name">
<div fxFlex="100" align="left" *ngIf="master.product_name">
<strong> {{master.product_name}}</strong><br>
<span *ngIf="master.subproduct_name" style="font-size:0.9rem !important;">{{master.subproduct_name}}</span>
</div>
</div>
</div>
</div>
</div>
</mat-list-item>
<mat-list-item role="listitem" style="height:48px !important;" *ngIf="master.loan_amount != 0">
<div fxFlex="row wrap">
<div fxFlex="row wrap">
<div fxFlex="100">
<div fxFlex="50" align="left" style="color:#e00201;">
Loan Amount
</div>
<div fxFlex="50" align="right" *ngIf="master.loan_amount">
</div>
<div fxFlex="50" align="right" *ngIf="master.loan_amount">
<i class="fa-1x fa fa-rupee"></i><small style="margin-left: 2%; font-size: inherit">{{master.loan_amount}}</small><br>
</div>
</div>
</div>
</div>
</div>
</mat-list-item>
<mat-list-item role="listitem" *ngIf="master.loan_amount && master.loan_amount != 0">
@ -153,9 +172,8 @@
<div style="font-size:0.9rem !important;">{{master.loan_amount | numberToWords}} Only</div>
<!-- <div style="font-size:0.9rem !important;">{{ 9999999999 | numberToWords}} Only</div> -->
</div>
</mat-list-item>
</mat-list>
</mat-list-item>
</mat-list>
<div style="padding: 10px !important;">
<mat-card-title style="color:#e00201;">Lender Contact Details</mat-card-title>

View File

@ -135,6 +135,17 @@ export class ViewPdComponent implements OnInit, OnDestroy {
currentVendorStatus: any;
pdAgencyid: any;
dummyFlag:any;
defaultPDType: any ;
oldPDType :any;
credit_pd_type_list:any=[{
fk_pd_type:"1",
original_name:"Full PD",
display_name:"Physical PD"
},{
fk_pd_type:"3",
original_name:"Tele PD",
display_name:"Tele PD"
}];
constructor(notifier: NotifierService, private dialog: MatDialog, private _fb: FormBuilder,
private _pd: PdTrigerService, private route: ActivatedRoute, private router: Router, private ListPdComponent: ListPdComponent,
@ -190,6 +201,11 @@ export class ViewPdComponent implements OnInit, OnDestroy {
this.pdApplicantData = this.pdApplicantData.filter(appt => appt.applicant_type != 2);
this.CustomerSegmentAbbr = this.pdMasterData[0].customer_segment_abbr;
this.product=this.pdMasterData[0].product_abbr;
this.defaultPDType = this.pdMasterData[0].fk_pd_type;
this.oldPDType = this.pdMasterData[0].fk_pd_type;
console.log("0) this.defaultPDType = ",this.defaultPDType);
console.log("0.1) this.oldPDType = ",this.oldPDType);
this.pdDocumentsData = data.records.pd_documnets;
this.masterPdLogsData = Object.keys(data.records.pd_logs.master).map(function (key) {
return data.records.pd_logs.master[key];
@ -244,6 +260,40 @@ export class ViewPdComponent implements OnInit, OnDestroy {
this.ListPdComponent.pdListLoad(true);
}
changePDTypeValue(event: any) {
const isConfirmed = window.confirm(`Are you sure you want to change PD Type?`);
if (isConfirmed && event.value !== this.oldPDType) {
let template = {
"pd_id": this.viewID,
"random_string": this.pdMasterData[0].random_string,
"fk_pd_type": event.value
};
this._pd.changePDTypeValue(template).subscribe((data: any) => {
if (data.dataStatus) {
// Only update defaultPDType if the API call is successful
this.defaultPDType = event.value;
console.log('API call successful. Navigating to the same route...');
this.notifier.notify('success', 'Updated!');
window.location.reload();
} else {
// Handle error cases here
this.notifier.notify('warning', data.msg ? data.msg : 'Something Went Wrong. Try Again!');
window.location.reload();
}
}, (err: any) => {
// Handle error cases here
this.notifier.notify('warning', 'Something Went Wrong. Try Again!');
window.location.reload();
});
} else {
this.defaultPDType = this.oldPDType;
window.location.reload();
console.log('Canceled. PD Type remains unchanged.');
}
}
// isactiveBranch(id: number,isactive : number){
// let ActiveDatas = isactive == 0

View File

@ -1093,4 +1093,11 @@ loadTemplate(form_id) {
)
}
changePDTypeValue(editData: any): Observable<any> {
editData.fk_updatedby = this._aws.getlocale();
// return this._http.post<any>("http://localhost/AWSEC2/sparqapi/api/updatePDMaster", { records: editData })
return this._http.post<any>(this.apiUrl + "updatePDMaster", { records: editData })
.pipe(catchError(this.handleError('operation', [])))
}
}