UI changes

This commit is contained in:
venbatechnologies@gmail.com 2019-01-11 19:00:32 +05:30
parent 7f31639c51
commit 559fd9d815
2 changed files with 53 additions and 50 deletions

View File

@ -41,13 +41,13 @@
<div [formGroupName]="s">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Property Type" formControlName="property_type" >
<mat-option *ngFor="let prop of m_propertyType" [value]="prop.id">{{ prop.name | titlecase }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:30%" *ngIf="detail.get('property_type').value == 5">
<mat-form-field style="width:40%" *ngIf="detail.get('property_type').value == 5">
<input matInput placeholder="Other Property Type" formControlName="other_property_type" autocomplete="off">
</mat-form-field>
</div>
@ -60,7 +60,7 @@
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_four_weeler" autocomplete="off">
</mat-form-field>
</div>
@ -73,7 +73,7 @@
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_two_weeler" autocomplete="off">
</mat-form-field>
</div>
@ -100,29 +100,29 @@
<div [formGroupName]="s">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Premium Paid" formControlName="premium_paid" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,s,5)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('premium_paid').value != ''">{{"&#8377;"}} {{PremiumPaidInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('premium_paid').value != ''">{{"&#8377;"}} {{PremiumPaidInwords[s]}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Frequency" formControlName="frequency_mode" >
<mat-option *ngFor="let freqn of m_freqOfPurchase" [value]="freqn.frequency_id">{{ freqn.name | titlecase }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:30%" *ngIf="detail.get('frequency_mode').value == 8 ">
<mat-form-field style="width:40%" *ngIf="detail.get('frequency_mode').value == 8 ">
<input matInput placeholder="Specify Frequency" formControlName="other_frequency_mode" autocomplete="off">
</mat-form-field>
</div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Sum Assured" formControlName="sum_assured" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,s,7)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('sum_assured').value != ''">{{"&#8377;"}} {{SumAssuredInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('sum_assured').value != ''">{{"&#8377;"}} {{SumAssuredInwords[s]}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Members Covered" formControlName="members_coverd" autocomplete="off">
</mat-form-field>
</div>
@ -136,19 +136,19 @@
<div *ngFor="let detail of sup['controls'].business_details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Type" formControlName="investments_type" >
<mat-option *ngFor="let ins_type of m_investmentType" [value]="ins_type.id">{{ ins_type.name | titlecase }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:30%" *ngIf="detail.get('investments_type').value == 6 ">
<mat-form-field style="width:40%" *ngIf="detail.get('investments_type').value == 6 ">
<input matInput placeholder="Specify Type" formControlName="other_investments_type" autocomplete="off">
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Amount of Investment" formControlName="amount_of_invest" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,s,9)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('amount_of_invest').value != ''">{{"&#8377;"}} {{AmtInvestInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('amount_of_invest').value != ''">{{"&#8377;"}} {{AmtInvestInwords[s]}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Bank Name" formControlName="bank_name" autocomplete="off">
</mat-form-field>
</div>
@ -168,20 +168,20 @@
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Value of the Assets" formControlName="any_other_asset_value" autocomplete="off" (keyup)="inWords($event,s,11)" (keypress)="keyPress($event)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('any_other_asset_value').value != ''">{{"&#8377;"}} {{AssetValueInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('any_other_asset_value').value != ''">{{"&#8377;"}} {{AssetValueInwords[s]}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Is there any asset loan?" formControlName="any_other_asset_loan">
<mat-option value="{{data.value}}" *ngFor="let data of m_any_asset_loan_type">{{data.viewValue | titlecase}}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:30%" *ngIf="businessEmiAmtFlag">
<mat-form-field style="width:40%" *ngIf="businessEmiAmtFlag">
<input matInput placeholder="What is the EMI amount ?" formControlName="other_asset_emi_amt" autocomplete="off" (keyup)="inWords($event,s,13)" (keypress)="keyPress($event)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('other_asset_emi_amt').value != ''">{{"&#8377;"}} {{B_emiAmtInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('other_asset_emi_amt').value != ''">{{"&#8377;"}} {{B_emiAmtInwords[s]}} Only</mat-hint>
</mat-form-field>
</div>
@ -195,9 +195,9 @@
<!--Desction Dynamic details : END -->
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field *ngIf="sup.get('business_assets_mode').value == 1 || sup.get('business_assets_mode').value == 4" style="width:30%">
<mat-form-field *ngIf="sup.get('business_assets_mode').value == 1 || sup.get('business_assets_mode').value == 4" style="width:45%">
<input matInput placeholder="Approximate Market Value" formControlName="business_approximate_market_value" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,i,1)">
<mat-hint align="start" style="font-size:70%" *ngIf="sup.get('business_approximate_market_value').value != ''">{{"&#8377;"}} {{appxMarketAmtInwords[i]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="sup.get('business_approximate_market_value').value != ''">{{"&#8377;"}} {{appxMarketAmtInwords[i]}} Only</mat-hint>
</mat-form-field>
<mat-form-field *ngIf="sup.get('business_assets_mode').value == 1 || sup.get('business_assets_mode').value == 2 || sup.get('business_assets_mode').value == 3 || sup.get('business_assets_mode').value == 4 || sup.get('business_assets_mode').value == 5" style="width:45%">
@ -219,14 +219,14 @@
<span *ngIf="sup.get('business_assets_mode').value != ''">
<mat-form-field style="width:30%">
<mat-form-field style="width:45%">
<mat-label>Vintage</mat-label>
<input matInput autocomplete="off" placeholder="eg.999" formControlName="business_vintage" minlength="1" maxlength="3" (keypress)="keyPress($event)" (keyup)="calculateVintagePurchase($event.target.value,i,1)">
<!-- <mat-error> Invalid format</mat-error> -->
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:45%">
<mat-label>Purchase Year</mat-label>
<input matInput autocomplete="off" placeholder="YYYY eg.2018" formControlName="business_purchase_year" minlength="4" maxlength="4" (keypress)="keyPress($event)" (keyup)="calculateVintagePurchase($event.target.value,i,2)">
@ -303,12 +303,12 @@
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Property Type" formControlName="property_type" >
<mat-option *ngFor="let prop of m_propertyType" [value]="prop.id">{{ prop.name | titlecase }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="detail.get('property_type').value == 5" style="width:30%">
<mat-form-field *ngIf="detail.get('property_type').value == 5" style="width:40%">
<input matInput placeholder="Other Property Type" formControlName="other_property_type" autocomplete="off">
</mat-form-field>
</div>
@ -320,7 +320,7 @@
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_four_weeler" autocomplete="off">
</mat-form-field>
</div>
@ -332,7 +332,7 @@
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Manufacturer, Model" formControlName="manufacturer_model_two_weeler" autocomplete="off">
</mat-form-field>
</div>
@ -371,27 +371,27 @@
<div *ngFor="let detail of sup['controls'].details['controls']; let s = index">
<div [formGroupName]="s">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Premium Paid" formControlName="premium_paid" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,s,6)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('premium_paid').value != ''">{{"&#8377;"}} {{OtherPremiumPaidInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('premium_paid').value != ''">{{"&#8377;"}} {{OtherPremiumPaidInwords[s]}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Frequency" formControlName="frequency_mode" >
<mat-option *ngFor="let freqn of m_freqOfPurchase" [value]="freqn.frequency_id">{{ freqn.name | titlecase }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:30%" *ngIf="detail.get('frequency_mode').value == 8 ">
<mat-form-field style="width:40%" *ngIf="detail.get('frequency_mode').value == 8 ">
<input matInput placeholder="Specify Frequency" formControlName="other_frequency_mode" autocomplete="off">
</mat-form-field>
</div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Sum Assured" formControlName="sum_assured" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,s,8)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('sum_assured').value != ''">{{"&#8377;"}} {{OtherSumAssuredInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('sum_assured').value != ''">{{"&#8377;"}} {{OtherSumAssuredInwords[s]}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Members Covered" formControlName="members_coverd" autocomplete="off">
</mat-form-field>
@ -407,24 +407,24 @@
<div [formGroupName]="s">
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Type" formControlName="investments_type" >
<mat-option *ngFor="let ins_type of m_investmentType" [value]="ins_type.id">{{ ins_type.name | titlecase }}</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field style="width:30%" *ngIf="detail.get('investments_type').value == 6">
<mat-form-field style="width:40%" *ngIf="detail.get('investments_type').value == 6">
<input matInput placeholder="Specify Type" formControlName="other_investments_type" autocomplete="off">
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Amount of Investment" formControlName="amount_of_invest" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,i,10)">
<mat-hint align="start" style="font-size:70%" *ngIf="sup.get('amount_of_invest').value != ''">{{"&#8377;"}} {{OtherAmtInvestInwords[i]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="sup.get('amount_of_invest').value != ''">{{"&#8377;"}} {{OtherAmtInvestInwords[i]}} Only</mat-hint>
</mat-form-field>
</div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Bank Name" formControlName="bank_name" autocomplete="off">
</mat-form-field>
</div>
@ -465,7 +465,7 @@
formControlName="other_owner" autocomplete="off">
</mat-form-field>
<!-- <mat-form-field style="width:30%">
<!-- <mat-form-field style="width:40%">
<mat-select placeholder="Relation" formControlName="relation" >
<mat-option value="{{relations.relationship_id}}"
*ngFor="let relations of m_relation">
@ -477,12 +477,12 @@
</div>
<div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<input matInput placeholder="Value of the Assets" formControlName="any_other_asset_value" autocomplete="off" (keyup)="inWords($event,s,12)" (keypress)="keyPress($event)">
<mat-hint align="start" style="font-size:70%" *ngIf="detail.get('any_other_asset_value').value != ''">{{"&#8377;"}} {{OtherAssetValueInwords[s]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="detail.get('any_other_asset_value').value != ''">{{"&#8377;"}} {{OtherAssetValueInwords[s]}} Only</mat-hint>
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-select placeholder="Is there any asset loan?" formControlName="any_other_asset_loan">
<mat-option value="{{data.value}}" *ngFor="let data of m_any_asset_loan_type">{{data.viewValue | titlecase}}</mat-option>
</mat-select>
@ -494,9 +494,9 @@
</div>
<!--Desction Dynamic details : END -->
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 4" style="width:30%">
<mat-form-field *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 4" style="width:40%">
<input matInput placeholder="Approximate Market Value" formControlName="approximate_market_value" (keypress)="keyPress($event)" autocomplete="off" (keyup)="inWords($event,i,2)">
<mat-hint align="start" style="font-size:70%" *ngIf="sup.get('approximate_market_value').value != ''">{{"&#8377;"}} {{OtherAppxMarketAmtInwords[i]}} Only</mat-hint>
<mat-hint align="start" style="font-size:90%" *ngIf="sup.get('approximate_market_value').value != ''">{{"&#8377;"}} {{OtherAppxMarketAmtInwords[i]}} Only</mat-hint>
</mat-form-field>
<mat-form-field *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 4 || sup.get('assets_mode').value == 5" style="width:45%">
@ -518,7 +518,7 @@
formControlName="other_owner" autocomplete="off">
</mat-form-field>
<!-- check -->
<!-- <mat-form-field *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 4 || sup.get('assets_mode').value == 5" style="width:30%">
<!-- <mat-form-field *ngIf="sup.get('assets_mode').value == 1 || sup.get('assets_mode').value == 2 || sup.get('assets_mode').value == 3 || sup.get('assets_mode').value == 4 || sup.get('assets_mode').value == 5" style="width:40%">
<mat-select placeholder="Relation" formControlName="relation" >
<mat-option value="{{relations.relationship_id}}"
*ngFor="let relations of m_relation">
@ -530,14 +530,14 @@
<span *ngIf="sup.get('assets_mode').value != ''">
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-label>Vintage</mat-label>
<input matInput autocomplete="off" placeholder="eg.999" formControlName="vintage_personal" minlength="1" maxlength="3" (keypress)="keyPress($event)" (keyup)="calculateVintagePurchase($event.target.value,i,3)">
<!-- <mat-error> Invalid format</mat-error> -->
</mat-form-field>
<mat-form-field style="width:30%">
<mat-form-field style="width:40%">
<mat-label>Purchase Year</mat-label>
<input matInput autocomplete="off" placeholder="YYYY eg.2018" formControlName="purchase_year" minlength="4" maxlength="4" (keypress)="keyPress($event)" (keyup)="calculateVintagePurchase($event.target.value,i,4)">

View File

@ -1,6 +1,9 @@
.paragraph_change {
color: #fff !important;
background-color: #e00201 !important;
}
.mat-form-field-appearance-legacy .mat-hint{
color:rgba(0, 0, 0, 0.8) !important;
}
.mat-card-content {
background-color: white;