supplier,stock,client form : ps

src/app/app.module.ts

@@ -9,6 +9,10 @@ import { StatusBar } from '@ionic-native/status-bar';
 import { SplashScreen } from '@ionic-native/splash-screen';
 import {platformBrowserDynamic} from '@angular/platform-browser-dynamic';
 import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
+import { SQLite } from '@ionic-native/sqlite';
+import { DatabaseProvider } from '../providers/database/database';
+import { AndroidPermissions } from '@ionic-native/android-permissions';
+
 import {
   MatAutocompleteModule,
   MatButtonModule,
@@ -81,11 +85,11 @@ import { PdQuestionFamilyPage } from '../pages/pd-question/pd-question-family/pd
 import { PdQuestionLoansPage } from '../pages/pd-question/pd-question-loans/pd-question-loans';
 import { PdQuestionFinancialInfoPage } from '../pages/pd-question/pd-question-financial-info/pd-question-financial-info';
 import { PdQuestionOtherIncomePage } from '../pages/pd-question/pd-question-other-income/pd-question-other-income';
-import { PdQuestionSupplierInfoPage } from '../pages/pd-question/pd-question-supplier-info/pd-question-supplier-info';
+import { PdQuestionSupplierInfoPage } from '../pages/pd-question/pd-question-business-group/pd-question-supplier-info/pd-question-supplier-info';
 import { Geolocation } from '@ionic-native/geolocation';
 import { PdQuestionPersonalInfoPage } from '../pages/pd-question/pd-question-personal-info/pd-question-personal-info';
-import { PdQuestionStockInfoPage } from '../pages/pd-question/pd-question-stock-info/pd-question-stock-info';
+import { PdQuestionStockInfoPage } from '../pages/pd-question/pd-question-business-group/pd-question-stock-info/pd-question-stock-info';
-import { PdQuestionClientInfoPage } from '../pages/pd-question/pd-question-client-info/pd-question-client-info';
+import { PdQuestionClientInfoPage } from '../pages/pd-question/pd-question-business-group/pd-question-client-info/pd-question-client-info';
 // import { DatePicker } from '@ionic-native/date-picker';
 import { PdQuestionBusinessInfoPage } from '../pages/pd-question/pd-question-business-group/pd-question-business-info/pd-question-business-info';
 import { PdQuestionRentalInfoPage } from '../pages/pd-question/pd-question-rental-info/pd-question-rental-info';

src/pages/pd-question/pd-question-business-group/pd-question-business-assets/pd-question-business-assets.html

@@ -10,7 +10,7 @@
       <button ion-button menuToggle>
           <ion-icon name="menu"></ion-icon>
         </button>
-    <ion-title *ngIf="!viewchange"> Business Asset Details</ion-title>
+        <ion-title *ngIf="!viewchange">{{formDetails.form_name}}</ion-title>
   </ion-navbar>
 
 </ion-header>

src/pages/pd-question/pd-question-business-group/pd-question-business-assets/pd-question-business-assets.ts

@@ -27,7 +27,7 @@ export class PdQuestionBusinessAssetsPage {
 
   company_id:any;
   pdDetails:any;
-  FormId:any;
+  formDetails : any;
   users:any;
   _businessAssetsQuesFrom:FormGroup;
   m_assets_type:any;
@@ -56,8 +56,8 @@ export class PdQuestionBusinessAssetsPage {
   constructor(public navCtrl: NavController, public navParams: NavParams,public aws:AwsServiceProvider,public fb:FormBuilder,public qustcat:QuestionCategoryProvider,public cons:ConstantsProvider,public toast:ToastProvider) {
     
     
-    this.pdDetails=this.navParams.get('pdDetails')
+    this.pdDetails=this.navParams.get('pdDetails');
-    this.FormId=this.navParams.get('FormId')
+    this.formDetails=this.navParams.get('formDetails');
     this.users=this.aws.getlocale();
     this.company_id=this.pdDetails.company_id;
     this.applicants = this.pdDetails.applicat_details;
@@ -73,9 +73,8 @@ export class PdQuestionBusinessAssetsPage {
    
     this.getDetails()
     this.getDropDown()
-    console.log("Form Id",this.FormId);
+    
-    console.log(this.pdDetails);
+    
-   
     let params:any={};
     params.pd_id=this.pdDetails.pd_id;
     params.pd_form_id='5'
@@ -187,7 +186,8 @@ export class PdQuestionBusinessAssetsPage {
     if(data==null){
       this._businessAssetsQuesFrom=this.fb.group({
         pdid: [this.pdDetails.pd_id],
-        formid: ['22'],
+        /* formid: ['22'],*/
+        formid: [this.formDetails.form_id],
         company_id : [this.company_id],
         fk_createdby:[this.users],
         business_years:[''],
@@ -209,7 +209,8 @@ export class PdQuestionBusinessAssetsPage {
       let value=data;
       this._businessAssetsQuesFrom=this.fb.group({
         pdid: [this.pdDetails.pd_id],
-        formid: ['22'],
+        /* formid: ['22'],*/
+        formid: [this.formDetails.form_id],
         company_id : [this.company_id],
         fk_createdby:[this.users],
 

src/pages/pd-question/pd-question-business-group/pd-question-business-banking/pd-question-business-banking.ts

@@ -25,7 +25,8 @@ pdDetails:any;
 m_btLenderList: any;
 applicants: any  
 salaryField: boolean;
-FormId: any;
+formDetails: any;
+form_id:any;
 accountType: any;
 users: any;
 bankingForm:FormGroup;
@@ -50,9 +51,10 @@ step:number
     this.pd_cus_segment=this.pdDetails.customer_segment_abbr.toUpperCase();
     this.pd_cus_segment=this.pd_cus_segment.substring(0,3)
     this.pdid=this.pdDetails.pd_id;
-    this.FormId = this.navParams.get('FormId');
+    this.formDetails=this.navParams.get('formDetails');
+    this.form_id = this.formDetails.form_id;
     this.company_id=this.pdDetails.company_id
-    console.log("Form Id",this.FormId);
+    // console.log("Form Id",this.FormId);
     this.applicants = this.pdDetails.applicat_details;
     this.applicants = this.applicants.filter(appt=>appt.applicant_type != 2)
     this.applicants.push({'pd_co_applicant_id':'0','applicant_name':'Others'}); 
@@ -257,7 +259,7 @@ step:number
   }
 
   retiveBankDetails(){
-    let records = {'pd_id':this.pdDetails.pd_id,'pd_form_id':this.FormId,'company_id':this.company_id}
+    let records = {'pd_id':this.pdDetails.pd_id,'pd_form_id':this.form_id,'company_id':this.company_id}
     const control = <FormArray>this.bankingForm.controls['itemRows'];
       this.qustCat.retiverForm(records).subscribe(res=>
         {
@@ -301,7 +303,7 @@ step:number
     {
       let records: any = {};
         records.pdid = this.pdDetails.pd_id;
-        records.formid = this.FormId;
+        records.formid = this.form_id;
         records.fk_createdby = this.users;
         records.company_id=this.company_id;
         records.banking_details = answerData.itemRows;

src/pages/pd-question/pd-question-business-group/pd-question-business-group.html

@@ -23,9 +23,9 @@
               </mat-panel-title>
               </mat-expansion-panel-header>
                <mat-card class="item-ribbon" *ngFor="let formButton of companyList.form_status;let quesIndex=index" (click)="OnSelectBusinessGroupForms(formButton, companyList)">
-                    <span class="ribbon javascript">
+                    <!-- <div class = "ribbon" [ngclass]="!formButton.isAnswered ? 'notanswered'  : 'answered'"><span>{{quesIndex+1}}</span></div> -->
-                          <span>{{quesIndex+1}}</span>
+                    <span *ngIf="formButton.isAnswered;" class="ribbon answered"><span>{{quesIndex+1}}</span></span>
-                    </span>
+                    <span *ngIf="!formButton.isAnswered;" class="ribbon notanswered"><span>{{quesIndex+1}}</span></span>
                     <div>
                           <p>{{ formButton.form_name }}</p>
                     </div>

src/pages/pd-question/pd-question-business-group/pd-question-business-group.scss

@@ -33,6 +33,8 @@ page-pd-question-business-group {
         $cruzeiro: #387ef5;
         $atletico: darken(#f4f4f4, 45%);
         $javascript: #f7e023;
+        $answered: green;
+        $notanswered: #f53d3d;
       
         .item-ribbon{
           background-color: #fff;
@@ -89,12 +91,12 @@ page-pd-question-business-group {
           }
         }
       
-        .ribbon.cruzeiro {
+        .ribbon.answered {
-          @include ribbonize($cruzeiro);
+          @include ribbonize($answered);
         }
       
-        .ribbon.atletico {
+        .ribbon.notanswered {
-          @include ribbonize($atletico);
+          @include ribbonize($notanswered);
         }
       
         .ribbon.javascript {

src/pages/pd-question/pd-question-business-group/pd-question-business-group.ts

@@ -2,8 +2,9 @@ import { Component } from '@angular/core';
 import { IonicPage, NavController, NavParams } from 'ionic-angular';
 
 import { QuestionCategoryProvider } from '../../../providers/question-category/question-category';
-import { PdQuestionSupplierInfoPage } from '../../../pages/pd-question/pd-question-supplier-info/pd-question-supplier-info';
+import { PdQuestionSupplierInfoPage } from '../../../pages/pd-question/pd-question-business-group/pd-question-supplier-info/pd-question-supplier-info';
-import { PdQuestionClientInfoPage } from '../../../pages/pd-question/pd-question-client-info/pd-question-client-info';
+import { PdQuestionClientInfoPage } from '../../../pages/pd-question/pd-question-business-group/pd-question-client-info/pd-question-client-info';
+import { PdQuestionStockInfoPage } from '../../../pages/pd-question/pd-question-business-group/pd-question-stock-info/pd-question-stock-info';
 import { PdQuestionBusinessInfoPage } from '../../../pages/pd-question/pd-question-business-group/pd-question-business-info/pd-question-business-info';
 import { PdQuestionBusinessAssetsPage } from '../../../pages/pd-question/pd-question-business-group/pd-question-business-assets/pd-question-business-assets'
 import {PdQuestionBusinessBankingPage} from '../../../pages/pd-question/pd-question-business-group/pd-question-business-banking/pd-question-business-banking'
@@ -61,32 +62,36 @@ export class PdQuestionBusinessGroupPage {
   this.pdDetails.business_month = company.business_month;
   
   if(details.form_id==1){
-    this.navCtrl.push(PdQuestionSupplierInfoPage,{'FormId':details.form_id,'pdDetails':this.pdDetails});
+    this.navCtrl.push(PdQuestionSupplierInfoPage,{'formDetails':details,'pdDetails':this.pdDetails});
-    console.log("form_id",details.form_id)
+    // console.log("form_id",details.form_id)
   }
   if(details.form_id==2){
-    this.navCtrl.push(PdQuestionClientInfoPage,{'FormId':details.form_id,'pdDetails':this.pdDetails});
+    this.navCtrl.push(PdQuestionClientInfoPage,{'formDetails':details,'pdDetails':this.pdDetails});
-    console.log("form_id",details.form_id)
+    // console.log("form_id",details.form_id)
+  }
+  if(details.form_id==11){
+    this.navCtrl.push(PdQuestionStockInfoPage,{'formDetails':details,'pdDetails':this.pdDetails});
+    // console.log("form_id",details.form_id)
   }
   if(details.form_id==13){
-    this.navCtrl.push(PdQuestionBusinessInfoPage,{'FormId':details.form_id,'pdDetails':this.pdDetails});
+    this.navCtrl.push(PdQuestionBusinessInfoPage,{'formDetails':details,'pdDetails':this.pdDetails});
-    console.log("form_id",details.form_id)
+    // console.log("form_id",details.form_id)
   }
   if(details.form_id==14){
-    this.navCtrl.push(PdQuestionSupplierInfoPage,{'FormId':details.form_id,'pdDetails':this.pdDetails});
+    this.navCtrl.push('',{'formDetails':details,'pdDetails':this.pdDetails});
-    console.log("form_id",details.form_id)
+    // console.log("form_id",details.form_id)
   }
   if(details.form_id==15){
-    this.navCtrl.push(PdQuestionSupplierInfoPage,{'FormId':details.form_id,'pdDetails':this.pdDetails});
+    this.navCtrl.push(PdQuestionSupplierInfoPage,{'formDetails':details.form_id,'pdDetails':this.pdDetails});
-    console.log("form_id",details.form_id)
+    // console.log("form_id",details.form_id)
   }
   if(details.form_id==21){
-    this.navCtrl.push(PdQuestionBusinessBankingPage,{'FormId':details.form_id,'pdDetails':this.pdDetails});
+    this.navCtrl.push(PdQuestionBusinessBankingPage,{'formDetails':details.form_id,'pdDetails':this.pdDetails});
-    console.log("form_id",details.form_id)
+    // console.log("form_id",details.form_id)
   }
   if(details.form_id==22){
-    this.navCtrl.push(PdQuestionBusinessAssetsPage,{'FormId':details.form_id,'pdDetails':this.pdDetails});
+    this.navCtrl.push(PdQuestionBusinessAssetsPage,{'formDetails':details.form_id,'pdDetails':this.pdDetails});
-    console.log("form_id",details.form_id)
+    // console.log("form_id",details.form_id)
   }
 
 

src/pages/pd-question/pd-question-business-group/pd-question-business-info/pd-question-business-info.html

@@ -4,7 +4,7 @@
       <button ion-button menuToggle>
         <ion-icon name="menu"></ion-icon>
       </button>
-      <ion-title *ngIf="!viewchange">{{FormId.form_name}}</ion-title>
+      <ion-title *ngIf="!viewchange">{{formdetails.form_name}}</ion-title>
   
   
     </ion-navbar>

src/pages/pd-question/pd-question-business-group/pd-question-business-info/pd-question-business-info.ts

@@ -22,7 +22,7 @@ import { ConstantsProvider } from '../../../../providers/constants/constants'
 })
 export class PdQuestionBusinessInfoPage {
     stateList:any=[];
-  users: any;
+  users: any;formdetails:any;
   FormId: any;
   pdDetails: any;
   businessForm:FormGroup;
@@ -64,7 +64,8 @@ export class PdQuestionBusinessInfoPage {
     this.pdDetails = this.navParams.get('pdDetails');
     this.pdid=this.pdDetails.pd_id
     console.log("pdDetails",this.pdDetails)
-    this.FormId = this.navParams.get('FormId');
+    this.formdetails = this.navParams.get('formDetails');
+    this.FormId = this.formdetails.form_id;
     this.users = this.aws.getlocale();
     //console.log("pd",this.pdDetails);
    this.applicants=this.pdDetails.applicat_details;

src/pages/pd-question/pd-question-business-group/pd-question-client-info/pd-question-client-info.html

@@ -0,0 +1,464 @@
+<ion-header>
+
+        <ion-navbar color="optblue">
+                <button ion-button menuToggle>
+                    <ion-icon name="menu"></ion-icon>
+                  </button>
+              <ion-title *ngIf="!viewchange">{{formDetails.form_name}}</ion-title>
+        </ion-navbar>
+
+</ion-header>
+<ion-content padding *ngIf="noRecordsFound">
+  <form [formGroup]="clientInfoForm"> 
+      
+          <mat-card *ngIf="manufacturingForm">
+              <mat-card-title>Manufacturing Product Details</mat-card-title>
+              <div formArrayName="manufacturing_details">
+                  <div *ngFor="let item of clientInfoForm.controls.manufacturing_details['controls']; let i=index" [formGroupName]="i">
+                      <div formArrayName="main_raw_materials">
+                          <div *ngFor="let items of item.controls.main_raw_materials['controls']; let l=index;let last =last" [formGroupName]="l">
+                              <mat-card>
+                                  <mat-card-subtitle>Product #{{l+1}}</mat-card-subtitle>
+                                  <mat-card-content>
+                                  <div fxLayout="row nowrap" fxLayoutGap="2px" fxLayoutAlign="start none">
+                                      <mat-form-field style="width:100%">
+                                          <mat-select placeholder="Manufacturing Product Name" formControlName="manufacturing_product_name">
+                                              <mat-option *ngFor="let pm of m_manufacturingProducts[0]" [value]="pm.name">{{ pm.name }}</mat-option>
+                                          </mat-select>
+                                      </mat-form-field>
+                                      
+                                      <!--<mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Raw Material Name" formControlName="manufacturing_raw_material_name">
+                                      </mat-form-field>-->
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Name" formControlName="manufacturing_client_name">
+                                      </mat-form-field>
+                                  
+                                  
+                                          <mat-form-field style="width: 100%">
+                                                  <mat-select  placeholder="Title" formControlName="person_title_name">
+                                                      <mat-option *ngFor="let tl of titleList" [value]="tl.title_id">
+                                                          {{tl.name}}
+                                                      </mat-option>                    
+                                                  </mat-select>
+                                  </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Contact Person Name" formControlName="manufacturing_contact_person_name">
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <mat-select placeholder="Contact Person Designation" formControlName="person_designation" (selectionChange)="selectedPersonDesignation(items,$event.value,1)" >
+                                                  <mat-option>Select</mat-option>
+                                                  <mat-option *ngFor="let comrelShip of companyRelationShipList" [value]="comrelShip.company_relationship_id">
+                                                  {{comrelShip.name}}
+                                                  </mat-option>
+                                                  <!-- <mat-option value="1" > Not Applicable </mat-option> -->
+                                              </mat-select>
+                                          </mat-form-field>
+                                          <mat-form-field style="width: 100%" *ngIf="items.get('person_designation').value == 1">
+                                              <input matInput placeholder="Specify Person Designation" formControlName="other_person_designation">
+                                      </mat-form-field>
+                                  
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Contact Person Mobile Number" formControlName="manufacturing_contact_person_mobile_number" type="number"  maxlength="10">
+                                          <mat-error>Enter Valid Mobile Number.</mat-error>  
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <input matInput autocomplete="off" placeholder="STD Code" formControlName="person_stdcode"  type="number">
+                                              <mat-error>Enter Valid STD Code Number.</mat-error>  
+                                      </mat-form-field> 
+                                      <!-- &nbsp; - &nbsp; -->
+                                      <mat-form-field style="width: 100%">
+                                              <input matInput autocomplete="off" placeholder="Client Contact Person Landline Number" formControlName="person_landline"  type="number">
+                                              <mat-error>Enter Valid LandLine Number.</mat-error>  
+                                      </mat-form-field>
+                                  
+                                  
+                                      <mat-form-field style="width: 100%">
+                                          <!-- <mat-select placeholder="Payment Type" formControlName="manufacturing_payment_type">
+                                              <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
+                                          </mat-select> -->
+                                          <mat-select placeholder="Payment Terms" formControlName="manufacturing_payment_type" (selectionChange)="checkCard($event.value,1,l);">
+                                                  <mat-option *ngFor="let pm of m_paymentType" [value]="pm.id">{{ pm.name }}</mat-option>
+                                              </mat-select>
+                                          
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <mat-select placeholder="Payment Mode" formControlName="manufacturing_payment_mode">
+                                                      <mat-option value="Payment received in Cash.">Payment received in Cash.</mat-option>
+                                                      <mat-option value="Payment received through Banking channels.">Payment received through Banking channels.</mat-option>
+                                                  </mat-select>
+                                              
+                                              </mat-form-field>
+                                      
+                                  
+                                  <span *ngIf="items.get('manufacturing_payment_type').value == 3">
+                                      <mat-label>No of days of Credit provided to Client for payment</mat-label>
+                                      
+                                          <mat-form-field style="width: 100%" >
+                                              <input matInput placeholder="Days From" formControlName="manufacturing_credit_days_from" type="number">
+                                          </mat-form-field>
+                                          <mat-form-field style="width: 100%" >
+                                              <input matInput placeholder="Days To" formControlName="manufacturing_credit_days_to" type="number">
+                                          </mat-form-field>
+                                  </span>
+                                  </div>
+                                  <ion-col offset-6 col-3>
+                                      <a (click)="addMoreRawMaterials($event); false" *ngIf="last">
+                                          <ion-icon name="md-add" color="optblue" style="font-size: 22px;"></ion-icon>
+                                      </a>
+                                  </ion-col>
+                                  <ion-col offset-3 col-1>
+                                      <a *ngIf="item.controls.main_raw_materials.controls.length > 1" (click)="removeRawMaterials(l)">
+                                          <ion-icon name="md-close" color="optblue" style="font-size: 22px;"></ion-icon>
+                                      </a>
+                                  </ion-col>
+                                </mat-card-content>
+                              </mat-card>
+                              
+                          </div>
+                      </div>
+                              <!-- <div fxlayout="row">
+                          <mat-form-field style="width: 80%" *ngIf="mfgCreditCardFlag">
+                              <input matInput placeholder="What Percentage of Total Sales is done on Credit ?" formControlName="main_raw_materials_total_payments_percent_on_credit"
+                                  type="number">
+                          </mat-form-field>
+                      </div> -->
+                         
+                      </div>
+              </div>
+          </mat-card>
+          <mat-card *ngIf="tradingForm">
+              <mat-card-title>Trading Product Details</mat-card-title>
+              <div formArrayName="trade_details">
+                  <div *ngFor="let item of clientInfoForm.controls.trade_details['controls']; let i=index" [formGroupName]="i">
+                      <div formArrayName="trading_products">
+                          <div *ngFor="let items of item.controls.trading_products['controls']; let l=index;let last =last" [formGroupName]="l">
+                              <mat-card>
+                                  <mat-card-subtitle>Trading Product #{{l+1}}</mat-card-subtitle>
+                                  <mat-card-content>
+                                  
+                                  <div fxLayout="row nowrap" fxLayoutGap="2px" fxLayoutAlign="start none">
+                                      <mat-form-field style="width: 100%">
+                                          <mat-select placeholder="Trading Product Name" formControlName="trade_product_name">
+                                              <mat-option *ngFor="let pm of m_tradingProducts" [value]="pm.name">{{ pm.name }}</mat-option>
+                                          </mat-select>
+                                      </mat-form-field>
+                                      <!--<mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Trade Product Name" formControlName="trade_product_name">
+                                      </mat-form-field>-->
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Name" formControlName="trade_client_name">
+                                      </mat-form-field>
+                                  
+                                  
+                                              <mat-form-field style="width: 100%">
+                                                      <mat-select  placeholder="Title" formControlName="person_title_name">
+                                                          <mat-option *ngFor="let tl of titleList" [value]="tl.title_id">
+                                                              {{tl.name}}
+                                                          </mat-option>                    
+                                                      </mat-select>
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Contact Person Name" formControlName="trade_product_contact_person_name">
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <mat-select placeholder="Contact Person Designation" formControlName="person_designation" (selectionChange)="selectedPersonDesignation(items,$event.value,2)">
+                                                  <mat-option>Select</mat-option>
+                                                  <mat-option *ngFor="let comrelShip of companyRelationShipList" [value]="comrelShip.company_relationship_id">
+                                                  {{comrelShip.name}}
+                                                  </mat-option>
+                                                  <!-- <mat-option value="1" > Not Applicable </mat-option> -->
+                                              </mat-select>
+                                          </mat-form-field>
+                                          <mat-form-field style="width: 100%" *ngIf="items.get('person_designation').value == 1">
+                                              <input matInput placeholder="Specify Person Designation" formControlName="other_person_designation">
+                                      </mat-form-field>
+                                  
+                                  
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Contact Person Mobile Number" formControlName="trade_product_contact_person_mobile_number" type="number"  maxlength="10">
+                                          <mat-error>Enter Valid Mobile Number.</mat-error>  
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <input matInput autocomplete="off" placeholder="STD Code" formControlName="person_stdcode"  type="number">
+                                              <mat-error>Enter Valid STD Code Number.</mat-error>  
+                                      </mat-form-field> &nbsp; - &nbsp;
+                                      <mat-form-field style="width: 100%">
+                                              <input matInput autocomplete="off" placeholder="Client Contact Person Landline Number" formControlName="person_landline"  type="number">
+                                              <mat-error>Enter Valid LandLine Number.</mat-error>  
+                                      </mat-form-field>
+                                      
+
+                                      <mat-form-field style="width: 100%">
+                                          <!-- <mat-select placeholder="Payment Type" formControlName="trade_product_payment_type">
+                                              <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
+                                          </mat-select> -->
+                                              <mat-select placeholder="Payment Terms" formControlName="trade_product_payment_type" (selectionChange)="checkCard($event.value,2,l);">
+                                                  <mat-option *ngFor="let pm of m_paymentType" [value]="pm.id">{{ pm.name }}</mat-option>
+                                              </mat-select>
+                                          
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <mat-select placeholder="Payment Mode" formControlName="trade_product_payment_mode">
+                                                      <mat-option value="Payment received in Cash.">Payment received in Cash.</mat-option>
+                                                      <mat-option value="Payment received through Banking channels.">Payment received through Banking channels.</mat-option>
+                                                  </mat-select>
+                                              
+                                      </mat-form-field>
+                                      <!-- <mat-form-field style="width: 45%" *ngIf="items.get('trade_product_payment_type').value == 3">
+                                          <input matInput placeholder="No. of Days of Credit Given for Payment Receipt" formControlName="trade_product_credit_days">
+                                      </mat-form-field> -->
+                                  
+                                  
+                                      <mat-label>No of days of Credit provided to Client for payment</mat-label>
+                                          <mat-form-field style="width: 100%" >
+                                              <input matInput placeholder="Days From" formControlName="trade_product_credit_days_from" type="number">
+                                          </mat-form-field>
+                                          <mat-form-field style="width: 100%" >
+                                              <input matInput placeholder="Days To" formControlName="trade_product_credit_days_to" type="number">
+                                          </mat-form-field>
+                                  </div>
+                                  <ion-col offset-6 col-3>
+                                      <a (click)="addMoretradeProduct($event); false" *ngIf="last">
+                                          <ion-icon name="md-add" color="optblue" style="font-size: 22px;"></ion-icon>
+                                      </a>
+                                  </ion-col>
+                                  <ion-col offset-3 col-1>
+                                      <a *ngIf="item.controls.trading_products.controls.length > 1" (click)="removeTradingProduct(l)">
+                                          <ion-icon name="md-close" color="optblue" style="font-size: 22px;"></ion-icon>
+                                      </a>
+                                  </ion-col>
+                                </mat-card-content>
+                              </mat-card>
+                              
+                          </div>
+                      </div>
+                              <div fxlayout="row">
+                                      <mat-form-field style="width: 80%" *ngIf="trdCreditCardFlag">
+                                              <input matInput placeholder="What Percentage of Total Sales is done on Credit ?" formControlName="trading_products_total_payments_percent_on_credit"
+                                                  type="number">
+                                          </mat-form-field>
+                                  </div>
+                  </div>
+              </div>
+          </mat-card>
+          <!--===========================: service provider details : START-->
+          <mat-card *ngIf="serviceProviderForm">
+              <!--<h5 style="margin: 12px;padding:10px !important;">Service Provider Product Details</h5>-->
+              <div formArrayName="service_provider_details">
+                  <div *ngFor="let item of clientInfoForm.controls.service_provider_details['controls']; let i=index" [formGroupName]="i">
+                      <div formArrayName="service_products">
+                          <div *ngFor="let items of item.controls.service_products['controls']; let l=index;let last =last" [formGroupName]="l">
+                              <mat-card>
+                                  <mat-card-subtitle>Service Provided #{{l+1}}</mat-card-subtitle>
+                                  <mat-card-content>
+                                  
+                                  <div fxLayout="row wrap" fxLayoutGap="2px" fxLayoutAlign="start none">
+                                      <mat-form-field style="width: 100%">
+                                          <mat-select placeholder="Select the Service Provided" formControlName="service_provider_product_name">
+                                              <mat-option *ngFor="let pm of m_suplierProducts[0]" [value]="pm.name">{{ pm.name }}</mat-option>
+                                          </mat-select>
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <input matInput placeholder="Client Name" formControlName="service_provider_client_name">
+                                          </mat-form-field>
+                                      
+                                      
+                                      <mat-form-field style="width: 100%">
+                                              <mat-select  placeholder="Title" formControlName="person_title_name">
+                                                  <mat-option *ngFor="let tl of titleList" [value]="tl.title_id">
+                                                      {{tl.name}}
+                                                  </mat-option>                    
+                                              </mat-select>
+                              </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Contact Person Name" formControlName="service_provider_product_contact_person_name">
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <mat-select placeholder="Contact Person Designation" formControlName="person_designation" (selectionChange)="selectedPersonDesignation(items,$event.value,3)">
+                                                  <mat-option>Select</mat-option>
+                                                  <mat-option *ngFor="let comrelShip of companyRelationShipList" [value]="comrelShip.company_relationship_id">
+                                                  {{comrelShip.name}}
+                                                  </mat-option>
+                                                  <!-- <mat-option value="1" > Not Applicable </mat-option> -->
+                                              </mat-select>
+                                          </mat-form-field>
+                                          <mat-form-field style="width: 100%" *ngIf="items.get('person_designation').value == 1">
+                                              <input matInput placeholder="Specify Person Designation" formControlName="other_person_designation">
+                                          </mat-form-field>
+                                  
+                                      <mat-form-field style="width: 100%">
+                                          <input matInput placeholder="Client Contact Person Mobile Number" formControlName="service_provider_product_contact_person_mobile_number" type="number"  maxlength="10">
+                                          <mat-error>Enter Valid Mobile Number.</mat-error>  
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <input matInput autocomplete="off" placeholder="STD Code" formControlName="person_stdcode"  type="number">
+                                              <mat-error>Enter Valid STD Code Number.</mat-error>  
+                                      </mat-form-field> &nbsp; - &nbsp;
+                                      <mat-form-field style="width: 100%">
+                                              <input matInput autocomplete="off" placeholder="Client Contact Person Landline Number" formControlName="person_landline"  type="number">
+                                              <mat-error>Enter Valid LandLine Number.</mat-error>  
+                                      </mat-form-field>
+                                      
+                                      <mat-form-field style="width: 100%">
+                                          <!-- <mat-select placeholder="Payment Type" formControlName="service_provider_product_payment_type">
+                                              <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
+                                          </mat-select> -->
+                                          <mat-select placeholder="Payment Terms" formControlName="service_provider_product_payment_type" (selectionChange)="checkCard($event.value,3,l);">
+                                                  <mat-option *ngFor="let pm of m_paymentType" [value]="pm.id">{{ pm.name }}</mat-option>
+                                              </mat-select>
+                                          
+                                      </mat-form-field>
+                                      <mat-form-field style="width: 100%">
+                                              <mat-select placeholder="Payment Mode" formControlName="service_provider_product_payment_mode">
+                                                      <mat-option value="Payment received in Cash.">Payment received in Cash.</mat-option>
+                                                      <mat-option value="Payment received through Banking channels.">Payment received through Banking channels.</mat-option>
+                                                  </mat-select>
+                                              
+                                              </mat-form-field>
+                                      <!-- <mat-form-field style="width: 45%" *ngIf="items.get('service_provider_product_payment_type').value == 3">
+                                          <input matInput placeholder="No. of Days of Credit Given for Payment Receipt" formControlName="service_provider_product_credit_days">
+                                      </mat-form-field> -->
+                                  </div>
+                                  <span *ngIf="items.get('service_provider_product_payment_type').value == 3">
+                                      <mat-label>No of days of Credit provided to Client for payment</mat-label>
+                                          <mat-form-field style="width: 100%" >
+                                              <input matInput placeholder="Days From" formControlName="service_provider_product_credit_days_from" type="number">
+                                          </mat-form-field>
+                                          <mat-form-field style="width: 100%" >
+                                              <input matInput placeholder="Days To" formControlName="service_provider_product_credit_days_to" type="number">
+                                          </mat-form-field>
+                                        </span>
+                                  <ion-col offset-6 col-3>
+                                      <a (click)="addMoreServiceProduct($event); false" *ngIf="last">
+                                          <ion-icon name="md-add" color="optblue" style="font-size: 22px;"></ion-icon>
+                                      </a>
+                                  </ion-col>
+                                  <ion-col offset-3 col-1>
+                                      <a *ngIf="item.controls.service_products.controls.length > 1" (click)="removeServiceProduct(l)">
+                                          <ion-icon name="md-close" color="optblue" style="font-size: 22px;"></ion-icon>
+                                      </a>
+                                  </ion-col>
+                                  
+                                  </mat-card-content>
+                              </mat-card>
+                          </div>
+                      </div>
+                      
+                      <div fxlayout="row">
+                              <mat-form-field style="width: 80%" *ngIf="spCreditCardFlag">
+                                      <input matInput placeholder="What Percentage of Total Sales is done on Credit ?" formControlName="service_products_total_payments_percent_on_credit"
+                                          type="number">
+                                  </mat-form-field>
+                          </div>
+                         
+                      </div>
+              </div>
+          </mat-card>
+          <mat-card>
+                <mat-form-field style="width: 100%">
+                    <mat-label>Remarks</mat-label>
+                    <textarea matInput placeholder="Remarks" formControlName="supplier_info_form_remark"></textarea>
+                </mat-form-field>
+         </mat-card>
+          <!-- <mat-card *ngIf="retaildTradingForm">
+              <h5 style="margin: 12px;padding:10px !important;">Retail Trading Product Details</h5>
+              <div style="text-align: center; margin: 12px;">Retail Trading Details Not applicable here !!</div>
+          </mat-card> -->
+          <ion-row>
+              <button ion-button full color="optblue" (click)="saveClientInfo(clientInfoForm.value)"> Save</button>
+              
+            </ion-row>
+  </form>
+</ion-content>
+
+
+
+
+<!-- <div formArrayName="clientArray" fxFill>
+        
+    <div *ngFor="let sup of clientForms.controls.clientArray['controls']; let i=index;let last=last;">
+        <mat-card>
+      <div [formGroupName]="i">
+        <div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
+          <div>
+            <mat-form-field style="width: 100%">
+              <input matInput placeholder="Client Name" formControlName="client_name">
+              <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
+            </mat-form-field>
+          </div>
+          <div>
+            <mat-form-field style="width: 100%">
+              <input matInput placeholder="Contact Person Name" formControlName="contact_person">
+              <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
+            </mat-form-field>
+          </div>
+          <div>
+            <mat-form-field style="width: 100%">
+              <input matInput placeholder="Contact Mobile Number" formControlName="mobile_number" type="number"  maxlength="10">
+              <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
+            </mat-form-field>
+          </div>
+        </div>
+        <div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
+          <div>
+            <mat-form-field style="width: 100%">
+              <mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Mode" formControlName="payment_mode">
+                <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
+              </mat-select>
+            </mat-form-field>
+          </div>
+          <div *ngIf="sup.get('payment_mode').value == 1 ||  sup.get('payment_mode').value == 3">
+            <mat-form-field style="width: 100%">
+              <input matInput type="number" placeholder="% of immediate / Advance Payment Purchase to Total Purchase?" formControlName="per_of_immediate_advance_payment">
+              <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
+            </mat-form-field>
+          </div>
+          <div *ngIf="sup.get('payment_mode').value == 2  || sup.get('payment_mode').value == 3">
+            <mat-form-field style="width: 100%">
+              <input type="number" matInput placeholder="Credit Period" formControlName="credit_period">
+              <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
+            </mat-form-field>
+          </div>
+        </div>
+        <div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
+          <div>
+            <mat-form-field style="width: 100%">
+              <mat-select (selectionChange)="selectedFreqPurchase($event)" placeholder="Select Frequency of Purchase" formControlName="frequency_of_purchase">
+                <mat-option *ngFor="let feq of m_freqOfPurchase" [value]="feq.frequency_id">{{ feq.name }}</mat-option>
+              </mat-select>
+            </mat-form-field>
+          </div>
+          <div *ngIf="sup.get('frequency_of_purchase').value == 8">
+            <mat-form-field style="width: 100%">
+              <input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value">
+              <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>--
+            </mat-form-field>
+          </div>
+
+          <div fxFlex="20">
+            <!-- <span *ngIf="clientForms.controls.clientArray.controls.length > 1" (click)="removeLanguage(i)">
+                 <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
+               </span> --
+          </div>
+        </div>
+      </div>
+      <ion-col offset-6 col-3>
+          <a (click)="addClientDetails()" *ngIf="last">
+              <ion-icon name="md-add" color="optblue" style="font-size: 22px;"></ion-icon>
+          </a>
+      </ion-col>
+      <ion-col offset-3 col-1>
+          <a (click)="removeClientDetails(i)">
+              <ion-icon name="md-close" color="optblue" style="font-size: 22px;"></ion-icon>
+          </a>
+      </ion-col>
+    </mat-card>
+    <br/>
+    </div>
+    </div>
+    <ion-row>
+            
+        <button ion-button full color="optblue" (click)="saveclientDetails(clientForms.value)"> Save</button>
+        <!-- </ion-buttons> --
+    </ion-row> -->

src/pages/pd-question/pd-question-business-group/pd-question-client-info/pd-question-client-info.scss

@@ -0,0 +1,13 @@
+page-pd-question-client-info {
+    mat-hint{
+        font-size:12px;
+    }
+   .mat-card{
+        margin-bottom: 15px;
+        border-radius: 10px !important;
+        box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2) !important;
+    }
+    .mat-card-content{
+        margin-bottom: 0px !important;
+    }
+}

src/pages/pd-question/pd-question-business-group/pd-question-client-info/pd-question-client-info.ts

@@ -0,0 +1,731 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { QuestionCategoryProvider } from '../../../../providers/question-category/question-category';
+import { AwsServiceProvider } from '../../../../providers/aws-service/aws-service';
+import { ToastProvider } from '../../../../providers/common-provider/toast';
+import { FormGroup, FormBuilder, FormArray } from '@angular/forms';
+
+/**
+ * Generated class for the PdQuestionClientInfoPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+
+@Component({
+  selector: 'page-pd-question-client-info',
+  templateUrl: 'pd-question-client-info.html',
+})
+export class PdQuestionClientInfoPage {
+
+  users: any;
+  pdDetails: any;
+  formDetails: any;
+  pdid:any;
+  company_id:any;
+  questionDetails: any;
+  clientInfoForm: FormGroup;
+
+
+
+
+  public submitted = false;
+
+  public m_paymentType = [];
+
+  companyRelationShipList: any=[];
+  
+  titleList: any=[];
+  noRecordsFound: Boolean = false;
+  errorMessage: any = '';
+  m_manufacturingProducts : any =[];
+  m_tradingProducts:any=[];
+  m_suplierProducts : any =[];
+  
+  
+  constructor(public navCtrl: NavController, public navParams: NavParams,public qustCat:QuestionCategoryProvider,public aws:AwsServiceProvider,public toast:ToastProvider,public fb:FormBuilder) {
+    this.pdDetails = this.navParams.get('pdDetails');
+    this.formDetails=this.navParams.get('formDetails');
+    this.users = this.aws.getlocale();
+    this.pdid=this.pdDetails.pd_id;
+    this.company_id=this.pdDetails.company_id;
+
+    this.qustCat.getTypeofActivityForSuppliedInfoForm(this.pdid,this.company_id).subscribe(data => {
+      
+      if(data.dataStatus){
+      
+      let datas = data.records;
+      this.m_manufacturingProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 2 ){return data}}).map(data=> [...data.prodcuts]);
+      // this.m_tradingProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 3){return data}}).map(data=> [...data.prodcuts]);
+      this.m_suplierProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 5 ){return data}}).map(data=> [...data.prodcuts]);
+      let api = Object.keys(datas.type_of_activity).map(function (key) {
+        return datas.type_of_activity[key];
+      });
+      if(api.length > 0){     
+        api.forEach(val => {
+          if (val.type_of_activity_id == 3) {
+            if(val.prodcuts){
+              this.m_tradingProducts.push(val.prodcuts);
+            }
+          }
+
+          if (val.type_of_activity_id == 4) {
+            if(val.prodcuts){
+              this.m_tradingProducts.push(val.prodcuts);
+            }
+          }
+        });
+      }
+      this.m_tradingProducts = [].concat.apply([], this.m_tradingProducts);
+
+      this.initFormLoadDetails(datas.type_of_activity);
+
+      }else {
+        this.toast.pdTriggerappmessage('No Category Records Found.!');
+        this.noRecordsFound = false;
+        this.errorMessage = data.msg;
+      }
+    }, err => {
+      this.toast.pdTriggerappmessage('No Category Records Found.!');
+      this.noRecordsFound = false;
+      this.errorMessage = 'No Records Found , Something went Wrong!';
+    });
+
+    this.getdropList();
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad PdQuestionClientInfoPage');
+  }
+
+  initFormLoadDetails(record) {
+    let params: any = {};
+        params.pd_id = this.pdid;
+        params.pd_form_id = this.formDetails.form_id;
+        params.company_id = this.company_id;
+        this.qustCat.retiverForm(params).subscribe(
+      data => {
+        if (data['dataStatus']) {
+          let dataForm = data['records'];
+          if (dataForm !== undefined) {
+            this.clientInfoForm = this.fb.group({
+              pdid: [this.pdid],
+              formid: [this.formDetails.form_id],
+              company_id:[this.company_id],
+              fk_createdby:[this.users],
+              manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+              trade_details: this.fb.array([this.tradingFormCreation(record)]),
+              service_provider_details: this.fb.array([this.serviceProviderFormCreation(record)]),
+              supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
+              // wholesale_trade_details: this.fb.array([this.tradingFormCreation(record)]),
+            });
+            // Load form details for manufacturing
+            let arr = record.filter(data => data.type_of_activity_id == 2);
+            if (arr.length > 0) {
+              // let api_main_raw_materials = Object.keys(dataForm.main_raw_materials).map(function (key) {
+              //   return dataForm.main_raw_materials[key];
+              // });
+               let api_main_raw_materials = dataForm.manufacturing_details[0].main_raw_materials;
+           
+              this.initManufacturingProductsDetails(api_main_raw_materials);
+              this.clientInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(dataForm.manufacturing_details[0].main_raw_materials_total_payments_percent_on_credit || null);
+            }
+
+            // Load form details for the wholeshale trading details
+            let arr1 = record.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id == 4);
+            if (arr1.length > 0) {
+              // let api_trading_products = Object.keys(dataForm.trading_products).map(function (key) {
+              //   return dataForm.trading_products[key];
+              // });
+               let api_trading_products = dataForm.trade_details[0].trading_products;
+                  
+              this.initTradingProductsDetails(api_trading_products);
+              this.clientInfoForm.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(dataForm.trade_details[0].trading_products_total_payments_percent_on_credit || null);
+            }
+
+            // Load form details for the service provider prduct details 
+            let arr2 = record.filter(data => data.type_of_activity_id == 5);
+            if (arr2.length > 0) {
+              // let api_service_provider_products = Object.keys(dataForm.service_products).map(function (key) {
+              //   return dataForm.service_products[key];
+              // });
+              let api_service_provider_products = dataForm.service_provider_details[0].service_products;
+              this.initServiceProviderProductsDetails(api_service_provider_products);
+              this.clientInfoForm.controls['service_provider_details']['controls'][0].controls['service_products_total_payments_percent_on_credit'].setValue(dataForm.service_provider_details[0].service_products_total_payments_percent_on_credit || null);
+            }
+            // Load form details for the retail trading details
+            let arr3 = record.filter(data => data.type_of_activity_id == 3);
+            // if (arr3.length > 0) {
+            //   this.retaildTradingForm = true;
+            // }
+            this.noRecordsFound = true;
+          } else {
+            this.clientInfoForm = this.fb.group({
+              pdid: [this.pdid],
+              formid: [this.formDetails.form_id],
+              company_id:[this.company_id],
+              fk_createdby:[this.users],
+              manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+              trade_details: this.fb.array([this.tradingFormCreation(record)]),
+              service_provider_details: this.fb.array([this.serviceProviderFormCreation(record)]),
+              supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
+              // wholesale_trade_details: this.fb.array([this.tradingFormCreation(record)]),
+            });
+            let arr = record.filter(data => data.type_of_activity_id == 2);
+            if (arr.length > 0) {
+              this.initManufacturingProductsDetails(null);
+              this.clientInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
+            }
+            let arr1 = record.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id == 4);
+            if (arr1.length > 0) {
+              this.initTradingProductsDetails(null);
+              this.clientInfoForm.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(null);
+            }
+            let arr2 = record.filter(data => data.type_of_activity_id == 5);
+            if (arr2.length > 0) {
+              let api_service_provider_products = Object.keys(dataForm.service_products).map(function (key) {
+                return dataForm.service_products[key];
+              });
+              this.initServiceProviderProductsDetails(api_service_provider_products);
+              this.clientInfoForm.controls['service_provider_details']['controls'][0].controls['service_products_total_payments_percent_on_credit'].setValue(null);
+            }
+            // Load form details for the retail trading details
+            let arr3 = record.filter(data => data.type_of_activity_id == 3);
+            // if (arr3.length > 0) {
+            //   this.retaildTradingForm = true;
+            // }
+            this.noRecordsFound = true;
+          }
+        } else {
+          this.clientInfoForm = this.fb.group({
+            pdid: [this.pdid],
+            formid: [this.formDetails.form_id],
+            company_id:[this.company_id],
+            fk_createdby:[this.users],
+            manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+            trade_details: this.fb.array([this.tradingFormCreation(record)]),
+            service_provider_details: this.fb.array([this.serviceProviderFormCreation(record)]),
+            supplier_info_form_remark: []
+            // wholesale_trade_details: this.fb.array([this.tradingFormCreation(record)]),
+          });
+          let arr = record.filter(data => data.type_of_activity_id == 2);
+          if (arr.length > 0) {
+            this.initManufacturingProductsDetails(null);
+            this.clientInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
+          }
+          let arr1 = record.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id == 4);
+          if (arr1.length > 0) {
+            this.initTradingProductsDetails(null);
+            this.clientInfoForm.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(null);
+          }
+          let arr2 = record.filter(data => data.type_of_activity_id == 5);
+          if (arr2.length > 0) {
+            this.initServiceProviderProductsDetails(null);
+            this.clientInfoForm.controls['service_provider_details']['controls'][0].controls['service_products_total_payments_percent_on_credit'].setValue(null);
+          }
+          // Load form details for the retail trading details
+          let arr3 = record.filter(data => data.type_of_activity_id == 3);
+          // if (arr3.length > 0) {
+          //   this.retaildTradingForm = true;
+          // }
+          this.noRecordsFound = true;
+        }
+      }, err => {
+
+      }
+    );
+  }
+
+  manufacturingForm: Boolean = false;
+  manufacturingFormCreation(val) {
+    let arr = val.filter(data => data.type_of_activity_id == 2);
+    if (arr.length > 0) {
+      this.manufacturingForm = true;
+      return this.fb.group({
+        main_raw_materials: this.fb.array([]),
+        main_raw_materials_total_payments_percent_on_credit: []
+      })
+      // }
+    } else {
+      return;
+    }
+  }
+
+  tradingForm: Boolean = false;
+  tradingFormCreation(val) {
+    // let arr = val.filter(data => data.type_of_activity_id == 4);
+    let arr = val.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id == 4);
+    if (arr.length > 0) {
+      this.tradingForm = true;
+      return this.fb.group({
+        trading_products: this.fb.array([]),
+        trading_products_total_payments_percent_on_credit: []
+      });
+    } else {
+      return;
+    }
+  }
+
+  serviceProviderForm: Boolean = false;
+  serviceProviderFormCreation(val) {
+    let arr = val.filter(data => data.type_of_activity_id == 5);
+    if (arr.length > 0) {
+      this.serviceProviderForm = true;
+      return this.fb.group({
+        service_products: this.fb.array([]),
+        service_products_total_payments_percent_on_credit: []
+      });
+    } else {
+      return;
+    }
+  }
+
+  initManufacturingProductsDetails(datas) {
+    const control = <FormArray>this.clientInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
+    if (datas === null) {
+      control.push(this.initManufacturingProducts(null));
+    } else {
+      datas.forEach((val,inx) => {
+        this.checkCard(val.manufacturing_payment_type,1,inx);
+        control.push(this.initManufacturingProducts(val));
+       });
+      // for (let val of datas) {
+      //   control.push(this.initManufacturingProducts(val));
+      // }
+    }
+  }
+
+  initManufacturingProducts(records) {
+    if (records === null) {
+      return this.fb.group({
+        manufacturing_product_name: [''],
+        manufacturing_client_name: [''],
+        manufacturing_contact_person_name: [''],
+        manufacturing_contact_person_mobile_number: [''],//,Validators.compose([Validators.minLength(10),Validators.maxLength(10)])],
+        manufacturing_payment_type: [''],
+        manufacturing_payment_mode:[''],
+        // manufacturing_credit_days: [''],
+        person_title_name:[''],
+        person_designation:[''],
+        person_stdcode:[''],// Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])],
+        person_landline:[''],// Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])],
+        other_person_designation:[''],
+        manufacturing_credit_days_from:[''],
+        manufacturing_credit_days_to:['']
+      })
+    } else {
+      return this.fb.group({
+        manufacturing_product_name: [records.manufacturing_product_name || null],
+        manufacturing_client_name: [records.manufacturing_client_name || null],
+        manufacturing_contact_person_name: [records.manufacturing_contact_person_name || null],
+        manufacturing_contact_person_mobile_number: [records.manufacturing_contact_person_mobile_number || null],//Validators.compose([Validators.minLength(10),Validators.maxLength(10)])],
+        manufacturing_payment_type: [records.manufacturing_payment_type || null],
+        manufacturing_payment_mode:[records.manufacturing_payment_mode || null],
+        manufacturing_credit_days: [records.manufacturing_credit_days || null],
+        person_title_name:[records.person_title_name || null],
+        person_designation:[records.person_designation || null],
+        person_stdcode:[records.person_stdcode || null],// Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])],
+        person_landline:[records.person_landline || null],// Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])],
+        other_person_designation:[records.other_person_designation || null],
+        manufacturing_credit_days_from:[records.manufacturing_credit_days_from || null],
+        manufacturing_credit_days_to:[records.manufacturing_credit_days_to || null]
+      })
+    }
+  }
+
+  initTradingProductsDetails(datas) {
+    const control = <FormArray>this.clientInfoForm.controls['trade_details']['controls'][0].controls['trading_products'];
+    if (datas === null) {
+      control.push(this.initTradingProducts(null));
+    } else {
+      datas.forEach((val,inx) => {
+        this.checkCard(val.trade_product_payment_type,2,inx);
+        control.push(this.initTradingProducts(val));
+      });
+      // for (let val of datas) {
+      //   control.push(this.initTradingProducts(val));
+      // }
+    }
+  }
+
+  initTradingProducts(records) {
+    if (records === null) {
+      return this.fb.group({
+        trade_product_name: [''],
+        trade_client_name: [''],
+        trade_product_contact_person_name: [''],
+        trade_product_contact_person_mobile_number: [''],//Validators.compose([Validators.minLength(10),Validators.maxLength(10)])],
+        trade_product_payment_type: [''],
+        trade_product_payment_mode:[''],
+        trade_product_frequency_of_purchase: [''],
+        trade_product_credit_days_from: [''],
+        trade_product_credit_days_to: [''],
+        person_title_name:[''],
+        person_designation:[''],
+        person_stdcode:[''],// Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])],
+        person_landline:[''],// Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])],
+        other_person_designation:[''],
+      })
+    } else {
+      return this.fb.group({
+        trade_product_name: [records.trade_product_name],
+        trade_client_name: [records.trade_client_name],
+        trade_product_contact_person_name: [records.trade_product_contact_person_name],
+        trade_product_contact_person_mobile_number: [records.trade_product_contact_person_mobile_number],//Validators.compose([Validators.minLength(10),Validators.maxLength(10)])],
+        trade_product_payment_type: [records.trade_product_payment_type],
+        trade_product_payment_mode:[records.trade_product_payment_mode],
+        trade_product_frequency_of_purchase: [records.trade_product_frequency_of_purchase],
+        trade_product_credit_days_from: [records.trade_product_credit_days_from],
+        trade_product_credit_days_to: [records.trade_product_credit_days_to],
+        person_title_name:[records.person_title_name || null],
+        person_designation:[records.person_designation || null],
+        person_stdcode:[records.person_stdcode || null],// Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])],
+        person_landline:[records.person_landline || null],// Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])],
+        other_person_designation:[records.other_person_designation || null],
+      })
+    }
+  }
+
+  initServiceProviderProductsDetails(datas) {
+    const control = <FormArray>this.clientInfoForm.controls['service_provider_details']['controls'][0].controls['service_products'];
+    if (datas === null) {
+      control.push(this.initServiceProviderProducts(null));
+    } else {
+      datas.forEach((val,inx) => {
+        this.checkCard(val.service_provider_product_payment_type,3,inx);
+        control.push(this.initServiceProviderProducts(val));
+      });
+      // for (let val of datas) {
+      //   control.push(this.initServiceProviderProducts(val));
+      // }
+    }
+  }
+
+  initServiceProviderProducts(records) {
+    if (records === null) {
+      return this.fb.group({
+        service_provider_product_name: [''],
+        service_provider_client_name: [''],
+        service_provider_product_contact_person_name: [''],
+        service_provider_product_contact_person_mobile_number: [''],//Validators.compose([Validators.minLength(10),Validators.maxLength(10)])],
+        service_provider_product_payment_type: [''],
+        service_provider_product_payment_mode:[''],
+        service_provider_product_frequency_of_purchase: [''],
+        service_provider_product_credit_days_from: [''],
+        service_provider_product_credit_days_to: [''],
+        person_title_name:[''],
+        person_designation:[''],
+        person_stdcode:[''], //Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])],
+        person_landline:[''],// Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])],
+        other_person_designation:[''],
+      })
+    } else {
+      return this.fb.group({
+        service_provider_product_name: [records.service_provider_product_name],
+        service_provider_client_name: [records.service_provider_client_name],
+        service_provider_product_contact_person_name: [records.service_provider_product_contact_person_name],
+        service_provider_product_contact_person_mobile_number: [records.service_provider_product_contact_person_mobile_number],//Validators.compose([Validators.minLength(10),Validators.maxLength(10)])],
+        service_provider_product_payment_type: [records.service_provider_product_payment_type],
+        service_provider_product_payment_mode: [records.service_provider_product_payment_mode],
+        service_provider_product_frequency_of_purchase: [records.service_provider_product_frequency_of_purchase],
+        service_provider_product_credit_days_from: [records.service_provider_product_credit_days_from],
+        service_provider_product_credit_days_to: [records.service_provider_product_credit_days_to],
+        person_title_name:[records.person_title_name || null],
+        person_designation:[records.person_designation || null],
+        person_stdcode:[records.person_stdcode || null],// Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])],
+        person_landline:[records.person_landline || null],// Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])],
+        other_person_designation:[records.other_person_designation || null],
+      })
+    }
+  }
+
+  addMoreRawMaterials(e): void {
+    // e.stropPropagation();
+    const control = <FormArray>this.clientInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
+    
+    control.push(this.initManufacturingProducts(null));
+  }
+
+  removeRawMaterials(inx): void {
+    const control = <FormArray>this.clientInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
+    control.removeAt(inx);
+  }
+
+  addMoretradeProduct(e): void {
+    // e.stropPropagation();
+    const control = <FormArray>this.clientInfoForm.controls['trade_details']['controls'][0].controls['trading_products'];
+    
+    control.push(this.initTradingProducts(null));
+  }
+
+  removeTradingProduct(inx): void {
+    const control = <FormArray>this.clientInfoForm.controls['trade_details']['controls'][0].controls['trading_products'];
+    control.removeAt(inx);
+  }
+
+  addMoreServiceProduct(e): void {
+    // e.stropPropagation();
+    const control = <FormArray>this.clientInfoForm.controls['service_provider_details']['controls'][0].controls['service_products'];
+    
+    control.push(this.initServiceProviderProducts(null));
+  }
+
+  removeServiceProduct(inx): void {
+    const control = <FormArray>this.clientInfoForm.controls['service_provider_details']['controls'][0].controls['service_products'];
+    control.removeAt(inx);
+  }
+
+  getdropList(){
+      
+    this.qustCat.getcommondrop('COMPANYRELATIONSHIPS').subscribe(
+      data => {
+        this.companyRelationShipList = data['records'].filter(data => data.isactive == 1);
+    });
+
+    this.qustCat.getcommondrop('TITLES').subscribe(
+        data => {
+          this.titleList = data['records'].filter(data => data.isactive == 1);
+    });
+
+    this.qustCat.getcommondrop('PAYMENTMODE').subscribe(
+          data => {
+            this.m_paymentType = data['records'].filter(data => data.isactive == 1);
+    });
+  }
+//   saveclientDetails(answerData)
+// {
+//   let records:any ={};
+
+//         records.pdid = this.pdDetails.pd_id;
+//         records.formid = this.FormId.form_id;
+//         records.fk_createdby = this.users;
+        
+//         records.client_details = answerData.clientArray;
+
+//       this.qustCat.saveForm(records).subscribe(res=>
+//         {
+//           if(res['dataStatus']==true)
+//       {
+//         this.toast.pdTriggerappmessage('Record Saved Successfully.!');
+//         this.navCtrl.pop();
+//       }
+//         });
+
+      
+// }
+/** To Save/Edited Popup Data */
+saveClientInfo(answerFormValues){
+// console.log(answerFormValues);
+Object.keys(answerFormValues).forEach((key) => (answerFormValues[key] == null) && delete answerFormValues[key]);
+if(answerFormValues.manufacturing_details[0]==null){
+  delete answerFormValues['manufacturing_details'];
+}
+if(answerFormValues.trade_details[0]==null){
+  delete answerFormValues['trade_details'];
+}
+if(answerFormValues.service_provider_details[0]==null){
+  delete answerFormValues['service_provider_details'];
+}
+  
+    //To Remove The "Null" With Key also
+    Object.keys(answerFormValues).forEach((key) => {if(answerFormValues[key] === null || answerFormValues[key] === undefined || answerFormValues[key] === ''){ delete answerFormValues[key]}; });
+        this.qustCat.saveForm(answerFormValues).subscribe(responsed=>
+        {
+          if(responsed['status'] == 200) { 
+            this.navCtrl.pop();
+            this.toast.pdTriggerappmessage('Record Saved Successfully.!');
+          }else{
+            this.toast.pdTriggerappmessage('Something Wents Wrong Try Again.!');    
+          }
+    });
+
+}
+
+selectedPersonDesignation(items,e,flag){
+  if(flag == 1){
+  //  e==1 ? items.controls['other_person_designation'].setValidators([Validators.required])
+  //       : items.controls['other_person_designation'].clearValidators(),items.controls['other_person_designation'].setValue('');
+  //         items.controls['other_person_designation'].updateValueAndValidity();
+  }
+  else if(flag == 2){
+    // e==1 ?items.controls['other_person_designation'].setValidators([Validators.required])
+    //      :items.controls['other_person_designation'].clearValidators(),items.controls['other_person_designation'].setValue('');
+    //       items.controls['other_person_designation'].updateValueAndValidity();
+  }
+  else if(flag == 3){
+    // e==1 ?items.controls['other_person_designation'].setValidators([Validators.required])
+    //      :items.controls['other_person_designation'].clearValidators(),items.controls['other_person_designation'].setValue('');
+    //       items.controls['other_person_designation'].updateValueAndValidity();
+  }
+}
+
+mfgCreditCardFlag : boolean = false;
+trdCreditCardFlag : boolean = false;
+spCreditCardFlag : boolean = false;
+mfgCounter: any = [];
+trdCounter: any = [];
+spCounter: any =[];
+checkCard(e,flag,index){
+
+  if(flag == 3 &&  e==3){
+    this.spCounter[index] = 1;
+  }
+  else if(flag == 3 &&  e!=3){
+    this.spCounter[index] = 0;
+  }
+  let SP = this.spCounter.reduce((sum, val) => sum + +val, 0);
+  this.spCreditCardFlag = SP > 0 ? true : false ;
+
+  if(flag == 2 &&  e==3){
+    this.trdCounter[index] = 1;
+  }
+  else if(flag == 2 &&  e!=3){
+    this.trdCounter[index] = 0;
+  }
+  let TRD = this.trdCounter.reduce((sum, val) => sum + +val, 0);
+  this.trdCreditCardFlag = TRD > 0 ? true : false ;
+
+  if(flag == 1 && e==3){
+    this.mfgCounter[index] = 1;
+  }
+  else if(flag == 1 &&  e!=3){
+    this.mfgCounter[index] = 0;
+  }
+  let MFG = this.mfgCounter.reduce((sum, val) => sum + +val, 0);
+  this.mfgCreditCardFlag = MFG > 0 ? true : false ;
+
+}
+
+
+}
+//paymentModeTextBox: any;
+//clientDataArray:FormArray;
+//apiLoadFinish:boolean = false;
+// this.clientForms  = this.fb.group({
+//   clientArray:this.fb.array([])
+// });
+// this.getClientDetails();
+// this.getdropdown();
+
+
+// createClientItem()
+//   {
+//     return this.fb.group(
+//       {
+//         client_name: [''],
+//       contact_person: [''],
+//       mobile_number: [''],
+//       payment_mode: [''],
+//       per_of_immediate_advance_payment:[''],
+//       credit_period:[''],
+//       frequency_of_purchase: [''],
+//       freq_purchase_others_text_value: ['']
+//       })
+//   }
+//   selectedPM(e) {
+//     this.paymentModeTextBox = e.value;
+//     // this.f.supplier_details.controls.get('payment_mode_value');
+//   }
+//   public freqPurchaseTextBox: number;
+//   selectedFreqPurchase(e){
+//      this.freqPurchaseTextBox = e.value;
+//   }
+//   getdropdown()
+//   {
+//     this.qustCat.getcommondrop('FREQUENCY').subscribe(
+//       data => {
+//         this.m_freqOfPurchase = data['records'].filter(data => data.isactive == 1);
+//       },
+//       error => {
+//         // this.notifier.notify('warning', 'No Category Records Found.!');
+//         // this.m_assets_type = "No Category Records Found.";
+//       }
+//     )
+//     this.qustCat.getcommondrop('PAYMENTMODE').subscribe(
+//       data => {
+//         this.m_paymentModeType = data['records'].filter(data => data.isactive == 1);
+//       },
+//       error => {
+//         // this.notifier.notify('warning', 'No Category Records Found.!');
+//         // this.m_assets_type = "No Category Records Found.";
+//       }
+//     )
+//   }
+//   addClientDetails()
+//   {
+//     this.clientDataArray = this.clientForms.get('clientArray') as FormArray;
+//     this.clientDataArray.push(this.createClientItem());
+//   }
+//   removeClientDetails(i)
+//   {
+    
+//     if(this.clientDataArray.length==1)
+//     {
+//       this.clientForms.controls['clientArray'].reset();
+//     }else{
+//     this.clientDataArray = this.clientForms.get('clientArray') as FormArray;    
+//     this.clientDataArray.removeAt(i);
+//   }
+//   }
+
+//   saveclientDetails(answerData)
+// {
+//   let records:any ={};
+
+//         records.pdid = this.pdDetails.pd_id;
+//         records.formid = this.FormId.form_id;
+//         records.fk_createdby = this.users;
+        
+//         records.client_details = answerData.clientArray;
+
+//       this.qustCat.saveForm(records).subscribe(res=>
+//         {
+//           if(res['dataStatus']==true)
+//       {
+//         this.toast.pdTriggerappmessage('Record Saved Successfully.!');
+//         this.navCtrl.pop();
+//       }
+//         });
+
+      
+// }
+//   getClientDetails()
+//   {
+//     let records = {'pd_id':this.pdDetails.pd_id,'pd_form_id':this.FormId.form_id}
+//     let clientData:any = [];
+//     this.qustCat.retiverForm(records).subscribe(
+//       data => {
+//           if(data['dataStatus']==true)
+//           {
+//             let clientDetails = data['records'];
+
+//                 clientData = Object.keys(data['records'].client_details).map(function(key) {
+           
+//             return clientDetails.client_details[key];
+//         });
+//         this.clientDataArray = this.clientForms.get('clientArray') as FormArray;
+          
+//         if(clientData.length ==0)
+//         {
+          
+//           this.clientDataArray.push(this.createClientItem());          
+//         }else
+//         {
+
+//           clientData.forEach(datas=>
+//             {
+//               this.clientDataArray.push(this.createClientItem());
+//             })
+            
+//         this.clientForms.controls['clientArray'].setValue(clientData);
+//               this.apiLoadFinish = true;
+//         }
+//       }else{
+
+//         this.addClientDetails();
+//         this.apiLoadFinish = true;
+//       }
+//   }
+// );
+//   }

src/pages/pd-question/pd-question-business-group/pd-question-stock-info/pd-question-stock-info.html

@@ -0,0 +1,452 @@
+<ion-header>
+
+        <ion-navbar color="optblue">
+                <button ion-button menuToggle>
+                    <ion-icon name="menu"></ion-icon>
+                  </button>
+              <ion-title>{{formDetails.form_name}}</ion-title>
+            </ion-navbar>
+
+</ion-header>
+
+<ion-content padding *ngIf="noRecordsFound">
+
+    <form [formGroup]="stockForm">
+        
+                            <mat-card *ngIf="manufacturingForm">
+                                    <mat-card-title>Manufacturing Stock Details</mat-card-title>
+                                    <div formArrayName="manufacturing_details">
+                                        <div *ngFor="let md of stockForm.controls.manufacturing_details['controls']; let i=index" [formGroupName]="i">        
+                                            <div formArrayName="manufacturing_raw_materials">
+                                                <div *ngFor="let mrm of md.controls.manufacturing_raw_materials['controls']; let a=index; let last=last" [formGroupName]="a">    
+                                                    <mat-card>
+                                                        <mat-card-subtitle>Raw Material #{{a+1}}</mat-card-subtitle>
+                                                        <mat-card-content class="matcard">
+                                                            <mat-form-field style="width:100%">
+                                                                <input matInput autocomplete="off" placeholder="Name" formControlName="raw_name" >
+                                                            </mat-form-field>
+                                                            <mat-form-field style="width:100%">
+                                                                <!-- <mat-select placeholder="is the Stock is Observed ?" formControlName="stock_observed"  > -->
+                                                                        <mat-select placeholder="Stock" formControlName="stock_observed"  >
+                                                                        <mat-option value="yes">Add Stock Details</mat-option>
+                                                                       <mat-option value="no">No Stock Observed</mat-option>
+                                                                </mat-select>
+                                                            </mat-form-field>
+                                                            <span *ngIf="mrm.get('stock_observed').value == 'yes'" >
+                                                                    <mat-form-field style="width:100%">
+                                                                        <input matInput autocomplete="off" placeholder="Estimated Quantity" formControlName="raw_quantity" type="number">
+                                                                    </mat-form-field>
+                                                                    <mat-form-field style="width:100%">
+                                                                        <mat-select placeholder="Unit of Mearsurement"
+                                                                            formControlName="raw_uom"  >
+                                                                                <mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
+                                                                        </mat-select>
+                                                                    </mat-form-field>
+                                                                    <mat-form-field *ngIf="mrm.get('raw_uom').value == 1" style="width:28%">
+                                                                        <input matInput autocomplete="off" placeholder="Specify UOM" formControlName="other_uom" >
+                                                                    </mat-form-field>
+                                                                    <mat-form-field style="width:100%">
+                                                                        <input matInput autocomplete="off" placeholder="Estimated Value of Stock Observed" formControlName="raw_value" type="number" (keyup)="inWords($event.target.value,1,a)" >
+                                                                        <mat-hint align="start" style="font-size:70%" *ngIf="mrm.get('raw_value').value != ''">{{"&#8377;"}} {{M_rawValueInWords[a]}} Only</mat-hint> 
+                                                                    </mat-form-field>
+                                                                    
+                                                                    <mat-form-field style="width:100%">
+                                                                        <mat-select placeholder="Is the stock of Raw Materials observed, sufficient considering the size of operations" formControlName="is_sufficiant_raw"  (selectionChange)="checkComments($event.value,1,a)">
+                                                                            <mat-option value="yes" >Yes</mat-option>
+                                                                            <mat-option value="no" >No</mat-option>
+                                                                        </mat-select>
+                                                                    </mat-form-field>
+                                                                    <mat-form-field *ngIf="mrmCommentFlag[a]" appearance="outline" style="width: 90%">
+                                                                    
+                                                                        <mat-label> <i>Please comment on the stock level observed?</i> </mat-label>
+                                                                        <textarea matInput autocomplete="off" placeholder="Please comment on the stock level observed" formControlName="rawmaterial_remarks"></textarea>
+                                                                    </mat-form-field>
+                                                            </span>
+                                                            </mat-card-content>
+                                                                  <!-- <ion-col offset-6 col-3>
+                                                                    <a (click)="addMoreRawMaterials($event); false" *ngIf="last">
+                                                                    <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                  </ion-col>
+                                                                  <ion-col offset-1 col-3>
+                                                                      <a *ngIf="item.controls.main_raw_materials.controls.length > 1" (click)="removeRawMaterials(l)">
+                                                                      <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                  </ion-col> -->
+                                                            <mat-card-actions>
+                                                                    <ion-col offset-6 col-3>
+                                                                        <a (click)="addRawMaterials(1)" *ngIf="last">
+                                                                        <ion-icon name="md-close" name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                    </ion-col>
+                                                                    <ion-col offset-3 col-1>
+                                                                            <a (click)="deleteRawMaterials(a,1)" *ngIf="md.controls.manufacturing_raw_materials.controls.length>1">
+                                                                            <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                    </ion-col>        
+                                                        </mat-card-actions>
+                                                    </mat-card>
+                                                </div>
+                                            </div>
+        
+                                            <div formArrayName="manufacturing_finished_goods">
+                                                <div *ngFor="let mfg of md.controls.manufacturing_finished_goods['controls']; let b=index;let last=last" [formGroupName]="b">    
+                                                        <mat-card>
+                                                        <mat-card-subtitle>Finished Goods #{{b+1}}</mat-card-subtitle>    
+                                                        
+                                                        <mat-card-content class="matcard">
+                                                            <mat-form-field style="width:100%">
+                                                                <input matInput autocomplete="off" placeholder="Name" formControlName="goods_name" >
+                                                            </mat-form-field>
+                                                            <mat-form-field style="width:100%">
+                                                                    <mat-select placeholder="Stock" formControlName="goods_observed"  >
+                                                                        <mat-option value="yes">Add Stock Details</mat-option>
+                                                                        <mat-option value="no">No Stock Observed</mat-option>
+                                                                </mat-select>
+                                                            </mat-form-field>
+                                                            <span *ngIf="mfg.get('goods_observed').value == 'yes'" >
+                                                                <mat-form-field style="width:100%">
+                                                                    <input matInput autocomplete="off" placeholder="Estimated Quantity" formControlName="goods_quantity" type="number">
+                                                                </mat-form-field>
+                                                                <mat-form-field style="width:100%">
+                                                                        <mat-select placeholder="Unit of Mearsurement"
+                                                                            formControlName="goods_uom"  >
+                                                                                <mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
+                                                                        </mat-select>
+                                                                </mat-form-field>
+                                                                <mat-form-field *ngIf="mfg.get('goods_uom').value == 1" style="width:28%">
+                                                                        <input matInput autocomplete="off" placeholder="Specify  UOM" formControlName="goods_other_uom" >
+                                                                    </mat-form-field>
+                                                                <mat-form-field style="width:100%">  
+                                                                    <input matInput autocomplete="off" placeholder="Estimated Value of Stock Observed" formControlName="goods_value" type="number" (keyup)="inWords($event.target.value,2,b)"  >
+                                                                        <mat-hint align="start" style="font-size:70%" *ngIf="mfg.get('goods_value').value != ''">{{"&#8377;"}} {{M_goodsValueInWords[b]}} Only</mat-hint> 
+                                                                </mat-form-field>
+                                                                
+                                                                <mat-form-field style="width:100%">
+                                                                    <mat-select placeholder="Is the stock of Finished Goods Observed sufficient considering the size of operations?" formControlName="is_sufficiant_goods"  (selectionChange)="checkComments($event.value,2,b)">
+                                                                        <mat-option value="yes" >Yes</mat-option>
+                                                                        <mat-option value="no" >No</mat-option>
+                                                                    </mat-select>
+                                                                </mat-form-field>
+                                                                <mat-form-field *ngIf="mfgCommentFlag[b]" appearance="outline" style="width: 90%">
+                                                                    <mat-label class="highlight"> <i>Please comment on the finished goods stock level observed?</i> </mat-label>
+                                                                    <textarea matInput autocomplete="off" placeholder="Please comment on the finished goods observed" formControlName="finishedgoods_remarks"></textarea>
+                                                                </mat-form-field>
+                                                            </span>
+                                                        
+                                                        </mat-card-content>
+                                                        <mat-card-actions>
+                                                                    <ion-col offset-6 col-3>
+                                                                        <a (click)="addGoods(1)" *ngIf="last">
+                                                                        <ion-icon name="md-close" name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                    </ion-col>
+                                                                    <ion-col offset-3 col-1>
+                                                                            <a (click)="deleteGoods(b,1)" *ngIf="md.controls.manufacturing_finished_goods.controls.length>1">
+                                                                            <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                    </ion-col>
+                                                                <!-- <div align="right">
+                                                                <button type="button" mat-raised-button mat-icon-button (click)="deleteGoods(b,1)"
+                                                                matTooltip="Delete" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="md.controls.manufacturing_finished_goods.controls.length>1">
+                                                                <mat-icon>delete</mat-icon>
+                                                                </button>
+                                                                </div>
+                                                                <div align="center">
+                                                                <button type="button" mat-flat-button (click)="addGoods(1)"
+                                                                matTooltip="Add More" matTooltipPosition="left" color="primary" *ngIf="last">
+                                                                <strong>Add More Finished Goods </strong>
+                                                                </button> 
+                                                                </div> -->
+                                                    </mat-card-actions>
+                                                    </mat-card>
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                            </mat-card>
+                            
+                            <mat-card *ngIf="retailForm">
+                                    <mat-card-title>Retail Trading Details</mat-card-title>
+                                    <div formArrayName="retail_details">
+                                        <div *ngFor="let rd of stockForm.controls.retail_details['controls']; let j=index" [formGroupName]="j">
+        
+                                            <div formArrayName="retail_traded_goods">
+                                                <div *ngFor="let item of rd.controls.retail_traded_goods['controls']; let e=index;let last =last" [formGroupName]="e">    
+                                                       
+                                                        <mat-card>
+                                                        <mat-card-subtitle>Traded Goods #{{e+1}}</mat-card-subtitle>
+                                                        <mat-card-content class="matcard">
+                                                            <mat-form-field style="width:100%">
+                                                                <input matInput autocomplete="off" placeholder="Name" formControlName="traded_goods_name" >
+                                                            </mat-form-field>
+                                                            <mat-form-field style="width:100%">
+                                                                <mat-select placeholder="Stock" formControlName="traded_goods_observed"  >
+                                                                        <mat-option value="yes">Add Stock Details</mat-option>
+                                                                        <mat-option value="no">No Stock Observed</mat-option>
+                                                                </mat-select>
+                                                            </mat-form-field>
+                                                            <span *ngIf="item.get('traded_goods_observed').value == 'yes'" >
+                                                                    <mat-form-field style="width:100%">
+                                                                        <input matInput autocomplete="off" placeholder="Estimated Quantity" formControlName="traded_goods_quantity" type="number">
+                                                                    </mat-form-field>
+                                                                    <mat-form-field style="width:100%">
+                                                                            <mat-select placeholder="Unit of Mearsurement"
+                                                                                formControlName="traded_goods_uom"  >
+                                                                                    <mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
+                                                                            </mat-select>
+                                                                        </mat-form-field>
+                                                                        <mat-form-field *ngIf="item.get('traded_goods_uom').value == 1" style="width:28%">
+                                                                            <input matInput autocomplete="off" placeholder="Specify  UOM" formControlName="traded_goods_other_uom" >
+                                                                        </mat-form-field>
+                                                                    <mat-form-field style="width:100%">  
+                                                                        <input matInput autocomplete="off" placeholder="Estimated Value of Stock Observed" formControlName="estimated_traded_goods_value" type="number"  (keyup)="inWords($event.target.value,3,e)" >
+                                                                        <mat-hint align="start" style="font-size:70%" *ngIf="item.get('estimated_traded_goods_value').value != ''">{{"&#8377;"}} {{R_tradedGoodsValueInWords[e]}} Only</mat-hint>
+                                                                    </mat-form-field>
+                                                                    <mat-form-field style="width:100%">
+        
+                                                                        <mat-select placeholder="Is the stock of Traded goods observed ?" formControlName="is_sufficiant_traded_goods"  (selectionChange)="checkComments($event.value,3,e)">
+                                                                            <mat-option value="yes" >Yes</mat-option>
+                                                                            <mat-option value="no" >No</mat-option>
+                                                                        </mat-select>
+                                                                    </mat-form-field>
+                                                                    <mat-form-field *ngIf="rtrdCommentFlag[e]"  appearance="outline" style="width: 90%">
+                                                                        
+                                                                        <mat-label> <i>Please comment on the Traded Goods stock level observed?</i> </mat-label>
+                                                                        <textarea matInput autocomplete="off" placeholder="Please comment on the traded goods stock level observed" formControlName="traded_goods_remarks"></textarea>
+                                                                    </mat-form-field>
+                                                            </span>
+                                                            
+                                                            
+                                                        </mat-card-content>
+                                                        <mat-card-actions>
+                                                                <ion-col offset-6 col-3>
+                                                                        <a (click)="addTradedGoods(1)" *ngIf="last">
+                                                                        <ion-icon name="md-close" name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                </ion-col>
+                                                                <ion-col offset-3 col-1>
+                                                                            <a (click)="deleteTradedGoods(e,1)" *ngIf="rd.controls.retail_traded_goods.controls.length>1">
+                                                                            <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                </ion-col>
+                                                    </mat-card-actions>
+                                                    </mat-card>
+                                                                       
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+                            </mat-card>
+                               
+                            <mat-card *ngIf="tradingForm">
+                                    <mat-card-title>Wholesale Trading Details</mat-card-title>
+                                    <div formArrayName="trade_details">
+                                        <div *ngFor="let td of stockForm.controls.trade_details['controls']; let k=index" [formGroupName]="k">
+                                            <div formArrayName="trading_traded_goods">
+                                                <div *ngFor="let tradetg of td.controls.trading_traded_goods['controls']; let g=index;let last = last" [formGroupName]="g">    
+                                                        <mat-card>
+                                                            <mat-card-subtitle>Traded Goods #{{g+1}}</mat-card-subtitle>    
+                                                            <mat-card-content class="matcard">
+                                                                    <mat-form-field style="width:100%">
+                                                                        <input matInput autocomplete="off" placeholder="Name" formControlName="traded_goods_name" >
+                                                                    </mat-form-field>
+                                                                    <mat-form-field style="width:100%">
+                                                                       <mat-select placeholder="Stock" formControlName="traded_goods_observed"  >
+                                                                       <mat-option value="yes">Add Stock Details</mat-option>
+                                                                       <mat-option value="no">No stock observed</mat-option>
+                                                                       </mat-select>
+                                                                    </mat-form-field>
+                                                                    <span *ngIf="tradetg.get('traded_goods_observed').value == 'yes'" >
+                                                                                    <mat-form-field style="width:100%">
+                                                                                        <input matInput autocomplete="off" placeholder="Estimated Quantity" formControlName="traded_goods_quantity" type="number">
+                                                                                    </mat-form-field>
+                                                                                    <mat-form-field style="width:100%">
+                                                                                            <mat-select placeholder="Unit of Mearsurement"
+                                                                                                formControlName="traded_goods_uom"  >
+                                                                                                    <mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
+                                                                                            </mat-select>
+                                                                                        </mat-form-field>
+                                                                                        <mat-form-field *ngIf="tradetg.get('traded_goods_uom').value == 1" style="width:28%">
+                                                                                            <input matInput autocomplete="off" placeholder="Specify  UOM" formControlName="traded_goods_other_uom" >
+                                                                                        </mat-form-field>
+                                                                                    <mat-form-field style="width:100%">  
+                                                                                        <input matInput autocomplete="off" placeholder="Estimated Value of Stock Observed" formControlName="estimated_traded_goods_value" type="number" (keyup)="inWords($event.target.value,4,g)">
+                                                                                        <mat-hint align="start" style="font-size:70%" *ngIf="tradetg.get('estimated_traded_goods_value').value != ''">{{"&#8377;"}} {{T_tradedGoodsValueInWords[g]}} Only</mat-hint> 
+                                                                                    </mat-form-field>
+                                                                                    
+                                                                                    <mat-form-field style="width:100%">
+                                                                                    
+                                                                                        <mat-select placeholder="Is the stock of Traded goods observed ?" formControlName="is_sufficiant_traded_goods"  (selectionChange)="checkComments($event.value,4,g)">
+                                                                                                <mat-option value="yes" >Yes</mat-option>
+                                                                                                <mat-option value="no" >No</mat-option>
+                                                                                        </mat-select>
+                                                                                    </mat-form-field>
+                                                                                    <mat-form-field *ngIf="wtrdCommentFlag[g]" appearance="outline" style="width: 90%">
+                                                                                    
+                                                                                            <mat-label> <i>Please comment on the Traded Goods stock level observed?</i> </mat-label>
+                                                                                            <textarea matInput autocomplete="off" placeholder="Please comment on the traded goods stock level observed" formControlName="traded_goods_remarks"></textarea>
+                                                                                    </mat-form-field>
+                                                                    </span>    
+                                                                    
+                                                                </mat-card-content>
+                                                                <mat-card-actions>
+                                                                        <ion-col offset-6 col-3>
+                                                                                <a (click)="addTradedGoods(2)" *ngIf="last">
+                                                                                <ion-icon name="md-close" name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                        </ion-col>
+                                                                        <ion-col offset-3 col-1>
+                                                                                    <a (click)="deleteTradedGoods(g,2)" *ngIf="td.controls.trading_traded_goods.controls.length>1">
+                                                                                    <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                                                                        </ion-col>
+                                                                        <!-- <div align="center">
+                                                                        <button type="button" mat-flat-button (click)="addTradedGoods(2)"
+                                                                        matTooltip="Add More" matTooltipPosition="left" color="primary" *ngIf="last">
+                                                                        <strong>Add More Traded Goods </strong>
+                                                                        </button> 
+                                                                        </div>
+                                                                        <div align="right">
+                                                                        <button type="button" mat-raised-button mat-icon-button (click)="deleteTradedGoods(g,2)"
+                                                                                                    matTooltip="Delete Traded Goods" matTooltipPosition="above" class="mr-1 mb-1 hover-icon" *ngIf="td.controls.trading_traded_goods.controls.length>1">
+                                                                        <mat-icon>delete</mat-icon>
+                                                                        </button>
+                                                                        </div> -->
+                                                            </mat-card-actions>
+                                                        </mat-card>                   
+                                                </div>
+                                            </div>
+                                        </div>
+                                    </div>
+        
+                            </mat-card>
+        
+                            <mat-card *ngIf="serviceProviderForm">
+                                    <mat-card-title>Service Provider Details</mat-card-title>
+                                    <div style="text-align: center; margin: 12px;">Service Provider Details Not applicable here !!</div>
+                            </mat-card>
+                            
+                    <mat-card>
+                            <mat-form-field style="width: 100%">
+                                <mat-label>Remarks</mat-label>
+                                <textarea matInput autocomplete="off" placeholder="Remarks" formControlName="stock_remarks"></textarea>
+                            </mat-form-field>
+                    </mat-card>
+     
+            
+        
+        <mat-dialog-actions>
+            
+            <ion-row>
+                    <button ion-button full color="optblue" (click)="saveStockInfo(stockForm.value)" > Save</button>
+            </ion-row>
+
+            <!-- <div fxFlex="40" align="end">
+                <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Save" matTooltipPosition="above" type="submit"><mat-icon>save</mat-icon></button>
+            </div> -->
+        </mat-dialog-actions>
+        
+        
+    </form>
+    
+</ion-content>
+<ion-content padding *ngIf="!noRecordsFound">
+        <div style="margin: 12px; font-size: 18px;"> {{ errorMessage }} </div>
+      </ion-content>
+
+<!--<mat-card>
+        <mat-card-header>
+            <h3>Raw Materials</h3>
+        </mat-card-header>
+        <div formArrayName="raw_materials">
+            <div *ngFor="let details of stockForm.controls.raw_materials['controls']; let i=index;let last=last;"
+                 [formGroupName]="i">
+                <mat-card-content class="matcard">
+                    <mat-form-field style="width:100%">
+                        <input matInput placeholder="Name" formControlName="raw_name">
+                    </mat-form-field>
+                    <mat-form-field style="width:100%">
+                            <mat-select placeholder="is the Stock is Observed ?"
+                                        formControlName="stock_observed"  required>
+                                <mat-option value="yes" >Yes</mat-option>
+                                <mat-option value="no" >No</mat-option>
+                            </mat-select>
+                        </mat-form-field>
+                        <div *ngIf="details.get('stock_observed').value == 'no'" >
+                        <mat-form-field style="width:100%">
+                            <input matInput placeholder="Estimated Quantity" formControlName="raw_quantity" required>
+                        </mat-form-field>
+                        <mat-form-field style="width:100%">
+                            <mat-select placeholder="Unit of Mearsurement"
+                                        formControlName="raw_uom"  required>
+                                <mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
+                            </mat-select>
+                        </mat-form-field>
+                        <mat-form-field style="width:100%" *ngIf="details.get('raw_uom').value == 61" >
+                            <input matInput placeholder="Specify Other UOM" formControlName="other_uom" required>
+                        </mat-form-field>
+                        <mat-form-field style="width:100%">
+                            <input matInput placeholder="Value" formControlName="raw_value" type="number"  required>
+                        </mat-form-field>
+                        <mat-form-field style="width:100%">
+                            <input matInput placeholder="Value of raw materials as per latest financial Statements" formControlName="rawmaterial_value" type="number" required>
+                        </mat-form-field>
+                        <mat-form-field style="width:100%">
+                            <input matInput placeholder="Is the stock of raw materials observed ?" formControlName="is_sufficiant_raw"  required>
+                        </mat-form-field>
+                    </div>
+                    <ion-buttons end>
+                      <ion-col offset-3 col-3>
+                        <a (click)="addRawMaterials()" *ngIf="last">
+                        <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                        </ion-col>
+                        <ion-col offset-3 col-1>
+                        <a (click)="deleteRawMaterials(i)" >
+                            <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                          </ion-col>
+                      </ion-buttons>
+                </mat-card-content>
+            </div>
+        </div>
+    </mat-card>
+    <br/>
+    <mat-card>
+        <mat-card-header>
+            <h3>Finished Goods</h3>
+        </mat-card-header>
+        <div formArrayName="finished_goods">
+            <div *ngFor="let details of stockForm.controls.finished_goods['controls']; let i=index;let last=last;"
+                 [formGroupName]="i">
+                <mat-card-content class="matcard">
+                    <mat-form-field style="width: 100%">
+                        <input matInput placeholder="Name" formControlName="goods_name">
+                    </mat-form-field>
+                    <mat-form-field style="width: 100%">
+                        <input matInput placeholder="Quantity" formControlName="goods_quantity">
+                    </mat-form-field>
+                    <mat-form-field style="width: 100%">
+                        <input matInput placeholder="Value" formControlName="goods_value">
+                    </mat-form-field>
+                    <mat-form-field style="width:100%">
+                        <input matInput placeholder="Value of finished goods as per financial statements" formControlName="finished_goods_value">
+                    </mat-form-field>
+                    <mat-form-field style="width:100%">
+                        <input matInput placeholder="Is the stock of finished goods sufficient ?" formControlName="is_sufficiant_goods">
+                    </mat-form-field>
+                      <ion-buttons end>
+                      <ion-col offset-3 col-3>
+                        <a (click)="addGoods()" *ngIf="last">
+                        <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                        </ion-col>
+                        <ion-col offset-3 col-1>
+                        <a (click)="deleteGoods(i)" >
+                            <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                          </ion-col>
+                      </ion-buttons>                        
+                </mat-card-content>
+            </div>
+        </div>
+    </mat-card>
+    <br/>
+    <mat-card>
+    <div fxLayout="row">
+        <div fxFlex="60" class="pb-0 text-sm-left">
+            <mat-form-field appearance="outline" style="width: 100%">
+                <mat-label>Remarks</mat-label>
+                <textarea matInput placeholder="Remarks" formControlName="stock_remarks"></textarea>
+            </mat-form-field>
+        </div>
+    </div>
+    </mat-card>
+-->

src/pages/pd-question/pd-question-business-group/pd-question-stock-info/pd-question-stock-info.scss

@@ -0,0 +1,13 @@
+page-pd-question-stock-info {
+    mat-hint{
+        font-size:12px;
+    }
+   .mat-card{
+        margin-bottom: 15px;
+        border-radius: 10px !important;
+        box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2) !important;
+    }
+    .mat-card-content{
+        margin-bottom: 0px !important;
+    }
+}

src/pages/pd-question/pd-question-business-group/pd-question-stock-info/pd-question-stock-info.ts

@@ -0,0 +1,803 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { QuestionCategoryProvider } from '../../../../providers/question-category/question-category';
+import { AwsServiceProvider } from '../../../../providers/aws-service/aws-service';
+import { ToastProvider } from '../../../../providers/common-provider/toast';
+import { FormArray, FormGroup, FormBuilder } from '@angular/forms';
+import { ConstantsProvider } from '../../../../providers/constants/constants';
+
+/**
+ * Generated class for the PdQuestionStockInfoPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+
+@Component({
+  selector: 'page-pd-question-stock-info',
+  templateUrl: 'pd-question-stock-info.html',
+})
+export class PdQuestionStockInfoPage {
+
+  uomData: any;
+  rawmaterial: any;
+  users: any;
+  formDetails: any;
+  pdDetails: any;
+  company_id : any;
+  pdid:any;
+  stockForm: FormGroup;
+
+  noRecordsFound: Boolean;
+  errorMessage: any = '';
+
+  M_rawValueInWords : any = [];  
+  M_goodsValueInWords : any = [];
+  R_tradedGoodsValueInWords : any = [];
+  T_tradedGoodsValueInWords : any = [];
+
+  mrmCommentFlag:any=[];
+  mfgCommentFlag:any=[];
+  rtrdCommentFlag:any=[];
+  wtrdCommentFlag:any=[];
+
+  serviceProviderForm: Boolean = false;
+  suppliers_raw_materials : any = [];
+  suppliers_retail_trade_details : any = [];
+  suppliers_wholesale_trade_details : any = [];
+  suppliers_finished_goods : any =[];
+
+  constructor(public navCtrl: NavController, public navParams: NavParams, public qustCat: QuestionCategoryProvider, public aws: AwsServiceProvider, public toast: ToastProvider, public fb: FormBuilder,public constant:ConstantsProvider) {
+    this.pdDetails = this.navParams.get('pdDetails');
+    this.formDetails=this.navParams.get('formDetails');
+    this.users = this.aws.getlocale();
+    this.company_id=this.pdDetails.company_id;
+    this.pdid=this.pdDetails.pd_id;
+
+    this.qustCat.stockFormAccess(this.pdid,this.company_id).subscribe(data => {
+       
+      if(data.dataStatus == true){
+        this.initstockForm(data.record);
+      }
+      else if(data.dataStatus == false)
+      {
+        this.toast.pdTriggerappmessage('Fill Business Form First! / No Company Found at this ID '+ this.company_id );           
+        this.noRecordsFound = false;
+        this.errorMessage = 'Fill Business Form First! / No Company Found at this ID' + this.company_id +'! ....';
+        return;
+      }
+      else{
+        this.toast.pdTriggerappmessage('Fill Business Form First! / No Company Found at this ID '+ this.company_id );           
+        this.noRecordsFound = false;
+        this.errorMessage = 'Fill Business Form First! / No Company Found at this ID' + this.company_id +'! ....';
+        return;
+      }
+    }, err => {
+      this.toast.pdTriggerappmessage('Business Type Of Activity Not Available Please Check Business Information.!');
+      this.noRecordsFound = false;
+      this.errorMessage = 'No Records Found , Something went Wrong!';
+    })
+    
+  this.getdropdown();
+  }
+
+  public initstockForm(record){
+    
+    let api = Object.keys(record.from_business).map(function (key) {
+      return record.from_business[key];
+    });
+    let rm_api = record.from_supplier;
+    
+      let params: any = {};
+      params.pd_id = this.pdid;
+      params.pd_form_id  = this.formDetails.form_id;
+      params.company_id = this.company_id;
+      this.qustCat.retiverForm(params).subscribe(value => {
+    
+          if (value['status'] == 200) {
+              let dataForm = value['records'];         
+              
+              if(dataForm !== undefined) {
+                      this.stockForm = this.fb.group({
+                          pdid: [this.pdid],
+                          formid: [this.formDetails.form_id],
+                          company_id: [this.company_id],
+                          fk_createdby:[this.users],
+                          stock_remarks: [dataForm.stock_remarks],
+                          manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+                          retail_details : this.fb.array([this.retailFormCreation(api)]),
+                          trade_details: this.fb.array([this.tradingFormCreation(api)]),
+                      });
+                      if(api.length > 0){     
+                         api.forEach(val => {
+                          if (val.type_of_activity_id == 2) {
+                                if(val.products){
+                                  let manufacturing_temparr = [];
+                                  manufacturing_temparr['manufacturing_raw_materials'] = dataForm.manufacturing_details[0].manufacturing_raw_materials; 
+                                  manufacturing_temparr['manufacturing_finished_goods'] = dataForm.manufacturing_details[0].manufacturing_finished_goods; 
+                                  this.initManufacturingDetails(manufacturing_temparr);
+                                }
+                          }
+                          if (val.type_of_activity_id == 3) {
+                                if(val.products){
+                                  let retail_temparr = [];
+                                  retail_temparr['retail_traded_goods'] = dataForm.retail_details[0].retail_traded_goods;
+                                  this.initRetailDetails(retail_temparr);
+                                }
+                          }
+                          if (val.type_of_activity_id == 4) {
+                                if(val.products){
+                                  let trading_temparr = [];
+                                  trading_temparr['trading_traded_goods'] = dataForm.trade_details[0].trading_traded_goods;
+                                  this.initTradingDetails(trading_temparr);
+                                }
+                          }
+                          if (val.type_of_activity_id == 5) {
+                                if(val.products){
+                                  this.serviceProviderForm = true;
+                                }
+                          }
+                        });
+                    this.noRecordsFound = true;
+                   }
+              }
+              else{
+                
+                this.stockForm = this.fb.group({
+                  pdid: [this.pdid],
+                  formid: [this.formDetails.form_id],
+                  company_id: [this.company_id],
+                  fk_createdby:[this.users],
+                  stock_remarks: [''],
+                  manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+                  retail_details : this.fb.array([this.retailFormCreation(record.from_business)]),
+                  trade_details: this.fb.array([this.tradingFormCreation(record.from_business)]),
+                });
+
+                if(api.length > 0){     
+                  api.forEach(val => {
+                    if (val.type_of_activity_id == 2) {
+                      if(val.products){
+                        this.suppliers_finished_goods = val.products;
+                        this.initManufacturingDetails(null);     
+                      }
+                    }
+                    if (val.type_of_activity_id == 3) {
+                      if(val.products){
+                        this.suppliers_retail_trade_details = val.products;
+                      this.initRetailDetails(null);
+                      }
+                    }
+                    if (val.type_of_activity_id == 4) {
+                      if(val.products){
+                        this.suppliers_wholesale_trade_details =val.products;
+                      this.initTradingDetails(null);
+                      }
+                    }
+                    if (val.type_of_activity_id == 5) {
+                      if(val.products){
+                      // this.suppliers_service_product = val.products;
+                      this.serviceProviderForm = true;
+                      }
+                      
+                    }
+                    
+                  });
+                  this.noRecordsFound = true;
+                }
+              }
+          }
+          else {
+              this.stockForm = this.fb.group({
+                  pdid: [this.pdid],
+                  formid: [this.formDetails.form_id],
+                  company_id: [this.company_id],
+                  fk_createdby:[this.users],
+                  stock_remarks: [''],
+                  manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+                  retail_details : this.fb.array([this.retailFormCreation(record.from_business)]),
+                  trade_details: this.fb.array([this.tradingFormCreation(record.from_business)]),
+                });
+                if(api.length > 0){     
+                          api.forEach(val => {
+                            if (val.type_of_activity_id == 2) {
+                              if(val.products){
+                                this.suppliers_finished_goods = val.products;
+                                this.suppliers_raw_materials = rm_api;
+                                this.initManufacturingDetails(null);     
+                              }
+                            }
+                            if (val.type_of_activity_id == 3) {
+                              if(val.products){
+                               this.suppliers_retail_trade_details= val.products;
+                              this.initRetailDetails(null);
+                              }
+                            }
+                            if (val.type_of_activity_id == 4) {
+                              if(val.products){
+                              this.suppliers_wholesale_trade_details = val.products;
+                              this.initTradingDetails(null);
+                              }
+                            }
+                            if (val.type_of_activity_id == 5) {
+                              if(val.products){
+                              // this.suppliers_service_product = val.products;
+                              this.serviceProviderForm = true;
+                              } 
+                            }           
+                          });
+                          this.noRecordsFound = true;
+                }
+          }
+      })
+  }
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad PdQuestionStockInfoPage');
+  }
+
+
+  getdropdown()
+  {
+    this.qustCat.getcommondrop('UOM').subscribe(data => {
+            
+      if(data['dataStatus']==true){
+          
+              this.uomData = data['records'].filter(uom=>uom.isactive==1);
+          
+      }
+  });
+  }
+
+  manufacturingForm: Boolean = false;
+  manufacturingFormCreation(record) {
+
+    let arr = record.from_business.filter(data => data.type_of_activity_id == 2);
+    let rm_arr = record.from_supplier;
+    
+    if (arr.length > 0) {
+      this.manufacturingForm = true;
+        return this.fb.group({
+          manufacturing_raw_materials: this.fb.array([]),
+          manufacturing_finished_goods: this.fb.array([]),
+        })
+    } else {
+      return;
+    }
+  }
+
+  retailForm: Boolean = false;
+  retailFormCreation(val) {
+
+    let arr = val.filter(data => data.type_of_activity_id == 3);
+    if (arr.length > 0) {
+      this.retailForm = true;
+        return this.fb.group({
+          retail_traded_goods: this.fb.array([])
+        })
+      // }
+    } else {
+      return;
+    }
+  }
+
+  tradingForm: Boolean = false;
+  tradingFormCreation(val) {
+    let arr = val.filter(data => data.type_of_activity_id == 4);
+    if (arr.length > 0) {
+      this.tradingForm = true;
+      return this.fb.group({
+        trading_traded_goods: this.fb.array([])
+      });
+    } else {
+      return;
+    }
+  }
+
+  initManufacturingDetails(datas) {
+
+      const rawMaterial = <FormArray>this.stockForm.controls['manufacturing_details']['controls'][0].controls['manufacturing_raw_materials'];
+      const finishedGoods = <FormArray>this.stockForm.controls['manufacturing_details']['controls'][0].controls['manufacturing_finished_goods'];
+      const control = <FormArray>this.stockForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];    
+      if(datas === null){
+  
+  
+        if(this.suppliers_raw_materials.length > 0){
+          this.suppliers_raw_materials.forEach(val => {
+            let Ref_RawMaterials : any = {'raw_name': val,
+                                                  'stock_observed':'',
+                                                  'raw_quantity': '',
+                                                  'raw_uom': '',
+                                                  'other_uom': '',
+                                                  'raw_value': '',
+                                                  'is_sufficiant_raw': '',
+                                                  'rawmaterial_remarks':''};
+            rawMaterial.push(this.createRawmaterial(Ref_RawMaterials)); 
+          });
+        }
+        else{ 
+          rawMaterial.push(this.createRawmaterial(null)); 
+        }     
+
+        if(this.suppliers_finished_goods.length > 0){
+          // for (let val of this.suppliers_finished_goods) {
+            this.suppliers_finished_goods.forEach(val => {
+            let Ref_Finished_Goods : any = {'goods_name': val,
+                                          'goods_observed': '',
+                                          'goods_quantity': '',
+                                          'goods_uom': '',
+                                          'goods_other_uom': '',
+                                          'goods_value': '',
+                                          'is_sufficiant_goods': '',
+                                          'finishedgoods_remarks':''};
+              finishedGoods.push(this.createGoods(Ref_Finished_Goods));     
+            // finishedGoods.push(this.createGoods(null));     
+          });
+        }
+        else{      
+          finishedGoods.push(this.createGoods(null));       
+        }
+
+      } else {
+        
+        if(datas.manufacturing_raw_materials != undefined){
+        //  for (let val of datas.manufacturing_raw_materials) {
+          datas.manufacturing_raw_materials.forEach((val,index) => {
+          if(val.raw_value){
+            this.inWords(val.raw_value,1,index);
+          }
+          this.checkComments(val.is_sufficiant_raw,1,index);
+           rawMaterial.push(this.createRawmaterial(val)); 
+          });
+        }
+        else{
+          rawMaterial.push(this.createRawmaterial(null)); 
+        }
+        if(datas.manufacturing_finished_goods != undefined){  
+        // for (let val of datas.manufacturing_finished_goods) {
+          datas.manufacturing_finished_goods.forEach((val,index) => {
+          
+            if(val.goods_value){
+              this.inWords(val.goods_value,2,index);
+            }
+            this.checkComments(val.is_sufficiant_goods,2,index);
+            finishedGoods.push(this.createGoods(val)); 
+                 
+           });
+          }
+          else{
+            finishedGoods.push(this.createGoods(null)); 
+          }
+      }
+  }
+
+  createRawmaterial(records) {
+    
+      if(records === null) {
+    
+        return this.fb.group({
+          raw_name: [''],
+          stock_observed:[''],
+          raw_quantity: [''],
+          raw_uom: [''],
+          other_uom : [''],
+          raw_value: [''],
+          // rawmaterial_value: [''],
+          is_sufficiant_raw: [''],
+          rawmaterial_remarks:['']
+        })
+      } else {
+        
+          return this.fb.group({
+          // manufacturing_raw_material_name: [records.manufacturing_raw_material_name || null],
+          raw_name: [records.raw_name],
+          stock_observed:[records.stock_observed],
+          raw_quantity: [records.raw_quantity],
+          raw_uom: [records.raw_uom],
+          other_uom : [records.other_uom],
+          raw_value: [records.raw_value],
+          // rawmaterial_value: [records.rawmaterial_value],
+          is_sufficiant_raw: [records.is_sufficiant_raw],
+          rawmaterial_remarks:[records.rawmaterial_remarks]
+        })
+      }
+  }
+  
+  initRetailDetails(datas) {
+    
+    const tradedGoods = <FormArray>this.stockForm.controls['retail_details']['controls'][0].controls['retail_traded_goods'];
+      
+      if(datas === null){
+
+        if(this.suppliers_retail_trade_details.length > 0){
+          // this.rawMaterialAccess = true;
+          
+          this.suppliers_retail_trade_details.forEach(val => {
+            let Ref_Trade_Goods : any = {
+              'traded_goods_name': val,
+              'traded_goods_observed': '',
+              'traded_goods_quantity': '',
+              'traded_goods_uom': '',
+              'traded_goods_other_uom': '',
+              'estimated_traded_goods_value': '',
+              'is_sufficiant_traded_goods': '',
+              'traded_goods_remarks':''};
+            tradedGoods.push(this.createTradedGoods(Ref_Trade_Goods));     
+          });
+        }
+        else{      
+          tradedGoods.push(this.createTradedGoods(null));     
+        }
+
+       } else {
+        if(datas.retail_traded_goods !== undefined){
+        // for (let val of datas.retail_traded_goods) {
+          datas.retail_traded_goods.forEach((val,index) => {
+          
+          if(val.estimated_traded_goods_value){
+            this.inWords(val.estimated_traded_goods_value,3,index);
+          }
+          this.checkComments(val.is_sufficiant_traded_goods,3,index);
+           tradedGoods.push(this.createTradedGoods(val));     
+                
+          });
+        }
+        else{
+          tradedGoods.push(this.createTradedGoods(null));     
+        }
+       }
+  }
+
+
+  createGoods(records) {
+      if(records === null) {
+          return this.fb.group({
+          goods_name: [''],
+          goods_observed: [''],
+          goods_quantity: [''],
+          goods_uom: [''],
+          goods_other_uom: [''],
+          goods_value: [''],
+          // finished_goods_value: [''],
+          is_sufficiant_goods: [''],
+          finishedgoods_remarks:['']
+      });
+    }
+    else {
+      return this.fb.group({
+          goods_name: [records.goods_name],
+          goods_observed: [records.goods_observed],
+          goods_quantity: [records.goods_quantity],
+          goods_uom: [records.goods_uom],
+          goods_other_uom: [records.goods_other_uom],
+          goods_value: [records.goods_value],
+          // finished_goods_value: [records.finished_goods_value],
+          is_sufficiant_goods: [records.is_sufficiant_goods],
+          finishedgoods_remarks:[records.finishedgoods_remarks]
+    })
+  }
+  }
+
+  initTradingDetails(datas) {
+    const tradedGoods  = <FormArray>this.stockForm.controls['trade_details']['controls'][0].controls['trading_traded_goods'];  
+      if(datas === null){
+
+        
+        if(this.suppliers_wholesale_trade_details.length > 0){
+          // for (let val of this.suppliers_trade_details) {
+            this.suppliers_wholesale_trade_details.forEach(val => {
+            let Ref_Trade_Goods : any = {
+              'traded_goods_name': val,
+              'traded_goods_observed': '',
+              'traded_goods_quantity': '',
+              'traded_goods_uom': '',
+              'traded_goods_other_uom': '',
+              'estimated_traded_goods_value': '',
+              'is_sufficiant_traded_goods': '',
+              'traded_goods_remarks':''};
+            tradedGoods.push(this.createTradedGoods(Ref_Trade_Goods));     
+          });
+        }
+        else{      
+          tradedGoods.push(this.createTradedGoods(null));     
+        }
+
+       } else {
+        if(datas.trading_traded_goods !==undefined)
+        {
+        // for (let val of datas.trading_traded_goods) {
+          datas.trading_traded_goods.forEach((val,index) => {
+          
+          if(val.estimated_traded_goods_value){
+            this.inWords(val.estimated_traded_goods_value,4,index);
+          }
+           this.checkComments(val.is_sufficiant_traded_goods,4,index);
+           tradedGoods.push(this.createTradedGoods(val));            
+         });
+        }
+        else{
+          tradedGoods.push(this.createTradedGoods(null));            
+        }
+
+       }
+  }
+
+  createTradedGoods(records) {
+      if(records === null) {
+          return this.fb.group({
+              traded_goods_name: [''],
+              traded_goods_observed: [''],
+              traded_goods_quantity: [''],
+              traded_goods_uom: [''],
+              traded_goods_other_uom: [''],
+              estimated_traded_goods_value: [''],
+              // traded_goods_value: [''],
+              is_sufficiant_traded_goods: [''],
+              traded_goods_remarks:['']
+      });
+    }
+    else {
+      return this.fb.group({
+              traded_goods_name: [records.traded_goods_name],
+              traded_goods_observed: [records.traded_goods_observed],
+              traded_goods_quantity: [records.traded_goods_quantity],
+              traded_goods_uom: [records.traded_goods_uom],
+              traded_goods_other_uom: [records.traded_goods_other_uom],
+              estimated_traded_goods_value: [records.estimated_traded_goods_value],
+              // traded_goods_value: [records.traded_goods_value],
+              is_sufficiant_traded_goods: [records.is_sufficiant_traded_goods],
+              traded_goods_remarks:[records.traded_goods_remarks]
+    })
+  }
+  }
+  
+  /** Manufacturing -> To Add More Raw Material Details */
+  addRawMaterials(flag) {
+    if(flag==1){
+      const control = <FormArray>this.stockForm.controls['manufacturing_details']['controls'][0].controls['manufacturing_raw_materials'];
+      control.push(this.createRawmaterial(null));
+    }
+  }
+
+  /** Manufacturing -> To Remove Raw Material Details */
+  deleteRawMaterials(index,flag) {
+  if(flag==1){
+    const control = <FormArray>this.stockForm.controls['manufacturing_details']['controls'][0].controls['manufacturing_raw_materials'];
+    control.removeAt(index);
+  }
+  }
+
+  /** Manufacturing -> To Add More Finished Goods */
+  addGoods(flag) {
+    if(flag == 1){
+        const control  = <FormArray>this.stockForm.controls['manufacturing_details']['controls'][0].controls['manufacturing_finished_goods'];
+        control.push(this.createGoods(null));
+    }
+  }
+
+  /** Manufacturing -> To Remove Finished Goods */
+  deleteGoods(index,flag) {
+  if(flag == 1){
+    const control  = <FormArray>this.stockForm.controls['manufacturing_details']['controls'][0].controls['manufacturing_finished_goods'];
+    control.removeAt(index);
+  }
+  }
+
+  /**
+   * Case 1 Retail Traded -> To Add More trade Goods
+   * Case 2 wholesale Traded -> To Add More trade Goods
+   */
+  addTradedGoods(flag) {
+    switch(flag){
+        
+        case 1: {
+          const control = <FormArray>this.stockForm.controls['retail_details']['controls'][0].controls['retail_traded_goods'];
+          control.push(this.createTradedGoods(null));
+          break;
+        }
+        case 2: {
+          const control = <FormArray>this.stockForm.controls['trade_details']['controls'][0].controls['trading_traded_goods'];
+          control.push(this.createTradedGoods(null));
+          break;
+        }
+        default: {
+          break;
+        }
+      }
+  }
+
+  /**
+  * Case 1 Retail Traded -> To remove trade Goods
+  * Case 2 wholesale Traded -> To remove trade Goods
+  */
+  deleteTradedGoods(index,flag) {
+  switch(flag){
+    case 1: {
+      const control = <FormArray>this.stockForm.controls['retail_details']['controls'][0].controls['retail_traded_goods'];
+      control.removeAt(index);
+      break;
+    }
+    case 2: {
+      const control = <FormArray>this.stockForm.controls['trade_details']['controls'][0].controls['trading_traded_goods'];
+      control.removeAt(index);
+      break;
+    }
+    default: {
+      break;
+    }
+  }
+ 
+  //const control = <FormArray>this.stockForm.controls['traded_goods'];
+
+  }
+
+  checkComments(e,flag,index){
+   
+    if(flag == 1 && e=='no'){
+      this.mrmCommentFlag[index] = true;
+    }
+    else if(flag == 1 && e!='no'){
+      this.mrmCommentFlag[index] = false;
+    }
+    if(flag == 2 && e=='no'){
+      this.mfgCommentFlag[index] =  true;
+    }
+    else if(flag == 2 && e!='no'){
+      this.mfgCommentFlag[index] =  false;
+    }
+    if(flag == 3 && e=='no'){
+      this.rtrdCommentFlag[index] = true;
+    }
+    else if(flag == 3 && e!='no'){
+      this.rtrdCommentFlag[index] = false;
+    }
+    if(flag == 4 && e=='no'){
+      this.wtrdCommentFlag[index] = true;
+    }
+    else if(flag == 4 && e!='no'){
+      this.wtrdCommentFlag[index] = false;
+    }
+  }
+
+  /** To Save/Edited Popup Data */
+  saveStockInfo(answerFormValues) {
+  
+    //To Remove The "Null" With Key also
+    Object.keys(answerFormValues).forEach((key) => (answerFormValues[key] == null) && delete answerFormValues[key]);
+    
+    this.qustCat.saveForm(answerFormValues).subscribe(responsed => {
+          if(responsed['status'] == 200) { 
+            this.navCtrl.pop();
+            this.toast.pdTriggerappmessage('Record Saved Successfully.!');
+          }else{
+            this.toast.pdTriggerappmessage('Something Wents Wrong Try Again.!');    
+          }
+     });
+  }
+
+  inWords(e,flag:number,i){
+
+    switch(flag){
+    case 1 :
+        this.M_rawValueInWords[i] = this.constant.convertNumberToWords(e);    
+        break;
+    case 2 : 
+        this.M_goodsValueInWords[i] = this.constant.convertNumberToWords(e);    
+        break;
+    case 3 : 
+        this.R_tradedGoodsValueInWords[i] = this.constant.convertNumberToWords(e);    
+        break;
+    case 4 : 
+        this.T_tradedGoodsValueInWords[i] = this.constant.convertNumberToWords(e);    
+        break;
+    default:
+        break;
+ }
+}
+
+  // createRawmaterial() {
+  //   return this.fb.group({
+  //     raw_name: [''],
+  //     stock_observed:[''],
+  //     raw_quantity: [''],
+  //     raw_uom: [''],
+  //     other_uom : [''],
+  //     raw_value: [''],
+  //     rawmaterial_value: [''],
+  //     is_sufficiant_raw: [''],
+  //   });
+  // }
+  // createGoods() {
+  //   return this.fb.group({
+  //     goods_name: [''],
+  //     goods_quantity: [''],
+  //     goods_value: [''],
+  //     finished_goods_value: [''],
+  //     is_sufficiant_goods: [''],
+  //   });
+  // }
+  // addRawMaterials() {
+  //   const control = <FormArray>this.stockForm.controls['raw_materials'];
+  //   control.push(this.createRawmaterial());
+  // }
+  // deleteRawMaterials(index) {
+  //   const control = <FormArray>this.stockForm.controls['raw_materials'];
+  //   if(control.length==1)
+  //   {
+  //     this.stockForm.controls['raw_materials'].reset();
+  //   }else{
+  //   control.removeAt(index);
+  // }
+  // }
+  // addGoods() {
+  //   const control = <FormArray>this.stockForm.controls['finished_goods'];
+
+  //   control.push(this.createGoods());
+  // }
+  // deleteGoods(index) {
+  //   const control = <FormArray>this.stockForm.controls['finished_goods'];
+  //  if(control.length==1)
+  //   {
+  //     this.stockForm.controls['finished_goods'].reset();
+  //   }else{
+  //   control.removeAt(index);
+  // }
+  // }
+
+
+  // submitDetails(answerData) {
+    
+  //   let records: any = {};
+  //   records.pdid = this.pdDetails.pd_id;
+  //   records.formid = this.FormId.form_id;
+  //   records.fk_createdby = this.users;
+  //   records.raw_materials = answerData.raw_materials;
+  //   records.stock_remarks = answerData.stock_remarks;
+  //   records.finished_goods = answerData.finished_goods;
+  
+  //   this.qustCat.saveForm(records).subscribe(data => {
+  //     this.navCtrl.pop();
+  //     this.toast.pdTriggerappmessage('Record Saved Successfully.!');
+  //   });
+  // }
+  
+  // getStockDetails() {
+  //   let records = { 'pd_id': this.pdDetails.pd_id, 'pd_FormId': this.FormId.form_id };
+
+  //   this.qustCat.retiverForm(records).subscribe(value => {
+  
+  //     const rawMaterial = <FormArray>this.stockForm.controls['raw_materials'];
+  //     const finishedGoods = <FormArray>this.stockForm.controls['finished_goods'];
+  //     if (value['dataStatus'] == true) {
+  //       let stockDetails = value['records'];
+  //       let result = Object.keys(stockDetails.raw_materials).map(function (key) {
+  //         return stockDetails.raw_materials[key];
+  //       });
+  //       let result_Goods = Object.keys(stockDetails.finished_goods).map(function (key) {
+  //         return stockDetails.finished_goods[key];
+  //       });
+  //       this.stockForm.controls['stock_remarks'].setValue(stockDetails.stock_remarks);
+  //       if (result.length > 0) {
+  //         result.forEach(val => {
+  //           rawMaterial.push(this.createRawmaterial());
+  //         });
+  //         this.stockForm.controls['raw_materials'].setValue(result);
+  //       } else {
+  //         rawMaterial.push(this.createRawmaterial());
+  //       }
+  //       if (result_Goods.length > 0) {
+  //         result_Goods.forEach(val => {
+  //           finishedGoods.push(this.createGoods());
+  //         });
+  //         this.stockForm.controls['finished_goods'].setValue(result_Goods);
+  //       } else {
+  //         finishedGoods.push(this.createGoods());
+  //       }
+  //     } else {
+  //     this.addRawMaterials();
+  //     this.addGoods();
+  //     }
+  //   })
+  // }
+}

src/pages/pd-question/pd-question-business-group/pd-question-supplier-info/pd-question-supplier-info.html

@@ -0,0 +1,278 @@
+<ion-header>
+
+    <ion-navbar color="optblue">
+        <button ion-button menuToggle>
+            <ion-icon name="menu"></ion-icon>
+          </button>
+      <ion-title>{{formDetails.form_name}}</ion-title>
+    </ion-navbar>
+
+</ion-header>
+
+<ion-content padding *ngIf="noRecordsFound">
+
+  <form [formGroup]="supplierInfoForm">
+
+    <mat-card *ngIf="manufacturingForm">
+
+      <mat-card-title>Manufacturing Product Details</mat-card-title>
+      <div formArrayName="manufacturing_details">
+        <div *ngFor="let item of supplierInfoForm.controls.manufacturing_details['controls']; let i=index" [formGroupName]="i">
+          <div formArrayName="main_raw_materials">
+            <div *ngFor="let items of item.controls.main_raw_materials['controls']; let l=index let last =last" [formGroupName]="l">
+                <mat-card>
+              <mat-card-subtitle>Raw Material #{{l+1}}</mat-card-subtitle>
+              <mat-card-content>
+
+                <div fxLayout="row nowrap" fxLayoutGap="2px" fxLayoutAlign="start none">
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Raw Material Name" formControlName="manufacturing_raw_material_name">
+                  </mat-form-field>
+
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Supplier Name" formControlName="manufacturing_supplier_name">
+                  </mat-form-field>
+
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Title" formControlName="person_title_name">
+                      <mat-option *ngFor="let tl of m_titleList" [value]="tl.title_id">
+                        {{tl.name}}
+                      </mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Contact Person Name" formControlName="manufacturing_contact_person_name">
+                  </mat-form-field>
+
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Contact Person Designation" formControlName="person_designation"
+                      (selectionChange)="selectedPersonDesignation(items,$event.value,1)">
+                      <mat-option>Select</mat-option>
+                      <mat-option *ngFor="let comrelShip of m_companyRelationShipList" [value]="comrelShip.company_relationship_id">
+                        {{comrelShip.name}}
+                      </mat-option>
+                      <!-- <mat-option value="1" > Not Applicable </mat-option> -->
+                    </mat-select>
+                  </mat-form-field>
+
+                  <mat-form-field style="width: 100%" *ngIf="items.get('person_designation').value == 1">
+                    <input matInput placeholder="Specify Person Designation" formControlName="other_person_designation">
+                  </mat-form-field>
+                
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Contact Person Mobile Number" autocomplete="off" formControlName="manufacturing_contact_person_mobile_number"
+                       maxlength="10" type="number">
+                    <mat-error>Enter Valid Mobile Number.</mat-error>
+                  </mat-form-field>
+
+                  <mat-form-field style="width: 100%">
+                    <input matInput autocomplete="off" placeholder="STD Code" formControlName="person_stdcode" type="number">
+                    <mat-error>Enter Valid STD Code Number.</mat-error>
+                  </mat-form-field> 
+                  <!-- &nbsp; - &nbsp; -->
+                  <mat-form-field style="width: 100%">
+                    <input matInput autocomplete="off" placeholder="Contact Person Landline Number" formControlName="person_landline"
+                      type="number">
+                    <mat-error>Enter Valid LandLine Number.</mat-error>
+                  </mat-form-field>
+                
+                
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Payment Terms" formControlName="manufacturing_payment_type"
+                      (selectionChange)="selectedPaymentTerms(items,$event.value,1);checkCard($event.value,1,l);">
+                      <mat-option *ngFor="let pm of m_paymentList" [value]="pm.id">{{ pm.name }}</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Payment Mode" formControlName="manufacturing_payment_mode">
+                      <mat-option value="Payment made in Cash.">Payment made in Cash.</mat-option>
+                      <mat-option value="Payment made through Banking channels.">Payment made through Banking
+                        channels.</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+
+                <span *ngIf="items.get('manufacturing_payment_type').value == 3">
+                  <mat-label>No.of days of Credit Provided by Supplier </mat-label>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Days From" formControlName="manufacturing_credit_days_from" type="number">
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Days To" formControlName="manufacturing_credit_days_to" type="number">
+                  </mat-form-field>
+                </span>
+
+                </div>
+
+              </mat-card-content>
+              <ion-col offset-6 col-3>
+                  <a (click)="addMoreRawMaterials($event); false" *ngIf="last">
+                  <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                </ion-col>
+                <ion-col offset-3 col-1>
+                    <a *ngIf="item.controls.main_raw_materials.controls.length > 1" (click)="removeRawMaterials(l)">
+                    <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                </ion-col>
+                </mat-card>
+
+              
+
+            </div>
+          </div>
+          
+
+          
+
+            <!-- <mat-card-footer> -->
+                <div fxLayout="row nowrap" style="padding-left: 2%;" *ngIf="mfgCreditCardFlag">
+                    <mat-form-field style="width: 100%">
+                      <input matInput placeholder="What % of Total Purchase is Done on Credit?" formControlName="main_raw_materials_total_payments_percent_on_credit"
+                        type="number" autocomplete="off" maxlength="3">
+                    </mat-form-field>
+                 </div>
+             <!-- </mat-card-footer> -->
+
+        </div>
+      </div>
+
+    </mat-card>
+
+    <mat-card *ngIf="tradingForm">
+      <mat-card-title>Trading Product Details</mat-card-title>
+
+      <div formArrayName="trade_details">
+        <div *ngFor="let item of supplierInfoForm.controls.trade_details['controls']; let i=index" [formGroupName]="i">
+          <div formArrayName="trading_products">
+            <div *ngFor="let items of item.controls.trading_products['controls']; let l=index; let last = last" [formGroupName]="l">
+                <mat-card>
+              <mat-card-subtitle>Trading Product #{{l+1}}</mat-card-subtitle>
+              <mat-card-content>
+
+
+                <div fxLayout="row nowrap" fxLayoutGap="2px" fxLayoutAlign="start none">
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Trading Product Name" formControlName="trade_product_name">
+                      <mat-option *ngFor="let tp of business_tradingProducts" [value]="tp.name">{{ tp.name }}</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Supplier Name" formControlName="trade_supplier_name">
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Title" formControlName="person_title_name">
+                      <mat-option *ngFor="let tl of m_titleList" [value]="tl.title_id">
+                        {{tl.name}}
+                      </mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Contact Person Name" formControlName="trade_product_contact_person_name"
+                      maxlength="10">
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Contact Person Designation" formControlName="person_designation"
+                      (selectionChange)="selectedPersonDesignation(items,$event.value,2)">
+                      <mat-option>Select</mat-option>
+                      <mat-option *ngFor="let comrelShip of m_companyRelationShipList" [value]="comrelShip.company_relationship_id">
+                        {{comrelShip.name}}
+                      </mat-option>
+                      <!-- <mat-option value="1" > Not Applicable </mat-option> -->
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%" *ngIf="items.get('person_designation').value == 1">
+                    <input matInput placeholder="Specify Person Designation" formControlName="other_person_designation">
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Contact Person Mobile Number" autocomplete="off" formControlName="trade_product_contact_person_mobile_number"
+                    type="number" maxlength="10">
+                    <mat-error>Enter Valid Mobile Number.</mat-error>
+
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <input matInput autocomplete="off" placeholder="STD Code" formControlName="person_stdcode" type="text"
+                    type="number">
+                    <mat-error>Enter Valid STD Code Number.</mat-error>
+                  </mat-form-field> 
+                  <!-- &nbsp; - &nbsp; -->
+                  <mat-form-field style="width: 100%">
+                    <input matInput autocomplete="off" placeholder="Contact Person Landline Number" formControlName="person_landline"
+                    type="number">
+                    <mat-error>Enter Valid LandLine Number.</mat-error>
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Payment Terms" formControlName="trade_product_payment_type"
+                      (selectionChange)="selectedPaymentTerms(items,$event.value,2);checkCard($event.value,2,l);">
+                      <mat-option *ngFor="let pm of m_paymentList" [value]="pm.id">{{ pm.name }}</mat-option>
+                    </mat-select>
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <mat-select placeholder="Payment Mode" formControlName="trade_product_payment_mode">
+                      <mat-option value="Payment received in Cash.">Payment received in Cash.</mat-option>
+                      <mat-option value="Payment received through Banking channels.">Payment received through Banking
+                        channels.</mat-option>
+                    </mat-select>
+
+                  </mat-form-field>
+                
+                <span *ngIf="items.get('trade_product_payment_type').value == 3">
+                  <mat-label>No.of days of Credit Provided by Supplier </mat-label>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Days From" formControlName="trade_product_credit_days_from" type="number">
+                  </mat-form-field>
+                  <mat-form-field style="width: 100%">
+                    <input matInput placeholder="Days To" formControlName="trade_product_credit_days_to" type="number">
+                  </mat-form-field>
+                </span>
+              </div>
+              </mat-card-content>
+              <ion-col offset-6 col-3>
+                  <a (click)="addMoretradeProduct($event); false" *ngIf="last">
+                  <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                </ion-col>
+                <ion-col offset-3 col-1>
+                    <a (click)="removeTradingProduct(l)"  *ngIf="item.controls.trading_products.controls.length > 1">
+                    <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
+                </ion-col>
+              </mat-card>              
+            </div>
+          </div>
+          
+          
+            
+            <!-- <mat-card-footer> -->
+                <div fxLayout="row nowrap" style="padding-left: 2%;" *ngIf="trdCreditCardFlag">
+                    <mat-form-field style="width: 90%">
+                      <input matInput placeholder="What % of Total Trade is done on Credit?" formControlName="trading_products_total_payments_percent_on_credit"
+                        type="number" autocomplete="off">
+                    </mat-form-field>
+                </div>
+            <!-- </mat-card-footer> -->
+
+        
+        </div>
+      </div>
+    </mat-card>
+
+    <mat-card *ngIf="serviceProviderForm">
+        <mat-card-title>Service Provider Product Details</mat-card-title>
+        <div style="text-align: center; margin: 12px;">Service Provider Details Not applicable here !!</div>
+    </mat-card>
+
+      <mat-card>
+        <mat-form-field style="width: 100%">
+            <mat-label>Remarks</mat-label>
+            <textarea matInput placeholder="Remarks" formControlName="supplier_info_form_remark"></textarea>
+        </mat-form-field>
+      </mat-card>
+
+    <ion-row>
+      <button ion-button full color="optblue" (click)="saveSupplierInfo(supplierInfoForm.value)"> Save</button>
+    </ion-row>
+
+  </form>
+
+</ion-content>
+
+<ion-content padding *ngIf="!noRecordsFound">
+  <div style="margin: 12px; font-size: 18px;"> {{ errorMessage }} </div>
+</ion-content>

src/pages/pd-question/pd-question-business-group/pd-question-supplier-info/pd-question-supplier-info.scss

@@ -0,0 +1,13 @@
+page-pd-question-supplier-info {
+        mat-hint{
+            font-size:12px;
+        }
+       .mat-card{
+            margin-bottom: 15px;
+            border-radius: 10px !important;
+            box-shadow: 0 16px 38px -12px rgba(0, 0, 0, 0.56), 0 4px 25px 0 rgba(0, 0, 0, 0.12), 0 8px 10px -5px rgba(0, 0, 0, 0.2) !important;
+        }
+        .mat-card-content{
+            margin-bottom: 0px !important;
+        }
+}

src/pages/pd-question/pd-question-business-group/pd-question-supplier-info/pd-question-supplier-info.ts

@@ -0,0 +1,475 @@
+import { Component } from '@angular/core';
+import { IonicPage, NavController, NavParams } from 'ionic-angular';
+import { FormBuilder, FormGroup, FormArray } from '@angular/forms';
+import { AwsServiceProvider } from '../../../../providers/aws-service/aws-service';
+import { QuestionCategoryProvider } from '../../../../providers/question-category/question-category';
+import { ToastProvider } from '../../../../providers/common-provider/toast';
+
+/**
+ * Generated class for the PdQuestionSupplierInfoPage page.
+ *
+ * See https://ionicframework.com/docs/components/#navigation for more info on
+ * Ionic pages and navigation.
+ */
+
+
+@Component({
+  selector: 'page-pd-question-supplier-info',
+  templateUrl: 'pd-question-supplier-info.html',
+})
+
+export class PdQuestionSupplierInfoPage {
+  users: any;
+  pdDetails: any;
+  formDetails:any;
+  company_id:any;
+  form_id:any;
+  questionDetails: any;
+  supplierInfoForm: FormGroup;
+
+  business_manufacturingProducts : any = [];
+  business_tradingProducts : any = [];
+  m_titleList: any = [];
+  m_paymentList: any = [];
+  m_companyRelationShipList : any = [];
+  
+  noRecordsFound: Boolean = false;
+  public submitted = false;
+  errorMessage: any = '';
+
+  constructor(public navCtrl: NavController, public navParams: NavParams,public fb:FormBuilder,public aws:AwsServiceProvider,public qustCat:QuestionCategoryProvider,public toast:ToastProvider) {
+    
+    this.questionDetails = this.navParams.get('questionDetails');
+    this.pdDetails = this.navParams.get('pdDetails');
+    this.formDetails=this.navParams.get('formDetails');
+    this.form_id = this.formDetails.form_id;
+    // console.log(this.formDetails);
+    this.company_id=this.pdDetails.company_id;
+    this.users = this.aws.getlocale();
+    
+    
+    this.qustCat.getTypeofActivityForSuppliedInfoForm(this.pdDetails.pd_id, this.company_id).subscribe(data => {
+    
+      if(data.dataStatus){
+      
+            let datas = data.records;
+            this.initFormLoadDetails(datas.type_of_activity);
+            this.business_manufacturingProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 2 ){return data}}).map(data=> [...data.prodcuts]);
+            // this.business_tradingProducts = datas.type_of_activity.filter(data=>{if(data.type_of_activity_id == 3){return data}}).map(data=> [...data.prodcuts]);
+      
+            let api = Object.keys(datas.type_of_activity).map(function (key) {
+              return datas.type_of_activity[key];
+            });
+
+            if(api.length > 0){     
+              api.forEach(val => {
+                if (val.type_of_activity_id == 3) {
+                  if(val.prodcuts){
+                    this.business_tradingProducts.push(val.prodcuts);
+                  }
+                }
+
+                if (val.type_of_activity_id == 4) {
+                  if(val.prodcuts){
+                    this.business_tradingProducts.push(val.prodcuts);
+                  }
+                }
+              });
+            }
+
+            this.business_tradingProducts = [].concat.apply([], this.business_tradingProducts);
+      
+      }else {
+        this.toast.pdTriggerappmessage('No Category Records Found.!');
+        this.noRecordsFound = false;
+        this.errorMessage = data.msg;
+      }
+    }, err => {
+      this.toast.pdTriggerappmessage('No Category Records Found.!');
+      this.noRecordsFound = false;
+      this.errorMessage = 'No Records Found , Something went Wrong!';
+    })
+    this.getdropList();
+  }
+
+
+  ionViewDidLoad() {
+    console.log('ionViewDidLoad PdQuestionSupplierInfoPage');
+  }
+
+
+  serviceProviderForm: Boolean = false;
+  initFormLoadDetails(record) {
+    let params: any = {};
+        params.pd_id = this.pdDetails.pd_id;
+        params.pd_form_id = this.form_id;
+        params.company_id = this.company_id;
+        
+     this.qustCat.retiverForm(params).subscribe(
+      data => {
+        if(data['dataStatus'] == true){
+            let dataForm = data['records'];
+            if(dataForm !== undefined) {
+                this.supplierInfoForm = this.fb.group({
+                  pdid: [this.pdDetails.pd_id],
+                  formid: [this.form_id],
+                  company_id: [this.company_id],
+                  fk_createdby:[this.users],
+                  manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+                  trade_details: this.fb.array([this.tradingFormCreation(record)]),
+                  supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
+                  // wholesale_trade_details: this.fb.array([this.tradingFormCreation(record)]),
+                });
+                let arr = record.filter(data => data.type_of_activity_id == 2);
+                if(arr.length > 0) {
+                  // let api_main_raw_materials = Object.keys(dataForm.main_raw_materials).map(function (key) {
+                  //   return dataForm.main_raw_materials[key];
+                  // });
+                  let api_main_raw_materials = dataForm.manufacturing_details[0].main_raw_materials;
+           
+                  this.initManufacturingProductsDetails(api_main_raw_materials);
+                  this.supplierInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(dataForm.manufacturing_details[0].main_raw_materials_total_payments_percent_on_credit || null);
+                }
+                let arr1 = record.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id ==4);
+                if(arr1.length > 0) {
+                  // let api_trading_products = Object.keys(dataForm.trading_products).map(function (key) {
+                  //   return dataForm.trading_products[key];
+                  // });
+                  let api_trading_products = dataForm.trade_details[0].trading_products;
+                  this.initTradingProductsDetails(api_trading_products);
+                  this.supplierInfoForm.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(dataForm.trade_details[0].trading_products_total_payments_percent_on_credit || null);
+                }
+                this.noRecordsFound = true;
+            } else {
+                this.supplierInfoForm = this.fb.group({
+                    pdid: [this.pdDetails.pd_id],
+                    formid: [this.form_id],
+                    company_id: [this.company_id],
+                    fk_createdby:[this.users],
+                    manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+                    trade_details: this.fb.array([this.tradingFormCreation(record)]),
+                    supplier_info_form_remark: [dataForm.supplier_info_form_remark || null]
+                  // wholesale_trade_details: this.fb.array([this.tradingFormCreation(record)]),
+                });
+                  let arr = record.filter(data => data.type_of_activity_id == 2);
+                  if(arr.length > 0) {
+                    this.initManufacturingProductsDetails(null);
+                    this.supplierInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
+                  }
+                  let arr1 = record.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id == 4);
+                  if(arr1.length > 0) {
+                    this.initTradingProductsDetails(null);
+                    this.supplierInfoForm.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(dataForm.trading_products_total_payments_percent_on_credit || null);
+                  }
+                  this.noRecordsFound = true;
+            }
+                let arr2 = record.filter(data => data.type_of_activity_id == 5);
+                  if(arr2.length > 0) {
+                 this.serviceProviderForm = true;
+                }
+        } else {
+            this.supplierInfoForm = this.fb.group({
+                    pdid: [this.pdDetails.pd_id],
+                    formid: [this.form_id],
+                    company_id: [this.company_id],
+                    fk_createdby:[this.users],
+                    manufacturing_details: this.fb.array([this.manufacturingFormCreation(record)]),
+                    trade_details: this.fb.array([this.tradingFormCreation(record)]),
+                    supplier_info_form_remark: []
+                  // wholesale_trade_details: this.fb.array([this.tradingFormCreation(record)]),
+                });
+                  let arr = record.filter(data => data.type_of_activity_id == 2);
+                  if(arr.length > 0) {
+                    this.initManufacturingProductsDetails(null);
+                    this.supplierInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials_total_payments_percent_on_credit'].setValue(null);
+                  }
+                  let arr1 = record.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id== 4);
+                  if(arr1.length > 0) {
+                    this.initTradingProductsDetails(null);
+                    this.supplierInfoForm.controls['trade_details']['controls'][0].controls['trading_products_total_payments_percent_on_credit'].setValue(null);
+                  }
+                  let arr2 = record.filter(data => data.type_of_activity_id == 5);
+                  if(arr2.length > 0) {
+                  this.serviceProviderForm = true;
+                }
+            this.noRecordsFound = true;
+        }
+      }, err => {
+
+      }
+     );
+    }
+
+    manufacturingForm: Boolean = false;
+    manufacturingFormCreation(val) {
+      let arr = val.filter(data => data.type_of_activity_id == 2);
+      if (arr.length > 0) {
+        this.manufacturingForm = true;
+          return this.fb.group({
+            main_raw_materials: this.fb.array([]),
+            main_raw_materials_total_payments_percent_on_credit: []
+          })
+        // }
+      } else {
+        return;
+      }
+    }
+  
+    tradingForm: Boolean = false;
+    tradingFormCreation(val) {
+      let arr = val.filter(data => data.type_of_activity_id == 3 || data.type_of_activity_id == 4);
+      if (arr.length > 0) {
+        this.tradingForm = true;
+        return this.fb.group({
+          trading_products: this.fb.array([]),
+          trading_products_total_payments_percent_on_credit: []
+        });
+      } else {
+        return;
+      }
+    }
+  
+    initManufacturingProductsDetails(datas) {
+        const control = <FormArray>this.supplierInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
+         if(datas === null){
+           control.push(this.initManufacturingProducts(null));
+         } else {
+             datas.forEach((val,inx) => {
+              this.checkCard(val.manufacturing_payment_type,1,inx);
+              control.push(this.initManufacturingProducts(val));
+             });
+         }
+    }
+  
+    initManufacturingProducts(records) {
+      if(records === null) {
+        return this.fb.group({
+          manufacturing_raw_material_name: [''],
+          manufacturing_supplier_name: [''],
+          person_title_name:[''],
+          person_designation:[''],
+          other_person_designation:[''],
+          manufacturing_contact_person_name: [''],
+          manufacturing_contact_person_mobile_number: [''],
+          //,Validators.compose([Validators.minLength(10),Validators.maxLength(10)])
+          manufacturing_payment_type: [''],
+          manufacturing_payment_mode:[''],
+          manufacturing_credit_days_from: [''],
+          manufacturing_credit_days_to:[''],
+          manufacturing_frequency_of_purchase: [''],
+          person_stdcode:[''],
+          //, Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])
+          person_landline:[''],
+          //, Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])
+  
+        })
+      } else {
+          return this.fb.group({
+          manufacturing_raw_material_name: [records.manufacturing_raw_material_name || null],
+          manufacturing_supplier_name: [records.manufacturing_supplier_name || null],
+          person_title_name:[records.person_title_name || null],
+          person_designation:[records.person_designation || null],
+          other_person_designation:[records.other_person_designation || null],
+          manufacturing_contact_person_name: [records.manufacturing_contact_person_name || null],
+          manufacturing_contact_person_mobile_number: [records.manufacturing_contact_person_mobile_number || null],
+            //Validators.compose([Validators.minLength(10),Validators.maxLength(10)])],
+          manufacturing_payment_type: [records.manufacturing_payment_type || null],
+          manufacturing_payment_mode:[records.manufacturing_payment_mode],
+          manufacturing_credit_days_from: [records.manufacturing_credit_days_from || null],
+          manufacturing_credit_days_to:[records.manufacturing_credit_days_to || null],
+          manufacturing_frequency_of_purchase: [records.manufacturing_frequency_of_purchase || null],
+          person_stdcode:[records.person_stdcode || null],
+          //, Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])
+          person_landline:[records.person_landline || null],
+          //, Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])
+        })
+      }
+    }
+  
+    initTradingProductsDetails(datas) {
+      const control = <FormArray>this.supplierInfoForm.controls['trade_details']['controls'][0].controls['trading_products'];
+      
+        if(datas === null){
+          control.push(this.initTradingProducts(null));
+        } else {
+          datas.forEach((val,inx) => {
+            this.checkCard(val.trade_product_payment_type,2,inx);
+            control.push(this.initTradingProducts(val));
+          });
+        }
+    }
+  
+      initTradingProducts(records) {
+            if(records === null) {
+                return this.fb.group({
+                      trade_product_name: [''],
+                      trade_supplier_name: [''],
+                      person_title_name:[''],
+                      person_designation:[''],
+                      other_person_designation:[''],
+                      trade_product_contact_person_name: [''],
+                      trade_product_contact_person_mobile_number: [''],
+                      //,Validators.compose([Validators.minLength(10),Validators.maxLength(10)])
+                      person_stdcode:[null],
+                      //, Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])
+                      person_landline:[null],
+                      //, Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])
+                      trade_product_payment_type: [''],
+                      trade_product_payment_mode: [''],
+                      trade_product_frequency_of_purchase: [''],
+                      trade_product_credit_days_from: [''],
+                      trade_product_credit_days_to: [''],
+                    })
+            } else {
+               return this.fb.group({
+                      trade_product_name: [records.trade_product_name],
+                      person_title_name:[records.person_title_name],
+                      person_designation:[records.person_designation],
+                      other_person_designation:[records.other_person_designation],
+                      trade_supplier_name: [records.trade_supplier_name],
+                      trade_product_contact_person_name: [records.trade_product_contact_person_name],
+                      trade_product_contact_person_mobile_number: [records.trade_product_contact_person_mobile_number],
+                      //, Validators.compose([Validators.minLength(10),Validators.maxLength(10)])
+                      person_stdcode:[records.person_stdcode],
+                      //, Validators.compose([Validators.minLength(3),Validators.maxLength(5),Validators.pattern('^[0-9]*$')])
+                      person_landline:[records.person_landline],
+                      //, Validators.compose([Validators.minLength(6),Validators.maxLength(8),Validators.pattern('^[0-9]*$')])
+                      trade_product_payment_type: [records.trade_product_payment_type],
+                      trade_product_payment_mode: [records.trade_product_payment_mode],
+                      trade_product_frequency_of_purchase: [records.trade_product_frequency_of_purchase],
+                      trade_product_credit_days_from: [records.trade_product_credit_days_from],
+                      trade_product_credit_days_to: [records.trade_product_credit_days_to],
+                    })
+            }
+      }
+  
+    addMoreRawMaterials(e): void {
+      // e.stropPropagation();
+      const control = <FormArray>this.supplierInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
+      
+      control.push(this.initManufacturingProducts(null));
+    }
+  
+    removeRawMaterials(inx): void {
+      const control = <FormArray>this.supplierInfoForm.controls['manufacturing_details']['controls'][0].controls['main_raw_materials'];
+      control.removeAt(inx);
+    }
+  
+    addMoretradeProduct(e): void {
+      // e.stropPropagation();
+      const control = <FormArray>this.supplierInfoForm.controls['trade_details']['controls'][0].controls['trading_products'];
+      
+      control.push(this.initTradingProducts(null));
+    }
+  
+    removeTradingProduct(inx): void {
+      const control = <FormArray>this.supplierInfoForm.controls['trade_details']['controls'][0].controls['trading_products'];
+      control.removeAt(inx);
+    }
+
+  
+    getdropList(){
+      
+      this.qustCat.getcommondrop('COMPANYRELATIONSHIPS').subscribe(
+        data => {
+          this.m_companyRelationShipList = data['records'].filter(data => data.isactive == 1);
+      });
+
+      this.qustCat.getcommondrop('TITLES').subscribe(
+          data => {
+            this.m_titleList = data['records'].filter(data => data.isactive == 1);
+      });
+
+      this.qustCat.getcommondrop('PAYMENTMODE').subscribe(
+            data => {
+              this.m_paymentList = data['records'].filter(data => data.isactive == 1);
+      });
+    }
+
+  
+saveSupplierInfo(FormValues) {
+
+    var answerFormValues = FormValues;
+
+    Object.keys(answerFormValues).forEach((key) => (answerFormValues[key] == null) && delete answerFormValues[key]);
+
+    this.qustCat.saveForm(answerFormValues).subscribe(responsed => {
+      if(responsed['status'] == 200) { 
+        this.navCtrl.pop();
+        this.toast.pdTriggerappmessage('Record Saved Successfully.!');
+      }else{
+        this.toast.pdTriggerappmessage('Something Wents Wrong Try Again.!');    
+      }
+    });
+  
+}
+
+selectedPersonDesignation(items,e,flag){
+  if(flag == 1){
+    e==1 ? '' : '' ;
+  //  e==1 ? items.controls['other_person_designation'].setValidators([Validators.required])
+  //       : items.controls['other_person_designation'].clearValidators(),items.controls['other_person_designation'].setValue('');
+  //         items.controls['other_person_designation'].updateValueAndValidity();
+  }
+  else if(flag == 2){
+    e==1 ? '' : '' ;
+    // e==1 ?items.controls['other_person_designation'].setValidators([Validators.required])
+    //      :items.controls['other_person_designation'].clearValidators(),items.controls['other_person_designation'].setValue('');
+    //       items.controls['other_person_designation'].updateValueAndValidity();
+  }
+}
+
+mfgCreditCardFlag : boolean = false;
+trdCreditCardFlag : boolean = false;
+mfgCounter: any = [];
+trdCounter: any = [];
+checkCard(e,flag,index){
+  if(flag == 2 &&  e==3){
+    this.trdCounter[index] = 1;
+  }
+  else if(flag == 2 &&  e!=3){
+    this.trdCounter[index] = 0;
+  }
+  let TRD = this.trdCounter.reduce((sum, val) => sum + +val, 0);
+  this.trdCreditCardFlag = TRD > 0 ? true : false ;
+
+  if(flag == 1 && e==3){
+    this.mfgCounter[index] = 1;
+  }
+  else if(flag == 1 &&  e!=3){
+    this.mfgCounter[index] = 0;
+  }
+  let MFG = this.mfgCounter.reduce((sum, val) => sum + +val, 0);
+  this.mfgCreditCardFlag = MFG > 0 ? true : false ;
+}
+
+selectedPaymentTerms(items,e,flag){
+  if(flag == 2){
+   if(e==3){ 
+    //  items.controls['trade_product_credit_days_from'].setValidators([Validators.required]);
+    //  items.controls['trade_product_credit_days_to'].setValidators([Validators.required]);
+    }
+    else{
+      items.controls['trade_product_credit_days_from'].clearValidators();
+      items.controls['trade_product_credit_days_from'].setValue('');
+      items.controls['trade_product_credit_days_to'].clearValidators();
+      items.controls['trade_product_credit_days_to'].setValue('');
+    }
+         items.controls['trade_product_credit_days_from'].updateValueAndValidity();
+         items.controls['trade_product_credit_days_to'].updateValueAndValidity();
+  }
+  else if(flag == 1){
+    if(e==3){ //items.controls['manufacturing_credit_days_from'].setValidators([Validators.required]);
+              //items.controls['manufacturing_credit_days_to'].setValidators([Validators.required]);
+            }
+    else{
+      items.controls['manufacturing_credit_days_from'].clearValidators();
+      items.controls['manufacturing_credit_days_from'].setValue('');
+      items.controls['manufacturing_credit_days_to'].clearValidators();
+      items.controls['manufacturing_credit_days_to'].setValue('');
+    }
+         items.controls['manufacturing_credit_days_from'].updateValueAndValidity();
+         items.controls['manufacturing_credit_days_to'].updateValueAndValidity();
+  }
+}
+}

src/pages/pd-question/pd-question-client-info/pd-question-client-info.html

@@ -1,105 +0,0 @@
-<ion-header>
-
-  <ion-navbar color="optblue">
-    <button ion-button menuToggle>
-      <ion-icon name="menu"></ion-icon>
-    </button>
-    <ion-title *ngIf="!viewchange">{{FormId.form_name}}</ion-title>
-
-
-  </ion-navbar>
-
-</ion-header>
-<ion-content padding>
-  <form *ngIf="apiLoadFinish" [formGroup]="clientForms">
-    
-      <div formArrayName="clientArray" fxFill>
-        
-        <div *ngFor="let sup of clientForms.controls.clientArray['controls']; let i=index;let last=last;">
-            <mat-card>
-          <div [formGroupName]="i">
-            <div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
-              <div>
-                <mat-form-field style="width: 100%">
-                  <input matInput placeholder="Client Name" formControlName="client_name">
-                  <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                </mat-form-field>
-              </div>
-              <div>
-                <mat-form-field style="width: 100%">
-                  <input matInput placeholder="Contact Person Name" formControlName="contact_person">
-                  <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                </mat-form-field>
-              </div>
-              <div>
-                <mat-form-field style="width: 100%">
-                  <input matInput placeholder="Contact Mobile Number" formControlName="mobile_number" type="tel"  maxlength="10">
-                  <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                </mat-form-field>
-              </div>
-            </div>
-            <div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
-              <div>
-                <mat-form-field style="width: 100%">
-                  <mat-select (selectionChange)="selectedPM($event)" placeholder="Payment Mode" formControlName="payment_mode">
-                    <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
-                  </mat-select>
-                </mat-form-field>
-              </div>
-              <div *ngIf="sup.get('payment_mode').value == 1 ||  sup.get('payment_mode').value == 3">
-                <mat-form-field style="width: 100%">
-                  <input matInput type="number" placeholder="% of immediate / Advance Payment Purchase to Total Purchase?" formControlName="per_of_immediate_advance_payment">
-                  <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                </mat-form-field>
-              </div>
-              <div *ngIf="sup.get('payment_mode').value == 2  || sup.get('payment_mode').value == 3">
-                <mat-form-field style="width: 100%">
-                  <input type="number" matInput placeholder="Credit Period" formControlName="credit_period">
-                  <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                </mat-form-field>
-              </div>
-            </div>
-            <div fxLayout="row" fxLayoutGap="12px" fxLayoutAlign="start none">
-              <div>
-                <mat-form-field style="width: 100%">
-                  <mat-select (selectionChange)="selectedFreqPurchase($event)" placeholder="Select Frequency of Purchase" formControlName="frequency_of_purchase">
-                    <mat-option *ngFor="let feq of m_freqOfPurchase" [value]="feq.frequency_id">{{ feq.name }}</mat-option>
-                  </mat-select>
-                </mat-form-field>
-              </div>
-              <div *ngIf="sup.get('frequency_of_purchase').value == 8">
-                <mat-form-field style="width: 100%">
-                  <input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value">
-                  <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                </mat-form-field>
-              </div>
-
-              <div fxFlex="20">
-                <!-- <span *ngIf="clientForms.controls.clientArray.controls.length > 1" (click)="removeLanguage(i)">
-                     <button mat-button mat-icon-button class="mr-1 mb-1 hover-icon" matTooltip="Delete" matTooltipPosition="above"><mat-icon>delete</mat-icon></button>
-                   </span> -->
-              </div>
-            </div>
-          </div>
-          <ion-col offset-6 col-3>
-              <a (click)="addClientDetails()" *ngIf="last">
-                  <ion-icon name="md-add" color="optblue" style="font-size: 22px;"></ion-icon>
-              </a>
-          </ion-col>
-          <ion-col offset-1 col-3>
-              <a (click)="removeClientDetails(i)">
-                  <ion-icon name="md-close" color="optblue" style="font-size: 22px;"></ion-icon>
-              </a>
-          </ion-col>
-        </mat-card>
-        <br/>
-        </div>
-        </div>
-       
-        <ion-row>
-            
-            <button ion-button full color="optblue" (click)="saveclientDetails(clientForms.value)"> Save</button>
-            <!-- </ion-buttons> -->
-        </ion-row>
-  </form>
-</ion-content>

src/pages/pd-question/pd-question-client-info/pd-question-client-info.scss

@@ -1,3 +0,0 @@
-page-pd-question-client-info {
-
-}

src/pages/pd-question/pd-question-client-info/pd-question-client-info.ts

@@ -1,166 +0,0 @@
-import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
-import { QuestionCategoryProvider } from '../../../providers/question-category/question-category';
-import { AwsServiceProvider } from '../../../providers/aws-service/aws-service';
-import { ToastProvider } from '../../../providers/common-provider/toast';
-import { FormGroup, FormBuilder, FormArray } from '@angular/forms';
-
-/**
- * Generated class for the PdQuestionClientInfoPage page.
- *
- * See https://ionicframework.com/docs/components/#navigation for more info on
- * Ionic pages and navigation.
- */
-
-
-@Component({
-  selector: 'page-pd-question-client-info',
-  templateUrl: 'pd-question-client-info.html',
-})
-export class PdQuestionClientInfoPage {
-
-  users: any;
-  paymentModeTextBox: any;
-  m_paymentModeType: any;
-  m_freqOfPurchase: any;
-  FormId: any;
-  pdDetails: any;
-  clientForms:FormGroup;
-  clientDataArray:FormArray;
-  apiLoadFinish:boolean = false;
-  constructor(public navCtrl: NavController, public navParams: NavParams,public qustCat:QuestionCategoryProvider,public aws:AwsServiceProvider,public toast:ToastProvider,public fb:FormBuilder) {
-    this.pdDetails = this.navParams.get('pdDetails');
-    this.FormId = this.navParams.get('FormId');
-    this.users = this.aws.getlocale();
-    this.clientForms  = this.fb.group({
-      clientArray:this.fb.array([])
-    });
-    this.getClientDetails();
-    this.getdropdown();
-  }
-
-  ionViewDidLoad() {
-    console.log('ionViewDidLoad PdQuestionClientInfoPage');
-  }
-
-  createClientItem()
-  {
-    return this.fb.group(
-      {
-        client_name: [''],
-      contact_person: [''],
-      mobile_number: [''],
-      payment_mode: [''],
-      per_of_immediate_advance_payment:[''],
-      credit_period:[''],
-      frequency_of_purchase: [''],
-      freq_purchase_others_text_value: ['']
-      })
-  }
-  selectedPM(e) {
-    this.paymentModeTextBox = e.value;
-    // this.f.supplier_details.controls.get('payment_mode_value');
-  }
-  public freqPurchaseTextBox: number;
-  selectedFreqPurchase(e){
-     this.freqPurchaseTextBox = e.value;
-  }
-  getdropdown()
-  {
-    this.qustCat.getcommondrop('FREQUENCY').subscribe(
-      data => {
-        this.m_freqOfPurchase = data['records'].filter(data => data.isactive == 1);
-      },
-      error => {
-        // this.notifier.notify('warning', 'No Category Records Found.!');
-        // this.m_assets_type = "No Category Records Found.";
-      }
-    )
-    this.qustCat.getcommondrop('PAYMENTMODE').subscribe(
-      data => {
-        this.m_paymentModeType = data['records'].filter(data => data.isactive == 1);
-      },
-      error => {
-        // this.notifier.notify('warning', 'No Category Records Found.!');
-        // this.m_assets_type = "No Category Records Found.";
-      }
-    )
-  }
-  addClientDetails()
-  {
-    this.clientDataArray = this.clientForms.get('clientArray') as FormArray;
-    this.clientDataArray.push(this.createClientItem());
-  }
-  removeClientDetails(i)
-  {
-    
-    if(this.clientDataArray.length==1)
-    {
-      this.clientForms.controls['clientArray'].reset();
-    }else{
-    this.clientDataArray = this.clientForms.get('clientArray') as FormArray;    
-    this.clientDataArray.removeAt(i);
-  }
-  }
-
-  saveclientDetails(answerData)
-{
-  let records:any ={};
-
-        records.pdid = this.pdDetails.pd_id;
-        records.formid = this.FormId.form_id;
-        records.fk_createdby = this.users;
-        
-        records.client_details = answerData.clientArray;
-        console.log('data',records);    
-      this.qustCat.saveForm(records).subscribe(res=>
-        {
-          if(res['dataStatus']==true)
-      {
-        this.toast.pdTriggerappmessage('Record Saved Successfully.!');
-        this.navCtrl.pop();
-      }
-        });
-
-      
-}
-  getClientDetails()
-  {
-    let records = {'pd_id':this.pdDetails.pd_id,'pd_form_id':this.FormId.form_id}
-    let clientData:any = [];
-    this.qustCat.retiverForm(records).subscribe(
-      data => {
-          if(data['dataStatus']==true)
-          {
-            let clientDetails = data['records'];
-                console.log(clientDetails);
-                clientData = Object.keys(data['records'].client_details).map(function(key) {
-           
-            return clientDetails.client_details[key];
-        });
-        this.clientDataArray = this.clientForms.get('clientArray') as FormArray;
-          
-        if(clientData.length ==0)
-        {
-          
-          this.clientDataArray.push(this.createClientItem());          
-        }else
-        {
-         // console.log('else');
-          clientData.forEach(datas=>
-            {
-              this.clientDataArray.push(this.createClientItem());
-            })
-            
-        this.clientForms.controls['clientArray'].setValue(clientData);
-              this.apiLoadFinish = true;
-        }
-      }else{
-
-        this.addClientDetails();
-        this.apiLoadFinish = true;
-      }
-  }
-);
-  }
-}

src/pages/pd-question/pd-question-stock-info/pd-question-stock-info.html

@@ -1,137 +0,0 @@
-<ion-header>
-
-  <ion-navbar color="optblue">
-    <button ion-button menuToggle>
-      <ion-icon name="menu"></ion-icon>
-    </button>
-    <ion-title *ngIf="!viewchange">{{FormId.form_name}}</ion-title>
-
-
-  </ion-navbar>
-
-</ion-header>
-
-
-
-<ion-content padding>
-
-  
-    <form [formGroup]="stockForm" class="address">
-      
-       
-        <mat-card>
-            <mat-card-header>
-                <h3>Raw Materials</h3>
-            </mat-card-header>
-            <div formArrayName="raw_materials">
-                <div *ngFor="let details of stockForm.controls.raw_materials['controls']; let i=index;let last=last;"
-                     [formGroupName]="i">
-                    <mat-card-content class="matcard">
-                        <mat-form-field style="width:100%">
-                            <input matInput placeholder="Name" formControlName="raw_name">
-                        </mat-form-field>
-                        <mat-form-field style="width:100%">
-                                <mat-select placeholder="is the Stock is Observed ?"
-                                            formControlName="stock_observed"  required>
-                                    <mat-option value="yes" >Yes</mat-option>
-                                    <mat-option value="no" >No</mat-option>
-                                </mat-select>
-                            </mat-form-field>
-                            <div *ngIf="details.get('stock_observed').value == 'no'" >
-                            <mat-form-field style="width:100%">
-                                <input matInput placeholder="Estimated Quantity" formControlName="raw_quantity" required>
-                            </mat-form-field>
-                            <mat-form-field style="width:100%">
-                                <mat-select placeholder="Unit of Mearsurement"
-                                            formControlName="raw_uom"  required>
-                                    <mat-option value="{{uom.uom_id}}" *ngFor="let uom of uomData">{{uom.name}}</mat-option>
-                                </mat-select>
-                            </mat-form-field>
-                            <mat-form-field style="width:100%" *ngIf="details.get('raw_uom').value == 61" >
-                                <input matInput placeholder="Specify Other UOM" formControlName="other_uom" required>
-                            </mat-form-field>
-                            <mat-form-field style="width:100%">
-                                <input matInput placeholder="Value" formControlName="raw_value" (keypress)="keyPress($event)"  required>
-                            </mat-form-field>
-                            <mat-form-field style="width:100%">
-                                <input matInput placeholder="Value of raw materials as per latest financial Statements" formControlName="rawmaterial_value" (keypress)="keyPress($event)" required>
-                            </mat-form-field>
-                            <mat-form-field style="width:100%">
-                                <input matInput placeholder="Is the stock of raw materials observed ?" formControlName="is_sufficiant_raw"  required>
-                            </mat-form-field>
-                        </div>
-                        <ion-buttons end>
-                          <ion-col offset-3 col-3>
-                            <a (click)="addRawMaterials()" *ngIf="last">
-                            <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
-                            </ion-col>
-                            <ion-col offset-1 col-3>
-                            <a (click)="deleteRawMaterials(i)" >
-                                <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
-                              </ion-col>
-                          </ion-buttons>
-                    </mat-card-content>
-                </div>
-            </div>
-        </mat-card>
-        <br/>
-        <mat-card>
-            <mat-card-header>
-                <h3>Finished Goods</h3>
-            </mat-card-header>
-            <div formArrayName="finished_goods">
-                <div *ngFor="let details of stockForm.controls.finished_goods['controls']; let i=index;let last=last;"
-                     [formGroupName]="i">
-                    <mat-card-content class="matcard">
-                        <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Name" formControlName="goods_name">
-                        </mat-form-field>
-                        <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Quantity" formControlName="goods_quantity">
-                        </mat-form-field>
-                        <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Value" formControlName="goods_value">
-                        </mat-form-field>
-                        <mat-form-field style="width:100%">
-                            <input matInput placeholder="Value of finished goods as per financial statements" formControlName="finished_goods_value">
-                        </mat-form-field>
-                        <mat-form-field style="width:100%">
-                            <input matInput placeholder="Is the stock of finished goods sufficient ?" formControlName="is_sufficiant_goods">
-                        </mat-form-field>
-                          <ion-buttons end>
-                          <ion-col offset-3 col-3>
-                            <a (click)="addGoods()" *ngIf="last">
-                            <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
-                            </ion-col>
-                            <ion-col offset-1 col-3>
-                            <a (click)="deleteGoods(i)" >
-                                <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
-                              </ion-col>
-                          </ion-buttons>                        
-                    </mat-card-content>
-                </div>
-            </div>
-        </mat-card>
-        <br/>
-        <mat-card>
-        <div fxLayout="row">
-            <div fxFlex="60" class="pb-0 text-sm-left">
-                <mat-form-field appearance="outline" style="width: 100%">
-                    <mat-label>Remarks</mat-label>
-                    <textarea matInput placeholder="Remarks" formControlName="stock_remarks"></textarea>
-                </mat-form-field>
-            </div>
-        </div>
-      </mat-card>
-          <ion-row>
-            <!-- <ion-buttons >
-            <ion-button color="optblue" 
-            full[disabled]="!pdforms.valid" mat-raised-button style="width:100%" (click)="savepdDetails(pdforms.value)">Save <ion-icon name="md-disc"></ion-icon></ion-button> -->
-            <button ion-button full color="optblue" (click)="submitDetails(stockForm.value)" > Save</button>
-             <!-- </ion-buttons> -->
-           </ion-row>
-         
-    </form>
-    
-
-</ion-content>

src/pages/pd-question/pd-question-stock-info/pd-question-stock-info.scss

@@ -1,3 +0,0 @@
-page-pd-question-stock-info {
-
-}

src/pages/pd-question/pd-question-stock-info/pd-question-stock-info.ts

@@ -1,177 +0,0 @@
-import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
-import { QuestionCategoryProvider } from '../../../providers/question-category/question-category';
-import { AwsServiceProvider } from '../../../providers/aws-service/aws-service';
-import { ToastProvider } from '../../../providers/common-provider/toast';
-import { FormArray, FormGroup, FormBuilder } from '@angular/forms';
-
-/**
- * Generated class for the PdQuestionStockInfoPage page.
- *
- * See https://ionicframework.com/docs/components/#navigation for more info on
- * Ionic pages and navigation.
- */
-
-
-@Component({
-  selector: 'page-pd-question-stock-info',
-  templateUrl: 'pd-question-stock-info.html',
-})
-export class PdQuestionStockInfoPage {
-
-  uomData: any;
-  rawmaterial: any;
-  users: any;
-  FormId: any;
-  pdDetails: any;
-  stockForm: FormGroup;
-  constructor(public navCtrl: NavController, public navParams: NavParams, public qustCat: QuestionCategoryProvider, public aws: AwsServiceProvider, public toast: ToastProvider, public fb: FormBuilder) {
-    this.pdDetails = this.navParams.get('pdDetails');
-    this.FormId = this.navParams.get('FormId');
-    this.users = this.aws.getlocale();
-    this.stockForm = this.fb.group({
-      stock_remarks: [''],
-      raw_materials: this.fb.array([]),
-      finished_goods: this.fb.array([])
-    });
-    this.getStockDetails();
-
-    this.qustCat.retiverForm({pd_id:this.pdDetails.pd_id,pd_form_id:'1'}).subscribe(value => {
-      // console.log('Raw material Name',value.records.main_raw_materials);
-      
-      
-      // const faControl = (<FormArray>this.stockForm.controls['raw_materials']).at(1);
-      
-      const control = (<FormArray>this.stockForm.controls['raw_materials']).at(0);
-      console.log(control);
-      
-      // this.stockForm.controls['raw_materials'].setValue(value.records.main_raw_materials);
-      if (value['dataStatus'] == true) {
-      this.rawmaterial = value['records'].main_raw_materials;
-      }else{ this.rawmaterial = ''; }
-  })
-  this.getdropdown();
-  }
-
-
-  ionViewDidLoad() {
-    console.log('ionViewDidLoad PdQuestionStockInfoPage');
-  }
-
-
-  getdropdown()
-  {
-    this.qustCat.getcommondrop('UOM').subscribe(data => {
-            
-      if(data['dataStatus']==true){
-          
-              this.uomData = data['records'].filter(uom=>uom.isactive==1);
-          
-      }
-  });
-  }
-  createRawmaterial() {
-    return this.fb.group({
-      raw_name: [''],
-      stock_observed:[''],
-      raw_quantity: [''],
-      raw_uom: [''],
-      other_uom : [''],
-      raw_value: [''],
-      rawmaterial_value: [''],
-      is_sufficiant_raw: [''],
-    });
-  }
-  createGoods() {
-    return this.fb.group({
-      goods_name: [''],
-      goods_quantity: [''],
-      goods_value: [''],
-      finished_goods_value: [''],
-      is_sufficiant_goods: [''],
-    });
-  }
-  addRawMaterials() {
-    const control = <FormArray>this.stockForm.controls['raw_materials'];
-    control.push(this.createRawmaterial());
-  }
-  deleteRawMaterials(index) {
-    const control = <FormArray>this.stockForm.controls['raw_materials'];
-    if(control.length==1)
-    {
-      this.stockForm.controls['raw_materials'].reset();
-    }else{
-    control.removeAt(index);
-  }
-  }
-  addGoods() {
-    const control = <FormArray>this.stockForm.controls['finished_goods'];
-
-    control.push(this.createGoods());
-  }
-  deleteGoods(index) {
-    const control = <FormArray>this.stockForm.controls['finished_goods'];
-   if(control.length==1)
-    {
-      this.stockForm.controls['finished_goods'].reset();
-    }else{
-    control.removeAt(index);
-  }
-  }
-
-
-  submitDetails(answerData) {
-    
-    let records: any = {};
-    records.pdid = this.pdDetails.pd_id;
-    records.formid = this.FormId.form_id;
-    records.fk_createdby = this.users;
-    records.raw_materials = answerData.raw_materials;
-    records.stock_remarks = answerData.stock_remarks;
-    records.finished_goods = answerData.finished_goods;
-    console.log('data', records);
-    this.qustCat.saveForm(records).subscribe(data => {
-      this.navCtrl.pop();
-      this.toast.pdTriggerappmessage('Record Saved Successfully.!');
-    });
-  }
-  
-  getStockDetails() {
-    let records = { 'pd_id': this.pdDetails.pd_id, 'pd_form_id': this.FormId.form_id };
-
-    this.qustCat.retiverForm(records).subscribe(value => {
-      console.log('value', value);
-      const rawMaterial = <FormArray>this.stockForm.controls['raw_materials'];
-      const finishedGoods = <FormArray>this.stockForm.controls['finished_goods'];
-      if (value['dataStatus'] == true) {
-        let stockDetails = value['records'];
-        let result = Object.keys(stockDetails.raw_materials).map(function (key) {
-          return stockDetails.raw_materials[key];
-        });
-        let result_Goods = Object.keys(stockDetails.finished_goods).map(function (key) {
-          return stockDetails.finished_goods[key];
-        });
-        this.stockForm.controls['stock_remarks'].setValue(stockDetails.stock_remarks);
-        if (result.length > 0) {
-          result.forEach(val => {
-            rawMaterial.push(this.createRawmaterial());
-          });
-          this.stockForm.controls['raw_materials'].setValue(result);
-        } else {
-          rawMaterial.push(this.createRawmaterial());
-        }
-        if (result_Goods.length > 0) {
-          result_Goods.forEach(val => {
-            finishedGoods.push(this.createGoods());
-          });
-          this.stockForm.controls['finished_goods'].setValue(result_Goods);
-        } else {
-          finishedGoods.push(this.createGoods());
-        }
-      } else {
-      this.addRawMaterials();
-      this.addGoods();
-      }
-    })
-  }
-}

src/pages/pd-question/pd-question-supplier-info/pd-question-supplier-info.html

@@ -1,119 +0,0 @@
-<ion-header>
-
-  <ion-navbar color="optblue">
-    <button ion-button menuToggle>
-      <ion-icon name="menu"></ion-icon>
-    </button>
-    <ion-title *ngIf="!viewchange">Supplier Info Category</ion-title>
-
-
-  </ion-navbar>
-
-</ion-header>
-
-
-<ion-content padding>
-  <mat-card style="padding: 12px;">
-    <h3>Supplier Details</h3>
-    <form [formGroup]="supplierInfoForm">
-      <div fxLayout="row" fxLayoutAlign="start none">
-        <div class="example-full-width">
-          <mat-label>What are the main Raw materials?(MEG Only)</mat-label>
-          <mat-form-field style="width: 100%">
-            <textarea matInput placeholder="" formControlName="main_raw_materials"></textarea>
-            <mat-error *ngIf="submitted && f.main_raw_materials.hasError('required')" class="mat-text-warn">You must Include Raw Material Details.</mat-error>
-          </mat-form-field>
-        </div>
-      </div>
-      <div fxLayout="row" fxLayoutAlign="start none">
-        <div formArrayName="supplier_details" fxFill>
-          
-                <div *ngFor="let sup of supplierInfoForm.controls.supplier_details['controls']; let i=index;let last=last">
-                    <mat-card>
-                        <mat-card-content> 
-                  <div [formGroupName]="i">
-                      <div fxLayout="row wrap" fxLayoutGap="12px" fxLayoutAlign="start none">
-                        <div fxFlex="30">
-                          <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Supplier Name" formControlName="supplier_name">
-                            <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                          </mat-form-field>
-                        </div>
-                        <div fxFlex="30">
-                          <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Contact Person Name" formControlName="contact_person">
-                            <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                          </mat-form-field>
-                        </div>
-                        <div fxFlex="30">
-                          <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Contact Mobile Number" formControlName="mobile_number">
-                            <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                          </mat-form-field>
-                        </div>
-                      </div>
-                      <div fxLayout="row wrap" fxLayoutGap="14px" fxLayoutAlign="start none">
-                        <div fxFlex="30">
-                          <mat-form-field style="width: 100%">
-                            <mat-select (selectionChange)="selectedPM($event)" placeholder="Select Payment Mode" formControlName="payment_mode">
-                              <mat-option *ngFor="let pm of m_paymentModeType" [value]="pm.id">{{ pm.name }}</mat-option>
-                            </mat-select>
-                          </mat-form-field>
-                        </div>
-                        <div *ngIf="sup.get('payment_mode').value == 1 ||  sup.get('payment_mode').value == 3" fxFlex="30">
-                          <mat-label>% of immediate / Advance Payment Purchase to Total Purchase?</mat-label>
-                          <mat-form-field style="width: 100%" >
-                            <input matInput placeholder="" formControlName="per_of_immediate_advance_payment">
-                            <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                          </mat-form-field>
-                        </div>
-                        <div *ngIf="sup.get('payment_mode').value == 2  || sup.get('payment_mode').value == 3" fxFlex="30">
-                          <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Credit Period" formControlName="credit_period">
-                            <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                          </mat-form-field>
-                        </div>
-                      </div>
-                      <div fxLayout="row" fxLayoutGap="14px" fxLayoutAlign="start none">
-                        <div fxFlex="30">
-                          <mat-form-field style="width: 100%">
-                            <mat-select (selectionChange)="selectedFreqPurchase($event)" placeholder="Select Frequency of Purchase" formControlName="frequency_of_purchase">
-                              <mat-option *ngFor="let feq of m_freqOfPurchase" [value]="feq.id">{{ feq.name }}</mat-option>
-                            </mat-select>
-                          </mat-form-field>
-                        </div>
-                        <div *ngIf="sup.get('frequency_of_purchase').value == 8" fxFlex="30">
-                          <mat-form-field style="width: 100%">
-                            <input matInput placeholder="Others Details" formControlName="freq_purchase_others_text_value">
-                            <!--<mat-error *ngIf="submitted && f.supplier_name.hasError('required')" class="mat-text-warn">You must Include Supplier Name.</mat-error>-->
-                          </mat-form-field>
-                        </div>
-
-                        
-                        <ion-buttons end>
-                          <ion-col col-3>
-                            <a (click)="addSupplierDetails()" *ngIf="last">
-                            <ion-icon name="md-add" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
-                            </ion-col>
-                            <ion-col offset-3 col-3 *ngIf="!last">
-                            <a (click)="removeLanguage(i)">
-                                <ion-icon name="md-close" color="optblue"  style="font-size: 22px;"></ion-icon></a> 
-                              </ion-col>
-                          </ion-buttons>
-                      </div>
-                    </div>
-                 
-            </mat-card-content>
-          </mat-card>
-        </div>
-          
-        </div>
-      </div>
-      <ion-row>
-      
-        <button ion-button full color="optblue" (click)="saveSupplierInfo(supplierInfoForm.value)" > Save</button>
-         <!-- </ion-buttons> -->
-       </ion-row>
-    </form>
-  </mat-card>
-</ion-content>

src/pages/pd-question/pd-question-supplier-info/pd-question-supplier-info.scss

@@ -1,3 +0,0 @@
-page-pd-question-supplier-info {
-
-}

src/pages/pd-question/pd-question-supplier-info/pd-question-supplier-info.ts

@@ -1,194 +0,0 @@
-import { Component } from '@angular/core';
-import { IonicPage, NavController, NavParams } from 'ionic-angular';
-import { FormBuilder, FormGroup, FormArray } from '@angular/forms';
-import { AwsServiceProvider } from '../../../providers/aws-service/aws-service';
-import { QuestionCategoryProvider } from '../../../providers/question-category/question-category';
-import { PdQuestionCategoryPage } from '../../pd-question-category/pd-question-category';
-import { ToastProvider } from '../../../providers/common-provider/toast';
-
-/**
- * Generated class for the PdQuestionSupplierInfoPage page.
- *
- * See https://ionicframework.com/docs/components/#navigation for more info on
- * Ionic pages and navigation.
- */
-
-
-@Component({
-  selector: 'page-pd-question-supplier-info',
-  templateUrl: 'pd-question-supplier-info.html',
-})
-export class PdQuestionSupplierInfoPage {
-  users: any;
-  pdDetails: any;
-  questionDetails: any;
-  supplierInfoForm: FormGroup;
-  supplierDetails: any;
-  supplierArray:FormArray;
-  m_paymentModeType:any;
-
-  m_freqOfPurchase:any;
-  constructor(public navCtrl: NavController, public navParams: NavParams,public fb:FormBuilder,public aws:AwsServiceProvider,public qustCat:QuestionCategoryProvider,public toast:ToastProvider) {
-    this.questionDetails = this.navParams.get('questionDetails');
-    this.pdDetails = this.navParams.get('pdDetails');
-    this.users = this.aws.getlocale();
-
-    this.supplierInfoForm = this.fb.group({
-      
-      main_raw_materials: [null],
-      supplier_details: this.fb.array([])
-  });
-  this.getSupplierForm();
-    
-    this.getdropList();
-  }
-
-  ionViewDidLoad() {
-    console.log('ionViewDidLoad PdQuestionSupplierInfoPage');
-  }
-
-  getdropList()
-  {
-   this.m_paymentModeType =  [
-      {
-        'id': "1",
-        'name': 'Immediate Or Advanced Payment'
-      },
-      {
-        'id': "2",
-        'name': 'Credit'
-      },
-      {
-        'id': "3",
-        'name': 'Combination of Both'
-      },
-    ];
-    this.m_freqOfPurchase =  [
-      {
-        'id': "1",
-        'name': 'Daily'
-      },
-      {
-        'id': "2",
-        'name': 'Weekly'
-      },
-      {
-        'id': "3",
-        'name': 'Monthly'
-      },
-      {
-        'id': "4",
-        'name': 'Every 3 months'
-      },
-      {
-        'id': "5",
-        'name': 'Half yearly'
-      },
-      {
-        'id': "6",
-        'name': 'Yearly'
-      },
-      {
-        'id': "7",
-        'name': 'As and when required'
-      },
-      {
-        'id': "8",
-        'name': 'Others'
-      }
-    ];
-  }
-  public paymentModeTextBox: number;
-  selectedPM(e) {
-    this.paymentModeTextBox = e.value;
-    // this.f.supplier_details.controls.get('payment_mode_value');
-  }
- 
-  public freqPurchaseTextBox: number;
-  selectedFreqPurchase(e){
-     this.freqPurchaseTextBox = e.value;
-  }
-  initDetails() {
-    return this.fb.group({
-      supplier_name: [null],
-      contact_person: [null],
-      mobile_number: [null],
-      payment_mode: [null],
-      per_of_immediate_advance_payment:[null],
-      credit_period:[null],
-      frequency_of_purchase: [null],
-      freq_purchase_others_text_value: [null]
-    });
-  }
-
-  addSupplierDetails() {
-    this.supplierArray = this.supplierInfoForm.get('supplier_details') as FormArray;
-    // const control = ;
-    this.supplierArray.push(this.initDetails());
-  }
-
-  removeLanguage(i: number) {
-    this.supplierArray = this.supplierInfoForm.get('supplier_details') as FormArray;
-    
-    this.supplierArray.removeAt(i);
-  }
-
-saveSupplierInfo(answerData)
-{
-  let records:any ={};
-
-        records.pdid = this.pdDetails.pd_id;
-        records.formid = '338';
-        records.fk_createdby = this.users;
-        records.main_raw_materials = answerData.main_raw_materials;
-        records.supplier_details = answerData.supplier_details;
-        console.log('data',records);    
-      this.qustCat.saveForm(records).subscribe(res=>
-        {
-          if(res['dataStatus']==true)
-      {
-        this.toast.pdTriggerappmessage('Record Saved Successfully.!');
-        this.navCtrl.pop();
-      }
-        });
-
-      
-}
-
-getSupplierForm()
-{
-  let records = {'pd_id':this.pdDetails.pd_id,'pd_form_id':'338'};
-
-  this.qustCat.retiverForm(records).subscribe(res=>
-    {
-      if(res['dataStatus']==true)
-        {
-          this.supplierDetails  = res['records'];
-          var supplierArray = Object.keys(res['records'].supplier_details
-        ).map(function(key) {
-            //console.log(res);
-            return res['records'].supplier_details
-            [key];
-
-        });
-    this.supplierArray = this.supplierInfoForm.get('supplier_details') as FormArray;        
-        this.supplierInfoForm.controls['main_raw_materials'].setValue(this.supplierDetails.main_raw_materials);
-        if(supplierArray.length ==0)
-        {
-          
-          this.supplierArray.push(this.initDetails());          
-        }else
-        {
-          supplierArray.forEach(datas=>
-            {
-              this.supplierArray.push(this.initDetails());
-            })
-        }
-        this.supplierInfoForm.controls['supplier_details'].setValue(supplierArray);
-      }else{
-        this.addSupplierDetails();
-      }
-    })
-    
-}
-}

src/providers/question-category/question-category.ts

@@ -94,10 +94,19 @@ getAssetsWithLoanFromBusiness(pdid:any){
 }
 
 
-getTypeofActivityForSuppliedInfoForm(pd_id: any){
+getTypeofActivityForSuppliedInfoForm(pd_id: any,company_id:any){
-  return this.http.post<any>(this.apiurl+"getTypeOfActivetyFromBusinessForm", {"records": { "pd_id" : pd_id }});
+  return this.http.post<any>(this.apiurl+"getTypeOfActivetyFromBusinessForm", {"records": { "pd_id" : pd_id,"company_id":company_id }});
 }
 
+/** For Stock Details 
+ *  To Get The Products With TypeofActivity From Business  
+ **/
+stockFormAccess(pdid: any,companyid: any) {
+  //    { "pd_id":"104","company_id":"1"}
+  return this.http.post<any>(this.apiurl + "getProductsFromBusiness", {"pd_id" : pdid ,"company_id":companyid });
+}
+
+
 
 /*****Save Images */
 savePDImages(imagesDetails)