From 507cc1c2fd2b33a2964928aeca579f90702a3767 Mon Sep 17 00:00:00 2001
From: Akisha <akisha@piccosoft.com>
Date: Wed, 7 Nov 2018 18:53:23 +0530
Subject: [PATCH 1/2] address form family details form and banking details

---
 .../list-pd/start-pd/start-pd.component.html  | 1181 ++++++++++------
 .../list-pd/start-pd/start-pd.component.scss  |   31 +
 .../list-pd/start-pd/start-pd.component.ts    | 1187 +++++++++++------
 .../manage-pd/manage-pd.module.ts             |  241 ++--
 .../pd-service/pd-triger.service.ts           |  387 +++---
 5 files changed, 1944 insertions(+), 1083 deletions(-)

diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.html b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.html
index 1d7761abf..0c1e6db93 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.html
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.html
@@ -1,409 +1,838 @@
 <mat-card style="min-height:540px;">
     <mat-card-content>
         <mat-sidenav-container class="app-inner background-none shadow-none mail-db">
-            <mat-sidenav #mailnav [mode]="isOver() ? 'over' : 'side'" [opened]="!isOver()" class="mail-sidebar pl-xs pr-xs">
-                  <button _ngcontent-c21="" [disabled]="currentPDStatus !=pdStatusCheck.INPROGRESS || actualQuestions!=answeredQuestions" class="compose-btn mat-warn mat-raised-button mb-1" (click)="changePDStatus(pdStatusCheck.COMPLETED);"> <span>{{currentPDStatus==pdStatusCheck.INPROGRESS ? 'COMPLETE':(currentPDStatus==pdStatusCheck.QC_COMPLETED ? 'QC COMPLETED' : currentPDStatus ) }}</span></button>
- 
-                  <!-- {{ (currentPDStatus==pdStatusCheck.INPROGRESS)? 'COMPLETE':(currentPDStatus) }} -->
-                          <mat-expansion-panel *ngFor="let category of categoryList;let catIndex = index; ">
-                              <mat-expansion-panel-header>
-                                <mat-panel-title class="text-xs-left">
-                                 <span class="mt-0"> {{category.category_name}}</span>
-                                </mat-panel-title>
-                              
-                              </mat-expansion-panel-header>
-                          
-                              <mat-list>
-                                  <mat-list-item class="custm-list-item" *ngFor="let questions of category.questions; let quesIndex=index" [ngStyle]="{'color':quesIndex === selectedQuestionIndex &&  catIndex === selectedCategoryIndex ? 'red' : 'black' }" (click)="OnSelectDirectQuestions(questions, catIndex,quesIndex)">
-                                      <small>{{ (questions.question.length>15)? (questions.question | slice:0:15)+'..':(questions.question) }}</small>
-                                  </mat-list-item>
-                                 
-                                 
-                                 </mat-list>
-                            </mat-expansion-panel>
+            <mat-sidenav #mailnav [mode]="isOver() ? 'over' : 'side'" [opened]="!isOver()"
+                         class="mail-sidebar pl-xs pr-xs">
+                <button _ngcontent-c21=""
+                        [disabled]="currentPDStatus !=pdStatusCheck.INPROGRESS || actualQuestions!=answeredQuestions"
+                        class="compose-btn mat-warn mat-raised-button mb-1"
+                        (click)="changePDStatus(pdStatusCheck.COMPLETED);"><span>{{currentPDStatus==pdStatusCheck.INPROGRESS ? 'COMPLETE':(currentPDStatus==pdStatusCheck.QC_COMPLETED ? 'QC COMPLETED' : currentPDStatus ) }}</span>
+                </button>
+
+                <!-- {{ (currentPDStatus==pdStatusCheck.INPROGRESS)? 'COMPLETE':(currentPDStatus) }} -->
+                <mat-expansion-panel *ngFor="let category of categoryList;let catIndex = index; ">
+                    <mat-expansion-panel-header>
+                        <mat-panel-title class="text-xs-left">
+                            <span class="mt-0"> {{category.category_name}}</span>
+                        </mat-panel-title>
+
+                    </mat-expansion-panel-header>
+
+                    <mat-list>
+                        <mat-list-item class="custm-list-item"
+                                       *ngFor="let questions of category.questions; let quesIndex=index"
+                                       [ngStyle]="{'color':quesIndex === selectedQuestionIndex &&  catIndex === selectedCategoryIndex ? 'red' : 'black' }"
+                                       (click)="OnSelectDirectQuestions(questions, catIndex,quesIndex)">
+                            <small>{{ (questions.question.length>15)? (questions.question |
+                                slice:0:15)+'..':(questions.question) }}
+                            </small>
+                        </mat-list-item>
+
+
+                    </mat-list>
+                </mat-expansion-panel>
+
+                <mat-list *ngFor="let formButton of categoryFormButtons">
+                    <mat-list-item class="custm-list-item" (click)="OnSelectDirectForms(formButton)">
+                        <span class="mt-0">{{ (formButton.form_name.length>15)? (formButton.form_name | slice:0:15)+'..':(formButton.form_name) }}</span>
+                    </mat-list-item>
+
+
+                </mat-list>
 
-                            <mat-list *ngFor="let formButton of categoryFormButtons">
-                                <mat-list-item class="custm-list-item" (click)="OnSelectDirectForms(formButton)">
-                                        <span class="mt-0">{{ (formButton.form_name.length>15)? (formButton.form_name | slice:0:15)+'..':(formButton.form_name) }}</span>
-                                </mat-list-item>
-                               
-                               
-                               </mat-list>
-                   
             </mat-sidenav>
             <mat-toolbar color="primary" fxHide="false" fxHide.gt-sm>
-               <button (click)="mailnav.toggle()" mat-icon-button>
-                  <mat-icon style="color: white;">short_text</mat-icon>
-               </button>
-               <span class="mr-1 ml-1">Category</span>
+                <button (click)="mailnav.toggle()" mat-icon-button>
+                    <mat-icon style="color: white;">short_text</mat-icon>
+                </button>
+                <span class="mr-1 ml-1">Category</span>
             </mat-toolbar>
             <div class="main-content" fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="100" fxFlex.lg="100" fxFlex.xl="100">
-               <figure>
-                     <mat-card-content>
-                           
-                        <div fxLayout="row" >
-                              <button mat-raised-button mat-icon-button class="hover-icon start_close_btn" type="button" matTooltip="Close" matTooltipPosition="above"
-                          (click)="loadPdViewCompoent()"><mat-icon>close</mat-icon></button>
-                           <div fxFlex="33" class="text-xs-left">
-                              <h4 class="mt-0">{{mainApplicantName}}</h4>
-                              <small>{{pdMasterList.customer_segment_name}}</small>
-                           </div>
-                           <div fxFlex="66" class="text-xs-right">
-                              <h4 class="mt-0">{{pdMasterList.product_name}}/{{pdMasterList.subproduct_name}}</h4>
-                              <small>{{pdMasterList.lender_full_name}}/{{pdMasterList.lender_applicant_id}}</small>
-                              
-                           </div>
-          
+                <figure>
+                    <mat-card-content>
+
+                        <div fxLayout="row">
+                            <button mat-raised-button mat-icon-button class="hover-icon start_close_btn" type="button"
+                                    matTooltip="Close" matTooltipPosition="above"
+                                    (click)="loadPdViewCompoent()">
+                                <mat-icon>close</mat-icon>
+                            </button>
+                            <div fxFlex="33" class="text-xs-left">
+                                <h4 class="mt-0">{{mainApplicantName}}</h4>
+                                <small>{{pdMasterList.customer_segment_name}}</small>
+                            </div>
+                            <div fxFlex="66" class="text-xs-right">
+                                <h4 class="mt-0">{{pdMasterList.product_name}}/{{pdMasterList.subproduct_name}}</h4>
+                                <small>{{pdMasterList.lender_full_name}}/{{pdMasterList.lender_applicant_id}}</small>
+
+                            </div>
+
                         </div>
-                     </mat-card-content>
-                     <hr>
-                     <div *ngIf="!formsCategoryEnable">
-                     <mat-card-content style="min-height: 240px;" *ngIf="selectedCategory.length==0">
-                        <!-- <h6 class="mt-0">About</h6> -->
-                        <p>No Records Found..</p>
-                     </mat-card-content>
-                              
-                     <!-- check type of questions -->
-                        
-                          <ng-container [ngSwitch]="selectedCategory.fk_question_answertype">
-                          <!-- start options type questions section -->
-                              <ng-container  *ngSwitchCase="1">
-                  
-                                  
-                                  <form [formGroup]="optionsForm" *ngIf="answerList.length>0 ; else noanswers;"> 
-                                  <mat-card-content>
-                                       
-                                          <span class="mt-0">{{optionsForm.controls.pd_question.value}}</span>
-                                          <div fxLayout="row" >
-                                              <div fxFlex="60" class="text-xs-left">
-              
-                                                      <mat-list>
-                                                          
-                                                              <mat-radio-group formControlName="modelValue">
-                                                                  
-                                                                      <mat-list-item *ngFor="let option of optionsForm.controls.items.value">
-                                                                              <mat-radio-button [value]="option.pd_answer_id">{{option.pd_answer}}</mat-radio-button>
-  
-                                                                      </mat-list-item>
-                                         
-                                                              </mat-radio-group>
-                                                              
-                                                            </mat-list>   
-                                                                                                               
-                                              </div>
-                                              <div fxFlex="40" class="text-xs-right" *ngIf="optionsForm.controls.documents.length>0">
-                                  
-                                                  <mat-card >
+                    </mat-card-content>
+                    <hr>
+                    <div *ngIf="!formsCategoryEnable">
+                        <mat-card-content style="min-height: 240px;" *ngIf="selectedCategory.length==0">
+                            <!-- <h6 class="mt-0">About</h6> -->
+                            <p>No Records Found..</p>
+                        </mat-card-content>
+
+                        <!-- check type of questions -->
+
+                        <ng-container [ngSwitch]="selectedCategory.fk_question_answertype">
+                            <!-- start options type questions section -->
+                            <ng-container *ngSwitchCase="1">
+
+
+                                <form [formGroup]="optionsForm" *ngIf="answerList.length>0 ; else noanswers;">
+                                    <mat-card-content>
+
+                                        <span class="mt-0">{{optionsForm.controls.pd_question.value}}</span>
+                                        <div fxLayout="row">
+                                            <div fxFlex="60" class="text-xs-left">
+
+                                                <mat-list>
+
+                                                    <mat-radio-group formControlName="modelValue">
+
+                                                        <mat-list-item
+                                                                *ngFor="let option of optionsForm.controls.items.value">
+                                                            <mat-radio-button [value]="option.pd_answer_id">
+                                                                {{option.pd_answer}}
+                                                            </mat-radio-button>
+
+                                                        </mat-list-item>
+
+                                                    </mat-radio-group>
+
+                                                </mat-list>
+
+                                            </div>
+                                            <div fxFlex="40" class="text-xs-right"
+                                                 *ngIf="optionsForm.controls.documents.length>0">
+
+                                                <mat-card>
                                                     <mat-card-content style="display: flex;
                                                     overflow: auto;min-height: 200px; max-height: 240px;">
-                                                    <div fxLayout="row wrap">
-                                                        <div fxFlex="50" class="m-gap p-gap" *ngFor="let docs of optionsForm.controls.documents.value; let docIndex=index">
-                                                            <div class="p-list-main mb-2">
-                                                                <div class="p-list">
-                                                          
-                                                                    <div class="top"><img [src]="docs.pd_document_url" alt=""/></div>
-                                                                     <div class="bottom">
-                                                                          <div class="left">
-                                                                                  <div class="details">
-                                                                                      <small>{{docs.pd_document_title}}</small>
-                                                                                      <!-- <p>{{docs.pd_document_name}}</p> -->
-                                                                                  </div>
-                                                                                  <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
-                                                                              </div>
-                                                                      </div> 
+                                                        <div fxLayout="row wrap">
+                                                            <div fxFlex="50" class="m-gap p-gap"
+                                                                 *ngFor="let docs of optionsForm.controls.documents.value; let docIndex=index">
+                                                                <div class="p-list-main mb-2">
+                                                                    <div class="p-list">
+
+                                                                        <div class="top"><img
+                                                                                [src]="docs.pd_document_url" alt=""/>
+                                                                        </div>
+                                                                        <div class="bottom">
+                                                                            <div class="left">
+                                                                                <div class="details">
+                                                                                    <small>{{docs.pd_document_title}}
+                                                                                    </small>
+                                                                                    <!-- <p>{{docs.pd_document_name}}</p> -->
+                                                                                </div>
+                                                                                <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
                                                                 </div>
                                                             </div>
+
                                                         </div>
-                                                       
-                                                    </div>
-                                                  </mat-card-content>
-                                                      
-                                                   </mat-card>
-                                              </div>
-                             
-                                           </div>
-                                          
-                                       </mat-card-content>
-                                       <mat-card-actions>
-                                          <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="pd_answer_remark"></textarea>
-                    
-                                                    </mat-form-field>
-                                                </div>
-                                                <!-- this section for questions type options button actions -->
-                                                <div fxFlex="40" class="pb-0 text-sm-right">
-                                                        <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
-                                                                <mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" (click)="saveNextPrevious(optionsForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
-                                                                <mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
-                                                                <mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
-                                                                <mat-button-toggle value="bold" matTooltip="Save&Next"  (click)="saveNextPrevious(optionsForm.controls,next)" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
-                                                              </mat-button-toggle-group>
-                            
-                                                  </div>
-                                                  <!-- end questions type options -->
-                                                </div>
-                                          
-                                       </mat-card-actions> 
-                                  </form>  
-                                  
-                                  <ng-template #noanswers>
-                                          <mat-card-content>
-                                                  <span class="mt-0">{{selectedCategory.question}}</span>
-  
-                                          </mat-card-content>
-                                          <mat-card-actions>
-                                                  <div fxLayout="row" >
-                                                     
-                                                        <div fxFlex="100" class="pb-0 text-sm-right">
-                                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
-                                                                        <mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
-                                                                        <mat-button-toggle value="bold" matTooltip="Skip&Next"  (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
-                                                                      </mat-button-toggle-group>
-                                    
-                                                          </div>
-                                                        </div>
-                                                  
-                                               </mat-card-actions> 
-                                         </ng-template>
-                                  
-                                   
-                          </ng-container>
-                          <!-- end options type questions section -->
-                          <!-- start text box questions section -->
-                          <ng-container  *ngSwitchCase="2"> 
-                                 
-                                  <form [formGroup]="textBoxForm" *ngIf="answerList.length>0 ; else noanswers;"> 
-                                  <mat-card-content>
-                                          <span class="mt-0">{{textBoxForm.controls.pd_question.value}}</span>
-                                          <div fxLayout="row" >
-                                              <div fxFlex="60" class="text-xs-left">
-                                                     
-                                                              <mat-list [formArrayName]="'items'" style="padding-top:10%">
-                                                                      <mat-list-item *ngFor="let control of textBoxForm.controls.items.controls; let i = index;" [formGroup]="control">
-                                                          
-                                                                              <mat-form-field appearance="outline" style="width: 100%">
-                                                                                      <mat-label>Answers</mat-label>
-                                                                                      <textarea matInput placeholder="Answers" formControlName="pd_answer"></textarea>
-                                                    
-                                                                                    </mat-form-field>                                                                       
-                                                                          </mat-list-item>
-                                                                          
-                                                              </mat-list>                                          
-                                              </div>
-                                              <div fxFlex="40" class="text-xs-right" *ngIf="textBoxForm.controls.documents.length>0">
-                                  
-                                                  <mat-card >
+                                                    </mat-card-content>
+
+                                                </mat-card>
+                                            </div>
+
+                                        </div>
+
+                                    </mat-card-content>
+                                    <mat-card-actions>
+                                        <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="pd_answer_remark"></textarea>
+
+                                                </mat-form-field>
+                                            </div>
+                                            <!-- this section for questions type options button actions -->
+                                            <div fxFlex="40" class="pb-0 text-sm-right">
+                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
+                                                    <mat-button-toggle value="bold" matTooltip="Save&Previous"
+                                                                       *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED"
+                                                                       (click)="saveNextPrevious(optionsForm.controls,previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>skip_previous</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Previous"
+                                                                       (click)="skipNextPrevious(previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_left</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Next"
+                                                                       (click)="skipNextPrevious(next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_right</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Save&Next"
+                                                                       (click)="saveNextPrevious(optionsForm.controls,next)"
+                                                                       *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>skip_next</mat-icon>
+                                                    </mat-button-toggle>
+                                                </mat-button-toggle-group>
+
+                                            </div>
+                                            <!-- end questions type options -->
+                                        </div>
+
+                                    </mat-card-actions>
+                                </form>
+
+                                <ng-template #noanswers>
+                                    <mat-card-content>
+                                        <span class="mt-0">{{selectedCategory.question}}</span>
+
+                                    </mat-card-content>
+                                    <mat-card-actions>
+                                        <div fxLayout="row">
+
+                                            <div fxFlex="100" class="pb-0 text-sm-right">
+                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Previous"
+                                                                       (click)="skipNextPrevious(previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_left</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Next"
+                                                                       (click)="skipNextPrevious(next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_right</mat-icon>
+                                                    </mat-button-toggle>
+                                                </mat-button-toggle-group>
+
+                                            </div>
+                                        </div>
+
+                                    </mat-card-actions>
+                                </ng-template>
+
+
+                            </ng-container>
+                            <!-- end options type questions section -->
+                            <!-- start text box questions section -->
+                            <ng-container *ngSwitchCase="2">
+
+                                <form [formGroup]="textBoxForm" *ngIf="answerList.length>0 ; else noanswers;">
+                                    <mat-card-content>
+                                        <span class="mt-0">{{textBoxForm.controls.pd_question.value}}</span>
+                                        <div fxLayout="row">
+                                            <div fxFlex="60" class="text-xs-left">
+
+                                                <mat-list [formArrayName]="'items'" style="padding-top:10%">
+                                                    <mat-list-item
+                                                            *ngFor="let control of textBoxForm.controls.items.controls; let i = index;"
+                                                            [formGroup]="control">
+
+                                                        <mat-form-field appearance="outline" style="width: 100%">
+                                                            <mat-label>Answers</mat-label>
+                                                            <textarea matInput placeholder="Answers"
+                                                                      formControlName="pd_answer"></textarea>
+
+                                                        </mat-form-field>
+                                                    </mat-list-item>
+
+                                                </mat-list>
+                                            </div>
+                                            <div fxFlex="40" class="text-xs-right"
+                                                 *ngIf="textBoxForm.controls.documents.length>0">
+
+                                                <mat-card>
                                                     <mat-card-content style="display: flex;
                                                     overflow: auto;min-height: 200px; max-height: 240px;">
-                                                    <div fxLayout="row wrap">
-                                                        
-                                                          <div fxFlex="50" class="m-gap p-gap" *ngFor="let docs of textBoxForm.controls.documents.value; let docIndex=index">
-                                                                  <div class="p-list-main mb-2">
-                                                                      <div class="p-list">
-                                                                
-                                                                          <div class="top"><img [src]="docs.pd_document_url" alt=""/></div>
-                                                                           <div class="bottom">
-                                                                                <div class="left">
-                                                                                        <div class="details">
-                                                                                            <small>{{docs.pd_document_title}}</small>
-                                                                                            <!-- <p>{{docs.pd_document_name}}</p> -->
-                                                                                        </div>
-                                                                                        <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
-                                                                                    </div>
-                                                                            </div> 
-                                                                      </div>
-                                                                  </div>
-                                                              </div>
-                                    
-                                                    </div>
-                                                  </mat-card-content>
-                                                      
-                                                   </mat-card>
-                                              </div>
-                             
-                                           </div>
-                                          
-                                       </mat-card-content>
-                                       <mat-card-actions>
-                                          <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="pd_answer_remark"></textarea>
-                    
-                                                    </mat-form-field>
-                                                </div>
-                                                <!-- this section for questions type options button actions -->
-                                                <div fxFlex="40" class="pb-0 text-sm-right">
-                                                        <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
-                                                              <mat-button-toggle value="bold" matTooltip="Save&Previous" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" (click)="saveNextPreviousText(textBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
-                                                              <mat-button-toggle value="bold" matTooltip="Skip&Previous" matTooltipPosition="below" (click)="skipNextPrevious(previous)"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
-                                                              <mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
-                                                              <mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPreviousText(textBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
-                                                              </mat-button-toggle-group>
-                            
-                                                  </div>
-                                                  <!-- end questions type options -->
-                                                </div>
-                                          
-                                       </mat-card-actions> 
-                                  </form>   
-                                  <ng-template #noanswers>
-                                          <mat-card-content>
-                                                  <span class="mt-0">{{selectedCategory.question}}</span>
-  
-                                          </mat-card-content>
-                                          <mat-card-actions>
-                                                  <div fxLayout="row" >
-                                                     
-                                                        <div fxFlex="100" class="pb-0 text-sm-right">
-                                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
-                                                                        <mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
-                                                                        <mat-button-toggle value="bold" matTooltip="Skip&Next"  (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
-                                                                      </mat-button-toggle-group>
-                                    
-                                                          </div>
+                                                        <div fxLayout="row wrap">
+
+                                                            <div fxFlex="50" class="m-gap p-gap"
+                                                                 *ngFor="let docs of textBoxForm.controls.documents.value; let docIndex=index">
+                                                                <div class="p-list-main mb-2">
+                                                                    <div class="p-list">
+
+                                                                        <div class="top"><img
+                                                                                [src]="docs.pd_document_url" alt=""/>
+                                                                        </div>
+                                                                        <div class="bottom">
+                                                                            <div class="left">
+                                                                                <div class="details">
+                                                                                    <small>{{docs.pd_document_title}}
+                                                                                    </small>
+                                                                                    <!-- <p>{{docs.pd_document_name}}</p> -->
+                                                                                </div>
+                                                                                <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+
                                                         </div>
-                                                  
-                                               </mat-card-actions> 
-                                         </ng-template>     
-                          </ng-container>
-                          <!-- end text box questions section -->
-                          <!-- start check box questions section -->
-                          <ng-container  *ngSwitchCase="3"> 
-                                 
-                                  <form [formGroup]="checkBoxForm" *ngIf="answerList.length>0 ; else noanswers;"> 
-                                  <mat-card-content>
-                                          <span class="mt-0">{{checkBoxForm.controls.pd_question.value}}</span>
-                                          <div fxLayout="row" >
-                                              <div fxFlex="60" class="text-xs-left">
-                                                     
-                                                              <mat-list [formArrayName]="'items'">
-                                                                      <mat-list-item *ngFor="let control of checkBoxForm.controls.items.controls; let i = index;" [formGroup]="control">
-                                                          
-                                                                              <small><mat-checkbox class="example-margin" formControlName="checkbox" id="{{ control.controls.pd_answer_id.value }}"> {{ control.controls.pd_answer.value }}</mat-checkbox> </small>
-                                                                         
-                                                                          </mat-list-item>
-                                                                          
-                                                              </mat-list>                                          
-                                              </div>
-                                              <div fxFlex="40" class="text-xs-right" *ngIf="checkBoxForm.controls.documents.length>0">
-                                  
-                                                  <mat-card >
+                                                    </mat-card-content>
+
+                                                </mat-card>
+                                            </div>
+
+                                        </div>
+
+                                    </mat-card-content>
+                                    <mat-card-actions>
+                                        <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="pd_answer_remark"></textarea>
+
+                                                </mat-form-field>
+                                            </div>
+                                            <!-- this section for questions type options button actions -->
+                                            <div fxFlex="40" class="pb-0 text-sm-right">
+                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
+                                                    <mat-button-toggle value="bold" matTooltip="Save&Previous"
+                                                                       *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED"
+                                                                       (click)="saveNextPreviousText(textBoxForm.controls,previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>skip_previous</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Previous"
+                                                                       matTooltipPosition="below"
+                                                                       (click)="skipNextPrevious(previous)">
+                                                        <mat-icon>chevron_left</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Next"
+                                                                       (click)="skipNextPrevious(next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_right</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold"
+                                                                       *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED"
+                                                                       matTooltip="Save&Next"
+                                                                       (click)="saveNextPreviousText(textBoxForm.controls,next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>skip_next</mat-icon>
+                                                    </mat-button-toggle>
+                                                </mat-button-toggle-group>
+
+                                            </div>
+                                            <!-- end questions type options -->
+                                        </div>
+
+                                    </mat-card-actions>
+                                </form>
+                                <ng-template #noanswers>
+                                    <mat-card-content>
+                                        <span class="mt-0">{{selectedCategory.question}}</span>
+
+                                    </mat-card-content>
+                                    <mat-card-actions>
+                                        <div fxLayout="row">
+
+                                            <div fxFlex="100" class="pb-0 text-sm-right">
+                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Previous"
+                                                                       (click)="skipNextPrevious(previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_left</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Next"
+                                                                       (click)="skipNextPrevious(next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_right</mat-icon>
+                                                    </mat-button-toggle>
+                                                </mat-button-toggle-group>
+
+                                            </div>
+                                        </div>
+
+                                    </mat-card-actions>
+                                </ng-template>
+                            </ng-container>
+                            <!-- end text box questions section -->
+                            <!-- start check box questions section -->
+                            <ng-container *ngSwitchCase="3">
+
+                                <form [formGroup]="checkBoxForm" *ngIf="answerList.length>0 ; else noanswers;">
+                                    <mat-card-content>
+                                        <span class="mt-0">{{checkBoxForm.controls.pd_question.value}}</span>
+                                        <div fxLayout="row">
+                                            <div fxFlex="60" class="text-xs-left">
+
+                                                <mat-list [formArrayName]="'items'">
+                                                    <mat-list-item
+                                                            *ngFor="let control of checkBoxForm.controls.items.controls; let i = index;"
+                                                            [formGroup]="control">
+
+                                                        <small>
+                                                            <mat-checkbox class="example-margin"
+                                                                          formControlName="checkbox"
+                                                                          id="{{ control.controls.pd_answer_id.value }}">
+                                                                {{ control.controls.pd_answer.value }}
+                                                            </mat-checkbox>
+                                                        </small>
+
+                                                    </mat-list-item>
+
+                                                </mat-list>
+                                            </div>
+                                            <div fxFlex="40" class="text-xs-right"
+                                                 *ngIf="checkBoxForm.controls.documents.length>0">
+
+                                                <mat-card>
                                                     <mat-card-content style="display: flex;
                                                     overflow: auto;min-height: 200px; max-height: 240px;">
-                                                    <div fxLayout="row wrap">
-                                                          <div fxFlex="50" class="m-gap p-gap" *ngFor="let docs of textBoxForm.controls.documents.value; let docIndex=index">
-                                                                  <div class="p-list-main mb-2">
-                                                                      <div class="p-list">
-                                                                
-                                                                          <div class="top"><img [src]="docs.pd_document_url" alt=""/></div>
-                                                                           <div class="bottom">
-                                                                                <div class="left">
-                                                                                        <div class="details">
-                                                                                            <small>{{docs.pd_document_title}}</small>
-                                                                                            <!-- <p>{{docs.pd_document_name}}</p> -->
-                                                                                        </div>
-                                                                                        <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
-                                                                                    </div>
-                                                                            </div> 
-                                                                      </div>
-                                                                  </div>
-                                                              </div>
-                                    
-                                                    </div>
-                                                  </mat-card-content>
-                                                      
-                                                   </mat-card>
-                                              </div>
-                             
-                                           </div>
-                                          
-                                       </mat-card-content>
-                                       <mat-card-actions *ngIf="checkBoxForm.controls.items.length > 0">
-                                          <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="pd_answer_remark"></textarea>
-                    
-                                                    </mat-form-field>
-                                                </div>
-                                                <!-- this section for questions type options button actions -->
-                                                <div fxFlex="40" class="pb-0 text-sm-right">
-                                                        <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
-                                                              <mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Previous" (click)="saveNextPrevious(checkBoxForm.controls,previous)" matTooltip="Save&Previous" (click)="saveNextPrevious(checkBoxForm.controls,previous)" matTooltipPosition="below"><mat-icon>skip_previous</mat-icon></mat-button-toggle>
-                                                              <mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
-                                                              <mat-button-toggle value="bold" matTooltip="Skip&Next" (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
-                                                              <mat-button-toggle value="bold" *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED" matTooltip="Save&Next" (click)="saveNextPrevious(checkBoxForm.controls,next)" matTooltipPosition="below"><mat-icon>skip_next</mat-icon></mat-button-toggle>
-                                                              </mat-button-toggle-group>
-                            
-                                                  </div>
-                                                  <!-- end questions type options -->
-                                                </div>
-                                          
-                                       </mat-card-actions> 
-                                  </form> 
-                                  <ng-template #noanswers>
-                                          <mat-card-content> 
-                                                  <span class="mt-0">{{selectedCategory.question}}</span>
-  
-                                          </mat-card-content>
-                                          <mat-card-actions>
-                                                  <div fxLayout="row" >
-                                                     
-                                                        <div fxFlex="100" class="pb-0 text-sm-right">
-                                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
-                                                                        <mat-button-toggle value="bold" matTooltip="Skip&Previous" (click)="skipNextPrevious(previous)" matTooltipPosition="below"><mat-icon>chevron_left</mat-icon></mat-button-toggle>
-                                                                        <mat-button-toggle value="bold" matTooltip="Skip&Next"  (click)="skipNextPrevious(next)" matTooltipPosition="below"><mat-icon>chevron_right</mat-icon></mat-button-toggle>
-                                                                      </mat-button-toggle-group>
-                                    
-                                                          </div>
+                                                        <div fxLayout="row wrap">
+                                                            <div fxFlex="50" class="m-gap p-gap"
+                                                                 *ngFor="let docs of textBoxForm.controls.documents.value; let docIndex=index">
+                                                                <div class="p-list-main mb-2">
+                                                                    <div class="p-list">
+
+                                                                        <div class="top"><img
+                                                                                [src]="docs.pd_document_url" alt=""/>
+                                                                        </div>
+                                                                        <div class="bottom">
+                                                                            <div class="left">
+                                                                                <div class="details">
+                                                                                    <small>{{docs.pd_document_title}}
+                                                                                    </small>
+                                                                                    <!-- <p>{{docs.pd_document_name}}</p> -->
+                                                                                </div>
+                                                                                <!-- <div class="buy"><i class="material-icons">add_shopping_cart</i></div> -->
+                                                                            </div>
+                                                                        </div>
+                                                                    </div>
+                                                                </div>
+                                                            </div>
+
                                                         </div>
-                                                  
-                                               </mat-card-actions> 
-                                         </ng-template>         
-                          </ng-container>
-                      
-                       </ng-container>
+                                                    </mat-card-content>
+
+                                                </mat-card>
+                                            </div>
+
+                                        </div>
+
+                                    </mat-card-content>
+                                    <mat-card-actions *ngIf="checkBoxForm.controls.items.length > 0">
+                                        <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="pd_answer_remark"></textarea>
+
+                                                </mat-form-field>
+                                            </div>
+                                            <!-- this section for questions type options button actions -->
+                                            <div fxFlex="40" class="pb-0 text-sm-right">
+                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
+                                                    <mat-button-toggle value="bold"
+                                                                       *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED"
+                                                                       matTooltip="Save&Previous"
+                                                                       (click)="saveNextPrevious(checkBoxForm.controls,previous)"
+                                                                       matTooltip="Save&Previous"
+                                                                       (click)="saveNextPrevious(checkBoxForm.controls,previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>skip_previous</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Previous"
+                                                                       (click)="skipNextPrevious(previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_left</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Next"
+                                                                       (click)="skipNextPrevious(next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_right</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold"
+                                                                       *ngIf="currentPDStatus !=pdStatusCheck.COMPLETED && currentPDStatus !=pdStatusCheck.QC_COMPLETED"
+                                                                       matTooltip="Save&Next"
+                                                                       (click)="saveNextPrevious(checkBoxForm.controls,next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>skip_next</mat-icon>
+                                                    </mat-button-toggle>
+                                                </mat-button-toggle-group>
+
+                                            </div>
+                                            <!-- end questions type options -->
+                                        </div>
+
+                                    </mat-card-actions>
+                                </form>
+                                <ng-template #noanswers>
+                                    <mat-card-content>
+                                        <span class="mt-0">{{selectedCategory.question}}</span>
+
+                                    </mat-card-content>
+                                    <mat-card-actions>
+                                        <div fxLayout="row">
+
+                                            <div fxFlex="100" class="pb-0 text-sm-right">
+                                                <mat-button-toggle-group name="fontStyle" aria-label="Font Style">
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Previous"
+                                                                       (click)="skipNextPrevious(previous)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_left</mat-icon>
+                                                    </mat-button-toggle>
+                                                    <mat-button-toggle value="bold" matTooltip="Skip&Next"
+                                                                       (click)="skipNextPrevious(next)"
+                                                                       matTooltipPosition="below">
+                                                        <mat-icon>chevron_right</mat-icon>
+                                                    </mat-button-toggle>
+                                                </mat-button-toggle-group>
+
+                                            </div>
+                                        </div>
+
+                                    </mat-card-actions>
+                                </ng-template>
+                            </ng-container>
+
+                        </ng-container>
                     </div>
-                      <!-- end check box questions section -->
-                      
-                      <!-- start forms based questions -->
-                      <div *ngIf="formsCategoryEnable">
+                    <!-- end check box questions section -->
+
+                    <!-- start forms based questions -->
+                    <div *ngIf="formsCategoryEnable">
                         <ng-container [ngSwitch]="selectedFormsCategory.form_id">
-                        <!-- start supplier type questions section -->
-                            <ng-container  *ngSwitchCase="1">
+                            <!-- start supplier type questions section -->
+                            <ng-container *ngSwitchCase="1">
                                 <p>supplier</p>
-                                </ng-container>
-                                <!-- end supplier type questions -->
+                            </ng-container>
+                            <!-- end supplier type questions -->
 
-                                <!-- start client type questions -->
-                                <ng-container  *ngSwitchCase="2">
-                                        <p>client</p>
-                                        </ng-container>
-                                <!-- end client type questions -->
+                            <!-- start client type questions -->
+                            <ng-container *ngSwitchCase="2">
+                                <p>client</p>
+                            </ng-container>
+                            <!-- end client type questions -->
 
-                                <!-- start personal type questions -->
-                                <ng-container  *ngSwitchCase="3">
-                                        <p>Personal</p>
-                                        </ng-container>
+                            <!-- start personal type questions -->
+                            <ng-container *ngSwitchCase="3">
+                                <p>Personal</p>
+                            </ng-container>
+                            <!-- end personal type questions -->
+                            <ng-container *ngSwitchCase="4">
+                                <p>Address</p>
+                                <form class="address" [formGroup]="addressForm">
+                                    <mat-form-field>
+                                        <input matInput placeholder="Address" formControlName="address">
+                                    </mat-form-field>
+
+                                    <mat-form-field>
+                                        <mat-select placeholder="Address Type" formControlName="address_type">
+                                            <mat-option value="Office">Office</mat-option>
+                                            <mat-option value="Clinic">Clinic</mat-option>
+                                            <mat-option value="Factory">Factory</mat-option>
+                                            <mat-option value="Warehouse">Warehouse</mat-option>
+                                            <mat-option value="Shop">Shop</mat-option>
+                                            <mat-option value="ResidencecumOffice">Residence cum Office</mat-option>
+                                            <mat-option value="Residence">Residence</mat-option>
+                                            <mat-option value="Other">Other (PD officer to fill)</mat-option>
+                                        </mat-select>
+                                    </mat-form-field>
+
+                                    <mat-form-field>
+                                        <mat-select placeholder="Locality" formControlName="locality">
+                                            <mat-option value="CommercialOffice">Commercial (Office type) Area
+                                            </mat-option>
+                                            <mat-option value="CommercialShop">Commercial (shop type) Area</mat-option>
+                                            <mat-option value="Industrial">Industrial Area</mat-option>
+                                            <mat-option value="Residential">Residential Area</mat-option>
+                                            <mat-option value="Mix">Mix use (Comment mandatory)</mat-option>
+                                            <mat-option value="Rural">Rural (Village) area</mat-option>
+                                            <mat-option value="Others">Others (Please specify)</mat-option>
+                                        </mat-select>
+                                    </mat-form-field>
+                                    <mat-form-field>
+                                        <mat-select placeholder="Approach to PD location" formControlName="pd_location">
+                                            <mat-option value="{{data.pd_location_approach_id}}"
+                                                        *ngFor="let data of locationdata">{{data.description}}
+                                            </mat-option>
+                                        </mat-select>
+                                    </mat-form-field>
+                                    <mat-form-field>
+                                        <mat-select placeholder="Comment on locality" formControlName="comment_locality">
+                                            <mat-option value="{{data.comments_on_locality_id}}"
+                                                        *ngFor="let data of commentData">{{data.rating}}
+                                            </mat-option>
+                                        </mat-select>
+                                    </mat-form-field>
+                                    <mat-form-field>
+                                        <mat-select placeholder="Customer Behaviour"
+                                                    formControlName="customer_behaviour">
+                                            <mat-option value="{{data.customer_behaviour_id}}"
+                                                        *ngFor="let data of customerData">{{data.description}}
+                                            </mat-option>
+                                        </mat-select>
+                                    </mat-form-field>
+                                    <mat-card>
+                                        <mat-card-header>
+                                            <p>Neighbour hood
+                                            <p>
+                                        </mat-card-header>
+                                        <div formArrayName="neighbourhood">
+                                            <div *ngFor="let item of addressForm.get('neighbourhood').controls; let i=index">
+                                                <mat-card-content class="matcard" [formGroup]="item">
+                                                    <mat-form-field>
+                                                        <input matInput placeholder="Neighbour name"
+                                                               formControlName="name">
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <mat-select placeholder="Do you know"
+                                                                    formControlName="do_you_know">
+                                                            <mat-option value="yes">Yes</mat-option>
+                                                            <mat-option value="no">No</mat-option>
+                                                        </mat-select>
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <input matInput placeholder="How long do you know the applicant"
+                                                               formControlName="how_long">
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <mat-select placeholder="Is the applicant owner"
+                                                                    formControlName="is_owner">
+                                                            <mat-option value="yes">Yes</mat-option>
+                                                            <mat-option value="no">No</mat-option>
+                                                            <mat-option value="dont_know">Dont Know</mat-option>
+                                                        </mat-select>
+                                                    </mat-form-field>
+                                                    <button type="button" mat-raised-button mat-icon-button *ngIf="i==0" (click)="addNeighbour($event)"
+                                                            style="float: right;">
+                                                        <mat-icon>add</mat-icon>
+                                                    </button>
+                                                    <button type="button" mat-raised-button mat-icon-button *ngIf="i>0"
+                                                            (click)="removeNeighbour(i)"
+                                                            style="float: right;">
+                                                        <mat-icon>close</mat-icon>
+                                                    </button>
+
+                                                </mat-card-content>
+                                            </div>
+                                        </div>
+                                    </mat-card>
+                                    <button mat-raised-button type="submit" class="button" (click)="onSubmit()">Submit
+                                    </button>
+                                </form>
                                 <!-- end personal type questions -->
-                                </ng-container>
-                                </div>
-                      <!-- end form based questions -->
-                   
-                  </figure>
+                            </ng-container>
+                            <ng-container *ngSwitchCase="5">
+                                <p>Family</p>
+                                <form class="address" [formGroup]="familyForm">
+                                    <mat-form-field>
+                                        <mat-select placeholder="Person Met" formControlName="person">
+                                            <mat-option *ngFor="let state of filteredStates" [value]="state">
+                                                {{state}}
+                                            </mat-option>
+                                        </mat-select>
+                                    </mat-form-field>
+                                   <mat-form-field  *ngIf="person.value =='Other'">
+                                        <input matInput placeholder="Enter the relationship" formControlName="personOther">
+                                  </mat-form-field>
+                                    <mat-form-field>
+                                        <input matInput placeholder="No. Of family members" formControlName="members">
+                                    </mat-form-field>
+                                    <mat-card>
+                                        <mat-card-header>
+                                            <p>Earning Members
+                                            <p>
+                                        </mat-card-header>
+                                        <div formArrayName="earningMembers">
+                                            <div *ngFor="let item of familyForm.get('earningMembers').controls; let i=index" [formGroupName]="i">
+                                                <mat-card-content class="matcard">
+                                                    <mat-form-field>
+                                                        <mat-select placeholder="Relation" formControlName="relation">
+                                                            <mat-option value="{{relation.relationship_id}}"
+                                                                        *ngFor="let relation of relationData">
+                                                                {{relation.name}}
+                                                            </mat-option>
+                                                        </mat-select>
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <mat-select placeholder="Segment" formControlName="segment">
+                                                            <mat-option value="Salaried">Salaried</mat-option>
+                                                            <mat-option value="SENP">SENP</mat-option>
+                                                            <mat-option value="SEP">SEP</mat-option>
+
+                                                        </mat-select>
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <input matInput placeholder="Income / Revenue"
+                                                               formControlName="income">
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <input matInput placeholder="Name of Employer / Business"
+                                                               formControlName="employerName">
+                                                    </mat-form-field>
+                                                    <button type="button" mat-raised-button mat-icon-button *ngIf="i==0" (click)="addearningMembers()">
+                                                        <mat-icon >add</mat-icon>
+                                                    </button>
+                                                    <button type="button" mat-raised-button mat-icon-button (click)="deleteEarningMembers(i)" *ngIf="i>0">
+                                                        <mat-icon>close</mat-icon>
+                                                    </button>
+                                                </mat-card-content>
+                                            </div>
+                                        </div>
+                                    </mat-card>
+                                    <mat-card>
+                                        <mat-card-header>
+                                            <p>Non Earning Members
+                                            <p>
+                                        </mat-card-header>
+                                        <div formArrayName="nonEarningMembers">
+                                            <div *ngFor="let members of familyForm.get('nonEarningMembers').controls; let i=index" [formGroupName]="i">
+                                                <mat-card-content class="matcard">
+                                                    <mat-form-field>
+                                                        <mat-select placeholder="Relation"
+                                                                    formControlName="relationship">
+                                                            <mat-option value="{{relation.relationship_id}}"
+                                                                        *ngFor="let relation of relationData">
+                                                                {{relation.name}}
+                                                            </mat-option>
+                                                        </mat-select>
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <mat-select placeholder="Occupation"
+                                                                    formControlName="occupation">
+                                                            <mat-option value="{{occupation.occupation_non_earning_member_id}}" *ngFor="let occupation of occupationData">{{occupation.name}}</mat-option>
+                                                        </mat-select>
+                                                    </mat-form-field>
+                                                    <mat-form-field>
+                                                        <input matInput placeholder="Retired From"
+                                                               formControlName="retired">
+                                                    </mat-form-field>
+                                                    <button type="button" mat-raised-button mat-icon-button (click)="addMembers()" *ngIf="i==0">
+                                                        <mat-icon>add</mat-icon>
+                                                    </button>
+                                                    <button type="button" mat-raised-button mat-icon-button (click)="deleteMembers(i)" *ngIf="i>0">
+                                                        <mat-icon>close</mat-icon>
+                                                    </button>
+                                                </mat-card-content>
+                                            </div>
+                                        </div>
+                                    </mat-card>
+                                    <mat-card>
+                                        <mat-card-header>
+                                            <p>Residence
+                                            <p>
+                                        </mat-card-header>
+                                        <mat-card-content class="matcard">
+                                            <mat-form-field>
+                                                <input matInput placeholder="Where is the residence"
+                                                       formControlName="residence">
+                                            </mat-form-field>
+                                            <mat-form-field>
+                                                <input matInput placeholder="No.of yrs" formControlName="years">
+                                            </mat-form-field>
+                                            <mat-form-field>
+                                                <mat-select placeholder="Ownership" formControlName="ownership">
+                                                    <mat-option value="Self">Self Owned</mat-option>
+                                                    <mat-option value="Family">Family Owned</mat-option>
+                                                    <mat-option value="Rented">Rented</mat-option>
+                                                    <mat-option value="Others">Others</mat-option>
+                                                </mat-select>
+                                            </mat-form-field>
+                                            <mat-form-field  *ngIf="ownership.value =='Others'">
+                                                <input matInput placeholder="Please specify" formControlName="ownershipOther">
+                                            </mat-form-field>
+                                            <mat-form-field *ngIf="ownership.value =='Rented'">
+                                                <input matInput placeholder="what rent"
+                                                       formControlName="rent">
+                                            </mat-form-field>
+                                        </mat-card-content>
+                                    </mat-card>
+                                    <button mat-raised-button class="button" (click)="submitFamily()">Submit</button>
+                                </form>
+                            </ng-container>
+                            <ng-container *ngSwitchCase="6">
+                                <!--<p>Banking details</p>-->
+                                <form  [formGroup]="bankingForm" class="bankForm">
+                                    <div formArrayName="itemRows">
+                                        <mat-accordion
+                                                *ngFor="let itemrow of bankingForm.controls.itemRows.controls; let i=index"
+                                                [formGroupName]="i">
+                                            <mat-expansion-panel class="banlFields" [expanded]="step == i">
+                                                <mat-expansion-panel-header>
+                                                    <mat-panel-title>
+                                                      <h4>{{i+1}} Banking details<span *ngIf="i==0" style="float: right;">
+                                                    <mat-icon (click)="addBankdetails(i)">add</mat-icon>
+                                                     </span>
+                                                        <span *ngIf="i > 0">
+                                                    <mat-icon (click)="deleteBankdetails(i)">delete</mat-icon>
+                                                        </span></h4>
+                                                    </mat-panel-title>
+                                                </mat-expansion-panel-header>
+                                                <mat-form-field>
+                                                    <input matInput placeholder="Applicant Name"
+                                                           formControlName="applicant_name">
+                                                </mat-form-field>
+                                                <mat-form-field>
+                                                    <input matInput placeholder="Bank Name" formControlName="bank_name">
+                                                </mat-form-field>
+
+                                                <mat-form-field>
+                                                    <mat-select placeholder="Account Type"
+                                                                formControlName="account_type">
+                                                        <mat-option value="Savings">Savings</mat-option>
+                                                        <mat-option value="Current">Current</mat-option>
+                                                        <mat-option value="OD">OD</mat-option>
+                                                        <mat-option value="CC">CC</mat-option>
+
+                                                    </mat-select>
+                                                </mat-form-field>
+
+                                                <mat-form-field>
+                                                    <mat-select placeholder="Salary Credited in this account"
+                                                                formControlName="salary">
+                                                        <mat-option value="Yes">Yes</mat-option>
+                                                        <mat-option value="No">No</mat-option>
+                                                        <mat-option value="NA">NA</mat-option>
+                                                    </mat-select>
+                                                </mat-form-field>
+                                                <mat-form-field>
+                                                    <input matInput placeholder="Limit in case of OD / CC account"
+                                                           formControlName="limit">
+                                                </mat-form-field>
+                                                <mat-form-field>
+                                                    <mat-select placeholder="Is this the main business account"
+                                                                formControlName="is_main">
+                                                        <mat-option value="Yes">Yes</mat-option>
+                                                        <mat-option value="No">No</mat-option>
+                                                    </mat-select>
+                                                </mat-form-field>
+                                                <mat-form-field>
+                                                    <input matInput placeholder="Approximate Vintage"
+                                                           formControlName="vintage">
+                                                </mat-form-field>
+                                            </mat-expansion-panel>
+
+                                        </mat-accordion>
+                                    </div>
+                                    <button mat-raised-button class="button" (click)="bankSubmit()">Submit
+                                    </button>
+                                </form>
+                                <!-- end personal type questions -->
+                            </ng-container>
+                        </ng-container>
+                    </div>
+                    <!-- end form based questions -->
+
+                </figure>
             </div>
-         </mat-sidenav-container>
-         
+        </mat-sidenav-container>
+
     </mat-card-content>
 </mat-card>
 
-       <notifier-container></notifier-container>
+<notifier-container></notifier-container>
 
     
  
\ No newline at end of file
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.scss b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.scss
index e71caa4d2..5f3eb7681 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.scss
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.scss
@@ -120,4 +120,35 @@ mat-icon{
     position: fixed;
     right: 69px;
     top: 112px;
+}
+.address {
+    display: flex;
+    padding: 0 2%;
+    flex-direction: column;
+}
+
+.address > * {
+    width: 100%;
+}
+.matcard mat-form-field {
+  margin: 0 2%;
+}
+.address .button {
+    float: right;
+    width: 10px;
+    background: #62B013;
+    color: white;
+}
+.banlFields mat-form-field {
+    width: 100%;
+    margin: 0 2%;
+}
+.bankForm .button {
+    float: right;
+    width: 10px;
+    background: #62B013;
+    color: white;
+}
+.has-danger{
+    border: solid thin #f44336!important;
 }
\ No newline at end of file
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.ts b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.ts
index 1bedab318..47b979fbd 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.ts
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/list-pd/start-pd/start-pd.component.ts
@@ -1,466 +1,829 @@
-import { Component, ViewChild ,OnInit,ViewEncapsulation, OnDestroy } from '@angular/core';
-import { FormBuilder, FormGroup, Validators, FormControl, FormArray } from '@angular/forms';
-import { ActivatedRoute, Router } from '@angular/router';
-import { NotifierService } from 'angular-notifier';
-import { ListPdComponent } from './../list-pd.component';
-import { PdTrigerService } from '../../../pd-service/pd-triger.service';
+import {Component, ViewChild, OnInit, ViewEncapsulation, OnDestroy} from '@angular/core';
+import {FormBuilder, FormGroup, Validators, FormControl, FormArray, AbstractControl} from '@angular/forms';
+import {ActivatedRoute, Router} from '@angular/router';
+import {NotifierService} from 'angular-notifier';
+import {ListPdComponent} from './../list-pd.component';
+import {PdTrigerService} from '../../../pd-service/pd-triger.service';
 
 @Component({
-  selector: 'app-start-pd',
-  templateUrl: './start-pd.component.html',
-  styleUrls: ['./start-pd.component.scss']
+    selector: 'app-start-pd',
+    templateUrl: './start-pd.component.html',
+    styleUrls: ['./start-pd.component.scss']
 })
 export class StartPdComponent implements OnInit, OnDestroy {
-private notifier: NotifierService;
-public startPD:string;
-public mainApplicantName:string;
+    public startPD: string;
+    public mainApplicantName: string;
 //public remarks: string;
-errorMessage:any;
-selectedCategory:any=[];
-categoryList: any=[];
-pdMasterList: any=[];
-optionsForm: FormGroup;
-checkBoxForm:FormGroup;
-textBoxForm:FormGroup;
-next:number;
-previous:number;
-selectedCategoryIndex:number;
-selectedQuestionIndex:number;
-getQuestionsLength:number;
-answerList:any=[];
-ansPDList:any=[];
-
+    errorMessage: any;
+    selectedCategory: any = [];
+    categoryList: any = [];
+    pdMasterList: any = [];
+    optionsForm: FormGroup;
+    checkBoxForm: FormGroup;
+    textBoxForm: FormGroup;
+    next: number;
+    previous: number;
+    selectedCategoryIndex: number;
+    selectedQuestionIndex: number;
+    getQuestionsLength: number;
+    answerList: any = [];
+    ansPDList: any = [];
+    filteredStates: any = [
+        'Co-Applicant 1 to x',
+        'Accountant',
+        'Manager',
+        'Relative of the applicant',
+        'Friend of the Applicant',
+        'DSA',
+        'Other'
+    ];
+    relationDetails: any = [1];
 // category static form buttons
-categoryFormButtons : any=[
-{
- "form_id":1,
- "form_name":"Supplier Details"
-},
-{
-  "form_id":2,
-  "form_name":"Client Details",
-},
-{
-  "form_id":3,
-  "form_name":"Personal Details",
-},
-
-];
-
-formsCategoryEnable:boolean=false;
-selectedFormsCategory:any;
-
+    categoryFormButtons: any = [
+        {
+            "form_id": 1,
+            "form_name": "Supplier Details"
+        },
+        {
+            "form_id": 2,
+            "form_name": "Client Details",
+        },
+        {
+            "form_id": 3,
+            "form_name": "Personal Details",
+        },
+        {
+            "form_id": 4,
+            "form_name": "Address"
+        },
+        {
+            "form_id": 5,
+            "form_name": "Family",
+        },
+        {
+            "form_id": 6,
+            "form_name": "Banking",
+        },
 
+    ];
+    formsCategoryEnable: boolean = false;
+    selectedFormsCategory: any;
 // create values for status check
-pdStatusCheck :any={
-  "DRAFT" :'DRAFT',
-  "TRIGGERED" :'TRIGGERED',
-  "ALLOCATED" :'ALLOCATED',
-  "SCHEDULED" :'SCHEDULED',
-  "INPROGRESS" :'INPROGRESS',
-  "COMPLETED" :'COMPLETED',
-  "QC_COMPLETED" :'QC_COMPLETED',
-};
-currentPDStatus: string;
-actualQuestions:number;
-answeredQuestions :number;
-constructor(notifier: NotifierService, private fb: FormBuilder,private route: ActivatedRoute,
-    private router: Router,
-    private listPDComponent : ListPdComponent, private _pd: PdTrigerService,) {
-      this.startPD = this.route.snapshot.params['pdid'];
-      this.notifier = notifier;
-     
-  }
+    pdStatusCheck: any = {
+        "DRAFT": 'DRAFT',
+        "TRIGGERED": 'TRIGGERED',
+        "ALLOCATED": 'ALLOCATED',
+        "SCHEDULED": 'SCHEDULED',
+        "INPROGRESS": 'INPROGRESS',
+        "COMPLETED": 'COMPLETED',
+        "QC_COMPLETED": 'QC_COMPLETED',
+    };
+    currentPDStatus: string;
+    actualQuestions: number;
+    answeredQuestions: number;
+    locationdata: any = [];
+    commentData: any = [];
+    customerData: any = [];
+    relationData: any = [];
+    occupationData: any = [];
+    public addressForm: FormGroup;
+    public familyForm: FormGroup;
+    public bankingForm: FormGroup;
 
-  ngOnInit() {
-    this.listPDComponent.showListView(false);
-    const elemSidebar = <HTMLElement>document.querySelector('.app-inner .mail-sidebar');
-    const elemContent = <HTMLElement>document.querySelector('.app-inner .main-content');
+    public address: AbstractControl;
+    public addressType: AbstractControl;
+    public locality: AbstractControl;
+    public pdLocation: AbstractControl;
+    public commentlocality: AbstractControl;
+    public customerBehaviour: AbstractControl;
+
+    public person: AbstractControl;
+    public personOther: AbstractControl;
+
+    public members: AbstractControl;
+    public residence: AbstractControl;
+    public years: AbstractControl;
+    public ownership: AbstractControl;
+    public ownershipOther: AbstractControl;
+    public rent: AbstractControl;
+    step: any;
+
+    private notifier: NotifierService;
+
+
+    constructor(notifier: NotifierService, private fb: FormBuilder, private route: ActivatedRoute,
+                private router: Router,
+                private listPDComponent: ListPdComponent, private _pd: PdTrigerService,) {
+        this.startPD = this.route.snapshot.params['pdid'];
+        this.notifier = notifier;
 
-    if (window.matchMedia(`(min-width: 960px)`).matches && !this.isMac()) {
-      // Ps.initialize(elemSidebar, { wheelSpeed: 2, suppressScrollX: true });
-      // Ps.initialize(elemContent, { wheelSpeed: 2, suppressScrollX: true });
     }
 
-    this.loadTemplates(this.startPD); 
-    this.next=1;
-    this.previous=2; 
-  }
-  isMac(): boolean {
-    let bool = false;
-    if (navigator.platform.toUpperCase().indexOf('MAC') >= 0 || navigator.platform.toUpperCase().indexOf('IPAD') >= 0) {
-      bool = true;
-    }
-    return bool;
-  }
-// load pd template details
-loadTemplates(startID:string){
-    this._pd.loadPDTemplates(startID).subscribe(
-      data => {
-        if (data.status == 200) {
-            this.pdMasterList=data.records.pdmaster_details;
-            this.categoryList=data.records.question_answers;
-            let filterApplicantName= data.records.pdapplicants_detials.filter(item => item.applicant_type == 1);
-            this.mainApplicantName = filterApplicantName[0].applicant_name;
-            this.currentPDStatus = data.records.pdmaster_details.pd_status;
+    ngOnInit() {
+        this.step = 0;
+        this.getLocation();
+        this.getComment();
+        this.getCustomer();
+        this.getRelation();
+        this.getOccupation();
 
-              this.actualQuestions = data.records.counts.overall_question_count;
-              this.answeredQuestions = data.records.counts.overall_answered_count;
+        this.initAddressForm();
+        this.initFamilyForm();
+        this.initBankingForm();
+        this.listPDComponent.showListView(false);
+        const elemSidebar = <HTMLElement>document.querySelector('.app-inner .mail-sidebar');
+        const elemContent = <HTMLElement>document.querySelector('.app-inner .main-content');
 
-          }
-        else{
-            this.pdMasterList="";
-            this.mainApplicantName="";
-            this.categoryList=[];
-            this.currentPDStatus="";
+        if (window.matchMedia(`(min-width: 960px)`).matches && !this.isMac()) {
+            // Ps.initialize(elemSidebar, { wheelSpeed: 2, suppressScrollX: true });
+            // Ps.initialize(elemContent, { wheelSpeed: 2, suppressScrollX: true });
         }
-  }, error => this.errorMessage = <any> error);
+
+        this.loadTemplates(this.startPD);
+        this.next = 1;
+        this.previous = 2;
+    }
+    public initAddressForm(): void {
+        this.addressForm = this.fb.group({
+            address: ['', Validators.compose([Validators.required])],
+            address_type: ['', Validators.compose([Validators.required])],
+            locality: ['', Validators.compose([Validators.required])],
+            pd_location: ['', Validators.compose([Validators.required])],
+            comment_locality: ['', Validators.compose([Validators.required])],
+            customer_behaviour: ['', Validators.compose([Validators.required])],
+            neighbourhood: this.fb.array([ this.createNeighbour() ])
+        });
+        this.address = this.addressForm.controls['address'];
+        this.addressType = this.addressForm.controls['address_type'];
+        this.locality = this.addressForm.controls['locality'];
+        this.pdLocation = this.addressForm.controls['pd_location'];
+        this.commentlocality = this.addressForm.controls['comment_locality'];
+        this.customerBehaviour = this.addressForm.controls['customer_behaviour'];
+    }
+    createNeighbour(): FormGroup {
+        return this.fb.group({
+            name: ['', Validators.compose([Validators.required])],
+            do_you_know: ['', Validators.compose([Validators.required])],
+            how_long: ['', Validators.compose([Validators.required])],
+            is_owner: ['', Validators.compose([Validators.required])],
+        });
+    }
+    public initFamilyForm(): void {
+        this.familyForm = this.fb.group({
+            person: ['', Validators.compose([Validators.required])],
+            personOther: [''],
+            members: ['', Validators.compose([Validators.required])],
+            residence: ['', Validators.compose([Validators.required])],
+            years: ['', Validators.compose([Validators.required])],
+            ownership: ['', Validators.compose([Validators.required])],
+            ownershipOther: [''],
+            rent: [''],
+            earningMembers: this.fb.array([ this.createMembers()]),
+            nonEarningMembers: this.fb.array([ this.createNonMembers()])
+        });
+        this.person = this.familyForm.controls['person'];
+        this.personOther = this.familyForm.controls['personOther'];
+        this.members = this.familyForm.controls['members'];
+        this.residence = this.familyForm.controls['residence'];
+        this.years = this.familyForm.controls['years'];
+        this.ownership = this.familyForm.controls['ownership'];
+        this.ownershipOther = this.familyForm.controls['ownershipOther'];
+
+        this.rent = this.familyForm.controls['rent'];
+    }
+    public initBankingForm(): void {
+        this.bankingForm = this.fb.group({
+            itemRows: this.fb.array([this.createBankarray()])
+        });
+    }
+    createBankarray() {
+        return this.fb.group({
+            applicant_name: ['', Validators.compose([Validators.required])],
+            bank_name: ['', Validators.compose([Validators.required])],
+            account_type: ['', Validators.compose([Validators.required])],
+            salary: ['', Validators.compose([Validators.required])],
+            limit: ['', Validators.compose([Validators.required])],
+            is_main: ['', Validators.compose([Validators.required])],
+            vintage: ['', Validators.compose([Validators.required])],
+        });
+    }
+    createMembers(): FormGroup {
+        return this.fb.group({
+            relation: ['', Validators.compose([Validators.required])],
+            segment: ['', Validators.compose([Validators.required])],
+            income: ['', Validators.compose([Validators.required])],
+            employerName: ['', Validators.compose([Validators.required])],
+        });
+    }
+    createNonMembers(): FormGroup {
+        return this.fb.group({
+            relationship: ['', Validators.compose([Validators.required])],
+            occupation: ['', Validators.compose([Validators.required])],
+            retired: ['', Validators.compose([Validators.required])],
+        });
     }
 
-  ngOnDestroy(): void {
-    this.listPDComponent.showListView(true);
-  }
+    isMac(): boolean {
+        let bool = false;
+        if (navigator.platform.toUpperCase().indexOf('MAC') >= 0 || navigator.platform.toUpperCase().indexOf('IPAD') >= 0) {
+            bool = true;
+        }
+        return bool;
+    }
 
-  
+// load pd template details
+    loadTemplates(startID: string) {
+        this._pd.loadPDTemplates(startID).subscribe(
+            data => {
+                if (data.status == 200) {
+                    this.pdMasterList = data.records.pdmaster_details;
+                    this.categoryList = data.records.question_answers;
+                    let filterApplicantName = data.records.pdapplicants_detials.filter(item => item.applicant_type == 1);
+                    this.mainApplicantName = filterApplicantName[0].applicant_name;
+                    this.currentPDStatus = data.records.pdmaster_details.pd_status;
 
-  isOver(): boolean {
-    return window.matchMedia(`(max-width: 960px)`).matches;
-  }
+                    this.actualQuestions = data.records.counts.overall_question_count;
+                    this.answeredQuestions = data.records.counts.overall_answered_count;
 
-  OnSelectDirectQuestions(selectedQuestions: any, categoryIndex:number,questionsIndex:number){
-    this.formsCategoryEnable=false;
-    this.selectedCategory=selectedQuestions;
-    this.selectedCategoryIndex=categoryIndex;
-    this.selectedQuestionIndex=questionsIndex;
+                }
+                else {
+                    this.pdMasterList = "";
+                    this.mainApplicantName = "";
+                    this.categoryList = [];
+                    this.currentPDStatus = "";
+                }
+            }, error => this.errorMessage = <any> error);
+    }
 
-       let serachQuestions = {
-         "question_id":selectedQuestions.fk_question_id,
-         "pd_id":this.startPD,
-         "template_id":selectedQuestions.fk_template_id,
-         "category_id":selectedQuestions.fk_template_question_category_id
-       }
-       this.getAnswers(serachQuestions);
-      
-  }
+    ngOnDestroy(): void {
+        this.listPDComponent.showListView(true);
+    }
 
-  // load question based answer list
-  getAnswers(serachList:any){
-    this.answerList=[];
-  this._pd.getAnswersForPD(serachList).subscribe(
-      data => {
-        if (data.status == 200) {
-            this.answerList=data.records.answers;
-            this.ansPDList=data.records;
-            this.actualQuestions = data.records.counts.overall_question_count,
-            this.answeredQuestions = data.records.counts.overall_answered_count
-  
-  // this for options type  questions
-  if(this.selectedCategory.fk_question_answertype==1){
-      this.loadOtionsForm(this.selectedCategory, this.answerList);
-  }
-  //this for text box type questions 
-  else if(this.selectedCategory.fk_question_answertype==2){
-      
-    this.loadTextBoxForm(this.selectedCategory,this.answerList);
-}
+
+    isOver(): boolean {
+        return window.matchMedia(`(max-width: 960px)`).matches;
+    }
+
+    OnSelectDirectQuestions(selectedQuestions: any, categoryIndex: number, questionsIndex: number) {
+        this.formsCategoryEnable = false;
+        this.selectedCategory = selectedQuestions;
+        this.selectedCategoryIndex = categoryIndex;
+        this.selectedQuestionIndex = questionsIndex;
+
+        let serachQuestions = {
+            "question_id": selectedQuestions.fk_question_id,
+            "pd_id": this.startPD,
+            "template_id": selectedQuestions.fk_template_id,
+            "category_id": selectedQuestions.fk_template_question_category_id
+        }
+        this.getAnswers(serachQuestions);
+
+    }
+
+    // load question based answer list
+    getAnswers(serachList: any) {
+        this.answerList = [];
+        this._pd.getAnswersForPD(serachList).subscribe(
+            data => {
+                if (data.status == 200) {
+                    this.answerList = data.records.answers;
+                    this.ansPDList = data.records;
+                    this.actualQuestions = data.records.counts.overall_question_count,
+                        this.answeredQuestions = data.records.counts.overall_answered_count
+
+                    // this for options type  questions
+                    if (this.selectedCategory.fk_question_answertype == 1) {
+                        this.loadOtionsForm(this.selectedCategory, this.answerList);
+                    }
+                    //this for text box type questions
+                    else if (this.selectedCategory.fk_question_answertype == 2) {
+
+                        this.loadTextBoxForm(this.selectedCategory, this.answerList);
+                    }
 //this for check box type questions 
-  else if(this.selectedCategory.fk_question_answertype==3){
-      
-      this.loadCheckBoxForm(this.selectedCategory,this.answerList);
-  }
-          }
-  }, error => this.errorMessage = <any> error);
-    
+                    else if (this.selectedCategory.fk_question_answertype == 3) {
+
+                        this.loadCheckBoxForm(this.selectedCategory, this.answerList);
+                    }
+                }
+            }, error => this.errorMessage = <any> error);
 
 
-  }
-   
+    }
+
     // load check box form
 
-    loadCheckBoxForm(selectedCategory: any, ansItem: any){
-       // create checkbox group
-     let checkboxGroup = new FormArray(ansItem.map(item => new FormGroup({
-        fk_pd_id:new FormControl(this.startPD),
-        pd_detail_answer_id: new FormControl(item.pd_detail_answer_id),
-        pd_answer_id: new FormControl(item.question_answer_id),
-        pd_answer: new FormControl(item.answer),
-        pd_answer_weightage:new FormControl(item.template_answer_weightage),
-        checkbox: new FormControl(item.isactive==null ? false: true)
-      })));
-       // create documents group
-       let documentsGroup = new FormArray(this.ansPDList.images.map(item => new FormGroup({
-        pd_document_title:new FormControl(item.pd_document_title),
-        pd_document_url: new FormControl(item.pd_document_name),
+    loadCheckBoxForm(selectedCategory: any, ansItem: any) {
+        // create checkbox group
+        let checkboxGroup = new FormArray(ansItem.map(item => new FormGroup({
+            fk_pd_id: new FormControl(this.startPD),
+            pd_detail_answer_id: new FormControl(item.pd_detail_answer_id),
+            pd_answer_id: new FormControl(item.question_answer_id),
+            pd_answer: new FormControl(item.answer),
+            pd_answer_weightage: new FormControl(item.template_answer_weightage),
+            checkbox: new FormControl(item.isactive == null ? false : true)
+        })));
+        // create documents group
+        let documentsGroup = new FormArray(this.ansPDList.images.map(item => new FormGroup({
+            pd_document_title: new FormControl(item.pd_document_title),
+            pd_document_url: new FormControl(item.pd_document_name),
 
-      })));
-  
-      // create a hidden reuired formControl to keep status of checkbox group
-      let hiddenControl = new FormControl(this.mapItems(checkboxGroup.value), Validators.required);
-      // update checkbox group's value to hidden formcontrol
-      checkboxGroup.valueChanges.subscribe((v) => {
-        hiddenControl.setValue(this.mapItems(v));
-      });
-      
-  
-      this.checkBoxForm = new FormGroup({
-         pd_detail_id: new FormControl(this.ansPDList.pd_detail_id),
-         fk_pd_id: new FormControl(this.startPD),
-         fk_category_id: new FormControl(this.selectedCategory.fk_template_question_category_id),
-         fk_question_id: new FormControl(this.selectedCategory.fk_question_id),
-         pd_question: new FormControl(this.selectedCategory.question),
-         pd_question_weightage: new FormControl(this.selectedCategory.question_weightage),
-         pd_answer_remark:new FormControl(this.ansPDList.question_remark),
-         items: checkboxGroup,
-         selectedItems: hiddenControl,
-         documents: documentsGroup
-      });
-  }
+        })));
 
-  // map options form group values
-  mapItems(items) {
-    let selectedItems = items.filter((item) => item.checkbox).map((item) => item);
-    return selectedItems.length ? selectedItems : null;
-  }
+        // create a hidden reuired formControl to keep status of checkbox group
+        let hiddenControl = new FormControl(this.mapItems(checkboxGroup.value), Validators.required);
+        // update checkbox group's value to hidden formcontrol
+        checkboxGroup.valueChanges.subscribe((v) => {
+            hiddenControl.setValue(this.mapItems(v));
+        });
 
-  // load Options form 
-  loadOtionsForm(selectedCategory: any, ansItem: any){
-       // create options type group
-       let optionsGroup = new FormArray(ansItem.map(item => new FormGroup({
-        fk_pd_id:new FormControl(this.startPD),
-        pd_detail_answer_id: new FormControl(item.pd_detail_answer_id),
-        pd_answer_id: new FormControl(item.question_answer_id),
-        pd_answer: new FormControl(item.answer),
-        pd_answer_weightage:new FormControl(item.template_answer_weightage),
-        options: new FormControl(item.isactive==null ? false: true)
-      })));
 
-      // create documents group
-      let documentsGroup = new FormArray(this.ansPDList.images.map(item => new FormGroup({
-        pd_document_title:new FormControl(item.pd_document_title),
-        pd_document_url: new FormControl(item.pd_document_name),
+        this.checkBoxForm = new FormGroup({
+            pd_detail_id: new FormControl(this.ansPDList.pd_detail_id),
+            fk_pd_id: new FormControl(this.startPD),
+            fk_category_id: new FormControl(this.selectedCategory.fk_template_question_category_id),
+            fk_question_id: new FormControl(this.selectedCategory.fk_question_id),
+            pd_question: new FormControl(this.selectedCategory.question),
+            pd_question_weightage: new FormControl(this.selectedCategory.question_weightage),
+            pd_answer_remark: new FormControl(this.ansPDList.question_remark),
+            items: checkboxGroup,
+            selectedItems: hiddenControl,
+            documents: documentsGroup
+        });
+    }
 
-      })));
-  
-      // create a hidden reuired formControl to keep status of checkbox group
-      let hiddenControl = new FormControl(this.optionsMapItems(optionsGroup.value), Validators.required);
-      let checkedItem = hiddenControl.value!=null ? new FormControl(hiddenControl.value[0].pd_answer_id) :new FormControl(null);
-  
-      this.optionsForm = new FormGroup({
-         pd_detail_id: new FormControl(this.ansPDList.pd_detail_id),
-         fk_pd_id: new FormControl(this.startPD),
-         fk_category_id: new FormControl(this.selectedCategory.fk_template_question_category_id),
-         fk_question_id: new FormControl(this.selectedCategory.fk_question_id),
-         pd_question: new FormControl(this.selectedCategory.question),
-         pd_question_weightage: new FormControl(this.selectedCategory.question_weightage),
-         pd_answer_remark:new FormControl(this.ansPDList.question_remark),
-         items: optionsGroup,
-         selectedItems: hiddenControl,
-         modelValue : checkedItem,
-         documents: documentsGroup
-         
-      });
-      this.optionsForm.controls.modelValue.valueChanges.subscribe((v) => {
-        hiddenControl.setValue(this.updateOptionsMapItems(v,optionsGroup.value));
-      });
+    // map options form group values
+    mapItems(items) {
+        let selectedItems = items.filter((item) => item.checkbox).map((item) => item);
+        return selectedItems.length ? selectedItems : null;
+    }
 
-}
+    // load Options form
+    loadOtionsForm(selectedCategory: any, ansItem: any) {
+        // create options type group
+        let optionsGroup = new FormArray(ansItem.map(item => new FormGroup({
+            fk_pd_id: new FormControl(this.startPD),
+            pd_detail_answer_id: new FormControl(item.pd_detail_answer_id),
+            pd_answer_id: new FormControl(item.question_answer_id),
+            pd_answer: new FormControl(item.answer),
+            pd_answer_weightage: new FormControl(item.template_answer_weightage),
+            options: new FormControl(item.isactive == null ? false : true)
+        })));
+
+        // create documents group
+        let documentsGroup = new FormArray(this.ansPDList.images.map(item => new FormGroup({
+            pd_document_title: new FormControl(item.pd_document_title),
+            pd_document_url: new FormControl(item.pd_document_name),
+
+        })));
+
+        // create a hidden reuired formControl to keep status of checkbox group
+        let hiddenControl = new FormControl(this.optionsMapItems(optionsGroup.value), Validators.required);
+        let checkedItem = hiddenControl.value != null ? new FormControl(hiddenControl.value[0].pd_answer_id) : new FormControl(null);
+
+        this.optionsForm = new FormGroup({
+            pd_detail_id: new FormControl(this.ansPDList.pd_detail_id),
+            fk_pd_id: new FormControl(this.startPD),
+            fk_category_id: new FormControl(this.selectedCategory.fk_template_question_category_id),
+            fk_question_id: new FormControl(this.selectedCategory.fk_question_id),
+            pd_question: new FormControl(this.selectedCategory.question),
+            pd_question_weightage: new FormControl(this.selectedCategory.question_weightage),
+            pd_answer_remark: new FormControl(this.ansPDList.question_remark),
+            items: optionsGroup,
+            selectedItems: hiddenControl,
+            modelValue: checkedItem,
+            documents: documentsGroup
+
+        });
+        this.optionsForm.controls.modelValue.valueChanges.subscribe((v) => {
+            hiddenControl.setValue(this.updateOptionsMapItems(v, optionsGroup.value));
+        });
+
+    }
 
 // map option type group values
-optionsMapItems(items) {
-    
-    let optionSelectedItems = items.filter((item) => item.options==true).map((item) => item);
-    return optionSelectedItems.length ? optionSelectedItems : null;
-  }
-  // map options type while change options
-  updateOptionsMapItems(key,items) {
-    
-    let updateSelectedItems = items.filter((item) => item.pd_answer_id==key).map((item) => item);
-    return updateSelectedItems.length ? updateSelectedItems : null;
-  }
+    optionsMapItems(items) {
 
-  // load text box form 
-  loadTextBoxForm(selectedCategory: any, ansItem: any){
-    // create text box type group
-    let textGroup = new FormArray(ansItem.map(item => new FormGroup({
-      fk_pd_id:new FormControl(this.startPD),
-      pd_detail_answer_id: new FormControl(item.pd_detail_answer_id),
-      pd_answer_id: new FormControl(item.question_answer_id),
-      pd_answer: new FormControl(item.pd_answer),
-      pd_answer_weightage:new FormControl(item.template_answer_weightage),   
-      text: new FormControl(item.pd_detail_answer_id==null ? false: true)
-    })));
-
-    // create documents group
-    let documentsGroup = new FormArray(this.ansPDList.images.map(item => new FormGroup({
-      pd_document_title:new FormControl(item.pd_document_title),
-      pd_document_url: new FormControl(item.pd_document_name),
-
-    })));
-
-    this.textBoxForm = new FormGroup({
-      pd_detail_id: new FormControl(this.ansPDList.pd_detail_id),
-      fk_pd_id: new FormControl(this.startPD),
-      fk_category_id: new FormControl(this.selectedCategory.fk_template_question_category_id),
-      fk_question_id: new FormControl(this.selectedCategory.fk_question_id),
-      pd_question: new FormControl(this.selectedCategory.question),
-      pd_question_weightage: new FormControl(this.selectedCategory.question_weightage),
-      pd_answer_remark:new FormControl(this.ansPDList.question_remark),
-      items: textGroup, 
-      documents: documentsGroup   
-   });
-  }
-
-  // next save and previous save for  options and check box type questions
-  saveNextPrevious(details:any, type:number){
-
-   let fetchAns =[];
-   details.selectedItems.value.forEach((itemElement, itemIndex) => {
-    let obj1 =  {
-      fk_pd_detail_id:details.pd_detail_id.value,
-      fk_pd_id:itemElement.fk_pd_id,
-      pd_detail_answer_id: itemElement.pd_detail_answer_id,
-      pd_answer_id: itemElement.pd_answer_id,
-      pd_answer: itemElement.pd_answer,
-      pd_answer_weightage:itemElement.pd_answer_weightage,
+        let optionSelectedItems = items.filter((item) => item.options == true).map((item) => item);
+        return optionSelectedItems.length ? optionSelectedItems : null;
     }
-    fetchAns.push(obj1)
-   });
 
-   let pd_details:any=[{
-      "pd_detail_id":details.pd_detail_id.value,
-      "fk_pd_id":details.fk_pd_id.value,
-      "fk_category_id":details.fk_category_id.value,
-      "fk_question_id":details.fk_question_id.value,
-      "pd_question":details.pd_question.value,
-      "pd_question_weightage":details.pd_question_weightage.value,
-      "question_remark":details.pd_answer_remark.value,  
-      "answers":fetchAns,
-      "images":[]
-    }];
-     this._pd.savePDQuestions(pd_details).subscribe(result => {
-      if (result.status == 200) {
-        if(type==1){
-          this.skipNextPrevious(this.next);
+    // map options type while change options
+    updateOptionsMapItems(key, items) {
+
+        let updateSelectedItems = items.filter((item) => item.pd_answer_id == key).map((item) => item);
+        return updateSelectedItems.length ? updateSelectedItems : null;
+    }
+
+    // load text box form
+    loadTextBoxForm(selectedCategory: any, ansItem: any) {
+        // create text box type group
+        let textGroup = new FormArray(ansItem.map(item => new FormGroup({
+            fk_pd_id: new FormControl(this.startPD),
+            pd_detail_answer_id: new FormControl(item.pd_detail_answer_id),
+            pd_answer_id: new FormControl(item.question_answer_id),
+            pd_answer: new FormControl(item.pd_answer),
+            pd_answer_weightage: new FormControl(item.template_answer_weightage),
+            text: new FormControl(item.pd_detail_answer_id == null ? false : true)
+        })));
+
+        // create documents group
+        let documentsGroup = new FormArray(this.ansPDList.images.map(item => new FormGroup({
+            pd_document_title: new FormControl(item.pd_document_title),
+            pd_document_url: new FormControl(item.pd_document_name),
+
+        })));
+
+        this.textBoxForm = new FormGroup({
+            pd_detail_id: new FormControl(this.ansPDList.pd_detail_id),
+            fk_pd_id: new FormControl(this.startPD),
+            fk_category_id: new FormControl(this.selectedCategory.fk_template_question_category_id),
+            fk_question_id: new FormControl(this.selectedCategory.fk_question_id),
+            pd_question: new FormControl(this.selectedCategory.question),
+            pd_question_weightage: new FormControl(this.selectedCategory.question_weightage),
+            pd_answer_remark: new FormControl(this.ansPDList.question_remark),
+            items: textGroup,
+            documents: documentsGroup
+        });
+    }
+
+    // next save and previous save for  options and check box type questions
+    saveNextPrevious(details: any, type: number) {
+
+        let fetchAns = [];
+        details.selectedItems.value.forEach((itemElement, itemIndex) => {
+            let obj1 = {
+                fk_pd_detail_id: details.pd_detail_id.value,
+                fk_pd_id: itemElement.fk_pd_id,
+                pd_detail_answer_id: itemElement.pd_detail_answer_id,
+                pd_answer_id: itemElement.pd_answer_id,
+                pd_answer: itemElement.pd_answer,
+                pd_answer_weightage: itemElement.pd_answer_weightage,
+            }
+            fetchAns.push(obj1)
+        });
+
+        let pd_details: any = [{
+            "pd_detail_id": details.pd_detail_id.value,
+            "fk_pd_id": details.fk_pd_id.value,
+            "fk_category_id": details.fk_category_id.value,
+            "fk_question_id": details.fk_question_id.value,
+            "pd_question": details.pd_question.value,
+            "pd_question_weightage": details.pd_question_weightage.value,
+            "question_remark": details.pd_answer_remark.value,
+            "answers": fetchAns,
+            "images": []
+        }];
+        this._pd.savePDQuestions(pd_details).subscribe(result => {
+            if (result.status == 200) {
+                if (type == 1) {
+                    this.skipNextPrevious(this.next);
+                }
+                else {
+                    this.skipNextPrevious(this.previous);
+                }
+            }
+        }, error => {
+        });
+    }
+
+    // next save and previous save for  text type questions
+    saveNextPreviousText(details: any, type: number) {
+        let fetchAns = [];
+        details.items.value.forEach((itemElement, itemIndex) => {
+            let obj1 = {
+                fk_pd_detail_id: details.pd_detail_id.value,
+                fk_pd_id: itemElement.fk_pd_id,
+                pd_detail_answer_id: itemElement.pd_detail_answer_id,
+                pd_answer_id: itemElement.pd_answer_id,
+                pd_answer: itemElement.pd_answer,
+                pd_answer_weightage: itemElement.pd_answer_weightage,
+            }
+            fetchAns.push(obj1)
+        });
+        let pd_details: any = [{
+            "pd_detail_id": details.pd_detail_id.value,
+            "fk_pd_id": details.fk_pd_id.value,
+            "fk_category_id": details.fk_category_id.value,
+            "fk_question_id": details.fk_question_id.value,
+            "pd_question": details.pd_question.value,
+            "pd_question_weightage": details.pd_question_weightage.value,
+            "question_remark": details.pd_answer_remark.value,
+            "answers": fetchAns,
+            "images": []
+        }];
+        this._pd.savePDQuestions(pd_details).subscribe(result => {
+            if (result.status == 200) {
+                if (type == 1) {
+                    this.skipNextPrevious(this.next);
+                }
+                else {
+                    this.skipNextPrevious(this.previous);
+                }
+            }
+        }, error => {
+        });
+    }
+
+    // skip to previous and next questions
+
+    skipNextPrevious(type: number) {
+        // for skip to next
+        if (type == 1) {
+            if (this.categoryList.length > this.selectedCategoryIndex) {
+                let nextCatList = this.categoryList[this.selectedCategoryIndex];
+                this.selectedQuestionIndex = this.selectedQuestionIndex < nextCatList.questions.length - 1 ? this.selectedQuestionIndex + 1 : this.selectedQuestionIndex;
+                let nextQuesList = nextCatList.questions[this.selectedQuestionIndex];
+                this.selectedCategory = nextQuesList;
+                this.selectedCategoryIndex = this.selectedCategoryIndex;
+                this.selectedQuestionIndex = this.selectedQuestionIndex;
+                let serachQuestions = {
+                    "question_id": nextQuesList.fk_question_id,
+                    "pd_id": this.startPD,
+                    "template_id": nextQuesList.fk_template_id,
+                    "category_id": nextQuesList.fk_template_question_category_id
+                }
+                this.getAnswers(serachQuestions);
+            }
         }
-        else{
-          this.skipNextPrevious(this.previous);
+        // for skip to previous
+        else if (type == 2) {
+            if (this.categoryList.length > this.selectedCategoryIndex) {
+                let preCatList = this.categoryList[this.selectedCategoryIndex];
+                this.selectedQuestionIndex = this.selectedQuestionIndex == 0 ? this.selectedQuestionIndex : this.selectedQuestionIndex - 1;
+                let preQuesList = preCatList.questions[this.selectedQuestionIndex];
+                this.selectedCategory = preQuesList;
+                this.selectedCategoryIndex = this.selectedCategoryIndex;
+                this.selectedQuestionIndex = this.selectedQuestionIndex;
+                let serachQuestions = {
+                    "question_id": preQuesList.fk_question_id,
+                    "pd_id": this.startPD,
+                    "template_id": preQuesList.fk_template_id,
+                    "category_id": preQuesList.fk_template_question_category_id
+                }
+                this.getAnswers(serachQuestions);
+            }
+
         }
-      }
-      }, error => {
-      });
-  }
-  // next save and previous save for  text type questions
-  saveNextPreviousText(details:any, type:number){
-    let fetchAns =[];
-   details.items.value.forEach((itemElement, itemIndex) => {
-    let obj1 =  {
-      fk_pd_detail_id:details.pd_detail_id.value,
-      fk_pd_id:itemElement.fk_pd_id,
-      pd_detail_answer_id: itemElement.pd_detail_answer_id,
-      pd_answer_id: itemElement.pd_answer_id,
-      pd_answer: itemElement.pd_answer,
-      pd_answer_weightage:itemElement.pd_answer_weightage,
     }
-    fetchAns.push(obj1)
-   });
-    let pd_details:any=[{
-      "pd_detail_id":details.pd_detail_id.value,
-      "fk_pd_id":details.fk_pd_id.value,
-      "fk_category_id":details.fk_category_id.value,
-      "fk_question_id":details.fk_question_id.value,
-      "pd_question":details.pd_question.value,
-      "pd_question_weightage":details.pd_question_weightage.value,
-      "question_remark":details.pd_answer_remark.value,  
-      "answers":fetchAns,
-      "images":[]
-    }];
-     this._pd.savePDQuestions(pd_details).subscribe(result => {
-        if (result.status == 200) {
-          if(type==1){
-            this.skipNextPrevious(this.next);
-          }
-          else{
-            this.skipNextPrevious(this.previous);
-          }
-        }
-      }, error => {
-      });
-  }
 
-  // skip to previous and next questions
-
-  skipNextPrevious(type:number){
-    // for skip to next
-    if(type==1){
-      if(this.categoryList.length > this.selectedCategoryIndex ){
-        let nextCatList = this.categoryList[this.selectedCategoryIndex];
-          this.selectedQuestionIndex=this.selectedQuestionIndex < nextCatList.questions.length-1 ? this.selectedQuestionIndex+1 : this.selectedQuestionIndex;
-          let nextQuesList = nextCatList.questions[this.selectedQuestionIndex];
-          this.selectedCategory=nextQuesList;
-          this.selectedCategoryIndex=this.selectedCategoryIndex;
-          this.selectedQuestionIndex=this.selectedQuestionIndex;
-             let serachQuestions = {
-               "question_id":nextQuesList.fk_question_id,
-               "pd_id":this.startPD,
-               "template_id":nextQuesList.fk_template_id,
-               "category_id":nextQuesList.fk_template_question_category_id
-             }
-             this.getAnswers(serachQuestions);
-      }
-    }
-    // for skip to previous
-    else if(type==2){
-      if(this.categoryList.length > this.selectedCategoryIndex ){
-        let preCatList = this.categoryList[this.selectedCategoryIndex];
-          this.selectedQuestionIndex=this.selectedQuestionIndex ==0 ? this.selectedQuestionIndex : this.selectedQuestionIndex-1;
-          let preQuesList = preCatList.questions[this.selectedQuestionIndex];
-          this.selectedCategory=preQuesList;
-          this.selectedCategoryIndex=this.selectedCategoryIndex;
-          this.selectedQuestionIndex=this.selectedQuestionIndex;
-             let serachQuestions = {
-               "question_id":preQuesList.fk_question_id,
-               "pd_id":this.startPD,
-               "template_id":preQuesList.fk_template_id,
-               "category_id":preQuesList.fk_template_question_category_id
-             }
-             this.getAnswers(serachQuestions);
-      }
-
-    }
-  }
-
-  //change pd status
-  changePDStatus(status:string){
+    //change pd status
+    changePDStatus(status: string) {
 
         let update_array = {
-          "pd_id": this.startPD
+            "pd_id": this.startPD
         }
         this._pd.editPdMasterDetails(update_array, status).subscribe(result => {
-          if (result.status == 200) {
-            this.currentPDStatus=this.pdStatusCheck.COMPLETED;
-            this.notifier.notify('success', 'PD Completed.');
-          }
-          else {
-            this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
-          }
+            if (result.status == 200) {
+                this.currentPDStatus = this.pdStatusCheck.COMPLETED;
+                this.notifier.notify('success', 'PD Completed.');
+            }
+            else {
+                this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
+            }
         }, error => {
-          this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
+            this.notifier.notify('warning', 'Something Wents Wrong Try Again.!');
         });
-  }
+    }
 
-  // direct form based questions
-  OnSelectDirectForms(details:any){
-    this.formsCategoryEnable = true;
-    this.selectedFormsCategory = details;
+    // direct form based questions
+    OnSelectDirectForms(details: any) {
+        this.formsCategoryEnable = true;
+        this.selectedFormsCategory = details;
+        if(details.form_id == '4') {
+            let params: any = {};
+            params.pd_id = '250';
+            params.pd_form_id = '250';
+            this._pd.retriveForm(params).subscribe(data => {
+                console.log('data', data);
+                var result = Object.keys(data.records.neighbourhood).map(function(key) {
+                    return data.records.neighbourhood[key];
+                });
+                this.addressForm.controls.address.setValue(data.records.address);
+                this.addressForm.controls.pd_location.setValue(data.records.pd_location);
+                this.addressForm.controls.address_type.setValue(data.records.address_type);
+                this.addressForm.controls.comment_locality.setValue(data.records.comment_locality);
+                this.addressForm.controls.customer_behaviour.setValue(data.records.customer_behaviour);
+                this.addressForm.controls.locality.setValue(data.records.locality);
+                this.addressForm.controls.neighbourhood.setValue(result);
+                console.log('result', result);
+            });
+        }
+        if(details.form_id == '5') {
+            let params: any = {};
+            params.pd_id = '251';
+            params.pd_form_id = '251';
+            this._pd.retriveForm(params).subscribe(data => {
+                console.log('data', data);
+                var result = Object.keys(data.records.non_earning_members).map(function(key) {
+                    return data.records.non_earning_members[key];
+                });
+                var earning = Object.keys(data.records.earning_members).map(function(key) {
+                    return data.records.earning_members[key];
+                });
+                this.familyForm.controls.person.setValue(data.records.person_met);
+                this.familyForm.controls.members.setValue(data.records.family_members);
+                this.familyForm.controls.years.setValue(data.records.no_of_years);
+                this.familyForm.controls.ownership.setValue(data.records.ownership);
+                this.familyForm.controls.rent.setValue(data.records.what_rent);
+                this.familyForm.controls.nonEarningMembers.setValue(result);
+                this.familyForm.controls.earningMembers.setValue(earning);
+                this.familyForm.controls.residence.setValue(residence);
 
-  } 
+            });
+        }
+        if(details.form_id == '6') {
+            let params: any = {};
+            params.pd_id = '252';
+            params.pd_form_id = '252';
+            this._pd.retriveForm(params).subscribe(data => {
+                console.log('data', data);
+                var result = Object.keys(data.records.banking_details).map(function(key) {
+                    return data.records.banking_details[key];
+                });
+                this.bankingForm.controls.itemRows.setValue(result);
+            });
+        }
+    }
+    addNeighbour() {
+        const control = <FormArray>this.addressForm.controls['neighbourhood'];
+        if (control.length <= 1) {
+            control.push(this.createNeighbour());
+        }
+    }
+    removeNeighbour(index) {
+         const control = <FormArray>this.addressForm.controls['neighbourhood'];
+        control.removeAt(index);
+    }
+    addearningMembers() {
+        const control = <FormArray>this.familyForm.controls['earningMembers'];
+        control.push(this.createMembers());
+    }
+    addMembers() {
+        const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
+        control.push(this.createNonMembers());
+    }
+    deleteEarningMembers(index) {
+        const control = <FormArray>this.familyForm.controls['earningMembers'];
+        control.removeAt(index);
+    }
+    deleteMembers(index) {
+        const control = <FormArray>this.familyForm.controls['nonEarningMembers'];
+        control.removeAt(index);
+    }
 
+    getLocation() {
+        let master_name = 'PDLOCATIONAPPROACH';
+        this._pd.getAllMasterDatas(master_name).subscribe(data => {
+            console.log('data', data);
+            data.records.forEach(val => {
+                if (val.isactive == 1) {
+                    this.locationdata.push(val);
+                }
+            })
+        });
+    }
+    getComment() {
+        let master_name = 'COMMENTSONLOCALITY';
+        this._pd.getAllMasterDatas(master_name).subscribe(data => {
+            console.log('data', data);
+            data.records.forEach(val => {
+                if (val.isactive == 1) {
+                    this.commentData.push(val);
+                }
+            })
+        });
+    }
+    getCustomer() {
+        let master_name = 'CUSTOMERBEHAVIOUR';
+        this._pd.getAllMasterDatas(master_name).subscribe(data => {
+            console.log('data', data);
+            data.records.forEach(val => {
+                if (val.isactive == 1) {
+                    this.customerData.push(val);
+                }
+            })
+        });
+    }
+    getRelation() {
+        let master_name = 'RELATIONSHIPS';
+        this._pd.getAllMasterDatas(master_name).subscribe(data => {
+            console.log('data', data);
+            data.records.forEach(val => {
+                if (val.isactive == 1) {
+                    this.relationData.push(val);
+                }
+            })
+        });
+    }
+   getOccupation() {
+        let master_name = 'OCCUPATIONMEMBERS';
+        this._pd.getAllMasterDatas(master_name).subscribe(data => {
+            console.log('data', data);
+            data.records.forEach(val => {
+                if (val.isactive == 1) {
+                    this.occupationData.push(val);
+                }
+            })
+        });
+    }
+    addBankdetails(i) {
+        this.step = i++;
+        const control = <FormArray>this.bankingForm.controls['itemRows'];
+        control.push(this.createBankarray());
+    }
+    deleteBankdetails(index: number) {
+        const control = <FormArray>this.bankingForm.controls['itemRows'];
+        control.removeAt(index);
+    }
+    // load pd view component
+    loadPdViewCompoent() {
+        this.router.navigate(['../../viewpd', this.startPD], {relativeTo: this.route});
+    }
+    onSubmit() {
+        if (!this.addressForm.valid) {
+            this.validateAllFormFields(this.addressForm);
+            return;
+        }
+        console.log('form', this.addressForm.value);
+        let records: any = {};
+        records.address = this.address.value;
+        records.address_type = this.addressType.value;
+        records.locality = this.locality.value;
+        records.pd_location = this.pdLocation.value;
+        records.comment_locality = this.commentlocality.value;
+        records.customer_behaviour = this.commentlocality.value;
+        records.neighbourhood = this.addressForm.value.items;
+        records.pdid = '250';
+        records.formid = '250';
+        records.fk_createdby = '250';
+        console.log('params', records);
+        this._pd.saveForm(records).subscribe(data => {
+            console.log('data', data);
+                let params: any = {};
+                params.pd_id = '250';
+                params.pd_form_id = '250';
+                console.log('param', params);
 
-  // load pd view component
-  loadPdViewCompoent(){
-    this.router.navigate([ '../../viewpd',this.startPD], { relativeTo: this.route });
-
-  }
-
+        });
+    }
+    submitFamily() {
+        if (!this.familyForm.valid) {
+            this.validateAllFormFields(this.familyForm);
+            return;
+        }
+        console.log('data', this.familyForm.value);
+        let records: any = {};
+        records.no_of_years = this.years.value;
+        if (this.ownership.value == 'Others') {
+            records.ownership = this.ownershipOther.value;
+        } else {
+            records.ownership = this.ownership.value;
+        }
+        records.residence = this.residence.value;
+        if (this.ownership.value == 'Rented') {
+            records.what_rent = this.rent.value;
+        }
+        if (this.person.value == 'Other') {
+            records.person_met = this.personOther.value;
+        } else {
+            records.person_met = this.person.value;
+        }
+        records.family_members = this.members.value;
+        records.earning_members = this.familyForm.controls['earningMembers'].value;
+        records.non_earning_members = this.familyForm.controls['nonEarningMembers'].value;
+        records.pdid = '251';
+        records.formid = '251';
+        records.fk_createdby = '251';
+        console.log('params', records);
+        this._pd.saveForm(records).subscribe(data => {
+            console.log('data', data);
+        })
+    }
+    bankSubmit() {
+        if (!this.bankingForm.valid) {
+            this.validateAllFormFields(this.bankingForm);
+            return;
+        }
+        let records: any = {};
+        records.pdid = '252';
+        records.formid = '252';
+        records.fk_createdby = '252';
+        records.banking_details = this.bankingForm.controls['itemRows'].value;
+        console.log('data', records);
+        this._pd.saveForm(records).subscribe(data => {
+            console.log('data', data);
+        })
+    }
+    validateAllFormFields(formGroup: FormGroup) {
+        Object.keys(formGroup.controls).forEach(field => {
+            const control = formGroup.get(field);
+            if (control instanceof FormControl) {
+                control.markAsTouched({onlySelf: true});
+            } else if (control instanceof FormGroup) {
+                this.validateAllFormFields(control);
+            }
+        });
+    }
 
 }
diff --git a/ng6-seed/src/app/personal-discussion/manage-pd/manage-pd.module.ts b/ng6-seed/src/app/personal-discussion/manage-pd/manage-pd.module.ts
index 09047a111..caf1cc177 100644
--- a/ng6-seed/src/app/personal-discussion/manage-pd/manage-pd.module.ts
+++ b/ng6-seed/src/app/personal-discussion/manage-pd/manage-pd.module.ts
@@ -1,123 +1,130 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
+import {NgModule} from '@angular/core';
+import {CommonModule} from '@angular/common';
 import {
-  MatCardModule,
-  MatIconModule,
-  MatInputModule,
-  MatRadioModule, 
-  MatButtonModule,MatTableModule,MatPaginatorModule,
-  MatProgressBarModule,MatDialogModule, MatSortModule,
-  MatToolbarModule,MatSelectModule, MatListModule, MatGridListModule, MatTabsModule, MatCheckboxModule, MatBadgeModule, MatExpansionModule, MatStepperModule ,MatSidenavModule ,MatMenuModule, MatButtonToggleModule } from '@angular/material';
-import {MatSlideToggleModule} from '@angular/material/slide-toggle';
-import { FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { FileUploadModule } from 'ng2-file-upload/ng2-file-upload';
-import { TreeModule } from 'angular-tree-component';
-import { NgxDatatableModule } from '@swimlane/ngx-datatable';
-import { FlexLayoutModule } from '@angular/flex-layout';
-import { MatTooltipModule } from '@angular/material/tooltip';
-
-import { NgxMatSelectSearchModule } from 'ngx-mat-select-search';
-import 'hammerjs';
-import { NotifierModule, NotifierOptions } from 'angular-notifier';
-import { OwlDateTimeModule, OwlNativeDateTimeModule } from 'ng-pick-datetime';
-
-import { AgmCoreModule } from '@agm/core';
-import { ManagePdRoutingModule } from './manage-pd.routing';
-import { ListPdComponent } from './list-pd/list-pd.component';
-import { ManagePdComponent } from './manage-pd.component';
-import { MapPdViewComponent } from './list-pd/map-pd-view/map-pd-view.component';
-import { AddPdComponent } from '../manage-pd/list-pd/add-pd/add-pd.component';
-import { ViewPdComponent } from '../manage-pd/list-pd/view-pd/view-pd.component';
-import { PdAllocationComponent } from '../manage-pd/list-pd/pd-allocation/pd-allocation.component';
-import { SmartPdAllocationComponent } from './list-pd/smart-pd-allocation/smart-pd-allocation.component';
-import { PdTrigerService } from '../pd-service/pd-triger.service';
-import { GetGeometricLocationService } from '../location-service/get-geometric-location.service';
-import { SchedulePdComponent } from './list-pd/schedule-pd/schedule-pd.component';
-import { EditPdApplicantComponent } from './list-pd/edit-pd-applicant/edit-pd-applicant.component';
-import { EditPdMasterComponent } from './list-pd/edit-pd-master/edit-pd-master.component';
-import { StartPdComponent } from './list-pd/start-pd/start-pd.component';
-import { InprogressPdComponent } from './list-pd/inprogress-pd/inprogress-pd.component';
-import { AllPdComponent } from './list-pd/all-pd/all-pd.component';
-import { ScheduledPdComponent } from './list-pd/scheduled-pd/scheduled-pd.component';
-import { CompletedPdComponent } from './list-pd/completed-pd/completed-pd.component';
-import { QcCompletedPdComponent } from './list-pd/qc-completed-pd/qc-completed-pd.component';
-
-import { ClientInfoComponent } from './list-pd/start-pd/forms/client-info/client-info.component';
-import { SupplierInfoComponent } from './list-pd/start-pd/forms/supplier-info/supplier-info.component';
-import { PersonalInfoComponent } from './list-pd/start-pd/forms/personal-info/personal-info.component';
-/**
- * Custom angular notifier options
- */
-const pdCustomNotifierOptions: NotifierOptions = {
-  position: {
-		horizontal: {
-			position: 'right',
-			distance: 12
-		},
-		vertical: {
-			position: 'top',
-			distance: 32,
-			gap: 10
-		}
-	},
-  theme: 'material',
-  behaviour: {
-    autoHide: 5000,
-    onClick: 'hide',
-    onMouseover: 'pauseAutoHide',
-    showDismissButton: true,
-    stacking: 4
-  },
-  animations: {
-    enabled: true,
-    show: {
-      preset: 'slide',
-      speed: 300,
-      easing: 'ease'
-    },
-    hide: {
-      preset: 'fade',
-      speed: 300,
-      easing: 'ease',
-      offset: 50
-    },
-    shift: {
-      speed: 300,
-      easing: 'ease'
-    },
-    overlap: 150
-  }
-};
-
-@NgModule({
-  imports: [
-    CommonModule,
-    ManagePdRoutingModule,
-    NotifierModule.withConfig(pdCustomNotifierOptions),
     MatCardModule,
     MatIconModule,
     MatInputModule,
     MatRadioModule,
-    MatTableModule,
-    MatPaginatorModule,
-    MatButtonModule,
-    MatProgressBarModule,
-    MatToolbarModule,
-    FlexLayoutModule,
-    NgxDatatableModule,
-    FormsModule,MatSlideToggleModule,
-    MatSelectModule, MatListModule,MatGridListModule, MatTabsModule, MatBadgeModule, MatCheckboxModule,MatStepperModule,MatSidenavModule ,MatMenuModule, MatButtonToggleModule,
-    ReactiveFormsModule,
-    FileUploadModule,
-    TreeModule,
-    MatDialogModule,MatSortModule,
-    NgxMatSelectSearchModule,MatTooltipModule, MatExpansionModule,
-    AgmCoreModule.forRoot({apiKey: 'AIzaSyBtdO5k6CRntAMJCF-H5uZjTCoSGX95cdk'}),OwlDateTimeModule, 
-         OwlNativeDateTimeModule,
-  ],
-  declarations: [ListPdComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent],
-  exports: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent],
-  providers: [PdTrigerService, GetGeometricLocationService],
-  entryComponents: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent]
+    MatButtonModule, MatTableModule, MatPaginatorModule,
+    MatProgressBarModule, MatDialogModule, MatSortModule,
+    MatToolbarModule, MatSelectModule, MatListModule, MatGridListModule, MatTabsModule, MatCheckboxModule,
+    MatBadgeModule, MatExpansionModule, MatStepperModule, MatSidenavModule, MatMenuModule, MatButtonToggleModule,
+    MatAutocompleteModule
+} from '@angular/material';
+import {MatSlideToggleModule} from '@angular/material/slide-toggle';
+import {FormsModule, ReactiveFormsModule} from '@angular/forms';
+import {FileUploadModule} from 'ng2-file-upload/ng2-file-upload';
+import {TreeModule} from 'angular-tree-component';
+import {NgxDatatableModule} from '@swimlane/ngx-datatable';
+import {FlexLayoutModule} from '@angular/flex-layout';
+import {MatTooltipModule} from '@angular/material/tooltip';
+
+import {NgxMatSelectSearchModule} from 'ngx-mat-select-search';
+import 'hammerjs';
+import {NotifierModule, NotifierOptions} from 'angular-notifier';
+import {OwlDateTimeModule, OwlNativeDateTimeModule} from 'ng-pick-datetime';
+
+import {AgmCoreModule} from '@agm/core';
+import {ManagePdRoutingModule} from './manage-pd.routing';
+import {ListPdComponent} from './list-pd/list-pd.component';
+import {ManagePdComponent} from './manage-pd.component';
+import {MapPdViewComponent} from './list-pd/map-pd-view/map-pd-view.component';
+import {AddPdComponent} from '../manage-pd/list-pd/add-pd/add-pd.component';
+import {ViewPdComponent} from '../manage-pd/list-pd/view-pd/view-pd.component';
+import {PdAllocationComponent} from '../manage-pd/list-pd/pd-allocation/pd-allocation.component';
+import {SmartPdAllocationComponent} from './list-pd/smart-pd-allocation/smart-pd-allocation.component';
+import {PdTrigerService} from '../pd-service/pd-triger.service';
+import {GetGeometricLocationService} from '../location-service/get-geometric-location.service';
+import {SchedulePdComponent} from './list-pd/schedule-pd/schedule-pd.component';
+import {EditPdApplicantComponent} from './list-pd/edit-pd-applicant/edit-pd-applicant.component';
+import {EditPdMasterComponent} from './list-pd/edit-pd-master/edit-pd-master.component';
+import {StartPdComponent} from './list-pd/start-pd/start-pd.component';
+import {InprogressPdComponent} from './list-pd/inprogress-pd/inprogress-pd.component';
+import {AllPdComponent} from './list-pd/all-pd/all-pd.component';
+import {ScheduledPdComponent} from './list-pd/scheduled-pd/scheduled-pd.component';
+import {CompletedPdComponent} from './list-pd/completed-pd/completed-pd.component';
+import {QcCompletedPdComponent} from './list-pd/qc-completed-pd/qc-completed-pd.component';
+
+import {ClientInfoComponent} from './list-pd/start-pd/forms/client-info/client-info.component';
+import {SupplierInfoComponent} from './list-pd/start-pd/forms/supplier-info/supplier-info.component';
+import {PersonalInfoComponent} from './list-pd/start-pd/forms/personal-info/personal-info.component';
+
+/**
+ * Custom angular notifier options
+ */
+const pdCustomNotifierOptions: NotifierOptions = {
+    position: {
+        horizontal: {
+            position: 'right',
+            distance: 12
+        },
+        vertical: {
+            position: 'top',
+            distance: 32,
+            gap: 10
+        }
+    },
+    theme: 'material',
+    behaviour: {
+        autoHide: 5000,
+        onClick: 'hide',
+        onMouseover: 'pauseAutoHide',
+        showDismissButton: true,
+        stacking: 4
+    },
+    animations: {
+        enabled: true,
+        show: {
+            preset: 'slide',
+            speed: 300,
+            easing: 'ease'
+        },
+        hide: {
+            preset: 'fade',
+            speed: 300,
+            easing: 'ease',
+            offset: 50
+        },
+        shift: {
+            speed: 300,
+            easing: 'ease'
+        },
+        overlap: 150
+    }
+};
+
+@NgModule({
+    imports: [
+        CommonModule,
+        ManagePdRoutingModule,
+        NotifierModule.withConfig(pdCustomNotifierOptions),
+        MatCardModule,
+        MatIconModule,
+        MatInputModule,
+        MatRadioModule,
+        MatTableModule,
+        MatPaginatorModule,
+        MatButtonModule,
+        MatProgressBarModule,
+        MatAutocompleteModule,
+        MatToolbarModule,
+        FlexLayoutModule,
+        NgxDatatableModule,
+        FormsModule,
+        MatSlideToggleModule,
+        MatSelectModule, MatListModule, MatGridListModule, MatTabsModule, MatBadgeModule, MatCheckboxModule, MatStepperModule, MatSidenavModule, MatMenuModule, MatButtonToggleModule,
+        ReactiveFormsModule,
+        FileUploadModule,
+        TreeModule,
+        MatDialogModule, MatSortModule,
+        NgxMatSelectSearchModule, MatTooltipModule, MatExpansionModule,
+        AgmCoreModule.forRoot({apiKey: 'AIzaSyBtdO5k6CRntAMJCF-H5uZjTCoSGX95cdk'}), OwlDateTimeModule,
+        OwlNativeDateTimeModule,
+    ],
+    declarations: [ListPdComponent, ManagePdComponent, MapPdViewComponent, AddPdComponent, ViewPdComponent, PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, InprogressPdComponent, AllPdComponent, ScheduledPdComponent, CompletedPdComponent, QcCompletedPdComponent, ClientInfoComponent, SupplierInfoComponent, PersonalInfoComponent],
+    exports: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent, StartPdComponent, CompletedPdComponent, QcCompletedPdComponent],
+    providers: [PdTrigerService, GetGeometricLocationService],
+    entryComponents: [PdAllocationComponent, SmartPdAllocationComponent, SchedulePdComponent, EditPdApplicantComponent, EditPdMasterComponent]
 })
-export class ManagePdModule { }
+export class ManagePdModule {
+}
diff --git a/ng6-seed/src/app/personal-discussion/pd-service/pd-triger.service.ts b/ng6-seed/src/app/personal-discussion/pd-service/pd-triger.service.ts
index 33b989c0c..5923fb2ae 100644
--- a/ng6-seed/src/app/personal-discussion/pd-service/pd-triger.service.ts
+++ b/ng6-seed/src/app/personal-discussion/pd-service/pd-triger.service.ts
@@ -1,210 +1,241 @@
 /** Common Import Section */
-import { Injectable } from '@angular/core';
-import { Observable } from 'rxjs';//for Datatables
-import { HttpClient,HttpParams } from '@angular/common/http';
-import { catchError, map } from 'rxjs/operators';
-import { of } from 'rxjs';
+import {Injectable} from '@angular/core';
+import {Observable} from 'rxjs';//for Datatables
+import {HttpClient, HttpParams} from '@angular/common/http';
+import {catchError, map} from 'rxjs/operators';
+import {of} from 'rxjs';
 
 /** Imported Service Files Are., */
-import { AwsService } from '../../AwsService/aws.service';
+import {AwsService} from '../../AwsService/aws.service';
 
 /** Environment */
-import { environment } from 'environments/environment'
+import {environment} from 'environments/environment'
+
+const currentdate = new Date().toJSON().slice(0, 19).replace('T', ' ');
 
-const currentdate = new Date().toJSON().slice(0,19).replace('T',' ');
 /** Master Interface  */
 export interface Master {
-  master_id:number;
-  master_name:string;
-  constant_name:string;
+    master_id: number;
+    master_name: string;
+    constant_name: string;
 }
+
 @Injectable()
 
 
 export class PdTrigerService {
 
-  //private  apiUrl = "http://ssa.sineedge.com/sparqapi/api/";
-  //private  apiUrl = "http://192.168.0.5:9999/AWSEC2/sparqapi/api/";
-  //private  apiUrl = "http://ssa.sineedge.com/sparqapi/api/";
-  private apiUrl = environment.apiEndpoint;
-  MAP_API_KEY: string;
-  MAP_API_URL: string;
-  constructor(private _http: HttpClient,
-              private _aws:AwsService) { 
-                this.MAP_API_KEY = 'AIzaSyBtdO5k6CRntAMJCF-H5uZjTCoSGX95cdk'
-                this.MAP_API_URL = `https://maps.googleapis.com/maps/api/geocode/json?key=${this.MAP_API_KEY}&address=`;
-              }
-  // get add pd master details            
-  getAllMasterDatas(TableName:string): Observable<any> {
-    return this._http.post<any>(this.apiUrl+'getListOfMaster', { "master_name":TableName })
-    .pipe(
-      catchError(this.handleError('role', []))
-    )
-  }
-  //get product and subproduct master details
-  getProductsDetails(): Observable<any> {
-    return this._http.get<any>(this.apiUrl+'getListOfProducts')
-    .pipe(
-      catchError(this.handleError('role', []))
-    )
-  }
-  // get lenders list
-  getLenderDetails(): Observable<any> {
-    return this._http.get<any>(this.apiUrl+'getListOfLenders')
-    .pipe(
-      catchError(this.handleError('role', []))
-    )
-  }
-  // get customers list
-  getCustomersDetails(): Observable<any> {
-    return this._http.get<any>(this.apiUrl+'getListOfCustomerSegments')
-    .pipe(
-      catchError(this.handleError('role', []))
-    )
-  }
-   // get Pd Allocation type details list
-   getPDAllocationDetails(): Observable<any> {
-    return this._http.get<any>(this.apiUrl+'getListOfPDAllocationTypes')
-    .pipe(
-      catchError(this.handleError('role', []))
-    )
-  }
-   // get state and city details
-   getStateCityDetails(): Observable<any> {
-    return this._http.get<any>(this.apiUrl+'getListOfStatesAndCities')
-    .pipe(
-      catchError(this.handleError('role', []))
-    )
-  }
-  // get pd type and allocation type details
-  getPDTypeDetails():Observable<any> {
-    return this._http.get<any>(this.apiUrl+'getListOfPDAllocationTypes')
-    .pipe(
-      catchError(this.handleError('role', []))
-    )
-  }
-  // add pd details
-  addPdDetails(pdForm: any): Observable<any> {
-    return this._http.post<any>(this.apiUrl+"triggerNewPD", pdForm)
-    .pipe(
-           catchError(this.handleError('operation', []))
-         )
-      }
-      // get pd details
-      getPdDetails(): Observable<any> {
-        return this._http.get<any>(this.apiUrl+"listLessPDDetails/get")
-        .pipe(
-               catchError(this.handleError('operation', []))
-      )
-  }
+    // private  apiUrl = "http://ssa.sineedge.com/sparqapi/api/";
+    // private  apiUrl = "http://192.168.0.5:9999/AWSEC2/sparqapi/api/";
+    MAP_API_KEY: string;
+    MAP_API_URL: string;
+    // private  apiUrl = "http://ssa.sineedge.com/sparqapi/api/";
+    private apiUrl = environment.apiEndpoint;
 
-  // get status based pd list
-    getTabStatusPdDetails(status:string): Observable<any> {
-      const tabStatus = status ?
-      { params: new HttpParams().set('status', status) } : {};
-      return this._http.get<any[]>(this.apiUrl+"listLessPDDetails/get",tabStatus)
-      .pipe(
-             catchError(this.handleError('operation', []))
-    )
-}
+    constructor(private _http: HttpClient,
+                private _aws: AwsService) {
+        this.MAP_API_KEY = 'AIzaSyBtdO5k6CRntAMJCF-H5uZjTCoSGX95cdk'
+        this.MAP_API_URL = `https://maps.googleapis.com/maps/api/geocode/json?key=${this.MAP_API_KEY}&address=`;
+    }
 
-  // get edit row pd details
-  editPdDetails(editId:string):Observable<any>{
-    let httpParams = new HttpParams().set('pdid', editId);
-    return this._http.post<any>(this.apiUrl+"getFullPDDetails",httpParams)
-    .pipe(
-            catchError(this.handleError('operation', []))
-          )
-      }
-      // update pd master details
-      editPdMasterDetails(editData:any,status:string):Observable<any>{
+    // get add pd master details
+    getAllMasterDatas(TableName: string): Observable<any> {
+        console.log('table', TableName);
+        return this._http.post(this.apiUrl + 'getListOfMaster', {"master_name": TableName})
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+    saveForm(records): Observable<any> {
+        console.log('table', records);
+        let params = {records}
+        return this._http.post(this.apiUrl + 'savePDFormDetails', params)
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+    retriveForm(params): Observable<any> {
+        console.log('data', params);
+        return this._http.post(this.apiUrl + 'getPDFormDetails', params)
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+
+    //get product and subproduct master details
+    getProductsDetails(): Observable<any> {
+        return this._http.get<any>(this.apiUrl + 'getListOfProducts')
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+
+    // get lenders list
+    getLenderDetails(): Observable<any> {
+        return this._http.get<any>(this.apiUrl + 'getListOfLenders')
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+
+    // get customers list
+    getCustomersDetails(): Observable<any> {
+        return this._http.get<any>(this.apiUrl + 'getListOfCustomerSegments')
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+
+    // get Pd Allocation type details list
+    getPDAllocationDetails(): Observable<any> {
+        return this._http.get<any>(this.apiUrl + 'getListOfPDAllocationTypes')
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+
+    // get state and city details
+    getStateCityDetails(): Observable<any> {
+        return this._http.get<any>(this.apiUrl + 'getListOfStatesAndCities')
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+
+    // get pd type and allocation type details
+    getPDTypeDetails(): Observable<any> {
+        return this._http.get<any>(this.apiUrl + 'getListOfPDAllocationTypes')
+            .pipe(
+                catchError(this.handleError('role', []))
+            )
+    }
+
+    // add pd details
+    addPdDetails(pdForm: any): Observable<any> {
+        return this._http.post<any>(this.apiUrl + "triggerNewPD", pdForm)
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    // get pd details
+    getPdDetails(): Observable<any> {
+        return this._http.get<any>(this.apiUrl + "listLessPDDetails/get")
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    // get status based pd list
+    getTabStatusPdDetails(status: string): Observable<any> {
+        const tabStatus = status ?
+            {params: new HttpParams().set('status', status)} : {};
+        return this._http.get<any[]>(this.apiUrl + "listLessPDDetails/get", tabStatus)
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    // get edit row pd details
+    editPdDetails(editId: string): Observable<any> {
+        let httpParams = new HttpParams().set('pdid', editId);
+        return this._http.post<any>(this.apiUrl + "getFullPDDetails", httpParams)
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    // update pd master details
+    editPdMasterDetails(editData: any, status: string): Observable<any> {
         editData.pd_status = status;
         editData.fk_updatedby = this._aws.getlocale();
         editData.updatedon = currentdate;
-        return this._http.post<any>(this.apiUrl+"updatePDMaster",{records:editData})
-
-        .pipe(
-                catchError(this.handleError('operation', []))
-              )
-          }
-          // update pd applicant 
-          updatePdApplicant(editData:any):Observable<any>{
-            // editData.fk_updatedby = this._aws.getlocale();
-            // editData.updatedon = currentdate;
-            return this._http.post<any>(this.apiUrl+"updatePDApplicants",{"pd_applicant_details":editData})
+        return this._http.post<any>(this.apiUrl + "updatePDMaster", {records: editData})
 
             .pipe(
-                    catchError(this.handleError('operation', []))
-                  )
-              }
-          
-        // get pd allocation to details
-        getPdOfficerList(pdID:string): Observable<any> {
-          return this._http.post<any>(this.apiUrl+"getListPDOfficers",{"pdid":pdID})
-          .pipe(
-                  catchError(this.handleError('operation', []))
-                )
-          }
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    // update pd applicant
+    updatePdApplicant(editData: any): Observable<any> {
+        // editData.fk_updatedby = this._aws.getlocale();
+        // editData.updatedon = currentdate;
+        return this._http.post<any>(this.apiUrl + "updatePDApplicants", {"pd_applicant_details": editData})
+
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    // get pd allocation to details
+    getPdOfficerList(pdID: string): Observable<any> {
+        return this._http.post<any>(this.apiUrl + "getListPDOfficers", {"pdid": pdID})
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
     // update pd officer
     updatePdOfficer(updateData: any): Observable<any> {
-    updateData.fk_updatedby = this._aws.getlocale();
-    updateData.updatedon = currentdate;
-    return this._http.post<any>(this.apiUrl+"allocatePD",{"records":updateData})
-    .pipe(
-        catchError(this.handleError('operation', []))
-      )
+        updateData.fk_updatedby = this._aws.getlocale();
+        updateData.updatedon = currentdate;
+        return this._http.post<any>(this.apiUrl + "allocatePD", {"records": updateData})
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
     }
-  
+
     // update pd schedule
     updateSchedule(updateData: any): Observable<any> {
-    updateData.fk_scheduled_by = this._aws.getlocale();
-    updateData.createdon = currentdate;
-    return this._http.post<any>(this.apiUrl+"schdulePD",{"records":updateData})
-    .pipe(
-        catchError(this.handleError('operation', []))
-      )
+        updateData.fk_scheduled_by = this._aws.getlocale();
+        updateData.createdon = currentdate;
+        return this._http.post<any>(this.apiUrl + "schdulePD", {"records": updateData})
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
     }
 
     //load pd template details
-    loadPDTemplates(pdId: string):Observable<any>{
-      const options = pdId ?
-   { params: new HttpParams().set('pd_id', pdId) } : {};
-   return this._http.get<any[]>(this.apiUrl + "loadFullTemplate",options)
-   .pipe(
-    catchError(this.handleError('operation', []))
-  )
-  }
+    loadPDTemplates(pdId: string): Observable<any> {
+        const options = pdId ?
+            {params: new HttpParams().set('pd_id', pdId)} : {};
+        return this._http.get<any[]>(this.apiUrl + "loadFullTemplate", options)
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
 
-  // load PD question answers
-  getAnswersForPD(list: any):Observable<any>{
-    let httpParams = new HttpParams();
-     httpParams = httpParams.append("category_id", list.category_id);
-     httpParams = httpParams.append("pd_id", list.pd_id);
-     httpParams = httpParams.append("question_id", list.question_id);
-     httpParams = httpParams.append("template_id", list.template_id);
+    // load PD question answers
+    getAnswersForPD(list: any): Observable<any> {
+        let httpParams = new HttpParams();
+        httpParams = httpParams.append("category_id", list.category_id);
+        httpParams = httpParams.append("pd_id", list.pd_id);
+        httpParams = httpParams.append("question_id", list.question_id);
+        httpParams = httpParams.append("template_id", list.template_id);
 
- return this._http.post<any[]>(this.apiUrl + "getAnswersForPD",httpParams)
- .pipe(
-  catchError(this.handleError('operation', []))
-)
-}
-
-  // save pd answers
-  savePDQuestions(saveData: any): Observable<any> {
-    saveData.createdby = this._aws.getlocale();
-    saveData.fk_createdon = currentdate;
-   // saveData[0].fk_updatedby = this._aws.getlocale();
-   // saveData[0].updatedon = currentdate;
-
-  return this._http.post<any>(this.apiUrl+"savePDQuestions",{"records":saveData})
-  .pipe(
-      catchError(this.handleError('operation', []))
-    )
-  }
-
-  private handleError<T>(operation = 'operation', result?: T) {
-    return (error: any): Observable<T> => {
-      return of(result as T);
-    };
-  }
+        return this._http.post<any[]>(this.apiUrl + "getAnswersForPD", httpParams)
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    // save pd answers
+    savePDQuestions(saveData: any): Observable<any> {
+        saveData.createdby = this._aws.getlocale();
+        saveData.fk_createdon = currentdate;
+        // saveData[0].fk_updatedby = this._aws.getlocale();
+        // saveData[0].updatedon = currentdate;
+
+        return this._http.post<any>(this.apiUrl + "savePDQuestions", {"records": saveData})
+            .pipe(
+                catchError(this.handleError('operation', []))
+            )
+    }
+
+    private handleError<T>(operation = 'operation', result?: T) {
+        return (error: any): Observable<T> => {
+            return of(result as T);
+        };
+    }
 }

From a68be768448ab3e23361a1a06370edd0c36879a3 Mon Sep 17 00:00:00 2001
From: dineshkumarkannan <dineshmail.kannan@gmail.com>
Date: Thu, 8 Nov 2018 17:02:56 +0530
Subject: [PATCH 2/2] question mater changes : kdk

---
 .../src/app/template/questions/add/add.component.html     | 8 ++++----
 ng6-seed/src/app/template/questions/add/add.component.ts  | 4 ++--
 2 files changed, 6 insertions(+), 6 deletions(-)

diff --git a/ng6-seed/src/app/template/questions/add/add.component.html b/ng6-seed/src/app/template/questions/add/add.component.html
index daa410b1d..433d85fc7 100644
--- a/ng6-seed/src/app/template/questions/add/add.component.html
+++ b/ng6-seed/src/app/template/questions/add/add.component.html
@@ -13,14 +13,14 @@
             <mat-error *ngIf="submitted && f.fk_question_category.hasError('required')" class="mat-text-warn">You must Select Category.</mat-error>
           </mat-form-field>
         </div>
-        <div fxFlex="50">
+        <!--<div fxFlex="50">
           <mat-form-field>
             <mat-select placeholder="Select Group" formControlName="fk_question_group_id">
               <mat-option *ngFor="let gp of m_group" [value]="gp.question_group_id">{{ gp.group_name }}</mat-option>
             </mat-select>
             <mat-error *ngIf="submitted && f.fk_question_group_id.hasError('required')" class="mat-text-warn">You must Select Group.</mat-error>
           </mat-form-field>
-        </div>
+        </div>-->
       </div>
       <div fxLayout="row" fxLayoutAlign="start none">
         <div class="example-full-width">
@@ -58,13 +58,13 @@
                     <textarea matInput placeholder="Answer" formControlName="answer"></textarea>
                   </mat-form-field>
                 </div>
-                <div fxFlex="30">
+                <!--<div fxFlex="30">
                   <mat-form-field>
                     <mat-select placeholder="Select Group" formControlName="fk_question_group_id">
                       <mat-option *ngFor="let gp of m_group" [value]="gp.question_group_id">{{ gp.group_name }}</mat-option>
                     </mat-select>
                     </mat-form-field>
-                </div>
+                </div>-->
                 <div fxFlex="20">
                   <span *ngIf="_addQuesFrom.controls.answers.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>
diff --git a/ng6-seed/src/app/template/questions/add/add.component.ts b/ng6-seed/src/app/template/questions/add/add.component.ts
index 3a5968b3b..d0977dcbb 100644
--- a/ng6-seed/src/app/template/questions/add/add.component.ts
+++ b/ng6-seed/src/app/template/questions/add/add.component.ts
@@ -63,7 +63,7 @@ export class AddComponent implements OnInit {
       question: [null, Validators.compose([Validators.required])],
       description: [null, Validators.compose([Validators.required])],
       fk_question_category: [null, Validators.compose([Validators.required])],
-      fk_question_group_id: [null, Validators.compose([Validators.required])],
+      // fk_question_group_id: [null, Validators.compose([Validators.required])],
       fk_question_answertype: [null, Validators.compose([Validators.required])],
       answers: this._formBuilder.array([
         this.initAnswers(),
@@ -82,7 +82,7 @@ export class AddComponent implements OnInit {
   initAnswers() {
     return this._formBuilder.group({
       answer: ['', Validators.compose([Validators.required])],
-      fk_question_group_id: ['']
+      // fk_question_group_id: ['']
     });
   }
   addLanguage(e) {