nm-data-list
src/app/shared/widgets/data-list/data-list.component.widget.ts
| selector | nm-data-list |
| styleUrls | data-list.component.widget.scss |
| templateUrl | ./data-list.component.widget.html |
constructor(currentLocaleService: CurrentLocaleService, widgetFrameService: WidgetframeService, appdataStore: AppdataStore, localstorageService: LocalStorageService, unsavedChangesService: UnsavedChangesService, cdr: ChangeDetectorRef)
|
|||||||||||||||||||||
|
Parameters :
|
| Protected configureWidget | ||||||
configureWidget(configuration: WidgetConfig
|
||||||
Decorators : WidgetConfigure
|
||||||
|
Parameters :
Returns :
void
|
| doExport | ||||
doExport(settings: )
|
||||
|
Parameters :
Returns :
void
|
| Public ngOnDestroy |
ngOnDestroy()
|
|
Returns :
void
|
| Public onEditedRows | ||||
onEditedRows(event: )
|
||||
|
Parameters :
Returns :
void
|
| Public onMaintenanceLevelChange | ||||
onMaintenanceLevelChange(value: )
|
||||
|
Parameters :
Returns :
void
|
| setGrid | ||||
setGrid(grid: )
|
||||
|
Parameters :
Returns :
void
|
| setSelectedCell | ||||
setSelectedCell(selectedCell: )
|
||||
|
Parameters :
Returns :
void
|
| Public setSelectedLocale | ||||
setSelectedLocale(value: )
|
||||
|
Parameters :
Returns :
void
|
| setTileClicked | ||||
setTileClicked(tileClicked: )
|
||||
|
Parameters :
Returns :
void
|
| setTotal | ||||
setTotal(total: )
|
||||
|
Parameters :
Returns :
void
|
| Private updateAdditionalParams |
updateAdditionalParams(key: string, value: any)
|
|
Returns :
void
|
| Public additionalParams |
additionalParams:
|
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:
|
Type : boolean
|
Default value : false
|
| Public collapseChannel |
collapseChannel:
|
Default value : new Subject<boolean>()
|
Decorators : WidgetInput
|
|
Collapses/Expands the data-list panel |
| Public configuration |
configuration:
|
Type : WidgetConfig<DataListConfiguration>
|
Decorators : WidgetConfiguration
|
| Public contentVisible |
contentVisible:
|
Type : boolean
|
Default value : true
|
| 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 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:
|
Type : Subject<Column[]>
|
Default value : new ReplaySubject(1)
|
Decorators : WidgetOutput
|
|
Emits dynamic columns |
| 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:
|
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:
|
Type : boolean
|
Default value : false
|
| Public grid |
grid:
|
Type : IgxGridBaseDirective
|
| Public gridOutput |
gridOutput:
|
Default value : new Subject<any>()
|
Decorators : WidgetOutput
|
|
Emits grid instance on initialization |
| Public header |
header:
|
| Public hide |
hide:
|
Type : ReplaySubject<boolean>
|
Default value : new ReplaySubject<boolean>(1)
|
Decorators : WidgetInput
|
|
Hides/Shows the data-list |
| Public hideTable |
hideTable:
|
Type : boolean
|
Default value : false
|
| Public infoText |
infoText:
|
Type : string
|
Default value : "list.results"
|
| Public infoTitle |
infoTitle:
|
| Public inputChannel |
inputChannel:
|
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:
|
Type : Observable<string>
|
| Public languageSelectorValueProperty |
languageSelectorValueProperty:
|
| Public locales |
locales:
|
| Public localstorageClientEntry |
localstorageClientEntry:
|
Type : LocalStorageEntry
|
| Public localstorageLocaleEntry |
localstorageLocaleEntry:
|
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 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:
|
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:
|
Type : any
|
Default value : null
|
| Public selectedColumn |
selectedColumn:
|
Type : any
|
Default value : null
|
| Public selectedItems |
selectedItems:
|
Type : Subject<SelectionParams>
|
Default value : new Subject<SelectionParams>()
|
Decorators : WidgetOutput
|
|
Emits all selected items |
| Public selectedLocale |
selectedLocale:
|
| Public shownAttributesOutput |
shownAttributesOutput:
|
Default value : new ReplaySubject<any[]>(1)
|
Decorators : WidgetOutput
|
|
Emits all shown attributes |
| Private showTableOnLinkInput |
showTableOnLinkInput:
|
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:
|
Type : string
|
Decorators : WidgetId
|
| Public wikiLink |
wikiLink:
|
Type : string
|
| Public withBorder |
withBorder:
|
Type : boolean
|
Default value : true
|
| Public withHeader |
withHeader:
|
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>