trip management

src/app/app.module.ts

@@ -283,6 +283,7 @@ import { UserSettingComponent } from './user-setting/user-setting.component';
 import { IndexingReportComponent } from './indexingReport/index-report.component';
 import { IssueListKycComponent } from './kyc-approval/issue-list/issue-list.component';
 import { IssueAddKycComponent } from './kyc-approval/issue-add/issue-add.component';
+import { TripManagementReportComponent } from './report/report component/trip-management/trip-management-report.component';
 // import { DisatanceReportComponent } from './report/disatance-report/disatance-report.component';
 // import { MainComponent } from './report/main/main.component';
 // import { AcReportsComponent } from './report/ac-report/ac-report.component';
@@ -380,6 +381,7 @@ export function createTranslateLoader(http: Http) {
     DistanceReportComponent,
     AlertReportComponent,
     TripReportComponent,
+    TripManagementReportComponent,
     GroupComponent,
     AddGroupComponent,
     DialogDemoComponent,

src/app/app.router.ts

@@ -211,6 +211,7 @@ import { DeviceSettingComponent } from './device-setting/device-setting.componen
 import { UserSettingComponent } from './user-setting/user-setting.component';
 import { CurrentPositionReportComponent } from './report/report component/current-position/current-position.component';
 import { IndexingReportComponent } from './indexingReport/index-report.component';
+import { TripManagementReportComponent } from './report/report component/trip-management/trip-management-report.component';
 // import { DeviceFuelReportComponent } from './device-report/device-fuel-report/device-fuel-report.component';
 // import { DeviceSOSreportComponent } from './device-report/device-sosreport/device-sosreport.component';
 // import { TripByDeviceComponent } from './device-report/trip-by-device/trip-by-device.component';
@@ -486,6 +487,10 @@ export const router: Routes =[
         path: 'trip_report', 
         component: TripReportComponent, 
       },
+      {
+        path: 'trip_management_report', 
+        component: TripManagementReportComponent, 
+      },
       {
         path: 'travel_path_report', 
         component: NewTravelPathReportComponent, 

src/app/dashboard/download-certificate/download-certificate.component.html

@@ -56,7 +56,7 @@
           <tbody style="font-size: 10px;">
             <tr>
               <td>VEHICLE REG.NO</td>
-              <td></td>
+              <td>{{data.deviceInfo && data.deviceInfo.Device_Name?data.deviceInfo.Device_Name:''}}</td>
             </tr>
             <tr>
               <td>VEHICLE REG.DATE</td>

src/app/device-report/report-filter/report-filter.component.html

@@ -1,3 +1,4 @@
+sdfsd
 <div class="mainClass">
   <div class="row" *ngIf="(componentIdentifier != 'billing_detail')&&(componentIdentifier != 'censor_detail')&&(componentIdentifier != 'usersMaster')&&(componentIdentifier != 'deviceMaster')&&(componentIdentifier != 'deviceRenew')&&(componentIdentifier != 'gps_master')&& (componentIdentifier != 'deviceList')" style="margin: 0;padding-top: 10px;background: #f9f6f6; ">
     <div class="col-sm-12 col-md-12 col-lg-12" style="padding-left: 10px; padding-right: 10px;">

src/app/device-report/report-filter/report-filter.component.ts

@@ -183,7 +183,7 @@ export class ReportFilterComponent implements OnInit {
               
              if ((this.componentIdentifier === 'trip_report')||(this.componentIdentifier === 'distance_report')||(this.componentIdentifier === 'idle_report')||(this.componentIdentifier == 'fuel_consumption_report')||(this.componentIdentifier === 'poi_report')||(this.componentIdentifier === 'stoppage_report')||(this.componentIdentifier === 'vehicle_expenses')||(this.componentIdentifier === 'loadunloadTrip')||(this.componentIdentifier === 'maintanance_report')){
                 a['selectedValue'] = this.devicesss.devices[i]._id ; 
-              }else if ((this.componentIdentifier === 'fuel_report_graph')||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'over_speed')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'device_sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_report')|| (this.componentIdentifier === 'dayWiseReport')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master')){
+              }else if ((this.componentIdentifier === 'fuel_report_graph')||(this.componentIdentifier === 'trip_management_report')||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'over_speed')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'device_sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_report')|| (this.componentIdentifier === 'dayWiseReport')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master')){
                 a['selectedValue'] = this.devicesss.devices[i].Device_ID ; 
               }
               this.options.push(a);

src/app/kyc-approval/kyc-approval.component.html

@@ -28,9 +28,9 @@
         <li class="nav-item">
           <a class="nav-link active" data-toggle="tab"  (click)="changeTab('deviceKYC')" role="tab">Device KYC</a>
         </li>
-        <li class="nav-item">
+        <!-- <li class="nav-item">
           <a class="nav-link active" data-toggle="tab"  (click)="changeTab('issues')" role="tab">Issues</a>
-        </li>
+        </li> -->
       
       </ul>
       <form class="form-inline my-2 my-lg-0">

src/app/location/create-trip/create-trip.component.html

@@ -37,15 +37,35 @@
             <input type="text" mdInput name="text" id="txtSource"  placeholder="{{'Select destination' | translate}}">
           </md-form-field>
     </div>
-    <div class="col-4" style="margin-top: 5px;">
+    <div class="col-4">
-        <button md-raised-button style="background: #31428c; color: white;" (click)="create_trip()" >{{'Create Trip' | translate}}</button>
+      <md-form-field style="margin-left: 2%;">
-        <button md-raised-button style="background: red; color: white;" (click)="this.dialogRef.close()" >{{'Cancel' | translate}}</button>
+        <input type="text" mdInput name="text" [(ngModel)]="trip_charge" placeholder="{{'Amount' | translate}}">
+      </md-form-field>
+    </div>
+    <div class="col-4">
+      <md-form-field style="margin-left: 2%;">
+        <input type="text" mdInput name="text" [(ngModel)]="cargo_weight" placeholder="{{'Weight' | translate}}">
+      </md-form-field>
+    </div>
+    <div class="col-4">
+      <md-form-field style="margin-left: 2%;">
+        <input type="text" mdInput name="text" [(ngModel)]="cargo_content" placeholder="{{'material' | translate}}">
+      </md-form-field>
+    </div>
+   
+  </div>
+  <div class="row" *ngIf="errorMessage">
+    <div class="col-12" style="padding-left: 50px; font-weight: 500; color: #7d1e1e;">
+      <!-- <p style="margin-bottom: 0%">Total Distance: <span id="total"></span></p> -->
+      Error : {{errorMessage}}
     </div>
   </div>
   <div class="row">
-    <div class="col-12" style="padding-left: 50px; font-weight: 500; color: #7d1e1e;">
+    <div class="col-8"></div>
-      <p style="margin-bottom: 0%">Total Distance: <span id="total"></span></p>
+    <div class="col-4" style="margin-top: 5px;">
-    </div>
+      <button md-raised-button style="background: #31428c; color: white;" (click)="create_trip()" >{{'Create Trip' | translate}}</button>
+      <button md-raised-button style="background: red; color: white;" (click)="this.dialogRef.close()" >{{'Cancel' | translate}}</button>
+  </div>
   </div>
 
   <div id="poiAddMap" style="width: 100% ; height:400px"></div>

src/app/location/create-trip/create-trip.component.ts

@@ -14,7 +14,10 @@ export class CreateTripComponent implements OnInit {
   addlng: number;
   AddMapObj: any;
   addressString: any;
-  source_address: any;
+  source_address = {
+    lat:0,
+long:0
+  };
   poiRadius:any;
   POINAME:any;
   TripName:any;
@@ -27,7 +30,9 @@ export class CreateTripComponent implements OnInit {
   IMEI: any;
   Dealer: any;
   supAdmin: any;
-
+  trip_charge:string;
+  cargo_weight:string;
+  cargo_content:string;
   constructor(public dialogRef: MdDialogRef<GetdevdetailComponent>,
     @Inject(MD_DIALOG_DATA) public data: any,public contactService: ContactService) { 
       console.log("dataVehicle=>",data);
@@ -36,9 +41,15 @@ export class CreateTripComponent implements OnInit {
 
   ngOnInit() {
     this.mapFunction();
-    this.source_address = new google.maps.places.Autocomplete(document.getElementById('txtSource'));
+    let autocompleted = new google.maps.places.Autocomplete(document.getElementById('txtSource'));
+    autocompleted.addListener('place_changed', ()=>{
+      var place = autocompleted.getPlace();
 
-    this.contactService.getdevById(this.vehData.vehicleId).subscribe(res=>{
+    this.source_address.lat = place.geometry.location.lat(),
+    this.source_address.long = place.geometry.location.lng();
+      console.log(place,autocompleted)
+    });
+    this.contactService.getdevById(this.vehData.Device_ID).subscribe(res=>{
       var tempObj = JSON.parse(res['_body']);
       console.log("tempObj", tempObj);
 
@@ -266,27 +277,33 @@ export class CreateTripComponent implements OnInit {
      });
  
   }
+  errorMessage = '';
   create_trip(){
   
-   
+   this.errorMessage = '';
   if(this.TripName == undefined){
-    console.log("TripName is Mendatory");
+    this.errorMessage = "TripName is Mendatory";
-  }else{
+  } else if(!this.source_address.lat) {
+    this.errorMessage = "Place is Mendatory";
+  } else{
     var payload = {
       "user": this.useridd,
       "device": this.IMEI,
-      "start_loc": {
+      "start_loc": this.vehData.LatLng,
-        "lat": this.addLat,
-        "long": this.addlng
-      },
       "trip_status": 'Started',
-      "end_loc": {
+      "end_loc": this.source_address,
-        "lat": this.destLat,
-        "long": this.destLong
-      },
       "trip_name": this.TripName,
-      "start_time": new Date().toISOString()
+      "start_time": new Date().toISOString(),
+      "trip_charge":this.trip_charge,
+      "cargo_weight":this.cargo_weight,
+      "cargo_content" :this.cargo_content
   
+  }
+  {
+    
+    
+    
+   
   }
 
   if(this.Dealer != undefined){

src/app/location/location.component.ts

@@ -6133,11 +6133,7 @@ export class LocationComponent implements OnInit, OnDestroy {
   playPause: boolean = true;
   startCreatingFlightPath: boolean = false;
   createTrip(dev) {
-    // console.log('devicedevicedevice=>', dev);
+    let DeviceObj = dev;
-
-    var DeviceObj = localStorage.getItem('devDetail') ? JSON.parse(localStorage.getItem('devDetail')) : {};
-
-
     var vehicleLatLng = {
       lat: this.latToPass,
       long: this.longToPass

src/app/location/sho-route-plan/sho-route-plan.component.ts

@@ -17,6 +17,12 @@ export class ShoRoutePlanComponent implements OnInit {
   destination: string;
   constructor(private fb:FormBuilder,public dialogRef: MdDialogRef<ShoRoutePlanComponent>,@Inject(MD_DIALOG_DATA) public data: any,private contactService: ContactService) { 
     console.log(data);
+    this.userId = JSON.parse(window.atob(window.localStorage.token.split('.')[1]))._id;
+    this.routeForm=this.fb.group({
+      routeName:[''],
+      source:[''],
+      destination:['']
+    })
     if(data.data.length>0){
       this.clocation_1(data.data[0].lat,data.data[0].lng,'source');
       this.clocation_1(data.data[data.data.length-1].lat,data.data[data.data.length-1].lng,'destination');
@@ -24,17 +30,13 @@ export class ShoRoutePlanComponent implements OnInit {
         this.location.push([element.lng,element.lat])
       });
     }
+    
+
+    console.log(this.location,this.source,this.destination);
   }
 
   ngOnInit() {
-    this.userId = JSON.parse(window.atob(window.localStorage.token.split('.')[1]))._id;
+    
-    this.routeForm=this.fb.group({
-      routeName:[''],
-      source:[''],
-      destination:['']
-    })
-
-    console.log(this.location,this.source,this.destination);
     
   }
 
@@ -93,28 +95,28 @@ export class ShoRoutePlanComponent implements OnInit {
       console.log("IN",res);
       if (res.message == "Address not found in databse") {
        if(type=="source"){
-         this.routeForm.patchValue({
+         outerThis.routeForm.patchValue({
            source:""
          })
-         this.source=""
+         outerThis.source=""
        }else{
-         this.routeForm.patchValue({
+         outerThis.routeForm.patchValue({
            destination:""
          })
-         this.destination=""
+         outerThis.destination=""
        }
        
       } else {
          if(type=="source"){
-           this.routeForm.patchValue({
+           outerThis.routeForm.patchValue({
            source:res.address
          })
-         this.source=res.address
+         outerThis.source=res.address
        }else{
-           this.routeForm.patchValue({
+           outerThis.routeForm.patchValue({
            destination:res.address
          })
-         this.destination=res.address
+         outerThis.destination=res.address
        }
         // latlngObj['address'] = res.address;
 

src/app/report/report component/trip-management/trip-management-report.component.html

@@ -0,0 +1,161 @@
+<!-- <app-all-menus></app-all-menus> -->
+<div class="topDiv">
+  <div class="row" style="text-align: center; background: #426E86; padding-top: 10px; padding-bottom: 10px; color: white;box-shadow:3px 1px 5px 0px rgb(178, 176, 174)">
+    <div class="col-sm-12 col-md-12 col-lg-12">
+      <h4>{{'Trip Management'|translate}}</h4>
+    </div>
+  </div>  
+  <!-- <div class="row rowStyle" >
+    <div class="col-sm-12 col-md-12 col-lg-12">
+      <app-report-filter></app-report-filter>
+    </div>
+  </div> -->
+  <div class="row rowStyle">
+    <!-- <div class="col-sm-3 col-md-3 col-lg-3" style="padding-left: 20px; padding-right: 5px; padding-top: 5px; padding-bottom: 5px;">
+    
+      <div class="row" style="margin:0px;height: 84vh;background: white;box-shadow: 3px 1px 5px 0px #b2b0ae;">
+        <div class="col-sm-12 col-md-12 col-lg-12" style="padding:0px">
+            <app-report-filter (onReportFIlter)= "getReport($event)" [componentIdentifier]="identifier"></app-report-filter>
+        </div>
+      </div>
+    </div> -->
+    <div class="col-sm-12 col-md-12 col-lg-12" style="padding-left: 5px; padding-right: 20px; padding-top: 5px;">
+      <div class="row" style="margin:0px;height: 84vh;padding-top:10px;padding-bottom:5px;background: white;box-shadow: 3px 1px 5px 0px #b2b0ae;">
+        <div class="col-sm-12 col-md-12 col-lg-12">
+          <div *ngIf="Load" class="loading">Loading&#8230;</div>
+          <div style="width: 100%;height:84vh;">
+            <table id="deviceTable" cellspacing="0" style="width: 100%;font-size: 14px;">
+                <thead style="background-color:#e0e0e0;color: #444444;">
+                    <tr>
+                      <th style="text-align: left">{{'Trip Name' | translate}}</th>
+                      <th style="text-align: left">{{'Start Time' | translate}}</th>
+                      <th style="text-align: left">{{'End Time' | translate}}</th>
+                      <th style="text-align: left">{{'Trip Status' | translate}}</th>
+                      <th style="text-align: left">{{'Start Address' | translate}}</th>
+                      <th style="text-align: left">{{'End Address' | translate}}</th>
+                      <th style="text-align: left">{{'Amount' | translate}}</th>
+                      <th style="text-align: left">{{'Weight' | translate}}</th>
+                      <th style="text-align: left">{{'Material' | translate}}</th>
+                    </tr>
+                </thead>  
+            </table>
+        </div> 
+        </div>
+      </div> 
+    </div>
+  </div>
+</div>
+
+<table id="headerTable" style="border: 1px solid black;width: 100%;
+            border-collapse: collapse;position: absolute;top: -62px;">
+  <tr style="height:30px;border-top:1px solid black;">
+    <td>
+      <span style="font-weight: 700;">Report Interval from</span> {{f_date | date:"medium"}} to {{t_date |
+      date:"medium"}}
+    </td>
+    <!-- <td>
+            <span style="font-weight: 700;">To</span>: {{todate | date:"medium"}}
+          </td> -->
+  </tr>
+
+</table>
+<!-- 
+
+<app-all-menus></app-all-menus>
+<div style="min-height:100vh;padding-top:6%">
+  <p class="headStyle">{{'Trips Report' | translate}}</p>
+  <div class="InputStyle">
+    <div class="row">
+      <div class="col-md-3" style="padding-left: 70px; padding-top: 15px;">
+  
+          <select id="select" multiple="multiple" >
+              <option *ngFor="let option_1 of options" value={{option_1.id}} >{{ option_1.value }}</option>
+            </select>
+      </div>
+      <div class="col-md-3">
+        <span>{{'From Date' | translate}}</span>
+        <owl-date-time [(ngModel)]="Fromdate" [hourFormat]="'12'" [dateFormat]="'DD/MM/YYYY hh:mm:a'" [autoClose]="true"></owl-date-time>
+      </div>
+      <div class="col-md-3">
+        <span>{{'To Date' | translate}}</span>
+        <owl-date-time [(ngModel)]="todate" [hourFormat]="'12'"  [dateFormat]="'DD/MM/YYYY hh:mm:a'" [autoClose]="true"></owl-date-time>
+      </div>
+      <div class="col-md-3" style="top: 16px;">
+        <button style="background-color: #484848;color:#fdfdfd" md-raised-button class="btn btn-primary w3-button/" (click)="tripReport(Fromdate,todate)">{{'Trip Report' | translate}}</button>
+        <button style="background-color: #d81111;color:#fdfdfd;" md-raised-button class="btn btn-primary w3-button/" (click)="exportExcel()">{{'Export to excel' | translate}}</button>
+      </div>
+    </div>
+  </div>
+  <table class="table table-striped table-hover " style="overflow-y: hidden;
+           overflow-x: hidden;font-size:12px">
+  <div class="loading" *ngIf="Load">Loading&#8230;</div> 
+    <thead style="background-color:#A2C523;color: white;">
+      <tr>
+        <th style="text-align: center">{{'Vehicle Name' | translate}}</th>
+        <th style="text-align: center">{{'From Date' | translate}}</th>
+        <th style="text-align: center">{{'From Location' | translate}}</th>
+        <th style="text-align: center">{{'To date' | translate}}</th>
+        <th style="text-align: center">{{'To location' | translate}}</th>
+        <th style="text-align: center">{{'Distance (Km/hr)' | translate}}</th>
+     
+      </tr>
+    </thead>
+    <tbody>
+
+      <tr *ngFor="let device of summary">
+        <td style="cursor:pointer;text-align: center">{{device.device?device.device.Device_Name:""}}</td>
+        <td style="cursor:pointer;text-align: center">{{device.start_time | date:'short'}}</td>
+        <td style="cursor:pointer;text-align: center">
+       
+            <p *ngIf="device.startAddress != undefined">{{device.startAddress}}</p>
+            <a *ngIf="device.startAddress == undefined" href={{addressLink}} target="_blank" (click)= "getlink1(device)" md-tooltip="Click to get device's last location"><img height="20px" width="20px" src="../../../assets/image/addressICON.png"><a href={{getlink(device)}} target="_blank"></a></a>
+       
+        
+        </td>
+        <td style="cursor:pointer;text-align: center">{{device.end_time | date:'short'}}</td>
+        <td style="cursor:pointer;text-align: center">
+          <p *ngIf="device.endAddress != undefined">{{device.endAddress}}</p>
+          <a *ngIf="device.endAddress == undefined" href={{addressLink1}} target="_blank" (click)= "getlink1(device)" md-tooltip="Click to get device's last location"><img height="20px" width="20px" src="../../../assets/image/addressICON.png"><a href={{getlink1(device)}} target="_blank"></a></a>
+        
+        </td>
+        <td style="cursor:pointer;text-align: center">{{device.distance/1000 ? (device.distance/1000 | number: '1.2-2' ): 0}}</td>
+      </tr>
+    </tbody>
+  </table>
+  <table id="test"class="table table-striped table-hover " style="display: none">
+  <div class="loading" *ngIf="Load">Loading&#8230;</div> 
+    <thead style="background-color:#A2C523;color: white;">
+      <tr>
+        <th style="text-align: center">Vehicle Name</th>
+        <th style="text-align: center">From Date</th>
+        <th style="text-align: center">From Location</th>
+        <th style="text-align: center">To date</th>
+        <th style="text-align: center">To location</th>
+        <th style="text-align: center">Distance (Km/hr)</th>
+     
+      </tr>
+    </thead>
+
+    <tbody>
+
+      <tr *ngFor="let device of summary">
+        <td style="cursor:pointer;text-align: center">{{device.device?device.device.Device_Name:""}}</td>
+        <td style="cursor:pointer;text-align: center">{{device.start_time | date:'short'}}</td>
+        <td style="cursor:pointer;text-align: center">
+      
+            <p *ngIf="device.startAddress != undefined">{{device.startAddress}}</p>
+            <a *ngIf="device.startAddress == undefined" href={{addressLink}} target="_blank" (click)= "getlink(device)" md-tooltip="Click to get device's last location"><img height="20px" width="20px" src="../../../assets/image/addressICON.png"><a href={{getlink(device)}} target="_blank">Click here to get address</a></a>
+       
+        
+        </td>
+        <td style="cursor:pointer;text-align: center">{{device.end_time | date:'short'}}</td>
+        <td style="cursor:pointer;text-align: center">
+          <p *ngIf="device.endAddress != undefined">{{device.endAddress}}</p>
+          <a *ngIf="device.endAddress == undefined" href={{addressLink1}} target="_blank" (click)= "getlink1(device)" md-tooltip="Click to get device's last location"><img height="20px" width="20px" src="../../../assets/image/addressICON.png"><a href={{getlink1(device)}} target="_blank">Click here to get address</a></a>
+        
+        </td>
+        <td style="cursor:pointer;text-align: center">{{device.distance/1000 ? (device.distance/1000 | number: '1.2-2' ): 0}}</td>
+      </tr>
+    </tbody>
+  </table>
+</div> -->

src/app/report/report component/trip-management/trip-management-report.component.scss

@@ -0,0 +1,36 @@
+.topDiv {
+  // padding-top: 59px;
+  background: whitesmoke;
+  height: 100vh;
+}
+
+.rowStyle {
+  // margin: 5px;
+  // background: white;
+  height: 84vh;
+  // box-shadow: 3px 1px 5px 0px #b2b0ae;
+}
+
+#deviceTable input {
+  border-radius: 5px;
+}
+
+::-webkit-scrollbar {
+  width: 10px;
+}
+
+/* Track */
+::-webkit-scrollbar-track {
+  background: rgb(153, 153, 153);
+}
+
+/* Handle */
+::-webkit-scrollbar-thumb {
+  // background: rgb(74, 118, 184);
+  background: #868e96;
+}
+
+/* Handle on hover */
+::-webkit-scrollbar-thumb:hover {
+  background: #555;
+}

src/app/report/report component/trip-management/trip-management-report.component.spec.ts

@@ -0,0 +1,26 @@
+import { async, ComponentFixture, TestBed } from '@angular/core/testing';
+import { TripManagementReportComponent } from './trip-management-report.component';
+
+
+
+describe('TripManagementReportComponent', () => {
+  let component: TripManagementReportComponent;
+  let fixture: ComponentFixture<TripManagementReportComponent>;
+
+  beforeEach(async(() => {
+    TestBed.configureTestingModule({
+      declarations: [ TripManagementReportComponent ]
+    })
+    .compileComponents();
+  }));
+
+  beforeEach(() => {
+    fixture = TestBed.createComponent(TripManagementReportComponent);
+    component = fixture.componentInstance;
+    fixture.detectChanges();
+  });
+
+  it('should be created', () => {
+    expect(component).toBeTruthy();
+  });
+});

src/app/report/report component/trip-management/trip-management-report.component.ts

@@ -0,0 +1,635 @@
+import { Component, OnInit } from '@angular/core';
+import { ContactService } from '../../../contact.service';
+import {MdDialog, MdDialogRef, MD_DIALOG_DATA} from '@angular/material';
+import { MyaccountComponent } from '../../../myaccount/myaccount.component';
+import { Params,Router, ActivatedRoute, CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
+declare var google: any;
+declare var jsPDF : any;
+declare var $: any;
+const PDF_EXTENSION = ".pdf"
+import * as moment from 'moment';
+import { PlayTripComponent } from '../../../play-trip/play-trip.component';
+import { ReportService } from '../../report.service';
+import { Subject } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+
+@Component({
+  selector: 'app-trip-management-report',
+  templateUrl: './trip-management-report.component.html',
+  styleUrls: ['./trip-management-report.component.scss']
+})
+export class TripManagementReportComponent implements OnInit {
+  dataSelect: any[];
+  addressLink1: string;
+  finalArr=[]
+  private finalise = new Subject<void>();
+  constructor(private _service:ReportService,private contactService: ContactService,private router: Router,public dialog: MdDialog) {
+    this._service.invokeEventFortripMReport.pipe(
+      takeUntil(this.finalise)
+    ).subscribe(value => {
+        if(value){
+         this.getReport(value); 
+       }
+      });
+   }
+    ngOnDestroy(){
+    
+    this.finalise.next(void 0);
+  }
+  date1:any;
+  neww:any;
+  fs : any;
+  ls : any;
+  emailid : any;
+  or : any;
+  useridd :any;
+  time :any;
+  device_data:any;
+  devicess:any;
+  identifier : String = "trip_report";
+  final:any;
+  custtype:any;
+  cust:boolean=false;
+  Load : Boolean = false;
+  date : any;
+  devicesss:any;
+  mb:any;
+  logoutbut:boolean;
+  dealer:boolean;
+  text:any;
+  option:any; 
+  finall:any;
+  Fromdate:any;
+  
+  todate:any;
+  options=[];
+  logo:any;
+  before:any;
+  superAdmin:Boolean = false;
+  ngOnInit() {
+  
+    this.superAdmin = JSON.parse(window.atob(window.localStorage.token.split(".")[1])).isSuperAdmin;
+
+    this.fs = JSON.parse(window.atob(window.localStorage.token.split(".")[1])).fn;
+    this.ls = JSON.parse(window.atob(window.localStorage.token.split(".")[1])).ln;
+    this.emailid = JSON.parse(window.atob(window.localStorage.token.split(".")[1])).email;
+    this.or = JSON.parse(window.atob(window.localStorage.token.split(".")[1]))._orgName;
+    this.useridd = JSON.parse(window.atob(window.localStorage.token.split('.')[1]))._id;
+    this.mb =  JSON.parse(window.atob(window.localStorage.token.split('.')[1])).phn;
+    this.custtype =  JSON.parse(window.atob(window.localStorage.token.split('.')[1])).isDealer;
+ 
+
+
+      if(this.custtype == true){
+        this.cust = true;
+      }  
+      if(this.mb.charAt(0)=="n"){
+        this.mb = ' '
+      }
+
+
+      if( window.localStorage['Custumer'] == 'ON'){
+        this.logoutbut = false
+        this.dealer = true
+     }
+     else{
+         this.logoutbut = true
+     }
+          
+     this.logo=window.localStorage['logo'];
+     this.text=window.localStorage['text'];
+     this.testTable();
+       
+  }
+
+  
+device_summary =[];
+summary:any;
+d_name:any;
+total_running_time:any;
+stop_time:any;
+overSpeed:any;
+route_violation:any;
+trips:any;
+total_km:any;
+address_show:any;
+end_add_show:any;
+start_add:any;
+end_add:any;
+start_add_lat:any;
+start_add_long:any;
+end_add_lat:any;
+end_add_long:any;
+uId:any;
+devId:any;
+
+Durations:any;
+deviceArr:any=[];
+
+getReport(event){
+  if(event == 'getExcel'){
+    this.exportExcel();
+  } else if(event=='getPdf')
+  {
+    this.expotToPdf();
+  }else{
+    var deviceId: any;
+    var tpdata = event ; 
+    var that = this;
+    var fd = new Date(tpdata.fromDate);
+    var td  = new Date(tpdata.toDate);
+    if(event.deviceArr.length==0){
+      deviceId=[];
+    }else{
+      deviceId= event.deviceArr;
+    }
+    this.deviceArr = deviceId; 
+    this.Fromdate = fd;
+    this.todate = td;
+ 
+  
+   
+    this.tabelObj.ajax.reload();      
+   
+
+  }
+    
+
+
+}
+
+
+tab:any;
+exportExcel()
+{
+ 
+ 
+    var tab_text="<table border='2px'><tr bgcolor='#87AFC6'>";
+    var textRange; var j=0;
+    var table = $('#deviceTable').clone();
+    table[0].querySelector("thead").remove();
+    table[0].prepend($(".dataTable thead").clone()[0]);
+    this.tab = table[0];//document.getElementById('deviceTable'); // id of table
+
+    for(j = 0 ; j < this.tab.rows.length ; j++) 
+    {     
+        tab_text=tab_text+this.tab.rows[j].innerHTML+"</tr>";
+        //tab_text=tab_text+"</tr>";
+    }
+
+    tab_text=tab_text+"</table>";
+    // tab_text= tab_text.replace(/<A[^>]*>|<\/A>/g, "");//remove if u want links in your table
+    tab_text= tab_text.replace(/<img[^>]*>/gi,""); // remove if u want images in your table
+    tab_text= tab_text.replace(/<input[^>]*>|<\/input>/gi, ""); // reomves input params
+
+    var ua = window.navigator.userAgent;
+    var msie = ua.indexOf("MSIE "); 
+
+    var sa = window.open('data:application/vnd.ms-excel,' + encodeURIComponent(tab_text));  
+
+    return (sa);
+}
+
+filterStates(val) {
+
+  // console.log(val)
+
+ 
+  if (val==""){
+
+    this.dataSelect = [];
+    // console.log("deviceValue",this.dataSelect);
+  } else{
+ 
+    const filterValue:any = val;
+    
+     this.dataSelect = this.options.filter(function(d){
+      var t = d.value.toLocaleLowerCase().indexOf(filterValue.toLocaleLowerCase());
+    //  this.option = this.options[i];
+  
+   
+      return t > -1;    
+    });
+    
+      return this.dataSelect;
+  }
+
+}
+
+addressLink = "";
+getlink(report : any){
+ 
+  // console.log("report=>",report);
+  var lat = report.start_lat?report.start_lat:0;
+  var lng = report.start_long?report.start_long:0;
+  this.addressLink =  'https://maps.google.com/?q=' + lat + ',' + lng;
+  return this.addressLink ; 
+}
+
+getlink1(report:any){
+ 
+  // console.log("report=>",report);
+  var lat = report.end_lat?report.end_lat:0;
+  var lng = report.end_long?report.end_long:0;
+  this.addressLink1 =  'https://maps.google.com/?q=' + lat + ',' + lng;
+  return this.addressLink ; 
+}
+
+tabelObj: any ;
+testTable() {
+  const that = this;
+  console.log("inside function");
+  $(document).ready(function() {
+ 
+     that.tabelObj = $('#deviceTable').DataTable({
+        dom: 'lBftip',
+        buttons: [
+          'copy',
+          'print',
+          'excel'
+        ],       
+          "processing": false,
+          "searching": true, 
+          pagingType: 'full_numbers',
+          pageLength: 25,
+          serverSide: false,
+          "scrollY":'65vh',  
+          "scrollCollapse": true,     
+          lengthMenu: [[10, 25, 50, -1], [10, 25, 50, "All"]],
+          ajax: (dataTablesParameters,callback) => {
+            console.log('temptemptemptemptemp',dataTablesParameters);
+              var deviceID;
+              that.Load = true
+              console.log('that.deviceArr',that.deviceArr);    
+            var from_date = that.Fromdate;
+            var to_date = that.todate;
+            var user = that.useridd;
+            var temp = {
+            from_date : from_date,
+            to_date : to_date,
+            user : user
+            }
+            that.finalArr=[]
+            var suburl = "";
+            if((temp.from_date != undefined)&&(temp.to_date != undefined)){        
+              suburl = "/user_trip/listPlannedTrip";
+              
+              that.contactService.post(suburl,
+                {
+                  "device": that.deviceArr.length ? that.deviceArr[0] : [],
+                  "isAnnotated":true,
+                  "from":new Date(temp.from_date).toISOString(),
+                  "to":new Date(temp.to_date).toISOString()
+                  
+              }).subscribe((resp:any) => {   
+                if(resp.length) {
+                  resp.map(ite=>{
+                    ite.end_time = ite.end_time ? ite.end_time : ''
+                  })
+                }
+                that.finalArr=resp
+                 that.Load = false ;
+                 resp.sort((a, b) => new Date(b.start_time).getTime() - new Date(a.start_time).getTime());
+
+                  callback({data : resp });
+              }, err => {   
+                that.Load= false;    
+                console.log("error",err) ;     
+              });
+
+            }else{
+              that.Load = false ;
+              callback({data : [] });
+
+            }
+
+       
+        },  
+        "rowCallback": function(row: Node, data: any | Object, index: number){  
+          $('#playTrip', row).bind('click', () => {  
+            console.log(data);
+            var fd = new Date(data.start_time).toISOString();
+            var td = new Date(data.end_time).toISOString();
+              var replayObj= {
+                fromdate:fd,
+                todate : td,
+                user : that.useridd,
+                device:{imei: data.device.Device_ID,_id: data.device._id,iconType:data.device.iconType},
+                distance: (typeof data.distance === 'number')?(parseFloat(data.distance).toFixed(2)):0
+                
+              }
+
+              let dialogRef = that.dialog.open(PlayTripComponent, {    
+                data: replayObj
+              });
+            
+              dialogRef.afterClosed().subscribe(result => {
+                console.log(result);
+                if(result == 'cancelled'){
+                
+                }
+              })  
+             
+              
+            }); 
+             
+        }
+      ,
+
+      
+          "columns": [
+            {
+              "data": "trip_name",
+              render: function(data, type, row) {    
+              return data?data:'';
+              }
+          },
+              {
+                  "data": "start_time",
+                  render: function(data, type, row) {
+                    var st = new Date(data);
+                    return data ? (moment(st).format('llll')) : "";  
+                    
+                  }
+              },
+              {
+                "data": "end_time",
+                render: function(data, type, row) { 
+                  var et = new Date(data);
+                  return data ? (moment(et).format('llll')) : "";     
+                }
+            }  ,
+            {
+              "data": "trip_status",
+              render: function(data, type, row) {
+                // var st = new Date(data);
+                return data ? data : "";  
+                
+              }
+          },
+            {
+              "data": "startAddress",
+              "defaultContent": "_id",
+              render: function(data, type, row) {
+                var lat = row.start_lat?row.start_lat:0;
+                var long = row.start_long?row.start_long:0;   
+                var addressLink_start = '<a href="https://maps.google.com/?q='+ lat +','+long +' "  target="_blank" title="Click to get vehicle start location"> <img height="20px" width="20px" src="../../../assets/image/addressICON.png"> </a>';       
+                return data?data : addressLink_start;  
+            
+              }
+          },        
+            
+          {
+            "data": "endAddress",
+            "defaultContent": "_id",
+            render: function(data, type, row) { 
+              var lat = row.end_lat?row.end_lat:0;
+              var long = row.end_long?row.end_long:0;
+              var addressLink_end = '<a href="https://maps.google.com/?q='+ lat +','+long +' "  target="_blank" title="Click to get vehicle End location"> <img height="20px" width="20px" src="../../../assets/image/addressICON.png"> </a>';      
+              return data?data : addressLink_end;  
+           
+            }
+        },
+       
+      {
+        "data": "trip_charge",
+        render: function(data, type, row) {    
+        return data?data:'';
+        }
+    },
+    {
+      "data": "cargo_weight",
+      render: function(data, type, row) {    
+      return data?data:'';
+      }
+  },
+  {
+    "data": "cargo_content",
+    render: function(data, type, row) {    
+    return data?data:'';
+    }
+},
+          
+          ],  
+          "columnDefs": [
+            { className: "dt-body-left", "targets": [ 0,1,2,3,4,5 ] },
+            {
+              "targets": '_all',
+              "createdCell": function (td, cellData, rowData, row, col) {
+                  $(td).css('padding', '18px')
+              }
+          }   ,
+            { targets: 1, type: 'date' },
+
+         
+         
+          ] 
+      });
+
+  });
+
+}
+
+expotToPdf(){
+    console.log(this.finalArr);
+
+    this.downloadPdf()
+    
+  }
+
+// downloadPdf() {
+//     let fileName =
+//       "Trip Report" +
+//       new Date().getTime() +
+//       PDF_EXTENSION;
+//     var pdfsize = "a2";
+
+//     var doc = new jsPDF("p", "pt", pdfsize);
+  
+//   doc.setFontSize(15);
+//   doc.text('Trip Report ', 20, 30);
+//     doc.setFontStyle("arial");
+//     var header = function(data) {
+//     doc.setFontSize(15);
+//     doc.setTextColor(40);
+//     doc.setFontStyle('normal');
+   
+//   };
+
+//   var options = {
+//     beforePageContent: header,
+//     margin: {
+//       top: 120
+//     },
+//     startY: doc.autoTableEndPosY() + 20
+//   };
+
+//     doc.autoTable({
+//       head: this.headRows(),
+//       // margin: { top: 80 },
+//       body: this.bodyRows(this.finalArr.length, this.finalArr),
+//       options
+      
+//     });
+//     doc.save(fileName);
+//   }
+
+startAddress;
+
+endAddress;
+f_date
+t_date
+downloadPdf() {
+  var outerThis=this
+    let fileName =
+      "Trip Management Report" +
+      new Date()+
+      PDF_EXTENSION;
+    var pdfsize = "a2";
+    var totalPagesExp = "{total_pages_count_string}";
+//  outerThis.startAddress= outerThis.finalArr[0].address;
+//  outerThis.endAddress= outerThis.finalArr[outerThis.finalArr.length-1].address
+    var doc = new jsPDF("p", "pt", pdfsize);
+    outerThis.f_date = moment(this.Fromdate).format('lll'); 
+  outerThis.t_date =moment(this.todate).format('lll');
+  // var date_combine = f_date + ' to ' + t_date;
+  // doc.setFontSize(30);
+   var pageHeight = doc.internal.pageSize.height || doc.internal.pageSize.getHeight();
+var pageWidth = doc.internal.pageSize.width || doc.internal.pageSize.getWidth();
+  doc.setFontSize(15);
+  // doc.text(60, 20, 'Travel Path Report (Date='+date_combine+') Device Name='+this.device_name,);
+  
+  doc.text("Trip Report", 500, 30);
+    doc.setFontStyle("arial");
+
+      var header = function(data) {
+    doc.setFontSize(30);
+    doc.setTextColor(40);
+    doc.setFontStyle('arial');
+  
+  };
+
+  var options = {
+    beforePageContent: header,
+    margin: {
+      top: 120
+    },
+    
+    startY: doc.autoTableEndPosY() + 20
+  };
+ var logo=localStorage.getItem('logo1');
+ outerThis.toDataURL(logo, function (dataUrl) {
+                
+    doc.autoTable({
+      head: outerThis.headRows(),
+      // margin: { top: 80 },
+      //  startY: doc.autoTable.previous.finalY + 200,
+      body: outerThis.bodyRows(outerThis.finalArr.length, outerThis.finalArr),
+      options,
+       styles: {overflow: 'linebreak'},
+      // tableLineColor: [0, 0, 0], //choose RGB
+        // tableLineWidth: 0.5, //table border width
+        // bodyStyles: {
+        //     margin: 40,
+        //     fontSize: 10,
+        //     lineWidth: 0.2,
+        //     lineColor: [0, 0, 0]
+        // },
+      theme:'grid',
+      didDrawPage: function (data) {
+        // Header
+        doc.setFontSize(20);
+        doc.setTextColor(40);
+        doc.setFontStyle('arial');
+        // logo=localStorage.getItem('logo1');
+          if(logo)
+              doc.addImage(dataUrl, 'JPEG', pageWidth-100, 6, 75, 75);
+              doc.autoTable({html:"#headerTable",margin:{bottom:140,left:20,right:8,top:40},theme:'plain'});
+
+        // Footer
+        var str = "Page " + doc.internal.getNumberOfPages()
+        // Total page number plugin only available in jspdf v1.0+
+        if (typeof doc.putTotalPages === 'function') {
+            str = str + " of " + totalPagesExp;
+        }
+        doc.setFontSize(10);
+
+        // jsPDF 1.4+ uses getWidth, <1.4 uses .width
+        var pageSize = doc.internal.pageSize;
+        var pageHeight = pageSize.height ? pageSize.height : pageSize.getHeight();
+        doc.text(str, data.settings.margin.left, pageHeight - 10);
+    },
+    
+      margin: {top: 85},
+     
+    });
+    if (typeof doc.putTotalPages === 'function') {
+      doc.putTotalPages(totalPagesExp);
+    }
+    doc.save(fileName);
+  })
+  }
+
+   toDataURL(url, callback) {
+   
+        var xhr = new XMLHttpRequest();
+        xhr.onload = function () {
+            var reader = new FileReader();
+            reader.onloadend = function () {
+                callback(reader.result);
+            }
+            reader.readAsDataURL(xhr.response);
+        };
+        xhr.open('GET', url);
+        xhr.responseType = 'blob';
+        xhr.send();
+    }
+  headRows() {
+
+    return [
+  // displayedColumns=['vehicleName','IMEI','totalDistance','fuel','ignOn','ignOff','idleTime','outOfReach','noGps','trips','maxSpeed','startLocation','endLocation','details'];
+
+      {
+       
+        trip_name:"Trip name",
+start_time: "Start time",
+end_time: "End time",
+trip_status: "Trip status",
+startAddress: "Start Address",
+endAddress: "End Address",
+trip_charge: "Amount",
+cargo_weight: "Weight",
+cargo_content: "Material",
+        
+        
+      }
+    ];
+  }
+
+  bodyRows(rowCount, pdfBody) {
+    console.log(rowCount, pdfBody);
+
+    rowCount = rowCount || 10;
+    let body = [];
+    for (var j = 0; j < rowCount; j++) {
+      var stime = pdfBody[j].start_time ? new Date(pdfBody[j].start_time) : '';
+      var endTime = pdfBody[j].end_time? new Date(pdfBody[j].end_time):'';
+     
+      body.push({
+        trip_name:pdfBody[j].trip_name,
+        start_time: pdfBody[j].start_time? moment(pdfBody[j].start_time).format('llll'):'',
+        end_time: pdfBody[j].end_time ? moment(pdfBody[j].end_time).format('lll'):'',
+        startAddress:pdfBody[j].startAddress?pdfBody[j].startAddress:'N/A', 
+        endAddress:pdfBody[j].endAddress?pdfBody[j].endAddress:'N/A',
+        trip_status:pdfBody[j].trip_status?pdfBody[j].trip_status:'N/A',
+        trip_charge:pdfBody[j].trip_charge?pdfBody[j].trip_charge:'N/A',
+        cargo_weight:pdfBody[j].cargo_weight?pdfBody[j].cargo_weight:'N/A',
+        cargo_content:pdfBody[j].cargo_content?pdfBody[j].cargo_content:'N/A',
+      });
+    }
+    return body;
+  }
+
+
+
+}

src/app/report/report component/trip-report/trip-report.component.html

@@ -2,7 +2,7 @@
 <div class="topDiv">
   <div class="row" style="text-align: center; background: #426E86; padding-top: 10px; padding-bottom: 10px; color: white;box-shadow:3px 1px 5px 0px rgb(178, 176, 174)">
     <div class="col-sm-12 col-md-12 col-lg-12">
-      <h4>{{'1 Trip Report'|translate}}</h4>
+      <h4>{{'Trip Report'|translate}}</h4>
     </div>
   </div>  
   <!-- <div class="row rowStyle" >

src/app/report/report-filter/report-filter.component.html

@@ -92,7 +92,7 @@
         </div>
         <div class="col-sm-9 col-md-9 col-lg-9" style="padding: 0">
           <div>
-            <div *ngIf="componentIdentifier =='daywise_report'">
+            <div *ngIf="componentIdentifier =='daywise_report' || componentIdentifier === 'trip_management_report'" >
               <select (change)="onDateChange()"  id="dbselect_single">
               <option
                 *ngFor="let option_1 of options"
@@ -102,7 +102,7 @@
               </option>
             </select>
             </div>
-            <div *ngIf="componentIdentifier !='daywise_report'">
+            <div *ngIf="!(componentIdentifier =='daywise_report' || componentIdentifier === 'trip_management_report')">
             <select   id="dbselect" multiple="multiple">
               <option
                 *ngFor="let option_1 of options"

src/app/report/report-filter/report-filter.component.ts

@@ -99,6 +99,7 @@ export class ReportFilterComponent implements OnInit {
     {name : "Stoppage Report",Rstatus : true,Astatus:false,value:"stoppage_report"},
     {name : "SOS Report",Rstatus : true,Astatus:false,value:"sos_report"},
     {name:"Trip Report",Rstatus:true,Astatus:false,value:"trip_report"},
+    {name:"Trip Management",Rstatus:true,Astatus:false,value:"trip_management_report"},
     {name : "Travel Path Report",Rstatus : true,Astatus:false,value:"travel_path_report"},
     {name : "Working Hours Reports",Rstatus : true,Astatus:false,value:"working_hours_report"},
     {name : "Maintenance Reports",Rstatus : true,Astatus:false,value:"maintanance_report"},
@@ -364,9 +365,9 @@ export class ReportFilterComponent implements OnInit {
                 // deviceType: this.devicesss.devices[i].type_of_device,      
               }
              
-             if ((this.componentIdentifier === 'trip_report')||(this.componentIdentifier === 'idle_report')||(this.componentIdentifier == 'fuel_consumption_report')||(this.componentIdentifier === 'poi_report')||(this.componentIdentifier === 'stoppage_report')||(this.componentIdentifier === 'vehicle_expenses')||(this.componentIdentifier === 'loadunloadTrip')||(this.componentIdentifier === 'maintanance_report') || (this.componentIdentifier==="loading_unloading_trip") ){
+             if ((this.componentIdentifier === 'trip_report') ||(this.componentIdentifier === 'trip_management_report')||(this.componentIdentifier === 'idle_report')||(this.componentIdentifier == 'fuel_consumption_report')||(this.componentIdentifier === 'poi_report')||(this.componentIdentifier === 'stoppage_report')||(this.componentIdentifier === 'vehicle_expenses')||(this.componentIdentifier === 'loadunloadTrip')||(this.componentIdentifier === 'maintanance_report') || (this.componentIdentifier==="loading_unloading_trip") ){
                 a['selectedValue'] = this.devicesss[i]._id ; 
-             } else if ((this.componentIdentifier === 'fuel_report_graph') || (this.componentIdentifier === 'distance_report') || (this.componentIdentifier === 'ac_report')|| (this.componentIdentifier === 'travel_path_report') ||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'overspeed_report')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_hours_report')|| (this.componentIdentifier==="performanceReport")|| (this.componentIdentifier === 'daywise_report')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master') || !this.isCC ||(this.componentIdentifier === 'daily_logs') || ( this.componentIdentifier==="dataPushReport")||(this.componentIdentifier=="speed_variation")){
+             } else if ((this.componentIdentifier === 'fuel_report_graph')  || (this.componentIdentifier === 'distance_report') || (this.componentIdentifier === 'ac_report')|| (this.componentIdentifier === 'travel_path_report') ||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'overspeed_report')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_hours_report')|| (this.componentIdentifier==="performanceReport")|| (this.componentIdentifier === 'daywise_report')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master') || !this.isCC ||(this.componentIdentifier === 'daily_logs') || ( this.componentIdentifier==="dataPushReport")||(this.componentIdentifier=="speed_variation")){
                 a['selectedValue'] = this.devicesss[i].Device_ID ; 
 
               }
@@ -632,7 +633,7 @@ export class ReportFilterComponent implements OnInit {
 
     
     }
-    if (this.componentIdentifier === 'daywise_report') {
+    if (this.componentIdentifier === 'daywise_report' || (this.componentIdentifier === 'trip_management_report')) {
       setTimeout(() => {
 
         $('#dbselect_single').multipleSelect({
@@ -682,7 +683,7 @@ export class ReportFilterComponent implements OnInit {
   deviceFilterArr :any;
    reportFilter(data): void {
      var demo=[]
-     if (this.componentIdentifier == "daywise_report") {
+     if (this.componentIdentifier == "daywise_report" ||(this.componentIdentifier === 'trip_management_report')) {
        this.deviceArr =  $('#dbselect_single').multipleSelect('getSelects','value');
      } else {
 
@@ -874,6 +875,11 @@ export class ReportFilterComponent implements OnInit {
       if(this.componentIdentifier=="trip_report")
       this.reportService.tripReport(filter)
 
+      if(this.componentIdentifier=="trip_management_report"){
+
+        this.reportService.tripMReport(filter)
+      }
+
       if(this.componentIdentifier=="travel_path_report"){
         this.reportService.travelPathReport(filter)
       }
@@ -1003,9 +1009,14 @@ exportPDF(){
       if(this.componentIdentifier=="sos_report")
       this.reportService.sosReport(filter)
 
-      if(this.componentIdentifier=="trip_report")
+      if(this.componentIdentifier=="trip_report"){
-      this.reportService.tripReport(filter)
+       
+        this.reportService.tripReport(filter)
+      }
+      if(this.componentIdentifier=="trip_management_report"){
 
+        this.reportService.tripMReport(filter)
+      }
       if(this.componentIdentifier=="travel_path_report"){
         this.reportService.travelPathReport(filter)
       }
@@ -1093,6 +1104,10 @@ exportExel(){
       if(this.componentIdentifier=="trip_report")
       this.reportService.tripReport(filter)
 
+      if(this.componentIdentifier=="trip_management_report"){
+
+        this.reportService.tripMReport(filter)
+      }
       if(this.componentIdentifier=="travel_path_report"){
         this.reportService.travelPathReport(filter)
       }
@@ -1556,9 +1571,9 @@ onChangeGroup(event){
                 groupName:this.devicesss[i].groupName?this.devicesss[i].groupName:'',    
               }
              
-             if ((this.componentIdentifier === 'trip_report')||(this.componentIdentifier === 'idle_report')||(this.componentIdentifier == 'fuel_consumption_report')||(this.componentIdentifier === 'poi_report')||(this.componentIdentifier === 'stoppage_report')||(this.componentIdentifier === 'vehicle_expenses')||(this.componentIdentifier === 'loadunloadTrip')||(this.componentIdentifier === 'maintanance_report') || (this.componentIdentifier==="loading_unloading_trip")){
+             if ((this.componentIdentifier === 'trip_report') ||(this.componentIdentifier === 'trip_management_report')||(this.componentIdentifier === 'idle_report')||(this.componentIdentifier == 'fuel_consumption_report')||(this.componentIdentifier === 'poi_report')||(this.componentIdentifier === 'stoppage_report')||(this.componentIdentifier === 'vehicle_expenses')||(this.componentIdentifier === 'loadunloadTrip')||(this.componentIdentifier === 'maintanance_report') || (this.componentIdentifier==="loading_unloading_trip")){
                 a['selectedValue'] = this.devicesss[i]._id ; 
-             } else if ((this.componentIdentifier === 'fuel_report_graph') || (this.componentIdentifier === 'distance_report') || (this.componentIdentifier === 'ac_report')|| (this.componentIdentifier === 'travel_path_report') ||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'overspeed_report')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_hours_report')|| (this.componentIdentifier === 'daywise_report')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master')||!this.isCC ||(this.componentIdentifier === 'daily_logs') || ( this.componentIdentifier==="dataPushReport")||(this.componentIdentifier=="speed_variation")){
+             } else if ((this.componentIdentifier === 'fuel_report_graph')  || (this.componentIdentifier === 'distance_report') || (this.componentIdentifier === 'ac_report')|| (this.componentIdentifier === 'travel_path_report') ||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'overspeed_report')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_hours_report')|| (this.componentIdentifier === 'daywise_report')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master')||!this.isCC ||(this.componentIdentifier === 'daily_logs') || ( this.componentIdentifier==="dataPushReport")||(this.componentIdentifier=="speed_variation")){
                 a['selectedValue'] = this.devicesss[i].Device_ID ; 
 
               }
@@ -1585,9 +1600,9 @@ onChangeGroup(event){
          groupName:this.devicesss[i].groupName?this.devicesss[i].groupName:'',    
         }
         
-        if ((this.componentIdentifier === 'trip_report')||(this.componentIdentifier === 'idle_report')||(this.componentIdentifier == 'fuel_consumption_report')||(this.componentIdentifier === 'poi_report')||(this.componentIdentifier === 'stoppage_report')||(this.componentIdentifier === 'vehicle_expenses')||(this.componentIdentifier === 'loadunloadTrip')||(this.componentIdentifier === 'maintanance_report') || (this.componentIdentifier==="loading_unloading_trip")){
+        if ((this.componentIdentifier === 'trip_report')||(this.componentIdentifier === 'trip_management_report') ||(this.componentIdentifier === 'idle_report')||(this.componentIdentifier == 'fuel_consumption_report')||(this.componentIdentifier === 'poi_report')||(this.componentIdentifier === 'stoppage_report')||(this.componentIdentifier === 'vehicle_expenses')||(this.componentIdentifier === 'loadunloadTrip')||(this.componentIdentifier === 'maintanance_report') || (this.componentIdentifier==="loading_unloading_trip")){
           a['selectedValue'] = this.devicesss[i]._id ; 
-        } else if ((this.componentIdentifier === 'fuel_report_graph') || (this.componentIdentifier === 'distance_report') || (this.componentIdentifier === 'ac_report')|| (this.componentIdentifier === 'travel_path_report') ||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'overspeed_report')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_hours_report')|| (this.componentIdentifier === 'daywise_report')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master')||!this.isCC ||(this.componentIdentifier === 'daily_logs') || ( this.componentIdentifier==="dataPushReport")||(this.componentIdentifier=="speed_variation")){
+        } else if ((this.componentIdentifier === 'fuel_report_graph')  || (this.componentIdentifier === 'distance_report') || (this.componentIdentifier === 'ac_report')|| (this.componentIdentifier === 'travel_path_report') ||(this.componentIdentifier === 'temp_report_graph')||(this.componentIdentifier === 'summary_report')||(this.componentIdentifier === 'overspeed_report')||(this.componentIdentifier === 'daily_report')||(this.componentIdentifier === 'sos_report')||(this.componentIdentifier === 'ignition_report') ||(this.componentIdentifier === 'working_hours_report')|| (this.componentIdentifier === 'daywise_report')||(this.componentIdentifier === 'censor_detail')||(this.componentIdentifier === 'notification_master')||!this.isCC ||(this.componentIdentifier === 'daily_logs') || ( this.componentIdentifier==="dataPushReport")||(this.componentIdentifier=="speed_variation")){
           a['selectedValue'] = this.devicesss[i].Device_ID ; 
           
         }

src/app/report/report.service.ts

@@ -21,6 +21,8 @@ export class ReportService {
   invokeEventForstoppageReport:Subject<any>=new Subject();
   invokeEventForsosReport:Subject<any>=new Subject();
   invokeEventFortripReport:Subject<any>=new Subject();
+  
+  invokeEventFortripMReport:Subject<any>=new Subject();
   invokeEventForworkingHoursReport:Subject<any>=new Subject();
   invokeEventFormaintanceReport:Subject<any>=new Subject();
   invokeEventForSpeedVariationReport:Subject<any>=new Subject();
@@ -165,6 +167,9 @@ export class ReportService {
    tripReport(value){
      this.invokeEventFortripReport.next(value)
   }
+  tripMReport(value){
+   this.invokeEventFortripMReport.next(value)
+}
   workingHoursReport(value){
      this.invokeEventForworkingHoursReport.next(value)
   }

src/index.html

@@ -287,7 +287,7 @@
   <script src="https://www.gstatic.com/charts/loader.js"></script>
   <!-- AIzaSyCNT3eO1wPQHUhY_cmQ9N_9BkLzJ_GB9j8 -->
   <!-- old key AIzaSyDZKxpYMfGSyStS3fLuVqHuM6ZEJWtF1-k -->
-  <script  id= "mapApi" src="https://maps.google.com/maps/api/js?libraries=geometry,places,drawing&key=AIzaSyAkXHFCJb3wVCZm6qd-fp4WgNVZhet9AsE"></script>
+  <script  id= "mapApi" src="https://maps.google.com/maps/api/js?libraries=geometry,places,drawing&key=AIzaSyAatiGTPRsKL2lxDcGyMs6-Jr8bhow8ebA"></script>
   <!-- AIzaSyA_ycttLXPMfCSSNAfPOsaENPQ85i17lPU latest key used on 2 november -->
   <!-- AIzaSyCmSXnoBBGekErvqBvu5N7dbeqdH1pHp7c -->
   <!-- AIzaSyDllmSphAf92Mk69v46HFCiClWibYehkiU -->