Fairoj : Employer info image capture functionality and validation and some improvements

ng6-seed/src/app/layouts/admin/admin-layout.component.ts

@@ -291,7 +291,7 @@ export class AdminLayoutComponent implements OnInit, OnDestroy {
   menunav(active){
     switch(active){
         case 'HOME':
-          if(this.pdTriggerService.customer_url_data && this.pdTriggerService.customer_url_data.pdid && this.pdTriggerService.customer_url_data.rdmstr) {
+          if(this.pdTriggerService.customer_url_data && this.pdTriggerService.customer_url_data.pdid && this.pdTriggerService.customer_url_data.rdmstr && this.pdTriggerService.customer_url_data.from == 'link') {
             let data= this.pdTriggerService.customer_url_data
             this.router.navigateByUrl('/personal_discussion/pdlist/viewpd?str='+data.pdid+'/'+data.rdmstr+'/link', {replaceUrl: true});
            

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/pd-questions/dynamic-docs-form/dynamic-docs-form.component.html

@@ -21,7 +21,9 @@
                   <div *ngIf="item.controls['img'] && item.value.img != ''">
                       <img [src]="item.value.img" ngxViewer style="width:85px; height: 85px;float:right">
                     </div>
+                    <span (click)="capture($event,i,item)">
                     <app-capture-btn addMoreBtn="true" *ngIf="camera_btn[i] == true" class="file-btn"  (imageDataEmitter)="capture($event,i,item)"></app-capture-btn>
+                    </span>
                     <!-- <div style="width: 100%"> -->
                   <!-- <ion-buttons slot="end"> -->
                   <!-- <ion-button style="color:#E00201" *ngIf="camera_btn[i] == true"  slot="end" fill="clear" size="small"  class="ion-float-right" (click)="capture(i,item)"><ion-icon style="font-size:30px;float:right;" name="camera"></ion-icon></ion-button> -->

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/pd-questions/dynamic-docs-form/dynamic-docs-form.component.scss

@@ -14,4 +14,43 @@ input{
   .mat-input-placeholder {
     white-space: normal;
   }
+  @-webkit-keyframes highlight-fade {
+    0% {
+        background: orange;
+    }
+    100% {
+        background: white;
+    }
+  }
+  @-moz-keyframes highlight-fade {
+    0% {
+        background: orange;
+    }
+    100% {
+        background: white;
+    }
+  }
+  @-ms-keyframes highlight-fade {
+    0% {
+        background: orange;
+    }
+    100% {
+        background: white;
+    }
+  }
+  @keyframes highlight-fade {
+    0% {
+        background: orange;
+    }
+    100% {
+        background: white;
+    }
+  }
+  .field_highlight {
+    -webkit-animation: highlight-fade 4s ease-out;
+    -moz-animation: highlight-fade 4s ease-out;
+    -o-animation: highlight-fade 4s ease-out;
+    animation: highlight-fade 4s ease-out;
+    // background: blue;
+  }
   

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/pd-questions/dynamic-docs-form/dynamic-docs-form.component.ts

@@ -75,10 +75,15 @@ export class DynamicDocsFormComponent implements OnInit {
       }
   
     }
-    // capture(index,item_obj) {
+    capture(event,index,item_obj) {
-    //   item_obj.controls['is_new'].setValue(1);
+      item_obj.controls['is_new'].setValue(1);
-    //   this.eventCapturePic.emit({controls:item_obj.controls['img'],img_name:item_obj.value.placeholder,form_id:'24'})
+      this.eventCapturePic.emit({controls:item_obj.controls['img'],img_name:item_obj.value.placeholder,form_id:'24'})
-    // }
+    }
+    captureI(event){
+      event.preventDefault();
+      let element:HTMLElement = document.getElementById('input-file') as HTMLElement
+      element.click();
+    }
   
 
 }

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/pd-questions/employer-info/employer-info.component.html

@@ -39,7 +39,7 @@
            <span style="font-size: 13px;margin-right: 2px">Not Met</span> 
          <mat-slide-toggle
          class="example-margin"
-         formControlName="is_person_met">
+         formControlName="is_person_met" (change)="checkPartEnable(1);dynamicOnChangeValidations($event.checked,[applicant.controls['is_person_met_pic'],applicant.controls['is_person_met_id_proof']],true)">
         
      </mat-slide-toggle>
      <span style="font-size: 13px;margin-left: 2px">Met</span> 
@@ -48,14 +48,16 @@
  </div><br/>
    <div *ngIf="applicant.value.is_person_met == true">
       <div fxLayout="row" fxLayoutAlign="space-evenly">
-         <div fxLayout="column" align="center" >
+         <div fxLayout="column" align="center" fxLayoutAlign="center">
              <!-- <ion-thumbnail slot="center"> -->
-                <div fxLayout="row" align="center">
+                <div fxLayout="row" fxLayoutAlign="center center">
              <img  ngxViewer text="PD Photos" title="Person Met Pic" class="ion-text-center" *ngIf="applicant.value.is_person_met_pic != ''"
              src="{{applicant.value.is_person_met_pic}}" style="max-width: 70px;max-height: 70px" >
           </div>
              <!-- </ion-thumbnail> -->
-             <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="saveApplicantInfo($event,applicant,'is_person_met_pic')"></app-capture-btn>
+             <span (click)="captureControls(applicant, 'is_person_met_pic','','saveApplicantInfo')">
+             <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,'','is_person_met_pic')"></app-capture-btn>
+            </span>
            <!-- <ion-button (click)="saveApplicantInfo(applicant,'is_person_met_pic')"
             fill="clear" ><ion-icon style="font-size: 30px" name="camera"></ion-icon></ion-button><br/> -->
            <mat-label>Selfie of the Person Met</mat-label>
@@ -65,13 +67,15 @@
              <img ngxViewer text="PD Photos" title="ID Proof" class="ion-text-center" *ngIf="applicant.value.is_person_met_id_proof != ''"
              src="{{applicant.value.is_person_met_id_proof}}" style="max-width: 70px;max-height: 70px" >
             </div>
-            <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="saveApplicantInfo($event,applicant,'is_person_met_id_proof')"></app-capture-btn>
+            <span (click)="captureControls(applicant, 'is_person_met_id_proof','','saveApplicantInfo')">
+            <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,applicant,'is_person_met_id_proof')"></app-capture-btn>
+          </span>
              <!-- <ion-button
              (click)="saveApplicantInfo(applicant,'is_person_met_id_proof')"
               fill="clear" ><ion-icon style="font-size: 30px" name="camera"></ion-icon></ion-button><br/> -->
              <mat-label>ID Proof of the person</mat-label>
            </div>
-      </div>
+      </div><br/><br/>
      </div>
      <hr style="    width: 100%;
      background-color: #dcd7d7;
@@ -80,7 +84,7 @@
   </div>
   
  </div>
-      <mat-form-field appearance="fill">
+      <mat-form-field >
         <mat-label>Is the Employer/ Manager available during FI visit?</mat-label>
         <mat-select formControlName="is_employer_available">
           <mat-option>Select</mat-option>
@@ -92,7 +96,7 @@
        Required</mat-error>
       </mat-form-field>
 
-      <mat-form-field appearance="fill" *ngIf="checkPartEnable(2)">
+      <mat-form-field  *ngIf="checkPartEnable(2)">
         <mat-label>Anyone met during FI visit at initiated address?</mat-label>
         <mat-select formControlName="is_met_during_visit">
             <mat-option>Select</mat-option>
@@ -106,7 +110,7 @@
       <div *ngIf="checkPartEnable(1)">
         <div fxLayout="row">
           <div fxLayout="column" fxFlex="85%">
-            <mat-form-field appearance="fill">
+            <mat-form-field >
               <mat-label>Name of Person Met</mat-label>
               <input matInput type="text" formControlName="person_met_entered" />
               <mat-error align="end" style="font-size:13px"
@@ -121,7 +125,9 @@
                 src="{{getQuestionControl().at(0).value.person_met_entered_pic}}"
                 style="max-width: 80px;max-height: 80px">
             </div>
+            <span (click)="captureControls(getQuestionControl().at(0)['controls'].person_met_entered_pic, 'Person Met Pic',getQuestionControl().at(0).value.form_id)">
             <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getQuestionControl().at(0)['controls'].person_met_entered_pic, 'Person Met Pic',getQuestionControl().at(0).value.form_id)"></app-capture-btn>
+            </span>
             <!-- <ion-button
               (click)="capturePic(getQuestionControl().at(0)['controls'].person_met_entered_pic, 'Person Met Pic',getQuestionControl().at(0).value.form_id)"
               fill="clear">
@@ -149,14 +155,14 @@
 
       <!-- START OF EMPLOYER INFO -->
       <div *ngIf="checkPartEnable(4) && getQuestionControl().at(2).get('employer_details')" formArrayName="employer_details">
-        <mat-form-field appearance="fill">
+        <mat-form-field >
           <mat-label>Enter name of Employer/Manager</mat-label>
           <input matInput type="text" formControlName="name_person_met" />
           <mat-error align="end" style="font-size:12px"
             *ngIf="getEmployer_details.controls['name_person_met'].errors?.required || getEmployer_details.controls['name_person_met'].touched">
             Name Required</mat-error>
         </mat-form-field>
-        <mat-form-field appearance="fill">
+        <mat-form-field >
           <mat-label>Designation of the person met</mat-label>
           <mat-select formControlName="designation_person_met">
             <ngx-mat-select-search [formControl]="designationFilterCtrl" [placeholderLabel]="'Search Designation...'"
@@ -179,7 +185,9 @@
                 src="{{getEmployer_details.value.person_met_pic}}" style="max-width: 70px;max-height: 70px">
             </div>
             <!-- </ion-thumbnail> -->
+            <span (click)="captureControls(getEmployer_details.controls['person_met_pic'], 'Person Met Pic',getQuestionControl().at(2).value.form_id)">
             <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getEmployer_details.controls['person_met_pic'], 'Person Met Pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+            </span>
             <!-- <ion-button
               (click)="capturePic(getEmployer_details.controls['person_met_pic'], 'Person Met Pic',getQuestionControl().at(2).value.form_id)"
               fill="clear">
@@ -191,10 +199,10 @@
             <mat-label>Selfie Photograph with Employer/Manager</mat-label>
             <mat-error align="end" style="font-size:12px" *ngIf="getEmployer_details.controls['person_met_pic'].errors?.required ">Required</mat-error> 
           </div>
-        </div>
+        </div><br/><br/>
         <div fxLayout="row">
             <div fxLayout="column" fxFlex="85%">
-        <mat-form-field appearance="fill">
+        <mat-form-field >
           <mat-label>Photo ID card of the Employer/Manager</mat-label>
           <mat-select formControlName="photo_id_card">
               <mat-option>Select</mat-option>
@@ -213,7 +221,9 @@
             src="{{getEmployer_details.value.photo_id_card_pic}}" style="max-width: 80px;max-height: 80px">
           
         </div>
+        <span (click)="captureControls(getEmployer_details.controls['photo_id_card_pic'], 'Photo ID Card',getQuestionControl().at(2).value.form_id)">
         <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getEmployer_details.controls['photo_id_card_pic'], 'Photo ID Card',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+        </span>
         <!-- <ion-button
           (click)="capturePic(getEmployer_details.controls['photo_id_card_pic'], 'Photo ID Card',getQuestionControl().at(2).value.form_id)"
           fill="clear">
@@ -227,7 +237,7 @@
 
         <div fxLayout="row">
           <div fxLayout="column" fxFlex="85%">
-            <mat-form-field appearance="fill">
+            <mat-form-field >
               <mat-label>Employer’s/Manager’s Company ID card / Visiting Card provided”?</mat-label>
               <mat-select formControlName="visiting_card">
                   <mat-option>Select</mat-option>
@@ -245,7 +255,9 @@
                 src="{{getEmployer_details.value.visiting_card_pic}}" style="max-width: 80px;max-height: 80px">
               
             </div>
+            <span (click)="captureControls(getEmployer_details.controls['visiting_card_pic'], 'Visiting card pic',getQuestionControl().at(2).value.form_id)">
             <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getEmployer_details.controls['visiting_card_pic'], 'Visiting card pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+            </span>
             <!-- <ion-button
               (click)="capturePic(getEmployer_details.controls['visiting_card_pic'], 'Visiting card pic',getQuestionControl().at(2).value.form_id)"
               fill="clear">
@@ -259,7 +271,7 @@
             <mat-error align="end" style="font-size:12px" *ngIf="getEmployer_details.controls['visiting_card_pic'].errors?.required || getEmployer_details.controls['visiting_card_pic'].touched">Person Met pic is Required</mat-error>
           </div>
         </div>
-        <mat-form-field appearance="fill">
+        <mat-form-field >
           <mat-label>Salary Amount Confirmed from Employer/Manager</mat-label>
           <mat-select formControlName="confirm_salary" (selectionChange)="dynamicOnChangeValidations($event.value,[getEmployer_details['controls']['sal_amount_was_not_confirmed']],'no')">
               <mat-option>Select</mat-option>
@@ -270,15 +282,15 @@
             *ngIf="getEmployer_details.controls['confirm_salary'].errors?.required ">Required</mat-error>
         </mat-form-field>
         <div *ngIf="getEmployer_details.value.confirm_salary == 'yes'">
-          <mat-form-field appearance="fill">
+          <mat-form-field >
             <mat-label>Gross Salary <span style="font-size:13px">(salary before deduction)</span></mat-label>
             <input matInput type="number" formControlName="gross_monthly_salary" />
           </mat-form-field>
-          <mat-form-field appearance="fill">
+          <mat-form-field >
             <mat-label>Net Salary <span style="font-size:13px">(salary after deduction)</span></mat-label>
             <input matInput type="number" formControlName="net_monthly_salary" />
           </mat-form-field>
-          <mat-form-field appearance="fill">
+          <mat-form-field >
             <mat-select placeholder="Mode of Net Salary Payment to applicant "
               formControlName="mode_of_getting_salary">
               <mat-option>Select</mat-option>
@@ -400,7 +412,7 @@
   <mat-form-field  >
     <mat-label>Salary register</mat-label>
     <mat-select placeholder="Salary register" formControlName="sal_reg_seen"
-        required>
+        required (selectionChange)="dynamicOnChangeValidations($event.value,[getDocsSightedGroup['controls'].sal_reg_seen_pic],'yes')">
         <mat-option>Select</mat-option>
         <mat-option value="yes">Yes</mat-option>
         <mat-option value="no">No</mat-option>
@@ -415,7 +427,9 @@
     src="{{getDocsSightedGroup['value'].sal_reg_seen_pic}}" style="max-width: 80px;max-height: 80px">
   
 </div>
+<span (click)="captureControls(getDocsSightedGroup['controls']['sal_reg_seen_pic'], 'Salary register pic',getQuestionControl().at(2).value.form_id)">
 <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getDocsSightedGroup['controls']['sal_reg_seen_pic'], 'Salary register pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+</span>
 <!-- <ion-button
   (click)="capturePic(getDocsSightedGroup['controls']['sal_reg_seen_pic'], 'Salary register pic',getQuestionControl().at(2).value.form_id)"
   fill="clear">
@@ -432,7 +446,7 @@
 <mat-form-field  >
   <mat-label>Attendance Register</mat-label>
 <mat-select placeholder="Attendance Register" formControlName="attendance_seen"
-    required>
+    required (selectionChange)="dynamicOnChangeValidations($event.value,[getDocsSightedGroup['controls'].attendance_seen_pic],'yes')">
     <mat-option>Select</mat-option>
     <mat-option value="yes">Yes</mat-option>
     <mat-option value="no">No</mat-option>
@@ -447,7 +461,9 @@
 src="{{getDocsSightedGroup['value'].attendance_seen_pic}}" style="max-width: 80px;max-height: 80px">
 
 </div>
+<span (click)="captureControls(getDocsSightedGroup['controls']['attendance_seen_pic'], 'Attendance register pic',getQuestionControl().at(2).value.form_id)">
 <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getDocsSightedGroup['controls']['attendance_seen_pic'], 'Attendance register pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+</span>
 <!-- <ion-button
 (click)="capturePic(getDocsSightedGroup['controls']['attendance_seen_pic'], 'Attendance register pic',getQuestionControl().at(2).value.form_id)"
 fill="clear">
@@ -465,7 +481,7 @@ Image </mat-label> -->
 <mat-label>Cash voucher</mat-label>
 
 <mat-select placeholder="Cash voucher" formControlName="cash_voucher"
-required>
+required (selectionChange)="dynamicOnChangeValidations($event.value,[getDocsSightedGroup['controls'].cash_voucher_pic],'yes')">
 <mat-option>Select</mat-option>
 <mat-option value="yes">Yes</mat-option>
 <mat-option value="no">No</mat-option>
@@ -480,7 +496,9 @@ required>
 src="{{getDocsSightedGroup['value'].cash_voucher_pic}}" style="max-width: 80px;max-height: 80px">
 
 </div>
+<span (click)="captureControls(getDocsSightedGroup['controls']['cash_voucher_pic'], 'Cash Voucher pic',getQuestionControl().at(2).value.form_id)">
 <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getDocsSightedGroup['controls']['cash_voucher_pic'], 'Cash Voucher pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+</span>
 <!-- <ion-button
 (click)="capturePic(getDocsSightedGroup['controls']['cash_voucher_pic'], 'Cash Voucher pic',getQuestionControl().at(2).value.form_id)"
 fill="clear">
@@ -498,7 +516,7 @@ Image </mat-label> -->
 <mat-label>Salary Certificate</mat-label>
 
 <mat-select placeholder="Salary Certificate" formControlName="sal_certificate"
-required>
+required (selectionChange)="dynamicOnChangeValidations($event.value,[getDocsSightedGroup['controls'].sal_certificate_pic],'yes')">
 <mat-option>Select</mat-option>
 <mat-option value="yes">Yes</mat-option>
 <mat-option value="no">No</mat-option>
@@ -513,7 +531,9 @@ required>
 src="{{getDocsSightedGroup['value'].sal_certificate_pic}}" style="max-width: 80px;max-height: 80px">
 
 </div>
+<span (click)="captureControls(getDocsSightedGroup['controls']['sal_certificate_pic'], 'Salary Certificate pic',getQuestionControl().at(2).value.form_id)">
 <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getDocsSightedGroup['controls']['sal_certificate_pic'], 'Salary Certificate pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+</span>
 <!-- <ion-button
 (click)="capturePic(getDocsSightedGroup['controls']['sal_certificate_pic'], 'Salary Certificate pic',getQuestionControl().at(2).value.form_id)"
 fill="clear">
@@ -531,7 +551,7 @@ Image </mat-label> -->
 <mat-label>Salary Slip</mat-label>
 
 <mat-select placeholder="Salary Slip" formControlName="sal_slip"
-required>
+required (selectionChange)="dynamicOnChangeValidations($event.value,[getDocsSightedGroup['controls'].sal_slip_pic],'yes')">
 <mat-option>Select</mat-option>
 <mat-option value="yes">Yes</mat-option>
 <mat-option value="no">No</mat-option>
@@ -546,7 +566,9 @@ required>
 src="{{getDocsSightedGroup['value'].sal_slip_pic}}" style="max-width: 80px;max-height: 80px">
 
 </div>
+<span (click)="captureControls(getDocsSightedGroup['controls']['sal_slip_pic'], 'Salary Slip pic',getQuestionControl().at(2).value.form_id)">
 <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getDocsSightedGroup['controls']['sal_slip_pic'], 'Salary Slip pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+</span>
 <!-- 
 <ion-button
 (click)="capturePic(getDocsSightedGroup['controls']['sal_slip_pic'], 'Salary Slip pic',getQuestionControl().at(2).value.form_id)"
@@ -558,11 +580,11 @@ Image </mat-label> -->
 <mat-error align="end" style="font-size:12px" *ngIf="getDocsSightedGroup.controls['sal_slip_pic'].errors?.required || getDocsSightedGroup.controls['sal_slip_pic'].touched">Required</mat-error>
 </div>
 </div>
-<mat-form-field appearance="fill">
+<mat-form-field >
 <mat-label>Others please specify</mat-label>
 
 <mat-select placeholder="Others please specify" formControlName="other_doc"
-required>
+required  (selectionChange)="dynamicOnChangeValidations($event.value,[getDocsSightedGroup['controls'].other_doc_pic],'yes')">
 <mat-option>Select</mat-option>
 <mat-option value="yes">Yes</mat-option>
 <mat-option value="no">No</mat-option>
@@ -572,7 +594,7 @@ required>
 
 <div fxLayout="row" *ngIf="getDocsSightedGroup['value']['other_doc'] == 'yes'">
 <div fxLayout="column" fxFlex="85%">
-<mat-form-field  appearance="fill">
+<mat-form-field  >
 <mat-label>Specify the Document</mat-label>
 <input matInput type="text" formControlName="other_doc_name">
 <mat-error *ngIf="getDocsSightedGroup['controls']['other_doc_name'].hasError('required')">Required</mat-error>
@@ -585,7 +607,10 @@ required>
 src="{{getDocsSightedGroup['value'].other_doc_pic}}" style="max-width: 80px;max-height: 80px">
 
 </div>
+<span (click)="captureControls(getDocsSightedGroup['controls']['other_doc_pic'], 'Other Doc Pic',getQuestionControl().at(2).value.form_id)">
 <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getDocsSightedGroup['controls']['other_doc_pic'], 'Other Doc Pic',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+</span>
+
 <!-- <ion-button
 (click)="capturePic(getDocsSightedGroup['controls']['other_doc_pic'], 'Other Doc Pic',getQuestionControl().at(2).value.form_id)"
 fill="clear">
@@ -598,14 +623,14 @@ Image </mat-label> -->
 </div>
 
 <div *ngIf="checkPartEnable(3)">
-<mat-form-field  appearance="fill">
+<mat-form-field  >
 <mat-label>Why Documents are not available?</mat-label>
 <mat-select formControlName="doc_not_available" multiple>
 <mat-option *ngFor="let item of docNotAvailList" [value]="item">{{item}}</mat-option>
 </mat-select>
 <mat-error *ngIf="getDocsSightedGroup['controls']['doc_not_available'].hasError('required')">Required</mat-error>
 </mat-form-field>
-<mat-form-field appearance="fill" *ngIf="checkSpecifyField(getDocsSightedGroup['value']['doc_not_available'])">
+<mat-form-field  *ngIf="checkSpecifyField(getDocsSightedGroup['value']['doc_not_available'])">
 <mat-label>Specify the reason</mat-label>
 <input matInput type="text" formControlName="doc_not_available_specify"/>
 </mat-form-field>
@@ -626,21 +651,23 @@ Image </mat-label> -->
     <br/>
      <!-- <mat-label><h5>{{dynamicStepperHeadingForEmp}}</h5></mat-label>
      <hr/><br/><br/> -->
-     <div fxLayout="row" fxLayoutGap="10px" class="ion-align-items-center" formArrayName="office_photographs">
+     <div fxLayout="row wrap" fxLayoutGap="10px" class="ion-align-items-center" formArrayName="office_photographs">
          <div fxLayout="column"  class="ion-align-self-center" *ngFor="let val of getPhotoControls('office_photographs',8);let i=index" [formGroupName]="i">
              <!-- {{val.value | json}}  -->
              <div fxLayout="row" fxLayoutAlign="center center">
              <img ngxViewer text="PD Photos" title="Office Photograph {{i+1}}" src="{{val.value.image}}" style="max-width: 80px;max-height: 80px"><br/>
            </div>
            <!-- <ion-button fill="clear" ><ion-icon style="font-size: 30px" name="camera"></ion-icon></ion-button><br/> -->
-           <div fxLayout="row" fxLayoutAlign="center center">
+           <div fxLayout="row" fxLayoutAlign="center center" style="margin-bottom: 20%;">
            <mat-label style="font-size: 12px;text-align:left">Office Photograph {{i+1}}</mat-label>
          </div>
          </div>
-         <div *ngIf="getPhotoControls('office_photographs',8).length == 0" style="text-align: center;margin-top: 15px;">
+         <!-- <div *ngIf="getPhotoControls('office_photographs',8).length == 0" style="text-align: center;margin-top: 15px;">
-           No Photographs Found</div>
+           No Photographs Found<br/></div> -->
          <div fxLayout="column" align="center" class="ion-align-self-center">
-          <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="addMoreImage($event,'office_photographs',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+          <span (click)="captureControls( 'office_photographs','8',getQuestionControl().at(2).value.form_id,'addMoreImage')">
+          <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,'office_photographs',getQuestionControl().at(2).value.form_id,8)"></app-capture-btn>
+          </span>
           <mat-label>Add More</mat-label>
              <!-- <img src="https://lh3.googleusercontent.com/proxy/euOnni6JKoCJKwXq9Hq8c6fkRaxI5SYQVsHUwx_w_Wt_9zGXsABxnFsjRv7_E3Xer35VR1oalGBRKWdlwQPMo9SoDqOrmx9h7zqmAXMG37rcrpaU_jPXMXAdffKjB0M_zy3yQNJRpOKvqUlx2JmvB68r8cDCGbVUQvW8Zk2yoR4I23i4ZM7U" style="max-width: 80px;max-height: 80px"/><br/> -->
              <!-- <ion-button  (click)="addMoreImage('office_photographs',getQuestionControl().at(2).value.form_id)"
@@ -663,21 +690,23 @@ Image </mat-label> -->
           <br/>
            <!-- <mat-label><h5>{{dynamicStepperHeadingForEmp}}</h5></mat-label>
            <hr/><br/><br/> -->
-           <div fxLayout="row" class="ion-align-items-center" formArrayName="nameboard_photographs">
+           <div fxLayout="row wrap" fxLayoutGap="10px" class="ion-align-items-center" formArrayName="nameboard_photographs">
                <div fxLayout="column" size="6" align="center" class="ion-align-self-center" *ngFor="let val of getPhotoControls('nameboard_photographs',9);let i=index" [formGroupName]="i">
                    <!-- {{val.value | json}}  -->
                    <div fxLayout="row" fxLayoutAlign="center center">
                    <img ngxViewer text="PD Photos" title="Name Board Photograph {{i+1}}" src="{{val.value.image}}" style="max-width: 80px;max-height: 80px;font-size:13px !important;"><br/>
                  </div>
                  <!-- <ion-button fill="clear" ><ion-icon style="font-size: 30px" name="camera"></ion-icon></ion-button><br/> -->
-                 <div fxLayout="row" fxLayoutAlign="center center">
+                 <div fxLayout="row" fxLayoutAlign="center center" style="margin-bottom:20%">
                  <mat-label style="font-size: 12px;text-align:left">Name Board {{i+1}}</mat-label>
                </div>
                </div>
-               <div *ngIf="getPhotoControls('nameboard_photographs',9).length == 0" style="text-align: center;margin-top: 15px;">
+               <!-- <div *ngIf="getPhotoControls('nameboard_photographs',9).length == 0" style="text-align: center;margin-top: 15px;">
-                No Photographs Found</div>
+                No Photographs Found<br/></div> -->
                <div fxLayout="column" align="center" class="ion-align-self-center">
-                <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="addMoreImage($event,'nameboard_photographs',getQuestionControl().at(2).value.form_id)"></app-capture-btn>
+                <span (click)="captureControls('nameboard_photographs','9',getQuestionControl().at(2).value.form_id,'addMoreImage')">
+                <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,'nameboard_photographs',getQuestionControl().at(2).value.form_id,9)"></app-capture-btn>
+                </span>
                 <mat-label>Add More</mat-label>
                    <!-- <img src="https://lh3.googleusercontent.com/proxy/euOnni6JKoCJKwXq9Hq8c6fkRaxI5SYQVsHUwx_w_Wt_9zGXsABxnFsjRv7_E3Xer35VR1oalGBRKWdlwQPMo9SoDqOrmx9h7zqmAXMG37rcrpaU_jPXMXAdffKjB0M_zy3yQNJRpOKvqUlx2JmvB68r8cDCGbVUQvW8Zk2yoR4I23i4ZM7U" style="max-width: 80px;max-height: 80px"/><br/> -->
                    <!-- <ion-button  (click)="addMoreImage('nameboard_photographs',getQuestionControl().at(2).value.form_id)"
@@ -701,7 +730,7 @@ Image </mat-label> -->
           <div >
            
              <app-dynamic-docs-form [docs_array_value] = "docs_tobe_collect" [doc_answers] = "creditManagerAnswer" [form_group] = "getQuestionControl().at(6)"
-             (eventCapturePic) ="capturePic($event.controls,$event.img_name,$event.form_id)"></app-dynamic-docs-form>
+             (eventCapturePic) ="captureControls($event.controls,$event.img_name,$event.form_id)"></app-dynamic-docs-form>
            
          </div>
          <div class="mat-button-div">
@@ -909,7 +938,7 @@ Image </mat-label> -->
 
      <div fxLayout="row">
         <div fxLayout="column" fxFlex="85%">
-          <mat-form-field appearance="fill" >
+          <mat-form-field  >
             <mat-label>Approach to FI location</mat-label>
             <mat-select formControlName="pd_location">
                 <mat-option>Select</mat-option>
@@ -923,7 +952,9 @@ Image </mat-label> -->
           <img ngxViewer text="PD Photos" title="Approach to FI Location" *ngIf="getQuestionControl().at(1).value.pd_location_pic != ''"
           src="{{getQuestionControl().at(1).value.pd_location_pic}}" style="max-width: 80px;max-height: 80px">
          </div>
+         <span (click)="captureControls(getQuestionControl().at(1)['controls'].pd_location_pic, 'Approach to PD Location ( ' + currentDate + ' )',getQuestionControl().at(1).value.form_id)">
          <app-capture-btn addMoreBtn="true" class="file-btn"  (imageDataEmitter)="capturePic($event,getQuestionControl().at(1)['controls'].pd_location_pic, 'Approach to PD Location ( ' + currentDate + ' )',getQuestionControl().at(1).value.form_id)"></app-capture-btn>
+         </span>
           <!-- <ion-button  (click)="capturePic(getQuestionControl().at(1)['controls'].pd_location_pic, 'Approach to PD Location ( ' + currentDate + ' )',getQuestionControl().at(1).value.form_id)"
           fill="clear" ><ion-icon style="font-size: 20px"  name="camera"></ion-icon><span style="color: red;
           font-size: 18px;
@@ -935,7 +966,7 @@ Image </mat-label> -->
    </div>
      <div fxLayout="row">
         <div fxLayout="column" fxFlex="85%">
-      <mat-form-field appearance="fill">
+      <mat-form-field >
           <mat-label>Comment on locality</mat-label>
           <mat-select formControlName="comment_locality">
               <mat-option>Select</mat-option>
@@ -974,7 +1005,7 @@ Image </mat-label> -->
       <div align="end" style="font-size:12px" *ngIf="getQuestionControl().at(4)['controls']['outlet_location'].errors?.required || getQuestionControl().at(4)['controls']['outlet_location'].touched"> Required</div>
     </div>
 
-        <mat-form-field appearance="fill">
+        <mat-form-field >
           <mat-label>Is there a competetion to the applicant's business in the location	</mat-label>
           <mat-select formControlName="is_competition" required>
               <mat-option>Select</mat-option>
@@ -991,7 +1022,7 @@ Image </mat-label> -->
           <mat-error align="end" style="font-size:12px" *ngIf="getQuestionControl().at(4)['controls']['appx_outlet_or_stores'].errors?.required || getQuestionControl().at(4)['controls']['appx_outlet_or_stores'].touched"> Required</mat-error>
         </mat-form-field>
 
-        <mat-form-field appearance="fill">
+        <mat-form-field >
             <mat-label>Any demolition activity seen in the locality by PD officer</mat-label>
             <mat-select formControlName="demolition_activity" required>
                 <mat-option>Select</mat-option>
@@ -1006,7 +1037,7 @@ Image </mat-label> -->
               <input matInput autocomplete="off" type="text" placeholder="Comment on any demolition activity observed" formControlName="comment_of_demolition_activity"  />
               <mat-error align="end" style="font-size:12px" *ngIf="getQuestionControl().at(4)['controls']['comment_of_demolition_activity'].errors?.required || getQuestionControl().at(4)['controls']['comment_of_demolition_activity'].touched"> Required</mat-error>
             </mat-form-field>
-          <mat-form-field appearance="fill">
+          <mat-form-field >
               <mat-label>Any sealing activity observed in the locality by PD officer</mat-label>
               <mat-select formControlName="sealing_activity" required>
                   <mat-option>Select</mat-option>
@@ -1034,7 +1065,7 @@ Image </mat-label> -->
   <!-- START OF SUBMIT -->
   <mat-step formGroupName="5" [stepControl]="questions?.get([5])">
     <ng-template matStepLabel>Submit</ng-template>
-    <mat-form-field appearance="fill">
+    <mat-form-field >
       <mat-label>Final Status of visit</mat-label>
       <!-- <textarea matInput type="text" placeholder="Any other comments" formControlName="final_comments"></textarea> -->
       <mat-select formControlName="final_visit_status">
@@ -1045,7 +1076,7 @@ Image </mat-label> -->
       </mat-select>
       <mat-error align="end" style="font-size:12px" *ngIf="getQuestionControl().at(5)['controls']['final_visit_status'].errors?.required || getQuestionControl().at(5)['controls']['final_visit_status'].touched"> Required</mat-error>
     </mat-form-field>
-    <mat-form-field appearance="fill">
+    <mat-form-field >
       <mat-label>Comments</mat-label>
       <textarea matInput type="text" placeholder="Any other comments" formControlName="final_comments"></textarea>
       <mat-error align="end" style="font-size:12px" *ngIf="getQuestionControl().at(5)['controls']['final_comments'].errors?.required || getQuestionControl().at(5)['controls']['final_comments'].touched"> Required</mat-error>
@@ -1053,7 +1084,7 @@ Image </mat-label> -->
     <div>
       <mat-label>Neighbourhood check</mat-label>
       <br/>
-      <mat-form-field appearance="fill">
+      <mat-form-field >
           <mat-label>Existence of organization/office confirmed by neighbour</mat-label>
           <mat-select formControlName="company_existence_neighbour_confirmed" required>
               <mat-option>Select</mat-option>

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/pd-questions/employer-info/employer-info.component.scss

@@ -40,12 +40,15 @@
 }
 
 .mat-radio-button.mat-accent .mat-radio-ripple .mat-ripple-element {
-    background-color:rgb(255, 37, 37);
+    background-color:rgb(80, 52, 52);
 }
 .mat-form-field {
   // margin-top: 16px;
   width: 100%;
 }
+::ng-deep .mat-dialog-container{
+  padding: 0px !important;
+}
 
   .whole_form {
     @media(min-width:500px) { 
@@ -96,4 +99,43 @@
     -o-animation: highlight-fade 4s ease-out;
     animation: highlight-fade 4s ease-out;
     // background: blue;
+  }
+
+  input{
+    // width: 100px;
+    // border-radius: 4px;
+    // border-color: gray;
+    // font-size: 12px;
+    height: 28px;
+  
+  }
+  .mat-select-panel mat-option.mat-option {
+    margin: 1rem 0;
+    overflow: visible;
+    line-height: initial;
+    word-wrap: break-word;
+    white-space: pre-wrap;
+    }
+    // .mat-option, 
+  .largeMatOption{
+    margin: 1rem 0;
+    overflow: visible;
+    line-height: initial !important;
+    word-wrap: break-word;
+    white-space: pre-wrap;
+  }
+  // .mat-option i,
+   .largeMatOption i{
+    display: block;
+    font-size: 1.5rem;
+    opacity: 0.6;
+    margin-left: 0.5rem;
+  
+  }
+    input-placeholder{
+      margin:10px;
+    }
+    mat-select{
+           
+      margin : 5px 0;
   }

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/pd-questions/employer-info/employer-info.component.ts

@@ -9,6 +9,7 @@ import { NotifierService } from 'angular-notifier';
 import { AwsService } from 'app/AwsService/aws.service';
 import { CommonQuesComponent } from '../common-ques/common-ques.component';
 import { takeUntil } from 'rxjs/operators';
+import { CameraService } from 'app/personal-discussion/camera-service/camera.service';
 
 @Component({
   selector: 'app-employer-info',
@@ -61,7 +62,7 @@ export class EmployerInfoComponent implements OnInit {
   isDisplay2:any = [];
   isOrganisationOwner: any = [];
   photoIdCardList:any=[
-   "Aadhaar card", "Electoral Photo Identity Card (EPIC) card", "PAN card", "Driving license" , "Others"
+   "Aadhaar card", "Electoral Photo Identity Card (EPIC) card", "PAN card", "Driving license" , "Not Provided", "Others"
   ]
   docNotAvailList:any=[
     "Documents were not shared by Employer", "Documents are not issued by Employer", "Documents were not available", "Employer was not available", "Others (please specify)"
@@ -106,6 +107,7 @@ export class EmployerInfoComponent implements OnInit {
   generalExistBusinessMonth: number;
   dynamicStepperHeadingForEmp:String;
   notifier: NotifierService;
+  currImageControls: { controls: any; img_name?: String; form_id?: any; fun_name:string,valid:boolean};
   get questions() { return this.employerForm.get('questions');}
   get getEmployer_details() {return this.questions.get([2]).get('employer_details')}
   get getDocsSightedGroup() {return this.questions.get([7]).get('docs_sighted')}
@@ -119,7 +121,7 @@ export class EmployerInfoComponent implements OnInit {
   public filteredcompanyRelationshipList:ReplaySubject<any> = new ReplaySubject<any>(1);
   public filteredrelationshipList:ReplaySubject<any> = new ReplaySubject<any>(1);
   
-  constructor(private actRoute:ActivatedRoute,private quesService:PdTrigerService,private router:Router,
+  constructor(private actRoute:ActivatedRoute,private quesService:PdTrigerService,private router:Router,private cameraService:CameraService,
     @Inject(MAT_DIALOG_DATA)public data,private _formBuilder:FormBuilder,
      notifier:NotifierService,private _awsService:AwsService,private dialogRef:MatDialogRef<EmployerInfoComponent>) { 
       this.notifier=notifier
@@ -524,7 +526,7 @@ export class EmployerInfoComponent implements OnInit {
             // datas[8].office_photographs = group_obj.office_photograph
             datas.push({office_photographs:group_obj.office_photographs})
             group_obj.office_photographs.forEach(()=>{
-              this.addMoreImage('office_photographs','',8)
+              this.addMoreImage('','office_photographs','',8)
             })
         }
         else {
@@ -535,7 +537,7 @@ export class EmployerInfoComponent implements OnInit {
           // datas[9].nameboard_photographs = group_obj.nameboard_photographs
           datas.push({nameboard_photographs:group_obj.nameboard_photographs})
           group_obj.nameboard_photographs.forEach(()=>{
-            this.addMoreImage('nameboard_photographs','',9)
+            this.addMoreImage('','nameboard_photographs','',9)
           })
       }
       else {
@@ -631,7 +633,7 @@ export class EmployerInfoComponent implements OnInit {
     uom_others:[''],
     is_pd_done_on_initiated_address:[true],
     pd_location:['',Validators.compose([Validators.required])],
-    pd_location_pic:[''],
+    pd_location_pic:['',Validators.compose([Validators.required])],
     comment_locality:['',Validators.compose([Validators.required])],
     form_id:['5'],
     form_name:["Address Info"],
@@ -718,7 +720,7 @@ export class EmployerInfoComponent implements OnInit {
       name_person_met:['',Validators.compose([Validators.required])],
       designation_person_met:['',Validators.compose([Validators.required])],
       // proof image
-      person_met_pic:[''],
+      person_met_pic:['',Validators.compose([Validators.required])],
       photo_id_card:[''],
       photo_id_others:[''],
       photo_id_card_pic:[''],
@@ -914,7 +916,8 @@ export class EmployerInfoComponent implements OnInit {
   //   }
   // // console.log(this.employerForm.value);
   // }
-  addMoreImage(formArrayName,form_id?,formGroupIndex?) {
+  addMoreImage(event,formArrayName,form_id?,formGroupIndex?) {
+    console.log(event,formArrayName,form_id,formGroupIndex)
   let formArray = this.employerForm.get('questions') as FormArray;
   // console.log(formArray);
   let officeControl = formArray.at(formGroupIndex).get(formArrayName) as FormArray
@@ -923,7 +926,7 @@ export class EmployerInfoComponent implements OnInit {
     // console.log("stock",stockCtrl);
     // stockCtrl.push(this.addStockImageControl())
     if(form_id) {
-    // this.capturePic(officeControl,formArrayName,form_id)
+    this.capturePic(event,officeControl,formArrayName,form_id)
     }
     else {
       officeControl.push(this.addImageControl())
@@ -1075,70 +1078,105 @@ export class EmployerInfoComponent implements OnInit {
    
   ChdCtrls.controls.other_organisation_owner.updateValueAndValidity();      
   }
+  captureControls(controls,img_name?:String,form_id?,fun_name='capturePic') {
+    this.currImageControls = {controls:controls,img_name:img_name,form_id:form_id,fun_name:fun_name,valid:true}
+  }
   
-  // capturePic(controls,img_name?:String,form_id?) {
+  capturePic(event,controls,img_name?:String,form_id?) {
-  // console.clear();
+    console.clear();
-  // console.log(controls)
+    console.log("Capture pic",event,controls,img_name,event)
-  // // return;
+    if(this.currImageControls && this.currImageControls.valid) {
-  // // controls.setValue("pic");
+    controls = this.currImageControls.controls
+    img_name = this.currImageControls.img_name
+    form_id = this.currImageControls.form_id
+    }
+    if(this.currImageControls.fun_name != 'capturePic' && this.currImageControls.valid) {
+      if(this.currImageControls.fun_name == 'saveApplicantInfo') {
+        this.currImageControls.valid = false
+        this.saveApplicantInfo(event,controls,img_name)
+        return;
+      }
+      if(this.currImageControls.fun_name == 'addMoreImage') {
+        this.currImageControls.valid = false
+        this.addMoreImage(event,controls,form_id,img_name)
+        return;
+      }
+    }
+    console.log("Capture pic",event,controls,img_name,event)
+    // if(this.currImageControls != 'capturePic') {
+    //   if()
+    // }
+    // return;
+    // controls.setValue("pic");
   
-  // // this.cameraProvider.getpicture().then(res => {
+    // this.cameraProvider.getpicture().then(res => {
-  //   this.cameraProvider.showImageDialog().then((res:any)=>{
+      // this.cameraProvider.showImageDialog().then((res:any)=>{
-  //     console.log("g",res)
+      //   console.log("g",res)
-  // if (res != 'error') {
+      var reader = new FileReader();
-  //     let geoCoordinates = localStorage.getItem('current_coordinates')
+      // let imagePath = event;
-  //     // this.cons.getGeoTag().then(geoCoordinates=>{
+      reader.readAsDataURL(event); 
-  //     this.cameraProvider.addWatermarks(res).then(watermarkedImage => {
+      reader.onload = (_event) => { 
-  //       console.log("image name",img_name,img_name === 'office_photograph ')
+        // this.imageData = reader.result; 
-  //       if(img_name == 'nameboard_photographs' || img_name == 'office_photographs') {
+        this.cameraService.getPosition().then(geoCords=>{
-  //         console.log("Before")
+          let geoCoordinates
-  //         controls.push(this.addImageControl())
+          if(geoCords != 'error') {
-  //         console.log("after")
+            geoCoordinates = geoCords
-  //         img_name = img_name+String(controls.length)
+          }
-  //       controls = controls.at(controls.length-1)['controls'].image
+          else {
-  //       }
+            geoCoordinates = null;
-  //       console.log("controls",controls);
+          }
-  //       controls.setValue(watermarkedImage)
+          console.log(geoCords);
-  //       let bucket: any = []
+        this.cameraService.addWatermarks(reader.result,geoCoordinates).then(watermarkedImage=> {
-  //       bucket.push({ 'image': watermarkedImage, 'Name': img_name, 'link': geoCoordinates });
+        console.log("image name",img_name,img_name === 'office_photograph ')
-  //       let records: any = {
+        if(img_name == 'nameboard_photographs' || img_name == 'office_photographs') {
-  //           'pd_id': this.pdDetails.pd_id,
+          console.log("Before")
-  //           'formid': form_id,
+          controls.push(this.addImageControl())
-  //           'images': bucket,
+          console.log("after")
-  //           'company_id': null,
+          img_name = img_name+String(controls.length)
-  //       } 
+        controls = controls.at(controls.length-1)['controls'].image
-  //       // For Business Groups
+        }
-  //       if(form_id == '11' || form_id == '13' || form_id == '22') { 
+        console.log("controls",controls);
-  //           records.company_id = '1'
+        controls.setValue(watermarkedImage)
-  //       }
+        let bucket: any = []
-  //       console.log("params savePDImage", records)
+        bucket.push({ 'image': watermarkedImage, 'Name': img_name, 'link': geoCoordinates });
-  //       this.quesService.savePDImages(records).subscribe(result => {
+        let records: any = {
-  //         if(result['dataStatus']) {
+            'pd_id': this.pdDetails.pd_id,
-  //           if(img_name == 'Person Met Pic') {
+            'formid': form_id,
-  //             this.sendGeoCords(geoCoordinates)
+            'images': bucket,
-  //           }
+            'company_id': null,
-  //           controls.setValue(result['uri'])
+        } 
-  //         }
+        // For Business Groups
-  //         else {
+        if(form_id == '11' || form_id == '13' || form_id == '22') { 
-  //           console.log(result);
+            records.company_id = '1'
-  //           controls.setValue("")
+        }
-  //           this.toastProvider.pdTriggerappmessage("Something went wrong!!",'warning');
+        console.log("params savePDImage", records)
-  //         }
+        this.quesService.savePDImages(records).subscribe(result => {
-  //     },err=>{
+          if(result['dataStatus']) {
-  //       controls.setValue("")
+            if(img_name == 'Person Met Pic') {
-  //       console.log(err)
+              this.sendGeoCords(geoCoordinates)
-  //       this.toastProvider.pdTriggerappmessage("Network Error","danger")
+            }
-  //     })
+            controls.setValue(result['uri'])
-  //     })
+          }
-  //   }
+          else {
-  //   })
+            console.log(result);
-  // }
+            controls.setValue("")
-  // sendGeoCords(location) {
+            this.notifier.notify('warning',"Something went wrong!!");
-  // let params = {"pd_id":this.pdDetails.pd_id,"geo_location":location,"comment":"","fk_updatedby":this.users}
+          }
-  // this.quesService.renewSatellite(params).subscribe(rr=>{
+      },err=>{
+        controls.setValue("")
+        console.log(err)
+        this.notifier.notify("danger","Network Error")
+      })
+      })
+    })
+    }
+  }
+  sendGeoCords(location) {
+  let params = {"pd_id":this.pdDetails.pd_id,"geo_location":location,"comment":"","fk_updatedby":this.users}
+  this.quesService.renewSatellite(params).subscribe(rr=>{
   
-  // })
+  })
-  // }
+  }
   compareObjects(o1: any, o2: any) {
   if(o1.id == o2.id && o1.group_id == o2.group_id)
   return true;
@@ -1191,43 +1229,58 @@ export class EmployerInfoComponent implements OnInit {
   // }
   // }
   
-  // saveApplicantInfo(applicant_obj,image_key) {
+  saveApplicantInfo(event,applicant_obj,image_key) {
-  // console.log(applicant_obj);
+    // return;
-  // this.cameraProvider.showImageDialog().then((res:any)=>{
+    // controls.setValue("pic");
-  //   console.log("g",res)
-  // if (res != 'error') {
-  //   let geoCoordinates = localStorage.getItem('current_coordinates')
-  //   // this.cons.getGeoTag().then(geoCoordinates=>{
-  //   this.cameraProvider.addWatermarks(res).then(watermarkedImage => {
-  //     applicant_obj.controls[image_key].setValue(watermarkedImage);
-  //     let params = {
-  //       "pd_co_applicant_id":applicant_obj.value.pd_co_applicant_id,
-  //       "applicant_name":applicant_obj.value.applicant_name,
-  //       "is_person_met":applicant_obj.value.is_person_met,
-  //       "fk_pd_id":this.pdDetails.pd_id,
-  //       "link":geoCoordinates
-  //     }
-  //     params[image_key] = applicant_obj.value[image_key]
   
-  //     this.quesService.saveApplicantImgFromVendorForm(params).subscribe(result=>{
+    // this.cameraProvider.getpicture().then(res => {
-  //         if(result['dataStatus']) {
+      // this.cameraProvider.showImageDialog().then((res:any)=>{
-  //           this.sendGeoCords(geoCoordinates)
+      //   console.log("g",res)
-  //           applicant_obj.controls[image_key].setValue(result['uri']);
+      console.log("saveApplicantInfo",applicant_obj,image_key)
-  //         }
+      var reader = new FileReader();
-  //         else {
+      // let imagePath = event;
-  //           applicant_obj.controls[image_key].setValue("");
+      reader.readAsDataURL(event); 
-  //           console.log(result);
+      reader.onload = (_event) => { 
-  //           this.toastProvider.pdTriggerappmessage("Something went wrong!!",'warning');
+        // this.imageData = reader.result; 
-  //         }
+        this.cameraService.getPosition().then(geoCords=>{
-  //     },err=>{
+          let geoCoordinates
-  //       applicant_obj.controls[image_key].setValue("");
+          if(geoCords != 'error') {
-  //       console.log(err)
+            geoCoordinates = geoCords
-  //       this.toastProvider.pdTriggerappmessage("Network Error","danger")
+          }
-  //     })
+          else {
-  //   })
+            geoCoordinates = null;
-  // }
+          }
-  // })
+          console.log(geoCords);
-  // }
+        this.cameraService.addWatermarks(reader.result,geoCoordinates).then(watermarkedImage=> {
+      applicant_obj.controls[image_key].setValue(watermarkedImage);
+      let params = {
+        "pd_co_applicant_id":applicant_obj.value.pd_co_applicant_id,
+        "applicant_name":applicant_obj.value.applicant_name,
+        "is_person_met":applicant_obj.value.is_person_met,
+        "fk_pd_id":this.pdDetails.pd_id,
+        "link":geoCoordinates
+      }
+      params[image_key] = applicant_obj.value[image_key]
+  
+      this.quesService.saveApplicantImgFromVendorForm(params).subscribe(result=>{
+          if(result['dataStatus']) {
+            this.sendGeoCords(geoCoordinates)
+            applicant_obj.controls[image_key].setValue(result['uri']);
+          }
+          else {
+            applicant_obj.controls[image_key].setValue("");
+            console.log(result);
+            this.notifier.notify('warning',"Something went wrong!!",);
+          }
+      },err=>{
+        applicant_obj.controls[image_key].setValue("");
+        console.log(err)
+        this.notifier.notify("danger","Network Error")
+      })
+    })
+  })
+  }
+  }
   public findInvalidControls() {
   const invalid = [];
   let msg=''
@@ -1268,6 +1321,9 @@ export class EmployerInfoComponent implements OnInit {
                   // this.myStepper.selectedIndex = 0;
           
                   }
+                  else {
+                    msg =  this.stepperInfo[index].form_name+" images are not taken"
+                  }
                   
           console.log("kkdd",group['controls'][name],firstInvalidField)
          
@@ -1633,7 +1689,8 @@ records.questions = records.questions.filter(v=>v.form_id != '12.1' && v.form_id
           }
         if (general_controls.is_met_during_visit.value == 'yes') {
           general_controls.person_met_entered.setValidators(Validators.required);
-          // general_controls.person_met_entered_pic.setValidators(Validators.required);
+          general_controls.person_met_entered_pic.setValidators(Validators.required);
+          general_controls.person_met_entered_pic.updateValueAndValidity();
           // FOR ADDING OFFICE PHOTO
           office_photo_controls.addControl('office_photographs', this._formBuilder.array([]))
           name_board_controls.addControl('nameboard_photographs', this._formBuilder.array([]))

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/view-pd/view-pd.component.ts

@@ -135,6 +135,10 @@ export class ViewPdComponent implements OnInit, OnDestroy {
             this.masterRandomString = temp[1]
             this.is_from_link = temp[2] == 'link'
           }
+          console.log("view pd ",this.viewID)
+          if(this.viewID == 'undefined'){
+            this.router.navigate(['/error'])
+          }
         }
       })
     }

ng6-seed/src/app/personal-discussion/pd-service/pd-triger.service.ts

@@ -869,6 +869,18 @@ getBusinessDocsToVendorForm(editId) {
     return this._http.get(this.apiUrl+'getBusinessDocsToVendorForm',options)
     .pipe(catchError(this.handleError("getBusinessDocsToVendorForm",[])))
 }
+renewSatellite(params) {
+    return this._http.post(this.apiUrl+'renewSatellite',{records:params})
+    .pipe(catchError(this.handleError("renewSatellite",[])))
+  }
+  saveApplicantImgFromVendorForm(params) {
+    let userId= this._aws.getlocale();
+    params.fk_createdby= userId
+    return this._http.post(this.apiUrl+'saveApplicantImgFromVendorForm',params)
+    .pipe(catchError(this.handleError("renewSatellite",[])))
+    
+  }
+
 
 
 }

ng6-seed/src/app/session/login/login.component.ts

@@ -77,7 +77,7 @@ export class LoginComponent implements OnInit{
       this.getCommonSettings().then(()=>{
         // local storage for validate user access
         localStorage.setItem('user_role',res.idToken.payload["custom:role_id"]);
-        if(this.pdTriggerService.customer_url_data && this.pdTriggerService.customer_url_data.pdid && this.pdTriggerService.customer_url_data.rdmstr) {
+        if(this.pdTriggerService.customer_url_data && this.pdTriggerService.customer_url_data.pdid && this.pdTriggerService.customer_url_data.rdmstr && this.pdTriggerService.customer_url_data.from == 'link') {
           let data= this.pdTriggerService.customer_url_data
           this.router.navigateByUrl('/personal_discussion/pdlist/viewpd?str='+data.pdid+'/'+data.rdmstr+'/link', {replaceUrl: true});
          
@@ -108,7 +108,7 @@ export class LoginComponent implements OnInit{
         let auth = { 'Username': this.email, 'Password': this.password, 'newpassword': result };
         this.aws.dologin(auth).subscribe(res => {
          this.getCommonSettings();
-         if(this.pdTriggerService.customer_url_data && this.pdTriggerService.customer_url_data.pdid && this.pdTriggerService.customer_url_data.rdmstr) {
+         if(this.pdTriggerService.customer_url_data && this.pdTriggerService.customer_url_data.pdid && this.pdTriggerService.customer_url_data.rdmstr && this.pdTriggerService.customer_url_data.from == 'link') {
           let data= this.pdTriggerService.customer_url_data
           this.router.navigateByUrl('/personal_discussion/pdlist/viewpd?str='+data.pdid+'/'+data.rdmstr+'/link', {replaceUrl: true});
          
@@ -139,7 +139,7 @@ export class LoginComponent implements OnInit{
     //alert(this.shared.isLoggedIn);
       if(this.shared.isLoggedIn){
        // alert("if");
-       if(this.pdTriggerService.customer_url_data) {
+       if(this.pdTriggerService.customer_url_data &&  this.pdTriggerService.customer_url_data.pdid && this.pdTriggerService.customer_url_data.rdmstr && this.pdTriggerService.customer_url_data.from == 'link') {
         let data= this.pdTriggerService.customer_url_data
         this.router.navigateByUrl('/personal_discussion/pdlist/viewpd?str='+data.pdid+'/'+data.rdmstr+'/link', {replaceUrl: true});
        }