@bizdoc/core 1.14.5 → 1.14.9

package/src/lib/system.module.ts

@@ -0,0 +1,77 @@
+import { ModuleWithProviders, NgModule } from '@angular/core';
+import { CommonModule } from '@angular/common';
+import { HttpClientModule } from '@angular/common/http';
+import { FlexLayoutModule } from '@angular/flex-layout';
+import { ReactiveFormsModule } from '@angular/forms';
+import { RouterModule } from '@angular/router';
+import { SharedModule } from './shared.module';
+import { SyncfusionChartModule } from './modules/chart.module';
+import { SyncfusionDiagramModule } from './modules/diagram.module';
+import { FormResolve } from './admin/form/form.resolve.service';
+import { FormService } from './admin/form/form.service';
+import { ReassignDialog } from './admin/document-trace/reassign.dialog';
+import { TraceElementComponent } from './admin/document-trace/trace-element.component';
+import { WorkflowComponent } from './admin/form/workflow/workflow.component';
+import { PositionsPopup } from './admin/positions/positions-popup.component';
+import { SearchInput } from './admin/core/search.input';
+import { WorkflowNodeComponent } from './admin/form/workflow/node.component';
+import { UtilityPaneComponent } from './admin/utility.pane.component';
+import { ManageCubeIndexUtility } from './admin/indices/manage-cube-index.component';
+import { PermissionsUtility } from './admin/permissions/permissions.component';
+import { UtilityWrapperComponent } from './admin/utility-wrapper.component';
+import { SystemDiffComponent } from './admin/diff/configuration-diff.component';
+import { DocumentTraceComponent } from './admin/document-trace/document-trace.component';
+import { RoleNodeComponent } from './admin/form/workflow/role-node.component';
+import { PatternsComponent } from './admin/patterns/patterns.component';
+import { PositionsComponent } from './admin/positions/positions.component';
+import { ProfilerComponent } from './admin/profiler/profiler.component';
+import { ProfileSettingsDialog } from './admin/profiler/outofoffice.component';
+import { registerComponents } from './core/component-factory-resolver';
+
+const SYSTEM_COMPONENTS = [RoleNodeComponent, ManageCubeIndexUtility, PermissionsUtility, PositionsComponent, ProfilerComponent,
+  PatternsComponent, SystemDiffComponent, DocumentTraceComponent];
+
+/** administrative utilities */
+@NgModule({
+  declarations: [
+    PermissionsUtility, ManageCubeIndexUtility, ProfileSettingsDialog,
+    UtilityWrapperComponent, UtilityPaneComponent,
+    SearchInput,
+    ReassignDialog,
+    SystemDiffComponent, DocumentTraceComponent, TraceElementComponent, ProfilerComponent,
+    PositionsComponent, PositionsPopup,
+    WorkflowComponent, WorkflowNodeComponent, RoleNodeComponent,
+    PatternsComponent
+  ],
+  providers: [
+    FormResolve, FormService
+  ],
+  imports: [
+    CommonModule,
+    HttpClientModule,
+    ReactiveFormsModule,
+    FlexLayoutModule,
+    RouterModule,
+    SyncfusionDiagramModule,
+    SyncfusionChartModule,
+    SharedModule
+  ],
+  exports: [
+    PermissionsUtility, ManageCubeIndexUtility,
+    UtilityWrapperComponent, UtilityPaneComponent,
+    SystemDiffComponent, DocumentTraceComponent, TraceElementComponent, ProfilerComponent,
+    PositionsComponent,
+    WorkflowComponent, WorkflowNodeComponent, RoleNodeComponent,
+    PatternsComponent
+  ],
+  entryComponents: [ProfileSettingsDialog]
+})
+export class SystemModule {
+  static forChild(): ModuleWithProviders<SystemModule> {
+    registerComponents(SYSTEM_COMPONENTS);
+    return {
+      ngModule: SystemModule,
+      providers: []
+    }
+  }
+}

package/src/lib/views/_views.theme.scss

@@ -0,0 +1,18 @@
+@mixin views-theme($theme) {
+  $primary: mat.get-color-from-palette($theme, primary);
+  $accent: mat.get-color-from-palette($theme, accent);
+  $warn: mat.get-color-from-palette($theme, warn);
+  $is-dark-theme: mat.get-color-from-palette($theme, is-dark);
+
+  .view {
+    color: if($is-dark-theme, white, black);
+
+    .nav-toolbar {
+      opacity: .1
+    }
+
+    &:hover .nav-toolbar {
+      opacity: 1
+    }
+  }
+}

package/src/lib/views/cube/chart.component.html

@@ -0,0 +1,24 @@
+<ng-container *ngIf="hasdata; ">
+  <!--else none-->
+  <ng-container [ngSwitch]="isAccum">
+    <bizdoc-cube-accum *ngSwitchCase="true" [chartType]="chartType" [width]="width" [scope]="scope"
+                       (explore)="explore($event)"
+                       [cube]="cube.name"
+                       [filters]="filters"
+                       [xAxis]="xAxis"></bizdoc-cube-accum>
+    <bizdoc-cube-chart *ngSwitchDefault
+                       [cube]="cube.name"
+                       [xAxis]="xAxis"
+                       [series]="series"
+                       [indices]="indices"
+                       [filters]="filters"
+                       [chartType]="chartType"
+                       [indicesChartType]="indicesChartType"
+                       [width]="width"
+                       [scope]="scope"
+                       (explore)="explore($event)"></bizdoc-cube-chart>
+  </ng-container>
+</ng-container>
+<ng-template #none>
+  <bizdoc-none icon="insert_chart_outlined" subtitle="NothingHere"></bizdoc-none>
+</ng-template>

package/src/lib/views/cube/chart.component.ts

@@ -0,0 +1,88 @@
+import { Component } from '@angular/core';
+import { ScopeType } from '../../core/configuration';
+import { BizDoc } from '../../core/decorators';
+import { isArray } from '../../core/functions';
+import { AxesMap, ChartType } from '../../core/models';
+import { RouterImpl } from '../../core/router';
+import { SessionService } from '../../core/session.service';
+import { CubeService } from '../../cube/cube.service';
+import { AxisClickEvent } from '../../cube/declarations';
+import { DocumentViewRef } from '../document-view-ref';
+import { CubeBase } from './cube-base';
+
+@Component({
+  templateUrl: './chart.component.html',
+  host: { class: 'view' }
+})
+@BizDoc({
+  selector: 'bizdoc-chart-view'
+})
+export
+  class CubeChartViewComponent extends CubeBase<Options> {
+  xAxis: string | string[];
+  series: string | string[];
+  width: number;
+  chartType?: ChartType;
+  indicesChartType?: ChartType;
+  indices: string | string[];
+  filters: AxesMap;
+  isAccum: boolean;
+  constructor(session: SessionService,
+    viewRef: DocumentViewRef<Options>,
+    service: CubeService,
+    private _router: RouterImpl) {
+    super(viewRef, service, session);
+    viewRef.resize.subscribe(d => this.width = d.width);
+  }
+  onViewBind() {
+    const { scope, xAxis, series, indices, chartType, indicesChartType } = this._viewRef.options;
+    if (!xAxis) throw 'chart view reqires xAxis';
+    this.xAxis = xAxis,
+      this.chartType = chartType,
+      this.indicesChartType = indicesChartType,
+      this.indices = indices,
+      this.series = series,
+      this.scope = scope;
+    this.filters = { ...this.axes };
+    if (isArray(xAxis))
+      xAxis.forEach(x => delete this.filters[x]);
+    else
+      delete this.filters[xAxis];
+    if (series) {
+      if (isArray(series))
+        series.forEach(x => delete this.filters[x]);
+      else
+        delete this.filters[series];
+    }
+    switch (chartType) {
+      case 'Pie':
+      case 'Doughnut':
+      case 'HalfDoughnut':
+      case 'Funnel':
+        this.isAccum = true;
+    }
+  }
+  /**
+   *
+   * @param evt
+   */
+  explore(evt: AxisClickEvent) {
+    const { axes, index } = evt;
+    this._router.navigate(['cube', this.cube.name, 'explore'],
+      {
+        group: this.group,
+        queryParams: { ...this.axes, ...axes },
+        state: { index }
+      });
+  }
+}
+
+interface Options {
+  xAxis: string | string[];
+  series?: string | string[];
+  indices?: string | string[];
+  aggregate?: string[];
+  chartType?: ChartType;
+  indicesChartType?: ChartType;
+  scope?: ScopeType;
+}

package/src/lib/views/cube/cube-base.ts

@@ -0,0 +1,126 @@
+import { Directive } from "@angular/core";
+import { AxesMap, Cube, DocumentModel } from "../../core/models";
+import { SessionService } from "../../core/session.service";
+import { DocumentViewRef } from "../document-view-ref";
+
+import { CubeService, Pattern } from '../../cube/cube.service';
+import { DocumentViewComponent } from "../../core/base";
+import { isArray, isString } from "../../core/functions";
+import { ScopeType } from "../../core/configuration";
+
+type ConsolidatedModel = {
+  [cube: string]: {
+    [axis: string]: string | string[];
+  };
+};
+
+@Directive()
+export abstract class CubeBase<O extends Options> implements DocumentViewComponent {
+  patterns: Pattern[];
+  pattern: Pattern;
+  scope: ScopeType;
+  loading: boolean;
+  axes: AxesMap;
+  anyFilters: boolean;
+  model: DocumentModel<any>;
+  originalAxes: AxesMap;
+  alternate: Cube[];
+  cube: Cube;
+  hasdata: boolean;
+  title: string;
+  private _consolidateData: ConsolidatedModel;
+  constructor(
+    protected _viewRef: DocumentViewRef<O>,
+    protected _service: CubeService,
+    protected _session: SessionService, private _none?: boolean) {
+  }
+  onBind(model: DocumentModel<any>) {
+    this.model = model;
+    if (model.cubes.length) {
+      this._consolidate();
+
+      const ids = Object.keys(this._consolidateData);
+
+      const cube = this._session.profile.cubes.find(c => c.name === ids[0]);
+
+      this.hasdata = true;
+
+      this.switchTo(cube);
+    }
+    else if (!this._none)
+      this._viewRef.hidden = true;
+  }
+  abstract onViewBind();
+  switchAxes(axes?: AxesMap) {
+    this._consolidate(axes);
+
+    this.originalAxes = this._consolidateData[this.cube.name];
+
+    this.axes = this.aggregate(this.originalAxes);
+  }
+  protected _drop(axes: string | string[]) {
+    if (isString(axes))
+      delete this.axes[axes];
+    else axes.forEach(s => delete this.axes[s]);
+  }
+  /**
+   * 
+   * @param cube
+   */
+  switchTo(cube: Cube) {
+    const ids = Object.keys(this._consolidateData);
+
+    if (ids.length > 1)
+      this.alternate = this._session.profile.cubes.filter(c => ids.indexOf(c.name) > -1 && c != cube);
+
+    this.cube = cube;
+
+    this.originalAxes = this._consolidateData[cube.name];
+
+    this.axes = this.aggregate(this.originalAxes);
+
+    this.onViewBind();
+  }
+  private _consolidate(h?: AxesMap) {
+    const consolidate = {} as ConsolidatedModel;
+    let cube: Cube;
+    // collect
+    this.model.cubes.forEach(e => {
+      if (!consolidate[e.cube])
+        consolidate[e.cube] = {};
+      if (!cube || cube.name !== e.cube)
+        cube = this._session.profile.cubes.find(c => c.name === e.cube);
+      let i = 0;
+      while (i < cube.axes.length) {
+        let name = cube.axes[i].name, axis = e.axes[i], val = consolidate[e.cube][name];
+        if (!h || !h[name] || h[name] === axis) {
+          if (!val)
+            consolidate[e.cube][name] = axis;
+          else if (isString(val) && val !== axis) consolidate[e.cube][name] = [val, axis];
+          else if (isArray(val) && val.indexOf(axis) < 0)
+            val.push(axis);
+        }
+        i++;
+      }
+    });
+    this._consolidateData = consolidate;
+  }
+  protected async getAggregateLabel() {
+    if (!this._viewRef.options.aggregate)
+      return null;
+    const axes = {};
+    this._viewRef.options.aggregate.forEach(a => axes[a] = this.originalAxes[a]);
+    return await this._service.nameOf(axes, this.cube.name).
+      toPromise();
+  }
+  protected aggregate(originalAxes: AxesMap): AxesMap {
+    const axes = { ...originalAxes };
+    if (this._viewRef.options.aggregate)
+      this._viewRef.options.aggregate.forEach(a => delete axes[a]);
+    return axes;
+  }
+  get group() { return `#${this.model.number}` }
+}
+interface Options {
+  aggregate?: string[];
+}

package/src/lib/views/cube/explore.component.html

@@ -0,0 +1,33 @@
+<ng-container *ngIf="hasdata">
+  <div class="nav-toolbar">
+    <ng-container *ngIf="alternate">
+      <button mat-button [matMenuTriggerFor]="cmenu">{{cube.title}} <mat-icon>arrow_drop_down</mat-icon></button>
+      <mat-menu #cmenu>
+        <button mat-menu-item *ngFor="let a of alternate"
+                (click)="switchTo(a)">
+          {{a.title}}
+        </button>
+      </mat-menu>
+    </ng-container>
+    <!-- filters -->
+    <ng-container *ngFor="let f of filters">
+      <button mat-button [matMenuTriggerFor]="fmenu">{{axes[f.name] | typeValue : f.dataType | async}} <mat-icon>arrow_drop_down</mat-icon></button>
+      <mat-menu #fmenu xPosition="before">
+        <button mat-menu-item *ngFor="let kv of sources[f.name] | async"
+                (click)="filter(f.name, kv.key, kv.value)">
+          {{kv.value}}
+        </button>
+      </mat-menu>
+    </ng-container>
+    <span class="divider"></span>
+    <button mat-icon-button (click)="items.paginator.previousPage()" [bizdocTooltip]="'PrevPage' | translate" [attr.aria-label]="'PrevPage' | translate" [disabled]="!items.paginator.hasPreviousPage()"><mat-icon class="mat-icon-rtl-mirror">keyboard_arrow_left</mat-icon></button>
+    <button mat-icon-button (click)="items.paginator.nextPage()" [bizdocTooltip]="'NextPage' | translate" [attr.aria-label]="'NextPage' | translate" [disabled]="!items.paginator.hasNextPage()"><mat-icon class="mat-icon-rtl-mirror">keyboard_arrow_right</mat-icon></button>
+  </div>
+  <div class="loading-view" *ngIf="loading">
+    <mat-spinner color="accent"></mat-spinner>
+  </div>
+  <bizdoc-cube-explore #items [cube]="cube.name" [axes]=axes
+                       (explore)="item($event)"
+                       (loadingChange)="loading = $event" [pageSize]="pageSize"
+                       [scope]="scope"></bizdoc-cube-explore>
+</ng-container>

package/src/lib/views/cube/explore.component.ts

@@ -0,0 +1,82 @@
+import { Component } from '@angular/core';
+import { Observable } from 'rxjs';
+import { ScopeType } from '../../core/configuration';
+import { DatasourceService } from '../../core/datasource.service';
+import { BizDoc } from '../../core/decorators';
+import { isArray } from '../../core/functions';
+import { CubeAxis } from '../../core/models';
+import { PromptService } from '../../core/prompt.service';
+import { RouterImpl } from '../../core/router';
+import { SessionService } from '../../core/session.service';
+import { CubeService } from '../../cube/cube.service';
+import { ExploreItemEvent } from '../../cube/explore/explore-items.component';
+import { DocumentViewRef } from '../document-view-ref';
+import { CubeBase } from './cube-base';
+
+@Component({
+  templateUrl: './explore.component.html',
+  host: { class: 'view' }
+})
+@BizDoc({
+  selector: 'bizdoc-explore-view'
+})
+export
+  class CubeExploreViewComponent extends CubeBase<Options> {
+  readonly sources: { [axis: string]: Observable<{ key: string; value: any; }[]>; } = {};
+  filters: CubeAxis[];
+  pageSize: number = 5;
+  constructor(viewRef: DocumentViewRef<Options>,
+    private _sb: PromptService,
+    private _router: RouterImpl,
+    service: CubeService,
+    private _ds: DatasourceService,
+    session: SessionService) {
+    super(viewRef, service, session);
+  }
+  onViewBind() {
+    const { scope, filters, pageSize } = this._viewRef.options;
+    this.scope = scope;
+    if (pageSize) this.pageSize = pageSize;
+    this.filters = this.cube.axes.filter(a => isArray(filters) ?
+      filters.indexOf(a.name) > -1 :
+      a.name === filters);
+    this.filters.forEach(f =>
+      this.sources[f.name] = this._ds.all(f.dataType)
+    );
+  }
+  /**
+ *
+ * @param value
+ */
+  filter(name: string, value: string | number, title: string) {
+    const axes = { ...this.axes };
+    axes[name] = value;
+    this.anyFilters = true;
+    this.axes = axes;
+  }
+  reset() {
+    this.axes = super.aggregate(this.originalAxes);
+    this.anyFilters = false;
+  }
+  item(evt: ExploreItemEvent) {
+    const { keys } = evt;
+    this.loading = true;
+    this._service.item(this.cube.name, this.axes, keys).subscribe(item => {
+      this._router.navigate(['cube', this.cube.name, 'explore', 'i', evt.template, keys[0]], {
+        queryParams: this.axes,
+        state: { item },
+        group: this.group,
+      });
+      this.loading = false;
+    }, e => {
+      this.loading = false;
+      this._sb.error(e.status === 401 ? 'Unauthorized' : null);
+    });
+  }
+}
+interface Options {
+  aggregate?: string[];
+  filters: string[];
+  scope?: ScopeType;
+  pageSize?: number;
+}

package/src/lib/views/cube/filter.component.exp.ts

@@ -0,0 +1,66 @@
+import { EventEmitter, OnDestroy, Output } from '@angular/core';
+import { Component, Input, OnInit } from '@angular/core';
+import { FormBuilder, FormGroup } from '@angular/forms';
+import { MatAutocompleteSelectedEvent } from '@angular/material/autocomplete';
+import { debounceTime, filter, map, Observable, Subject, takeUntil } from 'rxjs';
+import { cleanup, isArray, mapToArray } from '../../core/functions';
+import { AxesMap, Cube, CubeAxis } from '../../core/models';
+import { AXIS_VALUE_PATTERN, CubeService } from '../../cube/cube.service';
+
+
+@Component({
+  selector: 'bizdoc-cube-view-filter',
+  templateUrl: './filter.component.html'
+})
+export
+  class CubeFilterViewComponent implements OnInit, OnDestroy {
+  readonly pattern = AXIS_VALUE_PATTERN;
+  readonly sources: { [axis: string]: Observable<{ key: string; value: any; }[]>; } = {};
+  @Input()
+  cube: Cube;
+  @Input('filters')
+  _filters: string[] | string;
+  @Input()
+  axes: AxesMap;
+  @Output()
+  readonly axesChange = new EventEmitter<AxesMap>();
+  @Input()
+  anyFilters: boolean;
+  @Output()
+  readonly anyFiltersChange = new EventEmitter<boolean>();
+  filters: CubeAxis[];
+  form: FormGroup;
+  private readonly _destroy = new Subject<void>();
+  constructor(
+    private readonly _fb: FormBuilder,
+    private _service: CubeService) {
+  }
+  ngOnInit(): void {
+    this.filters = this.cube.axes.filter(a => isArray(this._filters) ?
+      this._filters.indexOf(a.name) > -1 :
+      a.name === this._filters);
+    const config = {};
+    this.filters.forEach(a => {
+      this.sources[a.name] = this._service.values(this.cube.name, a.name).pipe(map(mapToArray));
+      config[a.name] = this._fb.control(this.axes[a.name]);
+    });
+    this.form = this._fb.group(config);
+    this.form.patchValue(this.axes);
+    this.form.valueChanges.pipe(filter(() => this.form.valid), debounceTime(200), takeUntil(this._destroy)).subscribe(v => {
+      cleanup(v);
+      this.axes = v;
+      this.axesChange.emit(v);
+      this.anyFiltersChange.emit(this.anyFilters = true);
+    });
+  }
+  display(keyValue) {
+    return keyValue ? keyValue.value : null;
+  }
+  change(axis: string, evt: MatAutocompleteSelectedEvent) {
+    this.form.controls[axis].setValue(evt.option.value.key);
+  }
+  ngOnDestroy(): void {
+    this._destroy.next();
+    this._destroy.complete();
+  }
+}

package/src/lib/views/cube/filter.component.html

@@ -0,0 +1,25 @@
+<ng-container *ngFor="let a of filters" [formGroup]="form">
+  <ng-container *ngSwitchCase="'Pattern'">
+    <input matInput autocomplete="off"
+           [pattern]="pattern" [autofocus]
+           [formControlName]="a.name" [placeholder]="a.title" />
+    <mat-error *ngIf="form.controls[a.name].invalid">{{'SimplePatternErr' |translate}}</mat-error>
+  </ng-container>
+  <ng-container *ngSwitchCase="'Search'">
+    <input matInput autocomplete="off" type="search"
+           [matAutocomplete]="segment" #inp
+           [placeholder]="a.title" />
+    <mat-autocomplete #segment [displayWith]="display"
+                      (optionSelected)="change(a.name, $event)">
+      <mat-option *ngFor="let r of sources[a.dataType] | async | filter : 'value' : inp.value | slice:0:50" [value]="r">{{r.value}}</mat-option>
+    </mat-autocomplete>
+    <button mat-icon-button *ngIf="inp.value" matSuffix aria-label="" (click)="inp.value = ''; form.controls[a.name].setValue(null)"><mat-icon>close</mat-icon></button>
+    <mat-error *ngIf="form.controls[a.name].invalid">{{'SimplePatternErr' |translate}}</mat-error>
+  </ng-container>
+  <ng-container [ngSwitch]="a.selectionMode">
+    <mat-select [formControlName]="a.name" [placeholder]="a.title" [multiple]="a.selectionMode === 'Multiple'" *ngSwitchDefault>
+      <mat-option *ngIf="a.selectionMode !== 'Multiple'">{{'All' | translate}}</mat-option>
+      <mat-option *ngFor="let kv of sources[a.name] | async" [value]="kv.key">{{kv.value}}</mat-option>
+    </mat-select>
+  </ng-container>
+</ng-container>

package/src/lib/views/cube/matrix.component.html

@@ -0,0 +1,42 @@
+<ng-container *ngIf="hasdata; else none">
+  <div class="nav-toolbar">
+    <ng-container *ngIf="alternate">
+      <button mat-button [matMenuTriggerFor]="cmenu">{{cube.title}} <mat-icon>arrow_drop_down</mat-icon></button>
+      <mat-menu #cmenu>
+        <button mat-menu-item *ngFor="let a of alternate"
+                (click)="switchTo(a)">
+          {{a.title}}
+        </button>
+      </mat-menu>
+    </ng-container>
+    <span class="divider"></span>
+    <!-- title -->
+    <button mat-icon-button [matMenuTriggerFor]="patternsMenu" *ngIf="patterns && patterns.length" [bizdocTooltip]="'Pattern'|translate" [attr.aria-label]="'Pattern'|translate"><mat-icon [class.filled]="pattern">filter_alt</mat-icon></button>
+    <mat-menu #patternsMenu xPosition="before">
+      <!-- patterns -->
+      <button mat-menu-item *ngFor="let p of patterns" (click)="patternChange(p)">{{p.title}}</button>
+    </mat-menu>
+    <button mat-icon-button (click)="reset()" [disabled]="!pattern" [bizdocTooltip]="'Clear' | translate">
+      <mat-icon>clear_all</mat-icon>
+    </button>
+    <!-- filters -->
+    <ng-container *ngFor="let f of filters">
+      <button mat-button [matMenuTriggerFor]="fmenu">{{axes[f.name] | typeValue : f.dataType | async}} <mat-icon>arrow_drop_down</mat-icon></button>
+      <mat-menu #fmenu xPosition="before">
+        <button mat-menu-item *ngFor="let kv of sources[f.name] | async"
+                (click)="filter(f.name, kv.key, kv.value)">
+          {{kv.value}}
+        </button>
+      </mat-menu>
+    </ng-container>
+  </div>
+  <div class="loading-view" *ngIf="loading">
+    <mat-spinner color="accent"></mat-spinner>
+  </div>
+  <bizdoc-cube-matrix [cube]="cube.name" [xAxis]="xAxis" [series]="series" [indices]="indices" [sum]="sum"
+                          [filters]="axes" [scope]="scope" class="table"
+                          (explore)='explore($event)' [(loading)]="loading"></bizdoc-cube-matrix>
+</ng-container>
+<ng-template #none>
+  <bizdoc-none icon="insert_chart_outlined" subtitle="NothingHere"></bizdoc-none>
+</ng-template>

package/src/lib/views/cube/matrix.component.scss

@@ -0,0 +1,3 @@
+.table {
+  padding: 0 8px;
+}