diff --git a/src/assets/styles/common-loading.scss b/src/assets/styles/common-loading.scss index 3f997e1..39a8032 100644 --- a/src/assets/styles/common-loading.scss +++ b/src/assets/styles/common-loading.scss @@ -28,6 +28,9 @@ animation-iteration-count: infinite; animation-timing-function: linear; + height: fit-content; + width: fit-content; + > mat-icon { height: 10px; width: 10px; diff --git a/src/lib/listing/workflow/column-header/column-header.component.ts b/src/lib/listing/workflow/column-header/column-header.component.ts index 2e45723..5403981 100644 --- a/src/lib/listing/workflow/column-header/column-header.component.ts +++ b/src/lib/listing/workflow/column-header/column-header.component.ts @@ -75,7 +75,7 @@ export class ColumnHeaderComponent extend this.selectionColumnChange.emit(this.selectionColumn); setTimeout(() => { this._setupResizeObserver(); - }, 0); + }, 10); } disableSelection(): void { diff --git a/src/lib/listing/workflow/workflow.component.html b/src/lib/listing/workflow/workflow.component.html index f87f517..00b74fd 100644 --- a/src/lib/listing/workflow/workflow.component.html +++ b/src/lib/listing/workflow/workflow.component.html @@ -39,7 +39,7 @@ [ngClass]="all[entity.id].classes$ | async" cdkDrag > - + @@ -52,9 +52,11 @@
- + [style.max-width]="itemWidth + 'px'" + > +
+
diff --git a/src/lib/listing/workflow/workflow.component.ts b/src/lib/listing/workflow/workflow.component.ts index 58ace36..405fdb2 100644 --- a/src/lib/listing/workflow/workflow.component.ts +++ b/src/lib/listing/workflow/workflow.component.ts @@ -82,8 +82,8 @@ export class WorkflowComponent extends Au @Output() readonly noDataAction = new EventEmitter(); @Output() readonly addElement = new EventEmitter(); - itemWidth?: number; itemHeight?: number; + itemWidth?: number; dragging = false; sourceColumn?: WorkflowColumn; selectionColumn?: WorkflowColumn; @@ -91,7 +91,7 @@ export class WorkflowComponent extends Au all: { [key: string]: EntityWrapper } = {}; @ViewChildren(CdkDropList) private readonly _dropLists!: QueryList; private _observer = new ResizeObserver((entries: ResizeObserverEntry[]) => { - this._updateItemWidth(entries[0]); + this._updateItemSize(entries[0]); }); constructor( @@ -120,6 +120,9 @@ export class WorkflowComponent extends Au } ngOnInit(): void { + for (const column of this.config.columns) { + column.entities = new BehaviorSubject([]); + } this.addSubscription = this.listingService.displayed$.pipe(tap(entities => this._updateConfigItems(entities))).subscribe(); this.addSubscription = this.entitiesService.noData$ .pipe( @@ -171,14 +174,14 @@ export class WorkflowComponent extends Au } @Debounce(30) - private _updateItemWidth(entry: ResizeObserverEntry): void { + private _updateItemSize(entry: ResizeObserverEntry): void { if (entry.contentRect.height === 0) { this._observer.unobserve(entry.target); this._setupResizeObserver(); return; } - this.itemWidth = entry.contentRect.width; this.itemHeight = entry.contentRect.height; + this.itemWidth = entry.contentRect.width; this._changeRef.markForCheck(); }