Marmelator/common-ui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Table column configs can be updated

Browse Source
This commit is contained in:
Adina Țeudan 2021-12-14 12:00:46 +02:00
parent c3244477c0
commit e0de29cb68
2 changed files with 17 additions and 14 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/lib/listing/services/entities.service.ts
View File

@ -21,7 +21,7 @@ export class EntitiesService<E extends IListable, I = E> extends GenericService<
readonly noData$: Observable<boolean>;
readonly all$: Observable<E[]>;
readonly allLength$: Observable<number>;
readonly entityChanged$ = new Subject<E>();
protected readonly entityChanged$ = new Subject<E>();
private readonly _all$ = new BehaviorSubject<E[]>([]);
constructor(

29
src/lib/listing/table/table.component.ts
View File

@ -1,17 +1,19 @@
import {
ChangeDetectionStrategy,
ChangeDetectorRef,
Component,
EventEmitter,
forwardRef,
Inject,
Input,
OnInit,
OnChanges,
Output,
SimpleChanges,
TemplateRef,
ViewChild,
ViewContainerRef,
} from '@angular/core';
import { AutoUnsubscribe, Required } from '../../utils';
import { AutoUnsubscribe } from '../../utils';
import { IListable, ListingModes, TableColumnConfig } from '../models';
import { ListingComponent } from '../listing-component.directive';
import { EntitiesService } from '../services';
@ -20,18 +22,19 @@ import { TableContentComponent } from '../table-content/table-content.component'
const SCROLLBAR_WIDTH = 11;
@Component({
selector: 'iqser-table',
selector: 'iqser-table [tableColumnConfigs] [itemSize]',
templateUrl: './table.component.html',
styleUrls: ['./table.component.scss'],
changeDetection: ChangeDetectionStrategy.OnPush,
})
export class TableComponent<T extends IListable> extends AutoUnsubscribe implements OnInit {
export class TableComponent<T extends IListable> extends AutoUnsubscribe implements OnChanges {
readonly listingModes = ListingModes;
@Input() tableColumnConfigs!: readonly TableColumnConfig<T>[];
@Input() bulkActions?: TemplateRef<unknown>;
@Input() actionsTemplate?: TemplateRef<unknown>;
@Input() headerTemplate?: TemplateRef<unknown>;
@Input() @Required() itemSize!: number;
@Input() itemSize!: number;
@Input() selectionEnabled = false;
@Input() hasScrollButton = false;
@Input() emptyColumnWidth?: string;
@ -53,31 +56,31 @@ export class TableComponent<T extends IListable> extends AutoUnsubscribe impleme
constructor(
@Inject(forwardRef(() => ListingComponent)) readonly listingComponent: ListingComponent<T>,
private readonly _hostRef: ViewContainerRef,
private readonly _changeRef: ChangeDetectorRef,
readonly entitiesService: EntitiesService<T>,
) {
super();
}
get tableColumnConfigs(): readonly TableColumnConfig<T>[] {
return this.listingComponent.tableColumnConfigs;
}
get tableHeaderLabel(): string | undefined {
return this.listingComponent.tableHeaderLabel;
}
scrollToLastIndex(): void {
this._tableContent.scrollToLastIndex();
ngOnChanges(changes: SimpleChanges): void {
if (changes.tableColumnConfigs) {
this._setStyles();
}
}
ngOnInit(): void {
this._setStyles();
scrollToLastIndex(): void {
this._tableContent.scrollToLastIndex();
}
private _setStyles(): void {
const element = this._hostRef.element.nativeElement as HTMLElement;
this._setColumnsWidth(element);
this._setItemSize(element);
this._changeRef.markForCheck();
}
private _setColumnsWidth(element: HTMLElement) {