@bizdoc/core 1.14.9 → 1.14.12

package/src/lib/reports/cube/usage-chart.component.ts

@@ -1,386 +0,0 @@
-import { Component, ElementRef, OnDestroy } from "@angular/core";
-import { Directionality } from "@angular/cdk/bidi";
-import { getCurrencySymbol, getLocaleNumberFormat, NumberFormatStyle } from "@angular/common";
-import { Observable, forkJoin } from "rxjs";
-import { tap, takeUntil, map } from "rxjs/operators";
-import { DisplayOptionModel, PivotView } from "@syncfusion/ej2-angular-pivotview";
-import { DataSourceSettingsModel, SortModel, FieldOptionsModel, FormatSettingsModel } from "@syncfusion/ej2-pivotview/src/pivotview/model/datasourcesettings-model";
-import { ChartSettingsModel } from '@syncfusion/ej2-pivotview/src/pivotview/model/chartsettings-model';
-import { Chart, IPointEventArgs } from "@syncfusion/ej2-angular-charts";
-import { Workbook } from '@syncfusion/ej2-excel-export';
-import { Worksheet } from '@syncfusion/ej2-excel-export/src/worksheet';
-import { Row } from '@syncfusion/ej2-excel-export/src/row';
-import { Column } from '@syncfusion/ej2-excel-export/src/column';
-import { Item, Options, UsageReportBase } from "./usage-base";
-import { DatasourceService } from "../../core/datasource.service";
-import { SessionService } from "../../core/session.service";
-import { CubeService } from "../../cube/cube.service";
-import { PromptService } from "../../core/prompt.service";
-import { TranslateService } from "../../core/translate.service";
-import { ReportRef } from "../report-ref";
-import { MaterialMode } from "../../core/functions";
-import { FONT_FAMILY } from "../../core/colors";
-import { RouterImpl } from "../../core/router";
-
-/**
- * cube usage
- * */
-@Component({
-  template: '',
-  host: {
-    '[id]': 'id',
-    '[dir]': 'dir'
-  }
-})
-export
-  class UsageChartComponent extends UsageReportBase implements OnDestroy {
-  readonly dir = this._session.direction;
-  pivot: PivotView;
-  dataSourceSettings: DataSourceSettingsModel;
-  readonly displayOption: DisplayOptionModel = {
-    view: 'Chart'
-  };
-  chartSettings: ChartSettingsModel;
-  // ctor
-  constructor(reportRef: ReportRef<Options>, type: DatasourceService, service: CubeService, session: SessionService,
-    router: RouterImpl,
-    sb: PromptService,
-    private _elementRef: ElementRef,
-    dir: Directionality,
-    translate: TranslateService) {
-    super(reportRef, type, service, session, router,
-      sb, dir, translate);
-    this._session.themeChange.pipe(takeUntil(this._destroy)).subscribe(t => {
-      this.chartSettings.theme = t.dark ? 'MaterialDark' : 'Material';
-      this.chartSettings.palettes = this._palettes();
-      this._draw();
-    });
-    this._defaults();
-  }
-  /** set defaults */
-  private _defaults() {
-    const { chartType } = this._reportRef.options;
-    const isLine = chartType === 'Line' || chartType === 'Spline';
-    this.chartSettings = {
-      pointClick: this.pointClick.bind(this),
-      zoomSettings: {
-        toolbarItems: [],
-        mode: 'XY',
-        enableMouseWheelZooming: true,
-        enablePinchZooming: true,
-        enableSelectionZooming: false
-      },
-      crosshair: {
-        enable: isLine,
-        line: {
-          width: 1
-        }
-      },
-      chartSeries: {
-        palettes: this._palettes(),
-        type: chartType || 'Column',
-        //width: 2,
-        border: { width: 0 },
-        marker: { height: 10, width: 10, shape: 'Pentagon', visible: isLine },
-      },
-      enableExport: true,
-      chartArea: {
-        border: { width: 0 }
-      },
-      theme: this._session.theme.dark ? 'MaterialDark' : 'Material',
-      background: 'transparent',
-      primaryXAxis: {
-        titleStyle: {
-          fontFamily: FONT_FAMILY
-        },
-        labelStyle: {
-          fontFamily: FONT_FAMILY
-        }
-      },
-      border: { width: 0 },
-      legendSettings: {
-        textStyle: {
-          fontFamily: FONT_FAMILY
-        },
-        isInversed: this._session.inverse
-      },
-      tooltip: {
-        textStyle: {
-          fontFamily: FONT_FAMILY
-        }
-      },
-      titleStyle: {
-        fontFamily: FONT_FAMILY
-      },
-      subTitleStyle: {
-        fontFamily: FONT_FAMILY
-      },
-      primaryYAxis: {
-        titleStyle: {
-          fontFamily: FONT_FAMILY
-        },
-        labelStyle: {
-          fontFamily: FONT_FAMILY
-        },
-        crosshairTooltip: {
-          enable: true,
-          textStyle: {
-            fontFamily: FONT_FAMILY
-          }
-        }
-      }
-    };
-    const formatSettings: FormatSettingsModel[] = [{
-      name: 'value', format: this.currencyCode ? 'C' : 'N',
-      maximumFractionDigits: this._fractionDigits,
-      //minimumFractionDigits: this._fractionDigits,
-      currency: this.currencyCode
-    }];
-    const rows = this._series.map(a => {
-      return {
-        name: a.name,
-        caption: a.title
-      } as FieldOptionsModel;
-    });
-    this.dataSourceSettings = {
-      columns: [{
-        name: 'type'
-      }],
-      rows,
-      values: [
-        {
-          name: 'value',
-          caption: this._translate.get('Value')
-        }
-      ],
-      enableSorting: false,
-      sortSettings: this._series.map(s => { return { name: `_${s.name}` } as SortModel }),
-      expandAll: this._expandAll,
-      formatSettings,
-      dataSource: []
-    };
-  }
-  private _palettes(): string[] {
-    return [this._session.getAccent()].
-      concat(this._indices.map((_, i) =>
-        this._session.getPrimery(300 + 300 * i as MaterialMode)));
-  }
-
-  dataBound(args: any): void {
-    this.pivot.chart.pointClick = this.pointClick.bind(this);
-  }
-  /**
-   * 
-   * @param result
-   */
-  onData(result: Item[]) {
-    this._data = result;
-    this._decorate(result).subscribe(r => {
-      this.dataSourceSettings.dataSource = r as any;
-      this._draw();
-    }, () => this._sb.error());
-  }
-  private _draw() {
-    this.pivot && this.pivot.destroy();
-    this.pivot = new PivotView({
-      width: '100%',
-      height: '100%',
-      enableRtl: this.enableRtl,
-      dataBound: this.dataBound.bind(this),
-      chartSettings: this.chartSettings,
-      displayOption: this.displayOption,
-      dataSourceSettings: this.dataSourceSettings,
-      spinnerTemplate: '',
-      allowConditionalFormatting: true,
-      currencyCode: this.currencyCode,
-    }, this._elementRef.nativeElement);
-  }
-  onResize() {
-    if (this.pivot && this.pivot.chart) {
-      //this.pivot.chart.height = this.height;
-      //this.pivot.chart.width = this.width;
-      (this.pivot.chart as Chart).chartResize();
-    }
-  }
-  onExport(title: string) {
-    const numberFormat = this._cube.currencyCode ?
-      getCurrencySymbol(this._cube.currencyCode, 'narrow') +
-      getLocaleNumberFormat(this._session.language, NumberFormatStyle.Currency)
-      : getLocaleNumberFormat(this._session.language, NumberFormatStyle.Decimal),
-      columns = this._cube.axes.filter(a => this._options.series.indexOf(a.name) > -1),
-      rows = [{
-        index: 1,
-        cells: columns.map((c, i) => ({
-          index: i + 1, value: c.title,
-          style: {
-            bold: true
-          }
-        }))
-      }] as Row[];
-    rows[0].cells.push({
-      index: columns.length + 1,
-      value: this._cube.yAxis ? this._cube.yAxis.title :
-        this._translate.get('Value'),
-      style: {
-        bold: true
-      }
-    });
-    this._indices && this._indices.forEach((x, i) =>
-      rows[0].cells.push({
-        index: columns.length + i + 2,
-        value: x.title,
-        style: {
-          bold: true
-        }
-      }));
-    this._data.forEach((r, i) => {
-      const cells = columns.map((c, j) => {
-        return {
-          index: j + 1, value: r[c.name],
-          style: {
-          }
-        } as Cell;
-      }
-      );
-      cells.push({
-        type: 'number',
-        index: columns.length + 1,
-        style: {
-          numberFormat,
-          hAlign: 'right'
-        },
-        value: r['value']
-      });
-      this._indices && this._indices.forEach((x, i) =>
-        cells.push({
-          type: 'number',
-          index: columns.length + i + 2,
-          style: {
-            numberFormat,
-            hAlign: 'right'
-          },
-          value: r[x.name]
-        })
-      );
-      rows.push(
-        {
-          index: i + 2,
-          cells
-        } as Row)
-    });
-
-    const book = new Workbook(
-      {
-        worksheets: [
-          {
-            enableRtl: this._session.inverse,
-            name: this._translate.get('SheetN', 1),
-            columns: [...columns.map((_, i) => ({ index: i + 1, width: 250 } as Column))
-              , { index: columns.length + 1 },
-            ...(this._indices ? this._indices.map((_, i) => ({
-              index: columns.length + i + 2
-            })) : [])
-            ],
-            rows
-          } as Worksheet
-        ],
-      },
-      'xlsx'
-    );
-    book.save(`${title}.xlsx`);
-  }
-  /**
-   * adds data source description to item keys, and normalizes indices.
-   * @param result
-   */
-  private _decorate(result: Item[]): Observable<{}[]> {
-    return new Observable(observe => {
-      const observables: Observable<any>[] = [];
-      result.forEach(row => {
-        this._series.forEach(a => {
-          const val = row[a.name] as string;
-          const observable = this._type.get(a.dataType, val).
-            pipe(tap((v: string) => {
-              row[`_${a.name}`] = val;
-              row[a.name] = v || val;
-            }));
-          observables.push(observable);
-        });
-      });
-      if (observables.length)
-        forkJoin(observables).pipe(map(() => {
-          const data: {}[] = [];
-          result.forEach(baseRow => {
-            const value = baseRow.usage;
-            if (value !== undefined && value !== 0) {
-              const row = {
-                type: this._yTitle,
-                value
-              };
-              this._series.forEach(a => {
-                row[`_${a.name}`] = baseRow[`_${a.name}`];
-                row[a.name] = baseRow[a.name];
-              });
-              data.push(row);
-            }
-            this._indices.forEach(i => {
-              const value = baseRow[i.name];
-              if (value !== undefined && value !== 0) {
-                const row = { type: i.title, value };
-                this._series.forEach(a => {
-                  row[`_${a.name}`] = baseRow[`_${a.name}`];
-                  row[a.name] = baseRow[a.name];
-                });
-                data.push(row);
-              }
-            });
-          });
-          return data;
-        })).
-          subscribe(r =>
-            observe.next(r), e => observe.error(e));
-      else
-        observe.next([]);
-    });
-  }
-  /**
-   * 
-   * @param e
-   */
-  pointClick(e: IPointEventArgs) {
-    const { point: { x, yValue }, series: { name: title } } = e;
-    if (yValue === 0) {
-      e.cancel = true;
-      return;
-    }
-    const axes: { [axis: string]: any; } = this._axes(x as string);
-    super.browse(axes, title === this._yTitle ? null : this._indexName(title));
-  }
-  /**
-   * reverse engineering axes from series label
-   * @param label
-   */
-  private _axes(label: string) {
-    const axes: { [axis: string]: (string | number); } = {};
-    label.split(' - ').forEach((x, i) => {
-      const column = this.dataSourceSettings.rows[i].name,
-        element = this._data.find(e => e[column] === x);
-      axes[column] = element ? element[`_${column}`] : x;
-    });
-    return axes;
-  }
-
-  /**
-   * reverse engineering index name from title
-   * @param title
-   */
-  private _indexName(title: string): string {
-    const index = this._indices.find(i => i.title === title);
-    return index.name;
-  }
-  ngOnDestroy() {
-    this.pivot && this.pivot.destroy();
-    super.ngOnDestroy();
-  }
-}
-interface Cell { }

package/src/lib/reports/cube/usage-pivot.component.html

@@ -1,19 +0,0 @@
-<!--<ejs-pivotview [height]=height
-               [width]=width
-               [id]=id
-               [dataSourceSettings]=dataSourceSettings
-               spinnerTemplate=""
-               [allowConditionalFormatting]=true
-               [allowNumberFormatting]=true
-               [showGroupingBar]=true
-               [allowExcelExport]=true
-               [allowCalculatedField]=true
-               [gridSettings]=gridSettings
-               [hyperlinkSettings]=hyperlinkSettings
-               (cellClick)=cellClick($event)
-               [enableValueSorting]=true
-               [groupingBarSettings]=groupingBarSettings
-               [showTooltip]=false
-               [currencyCode]=currencyCode
-               (enginePopulated)='enginePopulated()'
-               [enableRtl]=enableRtl></ejs-pivotview>-->

package/src/lib/reports/cube/usage-pivot.component.ts

@@ -1,266 +0,0 @@
-import { Component, ElementRef, ViewChild } from "@angular/core";
-import { Directionality } from "@angular/cdk/bidi";
-import { Observable, forkJoin, of } from "rxjs";
-import { tap, takeUntil } from "rxjs/operators";
-import { PivotViewComponent } from "@syncfusion/ej2-angular-pivotview";
-import { PivotView, GroupingBarSettingsModel, HyperCellClickEventArgs, ConditionalSettingsModel, HyperlinkSettingsModel } from "@syncfusion/ej2-angular-pivotview";
-import { ExcelQueryCellInfoEventArgs } from "@syncfusion/ej2-grids";
-import { ConditionalFormatSettingsModel } from "@syncfusion/ej2-pivotview/src/pivotview/model/datasourcesettings-model";
-import { DataSourceSettingsModel, FieldOptionsModel, FormatSettingsModel } from "@syncfusion/ej2-pivotview/src/pivotview/model/datasourcesettings-model";
-import { GridSettingsModel } from "@syncfusion/ej2-pivotview/src/pivotview/model/gridsettings-model";
-import { Internationalization } from "@syncfusion/ej2-base";
-import { Tooltip } from '@syncfusion/ej2-popups';
-import { CubeAxis } from "../../core/models";
-import { getWarn, isArray } from "../../core/functions";
-import { SessionService } from "../../core/session.service";
-import { TranslateService } from "../../core/translate.service";
-import { DatasourceService } from "../../core/datasource.service";
-import { CubeService } from "../../cube/cube.service";
-import { PromptService } from "../../core/prompt.service";
-import { RouterImpl } from "../../core/router";
-import { Item, Options, UsageReportBase } from "./usage-base";
-import { ReportRef } from "../report-ref";
-
-const PIVOT_HEADER_DELIMITER = '|';
-/**
- * cube usage
- * */
-@Component({
-  template: '',
-  //templateUrl: 'usage-pivot.component.html',
-  host: { '[id]': 'id' }
-})
-export
-  class UsagePivotComponent extends UsageReportBase {
-  @ViewChild(PivotViewComponent) pivot: PivotView;
-  private _emptyCellsTextContent: string;
-  private _xAxis: CubeAxis[];
-  dataSourceSettings: DataSourceSettingsModel;
-  hyperlinkSettings: HyperlinkSettingsModel;
-  tooltip: Tooltip;
-  readonly gridSettings: GridSettingsModel = {
-    rowHeight: 36
-  };
-  readonly conditionalFormatSettings: ConditionalFormatSettingsModel[] = [{
-    conditions: 'LessThan',
-    value1: 0,
-    measure: 'value',
-    applyGrandTotals: true,
-    style: {
-      color: getWarn()
-    }
-  }];
-  readonly groupingBarSettings: GroupingBarSettingsModel = {
-    showRemoveIcon: false,
-    showFilterIcon: false,
-    showValueTypeIcon: false
-  };
-  private readonly _intl: Internationalization = new Internationalization();
-  // ctor
-  constructor(reportRef: ReportRef<Options>,
-    type: DatasourceService,
-    private _elementRef: ElementRef,
-    service: CubeService, session: SessionService,
-    router: RouterImpl,
-    sb: PromptService,
-    dir: Directionality,
-    translate: TranslateService) {
-    super(reportRef, type, service, session, router, sb, dir, translate);
-    this._session.themeChange.pipe(takeUntil(this._destroy)).subscribe(() => {
-      this.conditionalFormatSettings[0].style.color = getWarn();
-      this.pivot.refresh();
-    });
-    this._defaults();
-  }
-  /** set defaults */
-  private _defaults() {
-    const { xAxis } = this._options;
-    this._xAxis = xAxis ? this._cube.axes.filter(a => isArray(xAxis) ? xAxis.indexOf(a.name) > -1 : a.name === xAxis) : this._cube.axes.filter(a => !a.hidden).slice(0, 2);
-    this._emptyCellsTextContent = this._intl.formatNumber(0, {
-      format: this.currencyCode ? 'C' : 'N',
-      currency: this.currencyCode,
-      maximumFractionDigits: this._fractionDigits
-    });
-    const formatSettings: FormatSettingsModel[] = [{
-      name: 'usage',
-      format: this.currencyCode ? 'C' : 'N',
-      maximumFractionDigits: this._fractionDigits
-    }];
-    const values: FieldOptionsModel[] = [
-      {
-        name: 'usage',
-        caption: this._yTitle,
-        showNoDataItems: true
-      }
-    ];
-    const conditionalSettings: ConditionalSettingsModel[] = [{
-      conditions: 'NotEquals',
-      value1: 0,
-      measure: 'usage'
-    }];
-    this._indices &&
-      this._indices.forEach(i => {
-        values.push({
-          name: i.name,
-          caption: i.title,
-          showNoDataItems: true
-        });
-        conditionalSettings.push({
-          conditions: 'NotEquals',
-          value1: 0,
-          measure: i.name
-        });
-        formatSettings.push({
-          name: i.name,
-          format: this.currencyCode ? 'C' : 'N',
-          maximumFractionDigits: this._fractionDigits
-        });
-      });
-    this.hyperlinkSettings = {
-      conditionalSettings: conditionalSettings
-    }
-    const columns = this._xAxis.map(a => {
-      return {
-        name: a.name,
-        caption: a.title,
-        showNoDataItems: true
-      } as FieldOptionsModel;
-    });
-    const rows = this._series.map(a => {
-      return {
-        name: a.name,
-        caption: a.title,
-        showNoDataItems: true
-      } as FieldOptionsModel;
-    });
-    this.dataSourceSettings = {
-      columns,
-      rows,
-      values,
-      conditionalFormatSettings: this.conditionalFormatSettings,
-      emptyCellsTextContent: this._emptyCellsTextContent,
-      expandAll: this._expandAll,
-      showColumnGrandTotals: true,
-      alwaysShowValueHeader: false,
-      formatSettings,
-      dataSource: [],
-      valueSortSettings: { headerDelimiter: PIVOT_HEADER_DELIMITER },
-      enableSorting: false
-    };
-  }
-  /**
-   * 
-   * @param result
-   */
-  onData(result: Item[]) {
-    this._decorate(result).subscribe(() => {
-      this._data = this.dataSourceSettings.dataSource = result as any;
-      this._draw();
-    }, () => this._sb.error());
-  }
-  enginePopulated() {
-    this.pivot.grid.excelQueryCellInfo = this.excelQueryCellInfo.bind(this);
-  }
-  excelQueryCellInfo(evt: ExcelQueryCellInfoEventArgs) {
-    if (evt.value === this._emptyCellsTextContent) evt.value = 0;
-  }
-  onResize() {
-    if (this.pivot) {
-      this.pivot.width = this.width;
-      this.pivot.onWindowResize();
-    }
-  }
-  onExport(name: string) {
-    this.pivot.excelExport({
-      fileName: `${name}.xlsx`
-    });
-  }
-
-  /**
-   * adds data source description to item keys.
-   * @param result
-   */
-  private _decorate(result: Item[]): Observable<any> {
-    const observables: Observable<any>[] = [];
-    result.forEach(row => {
-      this._xAxis.concat(this._series).forEach(a => {
-        const axis = row[a.name] as string;
-        row[`_${a.name}`] = axis;
-        const observable = this._type.get(a.dataType, axis).pipe(tap(v => row[a.name] = v || axis));
-        observables.push(observable);
-      });
-    });
-    return observables.length ? forkJoin(observables) : of([]);
-  }
-  private _draw() {
-    this.pivot && this.pivot.destroy();
-    this.pivot = new PivotView({
-      spinnerTemplate: '',
-      dataSourceSettings: this.dataSourceSettings,
-      width: this.width,
-      height: this.height,
-      enableValueSorting: true,
-      enableRtl: this.enableRtl,
-      showTooltip: false,
-      allowConditionalFormatting: true,
-      allowNumberFormatting: true,
-      groupingBarSettings: this.groupingBarSettings,
-      allowCalculatedField: true,
-      showGroupingBar: true,
-      allowExcelExport: true,
-      hyperlinkSettings: this.hyperlinkSettings,
-      gridSettings: this.gridSettings,
-      cellClick: this.cellClick.bind(this),
-      currencyCode: this.currencyCode,
-      dataBound: this.dataBound.bind(this)
-    }, this._elementRef.nativeElement);
-  }
-  dataBound(_) {
-    this.tooltip = new Tooltip({
-      target: '.e-icons',
-      cssClass: 'e-custom-tooltip',
-      position: 'BottomCenter',
-      offsetY: 15,
-      enableRtl: this.pivot.enableRtl,
-      locale: this.pivot.locale,
-    });
-    this.tooltip.appendTo(this._elementRef.nativeElement);
-  }
-  /**
-   * 
-   * @param evt
-   */
-  cellClick(evt: HyperCellClickEventArgs) {
-    const { columnHeaders, rowHeaders, actualText } = evt.data as any;
-    const axes = this._pivotAxes(columnHeaders, rowHeaders);
-    super.browse(axes, actualText === 'usage' ? null : actualText);
-  }
-  /**
-   * reverse engineer axes from headers
-   * @param columnHeaders
-   * @param rowHeaders
-   */
-  private _pivotAxes(columnHeaders: string, rowHeaders: string): { [axis: string]: string; } {
-    const axes: { [axis: string]: string } = {};
-    if (columnHeaders !== '')
-      columnHeaders.split(PIVOT_HEADER_DELIMITER).forEach((c, i) => {
-        const column = this.dataSourceSettings.columns[i].name,
-          // find any row with header
-          element = this._data.find(e => e[column].toString() === c);
-        // translate back to key
-        axes[column] = element ? element[`_${column}`] : c;
-      });
-    if (rowHeaders !== '')
-      rowHeaders.split(PIVOT_HEADER_DELIMITER).forEach((r, i) => {
-        const column = this.dataSourceSettings.rows[i].name,
-          element = this._data.find(e => e[column] === r);
-        axes[column] = element ? element[`_${column}`] : r;
-      });
-    return axes;
-  }
-  ngOnDestroy() {
-    this.tooltip && this.tooltip.destroy();
-    this.pivot && this.pivot.destroy();
-    super.ngOnDestroy();
-  }
-}

package/src/lib/reports/cube/usage.component.ts

@@ -1,34 +0,0 @@
-import { OnInit, ViewContainerRef, Component, Injector } from "@angular/core";
-import { ReportRef } from "../report-ref";
-import { BizDoc } from "../../core/decorators";
-import { UsagePivotComponent } from "./usage-pivot.component";
-import { UsageChartComponent } from "./usage-chart.component";
-import { Args, Item, Options } from "./usage-base";
-import { ReportComponent } from "../../core/base";
-
-
-@Component({
-    template: ''
-})
-@BizDoc({
-    selector: 'bizdoc-cube-usage'
-})
-export
-  class CubeUsageComponent implements ReportComponent<Item, Args>, OnInit {
-  private _instance: ReportComponent<Item, Args>;
-  constructor(
-    private _injector: Injector,
-    private _ref: ReportRef<Options>,
-        private _vc: ViewContainerRef) { }
-  onBind(data: Item[], args?: Args) {
-    this._instance.onBind(data, args);
-    }
-    ngOnInit(): void {
-        let comp;
-        if (this._ref.options.chartType)
-            comp = UsageChartComponent;
-        else
-        comp = UsagePivotComponent;
-      this._instance = this._vc.createComponent<ReportComponent<Item, Args>>(comp).instance;
-    }
-}