@anglr/grid
Version:
Angular module displaying grid
162 lines • 6.2 kB
JavaScript
import { Injectable, ElementRef, Injector, inject, signal } from '@angular/core';
import { toObservable } from '@angular/core/rxjs-interop';
import { extend } from '@jscrpt/common/extend';
import { Subject } from 'rxjs';
import { debounceTime, skip } from 'rxjs/operators';
import { DataLoaderState, GridPluginType } from '../../misc/enums';
import { GRID_PLUGIN_INSTANCES } from '../../misc/tokens';
import * as i0 from "@angular/core";
/**
* Abstract class that represents any data loader component
*/
export class DataLoaderAbstractComponent {
/**
* @inheritdoc
*/
get state() {
return this.ɵstate.asReadonly();
}
/**
* @inheritdoc
*/
get options() {
return this.ɵoptions;
}
set options(options) {
this.ɵoptions = extend(true, this.ɵoptions, options);
}
//######################### constructor #########################
constructor(defaultOptions, options) {
//######################### protected fields #########################
/**
* Angular injector used for injecting dependencies
*/
this.injector = inject(Injector);
/**
* Current state of data loader
*/
this.ɵstate = signal(DataLoaderState.NotLoadedYet);
/**
* Subject for debounce dataCallback
*/
this.debounceSubject = new Subject();
//######################### public properties #########################
/**
* @inheritdoc
*/
this.pluginElement = inject((ElementRef));
/**
* @inheritdoc
*/
this.gridPlugins = inject(GRID_PLUGIN_INSTANCES, { optional: true });
this.ɵoptions = extend(true, {}, defaultOptions, options);
}
//######################### public methods - implementation of OnDestroy #########################
/**
* Called when component is destroyed
*/
ngOnDestroy() {
this.debounceSubscription?.unsubscribe();
this.debounceSubscription = null;
this.pageChangedSubscription?.unsubscribe();
this.pageChangedSubscription = null;
this.itemsPerPageChangedSubscription?.unsubscribe();
this.itemsPerPageChangedSubscription = null;
this.orderingChangedSubscription?.unsubscribe();
this.orderingChangedSubscription = null;
}
//######################### public methodes - implements DataLoader #########################
/**
* @inheritdoc
*/
initialize(force) {
if (!this.gridPlugins) {
throw new Error('DataLoaderAbstractComponent: missing gridPlugins!');
}
this.registerDebounce();
const paging = this.gridPlugins[GridPluginType.Paging];
//paging obtained and its different instance
if (force || (this.paging && this.paging != paging)) {
this.pageChangedSubscription?.unsubscribe();
this.pageChangedSubscription = null;
this.itemsPerPageChangedSubscription?.unsubscribe();
this.itemsPerPageChangedSubscription = null;
this.paging = null;
}
//no paging obtained
if (!this.paging) {
this.paging = paging;
this.pageChangedSubscription = toObservable(this.paging.page, { injector: this.injector })
.pipe(skip(1))
.subscribe(() => this.loadData());
this.itemsPerPageChangedSubscription = toObservable(this.paging.itemsPerPage, { injector: this.injector })
.pipe(skip(1))
.subscribe(() => this.loadData());
}
const ordering = this.gridPlugins[GridPluginType.Ordering];
//ordering obtained and its different instance
if (force || (this.ordering && this.ordering != ordering)) {
this.orderingChangedSubscription?.unsubscribe();
this.orderingChangedSubscription = null;
this.ordering = null;
}
//no ordering obtained
if (!this.ordering) {
this.ordering = ordering;
this.orderingChangedSubscription = toObservable(this.ordering.ordering, { injector: this.injector })
.pipe(skip(1))
.subscribe(() => this.loadData());
}
if (this.options.autoLoadData) {
this.loadData();
}
}
/**
* @inheritdoc
*/
initOptions() {
}
/**
* @inheritdoc
*/
invalidateVisuals() {
}
/**
* @inheritdoc
*/
loadData(force) {
this.debounceSubject.next(!!force);
}
/**
* Check for changes on input
*/
checkChanges() {
if (this.paging?.page != this.lastPage ||
this.paging?.itemsPerPage != this.lastItemsPerPage ||
this.ordering?.ordering != this.lastOrdering) {
this.lastPage = this.paging?.page();
this.lastItemsPerPage = this.paging?.itemsPerPage();
this.lastOrdering = this.ordering?.ordering();
return true;
}
return false;
}
//######################### protected methods #########################
/**
* Registers debounce subject
*/
registerDebounce() {
this.debounceSubscription?.unsubscribe();
this.debounceSubscription = null;
this.debounceSubscription = this.debounceSubject
.asObservable()
.pipe(debounceTime(this.options.debounceDataCallback))
.subscribe(force => this.loadGridData(force));
}
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: DataLoaderAbstractComponent, deps: "invalid", target: i0.ɵɵFactoryTarget.Injectable }); }
static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: DataLoaderAbstractComponent }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.1.0", ngImport: i0, type: DataLoaderAbstractComponent, decorators: [{
type: Injectable
}], ctorParameters: () => [{ type: undefined }, { type: undefined }] });
//# sourceMappingURL=dataLoaderAbstract.component.js.map