pd view more mpa changes

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/allocation-view-more/allocation-view-more.component.html

@@ -1,17 +1,40 @@
-<h1 mat-dialog-title class="paragraph_change">{{data.first_name}}</h1>
+<h2 mat-dialog-title class="paragraph_change">
-<mat-dialog-content>
+        <div fxFlex="70" align="left">
-    <mat-card *ngFor="let moreDat of data.pd_details; let z=index;">
+                {{data.first_name}}
-      <mat-card-content>
+        </div>
-          <ol>
+        <div fxFlex="30" align="end">
-          <li>{{moreDat.pd_type_name}} ( ID : {{moreDat.pd_id}} )</li>
+                <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right" mat-dialog-close><mat-icon>close</mat-icon></button>
-          <li>{{moreDat.applicant_name}}</li>
+        
-          <li>{{moreDat.pd_status}}<span *ngIf="moreDat.scheduled_on"> ( {{moreDat.scheduled_on}} ) </span></li>
+        </div>
-            </ol>
+</h2>
-      </mat-card-content>
-    </mat-card>
 
+<mat-dialog-content>
+        <div fxLayout="row wrap">
+                <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="50" fxFlex.lg="60" fxFlex.xl="60">
+                    <mat-card>    
+                        <mat-card-content>
+                                <agm-map [latitude]="lat" [longitude]="lng">
+                                        <agm-marker [latitude]="lat" [longitude]="lng"></agm-marker>
+                                    </agm-map>
+                        </mat-card-content>
+                    </mat-card>
+                </div>
+                    <div fxFlex.xs="100" fxFlex.sm="100" fxFlex.md="50" fxFlex.lg="40" fxFlex.xl="40">
+                            <mat-card *ngFor="let moreDat of data.pd_details; let z=index;">
+                                    <mat-card-content>
+                                        <ol>
+                                        <li>{{moreDat.pd_status | titlecase}} ( {{moreDat.applicant_name | titlecase}} )</li>
+                                        <li>{{moreDat.scheduled_on | titlecase}} </li>  
+                                        <!-- <li>{{moreDat.pd_status}}</li> -->
+                                        <li>{{moreDat.pd_type_name | titlecase}} ( Id : {{moreDat.pd_id}} ) </li>
+                                        </ol>
+                                    </mat-card-content>
+                                  </mat-card>        
+                                    
+                        </div>
+                    </div>
 </mat-dialog-content>
-<mat-dialog-actions>
+<!-- <mat-dialog-actions>
     <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" matTooltip="Close" matTooltipPosition="right" mat-dialog-close><mat-icon>close</mat-icon></button>
 
-</mat-dialog-actions>
+</mat-dialog-actions> -->

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/allocation-view-more/allocation-view-more.component.scss

@@ -6,4 +6,39 @@ ol {
 }
 ol li:first-child {
     color: #62B013;
+}
+
+@import "../../../../../assets/styles/scss/material.variables";
+
+// :host {
+//   margin-left: -5px;
+//   margin-right: -5px;
+//   margin-top: -5px;
+//   display: block;
+//   height: 100%;
+// }
+.sebm-google-map-container {
+  width: 100%;
+  height: 500px;
+  display: flex;
+}
+
+$mat-toolbar-height-desktop: 64px !default;
+$mat-toolbar-height-mobile-portrait: 56px !default;
+$mat-toolbar-height-mobile-landscape: 48px !default;
+
+.mat-card-top {
+  margin-top: -($mat-toolbar-height-desktop);
+}
+
+@media ($mat-xsmall) and (orientation: portrait) {
+  .mat-card-top {
+    margin-top: -($mat-toolbar-height-mobile-portrait);
+  }
+}
+
+@media ($mat-small) and (orientation: landscape) {
+  .mat-card-top {
+    margin-top: -($mat-toolbar-height-mobile-landscape);
+  }
 }

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

@@ -7,7 +7,8 @@ import { MatDialogRef, MAT_DIALOG_DATA } from '@angular/material';
   styleUrls: ['./allocation-view-more.component.scss']
 })
 export class AllocationViewMoreComponent implements OnInit {
-
+  lat = -34.397;
+  lng = 150.644;
   constructor(private dialogRef: MatDialogRef<AllocationViewMoreComponent>,
     @Inject(MAT_DIALOG_DATA) public data: any) {
      }

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

@@ -3,12 +3,13 @@ import { MatPaginator, MatSort, MatTableDataSource, PageEvent } from '@angular/m
 import { ActivatedRoute, Router } from '@angular/router';
 import { NotifierService } from 'angular-notifier';
 import {  MatDialog } from '@angular/material';
-import { PdTrigerService } from '../../../pd-service/pd-triger.service';
+import { PdTrigerService } from './../../../pd-service/pd-triger.service';
-import { GetGeometricLocationService } from '../../../location-service/get-geometric-location.service';
+import { GetGeometricLocationService } from './../../../location-service/get-geometric-location.service';
-import { ListPdComponent } from '../list-pd.component';
+import { ListPdComponent } from './../list-pd.component';
-import { PdAllocationComponent } from '../pd-allocation/pd-allocation.component';
+import { PdAllocationComponent } from './../pd-allocation/pd-allocation.component';
-import { SmartPdAllocationComponent } from '../smart-pd-allocation/smart-pd-allocation.component';
+import { SmartPdAllocationComponent } from './../smart-pd-allocation/smart-pd-allocation.component';
-import { SchedulePdComponent } from '../schedule-pd/schedule-pd.component';
+import { TelePdAllocationComponent } from '././../tele-pd-allocation/tele-pd-allocation.component';
+import { SchedulePdComponent } from './../schedule-pd/schedule-pd.component';
 
 @Component({
   selector: 'app-map-pd-view',
@@ -122,9 +123,11 @@ pdList:any[] = [];
 
    // pd allocation to
    pdAllocationTo(pdData:any) {
-    if(pdData.fk_pd_type != 2){
+    if(pdData.fk_pd_type == 1){
       const dialogRef = this.dialog.open(PdAllocationComponent, {
         data: pdData,
+        width: '60%',
+        maxHeight: '60%',
         disableClose: true
       });
       dialogRef.afterClosed()
@@ -136,6 +139,8 @@ pdList:any[] = [];
     else if(pdData.fk_pd_type == 2){
       const dialogRef = this.dialog.open(SmartPdAllocationComponent, {
         data: pdData,
+        width: '60%',
+        maxHeight: '60%',
         disableClose: true
       });
       dialogRef.afterClosed()
@@ -144,6 +149,20 @@ pdList:any[] = [];
         this.loadPdDetails();
       });
     }
+    else if(pdData.fk_pd_type == 3){
+      const dialogRef = this.dialog.open(TelePdAllocationComponent, {
+        data: pdData,
+        width: '60%',
+        maxHeight: '60%',
+        disableClose: true,
+      });
+      dialogRef.afterClosed()
+      .subscribe(dataresult => {
+       // this.notifier.notify('success', 'Successfully allocated.!');
+
+       this.loadPdDetails();
+      });
+    }
    
    
   }

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

@@ -89,6 +89,7 @@ export class PdAllocationComponent implements OnInit {
         data: details,
         disableClose: true,
         position: { right: '0'},
+        width:'80%',
         // hasBackdrop:false
       });
       // dialogSchedule.afterClosed()

ng6-seed/src/app/personal-discussion/manage-pd/list-pd/smart-pd-allocation/smart-pd-allocation.component.html

@@ -84,8 +84,8 @@
         
         <mat-dialog-actions >
                 <div fxFlex="50" align="left">
-                        <p *ngIf="selectedCentralItem">Central Officer: {{selectedCentralItem.first_name}}</p>
+                        <p *ngIf="selectedCentralItem">Central Officer: {{selectedCentralItem.first_name | titlecase }}</p>
-                        <p *ngIf="selectedExcutiveItem">Executive: {{selectedExcutiveItem.first_name}}</p>
+                        <p *ngIf="selectedExcutiveItem">Executive: {{selectedExcutiveItem.first_name | titlecase}}</p>
                 </div>
             <div fxFlex="50" align="end">
                     <button mat-raised-button mat-icon-button class="mr-1 mb-1 hover-icon" type="button" (click)="getSecondCard()" matTooltip="Next" matTooltipPosition="below" *ngIf="showFirstCard"><mat-icon>arrow_forward</mat-icon></button>

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

@@ -110,6 +110,7 @@ export class SmartPdAllocationComponent implements OnInit {
          data: details,
          disableClose: true,
          position: { right: '0'},
+         width:'80%',
          // hasBackdrop:false
        });
        // dialogSchedule.afterClosed()

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

@@ -82,6 +82,7 @@ export class TelePdAllocationComponent implements OnInit {
          data: details,
          disableClose: true,
          position: { right: '0'},
+         width:'80%',
          // hasBackdrop:false
        });
        // dialogSchedule.afterClosed()