vc-create-dashboard 3.0.84 → 3.0.86

package/src/lib/ui-kit/time-filter/time-filter.component.ts

@@ -1,284 +0,0 @@
-import {
-  Component,
-  OnInit,
-  Input,
-  Output,
-  OnChanges,
-  EventEmitter,
-  SimpleChanges,
-} from '@angular/core';
-
-@Component({
-  selector: 'app-time-filter',
-  templateUrl: './time-filter.component.html',
-  styleUrls: ['./time-filter.component.less'],
-})
-export class TimeFilterComponent implements OnInit, OnChanges {
-  placeholderText: string = 'Select a time period'; // placeholder for time filter
-  timeFilterType: Array<string> = ['Monthly', 'Quarterly'];
-  selectedFilterType: number = 0;
-  monthList = [
-    'January',
-    'February',
-    'March',
-    'April',
-    'May',
-    'June',
-    'July',
-    'August',
-    'September',
-    'October',
-    'November',
-    'December',
-  ];
-  selectedFilter: Array<string> = [];
-  quarterlyArray = [
-    'Jan, Feb, Mar',
-    'Apr, May, Jun',
-    'Jul, Aug, Sep',
-    'Oct, Nov, Dec',
-  ];
-
-  showTime: boolean = false;
-  showMonth: boolean = false;
-  showMonthPopup: boolean = false;
-  showQuarter: boolean = false;
-  showBusCycle: boolean = false;
-  startOfRange: any = {
-    startMonth: 1,
-    startYear: new Date()?.getFullYear(),
-  };
-  endOfRange: any = {
-    endMonth: 1,
-    endYear: new Date()?.getFullYear(),
-  };
-
-  selectedType: any = {
-    type: 0,
-    startDate: '',
-    endDate: '',
-    selectedId: [],
-    time_filter_type: '',
-  };
-
-  isApplied = false;
-  isApplyDisabled = true;
-  applyButtonName = 'Apply';
-  isReset = false;
-  @Input() selectedData = {
-    type: 0,
-    selectedId: [],
-  };
-
-  @Input() businessCycleRange: any; // sample  { start_date: '01-01-2021', end_date: '31-12-2021', selected: true }
-  @Output() timeFilterApply = new EventEmitter(); // sample {type: "monthly", startDate: "01-1-2021", endDate: "31-1-2021"}
-
-  constructor() {}
-
-  ngOnInit(): void {}
-
-  ngOnChanges(changes: SimpleChanges) {
-    if (this.businessCycleRange) {
-      const businessCycleStartRange =
-        this.businessCycleRange?.start_date.split('-');
-      const businessCycleEndRange =
-        this.businessCycleRange?.end_date.split('-');
-      this.startOfRange.startMonth = businessCycleStartRange[1];
-      this.startOfRange.startYear = businessCycleStartRange[2];
-      this.endOfRange.endMonth = businessCycleEndRange[1];
-      this.endOfRange.endYear = businessCycleEndRange[2];
-      this.selectedFilterType = this.selectedData.type;
-    }
-    if (this.selectedData.type === 1) {
-      this.selectedFilter = [
-        this.monthList[this.selectedData.selectedId[0] - 1],
-      ];
-      this.placeholderText = 'Monthly';
-    }
-    if (this.selectedData.type === 2) {
-      this.selectedFilter = [
-        this.quarterlyArray[this.selectedData.selectedId[0] - 1],
-      ];
-      this.placeholderText = 'Quarterly';
-    }
-    for (const propName in changes) {
-      if (changes.hasOwnProperty(propName)) {
-        if (propName === 'businessCycleRange') {
-          this.isApplied = true;
-          this.onFilterAppliedOrReset(
-            changes[propName]?.previousValue === undefined
-          );
-        }
-      }
-    }
-  }
-
-  clickTime() {
-    this.showTime = !this.showTime;
-  }
-
-  hideTime() {
-    this.showTime = false;
-  }
-
-  clickMonth() {
-    this.showMonth = !this.showMonth;
-  }
-
-  hideMonth() {
-    this.showMonth = false;
-  }
-
-  openMonth() {
-    this.showMonthPopup = !this.showMonthPopup;
-  }
-
-  hideMonthPopup() {
-    this.showMonthPopup = false;
-  }
-
-  clickQuarter() {
-    this.showQuarter = !this.showQuarter;
-  }
-
-  hideQuarter() {
-    this.showQuarter = false;
-  }
-
-  clickBusCycle() {
-    this.showBusCycle = !this.showBusCycle;
-  }
-
-  hideBusCycle() {
-    this.showBusCycle = false;
-  }
-
-  //#region Time filter
-
-  onTimeFilter(event: any) {
-    this.isApplyDisabled = true;
-    this.selectedFilterType = parseInt(event.target.value);
-    this.placeholderText = this.timeFilterType[this.selectedFilterType - 1];
-    this.selectedFilter = [];
-    this.showTime = false;
-    this.isReset = false;
-    this.applyButtonName = 'Apply';
-    this.selectedData.type = this.selectedFilterType;
-  }
-
-  onTimeFilterSelect(event: any, index: any) {
-    const targetData = event?.target;
-    this.selectedFilter = [targetData?.value];
-    this.isApplyDisabled = false;
-    this.selectedType.type = 1; // 1 for monthly
-    this.selectedType.startDate = this.getMonthlyStartDate(index).startDate;
-    this.selectedType.endDate = this.getMonthlyStartDate(index).endDate;
-    this.selectedType.selectedId = [index];
-    this.selectedType.time_filter_type = 'monthly';
-    this.selectedData.type = 1;
-    this.applyButtonName = 'Apply';
-    this.showMonth = false;
-  }
-
-  removeSelectedData(index: any) {
-    this.selectedFilter.splice(index, 1);
-    this.applyButtonName = 'Apply';
-    this.isApplyDisabled = false;
-    this.isApplyDisabled = this.isReset ? false : true;
-  }
-
-  selectQuarterly(event: any, index: any) {
-    this.selectedFilter = [event.target.value];
-    this.selectedType.type = 2; // quarterly
-    this.isApplyDisabled = false;
-    this.selectedType.startDate = this.getQuarterlyMonthRange(index).startDate;
-    this.selectedType.endDate = this.getQuarterlyMonthRange(index).endDate;
-    this.selectedType.selectedId = [index];
-    this.selectedType.time_filter_type = 'quarterly';
-    this.showQuarter = false;
-    this.selectedData.type = 2;
-    this.applyButtonName = 'Apply';
-  }
-
-  getMonthlyStartDate(index: any) {
-    if (index < this.startOfRange.startMonth) {
-      return {
-        startDate: `01-${index}-${this.endOfRange?.endYear}`,
-        endDate: `${new Date(
-          this.endOfRange?.endYear,
-          index,
-          0
-        ).getDate()}-${index}-${this.endOfRange?.endYear}`,
-      };
-    } else {
-      // return `01-${index}-${this.startOfRange?.startYear}`
-      return {
-        startDate: `01-${index}-${this.startOfRange?.startYear}`,
-        endDate: `${new Date(
-          this.startOfRange?.startYear,
-          index,
-          0
-        ).getDate()}-${index}-${this.startOfRange?.startYear}`,
-      };
-    }
-  }
-
-  getQuarterlyMonthRange(index: any) {
-    const monthSelected = index * 3 + 1;
-    if (monthSelected < this.startOfRange.startMonth) {
-      return {
-        startDate: `01-${monthSelected}-${this.endOfRange?.endYear}`,
-        endDate: `${new Date(
-          this.endOfRange?.endYear,
-          monthSelected + 2,
-          0
-        ).getDate()}-${monthSelected + 2}-${this.endOfRange?.endYear}`,
-      };
-    }
-    return {
-      startDate: `01-${monthSelected}-${this.startOfRange?.startYear}`,
-      endDate: `${new Date(
-        this.startOfRange?.startYear,
-        monthSelected + 2,
-        0
-      ).getDate()}-${monthSelected + 2}-${this.startOfRange?.startYear}`,
-    };
-  }
-
-  onFilterAppliedOrReset(isFirstTime?: any) {
-    if (
-      (this.applyButtonName == 'Reset' || this.selectedFilter.length == 0) &&
-      !isFirstTime
-    ) {
-      const preSavedCycle = JSON.parse(
-        localStorage.getItem('businessCycle') ?? '{}'
-      )?.selectedCycle;
-      localStorage.removeItem('timefilter');
-      this.isApplied = false;
-      this.selectedFilterType = 0;
-      this.placeholderText = 'Select a time period';
-      this.selectedFilter = [];
-      this.applyButtonName = 'Apply';
-      this.isReset = false;
-      this.selectedData.type = 0;
-      this.selectedData.selectedId = [];
-      this.selectedType = {
-        type: 0,
-        startDate: preSavedCycle?.start_date,
-        endDate: preSavedCycle?.end_date,
-        time_filter_type: '',
-      };
-    } else if (!isFirstTime) {
-      this.applyButtonName = 'Reset';
-      this.isReset = true;
-      localStorage.setItem('timefilter', JSON.stringify(this.selectedType));
-      this.isApplied = false;
-    }
-  }
-
-  removeQuarterly() {
-    this.selectedFilter = [];
-    this.applyButtonName = 'Apply';
-    this.isApplyDisabled = this.isReset ? false : true;
-  }
-}

package/src/lib/ui-kit/time-filter/time-filter.module.ts

@@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { TimeFilterComponent } from './time-filter.component';
-
-@NgModule({
-  declarations: [TimeFilterComponent],
-  imports: [CommonModule],
-  exports: [TimeFilterComponent],
-})
-export class TimeFilterModule {}

package/src/lib/ui-kit/tooltip/tooltip.directive.ts

@@ -1,150 +0,0 @@
-import {
-  Directive,
-  Input,
-  ElementRef,
-  HostListener,
-  Renderer2,
-  OnInit,
-  AfterViewInit,
-  ViewChild,
-  OnDestroy,
-} from '@angular/core';
-
-@Directive({
-  selector: '[arTooltip]',
-})
-export class ToolTipDirective implements OnInit, OnDestroy {
-  @Input('arTooltip') tooltipTitle!: string;
-  @Input() placement!: string;
-  @Input() type: any;
-  @Input() tooltipMandatory!: boolean;
-  @Input() showTooltip = true;
-  @Input() animate!: boolean;
-  tooltip!: HTMLElement;
-  offset = 8;
-
-  constructor(private el: ElementRef, private renderer: Renderer2) {}
-  ngOnInit() {}
-  @HostListener('mouseenter') onMouseEnter() {
-    this.hide();
-    this.show();
-  }
-  @HostListener('mouseover') onMouseOver() {
-    this.hide();
-    this.show();
-  }
-
-  @HostListener('mouseleave') onMouseLeave() {
-    this.hide();
-  }
-  @HostListener('mouseout') onMouseOut() {
-    this.hide();
-  }
-  @HostListener('click') onClick() {
-    this.hide();
-  }
-  ngOnDestroy() {
-    this.hide();
-  }
-  show() {
-    if (!this.showTooltip) {
-      return;
-    }
-    this.create();
-    const element = this.el.nativeElement;
-    if (this.tooltipMandatory === true) {
-      this.setPosition();
-      this.renderer.addClass(this.tooltip, 'ng-tooltip-show');
-    } else {
-      if (
-        element.scrollWidth * element.scrollHeight >
-        element.offsetWidth * element.offsetHeight
-      ) {
-        this.setPosition();
-        this.renderer.addClass(this.tooltip, 'ng-tooltip-show');
-      }
-    }
-  }
-
-  hide() {
-    if (document.body.contains(this.tooltip)) {
-      if (this.renderer) {
-        this.renderer.removeChild(
-          document.body,
-          document.getElementById('tooltip')
-        );
-      }
-    }
-  }
-
-  create() {
-    this.tooltip = this.renderer.createElement('span');
-    this.tooltip.setAttribute('id', 'tooltip');
-    this.tooltip.innerHTML = this.tooltipTitle;
-    this.renderer.appendChild(document.body, this.tooltip);
-    this.renderer.addClass(this.tooltip, 'ng-tooltip');
-    this.renderer.addClass(this.tooltip, `ng-tooltip-${this.placement}`);
-    this.renderer.addClass(this.tooltip, `${this.type}`);
-    if (this.animate) {
-      this.renderer.addClass(this.tooltip, `animate-${this.placement}`);
-    }
-  }
-
-  setPosition() {
-    const hostPos = this.el.nativeElement.getBoundingClientRect();
-    const tooltipPos = this.tooltip.getBoundingClientRect();
-    const scrollPos =
-      window.pageYOffset ||
-      document.documentElement.scrollTop ||
-      document.body.scrollTop ||
-      0;
-    const w = window.innerWidth;
-    const h = window.innerHeight;
-    let top;
-    let left;
-    if (this.placement === 'top') {
-      top = hostPos.top - tooltipPos.height - this.offset;
-      left = hostPos.left + (hostPos.width - tooltipPos.width) / 2;
-    }
-
-    if (this.placement === 'bottom') {
-      if (hostPos.top + tooltipPos.height > h) {
-        top = hostPos.top - tooltipPos.height;
-        left = hostPos.left + (hostPos.width - tooltipPos.width) / 2;
-        this.renderer.removeClass(this.tooltip, `ng-tooltip-bottom`);
-        this.renderer.addClass(this.tooltip, `ng-tooltip-top`);
-      } else {
-        top = hostPos.bottom + this.offset;
-        left = hostPos.left + (hostPos.width - tooltipPos.width) / 2;
-      }
-    }
-
-    if (this.placement === 'left') {
-      top = hostPos.top + (hostPos.height - tooltipPos.height) / 2;
-      left = hostPos.left - tooltipPos.width - this.offset;
-    }
-
-    if (this.placement === 'right') {
-      top = hostPos.top + (hostPos.height - tooltipPos.height) / 2;
-      left = hostPos.right + this.offset;
-    }
-    if (this.placement === 'bottom-right') {
-      top = hostPos.bottom + this.offset;
-      left = hostPos.left - (tooltipPos.width - 28);
-    }
-    if (this.placement === 'bottom-left') {
-      if (hostPos.top + tooltipPos.height > h - 30) {
-        top = hostPos.top - tooltipPos.height;
-        console.log('bottom left', hostPos.top - tooltipPos.height);
-        left = hostPos.left;
-        this.renderer.removeClass(this.tooltip, `ng-tooltip-bottom-left`);
-        this.renderer.addClass(this.tooltip, `ng-tooltip-top-left`);
-      } else {
-        top = hostPos.bottom + this.offset;
-        left = hostPos.left;
-      }
-    }
-    this.renderer.setStyle(this.tooltip, 'top', `${top + scrollPos}px`);
-    this.renderer.setStyle(this.tooltip, 'left', `${left}px`);
-  }
-}

package/src/lib/ui-kit/tooltip/tooltip.module.ts

@@ -1,10 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule } from '@angular/common';
-import { ToolTipDirective } from './tooltip.directive';
-
-@NgModule({
-  declarations: [ToolTipDirective],
-  imports: [CommonModule],
-  exports: [ToolTipDirective],
-})
-export class TooltipModule {}

package/src/lib/ui-kit/v-loader/loader/loader.component.html

@@ -1,6 +0,0 @@
-<div class="main-loader">
-  <img [ngSrc]="vLoader" alt="" width="45" height="45" />
-  <div class="loader-index">
-    <div class="loader-index-circle"></div>
-  </div>
-</div>

package/src/lib/ui-kit/v-loader/loader/loader.component.less

@@ -1,52 +0,0 @@
-.main-loader {
-  display: flex;
-  overflow: hidden;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  position: fixed;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  background: transparent;
-  z-index: 9;
-    
-  img {
-    width: 45px;
-    position: relative;
-    z-index: 2;
-  }
-
-  .loader-index {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-
-  .loader-index-circle {
-    background: #fff;
-    border-radius: 50%;
-    width: 65px;
-    height: 65px;
-    border-radius: 50%;
-    border: 4px solid transparent;
-    border-top-color: #dbdbdb;
-    -webkit-animation: 1.5s spin infinite linear;
-    animation: 1.5s spin infinite linear;
-  }
-}
-
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}

package/src/lib/ui-kit/v-loader/loader/loader.component.ts

@@ -1,22 +0,0 @@
-import { Component, OnInit, Optional } from '@angular/core';
-import { Configurations } from '../../../configurations';
-
-@Component({
-  selector: 'app-loader',
-  templateUrl: './loader.component.html',
-  styleUrls: ['./loader.component.less'],
-})
-export class LoaderComponent implements OnInit {
-  vLoader: any;
-  
-  public env!: any;
-
-  constructor(@Optional() config?: Configurations) {
-    if (config) {
-      this.env = config.envConfig;
-    }
-    this.vLoader = this.env.vLoader;
-  }
-
-  ngOnInit(): void {}
-}

package/src/lib/ui-kit/v-loader/loader-inline/loader-inline.component.html

@@ -1,6 +0,0 @@
-<div class="inline-loader">
-  <img [ngSrc]="vLoader" alt="" width="45" height="45" />
-  <div class="loader-index">
-    <div class="loader-index-circle"></div>
-  </div>
-</div>

package/src/lib/ui-kit/v-loader/loader-inline/loader-inline.component.less

@@ -1,52 +0,0 @@
-.inline-loader {
-  display: flex;
-  overflow: hidden;
-  align-items: center;
-  justify-content: center;
-  text-align: center;
-  position: absolute;
-  top: 0;
-  right: 0;
-  bottom: 0;
-  left: 0;
-  background: transparent;
-  z-index: 9;
-    
-  img {
-    width: 45px;
-    position: relative;
-    z-index: 2;
-  }
-
-  .loader-index {
-    width: 100%;
-    height: 100%;
-    position: absolute;
-    top: 0;
-    right: 0;
-    bottom: 0;
-    left: 0;
-    z-index: 1;
-    display: flex;
-    align-items: center;
-    justify-content: center;
-  }
-
-  .loader-index-circle {
-    background: #fff;
-    border-radius: 50%;
-    width: 65px;
-    height: 65px;
-    border-radius: 50%;
-    border: 4px solid transparent;
-    border-top-color: #dbdbdb;
-    -webkit-animation: 1.5s spin infinite linear;
-    animation: 1.5s spin infinite linear;
-  }
-}
-
-@keyframes spin {
-  to {
-    transform: rotate(360deg);
-  }
-}

package/src/lib/ui-kit/v-loader/loader-inline/loader-inline.component.ts

@@ -1,22 +0,0 @@
-import { Component, OnInit, Optional } from '@angular/core';
-import { Configurations } from '../../../configurations';
-
-@Component({
-  selector: 'app-loader-inline',
-  templateUrl: './loader-inline.component.html',
-  styleUrls: ['./loader-inline.component.less'],
-})
-export class LoaderInlineComponent implements OnInit {
-  vLoader: any;
-  
-  public env!: any;
-
-  constructor(@Optional() config?: Configurations) {
-    if (config) {
-      this.env = config.envConfig;
-    }
-    this.vLoader = this.env.vLoader;
-  }
-
-  ngOnInit(): void {}
-}

package/src/lib/ui-kit/v-loader/v-loader.module.ts

@@ -1,11 +0,0 @@
-import { NgModule } from '@angular/core';
-import { CommonModule, NgOptimizedImage } from '@angular/common';
-import { LoaderComponent } from './loader/loader.component';
-import { LoaderInlineComponent } from './loader-inline/loader-inline.component';
-
-@NgModule({
-  declarations: [LoaderComponent, LoaderInlineComponent],
-  imports: [CommonModule,NgOptimizedImage],
-  exports: [LoaderComponent, LoaderInlineComponent],
-})
-export class VLoaderModule {}

package/src/public-api.ts

@@ -1,11 +0,0 @@
-/*
- * Public API Surface of create-dashboard
- */
-
-// export * from './lib/create-dashboard.service';
-// export * from './lib/create-dashboard.component';
-// export * from './lib/create-dashboard.module';
-
-export * from './lib/create-dashboard.service';
-export * from './lib/create-dashboard-container/create-dashboard.component';
-export * from './lib/create-dashboard-container/create-dashboard.module';

package/src/test.ts

@@ -1,28 +0,0 @@
-// This file is required by karma.conf.js and loads recursively all the .spec and framework files
-
-import 'zone.js';
-import 'zone.js/testing';
-import { getTestBed } from '@angular/core/testing';
-import {
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting
-} from '@angular/platform-browser-dynamic/testing';
-
-declare const require: {
-  context(path: string, deep?: boolean, filter?: RegExp): {
-    keys(): string[];
-    <T>(id: string): T;
-  };
-};
-
-// First, initialize the Angular testing environment.
-getTestBed().initTestEnvironment(
-  BrowserDynamicTestingModule,
-  platformBrowserDynamicTesting(), {
-    teardown: { destroyAfterEach: false }
-}
-);
-// Then we find all the tests.
-const context = require.context('./', true, /\.spec\.ts$/);
-// And load the modules.
-context.keys().map(context);

package/tsconfig.lib.json

@@ -1,20 +0,0 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
-{
-  "extends": "../../tsconfig.json",
-  "compilerOptions": {
-    "outDir": "../../out-tsc/lib",
-    "target": "es2020",
-    "declaration": true,
-    "declarationMap": true,
-    "inlineSources": true,
-    "types": [],
-    "lib": [
-      "dom",
-      "es2018"
-    ]
-  },
-  "exclude": [
-    "src/test.ts",
-    "**/*.spec.ts"
-  ]
-}