UI Changes

This commit is contained in:
venbatechnologies@gmail.com 2018-12-21 17:31:56 +05:30
parent 4ef358af1a
commit b4f1ece063
4 changed files with 107 additions and 72 deletions

View File

@ -19,26 +19,29 @@
<mat-card> <mat-card>
<!-- <mat-card-title>Address Details</mat-card-title> --> <!-- <mat-card-title>Address Details</mat-card-title> -->
<mat-card-content> <mat-card-content>
<div fxLayout="row wrap">
<mat-form-field> <div fxFlex="33">
<mat-form-field style="width: 80%;">
<!-- <input matInput placeholder="Name" formControlName="name_ans" type="text" required> --> <!-- <input matInput placeholder="Name" formControlName="name_ans" type="text" required> -->
<input matInput placeholder="Address" formControlName="address" required autocomplete="off"> <input matInput placeholder="Address" formControlName="address" required autocomplete="off">
</mat-form-field> </mat-form-field>
</div>
<mat-form-field> <div fxFlex="33">
<mat-form-field style="width: 80%;">
<mat-select placeholder="Address Type" formControlName="address_type" required> <mat-select placeholder="Address Type" formControlName="address_type" required>
<mat-option value="{{m_addressType.address_type_id}}" <mat-option value="{{m_addressType.address_type_id}}"
*ngFor="let m_addressType of addressData">{{m_addressType.address_type}} *ngFor="let m_addressType of addressData">{{m_addressType.address_type}}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_type'].value == 12" style="width: 80%;">
<mat-form-field *ngIf="addressForm.controls['address_type'].value == 12">
<input matInput placeholder="Address Type Others" formControlName="address_type_others" autocomplete="off"> <input matInput placeholder="Address Type Others" formControlName="address_type_others" autocomplete="off">
</mat-form-field> </mat-form-field>
</div>
<mat-form-field> <div fxFlex="33">
<mat-form-field style="width: 80%;">
<mat-select placeholder="Locality" formControlName="locality" required> <mat-select placeholder="Locality" formControlName="locality" required>
<mat-option value="{{m_locality.locality_id}}" <mat-option value="{{m_locality.locality_id}}"
*ngFor="let m_locality of localityData">{{m_locality.locality_name}} *ngFor="let m_locality of localityData">{{m_locality.locality_name}}
@ -46,27 +49,65 @@
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="addressForm.controls.locality.value == 'Others'"> <mat-form-field *ngIf="addressForm.controls.locality.value == 'Others'" style="width: 80%;">
<input matInput placeholder="Specify Locality" <input matInput placeholder="Specify Locality"
formControlName="locality_others" autocomplete="off"> formControlName="locality_others" autocomplete="off">
</mat-form-field> </mat-form-field>
</div>
<mat-form-field style="width: 30%">
</div>
<div fxLayout="row wrap">
<div fxFlex="33">
<mat-form-field style="width: 80%;">
<mat-select placeholder="Approach to PD Location" formControlName="pd_location" required> <mat-select placeholder="Approach to PD Location" formControlName="pd_location" required>
<mat-option value="{{data.pd_location_approach_id}}" <mat-option value="{{data.pd_location_approach_id}}"
*ngFor="let data of locationdata">{{data.description}} *ngFor="let data of locationdata">{{data.description}}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div>
<mat-form-field style="width: 30%"> <div fxFlex="33">
<mat-form-field style="width: 80%;">
<mat-select placeholder="Comment on Locality" formControlName="comment_locality" required> <mat-select placeholder="Comment on Locality" formControlName="comment_locality" required>
<mat-option value="{{data.comments_on_locality_id}}" <mat-option value="{{data.comments_on_locality_id}}"
*ngFor="let data of commentData">{{data.rating}} *ngFor="let data of commentData">{{data.rating}}
</mat-option> </mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div>
<div fxFlex="33">
<mat-form-field style="width: 80%;">
<mat-select placeholder="Ownership" formControlName="address_ownership">
<mat-option value="{{ownerShip.id}}"
*ngFor="let ownerShip of ownerShipData">
{{ownerShip.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_ownership'].value == 4 " style="width: 80%;">
<input matInput placeholder="Specify Other Ownership" formControlName="other_ownership" autocomplete="off">
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_ownership'].value == 3 " style="width: 80%;">
<input matInput placeholder="What is the monthly rent paid?" formControlName="rent_amt" autocomplete="off">
</mat-form-field>
</div>
</div>
<div fxLayout="row wrap">
<div fxFlex="33">
<mat-form-field style="width: 80%;">
<mat-select placeholder="Is there any business activity is being run?"
formControlName="bussiness_activity" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
</div>
</div>
<!-- Don't Remove To replace atlast of the PD Completion and creating new form (Customer Behaviour 221118 review doc : s.no 3.e ) <!-- Don't Remove To replace atlast of the PD Completion and creating new form (Customer Behaviour 221118 review doc : s.no 3.e )
<mat-form-field> <mat-form-field>
<mat-select placeholder="Customer Behaviour" <mat-select placeholder="Customer Behaviour"
@ -77,30 +118,8 @@
</mat-select> </mat-select>
</mat-form-field>--(Customer Behaviour)--> </mat-form-field>--(Customer Behaviour)-->
<mat-form-field>
<mat-select placeholder="Ownership" formControlName="address_ownership">
<mat-option value="{{ownerShip.id}}"
*ngFor="let ownerShip of ownerShipData">
{{ownerShip.name}}
</mat-option>
</mat-select>
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_ownership'].value == 4 " style="width: 38%">
<input matInput placeholder="Specify Other Ownership" formControlName="other_ownership" autocomplete="off">
</mat-form-field>
<mat-form-field *ngIf="addressForm.controls['address_ownership'].value == 3 " style="width: 38%">
<input matInput placeholder="What is the monthly rent paid?" formControlName="rent_amt" autocomplete="off">
</mat-form-field>
<mat-form-field style="width: 42%">
<mat-select placeholder="Is there any business activity is being run?"
formControlName="bussiness_activity" required>
<mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option>
</mat-select>
</mat-form-field>
<!-- <mat-form-field *ngIf="addressForm.controls['bussiness_activity'].value == 'yes'" style="width: 100%"> --> <!-- <mat-form-field *ngIf="addressForm.controls['bussiness_activity'].value == 'yes'" style="width: 100%"> -->
<!-- <mat-select placeholder="Bussiness Type" formControlName="bussiness_address_type"> <!-- <mat-select placeholder="Bussiness Type" formControlName="bussiness_address_type">
@ -157,7 +176,7 @@
<mat-form-field *ngIf="item.get('premises_ownership').value == 3" style="width: 40%;"> <mat-form-field *ngIf="item.get('premises_ownership').value == 3" style="width: 40%;">
<input matInput placeholder="What is the monthly rent paid?" formControlName="premises_rent_amt" autocomplete="off"> <input matInput placeholder="What is the monthly rent paid?" formControlName="premises_rent_amt" autocomplete="off">
</mat-form-field> </mat-form-field>
<mat-form-field> <mat-form-field style="width: 40%">
<input matInput placeholder="Remarks" <input matInput placeholder="Remarks"
formControlName="premises_remarks" style="width: 65%;" autocomplete="off"> formControlName="premises_remarks" style="width: 65%;" autocomplete="off">
</mat-form-field> </mat-form-field>

View File

@ -33,8 +33,7 @@
<mat-form-field style="width: 45%;" *ngIf="businessForm.controls.profession_name.value=='Others'"> <mat-form-field style="width: 45%;" *ngIf="businessForm.controls.profession_name.value=='Others'">
<input matInput placeholder="Other Name in Which The Business is Run" formControlName="profession_name_other" required> <input matInput placeholder="Other Name in Which The Business is Run" formControlName="profession_name_other" required>
</mat-form-field> </mat-form-field>
</div>
<div flexLayout="row wrap">
<mat-form-field style="width: 45%;"> <mat-form-field style="width: 45%;">
<mat-select placeholder="Business Entity Type" <mat-select placeholder="Business Entity Type"
formControlName="business_entity_type" required> formControlName="business_entity_type" required>
@ -44,6 +43,12 @@
<mat-form-field style="width: 45%;" *ngIf="businessForm.controls.business_entity_type.value=='Others'"> <mat-form-field style="width: 45%;" *ngIf="businessForm.controls.business_entity_type.value=='Others'">
<input matInput placeholder="Other Business Entity Type" formControlName="business_entity_type_other" required> <input matInput placeholder="Other Business Entity Type" formControlName="business_entity_type_other" required>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 45%">
<mat-select placeholder="Industry"
formControlName="industry">
<mat-option value="{{list.industry_classification_id}}" *ngFor="let list of industryData">{{list.name}}</mat-option>
</mat-select>
</mat-form-field>
</div> </div>
<!-- <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none"> <!-- <div fxLayout="row" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field> <mat-form-field>
@ -54,12 +59,7 @@
</mat-form-field> </mat-form-field>
</div> --> </div> -->
<mat-form-field style="width: 45%">
<mat-select placeholder="Industry"
formControlName="industry">
<mat-option value="{{list.industry_classification_id}}" *ngFor="let list of industryData">{{list.name}}</mat-option>
</mat-select>
</mat-form-field>
<!--<mat-card> <!--<mat-card>
@ -242,7 +242,7 @@
<mat-card-content formArrayName="manufacturing_activity_details"> <mat-card-content formArrayName="manufacturing_activity_details">
<mat-card *ngFor="let manufacturing of businessForm.controls.manufacturing_activity_details['controls']; let m=index" [formGroupName]="m"> <mat-card *ngFor="let manufacturing of businessForm.controls.manufacturing_activity_details['controls']; let m=index" [formGroupName]="m">
<mat-card-content> <mat-card-content>
<mat-form-field style="width: 45%;"> <mat-form-field style="width: 35%;">
<input matInput type="text" placeholder="Main Product" formControlName="main_products" required> <input matInput type="text" placeholder="Main Product" formControlName="main_products" required>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 45%;"> <mat-form-field style="width: 45%;">
@ -418,7 +418,7 @@
<mat-card-content formArrayName="wholesale_trading_activity_details"> <mat-card-content formArrayName="wholesale_trading_activity_details">
<mat-card *ngFor="let wholesale of businessForm.controls.wholesale_trading_activity_details['controls']; let w=index" [formGroupName]="w"> <mat-card *ngFor="let wholesale of businessForm.controls.wholesale_trading_activity_details['controls']; let w=index" [formGroupName]="w">
<mat-card-content> <mat-card-content>
<mat-form-field style="width: 45%;"> <mat-form-field style="width: 35%;">
<input matInput type="text" placeholder="Main Product" formControlName="main_products" required> <input matInput type="text" placeholder="Main Product" formControlName="main_products" required>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 45%;"> <mat-form-field style="width: 45%;">

View File

@ -17,11 +17,15 @@
<div fxLayout="row wrap"> <div fxLayout="row wrap">
<div fxFlex="100"> <div fxFlex="100">
<mat-card> <mat-card>
<mat-form-field style="width: 25%"> <div fxLayout="row wrap">
<div fxFlex="33">
<mat-form-field style="width: 80%">
<input matInput placeholder="Loan Amount Applied for ? " formControlName="loan_amount" (keypress)="keyPress($event)" (keyup)="inWords($event,1)" (change)="loanCalc()" required autocomplete="off"> <input matInput placeholder="Loan Amount Applied for ? " formControlName="loan_amount" (keypress)="keyPress($event)" (keyup)="inWords($event,1)" (change)="loanCalc()" required autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{loanAmtInWords}} Only</mat-hint> <mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{loanAmtInWords}} Only</mat-hint>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 25%"> </div>
<div fxFlex="33">
<mat-form-field style="width: 80%">
<mat-select multiple (selectionChange)="endUserChange($event.value)" placeholder="What is the end use" formControlName="end_use" required> <mat-select multiple (selectionChange)="endUserChange($event.value)" placeholder="What is the end use" formControlName="end_use" required>
<mat-option *ngFor="let enduse of m_endUseofLoad" [value]="enduse.subproduct_id">{{ enduse.name }}</mat-option> <mat-option *ngFor="let enduse of m_endUseofLoad" [value]="enduse.subproduct_id">{{ enduse.name }}</mat-option>
</mat-select> </mat-select>
@ -37,52 +41,64 @@
<mat-option value="other">Other purpose</mat-option> <mat-option value="other">Other purpose</mat-option>
</mat-select>--> </mat-select>-->
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="isOtherPurpose" style="width: 25%"> </div>
<div fxFlex="33">
<mat-form-field *ngIf="isOtherPurpose" style="width: 80%">
<input matInput placeholder="Specify End Use" formControlName="end_use_other" autocomplete="off"> <input matInput placeholder="Specify End Use" formControlName="end_use_other" autocomplete="off">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 30%"> </div>
</div>
<div fxLayout="row wrap">
<div fxFlex="33">
<mat-form-field style="width: 80%">
<mat-select placeholder="Is there a balance transfer ? " (selectionChange)="selectedBalancesTransferChanges($event)" <mat-select placeholder="Is there a balance transfer ? " (selectionChange)="selectedBalancesTransferChanges($event)"
formControlName="is_transfer" required > formControlName="is_transfer" required >
<mat-option value="yes">Yes</mat-option> <mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option> <mat-option value="no">No</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
</div>
</div>
<div *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes' && loanDetailsForm.controls['is_transfer'].value != ''"> <div *ngIf="loanDetailsForm.controls['is_transfer'].value == 'yes' && loanDetailsForm.controls['is_transfer'].value != ''">
<mat-form-field style="width: 50%"> <mat-form-field style="width: 60%">
<input matInput placeholder="What is the amount required for Balance Transfer ? " (keypress)="keyPress($event)" formControlName="balance_transfer_amount" (keyup)="inWords($event,2)" (change)="loanCalc()" autocomplete="off"> <input matInput placeholder="What is the amount required for Balance Transfer ? " (keypress)="keyPress($event)" formControlName="balance_transfer_amount" (keyup)="inWords($event,2)" (change)="loanCalc()" autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{balTxrfAmtInWords}} Only</mat-hint> <mat-hint align="end" *ngIf="loanDetailsForm.controls['loan_amount'].value != ''">{{"&#8377;"}} {{balTxrfAmtInWords}} Only</mat-hint>
</mat-form-field> </mat-form-field>
<mat-form-field style="width:20%"> <mat-form-field style="width:30%">
<mat-select placeholder="Is there a Top Up" <mat-select placeholder="Is there a Top Up"
formControlName="is_topup" required> formControlName="is_topup" required>
<mat-option value="yes">Yes</mat-option> <mat-option value="yes">Yes</mat-option>
<mat-option value="no">No</mat-option> <mat-option value="no">No</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 50%"> <mat-form-field style="width: 60%">
<mat-select placeholder="Lender from where balance transfer done" <mat-select placeholder="Lender from where balance transfer done"
formControlName="lender"> formControlName="lender">
<mat-option *ngFor="let btLen of m_btLenderList" [value]="btLen.bt_lender_list_id">{{ btLen.lender_name }}</mat-option> <mat-option *ngFor="let btLen of m_btLenderList" [value]="btLen.bt_lender_list_id">{{ btLen.lender_name }}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['lender'].value == 3" style="width: 25%"> <mat-form-field *ngIf="loanDetailsForm.controls['lender'].value == 3" style="width: 30%">
<input matInput placeholder="Specify Others Lender" formControlName="other_bt_lender" autocomplete="off"> <input matInput placeholder="Specify Others Lender" formControlName="other_bt_lender" autocomplete="off">
</mat-form-field> </mat-form-field>
<mat-form-field *ngIf="loanDetailsForm.controls['is_topup'].value == 'yes' && loanDetailsForm.controls['is_topup'].value != '' " style="width: 20%"> <mat-form-field *ngIf="loanDetailsForm.controls['is_topup'].value == 'yes' && loanDetailsForm.controls['is_topup'].value != '' " style="width: 60%">
<input matInput placeholder="Top Up Amount" (keypress)="keyPress($event)" formControlName="topup_amount" (keyup)="inWords($event,5)" autocomplete="off"> <input matInput placeholder="Top Up Amount" (keypress)="keyPress($event)" formControlName="topup_amount" (keyup)="inWords($event,5)" autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['topup_amount'].value != ''">{{"&#8377;"}} {{topUpAmtInWords}} Only</mat-hint> <mat-hint align="end" *ngIf="loanDetailsForm.controls['topup_amount'].value != ''">{{"&#8377;"}} {{topUpAmtInWords}} Only</mat-hint>
</mat-form-field> </mat-form-field>
</div> </div>
<div *ngIf="loanDetailsForm.controls['is_transfer'].value != 'yes' && loanDetailsForm.controls['is_transfer'].value != '' "> <div *ngIf="loanDetailsForm.controls['is_transfer'].value != 'yes' && loanDetailsForm.controls['is_transfer'].value != '' ">
<mat-form-field style="width: 35%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Amount of Own Contribution" formControlName="own_contribution" (keypress)="keyPress($event)" required (keyup)="inWords($event,4)" autocomplete="off"> <input matInput placeholder="Amount of Own Contribution" formControlName="own_contribution" (keypress)="keyPress($event)" required (keyup)="inWords($event,4)" autocomplete="off">
<mat-hint align="end" *ngIf="loanDetailsForm.controls['own_contribution'].value != ''">{{"&#8377;"}} {{ownContributionInWords}} Only</mat-hint> <mat-hint align="end" *ngIf="loanDetailsForm.controls['own_contribution'].value != ''">{{"&#8377;"}} {{ownContributionInWords}} Only</mat-hint>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 35%"> <mat-form-field style="width: 30%">
<mat-select placeholder="Source" formControlName="source" required> <mat-select placeholder="Source" formControlName="source" required>
<mat-option *ngFor="let sour of m_sourceofamount" [value]="sour.id">{{ sour.name }}</mat-option> <mat-option *ngFor="let sour of m_sourceofamount" [value]="sour.id">{{ sour.name }}</mat-option>
</mat-select> </mat-select>
@ -102,7 +118,7 @@
</div> </div>
<mat-form-field style="width: 50%"> <mat-form-field style="width: 30%">
<input matInput placeholder="EMI Comfort Level" formControlName="emi_level" (keypress)="keyPress($event)" required autocomplete="off"> <input matInput placeholder="EMI Comfort Level" formControlName="emi_level" (keypress)="keyPress($event)" required autocomplete="off">
</mat-form-field> </mat-form-field>
<!-- <div *ngIf="productAbbr === 'HL' || productAbbr === 'LL' || productAbbr === 'LAP' "> --> <!-- <div *ngIf="productAbbr === 'HL' || productAbbr === 'LL' || productAbbr === 'LAP' "> -->

View File

@ -17,26 +17,26 @@
<mat-card style="margin: 12px;"> <mat-card style="margin: 12px;">
<h6 style="margin: 12px;">Raw Material #{{l+1}}</h6> <h6 style="margin: 12px;">Raw Material #{{l+1}}</h6>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none"> <div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Raw Material Name" formControlName="manufacturing_raw_material_name"> <input matInput placeholder="Raw Material Name" formControlName="manufacturing_raw_material_name">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Supplier Name" formControlName="manufacturing_supplier_name"> <input matInput placeholder="Supplier Name" formControlName="manufacturing_supplier_name">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Contact Person Name" formControlName="manufacturing_contact_person_name"> <input matInput placeholder="Contact Person Name" formControlName="manufacturing_contact_person_name">
</mat-form-field> </mat-form-field>
</div> </div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none"> <div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Contact Person Mobile Number" formControlName="manufacturing_contact_person_mobile_number"> <input matInput placeholder="Contact Person Mobile Number" formControlName="manufacturing_contact_person_mobile_number">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Type" formControlName="manufacturing_payment_type"> <mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Type" formControlName="manufacturing_payment_type">
<mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option> <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%" *ngIf="items.get('manufacturing_payment_type').value == 3"> <mat-form-field style="width: 30%" *ngIf="items.get('manufacturing_payment_type').value == 3">
<input matInput placeholder="Number of days of credit provided" formControlName="manufacturing_credit_days"> <input matInput placeholder="Number of days of credit provided" formControlName="manufacturing_credit_days">
</mat-form-field> </mat-form-field>
</div> </div>
@ -70,26 +70,26 @@
<mat-card style="margin: 12px;"> <mat-card style="margin: 12px;">
<h6 style="margin: 12px;">Trading Product #{{l+1}}</h6> <h6 style="margin: 12px;">Trading Product #{{l+1}}</h6>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none"> <div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Trade Product Name" formControlName="trade_product_name"> <input matInput placeholder="Trade Product Name" formControlName="trade_product_name">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Supplier Name" formControlName="trade_supplier_name"> <input matInput placeholder="Supplier Name" formControlName="trade_supplier_name">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Contact Person Name" formControlName="trade_product_contact_person_name"> <input matInput placeholder="Contact Person Name" formControlName="trade_product_contact_person_name">
</mat-form-field> </mat-form-field>
</div> </div>
<div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none"> <div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<input matInput placeholder="Contact Person Mobile Number" formControlName="trade_product_contact_person_mobile_number"> <input matInput placeholder="Contact Person Mobile Number" formControlName="trade_product_contact_person_mobile_number">
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%"> <mat-form-field style="width: 30%">
<mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Type" formControlName="trade_product_payment_type"> <mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Type" formControlName="trade_product_payment_type">
<mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option> <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
</mat-select> </mat-select>
</mat-form-field> </mat-form-field>
<mat-form-field style="width: 100%" *ngIf="items.get('trade_product_payment_type').value == 3"> <mat-form-field style="width: 30%" *ngIf="items.get('trade_product_payment_type').value == 3">
<input matInput placeholder="Number of days of credit provided" formControlName="trade_product_credit_days"> <input matInput placeholder="Number of days of credit provided" formControlName="trade_product_credit_days">
</mat-form-field> </mat-form-field>
</div> </div>