{"__symbolic":"module","version":4,"metadata":{"ConnectEchoService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":2,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]},"statics":{"ɵprov":{}}},"ConnectEchoComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"lib-connect-echo","template":"\n    <p>\n      connect-echo works!\n    </p>\n  ","styles":[]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"TopNavComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"app-top-nav-lib","template":"<!-- <span *ngFor=\"let item of navItems\">\r\n  <span *ngIf=\"item.menus\">\r\n    <button mat-button color=\"primary\" [matMenuTriggerFor]=\"menu.childMenu\" [disabled]=\"item.disabled\">\r\n      {{item.name}}\r\n    </button>\r\n    <app-menu-item-lib #menu [items]=\"item.menus\"></app-menu-item-lib>\r\n  </span>\r\n  <span *ngIf=\"!item.menus\">\r\n    <button  color=\"primary\" mat-button>\r\n      {{item.name }}\r\n    </button>\r\n  </span>\r\n</span> -->\r\n<!-- Osi new Code -->\r\n<div class=\"navbar\">\r\n  <div class=\"dropdown\" *ngFor=\"let item of navItems\">\r\n    <button class=\"dropbtn\">\r\n      {{ item.name }}\r\n      <i class=\"fa fa-caret-down\"></i>\r\n    </button>\r\n    <div class=\"dropdown-content\" *ngIf=\"item.menus\">\r\n      <ng-container *ngFor=\"let menu of item.menus\">\r\n        <a [routerLink]=\"menu.url\">{{ menu.name }}</a>\r\n      </ng-container>\r\n    </div>\r\n  </div>\r\n</div>\r\n<!--\r\n<div (click)=\"btnHamburger()\" class=\"hamburger\">hamburger</div>\r\n<nav [ngClass]=\"flagNav ? 'nav m-show' : 'nav'\">\r\n  <ul>\r\n    <li\r\n      href=\"javascript:void(0)\"\r\n      [ngClass]=\"{\r\n        'menu-dropdown':\r\n          item.children && item.children!.length > 0 ? true : false\r\n      }\"\r\n      *ngFor=\"let item of navItems\"\r\n    >\r\n      <a\r\n        [routerLink]=\"item.url\"\r\n        *ngIf=\"!item.children || item.children!.length === 0\"\r\n        >{{ \"mainmenu.\" + item.name | translate }}</a\r\n      >\r\n      <a\r\n        [attr.id]=\"'a.' + item.screenCode\"\r\n        (click)=\"btnMainNav(item)\"\r\n        *ngIf=\"item.children && item.children!.length > 0\"\r\n        >{{ \"mainmenu.\" + item.name | translate }}</a\r\n      >\r\n      <ul\r\n        [attr.id]=\"'submenu.' + item.screenCode\"\r\n        [ngClass]=\"item.screenCode === activenavItemCode ? 'show' : 'hide'\"\r\n      >\r\n        <li *ngFor=\"let subitem of item.children\">\r\n          <a [routerLink]=\"subitem.url\">{{\r\n            \"mainmenu.\" + subitem.name | translate\r\n          }}</a>\r\n        </li>\r\n      </ul>\r\n    </li>\r\n  </ul>\r\n</nav> -->\r\n","styles":[""]}]}],"members":{"navRes":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"NavService"},{"__symbolic":"reference","module":"@angular/core","name":"Renderer2","line":23,"character":64}]}],"ngOnInit":[{"__symbolic":"method"}],"btnHamburger":[{"__symbolic":"method"}],"btnMainNav":[{"__symbolic":"method"}]}},"MenuItemComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"app-menu-item-lib","template":"<!-- <mat-menu #childMenu=\"matMenu\" [overlapTrigger]=\"false\" style=\"min-width: 100px;\">\r\n  <div *ngFor=\"let child of items\">\r\n    <span *ngIf=\"child.childs && child.childs!.length > 0\">\r\n      <button  mat-menu-item color=\"primary\" [matMenuTriggerFor]=\"menu.childMenu\" >\r\n        <span>{{child.name}}</span>\r\n      </button>\r\n      <app-menu-item-lib #menu [items]=\"child.childs\"></app-menu-item-lib>\r\n    </span>\r\n    <span *ngIf=\"!child.childs\">\r\n      <button color=\"primary\" [routerLink]=\"child.url\" mat-menu-item>\r\n        <span>{{child.name}}</span>\r\n      </button>\r\n    </span>\r\n  </div>\r\n</mat-menu> -->\r\n<ng-container *ngFor=\"let menu of items\">\r\n  <a href=\"#\" [routerLink]=\"menu.url\">{{menu.name}}</a>\r\n\r\n</ng-container>","styles":[""]}]}],"members":{"items":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":3}}]}],"childMenu":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"ViewChild","line":10,"character":3},"arguments":["childMenu",{"static":true}]}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":12,"character":30}]}],"ngOnInit":[{"__symbolic":"method"}]}},"CommonErrorMessageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"selector":"app-common-error-message","template":"<div\r\n  *ngIf=\"control?.invalid && (control?.dirty || control?.touched)\"\r\n  class=\"error-message\"\r\n>\r\n  <span *ngFor=\"let err of errorList\">\r\n    <span *ngIf=\"control?.hasError(err)\">\r\n      {{ getErrorMessage(err) }}\r\n    </span>\r\n  </span>\r\n</div>\r\n"}]}],"members":{"eleType":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":3}}]}],"num":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":3}}]}],"control":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":3}}]}],"errorList":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"confirmFiledName":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"getErrorMessage":[{"__symbolic":"method"}]}},"DeleteConfirmationComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":14,"character":1},"arguments":[{"selector":"app-delete-confirmation","template":"<dx-popup\r\n  [showTitle]=\"true\"\r\n  [width]=\"460\"\r\n  height=\"auto\"\r\n  [dragEnabled]=\"false\"\r\n  titleTemplate=\"title\"\r\n  [(visible)]=\"popupVisible\"\r\n  [closeOnOutsideClick]=\"false\"\r\n  class=\"popup-box\"\r\n  (onHiding)=\"onHiding('No')\"\r\n  [resizeEnabled]=\"true\"\r\n>\r\n  <div *dxTemplate=\"let data of 'title'\">\r\n    <p class=\"popup_header\">\r\n      <img src=\"/assets/img/icon-danger.svg \" />\r\n      You are about to delete this record.\r\n    </p>\r\n  </div>\r\n  <div *dxTemplate=\"let data of 'content'\">\r\n    <div class=\"row\">\r\n      <div class=\"col-12 alert_box\">\r\n        <p>- Are you sure you want to delete?</p>\r\n      </div>\r\n    </div>\r\n\r\n    <div class=\"row mt-20\">\r\n      <div class=\"col-12\">\r\n        <div class=\"d-flex justify-content-end\">\r\n          <dx-button\r\n            stylingMode=\"contained\"\r\n            type=\"danger\"\r\n            class=\"danger mr-10\"\r\n            text=\"Delete it\"\r\n            (click)=\"yesBtnClick('Yes')\"\r\n          >\r\n          </dx-button>\r\n          <dx-button\r\n            stylingMode=\"text\"\r\n            type=\"normal\"\r\n            text=\"Keep it\"\r\n            (click)=\"noBtnClick('No')\"\r\n          ></dx-button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</dx-popup>\r\n","styles":[".popup_header{font-size:20px;font-weight:500;color:#33384e;margin-bottom:5px}.field_label{color:#646c73;line-height:30px}.form-filed{padding-bottom:0}"]}]}],"members":{"popupVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"noClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":3},"arguments":["noClick"]}]}],"yesClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":24,"character":3},"arguments":["yesClick"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"noBtnClick":[{"__symbolic":"method"}],"yesBtnClick":[{"__symbolic":"method"}],"onHiding":[{"__symbolic":"method"}]}},"ToasterMessageComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":2,"character":1},"arguments":[{"selector":"app-lib-toaster-message","template":"<dx-toast [(visible)]=\"isVisible\" [contentTemplate]=\"type\" [displayTime]=\"6000\">\r\n  <div *dxTemplate=\"let data of 'success'\" [class]=\"type\">\r\n    <h3>{{ toastHeader }}</h3>\r\n    <span class=\"toat_close\"></span>\r\n    <p>{{ toastMessage }}</p>\r\n  </div>\r\n  <div *dxTemplate=\"let data of 'error'\" [class]=\"type\">\r\n    <h3>{{ toastHeader }}</h3>\r\n    <span class=\"toat_close\"></span>\r\n    <p>{{ toastMessage }}</p>\r\n  </div>\r\n\r\n</dx-toast>\r\n","styles":[""]}]}],"members":{"isVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":8,"character":3}}]}],"type":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":9,"character":3}}]}],"toastMessage":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":10,"character":3}}]}],"toastHeader":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}]}},"SearchAccountPopupComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":3,"character":1},"arguments":[{"changeDetection":{"__symbolic":"select","expression":{"__symbolic":"reference","module":"@angular/core","name":"ChangeDetectionStrategy","line":4,"character":19},"member":"OnPush"},"selector":"lib-search-account-popup","template":"<dx-popup [showTitle]=\"true\" [maxWidth]=\"1006\" [minWidth]=\"300\" [dragEnabled]=\"false\" title=\"Search Zip/Postal Code\"\r\n  [(visible)]=\"zippopupVisible1\" [closeOnOutsideClick]=\"true\" class=\"Delete_popup popup-with-action-buttons\"\r\n  (onHiding)=\"hidezippopupVisible1Popup($event)\" resizeEnabled=\"true\">\r\n  <div class=\"form-filed\">\r\n    <div class=\"container-fluid\" [formGroup]=\"zippostalpopupform\">\r\n      <!--row 1-->\r\n      <div class=\"row\">\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Country</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-select-box placeholder=\"Select\" [items]=\"countryData\" valueExpr=\"countryId\" displayExpr=\"name\"\r\n                formControlName=\"zipPopupCountryName\"></dx-select-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Zip/Postal Code<span class=\"text-danger\">*</span></div>\r\n            <div class=\"dx-field-value width-50\">\r\n              <dx-text-box formControlName=\"zipPopupCode\"></dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <!--row 2-->\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">City</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-text-box formControlName=\"zipPopupCityName\"></dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">State/Province</div>\r\n            <div class=\"dx-field-value\">\r\n              <!-- <dx-select-box placeholder=\"Select\" [dataSource]=\"statesList\"\r\n                                                                  valueExpr=\"stateAbbr\" displayExpr=\"name\" formControlName=\"state\"></dx-select-box>-->\r\n              <dx-text-box formControlName=\"zipPopupState\"></dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-12 pr-0\">\r\n          <div class=\"dx-field-label m-hide-dx-field-label \">&nbsp;</div>\r\n          <dx-button class=\"float-right\" type=\"default\" text=\"Search\" [disabled]=\"!zippostalpopupform\"\r\n            (click)=\"getFromZipSearchList()\">Search\r\n          </dx-button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!--filter opt-->\r\n  <div class=\"card mb-20\">\r\n    <div class=\"card-container\">\r\n      <div class=\"table-responsive\">\r\n        <!-- Data Grid -->\r\n        <dx-data-grid id=\"gridContainer\" [dataSource]=\"searchZipData\"\r\n          (onSelectionChanged)=\"selectionChangedHandler($event)\" #grid>\r\n          <dxo-selection [selectAllMode]=\"allMode\" [showCheckBoxesMode]=\"checkBoxesMode\" mode=\"single\">\r\n          </dxo-selection>\r\n          <dxo-paging [pageSize]=\"10\">\r\n          </dxo-paging>\r\n          <dxo-pager [visible]=\"true\" [allowedPageSizes]=\"allowedPageSizes\"\r\n            [showPageSizeSelector]=\"showPageSizeSelector\" [showInfo]=\"showInfo\"\r\n            [showNavigationButtons]=\"showNavButtons\">\r\n          </dxo-pager>\r\n          <dxi-column dataField=\"zipcode\" caption=\"Zip/Postal Code\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"cityName\" caption=\"City\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"stateName\" caption=\"State/Province\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"countryName\" caption=\"Country\">\r\n          </dxi-column>\r\n          <dxo-paging [pageSize]=\"10\" [pageIndex]=\"1\">\r\n          </dxo-paging>\r\n        </dx-data-grid>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row mt-33 popup-btn-wrapper\">\r\n    <div class=\"col-12\">\r\n      <div class=\"d-flex justify-content-end\">\r\n        <dx-button stylingMode=\"contained\" type=\"default\" text=\"Submit\" (click)=\"fromzipPopSubmit()\">\r\n        </dx-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</dx-popup>\r\n\r\n\r\n<dx-popup [showTitle]=\"true\" [maxWidth]=\"1006\" [minWidth]=\"300\" [dragEnabled]=\"false\" title=\"Search Zip/Postal Code\"\r\n  [(visible)]=\"zippopupVisible\" [closeOnOutsideClick]=\"true\" class=\"Delete_popup popup-with-action-buttons\"\r\n  (onHiding)=\"hidezippopupVisiblePopup($event)\" resizeEnabled=\"true\">\r\n  <div class=\"form-filed\">\r\n    <div class=\"container-fluid\" [formGroup]=\"zippostalpopupform\">\r\n      <!--row 1-->\r\n      <div class=\"row\">\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Country\r\n            </div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-select-box placeholder=\"Select\" [items]=\"countryData\" valueExpr=\"countryId\" displayExpr=\"name\"\r\n                formControlName=\"zipPopupCountryName\">\r\n              </dx-select-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Zip/Postal\r\n              Code<span class=\"text-danger\">*</span>\r\n            </div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-text-box formControlName=\"zipPopupCode\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <!--row 2-->\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">City</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-text-box formControlName=\"zipPopupCityName\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">\r\n              State/Province</div>\r\n            <div class=\"dx-field-value\">\r\n              <!-- <dx-select-box placeholder=\"Select\" [dataSource]=\"statesList\"\r\n                                            valueExpr=\"stateAbbr\" displayExpr=\"name\" formControlName=\"state\"></dx-select-box>-->\r\n              <dx-text-box formControlName=\"zipPopupState\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-12 pr-0\">\r\n          <div class=\"dx-field-label m-hide-dx-field-label \">\r\n            &nbsp;</div>\r\n          <dx-button class=\"float-right\" type=\"default\" text=\"Search\" [disabled]=\"zippostalpopupform.invalid\"\r\n            (click)=\"getToZipSearchList()\">Search\r\n          </dx-button>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!--filter opt-->\r\n  <div class=\"card mb-20\">\r\n    <div class=\"card-container\">\r\n      <div class=\"table-responsive\">\r\n        <!-- Data Grid -->\r\n        <dx-data-grid id=\"gridContainer\" [dataSource]=\"searchZipData\"\r\n          (onSelectionChanged)=\"selectionChangedHandler($event)\" #grid>\r\n          <dxo-selection [selectAllMode]=\"allMode\" [showCheckBoxesMode]=\"checkBoxesMode\" mode=\"single\">\r\n          </dxo-selection>\r\n          <dxo-paging [pageSize]=\"10\">\r\n          </dxo-paging>\r\n          <dxo-pager [visible]=\"true\" [allowedPageSizes]=\"allowedPageSizes\"\r\n            [showPageSizeSelector]=\"showPageSizeSelector\" [showInfo]=\"showInfo\"\r\n            [showNavigationButtons]=\"showNavButtons\">\r\n          </dxo-pager>\r\n          <dxi-column dataField=\"zipcode\" caption=\"Zip/Postal Code\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"cityName\" caption=\"City\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"stateName\" caption=\"State/Province\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"countryName\" caption=\"Country\">\r\n          </dxi-column>\r\n          <dxo-paging [pageSize]=\"10\" [pageIndex]=\"1\">\r\n          </dxo-paging>\r\n        </dx-data-grid>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row mt-33 popup-btn-wrapper\">\r\n    <div class=\"col-12\">\r\n      <div class=\"d-flex justify-content-end\">\r\n        <dx-button stylingMode=\"contained\" type=\"default\" text=\"Submit\" (click)=\"zipPopupSubmit()\"></dx-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</dx-popup>\r\n\r\n<!-- -------------popupVisible  accountPopupFrom -------------- -->\r\n<dx-popup [showTitle]=\"true\" [maxWidth]=\"1006\" [minWidth]=\"300\" [dragEnabled]=\"false\" title=\"Add Account\"\r\n  [(visible)]=\"popupVisible\" [closeOnOutsideClick]=\"false\" class=\"Delete_popup popup-with-action-buttons\"\r\n  (onHiding)=\"hidePopupVisible($event)\" resizeEnabled=\"true\">\r\n  <div class=\"form-filed\" [formGroup]=\"accountPopupFrom\">\r\n    <div class=\"container-fluid\">\r\n      <!--row 1-->\r\n      <div class=\"row\">\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Account #</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-text-box formControlName=\"AccountPopupValue\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Name</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-text-box formControlName=\"AccountPopupName\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Zip/Postal Code</div>\r\n            <div class=\"dx-field-value width-50\">\r\n              <dx-text-box formControlName=\"AccountPopupZip\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Country</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-select-box placeholder=\"Select\" formControlName=\"AccountPopupCountry\" [items]=\"countryData\"\r\n                valueExpr=\"countryId\" displayExpr=\"name\" (onValueChanged)=\"onFromCountryChange($event)\">\r\n              </dx-select-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\" *ngIf=\"showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label m-hide-dx-field-label\">&nbsp;\r\n            </div>\r\n            <dx-button stylingMode=\"contained\" type=\"default\" text=\"Search\" (click)=\"searchAccountPopup()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\"\r\n              class=\"btn-less-filter ml-26 pl-0 pr-0\" *ngIf=\"showAdditionFilter\" (click)=\"additionalFilter()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Less Filter\"\r\n              class=\"btn-additional-filter ml-26 pl-0 pr-0\" *ngIf=\"!showAdditionFilter\" (click)=\"lessFilter()\">\r\n            </dx-button>\r\n            <!-- <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\" class=\"btn-additional-filter ml-26 pl-0 pr-0\"></dx-button> -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"row\">\r\n\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">State/Province</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-select-box placeholder=\"Select\" formControlName=\"AccountPopupState\" [items]=\"fromStates\"\r\n                valueExpr=\"stateAbbr\" displayExpr=\"name\"></dx-select-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\">\r\n          <div class=\"dx-checkbox-wrapper\">\r\n            <div class=\"dx-field-label\">Inventory Account</div>\r\n            <div class=\"dx-checkbox-group d-flex\">\r\n              <dx-check-box [value]=\"false\" text=\"Yes\" class=\"mr-53\">\r\n              </dx-check-box>\r\n              <dx-check-box [value]=\"false\" text=\"No\"></dx-check-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\"></div>\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label m-hide-dx-field-label\">&nbsp;\r\n            </div>\r\n            <dx-button stylingMode=\"contained\" type=\"default\" text=\"Search\" (click)=\"searchAccountPopup()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\"\r\n              class=\"btn-less-filter ml-26 pl-0 pr-0\" *ngIf=\"showAdditionFilter\" (click)=\"additionalFilter()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Less Filter\"\r\n              class=\"btn-additional-filter ml-26 pl-0 pr-0\" *ngIf=\"!showAdditionFilter\" (click)=\"lessFilter()\">\r\n            </dx-button>\r\n            <!-- <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\" class=\"btn-additional-filter ml-26 pl-0 pr-0\"></dx-button> -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <!--filter opt-->\r\n  <div class=\"card mb-20\">\r\n    <div class=\"card-container\">\r\n      <div class=\"table-responsive add-acount-popup\">\r\n        <!-- Table Filter Start -->\r\n        <div class=\"table-top-filters flex\">\r\n          <div class=\"left\"> </div>\r\n          <div class=\"right\">\r\n            <div class=\"d-flex table-grid-combo\">\r\n              <dx-select-box placeholder=\"Columns\"></dx-select-box>\r\n              <dx-select-box placeholder=\"Normal View\">\r\n              </dx-select-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <!-- Table Filter End -->\r\n        <!-- Data Grid -->\r\n        <dx-data-grid [dataSource]=\"accountsDatasource\" (onSelectionChanged)=\"selectionAccountsChangedHandler($event)\"\r\n          #grid>\r\n          <dxo-selection [selectAllMode]=\"allMode\" [showCheckBoxesMode]=\"checkBoxesMode\" mode=\"multiple\">\r\n          </dxo-selection>\r\n          <dxo-paging [pageSize]=\"10\"> </dxo-paging>\r\n          <dxo-pager [visible]=\"true\" [allowedPageSizes]=\"allowedPageSizes\"\r\n            [showPageSizeSelector]=\"showPageSizeSelector\" [showInfo]=\"showInfo\"\r\n            [showNavigationButtons]=\"showNavButtons\"> </dxo-pager>\r\n          <dxi-column dataField=\"accountNumber\" caption=\"Account #\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"name\" caption=\"Name\"> </dxi-column>\r\n          <dxi-column dataField=\"addressLine1\" caption=\"Address Line 1\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"cityName\" caption=\"City\"> </dxi-column>\r\n          <dxi-column dataField=\"state\" caption=\"State/Province\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"zipPostalCode\" caption=\"Zip/Postal Code\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"country\" caption=\"Country\"> </dxi-column>\r\n          <dxo-paging [pageSize]=\"10\" [pageIndex]=\"1\"> </dxo-paging>\r\n        </dx-data-grid>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row mt-33 popup-btn-wrapper\">\r\n    <div class=\"col-12\">\r\n      <div class=\"d-flex justify-content-end\">\r\n        <dx-button stylingMode=\"contained\" type=\"default\" text=\"Submit\" (click)=\"submitAccountPopup()\"></dx-button>\r\n        <dx-button stylingMode=\"text\" type=\"normal\" text=\"Cancel\" (click)=hidePopupVisible($event)></dx-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</dx-popup>\r\n\r\n<!-- -------------  shoeCourierPopup -------------- -->\r\n<dx-popup [showTitle]=\"true\" [maxWidth]=\"1006\" [minWidth]=\"300\" [dragEnabled]=\"false\" title=\"Add Courier\"\r\n  [(visible)]=\"shoeCourierPopup\" [closeOnOutsideClick]=\"false\" class=\"Delete_popup popup-with-action-buttons\"\r\n  (onHiding)=\"hideCourierPopup($event)\" resizeEnabled=\"true\">\r\n  <div class=\"form-filed\" [formGroup]=\"courierPopupFrom\">\r\n    <div class=\"container-fluid\">\r\n      <!--row 1-->\r\n      <div class=\"row\">\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Courier ID</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-text-box formControlName=\"courierId\"></dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Name</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-text-box formControlName=\"courierpopupname\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Zip/Postal Code</div>\r\n            <div class=\"dx-field-value width-50\">\r\n              <dx-text-box formControlName=\"courierPopupZip\">\r\n              </dx-text-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">Country</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-select-box placeholder=\"Select\" formControlName=\"courierPopupCountry\" [items]=\"countryData\"\r\n                valueExpr=\"countryId\" displayExpr=\"name\" (onValueChanged)=\"onFromCountryChange($event)\">\r\n              </dx-select-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-3\" *ngIf=\"showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label m-hide-dx-field-label\">&nbsp;\r\n            </div>\r\n            <dx-button stylingMode=\"contained\" type=\"default\" text=\"Search\" (click)=\"searchcourierPopup()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\"\r\n              class=\"btn-less-filter ml-26 pl-0 pr-0\" *ngIf=\"showAdditionFilter\" (click)=\"additionalFilter()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Less Filter\"\r\n              class=\"btn-additional-filter ml-26 pl-0 pr-0\" *ngIf=\"!showAdditionFilter\" (click)=\"lessFilter()\">\r\n            </dx-button>\r\n            <!-- <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\" class=\"btn-additional-filter ml-26 pl-0 pr-0\"></dx-button> -->\r\n          </div>\r\n        </div>\r\n      </div>\r\n      <div class=\"row\">\r\n\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label\">State/Province</div>\r\n            <div class=\"dx-field-value\">\r\n              <dx-select-box placeholder=\"Select\" formControlName=\"courierPopupState\" [items]=\"fromStates\"\r\n                valueExpr=\"stateAbbr\" displayExpr=\"name\"></dx-select-box>\r\n            </div>\r\n          </div>\r\n        </div>\r\n        <div class=\"col-md-6\" *ngIf=\"!showAdditionFilter\"></div>\r\n        <div class=\"col-md-3\" *ngIf=\"!showAdditionFilter\">\r\n          <div class=\"dx-field\">\r\n            <div class=\"dx-field-label m-hide-dx-field-label\">&nbsp;\r\n            </div>\r\n            <dx-button stylingMode=\"contained\" type=\"default\" text=\"Search\" (click)=\"searchcourierPopup()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\"\r\n              class=\"btn-less-filter ml-26 pl-0 pr-0\" *ngIf=\"showAdditionFilter\" (click)=\"additionalFilter()\">\r\n            </dx-button>\r\n            <dx-button stylingMode=\"text\" type=\"default\" text=\"Less Filter\"\r\n              class=\"btn-additional-filter ml-26 pl-0 pr-0\" *ngIf=\"!showAdditionFilter\" (click)=\"lessFilter()\">\r\n            </dx-button>\r\n            <!-- <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\" class=\"btn-additional-filter ml-26 pl-0 pr-0\"></dx-button> -->\r\n          </div>\r\n        </div>\r\n        <!-- <div class=\"col-md-3\">\r\n                                             \r\n                          \r\n                                              <div class=\"dx-checkbox-wrapper\">\r\n                                                  <div class=\"dx-field-label\">Inventory Account</div>\r\n                                                  <div class=\"dx-checkbox-group d-flex\">\r\n                                                    <dx-check-box [value]=\"false\" text=\"Yes\" class=\"mr-53\"></dx-check-box>\r\n                                                    <dx-check-box [value]=\"false\" text=\"No\"></dx-check-box>\r\n                                                  </div>\r\n                                                </div>\r\n                                          </div> -->\r\n        <!-- <div class=\"col-md-3 pr-0\">\r\n                                              <div class=\"dx-field\">\r\n                                                  <div class=\"dx-field-label m-hide-dx-field-label\">&nbsp; </div>\r\n                                                  <dx-button stylingMode=\"contained\" type=\"default\" text=\"Search\"></dx-button>\r\n                                                  <dx-button stylingMode=\"text\" type=\"default\" text=\"Additional Filter\" class=\"btn-additional-filter ml-26 pl-0 pr-0\"></dx-button>\r\n                                                </div>\r\n                                          </div> -->\r\n      </div>\r\n      <!-- <div class=\"row\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"col-md-3\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-label\">Area Code</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-value\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dx-text-box></dx-text-box>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"col-md-3\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-label\">Airport</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-value\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dx-text-box></dx-text-box>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"col-md-3\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-label\">Vehicle Type</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-value width-50\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dx-select-box placeholder=\"Select\"></dx-select-box>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"col-md-3\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-label\">Type</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<div class=\"dx-field-value width-50\">\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<dx-select-box placeholder=\"Select\"></dx-select-box>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t\t</div>\r\n\t\t\t\t\t\t\t\t\t\t\t\t</div> -->\r\n    </div>\r\n  </div>\r\n  <!--filter opt-->\r\n  <div class=\"card mb-20\">\r\n    <div class=\"card-container\">\r\n      <div class=\"table-responsive add-acount-popup\">\r\n        <!-- Table Filter Start -->\r\n        <!-- <div class=\"table-top-filters flex\">\r\n                                              <div class=\"left\">\r\n                                              </div>\r\n                                              <div class=\"right\">\r\n                                                  <div class=\"d-flex table-grid-combo\">\r\n                                                      <dx-drop-down-box\r\n                                                      valueExpr=\"dataField\"\r\n                                                      displayExpr=\"caption\"\r\n                                                      placeholder=\"Columns\"\r\n                                                      value=\"Columns\"\r\n                                                      [dataSource]=\"gridColumns\"\r\n                                                    >\r\n                                                      <div *dxTemplate=\"let data of 'content'\">\r\n                                                        <dx-tree-view\r\n                                                          [dataSource]=\"gridColumns\"\r\n                                                          dataStructure=\"plain\"\r\n                                                          keyExpr=\"dataField\"\r\n                                                          selectionMode=\"multiple\"\r\n                                                          showCheckBoxesMode=\"normal\"\r\n                                                          [selectNodesRecursive]=\"false\"\r\n                                                          displayExpr=\"caption\"\r\n                                                          [selectByClick]=\"true\"\r\n                                                          (onItemSelectionChanged)=\"toggleColumn($event.itemData)\"\r\n                                                        ></dx-tree-view>\r\n                                                      </div>\r\n                                                    </dx-drop-down-box>\r\n                                                    <dx-select-box class=\"select-table-mode\" [dataSource]=\"gridrowViewModel\" fieldTemplate=\"displayItem\"\r\n                                                    [value]=\"gridrowViewModel[0]\">\r\n                                                    <div *dxTemplate=\"let data of 'displayItem'\">\r\n                                                      <dx-text-box [value]=\"data + ' View'\"> </dx-text-box>\r\n                                                    </div>\r\n                                                  </dx-select-box>\r\n                                                     \r\n                                                  </div>\r\n                                              </div>\r\n                                          </div> -->\r\n        <!-- Table Filter End -->\r\n        <!-- Data Grid -->\r\n        <dx-data-grid #mdmdxgrid [dataSource]=\"couriersDatasource\"\r\n          (onSelectionChanged)=\"selectionCourierChangedHandler($event)\" #grid>\r\n          <dxo-selection [selectAllMode]=\"allMode\" [showCheckBoxesMode]=\"checkBoxesMode\" mode=\"multiple\">\r\n          </dxo-selection>\r\n          <dxo-paging [pageSize]=\"10\"> </dxo-paging>\r\n          <dxo-pager [visible]=\"true\" [allowedPageSizes]=\"allowedPageSizes\"\r\n            [showPageSizeSelector]=\"showPageSizeSelector\" [showInfo]=\"showInfo\"\r\n            [showNavigationButtons]=\"showNavButtons\"> </dxo-pager>\r\n          <dxi-column dataField=\"courierId\" caption=\"ID\"> </dxi-column>\r\n          <dxi-column dataField=\"name\" caption=\"Name\"> </dxi-column>\r\n          <dxi-column dataField=\"agentCode\" caption=\"Agent Code\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"state\" caption=\"State/Province\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"country\" caption=\"Country\"> </dxi-column>\r\n          <dxi-column dataField=\"ZipPostalCode\" caption=\"Zip/Postal Code\">\r\n          </dxi-column>\r\n          <dxi-column dataField=\"phone\" caption=\"Phone\"> </dxi-column>\r\n          <dxi-column dataField=\"type\" caption=\"Type\"> </dxi-column>\r\n          <dxi-column dataField=\"qualityScore\" caption=\"Quality Score\">\r\n          </dxi-column>\r\n          <dxo-paging [pageSize]=\"10\" [pageIndex]=\"1\"> </dxo-paging>\r\n        </dx-data-grid>\r\n      </div>\r\n    </div>\r\n  </div>\r\n  <div class=\"row mt-33 popup-btn-wrapper\">\r\n    <div class=\"col-12\">\r\n      <div class=\"d-flex justify-content-end\">\r\n        <dx-button stylingMode=\"contained\" type=\"default\" text=\"Submit\" (click)=\"submitCourierPopup()\"></dx-button>\r\n        <dx-button stylingMode=\"text\" type=\"normal\" text=\"Cancel\" (click)=\"hideCourierPopup($event)\"></dx-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</dx-popup>\r\n","styles":[".fieldError{color:#d74e53!important;font-size:13px!important;margin-bottom:0;font-weight:500}.disableZip{pointer-events:none;opacity:.5}"]}]}],"members":{"zippopupVisible1":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":11,"character":3}}]}],"zippopupVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":12,"character":3}}]}],"popupVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":13,"character":3}}]}],"shoeCourierPopup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"showAdditionFilter":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":15,"character":3}}]}],"searchZipData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":16,"character":3}}]}],"accountsDatasource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":17,"character":3}}]}],"couriersDatasource":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"countryData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"fromStates":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"fromZip":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":21,"character":3},"arguments":["fromZip"]}]}],"toZip":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":22,"character":3},"arguments":["toZip"]}]}],"selectionChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":23,"character":3},"arguments":["selectionChanged"]}]}],"hidezippopupVisible1":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":24,"character":3},"arguments":["hidezippopupVisible1"]}]}],"hidezippopupVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":25,"character":3},"arguments":["hidezippopupVisible"]}]}],"hidepopUp":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":26,"character":3},"arguments":["hidepopUp"]}]}],"hideCourier":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":27,"character":3},"arguments":["hideCourier"]}]}],"fromzipPopupSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":3},"arguments":["fromzipPopupSubmit"]}]}],"tozipPopupSubmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":29,"character":3},"arguments":["tozipPopupSubmit"]}]}],"submitAccountPopupEmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":30,"character":3},"arguments":["submitAccountPopupEmit"]}]}],"submitCourierPopupEmit":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":31,"character":3},"arguments":["submitCourierPopupEmit"]}]}],"fromCountryChange":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":32,"character":3},"arguments":["fromCountryChange"]}]}],"searchAccountData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":33,"character":3},"arguments":["searchAccountData"]}]}],"searchcourierData":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":34,"character":3},"arguments":["searchcourierData"]}]}],"selectionCourierChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":35,"character":3},"arguments":["selectionCourierChanged"]}]}],"selectionAccountsChanged":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":36,"character":3},"arguments":["selectionAccountsChanged"]}]}],"customizeColumns":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":66,"character":26}]}],"ngOnInit":[{"__symbolic":"method"}],"getZipCodeDetailsFrom":[{"__symbolic":"method"}],"getZipCodeDetailsTo":[{"__symbolic":"method"}],"selectionChangedHandler":[{"__symbolic":"method"}],"getToZipSearchList":[{"__symbolic":"method"}],"getFromZipSearchList":[{"__symbolic":"method"}],"searchAccountPopup":[{"__symbolic":"method"}],"searchcourierPopup":[{"__symbolic":"method"}],"onFromCountryChange":[{"__symbolic":"method"}],"fromzipPopSubmit":[{"__symbolic":"method"}],"zipPopupSubmit":[{"__symbolic":"method"}],"submitAccountPopup":[{"__symbolic":"method"}],"submitCourierPopup":[{"__symbolic":"method"}],"additionalFilter":[{"__symbolic":"method"}],"lessFilter":[{"__symbolic":"method"}],"selectionAccountsChangedHandler":[{"__symbolic":"method"}],"selectionCourierChangedHandler":[{"__symbolic":"method"}],"hidezippopupVisiblePopup":[{"__symbolic":"method"}],"hidePopupVisible":[{"__symbolic":"method"}],"hideCourierPopup":[{"__symbolic":"method"}],"hidezippopupVisible1Popup":[{"__symbolic":"method"}]}},"NavService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":5,"character":1}}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/router","name":"Router","line":11,"character":30}]}],"setNavItems":[{"__symbolic":"method"}],"getNavItems":[{"__symbolic":"method"}],"searchFilter":[{"__symbolic":"method"}],"getparentNavItem":[{"__symbolic":"method"}],"getChildNavItems":[{"__symbolic":"method"}],"closeNav":[{"__symbolic":"method"}],"openNav":[{"__symbolic":"method"}]}},"ValidatorService":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Injectable","line":4,"character":1},"arguments":[{"providedIn":"root"}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}],"allowedOnlyKeyboardNumbers":[{"__symbolic":"method"}],"isValidEmail":[{"__symbolic":"method"}],"alphaNumbersSpaceValidator":[{"__symbolic":"method"}],"alphaNumbersExceptSpaceValidator":[{"__symbolic":"method"}],"alphaNumbersExceptDoubleSpaceValidator":[{"__symbolic":"method"}],"alphaSpaceValidator":[{"__symbolic":"method"}],"alphaNumbersValidator":[{"__symbolic":"method"}],"urlValidator":[{"__symbolic":"method"}],"alphaValidator":[{"__symbolic":"method"}],"noSpaceValidator":[{"__symbolic":"method"}],"previousDateValidator":[{"__symbolic":"method"}],"compareToPreviousDate":[{"__symbolic":"method"}],"currentDateValidator":[{"__symbolic":"method"}],"defalutDateValidator":[{"__symbolic":"method"}],"currentDate":[{"__symbolic":"method"}],"futureDateFromCurrentValidator":[{"__symbolic":"method"}],"compareToNextDate":[{"__symbolic":"method"}],"futureDateValidator":[{"__symbolic":"method"}],"futureDate":[{"__symbolic":"method"}],"checkFormat":[{"__symbolic":"method"}],"dateAllowedOnlyNumbers":[{"__symbolic":"method"}],"allowedOnlyRoundedNumbersValidator":[{"__symbolic":"method"}],"allowedNumberWithDecimal":[{"__symbolic":"method"}],"allowedNumberDecimalWithNegative":[{"__symbolic":"method"}],"allowedOnlyNUmbersValidator":[{"__symbolic":"method"}],"allowedOnlyCurrencyValidator":[{"__symbolic":"method"}],"allowedOnlyPositiveNUmbersValidator":[{"__symbolic":"method"}],"twoDatesValidator":[{"__symbolic":"method"}],"twoDatesValidator2":[{"__symbolic":"method"}],"numbersWithLengthValidator":[{"__symbolic":"method"}],"twoDatesExpValidator":[{"__symbolic":"method"}],"ssnValidator":[{"__symbolic":"method"}],"validateAllZeros":[{"__symbolic":"method"}],"getDate":[{"__symbolic":"method"}],"isTouchedDirty":[{"__symbolic":"method"}],"zipCodeValidator":[{"__symbolic":"method"}],"alphaNumericValidator":[{"__symbolic":"method"}],"percentageComparison":[{"__symbolic":"method"}],"percentageAndLimitPercentageComparison":[{"__symbolic":"method"}],"nameValidator":[{"__symbolic":"method"}],"onlyNumericValidation":[{"__symbolic":"method"}],"passwordValidation":[{"__symbolic":"method"}],"numericRangeValidation":[{"__symbolic":"method"}],"yearFormateValidation":[{"__symbolic":"method"}],"alphaNumaricWithOutSpaceValidator":[{"__symbolic":"method"}],"allowAllWithoutFirstSpaceAndTwoSpace":[{"__symbolic":"method"}],"dateValidations":[{"__symbolic":"method"}],"checktodayTimeVal":[{"__symbolic":"method"}],"fieldWithFirstCharSpace":[{"__symbolic":"method"}],"StringZeroValidator":[{"__symbolic":"method"}],"passwordMatchValidator":[{"__symbolic":"method"}],"validDates":[{"__symbolic":"method"}]},"statics":{"ɵprov":{}}},"MainLayoutComponent":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":12,"character":1},"arguments":[{"selector":"app-main-layout-lib","template":"<!-- <app-header class=\"header\"  (toggleSideBarForMe)=\"sideBarToggler($event)\"></app-header>\r\n<div fxHide=\"true\" fxShow.lt-md>\r\n  <mat-toolbar>\r\n    <mat-toolbar-row></mat-toolbar-row>\r\n  </mat-toolbar>\r\n</div>\r\n<mat-drawer-container>\r\n    <mat-drawer fxShow=\"true\" fxHide.lt-md mode=\"side\" [opened]=\"sideBarOpen\">\r\n        <app-sidebar class=\"sidenav\"></app-sidebar>\r\n    </mat-drawer>\r\n    <mat-drawer-content>\r\n        <router-outlet></router-outlet>\r\n    </mat-drawer-content>\r\n</mat-drawer-container>\r\n\r\n<app-footer></app-footer> -->\r\n<!-- <app-top-nav></app-top-nav> -->\r\n\r\n<app-header-lib\r\n  class=\"header\"\r\n  (toggleSideBarForMe)=\"sideBarToggler($event)\"\r\n></app-header-lib>\r\n\r\n<app-sidebar-lib class=\"sidenav\"></app-sidebar-lib>\r\n\r\n<div id=\"main-container\">\r\n  <router-outlet></router-outlet>\r\n</div>\r\n\r\n<app-footer-lib></app-footer-lib>\r\n","styles":[":host{display:flex;flex-direction:column;height:100%}:host ::ng-deep .mat-drawer{background-color:#33394d;color:#989aa5;border:0}mat-drawer{width:65px}mat-drawer-container{height:100%;width:100%}mat-drawer-content{padding:20px}.header{position:relative;z-index:2}"]}]}],"members":{"navItems":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","name":"NavService"}]}],"ngOnInit":[{"__symbolic":"method"}],"sideBarToggler":[{"__symbolic":"method"}]}},"HttpLoaderFactory":{"__symbolic":"function","parameters":["httpClient"],"value":{"__symbolic":"new","expression":{"__symbolic":"reference","module":"@ngx-translate/http-loader","name":"TranslateHttpLoader","line":54,"character":13},"arguments":[{"__symbolic":"reference","name":"httpClient"},"/assets/i18n/",".json"]}},"ConnectEchoModule":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":57,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ConnectEchoComponent"},{"__symbolic":"reference","name":"TopNavComponent"},{"__symbolic":"reference","name":"MainLayoutComponent"},{"__symbolic":"reference","name":"MenuItemComponent"},{"__symbolic":"reference","name":"CommonErrorMessageComponent"},{"__symbolic":"reference","name":"DeleteConfirmationComponent"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ToasterMessageComponent"},{"__symbolic":"reference","name":"SearchAccountPopupComponent"},{"__symbolic":"reference","name":"ɵb"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":72,"character":4},{"__symbolic":"reference","name":"ɵc"},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":74,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":75,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxButtonModule","line":77,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxFormModule","line":78,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxAccordionModule","line":79,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxCheckBoxModule","line":80,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxSliderModule","line":81,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTagBoxModule","line":82,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTemplateModule","line":83,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTextBoxModule","line":84,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxSelectBoxModule","line":85,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxDateBoxModule","line":86,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTextAreaModule","line":87,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxDataGridModule","line":88,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxPopupModule","line":89,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTooltipModule","line":90,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTreeViewModule","line":91,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxDropDownBoxModule","line":92,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxRadioGroupModule","line":93,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxListModule","line":94,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxFileUploaderModule","line":95,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxProgressBarModule","line":96,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxToastModule","line":97,"character":4},{"__symbolic":"reference","name":"ɵd"}],"schemas":[{"__symbolic":"reference","module":"@angular/core","name":"CUSTOM_ELEMENTS_SCHEMA","line":100,"character":12},{"__symbolic":"reference","module":"@angular/core","name":"NO_ERRORS_SCHEMA","line":100,"character":36}],"exports":[{"__symbolic":"reference","name":"ConnectEchoComponent"},{"__symbolic":"reference","name":"TopNavComponent"},{"__symbolic":"reference","name":"MainLayoutComponent"},{"__symbolic":"reference","name":"MenuItemComponent"},{"__symbolic":"reference","name":"CommonErrorMessageComponent"},{"__symbolic":"reference","name":"DeleteConfirmationComponent"},{"__symbolic":"reference","name":"ɵa"},{"__symbolic":"reference","name":"ToasterMessageComponent"},{"__symbolic":"reference","name":"SearchAccountPopupComponent"},{"__symbolic":"reference","name":"ɵb"},{"__symbolic":"reference","name":"ɵd"}],"providers":[{"__symbolic":"reference","name":"NavService"},{"__symbolic":"reference","module":"@ngx-translate/core","name":"TranslateService","line":114,"character":26},{"__symbolic":"reference","module":"@ngx-translate/core","name":"TranslateStore","line":114,"character":44}]}]}],"members":{}},"ɵa":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":13,"character":1},"arguments":[{"selector":"app-common-confirmation","template":"<dx-popup\r\n  [showTitle]=\"true\"\r\n  [width]=\"450\"\r\n  [height]=\"'auto'\"\r\n  [dragEnabled]=\"false\"\r\n  [title]=\"title\"\r\n  [(visible)]=\"popupVisible\"\r\n  [closeOnOutsideClick]=\"false\"\r\n  class=\"popup-box\"\r\n  (onHiding)=\"onHiding('No')\"\r\n  [resizeEnabled]=\"true\"\r\n>\r\n  <div class=\"row\">\r\n    <div class=\"col-12 alert_box\">\r\n      <p>{{ message }}</p>\r\n    </div>\r\n  </div>\r\n\r\n  <div class=\"row mt-20\">\r\n    <div class=\"col-12\">\r\n      <div class=\"d-flex justify-content-end\">\r\n        <dx-button\r\n          stylingMode=\"contained\"\r\n          type=\"danger\"\r\n          class=\"danger mr-10\"\r\n          [text]=\"yesText\"\r\n          (click)=\"yesBtnClick('Yes')\"\r\n        >\r\n        </dx-button>\r\n        <dx-button\r\n          stylingMode=\"text\"\r\n          type=\"normal\"\r\n          [text]=\"noText\"\r\n          (click)=\"noBtnClick('No')\"\r\n          *ngIf=\"canDisplayCancelButton\"\r\n        ></dx-button>\r\n      </div>\r\n    </div>\r\n  </div>\r\n</dx-popup>\r\n","styles":[""]}]}],"members":{"popupVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"id":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"message":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":22,"character":3}}]}],"title":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"canDisplayCancelButton":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":24,"character":3}}]}],"yesText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":25,"character":3}}]}],"noText":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":26,"character":3}}]}],"noClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":27,"character":3},"arguments":["noClick"]}]}],"yesClick":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":28,"character":3},"arguments":["yesClick"]}]}],"__ctor__":[{"__symbolic":"constructor"}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"noBtnClick":[{"__symbolic":"method"}],"yesBtnClick":[{"__symbolic":"method"}],"onHiding":[{"__symbolic":"method"}]}},"ɵb":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Component","line":7,"character":1},"arguments":[{"selector":"lib-calculate-toll","template":"<dx-popup [showTitle]=\"true\" [maxWidth]=\"1006\" [minWidth]=\"300\" [dragEnabled]=\"false\" title=\"Toll Calculator\"\r\n[(visible)]=\"tolcalculatedpopup\" [closeOnOutsideClick]=\"true\" class=\"Delete_popup popup-with-action-buttons\"\r\n(onHiding)=\"hidezippopupVisiblePopup($event)\" resizeEnabled=\"true\">\r\n      <div class=\"card mb-20\" [formGroup]=\"tollcalculatorform\">\r\n        <div class=\"card-container bottom-action-bar py-20 px-35 position-relative\">\r\n          <div class=\"form-filed\" >\r\n            <div class=\"container-fluid\">\r\n              <div class=\"toll-clculation-wrap d-flex\">\r\n                <div class=\"toll-clculation-left\">\r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 pl-0\">\r\n                      <h5>Pickup</h5>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6 pl-0\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Pickup Airport</div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"pickupap\" [maxLength]=\"3\"></dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Pickup Zip/Postal Code <span\r\n                            class=\"text-danger\">*</span></div>\r\n                        <div class=\"dx-field-value width-50\">\r\n                          <dx-text-box formControlName=\"pickupzip\" validationMessageMode=\"always\">\r\n                            <dx-validator>\r\n                              <dxi-validation-rule type=\"required\"\r\n                                message=\"Zipcode is required\"></dxi-validation-rule>\r\n                            </dx-validator>\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6 pl-0\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Pickup City </div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"pickupcity\"></dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Pickup State/Province </div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"pickupstate\" [maxLength]=\"2\">\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6 pl-0\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Pickup Address Line 1  <span\r\n                            class=\"text-danger\">*</span></div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"pickupaddrs1\" validationMessageMode=\"always\">\r\n                            <dx-validator>\r\n                              <dxi-validation-rule type=\"required\"\r\n                                message=\"Address line 1 is required\"></dxi-validation-rule>\r\n                            </dx-validator>\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Pickup Address Line 2</div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"pickupaddres2\"></dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6 pl-0\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Pickup Country <span\r\n                            class=\"text-danger\">*</span></div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-select-box formControlName=\"country\" [items]=\"countrydata\" [searchEnabled]=\"true\"\r\n                            displayExpr=\"name\" #selectBox valueExpr=\"countryId\"\r\n                            (onValueChanged)=\"handleValueChange($event)\" validationMessageMode=\"always\">\r\n                            <dx-validator>\r\n                              <dxi-validation-rule type=\"required\"\r\n                                message=\"Pickup country is required\"></dxi-validation-rule>\r\n                            </dx-validator>\r\n                          </dx-select-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Vehicle Type</div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-select-box formControlName=\"vehicletype\" [dataSource]=\"vehicletypeslist\"\r\n                            displayExpr=\"vehicleName\" valueExpr=\"vehicleName\" [searchEnabled]=\"true\"></dx-select-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"row\">\r\n                    \r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Suite #</div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"pSuiteno\" (onValueChanged)=\"deliverairchange()\" [maxLength]=\"3\">\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12\">\r\n                      <div class=\"dx-checkbox-wrapper\">\r\n                        <h5 class=\"\">Service Provider</h5>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-radio-group formControlName=\"serviceprovidrs\" [items]=\"serviceProvider\"\r\n                            [value]=\"serviceProvider[1]\" layout=\"horizontal\">\r\n                          </dx-radio-group>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-12\">\r\n                      <div class=\"dx-checkbox-wrapper\">\r\n                        <h5 class=\"\">Toll Method</h5>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-radio-group formControlName=\"tollMethods\" [items]=\"tollMethod\" [value]=\"tollMethods\"\r\n                            layout=\"horizontal\">\r\n                          </dx-radio-group>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12\">\r\n                      <div class=\"dx-checkbox-wrapper\">\r\n                        <h5 class=\"\">Other</h5>\r\n                        <div class=\"dx-checkbox-group d-flex\">\r\n                          <dx-check-box [value]=\"false\" formControlName=\"addtoll\"\r\n                            text=\"Add toll for return\" class=\"mr-60\"></dx-check-box>\r\n                          <dx-check-box [value]=\"false\" formControlName=\"fetchtoll\"\r\n                            text=\"Fetch toll\"></dx-check-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                </div>\r\n                <div class=\"toll-clculation-right\">\r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 pl-0\">\r\n                      <h5>Delivery</h5>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Delivery Airport</div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"deliveryap\" (onValueChanged)=\"deliverairchange()\" [maxLength]=\"3\">\r\n                          </dx-text-box>\r\n                          <span style=\"color:red\" *ngIf=\"feilderror\">Delivery airport is required</span>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6 pr-0\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Delivery Zip/Postal Code<span\r\n                            class=\"text-danger\">*</span></div>\r\n                        <div class=\"dx-field-value width-50\">\r\n                          <dx-text-box formControlName=\"deliveryzip\" validationMessageMode=\"always\">\r\n                            <dx-validator>\r\n                              <dxi-validation-rule type=\"required\"\r\n                                message=\"Delivery zipcode is required\"></dxi-validation-rule>\r\n                            </dx-validator>\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Delivery City </div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"deliverycity\"></dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6 pr-0\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Delivery State/Province </div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"deliverystate\" [maxLength]=\"2\">\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Delivery Address Line 1 <span\r\n                            class=\"text-danger\">*</span></div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"deliveryaddrs1\" validationMessageMode=\"always\">\r\n                            <dx-validator>\r\n                              <dxi-validation-rule type=\"required\"\r\n                                message=\"Delivery address line is required\"></dxi-validation-rule>\r\n                            </dx-validator>\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6 pr-0\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Delivery Address Line 2</div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"deliveryaddress2\"></dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                  <div class=\"row\">\r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Delivery Country <span\r\n                            class=\"text-danger\">*</span></div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-select-box formControlName=\"deliverycountry\" [searchEnabled]=\"true\"\r\n                            [dataSource]=\"countrydata\" (onValueChanged)=\"deliverycountrychange($event)\" displayExpr=\"name\"\r\n                            valueExpr=\"countryId\" validationMessageMode=\"always\">\r\n                            <dx-validator>\r\n                              <dxi-validation-rule type=\"required\"\r\n                                message=\"Delivery country is required\"></dxi-validation-rule>\r\n                            </dx-validator>\r\n                          </dx-select-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                    <div class=\"col-12 col-md-6 col-lg-6 check_input pr-0\">\r\n                      <div class=\"dx-field\">\r\n                        <!-- <div class=\"dx-field-label\"></div>  -->\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-check-box formControlName=\"fectchfulladdrs\" (onValueChanged)=\"oncheckedval($event)\"\r\n                            [value]=\"false\" text=\"Fetch full address from airport\"></dx-check-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"row\">\r\n                    \r\n                    <div class=\"col-12 col-md-6 col-lg-6\">\r\n                      <div class=\"dx-field\">\r\n                        <div class=\"dx-field-label\">Suite #</div>\r\n                        <div class=\"dx-field-value\">\r\n                          <dx-text-box formControlName=\"DSuiteno\" (onValueChanged)=\"deliverairchange()\" [maxLength]=\"3\">\r\n                          </dx-text-box>\r\n                        </div>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"row\">\r\n                    <div class=\"col-12\">\r\n                      <div class=\"dx-field\">\r\n                        <h5>Note:</h5>\r\n                        <span class=\"small-text-note\">\r\n                          This screen populate toll based on an exact address prior to zip code. If you want to fetch zip code specific toll, then enter zip code only.\r\n                        </span>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n                  <div class=\"row\" *ngIf=\"Showloading\">\r\n                    .....\r\n                  </div>\r\n                  <div class=\"row mt-20\" >\r\n                    <div class=\"col-12\">\r\n                      <div class=\"total-cost-wrap\">\r\n                        <ul>\r\n                          <li class=\"d-flex\"><span>Total Miles</span> {{totalMiles}}\r\n                            Miles PZ</li>\r\n                          <li class=\"d-flex\"><span>Total Km</span> {{totalkms}} Kms\r\n                          </li>\r\n                          <li class=\"d-flex\"><span>Total Cost</span> $\r\n                            {{totalTollCost}}\r\n                          </li>\r\n                        </ul>\r\n                      </div>\r\n                    </div>\r\n                  </div>\r\n  \r\n                </div>\r\n              </div>\r\n            </div>\r\n          </div>\r\n  \r\n          <!-- Bottom Action Bar Start -->\r\n          <!-- <div class=\"bottom-action-bar-section\">\r\n            <dx-button stylingMode=\"text\" type=\"default\" class=\"btn-link\"></dx-button>\r\n            <dx-button stylingMode=\"contained\" type=\"default\" [useSubmitBehavior]=\"true\" (click)=\"savetoll()\"\r\n              text=\"calculate \">\r\n            </dx-button>\r\n          </div> -->\r\n          <!-- Bottom Action Bar End -->\r\n  \r\n  \r\n        </div>\r\n      </div>\r\n      <div class=\"row mt-33 popup-btn-wrapper\">\r\n        <div class=\"col-12\">\r\n          <div class=\"d-flex justify-content-end\">\r\n            <dx-button stylingMode=\"contained\" type=\"default\" [useSubmitBehavior]=\"true\" (click)=\"savetoll()\"\r\n            text=\"calculate \">\r\n          </dx-button>\r\n                  </div>\r\n        </div>\r\n      </div>\r\n    </dx-popup>\r\n      \r\n ","styles":[""]}]}],"members":{"tolcalculatedpopup":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":14,"character":3}}]}],"hidezippopupVisible":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":15,"character":3},"arguments":["hidezippopupVisible"]}]}],"sendtolldata":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Output","line":16,"character":3},"arguments":["sendtolldata"]}]}],"countrydata":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":18,"character":3}}]}],"totalMiles":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":19,"character":3}}]}],"totalkms":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":20,"character":3}}]}],"totalTollCost":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":21,"character":3}}]}],"vehicletypeslist":[{"__symbolic":"property","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Input","line":23,"character":3}}]}],"toggleDefault1":[{"__symbolic":"method"}],"toggleDefault2":[{"__symbolic":"method"}],"toggleDefault3":[{"__symbolic":"method"}],"toggleDefault4":[{"__symbolic":"method"}],"toggleDefault5":[{"__symbolic":"method"}],"customizeColumns":[{"__symbolic":"method"}],"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/forms","name":"FormBuilder","line":78,"character":16},{"__symbolic":"reference","module":"@angular/router","name":"Router","line":78,"character":45}]}],"ngOnInit":[{"__symbolic":"method"}],"ngOnChanges":[{"__symbolic":"method"}],"showpopup":[{"__symbolic":"method"}],"Hidepopup":[{"__symbolic":"method"}],"toggleShow":[{"__symbolic":"method"}],"btnHamburger":[{"__symbolic":"method"}],"btnMainNav":[{"__symbolic":"method"}],"btnSearch":[{"__symbolic":"method"}],"btnMAsideOption":[{"__symbolic":"method"}],"btnSidebarOption":[{"__symbolic":"method"}],"hidetolcalculatePopup":[{"__symbolic":"method"}],"getdropdownvalues":[{"__symbolic":"method"}],"handleValueChange":[{"__symbolic":"method"}],"oncheckedval":[{"__symbolic":"method"}],"deliverairchange":[{"__symbolic":"method"}],"deliverycountrychange":[{"__symbolic":"method"}],"savetoll":[{"__symbolic":"method"}]}},"ɵc":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":74,"character":1},"arguments":[{"declarations":[],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":77,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"FormsModule","line":79,"character":4},{"__symbolic":"reference","module":"@angular/forms","name":"ReactiveFormsModule","line":80,"character":4},{"__symbolic":"reference","module":"@angular/cdk/portal","name":"PortalModule","line":82,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxButtonModule","line":84,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxFormModule","line":85,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxAccordionModule","line":86,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxCheckBoxModule","line":87,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxSliderModule","line":88,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTagBoxModule","line":89,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTemplateModule","line":90,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTextBoxModule","line":91,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxSelectBoxModule","line":92,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxDateBoxModule","line":93,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTextAreaModule","line":94,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxDataGridModule","line":95,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxPopupModule","line":96,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTooltipModule","line":97,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxTreeViewModule","line":98,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxDropDownBoxModule","line":99,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxRadioGroupModule","line":100,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxListModule","line":101,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxFileUploaderModule","line":102,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxProgressBarModule","line":103,"character":4},{"__symbolic":"reference","module":"devextreme-angular","name":"DxToastModule","line":104,"character":4}],"providers":[],"exports":[],"schemas":[]}]}],"members":{}},"ɵd":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"NgModule","line":5,"character":1},"arguments":[{"declarations":[{"__symbolic":"reference","name":"ɵe"}],"imports":[{"__symbolic":"reference","module":"@angular/common","name":"CommonModule","line":7,"character":12}],"exports":[{"__symbolic":"reference","name":"ɵe"}],"providers":[]}]}],"members":{"__ctor__":[{"__symbolic":"constructor"}]}},"ɵe":{"__symbolic":"class","decorators":[{"__symbolic":"call","expression":{"__symbolic":"reference","module":"@angular/core","name":"Directive","line":11,"character":1},"arguments":[{"selector":"[autofocus]"}]}],"members":{"__ctor__":[{"__symbolic":"constructor","parameters":[{"__symbolic":"reference","module":"@angular/core","name":"ElementRef","line":15,"character":34}]}],"ngAfterViewInit":[{"__symbolic":"method"}]}}},"origins":{"ConnectEchoService":"./lib/connect-echo.service","ConnectEchoComponent":"./lib/connect-echo.component","TopNavComponent":"./lib/core/components/layout/top-nav/top-nav.component","MenuItemComponent":"./lib/core/components/layout/top-nav/menu-item/menu-item.component","CommonErrorMessageComponent":"./lib/shared/components/common-error-message/common-error-message.component","DeleteConfirmationComponent":"./lib/shared/components/delete-confirmation/delete-confirmation.component","ToasterMessageComponent":"./lib/shared/components/toaster-message/toaster-message.component","SearchAccountPopupComponent":"./lib/shared/components/search-account-popup/search-account-popup.component","NavService":"./lib/core/services/nav.service","ValidatorService":"./lib/core/services/validations.service","MainLayoutComponent":"./lib/core/components/layout/main-layout.component","HttpLoaderFactory":"./lib/connect-echo.module","ConnectEchoModule":"./lib/connect-echo.module","ɵa":"./lib/shared/components/common-confirmation/common-confirmation.component","ɵb":"./lib/shared/components/calculate-toll/calculate-toll.component","ɵc":"./lib/shared/shared.module","ɵd":"./lib/autofocus.module","ɵe":"./lib/core/directives/autofocus.directive"},"importAs":"connect-echo"}