@aggdirect/coolmap 2.6.8 → 2.7.0

package/src/lib/component/add-route/add-route.component.html

@@ -1,136 +0,0 @@
-<div class="addroutebox">
-  <div class="routedetailbox" *ngIf="enablePopUp">
-    <div class="closebtnroutedetail">
-      <mat-icon (click)="prevantPopupClose = false; enablePopUp = false;">clear</mat-icon>
-    </div>
-      <lib-route-info-card [propData]="{className: 'routeCard', repository: config['repository']}" [popupData]="popupDetails"></lib-route-info-card>
-    <div class="createTxt">
-      <small>
-        Created by {{popupDetails['created_by_name']}} on {{popupDetails['created_at']}}
-      </small>
-      <button class="editbtn" (click)="editEvent()">Edit</button>
-    </div>
-  </div>
-  <div class="add_add_route_box" cdkDrag [style.visibility]="!enableForm ? 'hidden' : 'visible'">
-    <div class="topheadingprt">
-      <h2> {{routeId? 'EDIT' : 'ADD'}} ROUTE </h2>
-      <div class="buttonprt">
-        <button *ngIf="routeId" class="delbtn" (click)="openDialog()">Delete</button>
-        <button mat-raised-button type="submit" class="closebtn" (click)="changeNav.next('Addroute')">Close</button>
-      </div>
-    </div>
-    <form [formGroup]="addRouteForm">
-      <div class="route_form_area">
-        <div class="col-6">
-          <mat-form-field>
-            <mat-label>Route Name</mat-label>
-            <input matInput formControlName="route_name" autocomplete="nope" (mousedown)="$event.stopPropagation()">
-            <mat-error *ngIf="addRouteForm.controls['route_name'].hasError('required')">
-              Route Name is required
-            </mat-error>
-          </mat-form-field>
-        </div>
-        <div class="col-6">
-          <mat-form-field>
-            <mat-label>Customer_name</mat-label>
-            <input type="text" placeholder="Customer Name" matInput formControlName="customer_name" [matAutocomplete]="auto" (mousedown)="$event.stopPropagation()">
-            <mat-autocomplete autoActiveFirstOption #auto="matAutocomplete">
-              <mat-option *ngFor="let customer of customersList$ | async" [value]="customer['customer_name']">
-                {{customer['customer_name']}}
-              </mat-option>
-            </mat-autocomplete>
-            <mat-error *ngIf="addRouteForm.controls['customer_name'].hasError('required')">
-              Customer name is required.
-            </mat-error>
-          </mat-form-field>
-        </div>
-        <div class="col-6">
-          <mat-form-field>
-            <mat-label>Pickup</mat-label>
-            <input type="text" placeholder="Search..." matInput #filterPickup [matAutocomplete]="pickupAutocomplete"
-              formControlName="pickup_location" (mousedown)="$event.stopPropagation()">
-
-            <mat-autocomplete #pickupAutocomplete="matAutocomplete">
-              <mat-option (click)="selectedLongLat('pickup', option)" *ngFor="let option of pickupOptions"
-                [value]="option?.place_name">
-                {{option?.place_name}}
-              </mat-option>
-            </mat-autocomplete>
-          </mat-form-field>
-          <mat-error *ngIf="addRouteForm.controls['pickup_lat_lng'].touched && addRouteForm.controls['pickup_lat_lng'].hasError('required')">
-            Please select pickup location from the list.
-          </mat-error>
-        </div>
-        <div class="col-6">
-          <mat-form-field>
-            <mat-label>Delivery</mat-label>
-            <input type="text" placeholder="Search..." matInput #filterDelivery [matAutocomplete]="deliveryAutocomplete"
-              formControlName="delivery_location" (mousedown)="$event.stopPropagation()">
-            <mat-autocomplete #deliveryAutocomplete="matAutocomplete">
-              <mat-option (click)="selectedLongLat('delivery', option)" *ngFor="let option of deliveryOptions"
-                [value]="option?.place_name">
-                {{option?.place_name}}
-              </mat-option>
-            </mat-autocomplete>
-          </mat-form-field>
-          <mat-error *ngIf="addRouteForm.controls['delivery_lat_lng'].touched && addRouteForm.controls['delivery_lat_lng'].hasError('required')">
-            Please select delivery location from the list.
-          </mat-error>
-        </div>
-        <div class="col-6">
-          <mat-form-field>
-            <mat-label>Notes</mat-label>
-            <textarea style="height: 18px; resize: none;" matInput name="" id="" cols="30" rows="10" formControlName="note" autocomplete="nope" (mousedown)="$event.stopPropagation()"></textarea>
-            <mat-error *ngIf="addRouteForm.controls['note'].hasError('maxlength')">
-              Notes should be within 2048 characters.
-            </mat-error>
-          </mat-form-field>
-        </div>
-
-        <div class="col-6 d-flex">
-          <div class="inputbox m-0">
-            <mat-form-field>
-              <mat-label>Unit type</mat-label>
-              <mat-select formControlName="unit_id" (selectionChange)="checkAndFetchRouteInformation()" (mousedown)="$event.stopPropagation()">
-                <mat-option *ngFor="let unit of unitsList" [value]="unit?.id"> {{unit?.type}} </mat-option>
-              </mat-select>
-              <mat-error *ngIf="addRouteForm.controls['unit_id'].hasError('required')">
-                Unit is required
-              </mat-error>
-            </mat-form-field>
-          </div>
-
-          <div class="inputbox m-0">
-            <mat-form-field>
-              <mat-label>Material</mat-label>
-              <mat-select formControlName="materials_id" (mousedown)="$event.stopPropagation()">
-                <mat-option *ngFor="let material of materialsList" [value]="config.repository === 'coolmap' ? material?.material_id : material?.sub_material_id"> {{config.repository === 'coolmap' ? material?.material : material?.label}}
-                </mat-option>
-              </mat-select>
-              <mat-error *ngIf="addRouteForm.controls['materials_id'].hasError('required')">
-                Material is required
-              </mat-error>
-            </mat-form-field>
-          </div>
-        </div>
-        <div class="col-6">
-          <app-estimation-display *ngIf="addRouteForm?.value?.pickup_lat_lng && addRouteForm?.value?.delivery_lat_lng" [value]="addRouteForm['value']"></app-estimation-display>
-        </div>
-        <div class="col-6" *ngIf="addRouteForm['value']['trucker_pay_estimate'] && addRouteForm['value']['customer_price_estimate']">
-          <span *ngIf="config['repository'] !== 'customer'" class="estimate" (mousedown)="$event.stopPropagation()">
-            Trucker Pay Estimate - <b>{{'$'+ addRouteForm['value']['trucker_pay_estimate']}}</b>
-          </span>
-          <span class="estimate" (mousedown)="$event.stopPropagation()">
-            Customer Price Estimate - <b>{{'$'+ addRouteForm['value']['customer_price_estimate']}}</b>
-          </span>
-        </div>
-        <button mat-raised-button type="submit" (click)="saveRoute()" *ngIf="preventSave"
-          [disabled]="addRouteForm.invalid && preventSave || preventInitialSave">{{routeId? 'Update' : 'Save'}}
-        </button>
-        <div class="loader">
-          <mat-spinner *ngIf="!preventSave"></mat-spinner>
-        </div>
-      </div>
-    </form>
-  </div>
-</div>

package/src/lib/component/add-route/add-route.component.scss

@@ -1,236 +0,0 @@
-@import "../../../assets/variable.scss";
-.addroutebox{
-  width: calc(100% - 340px);
-  position: absolute;
-  left: 320px;
-  bottom: 10px;
-  display: flex;
-  justify-content: space-between;
-  align-items: flex-start;
-
-  .routedetailbox{
-    max-width: 300px;
-    padding: 10px;
-    background-color: #fff;
-    border-radius: 20px;
-    margin-right: 20px;
-    @media (min-width:1600px) {
-      max-width: 280px;
-    }
-  }
-  .editbtn{
-    background: #326ad3;
-    padding: 10px 25px 10px 25px;
-    color: white;
-    font-size: 0.8125rem;
-    border-radius: 30px;
-    float: right;
-  }
-}
-.add_add_route_box {
-  background: $white;
-  padding: 10px 20px;
-  border-radius: 20px;
-  box-shadow: 2px 4px 4px 2px rgb(0 0 0 / 14%);
-  height: 370px;
-  width: 100%;
-  position: relative;
-  cursor: move;
-
-  .route_form_area {
-    display: flex;
-    flex-wrap: wrap;
-    justify-content: space-between;
-    .col-6 {
-      width: 48%;
-      margin-top: 10px;
-      justify-content: space-between;
-      .inputbox {
-        width: 47%;
-      }
-      span {
-        font-size: 0.875rem;
-      }
-    }
-    button {
-      background: $blue;
-      padding: 0px 18px;
-      color: $white;
-      font-size: 0.8125rem;
-      border-radius: 30px;
-      position: absolute;
-      right: 18px;
-      top: 20px;
-      height: 35px;
-    }
-  }
-}
-.closebtn{
-  background: $black;
-  color: $white;
-  border-radius: 30px;
-  padding: 0px 18px;
-  margin-left: 10px;
-  height: 35px;
-}
-.delbtn{
-  background:red;
-  color: $white;
-  border-radius: 30px;
-  padding: 10px 18px 10px 18px;
-}
-.add_route_listingpart {
-  .listing_toggle {
-    background: $white;
-    border-radius: 15px;
-    padding: 8px 10px;
-    position: absolute;
-    right: 10px;
-    top: 30px;
-    cursor: pointer;
-  }
-}
-.listing_box {
-  background: #282828;
-  height: 100vh;
-  position: fixed;
-  right: 0;
-  top: 0;
-  z-index: 1111;
-  box-shadow: -3px 0px 5px 0px rgba(255, 255, 255, 0.08);
-  transition: 0.5s;
-  -webkit-transition: 0.5s;
-  transition: 0.5s;
-  -webkit-transition: 0.5s;
-  -moz-transition: 0.5s;
-  width: 0;
-  border-radius: 40px 0px 0px 40px;
-  opacity: 0;
-  .closebtn {
-    display: none;
-  }
-}
-.show {
-  .listing_box {
-    width: 250px;
-    max-width: 250px;
-    -webkit-box-flex: 0;
-    flex: 0 0 250px;
-    transition: 0.5s;
-    -webkit-transition: 0.5s;
-    transition: 0.5s;
-    -webkit-transition: 0.5s;
-    -moz-transition: 0.5s;
-    padding: 40px 0px 40px 20px;
-    opacity: 1;
-    @media (min-width:1600px) {
-      width: 320px;
-      max-width: 320px;
-      -webkit-box-flex: 0;
-      flex: 0 0 320px;
-    }
-    h2 {
-      color: $white;
-      white-space: nowrap;
-    }
-    ul {
-      padding: 0 20px 0 0;
-      li {
-        background: #4a4a4a;
-        padding: 15px;
-        border-radius: 15px;
-        display: flex;
-        margin-bottom: 15px;
-        .companayIcon {
-          width: 40px;
-          height: 40px;
-          border-radius: 10px;
-          background: $white;
-          margin-right: 10px;
-          display: flex;
-          justify-content: center;
-          align-items: center;
-        }
-        .company_cont {
-          width: calc(100% - 50px);
-          h3 {
-            color: $white;
-            font-size: 15px;
-            font-weight: normal;
-            margin: 0;
-            text-overflow: ellipsis;
-            max-width: 129px;
-            -webkit-box-orient: vertical;
-            white-space: nowrap;
-            overflow: hidden;
-            @media (min-width:1600px) {
-              max-width: 170px;
-            }
-          }
-          p {
-            color: #bcbcbc;
-            font-size: 12px;
-            margin: 5px 0;
-            overflow: hidden;
-            text-overflow: ellipsis;
-            display: -webkit-box;
-            -webkit-line-clamp: 2;
-            -webkit-box-orient: vertical;
-            line-height: 16px;
-          }
-        }
-      }
-    }
-  }
-  .closebtn {
-    position: absolute;
-    left: -33px;
-    top: 50px;
-    background: #282828;
-    color: $white;
-    padding: 8px;
-    border-top-left-radius: 15px;
-    border-bottom-left-radius: 15px;
-    cursor: pointer;
-    box-shadow: -4px 2px 5px 0px rgba(255, 255, 255, 0.08);
-    display: block;
-  }
-}
-.loader{
-    position: absolute;
-    width: 95%;
-    height: 100%;
-    display: flex;
-    justify-content: center;
-    align-items: center;
-    pointer-events: none;
-}
-.buttonprt{
-  margin-right: 83px;
-}
-
-.closebtnroutedetail{
-  box-shadow: 0px 0px 5px 0px rgba(0,0,0,0.11);
-  border-radius: 100%;
-  width: 30px;
-  height: 30px;
-  display: flex;
-  justify-content: center;
-  align-items: center;
-  cursor: pointer;
-  background: #fff;
-  position: absolute;
-  top: -11px;
-  left: -11px;
-}
-.routenotes{
-  max-height: 170px;
-  overflow: auto;
-}
-.estimate{
-  margin-right: 20px;
-  font-size: 0.7rem;
-  @media (min-width:1600px) {
-      font-size: 0.95rem;
-  }
-}

package/src/lib/component/add-route/add-route.component.spec.ts

@@ -1,23 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AddRouteComponent } from './add-route.component';
-
-describe('AddRouteComponent', () => {
-  let component: AddRouteComponent;
-  let fixture: ComponentFixture<AddRouteComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ AddRouteComponent ]
-    })
-    .compileComponents();
-
-    fixture = TestBed.createComponent(AddRouteComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});

package/src/lib/component/add-route/add-route.component.ts

@@ -1,295 +0,0 @@
-import { Component, ElementRef, OnInit, ViewChild, Output, EventEmitter, SimpleChanges, OnChanges, Input, OnDestroy, Inject } from '@angular/core';
-import { FormControl, FormGroup, Validators } from '@angular/forms';
-import { debounceTime, distinctUntilChanged, fromEvent, map, Observable, startWith, Subject, takeUntil } from 'rxjs';
-import { MatDialog } from '@angular/material/dialog';
-import { DialogComponent } from '../shared/dialog/dialog.component';
-import { CoolmapConfigModel, CoolmapService, CustomerRepoDetailsModel, Route, UtilsService } from '@aggdirect/coolmap-services';
-
-
-
-@Component({
-  selector: 'app-add-route',
-  templateUrl: './add-route.component.html',
-  styleUrls: ['./add-route.component.scss']
-})
-export class AddRouteComponent implements OnInit, OnChanges, OnDestroy {
-  @ViewChild('filterPickup') public filterPickup!: ElementRef;
-  @ViewChild('filterDelivery') public filterDelivery!: ElementRef;
-  @Output() public changeNav = new EventEmitter<string>();
-  @Output() public updateRouteList = new EventEmitter<boolean>();
-  pickupOptions: any = [];
-  deliveryOptions: any = [];
-  requestParmsForRouteDetails = { pickup_lat_lng: '', delivery_lat_lng: '' }
-  customersList: any = [];
-  unitsList: any = [];
-  materialsList: any = [];
-  addRouteForm!: FormGroup;
-  @Input() public routeData!: Route;
-  @Input() public customerRepoDetails!: CustomerRepoDetailsModel;
-  routeId: string | null | undefined;
-  preventSave: boolean = false;
-  preventInitialSave: boolean = false;
-  customersList$!: Observable<any>;
-  routeDetails!: { pickup_location: string | null | undefined; delivery_location: string | null | undefined; } | null;
-  public destroyer$ = new Subject<boolean>();
-  popupDetails: Route;
-  enablePopUp: boolean = false;
-  prevantPopupClose = false;
-  enableForm: boolean = false;
-
-  constructor(public coolMapService: CoolmapService, public utils: UtilsService, public dialog: MatDialog,
-    @Inject('memberData') public config: CoolmapConfigModel) {      
-    if (this.config.repository === 'customer') {
-      this.utils.fetchMaterialsListForCustomer().then((res)=>{        
-        this.materialsList = res;
-      });
-    } else {
-      this.utils.fetchMaterialsList().then((res)=>{
-        this.materialsList = res;
-      });
-    }
-   
-    this.utils.fetchUnitsList().then((res)=>{
-      this.unitsList = res;
-    });
-    this.formInit();
-    this.utils.getrouteDetailsUtility.subscribe(res => {
-      if (res) {
-        if (res['event'] !== 'click' && !this.prevantPopupClose) { this.enablePopUp = res['event'] }
-        else if (this.enablePopUp && !this.prevantPopupClose) { this.prevantPopupClose = true; }
-        if (res['event'] !== 'click' && !res['event'] && this.prevantPopupClose) {
-          this.popupDetails = this.utils.getdictValue('route-detailsv2');
-        } else { this.popupDetails = res['route'] }
-        if (this.enablePopUp) this.popupDetails['created_at'] = this.utils.getDateFormat(new Date(this.popupDetails['created_at']), '/');
-      }
-    });
-  }
-  filterCustomerList() {
-    this.customersList$ = this.addRouteForm.controls['customer_name'].valueChanges.pipe(
-      startWith(''),
-      map(value => this._filter(value || '')),
-    );
-  }
-  public _filter(value: string): string[] {
-    const filterValue = value.toLowerCase();
-    return this.customersList.filter((option: any) => option['customer_name'].toLowerCase().includes(filterValue));
-  }
-  ngOnChanges(changes: SimpleChanges): void {
-    if (changes['routeData'] && !changes['routeData']['currentValue']) this.inIt(null);
-  }
-  openDialog(): void {
-    const dialogRef = this.dialog.open(DialogComponent, {
-      data: { body: 'Are you sure you want to delete this route?' },
-    });
-    dialogRef.afterClosed().subscribe(res => { if (res) { this.deleteRoute() } });
-  }
-  editEvent() {
-    this.prevantPopupClose = false;
-    this.enableForm = true; this.enablePopUp = false;
-    this.popupDetails['prevent'] = false;
-    this.utils.removeMapEntity.next(this.popupDetails);
-    this.inIt(this.popupDetails);
-  }
-  inIt(changes: Route) {
-    if (changes) {
-      if (!changes['prevent']) {
-        this.preventSave = false;
-        this.formControlValue();
-        this.patchFormValue(changes).then(() => {
-          this.checkAndFetchRouteInformation(true)
-        });
-      }
-    }
-    if (!changes) {
-      this.enableForm = true; this.preventSave = true;
-      this.patchFormValue().then(() => {
-        this.checkAndFetchRouteInformation()
-      });
-    }
-  }
-  ngOnInit(): void {
-    this.formControlValue();
-    if (this.config.repository === 'customer') {
-      this.addRouteForm.patchValue({
-        customer_id: this.customerRepoDetails.customer.id,
-        customer_name: this.customerRepoDetails.customer.name,
-      })
-    } else {
-      this.utils.fetchCustomersList().then((res)=>{
-        this.customersList = res; this.filterCustomerList(); this.addRouteForm.controls['customer_name'].enable();
-      });
-    }
-  }
-
-  ngAfterViewInit() {
-    fromEvent(this.filterPickup.nativeElement, 'keyup').pipe(
-      distinctUntilChanged(), debounceTime(150)).pipe(takeUntil(this.destroyer$)).subscribe(() => {
-        this.utils.fetchAutoCompleteLocations(this.filterPickup.nativeElement.value).pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-          this.pickupOptions = res.features;
-        });
-      });
-
-    fromEvent(this.filterDelivery.nativeElement, 'keyup').pipe(
-      distinctUntilChanged(), debounceTime(150)).pipe(takeUntil(this.destroyer$)).subscribe(() => {
-        this.utils.fetchAutoCompleteLocations(this.filterDelivery.nativeElement.value).pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-          this.deliveryOptions = res.features;
-        });
-      });
-  }
-
-  formControlValue() {
-    this.addRouteForm.controls['pickup_location']?.valueChanges.pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-      if (this.addRouteForm.value.pickup_location && res !== this.addRouteForm.value.pickup_location) {
-        this.addRouteForm.patchValue({ pickup_lat_lng: '' });
-        this.addRouteForm.controls['pickup_lat_lng'].markAsTouched();
-      }
-    });
-
-    this.addRouteForm.controls['delivery_location']?.valueChanges.pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-      if (this.addRouteForm.value.delivery_location && res !== this.addRouteForm.value.delivery_location) {
-        this.addRouteForm.patchValue({ delivery_lat_lng: '' });
-        this.addRouteForm.controls['delivery_lat_lng'].markAsTouched();
-      }
-    });
-  }
-
-  formInit() {
-    this.addRouteForm = new FormGroup({
-      route_name: new FormControl('', [Validators.required]),
-      customer_name: new FormControl({ value: '', disabled: true }, [Validators.required]),
-      customer_id: new FormControl(''),
-      materials_id: new FormControl('', [Validators.required]),
-      unit_id: new FormControl('', [Validators.required]),
-      path: new FormControl('', [Validators.required]),
-      pickup_location: new FormControl('', [Validators.required]),
-      pickup_lat_lng: new FormControl('', [Validators.required]),
-      delivery_location: new FormControl('', [Validators.required]),
-      delivery_lat_lng: new FormControl('', [Validators.required]),
-      estimated_distance: new FormControl('', [Validators.required]),
-      estimated_time: new FormControl('', [Validators.required]),
-      note: new FormControl('', [Validators.maxLength(2048)]),
-      trucker_pay_estimate: new FormControl(null),
-      customer_price_estimate: new FormControl(null),
-    });
-  }
-
-  async patchFormValue(data?: Route) {
-    this.addRouteForm.reset();
-    this.addRouteForm.patchValue(data!);
-    if (this.config.repository === 'customer') {      
-      this.addRouteForm.patchValue({
-        customer_id: this.customerRepoDetails.customer.id,
-        customer_name: this.customerRepoDetails.customer.name,
-      })
-    }
-    this.routeId = data?.route_id;
-    this.routeDetails = data ? { pickup_location: data.pickup_location, delivery_location: data.delivery_location } : null;
-    this.addRouteForm.valueChanges.pipe(takeUntil(this.destroyer$)).subscribe(res => {
-      if (res) { if (this.preventInitialSave) this.preventInitialSave = false }
-    });
-    this.filterCustomerList();
-    await true;
-  }
-
-  selectedLongLat(type: string, event: any) {
-    if (type === 'pickup') {
-      this.addRouteForm.patchValue({
-        pickup_lat_lng: (event.geometry.coordinates[1] + ',' + event.geometry.coordinates[0]).toString()
-      });
-      this.coolMapService.clearBoundWithCordinates();
-    } else if (type === 'delivery') {
-      this.addRouteForm.patchValue({
-        delivery_lat_lng: (event.geometry.coordinates[1] + ',' + event.geometry.coordinates[0]).toString()
-      })
-    }
-    this.checkAndFetchRouteInformation();
-  }
-
-  checkAndFetchRouteInformation(isinitial?: boolean) {
-    if (this.addRouteForm.value?.delivery_lat_lng?.length > 0 && this.addRouteForm.value?.pickup_lat_lng?.length > 0 && this.addRouteForm.value.unit_id) {
-      let unit = this.unitsList.find((x: any) => x.id === this.addRouteForm.value.unit_id);
-      const param = {
-        delivery_lat_lng: this.addRouteForm.value.delivery_lat_lng,
-        pickup_lat_lng: this.addRouteForm.value.pickup_lat_lng,
-        unit: unit?.type
-      };
-      this.utils.postdata('calculate/routes/estimation', param).pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-        if (res && res['path']) {
-          this.addRouteForm.patchValue({
-            estimated_distance: res['dist'],
-            estimated_time: res['time'],
-            path: res['path'],
-            trucker_pay_estimate: res['trucker_haul_cost'],
-            customer_price_estimate: (+(+res['trucker_haul_cost'] / 0.80).toFixed(2))
-          });
-          let path = res['path'].split(';');
-          path = path.map((ele: string | any) => { return ele = this.formateLatLong(ele) });
-          res['path'] = path;
-          const element: any = {
-            type: 'FeatureCollection',
-            features: [{ type: 'Feature', properties: {}, geometry: { type: 'LineString', coordinates: res['path'] } }]
-          }
-          this.coolMapService.removeRouteAndMarker(1).then(() => {
-            const unit = this.unitsList.find((x: any) => x.id === this.addRouteForm.value.unit_id);
-            const materialDetails = this.materialsList.find((x: any) => x.sub_material_id === this.addRouteForm.value.materials_id);
-            this.coolMapService.loadMapProperty(element, 1, unit?.type,
-              {
-                pickup_location: this.addRouteForm.get('pickup_location')?.value,
-                delivery_location: this.addRouteForm.get('delivery_location')?.value,
-                route_name: this.addRouteForm.get('route_name')?.value,
-                materialLabel: materialDetails?.label,
-                unit: unit?.type
-              }).then((res) => { this.preventSave = true });
-          });
-        } else {
-          this.coolMapService.removeRouteAndMarker(1);
-          this.utils.openSnackBar(res['status'], 'error');
-        }
-        if (this.routeId && isinitial) this.preventInitialSave = true;
-      });
-    } else { this.coolMapService.removeRouteAndMarker(1) }
-  }
-
-  formateLatLong(latlong: string) { return latlong ? latlong.split(',').map(x => +x).reverse() : null }
-  saveRoute() {
-    if (this.addRouteForm.valid) {
-      this.preventSave = false;
-      const data = this.addRouteForm.getRawValue();
-      const url = this.routeId ? this.utils.postdata('update/routes', data) : this.utils.postdata('add/routes', data)
-      if (this.routeId) data['id'] = this.routeId;
-      url.pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-        if (res.success) {
-          this.updateRouteList.emit(true);
-          this.utils.openSnackBar(res.message, 'success');
-          this.preventInitialSave = true;
-          this.preventSave = true;
-          if (!this.routeId) this.changeNav.next('Addroute');
-        } else {
-          this.utils.openSnackBar(res.message, 'error');
-          this.preventSave = true;
-        }
-      }, (err) => { if (err) { this.preventSave = true; } });
-    } else {
-      this.addRouteForm.markAllAsTouched();
-    }
-  }
-  deleteRoute() {
-    this.preventSave = false;
-    this.utils.postdata('delete/routes', { uuid: this.routeId }).subscribe(res => {
-      if (res['data']['success']) {
-        this.utils.openSnackBar(res['data']['message'], 'success');
-        this.updateRouteList.emit(true);
-        this.changeNav.next('Addroute');
-        this.preventInitialSave = true;
-        this.preventSave = true;
-      } else {
-        this.utils.openSnackBar('Somthing went wrong', 'error');
-        this.preventSave = true;
-      }
-    }, (err) => { this.preventSave = true })
-  }
-  ngOnDestroy(): void {
-    this.destroyer$.next(true);
-    this.destroyer$.unsubscribe();
-  }
-}