<nav class="navbar navbar-expand-lg navbar-light  custom_style" style="z-index: 20;">
  <!-- <a class="navbar-brand" href="#">Navbar</a> -->
  <!-- <img src={{this.logo}} > -->
  <img src={{this.logo}} style="width:140px;padding-left: 10px;height: 50px;">
  <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
    <span class="navbar-toggler-icon"></span>
  </button>
  <!-- <div [ngStyle]="{'background-color': style1 ? 'red' : (style2 ? 'blue' : null) }"> style="flex: 1;text-align: center;padding-left: 70px;"paddingLeft-->
  <div class="collapse navbar-collapse list_style" id="navbarSupportedContent">
    <div [ngClass]="paddingLeft?'changePadding1':'changePadding'">
      <div>
        <ul class="navbar-nav mr-auto">
          <li class="nav-item dropdown hoverStyle" style="text-align: center;padding-top: 5px;cursor: pointer;">
            <!-- <i class="fas fa-user-shield" style="font-size: 20px;"></i> -->
            <div data-toggle="dropdown">
              <i class="fas fa-user-shield" style="color:white"></i>
              <a class="nav-link dropdown-toggle" style="padding-top: 0px !important;
              padding-bottom: 10px !important;cursor: pointer;" id="navbarDropdown" role="button"  aria-haspopup="true" aria-expanded="false">
                {{'Admin' | translate}}
              </a>
            </div>    
            <div class="dropdown-menu dropdown_style" aria-labelledby="navbarDropdown">
              
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin" (click)="addressList('admin')">{{'Address approval' | translate}}</a>
<!-- *ngIf="(useridd == '59cbbdbe508f164aa2fef3d8')" -->
              <li class="dropdown-submenu dropdown_style" *ngIf="(useridd == '59cbbdbe508f164aa2fef3d8')">
                <a class="nav-link dropdown-toggle"
                  style="width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;"
                  data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true"> <span style="margin-left: 13px;">Billing</span></a>
                <ul class="dropdown-menu dropdown_style">
                  <li *ngIf="this.reportArray[3].Rstatus == true" class="dropdown_style" (click)="billing('report')"
                    style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                    <a>{{'Billing Details' | translate}}</a></li>
                  <li *ngIf="this.reportArray[5].Rstatus == true" class="dropdown_style" (click)="deviceList()"
                    style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                    <a>{{'Device List' | translate}}</a></li>
                  <li *ngIf="this.reportArray[5].Rstatus == true" class="dropdown_style" (click)="inActiveAdmins()"
                    style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                    <a>{{'Inactive Admins' | translate}}</a>
                  </li>
                 
                </ul>
              </li>



              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" (click)="Ddetail('admin')">{{'Driver Master' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin" (click)="DModel('admin')">{{'Device Model' | translate}}</a>
              <a *ngIf="superAdmin || custtype" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" (click)="deviceMaster('admin')">{{'Device Master' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="showIMEI" (click)="imeiFind('admin')">{{'IMEI Finder' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin || isOperator" (click)="deviceInventoryList('admin')">{{'Inventory List' | translate}}</a>
              <li class="dropdown-submenu dropdown_style">
                <a class="nav-link dropdown-toggle"
                  style="width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;"
                  data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true"> <span
                    style="margin-left: 13px;">Installation</span></a>
                <ul class="dropdown-menu dropdown_style">
                  <li *ngIf="this.reportArray[3].Rstatus == true" class="dropdown_style" (click)="technician('admin')"
                    style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                    <a>{{'Technicians' | translate}}</a>
                  </li>
                  <li *ngIf="this.reportArray[5].Rstatus == true" class="dropdown_style" (click)="jobCard('admin')"
                    style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                    <a>{{'Job Card' | translate}}</a>
                  </li>
              
                </ul>
              </li>
              <a class="dropdown-item" *ngIf="superAdmin"
                style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;"
                 (click)="issueList('admin')">{{'Issue List' | translate}}</a>
                <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin || custtype" (click)="messageUtility('admin')">{{'Message Utility' | translate}}</a>
              
                <li class="dropdown-submenu dropdown_style">
                  <a class="nav-link dropdown-toggle"
                    style="width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;"
                    data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true"> <span
                      style="margin-left: 13px;">Master</span></a>
                  <ul class="dropdown-menu dropdown_style">
                    <li *ngIf="this.reportArray[3].Rstatus == true" class="dropdown_style" (click)="modelMaster('admin')"
                      style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                      <a>{{'Model Master' | translate}}</a>
                    </li>
                    <li *ngIf="this.reportArray[5].Rstatus == true" class="dropdown_style" (click)="RTOMaster('admin')"
                      style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                      <a>{{'RTO Master' | translate}}</a>
                    </li>
              
                  </ul>
                </li>
               
              <!-- <a *ngIf="superAdmin" class="dropdown-item"
                style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;"
                (click)="modelMaster('admin')">{{'Model Master' | translate}}</a> -->
              <a *ngIf="superAdmin" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" (click)="subAdmin('admin')">{{'Subadmin' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin" (click)="gpsMaster('admin')">{{'System Logs' | translate}}</a>
                            <!-- <a class="dropdown-item"
                              style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;"
                              *ngIf="superAdmin" (click)="RTOMaster('admin')">{{'RTO Master' | translate}}</a> -->

              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin" (click)="tutorialVideos('admin')">{{'Tutorial Videos' | translate}}</a>
              <a class="dropdown-item"
              style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;"
              *ngIf="showIMEI" (click)="userFinder('admin')">{{'User Finder' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin" (click)="userMaster('admin')">{{'User Master' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin || custtype" (click)="VType('admin')">{{'Vehicle Type' | translate}}</a>


                     <!-- <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin" (click)="censorDetail('admin')">{{'Sensor Details' | translate}}</a> -->


                   <!-- <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" *ngIf="superAdmin || isOperator" (click)="commandQueue('admin')">{{'Comman Queue' | translate}}</a> -->
                     <!-- commanQueue -->
            </div>
       
          </li>
          <li class="nav-item active hoverStyle" (click)="soon('soon')" style="cursor: pointer;padding-top: 5px;">
            <i class="fas fa-home" style="color:white"></i>
            <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important;">{{'Dashboard' | translate}} <span
                class="sr-only">(current)</span></a>
          </li>
          <li class="nav-item hoverStyle" style="cursor: pointer;padding-top: 5px;" (click)="group('group')">      
            <i class="fab fa-audible" style="color:white"></i>
            <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important;"> {{'Groups' | translate}}</a>
          </li>
          <li class="nav-item dropdown hoverStyle" style="cursor: pointer;padding-top: 5px;">
            <!-- <i class="fas fa-home" ></i> -->
            <div data-toggle="dropdown">
              <i class="fas fa-car" style="color:white"></i>
              <a class="nav-link dropdown-toggle" style="padding-top: 0px !important;padding-bottom: 10px !important;cursor: pointer;" id="navbarDropdown" role="button" 
                aria-haspopup="true" aria-expanded="false">   {{'Vehicles' | translate}}</a>
            </div>  
            <div class="dropdown-menu dropdown_style" aria-labelledby="navbarDropdown">
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;;" (click)="devi('devi')">{{'Vehicle List' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" (click)="reminder_list('devi')">{{'Maintenance Reminder' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" (click)="vehicleExpense('routes')">{{'Vehicle Expense' | translate}}</a>
            <a *ngIf="superAdmin || custtype" class="dropdown-item"style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;"(click)="deviceRenew('admin')">{{'Vehicle Renewal Report' | translate}}</a>
            <a *ngIf="superAdmin || custtype" class="dropdown-item"
              style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;"
              (click)="deviceInventory()">{{'Device Inventory' | translate}}</a>
            </div>
          </li>
          <li class="nav-item dropdown hoverStyle" style="text-align: center;padding-top: 5px;cursor: pointer;">
            <!-- <i class="fas fa-home" style="color:white"></i> -->
            <div data-toggle="dropdown">
              <i class="fas fa-road" style="color:white"></i>
              <a class="nav-link dropdown-toggle" style="padding-top: 0px !important;padding-bottom: 10px !important;cursor: pointer;"
                id="navbarDropdown" role="button"  aria-haspopup="true" aria-expanded="false">
                {{'Tracking' | translate}}
              </a>
            </div>   
            <div class="dropdown-menu dropdown_style" aria-labelledby="navbarDropdown">
              <a id="d" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" class="dropdown-item" (click)="openNav('openNav')">{{'Live Tracking' | translate}}</a>
              <a id="d" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" class="dropdown-item" (click)="TrackingHistory('devi')">{{'History Tracking' | translate}}</a>
              <!-- <a id="d" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" class="dropdown-item" (click)="livetrack('devi')">{{'OpenMAp' | translate}}</a> -->
            </div>
          </li>
          <li class="nav-item hoverStyle" style="cursor: pointer;padding-top: 5px;" (click)="geo('geo')">
            <i class="fas fa-bullseye" style="color:white"></i>
            <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important"> {{'Geofencing' | translate}}</a>
          </li>
          <!-- <li class="nav-item dropdown hoverStyle" (click)="reports()" style="text-align: center;padding-top: 5px;cursor: pointer;"> 
          <i class="fas fa-file" style="color:white"></i>
            <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important"> {{'Reports' |
              translate}}</a>
            </li> -->
            <li class="nav-item dropdown hoverStyle" style="text-align: center;padding-top: 5px;cursor: pointer;">
              <!-- <i class="fas fa-home" style="color:white"></i> -->
              <div data-toggle="dropdown">
              <i class="fas fa-file" style="color:white"></i>
                <a class="nav-link dropdown-toggle"
                  style="padding-top: 0px !important;padding-bottom: 10px !important;cursor: pointer;" id="navbarDropdown"
                  role="button" aria-haspopup="true" aria-expanded="false">
                  {{'Reports' | translate}}
                </a>
              </div>
              <div class="dropdown-menu dropdown_style" aria-labelledby="navbarDropdown">
                <a id="d" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;"
                  class="dropdown-item" (click)="reports()">{{'Reports' | translate}}</a>
                <a id="d" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;"
                  class="dropdown-item" (click)="reportScedule()">{{'Schedule Report ' | translate}}</a>
                <!-- <a id="d" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" class="dropdown-item" (click)="livetrack('devi')">{{'OpenMAp' | translate}}</a> -->
              </div>
            </li>
            <!-- <div data-toggle="dropdown">
              <i class="fas fa-file" style="color:white"></i>
              <a class="nav-link dropdown-toggle" style="padding-top: 0px !important;padding-bottom: 10px !important;cursor: pointer;" id="navbarDropdown" role="button"  aria-haspopup="true" aria-expanded="false">  {{'Reports' |translate}} </a>
            </div>
            <div class="dropdown-menu dropdown_style" style="height: auto; overflow-y: auto;max-height: 600px;"
              aria-labelledby="navbarDropdown">
              <a *ngIf="this.reportArray[17].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
              padding-bottom: 7px;
              font-size: 14px;" (click)="acReport('report')">{{'AC Reports' | translate}}</a>
           
              <a *ngIf="this.reportArray[0].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                  padding-bottom: 7px;
                  font-size: 14px;" (click)="report('report')">{{'Daily Reports' | translate}}</a>
                    
                    <a *ngIf="this.reportArray[0].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                    padding-bottom: 7px;
                    font-size: 14px;" (click)="daily_logs('report')">{{'Daily Logs' | translate}}</a>
              <a *ngIf="this.reportArray[1].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                  padding-bottom: 7px;
                  font-size: 14px;" (click)="daywisereport()">{{'Daywise Reports' | translate}}</a>
                     <a *ngIf="this.reportArray[14].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                     padding-bottom: 7px;
                     font-size: 14px;" (click)="distance_report('report')">{{'Distance Reports' | translate}}</a>
                              <a *ngIf="this.reportArray[18].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                              padding-bottom: 7px;
                              font-size: 14px;" (click)="driverPerformance('report')">{{'Driver Performance Reports' | translate}}</a>
                    <a *ngIf="this.reportArray[9].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                    padding-bottom: 7px;
                    font-size: 14px;" (click)="geofancingReport('report')">{{'Geofencing Reports' | translate}}</a>
                      <a *ngIf="this.reportArray[4].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                      padding-bottom: 7px;
                      font-size: 14px;" (click)="idleReport('routes')">{{'IDLE Reports' | translate}}</a>
                           <a *ngIf="this.reportArray[13].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                           padding-bottom: 7px;
                           font-size: 14px;" (click)="ignition_report('report')">{{'Ignition Reports' | translate}}</a>
                            <a *ngIf="this.reportArray[21].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                            padding-bottom: 7px;
                            font-size: 14px;" (click)="loadUnload('report')">{{'Loading Unloading Trip' | translate}}</a>
                                  <a *ngIf="this.reportArray[13].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                                  padding-bottom: 7px;font-size: 14px;" (click)="notification('notification')">{{'Notification Center' | translate}}</a>
                            
              <a *ngIf="this.reportArray[10].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
              padding-bottom: 7px;
              font-size: 14px;" (click)="overspeed('report')">{{'Overspeeding Reports' | translate}}</a>
                      <a *ngIf="this.reportArray[15].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                      padding-bottom: 7px;
                      font-size: 14px;" (click)="POI_report('report')">{{'POI Reports' | translate}}</a>
                         <a *ngIf="this.reportArray[11].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                         padding-bottom: 7px;
                         font-size: 14px;" (click)="routeViolation('report')">{{'Route variations Reports' | translate}}</a>
              <a *ngIf="this.reportArray[2].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                  padding-bottom: 7px;
                  font-size: 14px;" (click)="report_speed('report')">{{'Speed Variation' | translate}}</a>
                                
              <a *ngIf="this.reportArray[8].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
              padding-bottom: 7px;
              font-size: 14px;" (click)="summaryReport('report')">{{'Summary Reports' | translate}}</a>
               <a *ngIf="this.reportArray[12].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
               padding-bottom: 7px;
               font-size: 14px;" (click)="stoppage_report('report')">{{'Stoppage Reports' | translate}}</a>
                        <a *ngIf="this.reportArray[16].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                        padding-bottom: 7px;
                        font-size: 14px;" (click)="SOS_report('report')">{{'SOS Reports' | translate}}</a>
             
              <a *ngIf="this.reportArray[6].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                  padding-bottom: 7px;
                  font-size: 14px;" (click)="trip_report('report')">{{'Trip Reports' | translate}}</a>
                   
              <a *ngIf="this.reportArray[7].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                  padding-bottom: 7px;
                  font-size: 14px;" (click)="travelPath('report')">{{'Travel Path Reports' | translate}}</a>
      
     
          
     
                        <a *ngIf="this.reportArray[18].Rstatus == true" class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;
                        padding-bottom: 7px;
                        font-size: 14px;" (click)="workingHour('report')">{{'Working Hours Reports' | translate}}</a>
                        
                        <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;" (click)="mainReport()">{{'Maintenance Reports' | translate}}</a>
            </div> -->
          <!-- </li> -->
          <li class="nav-item dropdown hoverStyle" style="text-align: center" style="cursor: pointer;padding-top: 5px;">
            <!-- <i class="fas fa-home" style="color:white"></i> -->
            <div  data-toggle="dropdown">
              <i class="fas fa-map-marker-alt" style="color:white"></i>
              <a class="nav-link dropdown-toggle" style="padding-top: 0px !important;padding-bottom: 10px !important" id="navbarDropdown"
                role="button" aria-haspopup="true" aria-expanded="false">  
              {{'POI List' | translate}}
              </a>
            </div>
            <div class="dropdown-menu dropdown_style" aria-labelledby="navbarDropdown" style="cursor: pointer;"
              (click)="POIlist('routes')">
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px;padding-bottom: 7px;font-size: 14px;">{{'POI List' | translate}}</a>
            </div>
          </li>
          <li class="nav-item dropdown hoverStyle" style="text-align: center;padding-top: 5px;cursor: pointer;">
            <div data-toggle="dropdown">
              <i class="fab fa-bandcamp" style="color:white"></i>
              <a class="nav-link dropdown-toggle" style="padding-top: 0px !important;padding-bottom: 10px !important"
                id="navbarDropdown" role="button"  aria-haspopup="true" aria-expanded="false"> 
                {{'Routes' | translate}} </a>
            </div>  
            <div class="dropdown-menu dropdown_style" aria-labelledby="navbarDropdown">
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" (click)="vehicleRoute('routes')">{{'Route list' | translate}}</a>
              <a class="dropdown-item" style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;" (click)="route_map('routes')">{{'Manage Trips' | translate}}</a>
              <a class="dropdown-item"
                style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;"
                (click)="route_plan('route_plan')">{{'Route Plan' | translate}}</a>
                <a class="dropdown-item"
                  style="cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; font-size: 14px;"
                  (click)="route_planReport('route_plan')">{{'Route Plan Report' | translate}}</a>
            </div>
          </li>
          <li class="nav-item dropdown hoverStyle" style="text-align: center;padding-top: 5px;cursor: pointer;">
            <div data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true">
              <!-- <i class="fab fa-bandcamp" style="color:white"></i> -->
              <!-- <i class="fa fa-border-all" ></i> -->
              <i class="fab fa-accusoft" style="color:white"></i>
              <a class="nav-link dropdown-toggle" style="padding-top: 0px !important;padding-bottom: 10px !important" id="navbarDropdown" role="button"  aria-haspopup="true" aria-expanded="false">  {{'Sensor' | translate}} </a>
            </div>        
            <!-- <a class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true"> <span class="nav-label">Services</span> <span class="caret"></span></a> -->
            <ul class="dropdown-menu" style="padding: 0;">
                <li class="dropdown-submenu dropdown_style">
                    <a  class="nav-link dropdown-toggle" style="width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true"> Fuel</a>
                    <ul class="dropdown-menu dropdown_style" >    
                        <li *ngIf="this.reportArray[3].Rstatus == true" class="dropdown_style" (click)="fuel_report('routes')" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;"><a >{{'Fuel Chart' | translate}}</a></li>
                        <li *ngIf="this.reportArray[5].Rstatus == true" class="dropdown_style"  (click)="dev_fuel_report()" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;"><a >{{'Consumption Reports' | translate}}</a></li>
                        <li *ngIf="this.reportArray[5].Rstatus == true" class="dropdown_style" (click)="fuel_report1()"
                          style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;">
                          <a>{{'Fuel Reports' | translate}}</a></li>
                        <li class="dropdown_style" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;"  *ngIf="superAdmin || custtype" (click)="VType('admin')"><a >Fuel Calibration</a></li>
                        <li class="dropdown_style" (click)="fuelPrice('admin')" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;" ><a >Fuel Price</a></li>                 
                    </ul>
                </li>
                <li class="dropdown-submenu dropdown_style">
                  <a  class="nav-link dropdown-toggle" style="width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> Temperature</a>
                  <ul class="dropdown-menu dropdown_style" >
                      <li class="dropdown_style" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;" (click)="censorDetail('admin')"><a>Temperature Chart</a></li>
                      <li class="dropdown_style" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;" (click)="tempDetal('admin')"><a>Temperature Report</a></li>
                      <li class="dropdown_style" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;" *ngIf="superAdmin || custtype" (click)="VType('admin')"><a>Calibration</a></li>
                  </ul>
              </li>
              <li class="dropdown-submenu dropdown_style">
                <a  class="nav-link dropdown-toggle" style="width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> RFID</a>
                <ul class="dropdown-menu dropdown_style" >
                    <li class="dropdown_style" style="padding-left: 5px;width: 100% !important;cursor: pointer;border-bottom: 1px solid;padding-top: 7px; padding-bottom: 7px; padding-right: 20px;font-size: 14px;"><a>Rfid Report</a></li>        
                </ul>
            </li>
            </ul>
        </li>

        <li *ngIf="(useridd == '59cbbdbe508f164aa2fef3d8')" class="nav-item hoverStyle" (click)="toll()"
          style="cursor: pointer;padding-top: 5px;">
          <!-- <i class="fas fa-home" style="color:white"></i> -->
          <i class="fa fa-building" style="color:white"></i>
          <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important;"> {{'Toll' |
            translate}}</a>
        </li>
        
          <li *ngIf="isOrganisation" class="nav-item hoverStyle" (click)="adddistributers()" style="cursor: pointer;padding-top: 5px;">
            <!-- <i class="fas fa-home" style="color:white"></i> -->
            <i class="fas fa-user-lock" style="color:white"></i>
            <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important;"> {{'Distributors' | translate}}</a>
          </li>
          <li *ngIf="superAdmin" class="nav-item hoverStyle" (click)="dealerInfo('dealerInfo')" style="cursor: pointer;padding-top: 5px;">
            <!-- <i class="fas fa-home" style="color:white"></i> -->
            <!-- <i class="fas fa-users" style="color:white"></i> -->
            <i class="fas fa-user" style="color:white"></i>
            <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important;"> {{'Dealers' | translate}}</a>
          </li>
          <li class="nav-item hoverStyle" *ngIf="cust || superAdmin" (click)="addcus('addcus')" style="cursor: pointer;padding-top: 5px;">
            <i class="fas fa-users" style="color:white"></i>
            <a class="nav-link" style="padding-top: 0px !important;padding-bottom: 10px !important;"> {{'Customers' | translate}}</a>
          </li>
    
            <!-- <li class="dropdown">
                <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="true"> <span class="nav-label">Services</span> <span class="caret"></span></a>
                <ul class="dropdown-menu">
                    <li><a href="#">Service A</a></li>
                    <li><a href="#">Service B</a></li>
                    <li class="dropdown-submenu">
                        <a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false"> <span class="nav-label">Service C</span><span class="caret"></span></a>
                        <ul class="dropdown-menu">
                            <li><a href="#">Service C1</a></li>
                            <li><a href="#">Service C2</a></li>
                            <li><a href="#">Service C3</a></li>
                            <li><a href="#">Service C4</a></li>
                            <li><a href="#">Service C5</a></li>
                        </ul>
                    </li>
                </ul>
            </li> -->
        </ul>
      </div>
    </div>
    <div style=" float: left; padding-top: 10px; ">
      <p style="margin-top: 0px;margin-bottom:0 ;color: white;margin-left: 20px;border-radius: 20px;background: #fff;color: #212529; font-size: 14px;padding: 0px 5px;font-weight: 600;">{{fs}}</p>
    </div>
    <div style="width: 80px; float: right;">
      <md-menu #appMenu="mdMenu" [overlapTrigger]="false">
        <div class="row" style="margin: 0; margin-bottom: 10px;">
          <div class="col-3" style="padding: 0;">
              <div style="text-align: center;">
                <img  *ngIf="!ppSHOW" src="../../assets/userAccount.png" alt="UserImage" height="60" style="width: 100%;">
                <img  *ngIf="ppSHOW" style="border-radius: 50%;" src="{{profilePic}}" alt="UserImage" height="60" width="60" crossorigin="anonymous">
              </div>
          </div>
          <div class="col-9" style="padding-left: 10px !important;font-size: 18px;font-weight: 400;">
            <div><span>{{fs}}</span><span style="padding-left: 5px;">{{ls}}</span></div>
            <p style="margin-bottom: 0;">{{mb}}</p>
            <div *ngIf = "availaPointsFlag === true" title="Available Points" style="font-size: 15px;">
              <span > <i class="fas fa-coins" style="color: #cf6b05;font-size: 18px;"></i></span>
              <span style="margin-left: 15px;font-weight: 600;color: #656565;">{{pointCount}}</span>
            </div>
            <p >{{or}}</p>
          </div>
        </div>
        <div class="row" style="margin: 0;">
          <div class="col-6" >
            <button type="reset" md-raised-button class="btn btn-default" style="background: #e2e2e2;" (click)="myaccount('myaccount')">{{'My Account' | translate}}</button>
          </div>
          <div class="col-6" >
            <button *ngIf="dealer" md-raised-button class="w3-button w3-red" (click)="mydealer('mydealer')">{{'Dealer Account' | translate}}</button>
          <button *ngIf="sup_admin" md-raised-button class="w3-button w3-red" (click)="super_Admin('mydealer')">{{'Admin Account' | translate}}</button>
            <button *ngIf="logoutbut" md-raised-button class="btn btn btn-success" style="color:white" (click)="logout()">{{'Log Out' | translate}}</button>
          </div>
        </div>
      </md-menu>
      <button md-icon-button [mdMenuTriggerFor]="appMenu" style="float:right;outline:none;padding-top: 6px;">
        <i class="fas fa-user" style=" color: white; font-size: 20px;"></i>
      </button>
      <app-notification></app-notification>
    </div>
    <!-- <ul fxShow fxHide.xs="true" fxHide.lt-md="true" fxHide.gt-sm="false" style="float:right;width:11%; margin-top: 3%;padding-left:0%">
          <md-menu #appMenu="mdMenu" [overlapTrigger]="false">
            <h5>&nbsp;&nbsp;{{fs}} {{ls}}&nbsp;&nbsp;</h5>
            <h5>&nbsp;&nbsp;{{mb}}</h5>
            <h5>&nbsp;&nbsp;{{or}}</h5>
            <br> &nbsp;
            <button  type="reset" class="btn btn-default" (click)="myaccount('myaccount')">My Account</button>
            &nbsp;
            <button *ngIf="dealer" class="w3-button w3-red" (click)="mydealer('mydealer')">Dealer Account</button> &nbsp;
            <button *ngIf="sup_admin" class="w3-button w3-red" (click)="super_Admin('mydealer')">Admin Account</button> &nbsp;    
            <button *ngIf="logoutbut" class="btn btn btn-success" (click)="logout()">&nbsp;&nbsp;&nbsp;Log
              Out&nbsp;&nbsp;&nbsp;</button> &nbsp;
          </md-menu>
          <button md-icon-button [mdMenuTriggerFor]="appMenu" style="float:right;outline:none">
            <img src="../../assets/image/us.jpg" height=24px>
          </button>
          <app-notification></app-notification>
        </ul> -->

  </div>

</nav>