@annalib/anna-core 0.0.3 → 0.0.6

package/src/lib/anna-generic-table-lib/components/anna-non-editable-generic-table/anna-non-editable-generic-table.component.ts

@@ -1,1100 +0,0 @@
-
-// Angular import statements
-import { Component, OnInit, Input, ViewChildren, QueryList, Output, EventEmitter, SimpleChanges, OnChanges, ChangeDetectorRef } from '@angular/core';
-
-// Third party import statements
-import moment from "moment";
-import { NgbDate } from '@ng-bootstrap/ng-bootstrap';
-import { Options } from '@angular-slider/ngx-slider';
-import { cloneDeep, isEqual, map, uniq } from "lodash-es";
-
-// User defined import statements
-import { AnnaSortComponent } from '../anna-sort/anna-sort.component';
-
-//sub-entries of anna lib import statement
-import { SellerGroupHierarchy,IWeekCalendar,radioButtonModel,AnnaSortService,AnnaDateTimeFormatService, NgbDateType, AnnaFilterService, IGtGeneralConfig, IGtTableHeader, ITotalRowInfo, AnnaGenericTableService } from  "@annalib/anna-core/src/lib/anna-core-shared-lib";
-
-
-@Component({
-  selector: 'anna-core-non-editable-generic-table-lib',
-  templateUrl: './anna-non-editable-generic-table.component.html',
-  styleUrls: ['./anna-non-editable-generic-table.component.scss']
-})
-export class AnnaNonEditableGenericTableComponent implements OnInit, OnChanges {
-
-  @Input() showSkeletonLoading: boolean;
-  @Input() tableHeaders: IGtTableHeader[];
-  @Input() tableData: any[];
-  @Input() clonedTableData: any[];
-  @Input() numberOfSkeletonRows: number[]; //this is not being used.
-  @Input() numberOfSkeletonColumns: number[][];
-  @Input() gtGeneralConfig: IGtGeneralConfig;
-  @Input() totalRowInfo?: ITotalRowInfo[];
-  @Input() gtDimension: { rowHeight: number, tableHeight: string, headerHeight: number };
-  @Input() tableClass: string;
-  @Input() maximumRowsWhichCanBeRenderedWithoutScroll: number = 5;
-
-  @Output() toggleCheckbox = new EventEmitter();
-  @Output() toggleRowCheckbox = new EventEmitter();
-  @Output() toggleHeaderCheckbox = new EventEmitter();
-  @Output() undoIconClicked = new EventEmitter();
-  @Output() filterAppliedToTable = new EventEmitter();
-  @Output() sortingAppliedToTable = new EventEmitter();
-  @Output() rowClicked = new EventEmitter();
-  @Output() radioButtonSelected = new EventEmitter();
-  @Output() columnFilterOpened = new EventEmitter();
-  @Output() columnFilterClosed = new EventEmitter();
-  @Output() gtIconClicked = new EventEmitter();
-  @Output() gtSVGIconClicked = new EventEmitter();
-  @Output() gtTextActionClicked = new EventEmitter();
-  @Output() gtViewDetailClicked = new EventEmitter();
-
-
-  tableDataWrapper: any[];
-  rowChecked: boolean;
-  isAllRowsChecked: boolean;
-  noDataWidth: string = "55%";
-  markedForCreditStatus: string;
-  markedForMGStatus: string;
-
-  //Sort and Filter
-  toolTipdata: any;
-  tempTooltipData: any;
-  tooltipRadioTextMap: Map<any, any>;
-  radioButtons: any[];
-  tooltip: any;
-  clonedTooltipData: any;
-  clonedTooltipSelectedMapData: any;
-  searchBar: string;
-  disableClearAllBtn: boolean = true;
-  disableColumnClearAllBtn: boolean = true;
-  allSelected = 0;
-  showAll: boolean;
-  disableCheckboxApply: boolean;
-  disableSliderApplyButton: boolean;
-  disableTimeApplyButton: boolean;
-
-  // Slider Filter
-  sliderMinValue: number;
-  sliderMaxValue: number;
-  options: Options = {
-    floor: 0,
-    ceil: 0,
-    step: 0.1
-  };
-  sliderValue: { min: number, max: number };
-  sliderFilterTextBoxStep: string;
-
-  // Calendar Filter
-  calendarMinEnabledDate: NgbDateType;
-  calendarMaxEnabledDate: NgbDateType;
-  selectedMinDate: NgbDateType;
-  selectedMaxDate: NgbDateType;
-
-  //Week Filter
-  multiWeekPickerConfig: IWeekCalendar;
-
-  //Time Filter
-  selectedFromTime: any[];
-  selectedToTime: any[];
-  clonedSelectedFromTime: any;
-  clonedSelectedToTime: any;
-  disableTimeFilterApplyBtn: boolean;
-  tableColumns: string[] = [];
-  totalRowColumns: string[] = null;
-  showMultiTimeCheckbox: boolean;
-  showZeroTimeCheckbox: boolean;
-  showEnterTimeCheckbox: boolean;
-  multiTimeCheckboxChecked: boolean;
-  zeroTimeCheckboxChecked: boolean;
-  enterTimeCheckboxChecked: boolean;
-  bindValueFuncCalled: boolean;
-
-  hierarchyTooltip: { open: () => void; close: () => void; };
-  sellerGroupHierarchy: SellerGroupHierarchy[];
-  showCheckboxFilterRadioButtons: boolean;
-
-  @ViewChildren(AnnaSortComponent) sortComponent: QueryList<AnnaSortComponent>;
-  isScrolledLeft: boolean = false;
-  rowBorderWidth: number = 2;
-  PfpIconActiveColor = "#9B1B93"
-  PfpIconDisableColor = "rgba(189,189,189,0.5)";
-
-  constructor(
-    private cdRef: ChangeDetectorRef,
-    private annaSortService: AnnaSortService,
-    public annaDateTimeFormatService: AnnaDateTimeFormatService,
-    public annaFilterService: AnnaFilterService,
-    private annaGenericTableService: AnnaGenericTableService
-  ) {
-    this.setTooltipRadioNames();
-  }
-
-  ngOnInit() {
-    // this.tableData = this.numberOfSkeletonColumns;
-  }
-
-  ngOnChanges(changes: SimpleChanges) {
-    // console.log("generic");
-    // console.log(this.tableHeaders);
-    // console.log(JSON.stringify(this.tableData));
-    if (this.showSkeletonLoading) {
-      this.tableData = this.numberOfSkeletonColumns;
-    }
-    else {
-      this.setInitialValueMapData();
-      this.disableEnableEachColumnFilters();
-      this.tableColumns = this.tableHeaders.filter(x => x.visible).map(x => x.headerInfo[0].objectKey);
-      this.showSkeletonLoading = false;
-    }
-
-    //setting table column here as well because while showing skeleton loader, we should show table headers.
-    if (changes['tableHeaders'] && changes['tableHeaders'].currentValue) {
-      this.tableColumns = this.tableHeaders.filter(x => x.visible).map(x => x.headerInfo[0].objectKey)
-    }
-
-    if (changes['totalRowInfo'] && changes['totalRowInfo'].currentValue) {
-      this.totalRowColumns = this.totalRowInfo.map(x => x.colName);
-    }
-    this.cdRef.detectChanges();
-  }
-
-
-  trackByFn(index: number) {
-    return index;
-  }
-
-  setTooltipRadioNames() {
-    this.tooltipRadioTextMap = new Map();
-    this.tooltipRadioTextMap.set("StartTimeForFilter", "Start Time");
-    this.tooltipRadioTextMap.set("EndTimeForFilter", "End Time");
-    this.tooltipRadioTextMap.set("start_time_for_filter", "Start Time");
-    this.tooltipRadioTextMap.set("end_time_for_filter", "End Time");
-    this.tooltipRadioTextMap.set("primaryAEName", "Primary AE");
-    this.tooltipRadioTextMap.set("region", "Region");
-    this.tooltipRadioTextMap.set("agencyName", "Agency");
-    this.tooltipRadioTextMap.set("location", "Location");
-    this.tooltipRadioTextMap.set("advertiserName", "Advertiser");
-    this.tooltipRadioTextMap.set("productCode", "Product Code");
-    this.tooltipRadioTextMap.set("flightStartDate", "Start Date");
-    this.tooltipRadioTextMap.set("flightEndDate", "End Date");
-    this.tooltipRadioTextMap.set("orderIdAndRevNumber", "STN Order#-Rev#");
-    this.tooltipRadioTextMap.set("alternateOrderId", "Buyer Order#");
-    this.tooltipRadioTextMap.set("grp", "GRP");
-    this.tooltipRadioTextMap.set("cpp", "CPP");
-    this.tooltipRadioTextMap.set("imps", "IMPS");
-    this.tooltipRadioTextMap.set("cpm", "CPM");
-    this.tooltipRadioTextMap.set("offeredMGs", "Offered MG");
-    this.tooltipRadioTextMap.set("outstandingPE", "O/S PE");
-    this.tooltipRadioTextMap.set("offeredADUs", "Offered ADUs");
-    this.tooltipRadioTextMap.set("udDeficitValue", "Pending Audience Delta");
-    this.tooltipRadioTextMap.set("startEndTimeMulti", "Time");
-    this.tooltipRadioTextMap.set("bookedValue", "Booked");
-    this.tooltipRadioTextMap.set("bookedSpots", "Spots");
-    this.tooltipRadioTextMap.set("userChanges", "Other changes");
-    this.tooltipRadioTextMap.set("inventoryCode", "Inventory Code");
-    this.tooltipRadioTextMap.set("program", "Program");
-    this.tooltipRadioTextMap.set("agency", "Agency");
-    this.tooltipRadioTextMap.set("advertiser", "Advertiser");
-    this.tooltipRadioTextMap.set("startDate", "Start Date");
-    this.tooltipRadioTextMap.set("endDate", "End Date");
-    this.tooltipRadioTextMap.set("rcvPreempt", "Madegood PE");
-    this.tooltipRadioTextMap.set("osPreempt", "O/S PE");
-    this.tooltipRadioTextMap.set("rcvUnderDly", "Recovered UD");
-    this.tooltipRadioTextMap.set("osUnderDly", "O/s Under Dly");
-    this.tooltipRadioTextMap.set("primaryAe", "Primary AE");
-    this.tooltipRadioTextMap.set("region", "Region");
-    this.tooltipRadioTextMap.set("revCode1", "Rev code 1");
-    this.tooltipRadioTextMap.set("orderNoRevNo", "STN Order#-Rev#");
-    this.tooltipRadioTextMap.set("revCode2", "Rev code 2");
-    this.tooltipRadioTextMap.set("revCode3", "Rev code 3");
-    this.tooltipRadioTextMap.set("booked", "Booked");
-    this.tooltipRadioTextMap.set("spots", "Spots");
-    this.tooltipRadioTextMap.set("postedAudPercent", "Posted %");
-    this.tooltipRadioTextMap.set("revision", "Revision");
-    this.tooltipRadioTextMap.set("productCode", "Product Code");
-    this.tooltipRadioTextMap.set("buyerOrderId", "ALT Order#");
-    this.tooltipRadioTextMap.set("demo","Demo");
-    this.tooltipRadioTextMap.set("postedAdu","Posted ADUs");
-    this.tooltipRadioTextMap.set("scheduledAdu","Scheduled ADUs");
-    this.tooltipRadioTextMap.set("audienceDeficit","Audience Deficit");
-    this.tooltipRadioTextMap.set("postedAudPercent","Posted Audience %");
-  }
-
-  generateTableDataWrapper() {
-    this.showSkeletonLoading = true;
-    this.tableDataWrapper = [];
-    let rowObject: any;
-    let columnName: string;
-    let columnObject: { [x: string]: any; };
-    let columnObjectKey;
-    let keysUsedForTableDisplay: string[];
-    let keysUsedForColumn: string[];
-    let additionalInfoObject: { [x: string]: any; };
-    let additionalKeys;
-    this.tableData.forEach((obj: { [x: string]: any; }) => {
-      rowObject = {};
-      keysUsedForTableDisplay = [];
-      for (var colNum in this.tableHeaders) {
-        columnObject = {};
-        if (!this.tableHeaders[colNum].visible) {
-          continue;
-        }
-        columnName = "";
-        keysUsedForColumn = [];
-        this.tableHeaders[colNum].headerInfo.forEach((header) => {
-          if (header.typeOfBodyData === "STRING") {
-            columnObjectKey = header.objectKey;
-            columnObject[columnObjectKey] = obj[columnObjectKey];
-            keysUsedForTableDisplay.push(columnObjectKey);
-            keysUsedForColumn.push(columnObjectKey);
-          }
-          else if (header.typeOfBodyData === "ICON") {
-            columnObjectKey = header.typeOfBodyData;
-            columnObject[columnObjectKey] = obj[header.objectKey];
-            keysUsedForColumn.push(header.objectKey);
-          }
-          else if (header.typeOfBodyData === "CHECKBOX") {
-            columnObjectKey = header.typeOfBodyData;
-            columnObject[columnObjectKey] = obj[header.objectKey];
-            keysUsedForColumn.push(header.objectKey);
-          }
-        })
-        for (var i = 0; i < keysUsedForColumn.length; i++) {
-          columnName += keysUsedForColumn[i];
-          if (i !== keysUsedForColumn.length - 1) {
-            columnName += ',';
-          }
-        }
-        rowObject[columnName] = columnObject;
-      }
-      additionalInfoObject = {};
-      additionalKeys = Object.keys(obj).filter(key => !keysUsedForTableDisplay.includes(key));
-      additionalKeys.forEach(key => {
-        additionalInfoObject[key] = obj[key];
-      })
-      rowObject.AdditionalInfo = additionalInfoObject;
-      this.tableDataWrapper.push(rowObject);
-    })
-    this.tableData = this.tableDataWrapper;
-    this.showSkeletonLoading = false;
-    // console.log(JSON.stringify(this.tableDataWrapper));
-  }
-
-
-  selectOrUnselectCheckbox(rowData: any, columnKeys: any, isCheckboxSelected: any) {
-    this.toggleCheckbox.emit({ rowData, columnKeys, isCheckboxSelected });
-  }
-
-  selectUnselectAllRows() {
-    this.toggleHeaderCheckbox.emit();
-  }
-
-  selectUnselectRow(rowData: any) {
-    this.toggleRowCheckbox.emit(rowData);
-  }
-
-  undoCreditedSpot(data: any) {
-    this.undoIconClicked.emit({ data, mgOrCredit: "Credit" });
-  }
-
-  undoMgSpot(data: any) {
-    this.undoIconClicked.emit({ data, mgOrCredit: "MakeGood" });
-  }
-
-  //Sort and Filter Logic begins!
-  closeTooltip() {
-    if (this.tooltip && this.tooltip.isOpen()) {
-      this.tooltip.close();
-    }
-    this.tooltip = null;
-    this.disableCheckboxApply = false;
-    if (!this.bindValueFuncCalled) {
-      this.columnFilterClosed.emit();
-    }
-  }
-
-  closeSortTooltip() {
-    if (this.annaSortService.tooltip && this.annaSortService.tooltip.isOpen()) {
-      this.annaSortService.tooltip.close();
-    }
-  }
-
-  initFilters() {
-    this.annaFilterService.tooltipMap = new Map();
-    this.annaFilterService.tooltipSelectedMap = new Map();
-    this.annaSortService.sortByAsc = new Map();
-    this.annaSortService.sortByDesc = new Map();
-    this.annaFilterService.selectedRadio = null;
-    this.annaFilterService.appliedFiltersArray = [];
-    //closing the sort tooltip if we route on the same route or if we click dropdown filters
-    this.closeSortTooltip();
-    this.annaSortService.tooltip = null;
-    this.disableClearAllBtn = true;
-    this.disableTimeFilterApplyBtn = false;
-  }
-
-  setInitialValueMapData() {
-    this.annaFilterService.initialValueMap = new Map();
-    this.tableHeaders.forEach((column) => {
-      column.headerInfo.forEach((header) => {
-        if (header.filter === "SLIDER") {
-          header.filterObjectKeys.forEach((key) => {
-            let min = this.annaFilterService.returnMaxAndMinValue(this.clonedTableData, key, true);
-            let max = this.annaFilterService.returnMaxAndMinValue(this.clonedTableData, key, false);
-            let obj = { min, max };
-
-            this.annaFilterService.initialValueMap.set(key, obj);
-          })
-        }
-        else if (header.filter === "DATE") {
-          header.filterObjectKeys.forEach((key) => {
-            if(key == "period"){
-            const minMaxStartDate = this.annaFilterService.returnMinAndMaxDate(this.clonedTableData, "startDate");
-            const minMaxEndDate = this.annaFilterService.returnMinAndMaxDate(this.clonedTableData, "endDate");
-            let dateObj = { minSelectedDate: minMaxStartDate[0], maxSelectedDate: minMaxEndDate[1] };
-            this.annaFilterService.initialValueMap.set(key, dateObj);      
-          }
-          else{
-            const minMaxDate = this.annaFilterService.returnMinAndMaxDate(this.clonedTableData, key);
-            let obj = { minSelectedDate: minMaxDate[0], maxSelectedDate: minMaxDate[1] };
-            this.annaFilterService.initialValueMap.set(key, obj);
-          }
-          })
-        }
-        else if (header.filter === "TIME") {
-          header.filterObjectKeys.forEach((key) => {
-            let data = this.clonedTableData.filter((obj: { [x: string]: string; }) => !["", "-", null, "0", "<multi>"].includes(obj[key]));
-            let timeArr = map(data, key);
-            timeArr.sort((a, b) => {
-              return this.annaDateTimeFormatService.sortByTimeAscending(a, b);
-            });
-            let obj = {
-              fromTime: timeArr[0],
-              toTime: timeArr[timeArr.length - 1],
-            };
-            if (this.gtGeneralConfig.component === "SPOTDETAILS" || this.gtGeneralConfig.component === "EXCLUDEINVENTORYPOPUP") {
-              let includeMulti = this.clonedTableData.findIndex((obj: { [x: string]: string; }) => obj[key] == "<multi>") != -1;
-              let includeZero = this.clonedTableData.findIndex((obj: { [x: string]: string; }) => obj[key] == "0") != -1;
-              let includeTimeRange = this.clonedTableData.findIndex((obj: { [x: string]: string; }) => obj[key] != "0" && obj[key] != "<multi>") != -1;
-              let obj = {
-                fromTime: timeArr[0],
-                toTime: timeArr[timeArr.length - 1],
-                includeMulti: includeMulti,
-                includeZero: includeZero,
-                includeTimeRange: includeTimeRange
-              };
-              this.annaFilterService.initialValueMap.set(key, obj);
-            }
-            else if (this.gtGeneralConfig.component === "RATING") {
-              let includeMulti = this.clonedTableData.findIndex((obj: any) => obj[key][0] == "<multi>") != -1;
-              let includeZero = this.clonedTableData.findIndex((obj: { [x: string]: string[]; }) => obj[key][0] == "0") != -1;
-              let includeTimeRange = this.clonedTableData.findIndex((obj: { [x: string]: string[]; }) => obj[key][0] != "0" && obj[key][0] != "<multi>") != -1;
-
-              let startTimeArr = map(this.clonedTableData, "startTime");
-              let endTimeArr = map(this.clonedTableData, "endTime");
-
-              startTimeArr.sort((a, b) => {
-                return this.annaDateTimeFormatService.sortByTimeAscending(a, b);
-              });
-
-              endTimeArr.sort((a, b) => {
-                return this.annaDateTimeFormatService.sortByTimeDescending(a, b);
-              });
-
-              let obj = {
-                fromTime: startTimeArr[0],
-                toTime: endTimeArr[0],
-                includeMulti: includeMulti,
-                includeZero: includeZero,
-                includeTimeRange: includeTimeRange
-              };
-              this.annaFilterService.initialValueMap.set(key, obj);
-
-            }
-            else {
-              this.annaFilterService.initialValueMap.set(key, obj);
-            }
-          })
-        }
-      })
-    })
-  }
-
-  isTooltipActive(header: any[]) {
-    return this.annaFilterService.isTooltipActive(header);
-  }
-
-  bindTheValueToToolTip(tooltip: any, header: any[]) {
-
-    this.bindValueFuncCalled = true;
-    let containerToScroll;
-    if (this.gtGeneralConfig.component === "SPOTDETAILS" || this.gtGeneralConfig.component === "DRRLISTING") {
-      containerToScroll = document.getElementsByClassName("scrollable-container")[0];
-      var mediaQuery = window.matchMedia("(max-width: 1366px)");
-      if (mediaQuery.matches) {
-        containerToScroll.scroll(0, this.gtGeneralConfig.verticalScrollOffsetForFilterTooltip);
-      }
-    }
-    // if same tooltip opened close it
-    if (tooltip == this.tooltip) {
-      this.bindValueFuncCalled = false;
-      this.closeTooltip();
-    }
-    else {
-      this.searchBar = '';
-      let enabledHeaders: any[] = [];
-      header.forEach((item: string | number) => {
-        if(item == "period"){
-            let uniqStartDate = uniq(this.tableData.map((u: { [x: string]: any; }) => u["startDate"]));
-            let uniqEndDate = uniq(this.tableData.map((u:{ [x: string]: any; }) => u["endDate"]));
-            if(uniqStartDate.length > 1 || uniqEndDate.length > 1 || this.isTooltipActive([item])){
-              enabledHeaders.push(item);
-            }
-        }
-        else if(uniq(this.tableData.map((u:{ [x: string]: any; }) => u[item])).length > 1 || this.isTooltipActive([item])){
-            enabledHeaders.push(item);
-        }
-      });
-      this.openTooltip(tooltip, enabledHeaders);
-      if (window.innerWidth < 1500 && window.innerHeight < 768 && !this.annaFilterService.sliderSet.has(header[0])) {
-        this.columnFilterOpened.emit();
-      }
-
-      this.showCheckboxFilterRadioButtons = enabledHeaders.length > 1;
-
-      this.populateTooltipDataBasedOnSelectedRadio(enabledHeaders[0]);
-      this.bindValueFuncCalled = false;
-    }
-  }
-
-  openTooltip(tooltip: any, header: any[]) {
-    this.closeTooltip();
-    this.tooltip = tooltip;
-    this.tooltip.open();
-    //convert key into the header
-    this.radioButtons = header.map((key: any) => {
-      let value = this.tooltipRadioTextMap.has(key)
-        ? this.tooltipRadioTextMap.get(key)
-        : key; //change to display name
-      return new radioButtonModel(key, value);
-    });
-  }
-
-  clearColumnFilter() {
-    this.annaFilterService.clearColumnFilter();
-    this.toolTipdata = null;
-    this.tempTooltipData = null;
-    this.closeTooltip();
-    this.tableData = this.annaFilterService.filterData(this.clonedTableData, "");
-    this.checkIfSortingIsApplied();
-    this.filterAppliedToTable.emit(this.tableData);
-    this.disableEnableEachColumnFilters();
-  }
-
-  populateTooltipDataBasedOnSelectedRadio(header: string) {
-
-    this.disableSliderApplyButton = false;
-    this.disableCheckboxApply = false;
-    if (this.toolTipdata) {
-      this.revert();
-    }
-
-    this.annaFilterService.selectedRadio = header;
-    let selectedFilterSet = new Set(this.annaFilterService.appliedFiltersArray);
-    this.disableColumnClearAllBtn = selectedFilterSet.has(this.annaFilterService.selectedRadio) ? false : true;
-    if (this.annaFilterService.calendarSet.has(header)) {
-      this.getCalendarData();
-    } else if (this.annaFilterService.sliderSet.has(header)) {
-      this.getSliderData(header);
-    } else if (this.annaFilterService.timeSet.has(header)) {
-      this.getTimeFilterData(header);
-    } else {
-      this.getCheckboxData(header);
-    }
-  }
-
-  getSliderData(header: string) {
-
-    if (header === "Rate") {
-      this.annaFilterService.translateFunc = "currency";
-    }
-    else {
-      this.annaFilterService.translateFunc = "normal";
-    }
-    this.options = this.annaFilterService.populateSliderTooltip(this.clonedTableData, this.tableData);
-
-    this.disableSliderApplyButton = this.disableSliderApplyBtn();
-    let selectedTooltipObj;
-    if (this.annaFilterService.tooltipSelectedMap.has(header)) {
-      selectedTooltipObj = this.annaFilterService.tooltipSelectedMap.get(header);
-    }
-    else {
-      selectedTooltipObj = this.annaFilterService.initialValueMap.get(header);
-    }
-
-    this.sliderMinValue = selectedTooltipObj.min < this.options.floor ? this.options.floor : selectedTooltipObj.min;
-    this.sliderMaxValue = selectedTooltipObj.max < this.options.ceil ? selectedTooltipObj.max : this.options.ceil;
-    //default step values
-    this.options.step = 1;
-    this.sliderFilterTextBoxStep = "1";
-    if (header !== "WeekNumber") {
-      this.options.step = 0.1;
-      this.sliderFilterTextBoxStep = "0.1";
-    }
-  }
-
-  getCheckboxData(header: string) {
-    this.tempTooltipData = this.annaFilterService.populateTooltip(header, this.clonedTableData, this.tableData);
-    this.allSelected = this.annaFilterService.isAllOptionsSelected();
-    this.showAll = this.tempTooltipData.filter((x: { isHidden: any; }) => !x.isHidden).length > 1 ? true : false;
-    this.toolTipdata = cloneDeep(this.tempTooltipData);
-  }
-
-  getCalendarData() {
-    const parsingFormat = "MM/DD/YYYY";
-    let minMaxdate: any = this.annaFilterService.populateDatePickerTooltipWithData(this.clonedTableData, this.tableData);
-    let selectedDateObj;
-    if (this.annaFilterService.tooltipSelectedMap.has(this.annaFilterService.selectedRadio)) {
-      selectedDateObj = this.annaFilterService.tooltipSelectedMap.get(this.annaFilterService.selectedRadio);
-    }
-    else {
-      selectedDateObj = this.annaFilterService.initialValueMap.get(this.annaFilterService.selectedRadio);
-    }
-
-    // For startDate
-    // selected date is less than date which we get
-    if ((selectedDateObj.minSelectedDate).isAfter(minMaxdate.minStartDate)) {
-      this.selectedMinDate = this.annaDateTimeFormatService.convertToNgbDate(selectedDateObj.minSelectedDate, parsingFormat);
-    }
-    else {
-      this.selectedMinDate = this.annaDateTimeFormatService.convertToNgbDate(minMaxdate.minStartDate, parsingFormat);
-    }
-
-    // For endData
-    // selectedDate is less than date which we get
-    if ((selectedDateObj.maxSelectedDate).isAfter(minMaxdate.maxEndDate)) {
-      this.selectedMaxDate = this.annaDateTimeFormatService.convertToNgbDate(minMaxdate.maxEndDate, parsingFormat);
-    }
-    else {
-      this.selectedMaxDate = this.annaDateTimeFormatService.convertToNgbDate(selectedDateObj.maxSelectedDate, parsingFormat);
-    }
-
-    this.calendarMinEnabledDate = this.annaDateTimeFormatService.convertToNgbDate(minMaxdate.minStartDate, parsingFormat);
-    this.calendarMaxEnabledDate = this.annaDateTimeFormatService.convertToNgbDate(minMaxdate.maxEndDate, parsingFormat);
-  }
-
-  getTimeFilterData(header: string): void {
-    if (this.annaFilterService.tooltipSelectedMap.has(header)) {
-      this.selectedFromTime = this.annaFilterService.tooltipSelectedMap.get(header).fromTime;
-      this.selectedToTime = this.annaFilterService.tooltipSelectedMap.get(header).toTime;
-    } else {
-      this.selectedFromTime = this.annaFilterService.initialValueMap.get(header).fromTime;
-      this.selectedToTime = this.annaFilterService.initialValueMap.get(header).toTime;
-    }
-    if (this.selectedFromTime != undefined || this.selectedToTime != undefined) {
-      this.selectedFromTime = this.annaDateTimeFormatService.formatToTwelveHrs(this.selectedFromTime, true);
-      this.selectedToTime = this.annaDateTimeFormatService.formatToTwelveHrs(this.selectedToTime, true);
-
-      this.clonedSelectedFromTime = cloneDeep(this.selectedFromTime);
-      this.clonedSelectedToTime = cloneDeep(this.selectedToTime);
-    }
-    else {
-      this.selectedFromTime = ["-", "-", "-"];
-      this.selectedToTime = ["-", "-", "-"];
-      this.disableTimeFilterApplyBtn = true;
-    }
-
-    if (this.gtGeneralConfig.component === "SPOTDETAILS" || this.gtGeneralConfig.component === "EXCLUDEINVENTORYPOPUP") {
-      this.showMultiTimeCheckbox = false;
-      this.showZeroTimeCheckbox = false;
-      this.showEnterTimeCheckbox = false;
-
-      if (this.clonedTableData.findIndex((obj: any) => obj[header] == "0") != -1) {
-        this.showZeroTimeCheckbox = true;
-        this.annaFilterService.includeZeroTime = this.tableData.findIndex((obj: any) => obj[header] == "0") != -1;
-        this.zeroTimeCheckboxChecked = this.annaFilterService.includeZeroTime;
-      }
-      if (this.clonedTableData.findIndex((obj: any) => obj[header] == "<multi>") != -1) {
-        this.showMultiTimeCheckbox = true;
-        this.annaFilterService.includeMultiTime = this.tableData.findIndex((obj: any) => obj[header] == "<multi>") != -1;
-        this.multiTimeCheckboxChecked = this.annaFilterService.includeMultiTime;
-      }
-      if (this.showZeroTimeCheckbox || this.showMultiTimeCheckbox) {
-        this.showEnterTimeCheckbox = true;
-      }
-      if (this.clonedTableData.findIndex((obj: any) => obj[header] != "<multi>" && obj[header] != "0") != -1) {
-        this.annaFilterService.includeTimeRange = this.tableData.findIndex((obj: any) => obj[header] != "<multi>" && obj[header] != "0") != -1;
-        this.enterTimeCheckboxChecked = this.annaFilterService.includeTimeRange;
-      }
-    }
-    else if (this.gtGeneralConfig.component === "RATING") {
-      this.showMultiTimeCheckbox = false;
-      this.showZeroTimeCheckbox = false;
-      this.showEnterTimeCheckbox = false;
-
-      if (this.clonedTableData.findIndex((obj: any) => obj[header][0] == "0") != -1) {
-        this.showZeroTimeCheckbox = true;
-        this.annaFilterService.includeZeroTime = this.tableData.findIndex((obj: any) => obj[header][0] == "0") != -1;
-        this.zeroTimeCheckboxChecked = this.annaFilterService.includeZeroTime;
-      }
-      if (this.clonedTableData.findIndex((obj: any) => obj[header][0] == "<multi>") != -1) {
-        this.showMultiTimeCheckbox = true;
-        this.annaFilterService.includeMultiTime = this.tableData.findIndex((obj: any) => obj[header][0] == "<multi>") != -1;
-        this.multiTimeCheckboxChecked = this.annaFilterService.includeMultiTime;
-      }
-      if (this.showZeroTimeCheckbox || this.showMultiTimeCheckbox) {
-        this.showEnterTimeCheckbox = true;
-      }
-      if (this.clonedTableData.findIndex((obj: any) => obj[header][0] != "<multi>" && obj[header][0] != "0") != -1) {
-        this.annaFilterService.includeTimeRange = this.tableData.findIndex((obj: any) => obj[header][0] != "<multi>" && obj[header][0] != "0") != -1;
-        this.enterTimeCheckboxChecked = this.annaFilterService.includeTimeRange;
-      }
-
-    }
-  }
-
-  selectOrUnselectMultiTimeCheckbox() {
-    this.multiTimeCheckboxChecked = !this.multiTimeCheckboxChecked;
-    this.annaFilterService.includeMultiTime = !this.annaFilterService.includeMultiTime;
-    this.disableTimeFilterApplyButton();
-  }
-
-  selectOrUnselectZeroTimeCheckbox() {
-    this.zeroTimeCheckboxChecked = !this.zeroTimeCheckboxChecked;
-    this.annaFilterService.includeZeroTime = !this.annaFilterService.includeZeroTime;
-    this.disableTimeFilterApplyButton();
-  }
-
-  selectOrUnselectEnterTimeCheckbox() {
-    this.enterTimeCheckboxChecked = !this.enterTimeCheckboxChecked;
-    this.annaFilterService.includeTimeRange = !this.annaFilterService.includeTimeRange;
-    this.disableTimeFilterApplyButton();
-  }
-
-  disableSliderApplyBtn() {
-    return this.options.floor === this.options.ceil;
-  }
-
-  isCheckboxSelected(data: boolean | number) {
-    this.allSelected = this.annaFilterService.isCheckboxSelected(data);
-    if (this.annaFilterService.tooltipMap.get(this.annaFilterService.selectedRadio).filter((x: any) => x.isSelected && !x.isHidden).length == 0) {
-      this.disableCheckboxApply = true;
-    } else {
-      this.disableCheckboxApply = false;
-    }
-  }
-
-  minValueChanged(value: string) {
-    if (isNaN(+value)) {
-      this.sliderMinValue = +this.options.floor;
-    }
-    else {
-      if (+value > this.sliderMaxValue) {
-        this.sliderMinValue = this.sliderMaxValue;
-      }
-      else if (+value < this.options.floor) {
-        this.sliderMinValue = this.options.floor;
-      } else {
-        this.sliderMinValue = +value;
-      }
-    }
-  }
-
-  maxValueChanged(value: string) {
-    if (isNaN(+value)) {
-      this.sliderMaxValue = +this.options.ceil;
-    }
-    else {
-      if (+value < this.sliderMinValue) {
-        this.sliderMaxValue = this.sliderMinValue;
-      }
-      else if (+value > this.options.ceil) {
-        this.sliderMinValue = this.options.ceil;
-      } else {
-        this.sliderMaxValue = +value;
-      }
-    }
-  }
-
-  sliderValueChange() {
-    this.sliderValue = { min: this.sliderMinValue, max: this.sliderMaxValue };
-  }
-
-  cancelSliderFilter() {
-    this.sliderValue = null;
-    this.closeTooltip();
-  }
-
-  allOptionClicked() {
-    if (this.allSelected == 0 || this.allSelected == 2) {
-      this.allSelected = 1;
-      this.disableCheckboxApply = false;
-    } else {
-      this.allSelected = 0;
-      this.disableCheckboxApply = true;
-    }
-    this.annaFilterService.allOptionsClicked(this.allSelected);
-  }
-
-  applyFilters() {
-    let isSame = isEqual(this.toolTipdata, this.tempTooltipData);
-    this.toolTipdata = cloneDeep(this.tempTooltipData);
-    this.annaFilterService.tooltipMap.set(this.annaFilterService.selectedRadio, this.tempTooltipData);
-    if (!isSame) {
-      this.annaFilterService.reOrderAppliedFiltersArray(false);
-    }
-    let tooltipSelectedDataArray = this.annaFilterService.tooltipMap.get(this.annaFilterService.selectedRadio).filter((x: { isSelected: any; }) => x.isSelected).map((x: { data: any; }) => x.data);
-    if (tooltipSelectedDataArray.length == 0) {
-      tooltipSelectedDataArray = this.annaFilterService.tooltipMap.get(this.annaFilterService.selectedRadio).map((x: { data: any; }) => x.data);
-    }
-    this.annaFilterService.tooltipSelectedMap.set(this.annaFilterService.selectedRadio, tooltipSelectedDataArray);
-    this.tableData = this.annaFilterService.filterData(this.clonedTableData, "");
-    this.checkIfSortingIsApplied();
-    this.filterAppliedToTable.emit(this.tableData);
-    // this.generateTableDataWrapper();
-    this.disableEnableEachColumnFilters();
-    this.closeTooltip();
-  }
-
-  revert() {
-    this.tempTooltipData = cloneDeep(this.toolTipdata);
-    this.annaFilterService.tooltipMap.set(this.annaFilterService.selectedRadio, this.tempTooltipData);
-    this.toolTipdata = null;
-  }
-
-  closeCheckboxFilter() {
-    if (this.toolTipdata) {
-      this.revert();
-    }
-    this.closeTooltip();
-  }
-
-  applySliderFilter() {
-    if (this.sliderValue) {
-      let selectedDataObj;
-      if (this.annaFilterService.tooltipSelectedMap.has(this.annaFilterService.selectedRadio)) {
-        selectedDataObj = this.annaFilterService.tooltipSelectedMap.get(this.annaFilterService.selectedRadio);
-      }
-      else {
-        selectedDataObj = this.annaFilterService.initialValueMap.get(this.annaFilterService.selectedRadio);
-      }
-
-      let isSame = isEqual(selectedDataObj, this.sliderValue);
-
-
-      if (!isSame) {
-        this.annaFilterService.sliderData = { min: this.options.floor, max: this.options.ceil };
-        this.annaFilterService.tooltipSelectedMap.set(this.annaFilterService.selectedRadio, this.sliderValue);
-        this.annaFilterService.reOrderAppliedFiltersArray(false);
-        this.tableData = this.annaFilterService.filterData(this.clonedTableData, "");
-        this.checkIfSortingIsApplied();
-        this.filterAppliedToTable.emit(this.tableData);
-        // this.generateTableDataWrapper();
-        this.disableEnableEachColumnFilters();
-      }
-    }
-    this.sliderValue = null;
-    this.closeTooltip();
-  }
-
-  cancelInDateFilter() {
-    this.closeTooltip();
-  }
-
-  applyDateFilter(selectedDate: { fromDate: NgbDate, toDate: NgbDate }) {
-
-    let selectedDateObj;
-    if (this.annaFilterService.tooltipSelectedMap.has(this.annaFilterService.selectedRadio)) {
-      selectedDateObj = this.annaFilterService.tooltipSelectedMap.get(this.annaFilterService.selectedRadio);
-    }
-    else {
-      selectedDateObj = cloneDeep(this.annaFilterService.initialValueMap.get(this.annaFilterService.selectedRadio));
-    }
-
-    let isStartDateSame = isEqual(this.annaDateTimeFormatService.convertNgbDateToMoment(selectedDate.fromDate), selectedDateObj.minSelectedDate);
-    let isEndDateSame = isEqual(this.annaDateTimeFormatService.convertNgbDateToMoment(selectedDate.toDate), selectedDateObj.maxSelectedDate);
-
-    if (!isStartDateSame || !isEndDateSame) {
-      selectedDateObj.minSelectedDate = moment(this.annaDateTimeFormatService.convertNgbDateToMoment(selectedDate.fromDate));
-      selectedDateObj.maxSelectedDate = moment(this.annaDateTimeFormatService.convertNgbDateToMoment(selectedDate.toDate));
-      this.annaFilterService.flightDateRange = {
-        minSelectedDate: moment(this.annaDateTimeFormatService.convertNgbDateToMoment(this.calendarMinEnabledDate)),
-        maxSelectedDate: moment(this.annaDateTimeFormatService.convertNgbDateToMoment(this.calendarMaxEnabledDate))
-      };
-      this.annaFilterService.tooltipSelectedMap.set(this.annaFilterService.selectedRadio, selectedDateObj);
-      this.annaFilterService.reOrderAppliedFiltersArray(false);
-      this.tableData = this.annaFilterService.filterData(this.clonedTableData, "");
-      this.checkIfSortingIsApplied();
-      this.filterAppliedToTable.emit(this.tableData);
-      // this.generateTableDataWrapper();
-      this.disableEnableEachColumnFilters();
-    }
-    this.closeTooltip();
-  }
-
-  applyWeekFilter(event: any) {
-
-  }
-
-  incrementHour(arr: any[]) {
-    if (arr[0] == "") {
-      arr[0] = 1;
-    } else if (parseInt(arr[0]) < 12) {
-      arr[0] = parseInt(arr[0]) + 1;
-    } else {
-      arr[0] = 1;
-    }
-  }
-
-  decrementHour(arr: any[]) {
-    if (arr[0] == "") {
-      arr[0] = 12;
-    } else if (parseInt(arr[0]) > 1) {
-      arr[0] = parseInt(arr[0]) - 1;
-    } else {
-      arr[0] = 12;
-    }
-  }
-
-  incrementMinute(arr: any[]) {
-    if (arr[1] == "" || parseInt(arr[1]) == 0) {
-      arr[1] = 30;
-    } else {
-      arr[1] = "00";
-    }
-  }
-
-  decrementMinute(arr: any) {
-    if (arr[1] == "" || parseInt(arr[1]) == 30) {
-      arr[1] = "00";
-    } else {
-      arr[1] = 30;
-    }
-  }
-
-  changeStartTimeHour(increment: boolean) {
-    if (increment) {
-      this.incrementHour(this.selectedFromTime);
-    } else {
-      this.decrementHour(this.selectedFromTime);
-    }
-    this.disableTimeFilterApplyButton();
-  }
-
-  changeEndTimeHour(increment: boolean) {
-    if (increment) {
-      this.incrementHour(this.selectedToTime);
-    } else {
-      this.decrementHour(this.selectedToTime);
-    }
-    this.disableTimeFilterApplyButton();
-  }
-
-  changeEndTimeMinute(increment: boolean) {
-    if (increment) {
-      this.incrementMinute(this.selectedToTime);
-    } else {
-      this.decrementMinute(this.selectedToTime);
-    }
-    this.disableTimeFilterApplyButton();
-  }
-
-  changeStartTimeMinute(increment: boolean) {
-    if (increment) {
-      this.incrementMinute(this.selectedFromTime);
-    } else {
-      this.decrementMinute(this.selectedFromTime);
-    }
-    this.disableTimeFilterApplyButton();
-  }
-
-  applyTimeFilters() {
-    let fromTime24HrFormatArr = this.annaDateTimeFormatService.convertTotwentyFourHrsFormat(
-      this.selectedFromTime[0] + ":" + this.selectedFromTime[1] + " " + this.selectedFromTime[2],
-      true
-    );
-    let fromTime24HrFormat = fromTime24HrFormatArr[0] + ":" + fromTime24HrFormatArr[1] + ":00";
-    let toTime24HrFormatArr = this.annaDateTimeFormatService.convertTotwentyFourHrsFormat(
-      this.selectedToTime[0] + ":" + this.selectedToTime[1] + " " + this.selectedToTime[2],
-      true
-    );
-    let toTime24HrFormat = toTime24HrFormatArr[0] + ":" + toTime24HrFormatArr[1] + ":00";
-
-    let previousSelectedData;
-    if (this.annaFilterService.tooltipSelectedMap.has(this.annaFilterService.selectedRadio)) {
-      previousSelectedData = this.annaFilterService.tooltipSelectedMap.get(this.annaFilterService.selectedRadio);
-    } else {
-      previousSelectedData = this.annaFilterService.initialValueMap.get(this.annaFilterService.selectedRadio);
-    }
-
-    let selectedData = {
-      fromTime: fromTime24HrFormat, toTime: toTime24HrFormat, includeMulti: this.annaFilterService.includeMultiTime,
-      includeZero: this.annaFilterService.includeZeroTime, includeTimeRange: this.annaFilterService.includeTimeRange
-    };
-    if (!isEqual(previousSelectedData, selectedData)) {
-      this.annaFilterService.tooltipSelectedMap.set(this.annaFilterService.selectedRadio, selectedData);
-      this.annaFilterService.reOrderAppliedFiltersArray(false);
-      this.tableData = this.annaFilterService.filterData(this.clonedTableData, "");
-      this.checkIfSortingIsApplied();
-      this.filterAppliedToTable.emit(this.tableData);
-      // this.generateTableDataWrapper();
-      this.disableEnableEachColumnFilters();
-    }
-    this.closeTooltip();
-  }
-
-  closeTimeFilter() {
-    this.selectedFromTime = cloneDeep(this.clonedSelectedFromTime);
-    this.selectedToTime = cloneDeep(this.clonedSelectedToTime);
-    this.closeTooltip();
-  }
-
-  disableTimeFilterApplyButton() {
-    let timeFormat = "HH:mm:ss";
-
-    let startTime24HrFormatArr = this.annaDateTimeFormatService.convertTotwentyFourHrsFormat(
-      this.selectedFromTime[0] + ":" + this.selectedFromTime[1] + " " + this.selectedFromTime[2],
-      true
-    );
-    let startTime24HrFormat = startTime24HrFormatArr[0] + ":" + startTime24HrFormatArr[1] + ":00";
-    let endTime24HrFormatArr = this.annaDateTimeFormatService.convertTotwentyFourHrsFormat(
-      this.selectedToTime[0] + ":" + this.selectedToTime[1] + " " + this.selectedToTime[2],
-      true
-    );
-    let endTime24HrFormat = endTime24HrFormatArr[0] + ":" + endTime24HrFormatArr[1] + ":00";
-
-    this.disableTimeFilterApplyBtn = moment(startTime24HrFormat, timeFormat).isAfter(moment(endTime24HrFormat, timeFormat));
-
-    if (!this.multiTimeCheckboxChecked && !this.zeroTimeCheckboxChecked && !this.enterTimeCheckboxChecked) {
-      this.disableTimeFilterApplyBtn = true;
-    }
-  }
-
-  sortedData(event: any) {
-    if (event.type == "none") {
-      this.tableData = this.annaFilterService.filterData(this.clonedTableData, "");
-    } else {
-      this.tableData = event.data;
-    }
-    this.sortingAppliedToTable.emit(this.tableData);
-    // this.generateTableDataWrapper();
-  }
-
-  checkIfSortingIsApplied() {
-    let appliedkey;
-    let isAsc;
-    const arr = this.sortComponent.toArray();
-
-    let obj = this.annaSortService.checkIfSortingIsApplied(this.annaSortService.sortByAsc, true);
-    appliedkey = obj.key;
-    isAsc = obj.setValueTo;
-
-    if (!appliedkey) {
-      let obj = this.annaSortService.checkIfSortingIsApplied(this.annaSortService.sortByDesc, false);
-      appliedkey = obj.key;
-      isAsc = obj.setValueTo;
-    }
-
-    if (appliedkey) {
-      this.applySorting(arr, appliedkey, isAsc);
-    }
-  }
-
-  applySorting(sortComponentArr: AnnaSortComponent[], appliedKey: string, isAsc: boolean) {
-    sortComponentArr.forEach((component) => {
-      if (component.sortBy === appliedKey) {
-        this.setSortComponentDataProperty(component);
-        isAsc ? component.sortByAscending() : component.sortByDescending();
-      }
-    });
-  }
-
-  setSortComponentDataProperty(sortComponent: AnnaSortComponent) {
-    sortComponent.data = this.tableData;
-    sortComponent.clonedData = cloneDeep(this.tableData);
-  }
-
-  disableEnableEachColumnFilters() {
-    this.tableHeaders.forEach(header => {
-      header.headerInfo.forEach(item => {
-        if (item.filter != "") {
-          let values = [];
-          item.disableFilter = true;
-
-          item.filterObjectKeys.forEach(key => {
-            
-            if(key == "period"){
-              let uniqStartDate = uniq(this.tableData.map((u: { [x: string]: any; }) => u["startDate"]));
-              let uniqEndDate = uniq(this.tableData.map((u: { [x: string]: any; }) => u["endDate"]));
-
-              item.disableFilter = (uniqStartDate.length > 1 || uniqEndDate.length > 1) ? false : true; 
-            }
-            else{
-              values = this.tableData.map((u: { [x: string]: any; }) => u[key]);
-              if(uniq(values).filter(n => n!=null).length > 1){
-                item.disableFilter = false;
-              }
-            }
-
-          })
-          // if(uniq(values).length > 1){
-          //   item.disableFilter = false;
-          // }else{
-          //   item.disableFilter = true;
-          // }
-        }
-        if (item.sort) {
-          if (uniq(this.tableData.map((u: { [x: string]: any; }) => u[item.objectKey])).length > 1) {
-            item.disableSort = false;
-          } else {
-            item.disableSort = true;
-          }
-        }
-      });
-    });
-  }
-
-  ngAfterViewInit() {
-    this.annaGenericTableService.virtualScrollSubject.subscribe((val) =>{
-      this.isScrolledLeft = document.getElementsByClassName("anna-table-virtual-scroll-viewport")[0].scrollLeft > 0;
-      this.cdRef.detectChanges();
-    });
-  }
-
-  dataRowClicked(rowData: any) {
-    this.rowClicked.emit(rowData);
-  }
-
-  radioButtonClicked(data: any, action: string, isDisabled: boolean) {
-    if (!isDisabled) {
-      this.radioButtonSelected.emit({ data, action });
-    }
-  }
-
-  bindTheValueToSellerGroupTooltip(sellerGroupHierarchy: SellerGroupHierarchy[], tooltip: any): void {
-    if (this.hierarchyTooltip && this.hierarchyTooltip.open) {
-      this.hierarchyTooltip.close();
-    }
-    this.sellerGroupHierarchy = sellerGroupHierarchy;
-    this.hierarchyTooltip = tooltip;
-    this.hierarchyTooltip.open();
-  }
-
-  iconClicked(rowData: any,iconClass: string){
-    this.gtIconClicked.emit({data: rowData,iconClass: iconClass});
-  }
-
-  svgIconClicked(rowData: any,key: string){
-    this.gtSVGIconClicked.emit({data: rowData,key: key});
-  }
-
-  textActionClicked(rowData: any,id: number){
-    this.gtTextActionClicked.emit({data:rowData,id});
-  }
-
-  viewDetailsClicked(rowData: any){
-    this.gtViewDetailClicked.emit({data:rowData});
-  }
-
-}