@WidgetComponent

nm-data-list

File

src/app/shared/widgets/data-list/data-list.component.widget.ts

Implements

OnDestroy

Metadata

selector nm-data-list
styleUrls data-list.component.widget.scss
templateUrl ./data-list.component.widget.html

Index

Widget inputs
Widget outputs
Properties
Methods

Constructor

constructor(currentLocaleService: CurrentLocaleService, widgetFrameService: WidgetframeService, appdataStore: AppdataStore, localstorageService: LocalStorageService, unsavedChangesService: UnsavedChangesService, cdr: ChangeDetectorRef)
Parameters :
Name Type Optional
currentLocaleService CurrentLocaleService no
widgetFrameService WidgetframeService no
appdataStore AppdataStore no
localstorageService LocalStorageService no
unsavedChangesService UnsavedChangesService no
cdr ChangeDetectorRef no

Methods

Protected configureWidget
configureWidget(configuration: WidgetConfig)
Decorators : WidgetConfigure
Parameters :
Name Type Optional
configuration WidgetConfig<DataListConfiguration> no
Returns : void
doExport
doExport(settings: )
Parameters :
Name Optional
settings no
Returns : void
Public ngOnDestroy
ngOnDestroy()
Returns : void
Public onEditedRows
onEditedRows(event: )
Parameters :
Name Optional
event no
Returns : void
Public onMaintenanceLevelChange
onMaintenanceLevelChange(value: )
Parameters :
Name Optional
value no
Returns : void
setGrid
setGrid(grid: )
Parameters :
Name Optional
grid no
Returns : void
setSelectedCell
setSelectedCell(selectedCell: )
Parameters :
Name Optional
selectedCell no
Returns : void
Public setSelectedLocale
setSelectedLocale(value: )
Parameters :
Name Optional
value no
Returns : void
setTileClicked
setTileClicked(tileClicked: )
Parameters :
Name Optional
tileClicked no
Returns : void
setTotal
setTotal(total: )
Parameters :
Name Optional
total no
Returns : void
Private updateAdditionalParams
updateAdditionalParams(key: string, value: any)
Parameters :
Name Type Optional
key string no
value any no
Returns : void

Properties

Public additionalParams
additionalParams: any
Type : any
Default value : {}
Public apiOutput
apiOutput:
Default value : new Subject<DataListApi>()
Decorators : WidgetOutput

Emits a service that allows to directly interact with the data-list

Public attributeUrlInput
attributeUrlInput:
Default value : new Subject<void>()
Decorators : WidgetInput

The url used to get data for attributes dialog

Public clearFiltersAndSortingChannel
clearFiltersAndSortingChannel:
Default value : new Subject<any>()
Decorators : WidgetInput

Clears applied filters and sorting state

Public clearRowSelectionChannel
clearRowSelectionChannel:
Default value : new Subject<any>()
Decorators : WidgetInput

Clears selected rows

Public clients
clients:
Public collapse
collapse: boolean
Type : boolean
Default value : false
Public collapseChannel
collapseChannel:
Default value : new Subject<boolean>()
Decorators : WidgetInput

Collapses/Expands the data-list panel

Public configuration
configuration: WidgetConfig<DataListConfiguration>
Type : WidgetConfig<DataListConfiguration>
Decorators : WidgetConfiguration
Public contentVisible
contentVisible: boolean
Type : boolean
Default value : true
Public contextIdentifierChannel
contextIdentifierChannel: ReplaySubject<any>
Type : ReplaySubject<any>
Default value : new ReplaySubject<any>( 1 )
Decorators : WidgetInput

Key to store context specific table configurations

Public countDescription
countDescription:
Public currentData
currentData:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits the data-list's current data when it's loaded

Public data
data:
Default value : new Subject<any[]>()
Decorators : WidgetInput

Sets data-list data

Public dataLoadedOutput
dataLoadedOutput:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits after data is loaded in list

Public dataLocale
dataLocale: ReplaySubject<any>
Type : ReplaySubject<any>
Default value : new ReplaySubject<any>(1)
Decorators : WidgetInput

Sets data locale, and trigger emitting the changed locale through "dataLocale" output channel.

Public dataLocaleInputChannel
dataLocaleInputChannel:
Default value : new ReplaySubject<any>(1)
Decorators : WidgetInput

Sets data locale

Public dataLocaleOutput
dataLocaleOutput:
Default value : new ReplaySubject<any>(1)
Decorators : WidgetOutput

Emits selected data locale

Public dataTypeInput
dataTypeInput:
Default value : new Subject<any>()
Decorators : WidgetInput

Sets data type

Public dataTypeMode
dataTypeMode:
Default value : new Subject<any>()
Decorators : WidgetInput

Sets dataType mode value, use "choose" to show dataType selection dropdown

Public dataTypeOutput
dataTypeOutput:
Default value : new ReplaySubject<any>()
Decorators : WidgetOutput

Emits selected data type

Public dynamicColumnsIn
dynamicColumnsIn:
Default value : new Subject<Column[]>()
Decorators : WidgetInput

Inputs the dynamic columns that are supposed to get rendered

Public dynamicColumnsOutput
dynamicColumnsOutput: Subject<Column[]>
Type : Subject<Column[]>
Default value : new ReplaySubject(1)
Decorators : WidgetOutput

Emits dynamic columns

Public dynamicPrefixOutput
dynamicPrefixOutput:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits the prefix that should be added before the data-list title when data type changes, only used when dynamicTitle property is set to true

Public eagerLimit
eagerLimit:
Default value : new ReplaySubject<number>(1)
Decorators : WidgetInput

Sets the limit for eager loading

Public editableCell
editableCell:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits edited cell data

Public editedRowOutput
editedRowOutput:
Default value : new Subject<DataListEditedRow>()
Decorators : WidgetOutput

Emits the last editedRow

Public editedRowsOutput
editedRowsOutput:
Default value : new Subject<DataListEditedRows>()
Decorators : WidgetOutput

Emits all edited rows

Public endGridEditMode
endGridEditMode: ReplaySubject<any>
Type : ReplaySubject<any>
Default value : new ReplaySubject<any>(1)
Decorators : WidgetInput

Ends edit mode

Public export
export:
Default value : new Subject<any>()
Public filterColumns
filterColumns:
Default value : new Subject<any[]>()
Decorators : WidgetInput

Shows only sepecified columns by column "field" value

Public focusFreeTextSearch
focusFreeTextSearch: boolean
Type : boolean
Default value : false
Public grid
grid: IgxGridBaseDirective
Type : IgxGridBaseDirective
Public gridOutput
gridOutput:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits grid instance on initialization

Public header
header:
Public hide
hide: ReplaySubject<boolean>
Type : ReplaySubject<boolean>
Default value : new ReplaySubject<boolean>(1)
Decorators : WidgetInput

Hides/Shows the data-list

Public hideTable
hideTable: boolean
Type : boolean
Default value : false
Public infoText
infoText: string
Type : string
Default value : "list.results"
Public infoTitle
infoTitle:
Public inputChannel
inputChannel: ReplaySubject<any>
Type : ReplaySubject<any>
Default value : new ReplaySubject<any>(1)
Decorators : WidgetInput

The uri that should be used to fetch the data

Public invertSelection
invertSelection:
Default value : new Subject<any>()
Public isCollapsible
isCollapsible:
Public isSideCollapsible
isSideCollapsible:
Private langSelectUrlObs
langSelectUrlObs: Observable<string>
Type : Observable<string>
Public languageSelectorValueProperty
languageSelectorValueProperty:
Public locales
locales:
Public localstorageClientEntry
localstorageClientEntry: LocalStorageEntry
Type : LocalStorageEntry
Public localstorageLocaleEntry
localstorageLocaleEntry: LocalStorageEntry
Type : LocalStorageEntry
Public maintenanceLevel
maintenanceLevel:
Public maintenanceLevelChange
maintenanceLevelChange:
Default value : new ReplaySubject<number>(1)
Decorators : WidgetOutput

Emits selected maintenance level

Public preselectAttributeProfile
preselectAttributeProfile:
Default value : new Subject<string>()
Decorators : WidgetInput

Inputs the profile pimRef to be selected when attributes dialog is opened

Public productsInput
productsInput:
Default value : new Subject<string[]>()
Decorators : WidgetInput

Sets the product numbers to be displayed in data-list, Needed for restricting attributes to category if other ways do not work

Public refreshButtonsChannel
refreshButtonsChannel:
Default value : new Subject()
Decorators : WidgetInput

Deprecated: feature is now removed. Refresh the data-list footer buttons state

Public refreshButtonsTrigger
refreshButtonsTrigger:
Public refreshRows
refreshRows:
Default value : new Subject<string[]>()
Decorators : WidgetInput

Refreshes specified rows by primary key

Public reloadChannel
reloadChannel:
Default value : new Subject<any>()
Decorators : WidgetInput

Reloads the data-list data

Public renderCount
renderCount:
Public reorderedRows
reorderedRows:
Default value : new Subject()
Decorators : WidgetOutput

Emits re-ordered rows.

Public resetChannel
resetChannel:
Default value : new Subject<any>()
Decorators : WidgetInput

Clears the data-list data

Public resetEditData
resetEditData:
Default value : new Subject<void>()
Decorators : WidgetInput

Clears edited data

Public restoreGlobalFilter
restoreGlobalFilter:
Default value : new Subject<boolean>()
Decorators : WidgetInput

Sets the free text filter again

Public rowEditEnter
rowEditEnter:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits when row enters edit mode

Public rowEditLeave
rowEditLeave:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits when row editing is canceled

Public rowSelection
rowSelection: ReplaySubject<any>
Type : ReplaySubject<any>
Default value : new ReplaySubject<any>(1)
Decorators : WidgetInput

Selects specified rows by primary key

Public rowSelectionChannel
rowSelectionChannel:
Default value : new Subject<any>()
Decorators : WidgetInput

Selects specified rows by primary key

Public selectedCell
selectedCell: any
Type : any
Default value : null
Public selectedColumn
selectedColumn: any
Type : any
Default value : null
Public selectedItems
selectedItems: Subject<SelectionParams>
Type : Subject<SelectionParams>
Default value : new Subject<SelectionParams>()
Decorators : WidgetOutput

Emits all selected items

Public selectedLocale
selectedLocale:
Public shownAttributesIn
shownAttributesIn:
Default value : new ReplaySubject<any>(1)
Decorators : WidgetInput

List of columns used to update the shown dynamic columns for the data-list. If dynamicColumnsFromData property is enabled, only changes from backend will be processed

Public shownAttributesOutput
shownAttributesOutput:
Default value : new ReplaySubject<any[]>(1)
Decorators : WidgetOutput

Emits all shown attributes

Private showTableOnLinkInput
showTableOnLinkInput: boolean
Type : boolean
Public statusOutput
statusOutput:
Default value : new ReplaySubject<DataListStatus>(1)
Decorators : WidgetOutput
Public subheader
subheader:
Public tileClicked
tileClicked:
Default value : new Subject<boolean>()
Decorators : WidgetOutput

Emits row data when it is clicked in tile mode

Public title
title:
Public titleInfo
titleInfo:
Default value : new Subject<any>()
Decorators : WidgetInput

Sets additional title information; shown in brackets next to title

Public toggleButtonChange
toggleButtonChange:
Default value : new Subject<boolean>()
Decorators : WidgetOutput

Emits value of the mode toggle-slider when it changes

Public toggleSideCollapse
toggleSideCollapse:
Default value : new Subject()
Decorators : WidgetOutput

Deprecated: feature is now removed. Toggle expanding/collapsing data-list panel horizontally

Public total
total:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits number of entries (rows) in the data-list

Public unsubscribe
unsubscribe:
Default value : NgUnsubscribe.create()
Public updateTitle
updateTitle:
Default value : new Subject<any>()
Decorators : WidgetInput

Changes the data-list panel title dynamically

Public validationOutput
validationOutput:
Default value : new Subject<any>()
Decorators : WidgetOutput

Emits validation state for all rows in the data-list

Public viewModeOutput
viewModeOutput:
Default value : new ReplaySubject<any>(1)
Decorators : WidgetOutput

Emits selected view mode

Public widgetId
widgetId: string
Type : string
Decorators : WidgetId
Public wikiLink
wikiLink: string
Type : string
Public withBorder
withBorder: boolean
Type : boolean
Default value : true
Public withHeader
withHeader: boolean
Type : boolean
Default value : true
import { ChangeDetectorRef, Component, OnDestroy } from "@angular/core";
import { IgxGridBaseDirective } from "@infragistics/igniteui-angular";
import { of, ReplaySubject, Subject, Observable } from "rxjs";
import { getOrDefault, WidgetConfig } from "../widget.configuration";
import {
  WidgetComponent,
  WidgetConfiguration,
  WidgetConfigure,
  WidgetId,
  WidgetInput,
  WidgetOutput,
} from "../widget.metadata";
import { NgUnsubscribe } from "../../ng-unsubscribe";
import { first, flatMap, map, takeUntil } from "rxjs/operators";
import { CurrentLocaleService } from "../../components/i18n/currentLocale.service";
import { WidgetframeService } from "../widgetframe/widgetframe.service";
import { AppdataStore } from "../../components/appdata/appdata.store";
import {
  Column,
  DataListConfiguration,
  DataListStatus,
  SelectionParams,
} from "../interfaces/list.interfaces";
import { DataListApi } from "./data-list.api";
import {
  DataListEditedRow,
  DataListEditedRows,
} from "./data-list-component/data-list.component";
import {
  LocalStorageEntry,
  LocalStorageService,
} from "../../components/local-storage/local-storage.service";
import {
  DeletionMode,
  Scope,
} from "../../components/local-storage/local-storage-constants";
import {
  UnsavedChangesDialogConfiguration,
  UnsavedChangesService,
} from "../../components/util";

const UNSAVED_CHANGES_DIALOG_CONFIG: UnsavedChangesDialogConfiguration = {
  allowCancel: false,
  allowExitWithoutSaving: true,
  allowSaveAndExit: true,
};

@WidgetComponent("nm-data-list")
@Component({
  selector: "nm-data-list",
  templateUrl: "./data-list.component.widget.html",
  styleUrls: ["./data-list.component.widget.scss"],
})
export class DataListComponentWidget implements OnDestroy {
  @WidgetId()
  public widgetId: string;

  @WidgetConfiguration()
  public configuration: WidgetConfig<DataListConfiguration>;

  /**
   * The uri that should be used to fetch the data
   */
  @WidgetInput("uri")
  public inputChannel: ReplaySubject<any> = new ReplaySubject<any>(1);

  /**
   * Selects specified rows by primary key
   */
  @WidgetInput("rowSelection")
  public rowSelection: ReplaySubject<any> = new ReplaySubject<any>(1);

  /**
   * Hides/Shows the data-list
   */
  @WidgetInput("hide")
  public hide: ReplaySubject<boolean> = new ReplaySubject<boolean>(1);

  /**
   * Sets data locale,
   * and trigger emitting the changed locale through "dataLocale" output channel.
   */
  @WidgetInput("selectedLocale")
  public dataLocale: ReplaySubject<any> = new ReplaySubject<any>(1);

  /**
   * Clears the data-list data
   */
  @WidgetInput("reset")
  public resetChannel = new Subject<any>();

  /**
   * Inputs the dynamic columns that are supposed to get rendered
   */
  @WidgetInput("dynamicColumnsIn")
  public dynamicColumnsIn = new Subject<Column[]>();

  /**
   * Reloads the data-list data
   */
  @WidgetInput("reload")
  public reloadChannel = new Subject<any>();

  /**
   * Sets data locale
   */
  @WidgetInput("dataLocale")
  public dataLocaleInputChannel = new ReplaySubject<any>(1);

  /**
   * Sets dataType mode value, use "choose" to show dataType selection dropdown
   */
  @WidgetInput("dataTypeMode")
  public dataTypeMode = new Subject<any>();

  /**
   * Clears edited data
   */
  @WidgetInput("resetEditData")
  public resetEditData = new Subject<void>();

  /**
   * The url used to get data for attributes dialog
   */
  @WidgetInput("attributeUrl")
  public attributeUrlInput = new Subject<void>();

  /**
   * Collapses/Expands the data-list panel
   */
  @WidgetInput("collapse")
  public collapseChannel = new Subject<boolean>();

  /**
   * Sets the product numbers to be displayed in data-list,
   * Needed for restricting attributes to category if other ways do not work
   */
  @WidgetInput("products")
  public productsInput = new Subject<string[]>();

  /**
   * Ends edit mode
   */
  @WidgetInput("endGridEditMode")
  public endGridEditMode: ReplaySubject<any> = new ReplaySubject<any>(1);

  /**
   * Changes the data-list panel title dynamically
   */
  @WidgetInput("updateTitle")
  public updateTitle = new Subject<any>();

  /**
   * Sets additional title information; shown in brackets next to title
   */
  @WidgetInput("titleInfo")
  public titleInfo = new Subject<any>();

  /**
   * Key to store context specific table configurations
   */
  @WidgetInput("contextIdentifier")
  public contextIdentifierChannel: ReplaySubject<any> = new ReplaySubject<any>(
    1
  );

  /**
   * Inputs the profile pimRef to be selected when attributes dialog is opened
   */
  @WidgetInput("preselectAttributeProfile")
  public preselectAttributeProfile = new Subject<string>();

  /**
   * Emits dynamic columns
   */
  @WidgetOutput("dynamicColumns")
  public dynamicColumnsOutput: Subject<Column[]> = new ReplaySubject(1);

  /**
   * Emits selected data locale
   */
  @WidgetOutput("dataLocale")
  public dataLocaleOutput = new ReplaySubject<any>(1);

  /**
   * Emits the prefix that should be added before the data-list title when data type changes,
   * only used when dynamicTitle property is set to true
   */
  @WidgetOutput("dynamicPrefix")
  public dynamicPrefixOutput = new Subject<any>();

  /**
   * List of columns used to update the shown dynamic columns for the data-list.
   * If dynamicColumnsFromData property is enabled, only changes from backend will be processed
   */
  @WidgetInput("shownAttributesIn")
  public shownAttributesIn = new ReplaySubject<any>(1);

  /**
   * Deprecated: feature is now removed.
   * Refresh the data-list footer buttons state
   */
  @WidgetInput("refreshButtons")
  public refreshButtonsChannel = new Subject();

  /**
   * Emits edited cell data
   */
  @WidgetOutput("editableCell")
  public editableCell = new Subject<any>();

  /**
   * Selects specified rows by primary key
   */
  @WidgetInput("rowSelection")
  public rowSelectionChannel = new Subject<any>();

  /**
   * Clears selected rows
   */
  @WidgetInput("clearRowSelection")
  public clearRowSelectionChannel = new Subject<any>();

  /**
   * Clears applied filters and sorting state
   */
  @WidgetInput("clearFiltersAndSorting")
  public clearFiltersAndSortingChannel = new Subject<any>();

  /**
   * Emits selected view mode
   */
  @WidgetOutput("viewMode")
  public viewModeOutput = new ReplaySubject<any>(1);

  /**
   * Emits selected data type
   */
  @WidgetOutput("dataType")
  public dataTypeOutput = new ReplaySubject<any>();

  /**
   * Emits validation state for all rows in the data-list
   */
  @WidgetOutput("isValid")
  public validationOutput = new Subject<any>();

  /**
   * Emits the data-list's current data when it's loaded
   */
  @WidgetOutput("currentData")
  public currentData = new Subject<any>();

  /**
   * Emits when row enters edit mode
   */
  @WidgetOutput("rowEditEnter")
  public rowEditEnter = new Subject<any>();

  /**
   * Emits when row editing is canceled
   */
  @WidgetOutput("rowEditLeave")
  public rowEditLeave = new Subject<any>();

  /**
   * Sets data type
   */
  @WidgetInput("dataTypeInput")
  public dataTypeInput = new Subject<any>();

  /**
   * Sets the limit for eager loading
   */
  @WidgetInput("eagerLimit")
  public eagerLimit = new ReplaySubject<number>(1);

  /**
   * Refreshes specified rows by primary key
   */
  @WidgetInput("refreshRows")
  public refreshRows = new Subject<string[]>();

  /**
   * Sets the free text filter again
   */
  @WidgetInput("restoreGlobalFilter")
  public restoreGlobalFilter = new Subject<boolean>();

  /**
   * Emits a service that allows to directly interact with the data-list
   */
  @WidgetOutput("api")
  public apiOutput = new Subject<DataListApi>();

  @WidgetOutput("statusOut")
  public statusOutput = new ReplaySubject<DataListStatus>(1);

  public refreshButtonsTrigger;

  /**
   * Emits all selected items
   */
  @WidgetOutput("selectedItems")
  public selectedItems: Subject<SelectionParams> = new Subject<SelectionParams>();

  /**
   * Emits all shown attributes
   */
  @WidgetOutput("shownAttributes")
  public shownAttributesOutput = new ReplaySubject<any[]>(1);

  /**
   * Emits all edited rows
   */
  @WidgetOutput("editedRows")
  public editedRowsOutput = new Subject<DataListEditedRows>();

  /**
   * Emits the last editedRow
   */
  @WidgetOutput("editedRow")
  public editedRowOutput = new Subject<DataListEditedRow>();

  /**
   * Emits selected maintenance level
   */
  @WidgetOutput("maintenanceLevel")
  public maintenanceLevelChange = new ReplaySubject<number>(1);

  /**
   * Emits grid instance on initialization
   */
  @WidgetOutput("gridOutput")
  public gridOutput = new Subject<any>();

  /**
   * Emits after data is loaded in list
   */
  @WidgetOutput("dataLoaded")
  public dataLoadedOutput = new Subject<any>();

  /**
   * Emits number of entries (rows) in the data-list
   */
  @WidgetOutput("total")
  public total = new Subject<any>();

  /**
   * Emits value of the mode toggle-slider when it changes
   */
  @WidgetOutput("toggleButtonChange")
  public toggleButtonChange = new Subject<boolean>();

  /**
   * Emits row data when it is clicked in tile mode
   */
  @WidgetOutput("tileClicked")
  public tileClicked = new Subject<boolean>();

  /**
   * Sets data-list data
   */
  @WidgetInput("data")
  public data = new Subject<any[]>();

  /**
   * Shows only sepecified columns by column "field" value
   */
  @WidgetInput("filterColumns")
  public filterColumns = new Subject<any[]>();

  /**
   * Deprecated: feature is now removed.
   * Toggle expanding/collapsing data-list panel horizontally
   */
  @WidgetOutput("toggleSideCollapse")
  public toggleSideCollapse = new Subject();

  /**
   * Emits re-ordered rows.
   */
  @WidgetOutput("reorderedRows")
  public reorderedRows = new Subject();

  public unsubscribe = NgUnsubscribe.create();

  public title;
  public infoTitle;
  public subheader;
  public countDescription;

  public header;
  public renderCount;
  public isCollapsible;
  public isSideCollapsible;

  public maintenanceLevel;
  public clients;
  public locales;

  public selectedLocale;

  public export = new Subject<any>();
  public invertSelection = new Subject<any>();
  public infoText: string = "list.results";
  public focusFreeTextSearch: boolean = false;
  public wikiLink: string;
  public contentVisible: boolean = true;
  public withHeader: boolean = true;
  public withBorder: boolean = true;
  public hideTable: boolean = false;
  public languageSelectorValueProperty;
  public collapse: boolean = false;
  private showTableOnLinkInput: boolean;
  private langSelectUrlObs: Observable<string>;
  public selectedCell: any = null;
  public selectedColumn: any = null;

  public localstorageLocaleEntry: LocalStorageEntry;
  public localstorageClientEntry: LocalStorageEntry;

  public grid: IgxGridBaseDirective;

  public additionalParams: any = {};

  constructor(
    protected currentLocaleService: CurrentLocaleService,
    protected widgetFrameService: WidgetframeService,
    protected appdataStore: AppdataStore,
    protected localstorageService: LocalStorageService,
    protected unsavedChangesService: UnsavedChangesService,
    protected cdr: ChangeDetectorRef
  ) {}

  @WidgetConfigure()
  protected configureWidget(
    configuration: WidgetConfig<DataListConfiguration>
  ) {
    this.resetEditData
      .pipe(takeUntil(this.unsubscribe))
      .subscribe(() => this.refreshButtonsChannel.next());
    this.refreshButtonsChannel
      .pipe(takeUntil(this.unsubscribe))
      .subscribe(() => (this.refreshButtonsTrigger = new Date()));
    this.renderCount = getOrDefault(
      this.configuration.configuration.renderCount,
      true
    );

    this.header = getOrDefault(
      this.configuration.configuration.header,
      "primary"
    );
    this.infoText = configuration.configuration.infoText;
    this.focusFreeTextSearch = getOrDefault(
      this.configuration.configuration.focusFreeTextSearch,
      false
    );
    this.isCollapsible = getOrDefault(
      this.configuration.configuration.isCollapsible,
      false
    );
    this.isSideCollapsible = getOrDefault(
      this.configuration.configuration.isSideCollapsible,
      false
    );
    this.title = this.configuration.configuration.title;
    this.wikiLink = this.configuration.configuration.wikiLink;
    this.withHeader = getOrDefault(
      this.configuration.configuration.withHeader,
      true
    );
    this.withBorder = getOrDefault(
      this.configuration.configuration.withBorder,
      true
    );

    this.subheader = configuration.configuration.subheader;
    this.languageSelectorValueProperty = getOrDefault(
      this.configuration.configuration.languageSelectorValueProperty,
      "id"
    );
    this.countDescription = this.configuration.configuration.countDescription;
    this.showTableOnLinkInput = getOrDefault(
      this.configuration.configuration.showTableOnLinkInput,
      true
    );

    if (this.configuration.configuration.dynamicTitle) {
      this.dynamicPrefixOutput
        .pipe(takeUntil(this.unsubscribe))
        .subscribe((data) => {
          this.title = data + this.configuration.configuration.title;
        });
    }

    if (this.configuration.configuration.languageSelection) {
      this.localstorageLocaleEntry = this.localstorageService.getLocalStorageEntry(
        "data-list-locale",
        Scope.USER,
        DeletionMode.RESET
      );
      if (this.localstorageLocaleEntry.exists()) {
        this.setSelectedLocale(this.localstorageLocaleEntry.value);
      }

      if (this.configuration.configuration.languageSelectionUrl) {
        this.langSelectUrlObs = of(
          this.configuration.configuration.languageSelectionUrl
        );
      } else {
        this.langSelectUrlObs = this.appdataStore
          .getAppdata()
          .pipe(map((data) => data["ipim"]._links["locales"].href));
      }

      this.langSelectUrlObs
        .pipe(flatMap((uri) => this.widgetFrameService.getData(uri)))
        .subscribe((data) => {
          this.locales = data._embedded.locales;
          if (!this.selectedLocale) {
            this.locales.forEach((locale) => {
              if (locale.default) {
                this.setSelectedLocale(
                  locale[this.languageSelectorValueProperty]
                );
              }
            });
          }
        });
    }

    this.localstorageClientEntry = this.localstorageService.getLocalStorageEntry(
      "data-list-client",
      Scope.USER,
      DeletionMode.RESET
    );
    if (this.localstorageClientEntry.exists()) {
      this.maintenanceLevel = parseInt(this.localstorageClientEntry.value, 10);
      this.updateAdditionalParams(
        "maintenance-level-id",
        this.maintenanceLevel
      );
      this.maintenanceLevelChange.next(this.maintenanceLevel);
    }

    this.currentLocaleService
      .getCurrentLocale()
      .pipe(takeUntil(this.unsubscribe))
      .subscribe((link) => {
        if (
          this.configuration.configuration.maintenanceLevelLink ||
          this.configuration.configuration.maintenanceLevelSelection
        ) {
          const linkObs = configuration.configuration.maintenanceLevelLink
            ? of(configuration.configuration.maintenanceLevelLink)
            : this.appdataStore
                .getAppdata()
                .pipe(map((data) => data["ipim"]._links["all-clients"].href));

          linkObs
            .pipe(flatMap((link) => this.widgetFrameService.getData(link)))
            .subscribe((data) => {
              this.clients = data._embedded.clients;
              if (
                !this.maintenanceLevel ||
                this.clients.filter(
                  (client) => client.clientId == this.maintenanceLevel
                ).length < 1
              ) {
                this.maintenanceLevel = this.clients[0].clientId;
                if (this.localstorageClientEntry) {
                  this.localstorageClientEntry.value = this.maintenanceLevel;
                }
                this.updateAdditionalParams(
                  "maintenance-level-id",
                  this.maintenanceLevel
                );
                this.maintenanceLevelChange.next(this.maintenanceLevel);
              }
            });
        }

        if (this.configuration.configuration.languageSelection) {
          this.langSelectUrlObs
            .pipe(
              first(),
              flatMap((uri) => this.widgetFrameService.getData(uri))
            )
            .subscribe((data) => {
              this.locales = data._embedded.locales;
            });
        }
      });

    this.updateTitle
      .pipe(takeUntil(this.unsubscribe))
      .subscribe((title) => (this.title = title));
    this.titleInfo
      .pipe(takeUntil(this.unsubscribe))
      .subscribe((info) => (this.infoTitle = info));
    this.dataLocale.asObservable().subscribe((locale) => {
      this.setSelectedLocale(locale);
    });

    this.hide.asObservable().subscribe((hide) => {
      this.hideTable = hide;
    });

    this.inputChannel.asObservable().subscribe((uri) => {
      if (uri && this.showTableOnLinkInput) {
        this.hideTable = false;
      }
    });

    this.collapseChannel
      .asObservable()
      .pipe(takeUntil(this.unsubscribe))
      .subscribe((data) => {
        this.collapse = data;
      });
  }

  public onMaintenanceLevelChange(value) {
    this.restoreGlobalFilter.next(true);
    this.maintenanceLevelChange.next(value);
    this.localstorageClientEntry.value = value;
    this.maintenanceLevel = value;
    this.updateAdditionalParams("maintenance-level-id", value);
  }

  private updateAdditionalParams(key: string, value: any) {
    this.additionalParams = Object.assign({}, this.additionalParams, {
      [key]: value,
    });
  }

  setTotal(total) {
    this.total.next(total);
  }

  setGrid(grid) {
    this.grid = grid;
    this.gridOutput.next(this.grid);
  }

  setTileClicked(tileClicked) {
    this.tileClicked.next(tileClicked);
  }

  doExport(settings) {
    this.export.next(settings);
  }

  setSelectedCell(selectedCell) {
    this.selectedCell = selectedCell;
    this.selectedColumn = selectedCell.column.additionalTemplateContext;
  }

  public ngOnDestroy() {
    this.unsubscribe.destroy();
  }

  public setSelectedLocale(value) {
    this.unsavedChangesService
      .leaveContext(UNSAVED_CHANGES_DIALOG_CONFIG)
      .subscribe((response) => {
        if (!response) {
          return;
        }

        this.updateAdditionalParams("data-locale", value);

        this.selectedLocale = value;
        this.dataLocaleOutput.next(value);
        if (this.localstorageLocaleEntry) {
          this.localstorageLocaleEntry.value = value;
        }
        this.dataLocaleInputChannel.next(value);
      });
  }

  public onEditedRows(event) {
    this.editedRowsOutput.next(event);
    this.refreshButtonsChannel.next();
  }
}
<nm-widgetframe
  (toggleSideCollapse)="toggleSideCollapse.next()"
  [class.hidden]="hideTable"
  [configuration]="configuration"
  [contentVisible]="!collapse"
  [header]="header"
  [infoPlacement]="'bottom'"
  [infoText]="infoText"
  [infoTitle]="title"
  [infoWidth]="configuration.configuration.infoWidth"
  [infoHeight]="configuration.configuration.infoHeight"
  [isCollapsible]="isCollapsible"
  [isSideCollapsible]="isSideCollapsible"
  [toolbarInvisible]="!withHeader"
  [widgetId]="widgetId"
  [wikiLink]="wikiLink"
  [withBorder]="withBorder"
>
  <ng-container slot="title">
    {{title |translate}}
    <ng-container *ngIf="titleInfo | async as info"> {{info}} </ng-container>
    <ng-container
      *ngIf="renderCount && !configuration.configuration.totalWithSubheader && total | async as totalValue"
    >
      ( {{totalValue}}
      <ng-container *ngIf="countDescription">
        {{ countDescription | translate }}</ng-container
      >)
    </ng-container>
  </ng-container>
  <div slot="buttons" class="nm-widgetframe__buttons">
    <nm-context-selector
      *ngIf="clients"
      [contexts]="clients"
      [placeholder]="'table.head.maintenance-level' | translate"
      [(ngModel)]="maintenanceLevel"
      [clearable]="false"
      field="clientId"
      (ngModelChange)="onMaintenanceLevelChange($event)"
    >
    </nm-context-selector>
    <mat-form-field *ngIf="locales">
      <nm-combo
        class="combo"
        [options]="locales"
        [valueKey]="languageSelectorValueProperty"
        [displayKey]="'description'"
        [filterPlaceholder]="'placeholder.search' | translate"
        [openOnFocus]="true"
        [(value)]="selectedLocale"
        (valueChange)="setSelectedLocale($event)"
        [clearable]="false"
        [placeholder]="'table.head.language' | translate"
      ></nm-combo>
    </mat-form-field>
  </div>

  <div slot="content" class="nm-widgetframe__content">
    <div *ngIf="subheader" class="subheader">
      {{subheader |translate}}
      <ng-container
        *ngIf="renderCount && configuration.configuration.totalWithSubheader && total | async as totalValue"
        class="subheader"
      >
        ({{totalValue}})
      </ng-container>
    </div>
    <nm-data-list-component
      #grid
      (api)="apiOutput.next($event)"
      (currentData)="currentData.next($event)"
      (dataLoaded)="dataLoadedOutput.next()"
      (dataType)="dataTypeOutput.next($event)"
      (dynamicColumns)="dynamicColumnsOutput.next($event)"
      (dynamicPrefix)="dynamicPrefixOutput.next($event)"
      (editableCell)="editableCell.next($event)"
      (editedRows)="onEditedRows($event)"
      (editedRow)="editedRowOutput.next($event)"
      (gridOutput)="setGrid($event)"
      (isValid)="validationOutput.next($event)"
      (rowEditEnter)="rowEditEnter.next($event)"
      (rowEditLeave)="rowEditLeave.next($event)"
      (selectedItems)="selectedItems.next($event)"
      (shownAttributes)="shownAttributesOutput.next($event)"
      (total)="setTotal($event)"
      (viewMode)="viewModeOutput.next($event)"
      [attributeUrl]="attributeUrlInput"
      [clearFiltersAndSorting]="clearFiltersAndSortingChannel"
      [rowSelection]="rowSelectionChannel"
      [clearRowSelection]="clearRowSelectionChannel"
      [rowSelection]="rowSelection"
      [configuration]="configuration.configuration"
      [data]="data"
      [dataTypeInput]="dataTypeInput"
      [dataTypeMode]="dataTypeMode"
      [eagerLimit]="eagerLimit"
      [endGridEditMode]="endGridEditMode"
      [filterColumns]="filterColumns"
      [export]="export"
      [locale]="dataLocaleInputChannel"
      [products]="productsInput"
      [refreshRows]="refreshRows"
      [reload]="reloadChannel"
      [contextIdentifier]="contextIdentifierChannel"
      [resetEditData]="resetEditData"
      [reset]="resetChannel"
      [shownAttributesIn]="shownAttributesIn"
      [uri]="inputChannel"
      [dynamicColumnsIn]="dynamicColumnsIn"
      [data]="data"
      [restoreGlobalFilter]="restoreGlobalFilter"
      [additionalParams]="additionalParams"
      (statusOut)="statusOutput.next($event)"
      (tileClicked)="setTileClicked($event)"
      (reorderedRows)="reorderedRows.next($event)"
      [preselectAttributeProfile]="preselectAttributeProfile"
      [widgetId]="widgetId"
      (onCellSelect)="setSelectedCell($event)"
    >
    </nm-data-list-component>

    <nm-default-data-list-footer
      (export)="doExport($event)"
      [api]="apiOutput | async"
      [configuration]="configuration.configuration"
      [grid]="grid"
      [column]="selectedColumn"
      [cell]="selectedCell"
      [link]="grid.listService ? grid.listService.linkWithoutPaging: ''"
      [refreshButtons]="refreshButtonsTrigger"
      [selected-items]="selectedItems"
      [total]="total"
      [viewMode]="viewModeOutput | async"
      [dataType]="dataTypeOutput | async"
    >
    </nm-default-data-list-footer>
  </div>
</nm-widgetframe>
Legend
Html element
Component
Html element with directive

results matching ""

    No results matching ""