@aggdirect/coolmap 2.6.8 → 2.6.9

package/src/lib/component/job-code/job-code.component.html

@@ -1,79 +0,0 @@
-<div class="jobcode_detailprt" (click)="isOverlapRouteSection = false"  *ngIf="jobdetail" [ngClass]="{'overlap': !isOverlapRouteSection}" cdkDrag>
-  <span class="close"><mat-icon (click)="clearJob()">clear</mat-icon></span>
-  <div class="job_details_area">
-    <div class="detailnameprt">
-      <app-jobcode-status [jobValue]="jobdetail"></app-jobcode-status>
-    </div>
-    <app-jobcode-overview [jobValue]="jobdetail"></app-jobcode-overview>
-  </div>
-</div>
-
-<div class="route_listprt" (click)="isOverlapRouteSection = true" [ngClass]="{ 'show': isVisible, 'overlap': isOverlapRouteSection}">
-  <div class="listing_toggle" (click)="toggleSidemenu()">
-    <img src="assets/images/route.svg" alt="" />
-  </div>
-
-  <div class="listing_box">
-    <div class="closebtn" (click)="toggleSidemenu()">
-      <mat-icon>clear</mat-icon>
-    </div>
-
-    <div class="btnprt">
-      <h2> List of Routes </h2>
-      <button (click)="masterToggle()">{{routes && routes.length > 0 && routes.length === selectedRoute.selected.length ? 'Uncheck' : 'Check'}} All</button>
-    </div>
-
-    <app-job-route-list [routes]="routes" [masterRoutes]="masterRoutes" [selectedRoute]="selectedRoute" (changeRoutes)="routes = $event" (changeSelectedRoute)="selectedRoute = $event"></app-job-route-list>
-    <cdk-virtual-scroll-viewport itemSize="50" class="routeList-viewport">
-      <ul *ngIf="routes['length'] > 0">
-        <li *ngFor="let list of routes">
-          <div class="iconprt">
-            <span>
-              <input type="checkbox" [checked]="selectedRoute.isSelected(list)"
-                (change)="$event ? selectRoute(list) : null" /><label>&nbsp;</label>
-              <div class="border"></div>
-            </span>
-            <div class="statusunit" [ngClass]="list['unit']">{{list['unit']}}</div>
-            <div class="infoicon">
-              <img (mouseenter)="togglerouteDetails(true, list)" (mouseout)="togglerouteDetails(false, list, true)"
-              (click)="togglerouteDetails('click', list)" src="assets/images/info_icon.png" [alt]="" />
-            </div>
-            <div class="infoicon" *ngIf="config.repository === 'customer'">
-              <img src="assets/images/share_icon.png" (click)="openShareRouteModal(list)" [alt]="" />
-            </div>
-          </div>
-          <div class="pickprtbox">
-            <h2> {{list['route_name']}} </h2>
-            <h3><ng-container *ngIf="config?.repository === 'coolmap'">{{list['customer_name']}} | </ng-container>{{config.repository === 'coolmap' ? list['material'] : list['materialLabel']}}</h3>
-            <div class="pickdropprt">
-              <div class="pickprt">
-                <b>
-                  <h4>{{list['pickup_location']}}</h4>
-                </b>
-              </div>
-              <div class="dropprt">
-                <b>
-                  <h4>{{list['delivery_location']}}</h4>
-                </b>
-              </div>
-            </div>
-          </div>
-        </li>
-      </ul>
-      <p style="color: #fff;" *ngIf="routes.length === 0">No Route found</p>
-    </cdk-virtual-scroll-viewport>
-
-  </div>
-
-  <div class="route_detail" *ngIf="detailsCardEnable">
-    <div class="closebtnroutedetail" (click)="detailsCardEnable = false; preventMouseout = false">
-      <mat-icon>clear</mat-icon>
-    </div>
-    <lib-route-info-card [propData]="{className: 'listRoutecard', repository: config['repository']}"  [popupData]="routeCardDetail"></lib-route-info-card>
-    <div class="createTxt">
-      <small>
-        Created by {{routeCardDetail?.created_by_name}} on {{routeCardDetail?.created_at}}
-      </small>
-    </div>
-  </div>
-</div>

package/src/lib/component/job-code/job-code.component.scss

@@ -1,396 +0,0 @@
-@import "../../../assets/variable.scss";
-
-.jobcode_detailprt {
-  position: absolute;
-  left: 20em;
-  bottom: 10px;
-  background: $white;
-  padding: 15px 20px;
-  border-radius: 20px;
-  max-width: 350px;
-  z-index: 999;
-  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1);
- .close {
-  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;
-  }
-  @keyframes autoslide {
-    100% {
-      transform: translateX(calc(90vw - 100%));
-    }
-    0% {
-      transform: translateX(0%);
-    }
-  }
-}
-.route_listprt {
-  .listing_toggle {
-    background: $white;
-    border-radius: 15px;
-    padding: 5px 5px;
-    position: absolute;
-    right: 10px;
-    top: 20px;
-    cursor: pointer;
-    img {
-      width: 28px;
-    }
-  }
-  .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 0px;
-    opacity: 0;
-    .closebtn {
-      display: none;
-    }
-    ul {
-      padding: 0 20px 0 0;
-      li {
-        background: #4a4a4a;
-        padding: 10px 15px;
-        border-radius: 15px;
-        display: flex;
-        margin-bottom: 10px;
-        position: relative;
-        height:inherit;
-        @media (min-width:1600px) {
-          padding: 6px 15px;
-          margin-bottom: 5px;
-        }
-        .iconprt{
-          display: flex;
-          flex-direction: column;
-          span {
-            display: flex;
-            align-items: center;
-            margin-bottom: 32px;
-            input[type="checkbox"] {
-              width: 100%;
-              height: 100%;
-              margin-right: 10px;
-              opacity: 0;
-              position: absolute;
-              left: 0px;
-              margin-left: 0;
-              top: 0;
-              z-index: 3;
-              cursor: pointer;
-              &:checked+label {
-                // TODO: Fix this
-                // background: url("../../../assets/images/fill-check.png") 16px 15px no-repeat;
-              }
-            }
-            label {
-              // TODO: Fix this
-              // background: url("../../../assets/images/blank-check.png") 16px 15px no-repeat;
-              width: 100%;
-              position: relative;
-              z-index: 2;
-              font-size: 12px;
-              color: #878787;
-              height: 100%;
-              position: absolute;
-              top: 0;
-              left: 0;
-            }
-            .border {
-              position: absolute;
-              width: 100%;
-              height: 100%;
-              left: 0px;
-              right: 0;
-              top: 0;
-              border-radius: 15px;
-            }
-            input {
-              &:checked~.border {
-                border-left: 1px solid $white;
-                border-right: 1px solid $white;
-                border-top: 1px solid $white;
-                border-bottom: 1px solid $white;
-              }
-            }
-            h2 {
-              margin-left: 10px;
-              white-space: nowrap;
-              overflow: hidden;
-              text-overflow: ellipsis;
-              max-width: 150px;
-              padding-left: 16px;
-              font-size: 0.9rem;
-              margin-bottom: 0;
-              font-weight: normal;
-              margin-top: 0;
-            }
-          }
-          .statusunit{
-            border-radius: 30px;
-            font-size: 0;
-            color: $white;
-            text-transform: capitalize;
-            font-weight: 500;
-            width: 20px;
-            height: 20px;
-            text-align: center;
-            line-height: 20px;
-            margin-bottom: 7px;
-            &::first-letter{
-              font-size: 0.8rem;
-            }
-            &.Ton {
-              background: #ff7272;
-            }
-            &.Load {
-              background: #a3c52e;
-            }
-            &.Hourly {
-              background: #ae23d1;
-            }
-            @media (min-width:1600px) {
-              line-height: 21px;
-            }
-          }
-          .infoicon{
-            z-index: 5;
-            cursor: pointer;
-            img{
-              width: 20px;
-              height: 20px;
-            }
-          }
-        }
-        .pickprtbox{
-          margin-left: 10px;
-          h2{
-            font-size: 0.9rem;
-            margin: 7px 0 5px 0;
-            white-space: nowrap;
-            text-overflow: ellipsis;
-            max-width: 195px;
-            overflow: hidden;
-          }
-        }
-
-
-        h3 {
-          font-size: 0.8rem;
-          color: #979797;
-          font-weight: 600;
-          margin-top: 0;
-          white-space: nowrap;
-          text-overflow: ellipsis;
-          max-width: 195px;
-          overflow: hidden;
-          margin-bottom: 5px;
-        }
-        .pickdropprt {
-          font-size: 0.75rem;
-          .pickprt {
-            position: relative;
-            display: flex;
-            align-items: center;
-            padding-bottom: 10px;
-            span {
-              padding-left: 0;
-              padding-right: 20px;
-              display: block;
-            }
-            b {
-              position: relative;
-              &:after {
-                background: #bcbcbc;
-                width: 1px;
-                height: 100%;
-                left: 3px;
-                content: "";
-                position: absolute;
-                top: 10px;
-              }
-            }
-            h4 {
-              position: relative;
-              padding-left: 15px;
-              margin: 0px 0 0 0;
-              line-height: 18px;
-              color: #bcbcbc;
-              font-weight: normal;
-              overflow: hidden;
-              text-overflow: ellipsis;
-              display: -webkit-box;
-              -webkit-line-clamp: 1;
-              -webkit-box-orient: vertical;
-              &:before {
-                background: #bcbcbc;
-                top: 4px;
-                left: 0px;
-                position: absolute;
-                content: "";
-                width: 7px;
-                height: 7px;
-                border-radius: 100%;
-              }
-            }
-          }
-          .dropprt {
-            position: relative;
-            padding-bottom: 10px;
-            display: flex;
-            align-items: center;
-            span {
-              padding-left: 0;
-              padding-right: 20px;
-              display: block;
-            }
-            b {
-              position: relative;
-              &:after {
-                background: #bcbcbc;
-                width: 1px;
-                height: 12px;
-                left: 3px;
-                content: "";
-                position: absolute;
-                top: -7px;
-              }
-            }
-            h4 {
-              position: relative;
-              padding-left: 15px;
-              margin: 0;
-              line-height: 18px;
-              color: #bcbcbc;
-              font-weight: normal;
-              overflow: hidden;
-              text-overflow: ellipsis;
-              display: -webkit-box;
-              -webkit-line-clamp: 1;
-              -webkit-box-orient: vertical;
-              &:before {
-                background: #bcbcbc;
-                top: 4px;
-                left: 0px;
-                position: absolute;
-                content: "";
-                width: 7px;
-                height: 7px;
-                border-radius: 100%;
-              }
-            }
-          }
-        }
-      }
-    }
-  }
-  &.show {
-    .listing_box {
-      width: 300px;
-      max-width: 300px;
-      -webkit-box-flex: 0;
-      flex: 0 0 350px;
-      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;
-      h2 {
-        color: $white;
-        white-space: nowrap;
-      }
-      .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;
-      }
-    }
-  }
-}
-.btnprt{
-  display: flex;
-  justify-content: space-between;
-  align-items: center;
-  padding-right: 20px;
-  h2{
-    margin: 0;
-  }
-  button{
-    font-size: 15px;
-    padding: 8px 20px;
-    border-radius: 5%;
-    background-color: $blue;
-    color: $white;
-    border: none;
-    border-radius: 10px;
-    box-shadow: none;
-    outline: none;
-  }
-}
-.hidden {
-  display: none;
-}
-.route_detail{
-  background: #282828;
-  position: absolute;
-  width: 260px;
-  top: 50%;
-  transform: translateY(-50%);
-  right: 310px;
-  border-radius: 20px;
-  padding: 10px;
-  box-shadow: 0px 0px 5px 0px rgba(255,255,255,0.21);
-}
-
-.createTxt{
-  small{
-    color: #fff;
-    font-size: 0.7rem;
-  }
-}
-.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: #f5f5f5;
-  position: absolute;
-  top: -7px;
-  left: -11px;
-}
-.routeList-viewport{
-  height: 944px;
-}

package/src/lib/component/job-code/job-code.component.ts

@@ -1,157 +0,0 @@
-import { SelectionModel } from '@angular/cdk/collections';
-import { Component, OnInit, Input, Output, EventEmitter, OnDestroy, Inject } from '@angular/core';
-import { Subject, takeUntil } from 'rxjs';
-import { CoolmapConfigModel, CoolmapService, CustomerRepoDetailsModel, Route, UtilsService } from '@aggdirect/coolmap-services';
-
-
-@Component({
-  selector: 'app-job-code',
-  templateUrl: './job-code.component.html',
-  styleUrls: ['./job-code.component.scss']
-})
-export class JobCodeComponent implements OnInit, OnDestroy {
-  @Input() public jobdetail!: any;
-  @Input() public customerRepoDetails!: CustomerRepoDetailsModel;
-  isVisible: boolean = false;
-  routes: Route[] = [];
-  public selectedRoute = new SelectionModel<any>(true, [])
-  @Output() public clearJobDetails = new EventEmitter();
-  @Output() public openShareRoute = new EventEmitter(); isOverlapRouteSection = false;
-  public destroyer$ = new Subject<boolean>();
-  detailsCardEnable: boolean | string;
-  preventMouseout: boolean = false;
-  routeCardDetail: Route;
-  preventListUpdate: boolean;
-  masterRoutes: any;
-  unitList: any;
-  materialsList: any;
-
-  constructor(public utils: UtilsService, public coolMap: CoolmapService,
-    @Inject('memberData') public config: CoolmapConfigModel) {
-    this.utils.clearViewRouteforJobCodeObserve.pipe(takeUntil(this.destroyer$)).subscribe(res => {
-      if (res) this.coolMap.removeJobFromMap(this.selectedRoute.selected); this.selectedRoute.clear();
-    });
-  }
-
-  ngOnInit(): void { this.checkAndCallRouteList() }
-  checkAndCallRouteList() {
-        this.utils.clearOptions();
-    if (this.config.repository === 'customer') {
-      this.utils.fetchUnitsList().then((res) => {
-        this.unitList = res;
-        this.utils.fetchMaterialsListForCustomer().then((res) => {
-          this.materialsList = res;
-          this.getRouteListForCustomer();
-        });
-      });
-    } else {
-      this.getRouteListForCoolMap()
-    }
-  }
-  getUnitName(data): string {
-    let unitName = '';
-    this.unitList.map((res) => {
-      if (res.id === data.unit_id) {
-        unitName = res.type
-      }
-    })
-    return unitName;
-  }
-
-  getMaterialName(data): string {
-    let materialName = '';
-    this.materialsList.map((res) => {
-      if (res.sub_material_id === data.materials_id) {
-        materialName = res.label
-      }
-    })
-    return materialName;
-  }
-  getRouteListForCoolMap() {
-    this.utils.getData('routes/all').pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-      if (res) {
-        this.routes = res.data;
-        this.masterRoutes = res.data;
-        this.preventListUpdate = false;
-        this.routes.forEach((ele: Route) => { this.utils.makeOptions(ele) });
-      }
-    })
-  }
-  getRouteListForCustomer() {
-    const dataset = {
-      customer_id: this.customerRepoDetails.customer.id
-    }
-    this.utils.postdata('routes/all', dataset).pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-      if (res) {
-        this.routes = res.data;
-        this.preventListUpdate = false;
-        this.routes.map((ele: Route) => {
-          ele.unit = this.getUnitName(ele);
-          ele.materialLabel = this.getMaterialName(ele);
-          ele.material = this.getMaterialName(ele).split('|')[0].trim();
-          this.utils.makeOptions(ele)
-        });
-        this.masterRoutes = this.routes;
-      }
-    });
-  }
-
-  toggleSidemenu() {
-    this.isVisible = !this.isVisible;
-    this.detailsCardEnable = false;
-    this.preventMouseout = false
-  }
-  clearJob() { this.clearJobDetails.emit(true); this.utils.preVentJobdetailclose.next(false) }
-  selectRoute(event: Route) {
-    const i = this.selectedRoute.selected.findIndex(ele => ele['order_number'] === event['order_number']);
-    this.selectedRoute.toggle(event);
-    if (!this.selectedRoute.isSelected(event) && event['route_id']) {
-      this.coolMap.removeRouteAndMarker(event['route_id']).then((res: any) => {
-        this.coolMap.extendReBound();
-      });
-    } else {
-      this.coolMap.plotRoute(event, event['route_id'], 'jobrouteList', false, true);
-    }
-  }
-  masterToggle() {
-    if (this.routes.length === this.selectedRoute.selected.length) {
-      this.selectedRoute.clear();
-      this.routes.forEach(row => {
-        this.coolMap.removeRouteAndMarker(row['route_id']).then((res: any) => { this.coolMap.extendReBound() })
-      });
-    } else {
-      this.routes.forEach(row => {
-        this.selectedRoute.select(row);
-        this.coolMap.plotRoute(row, row['route_id'], 'jobrouteList', false, true);
-      });
-    }
-  }
-  togglerouteDetails(eventType: string | boolean, route: Route, mouseOut?: boolean) {
-    if (typeof (eventType) === 'string') {
-      this.preventMouseout = true; this.utils.setdictValue('route-details', JSON.stringify(route));
-    }
-    if (typeof (eventType) === 'boolean' && eventType && !this.preventMouseout) { this.detailsCardEnable = eventType };
-    if (typeof (eventType) === 'boolean' && !eventType && !this.preventMouseout) { this.detailsCardEnable = eventType };
-    if (this.preventMouseout && !this.detailsCardEnable) this.preventMouseout = false;
-    if (mouseOut) {
-      if (this.preventMouseout) {
-        route = this.utils.getdictValue('route-details');
-        this.routeCardDetail = route;
-      }
-      if (!this.preventMouseout) {
-        this.routeCardDetail = route
-      }
-    } else {
-      this.routeCardDetail = route
-    }
-    this.routeCardDetail['created_at'] = this.utils.getDateFormat(new Date(this.routeCardDetail['created_at']), '/');
-  }
-
-  openShareRouteModal(data) {
-    this.openShareRoute.emit(data);
-  }
-  ngOnDestroy(): void {
-    this.destroyer$.next(true);
-    this.destroyer$.unsubscribe();
-  }
-}

package/src/lib/component/map/map.component.html

@@ -1,4 +0,0 @@
-<div>
-  <mat-progress-bar *ngIf="enableProgress" mode="indeterminate"></mat-progress-bar>
-  <div #map class="coolmap" style="height: 100vh;"></div>
-</div>

package/src/lib/component/map/map.component.spec.ts

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

package/src/lib/component/map/map.component.ts

@@ -1,34 +0,0 @@
-import { Component, ElementRef, OnDestroy, ViewChild } from '@angular/core';
-import { Subject, takeUntil } from 'rxjs';
-import { CoolmapService } from '@aggdirect/coolmap-services';
-
-
-
-@Component({
-  selector: 'app-map',
-  templateUrl: './map.component.html',
-  styleUrls: ['./map.component.css']
-})
-export class MapComponent implements OnDestroy {
-  @ViewChild('map', { static: true }) public mapDiv!: ElementRef;
-  enableProgress: boolean = true;
-  public destroyer$ = new Subject<boolean>();
-
-  constructor( public coolmapService: CoolmapService ) { }
-
-  ngAfterViewInit() {
-    this.coolmapService.reintiatecoolmap.pipe(takeUntil(this.destroyer$)).subscribe((res: any) => {
-      this.enableProgress = true;
-      if (res) {
-        this.coolmapService.initiateMapForAddRoute(this.mapDiv.nativeElement).then((res) => {
-          this.enableProgress = false;
-        })
-      }
-    });
-  }
-
-  ngOnDestroy(): void {
-    this.destroyer$.next(true);
-    this.destroyer$.unsubscribe();
-  }
-}