Showing
6 changed files
with
20 additions
and
3 deletions
@@ -225,9 +225,12 @@ | @@ -225,9 +225,12 @@ | ||
225 | 'tb-current-entity': dataSource.isCurrentEntity(entity)}" | 225 | 'tb-current-entity': dataSource.isCurrentEntity(entity)}" |
226 | *matRowDef="let entity; columns: displayedColumns;" (click)="onRowClick($event, entity)"></mat-row> | 226 | *matRowDef="let entity; columns: displayedColumns;" (click)="onRowClick($event, entity)"></mat-row> |
227 | </table> | 227 | </table> |
228 | - <span [fxShow]="!(isLoading$ | async) && (dataSource.isEmpty() | async)" | 228 | + <span [fxShow]="!(isLoading$ | async) && (dataSource.isEmpty() | async) && !dataSource.dataLoading" |
229 | fxLayoutAlign="center center" | 229 | fxLayoutAlign="center center" |
230 | class="no-data-found">{{ translations.noEntities | translate }}</span> | 230 | class="no-data-found">{{ translations.noEntities | translate }}</span> |
231 | + <span [fxShow]="dataSource.dataLoading" | ||
232 | + fxLayoutAlign="center center" | ||
233 | + class="no-data-found">{{ 'common.loading' | translate }}</span> | ||
231 | </div> | 234 | </div> |
232 | <mat-divider *ngIf="displayPagination"></mat-divider> | 235 | <mat-divider *ngIf="displayPagination"></mat-divider> |
233 | <mat-paginator *ngIf="displayPagination" | 236 | <mat-paginator *ngIf="displayPagination" |
@@ -345,6 +345,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | @@ -345,6 +345,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | ||
345 | (entity) => { | 345 | (entity) => { |
346 | if (entity) { | 346 | if (entity) { |
347 | this.updateData(); | 347 | this.updateData(); |
348 | + this.entitiesTableConfig.entityAdded(entity); | ||
348 | } | 349 | } |
349 | } | 350 | } |
350 | ); | 351 | ); |
@@ -352,6 +353,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | @@ -352,6 +353,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | ||
352 | 353 | ||
353 | onEntityUpdated(entity: BaseData<HasId>) { | 354 | onEntityUpdated(entity: BaseData<HasId>) { |
354 | this.updateData(false); | 355 | this.updateData(false); |
356 | + this.entitiesTableConfig.entityUpdated(entity); | ||
355 | } | 357 | } |
356 | 358 | ||
357 | onEntityAction(action: EntityAction<BaseData<HasId>>) { | 359 | onEntityAction(action: EntityAction<BaseData<HasId>>) { |
@@ -375,6 +377,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | @@ -375,6 +377,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | ||
375 | this.entitiesTableConfig.deleteEntity(entity.id).subscribe( | 377 | this.entitiesTableConfig.deleteEntity(entity.id).subscribe( |
376 | () => { | 378 | () => { |
377 | this.updateData(); | 379 | this.updateData(); |
380 | + this.entitiesTableConfig.entitiesDeleted([entity.id]); | ||
378 | } | 381 | } |
379 | ); | 382 | ); |
380 | } | 383 | } |
@@ -402,6 +405,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | @@ -402,6 +405,7 @@ export class EntitiesTableComponent extends PageComponent implements AfterViewIn | ||
402 | forkJoin(tasks).subscribe( | 405 | forkJoin(tasks).subscribe( |
403 | () => { | 406 | () => { |
404 | this.updateData(); | 407 | this.updateData(); |
408 | + this.entitiesTableConfig.entitiesDeleted(entities.map((e) => e.id)); | ||
405 | } | 409 | } |
406 | ); | 410 | ); |
407 | } | 411 | } |
@@ -35,6 +35,8 @@ export class EntitiesDataSource<T extends BaseData<HasId>, P extends PageLink = | @@ -35,6 +35,8 @@ export class EntitiesDataSource<T extends BaseData<HasId>, P extends PageLink = | ||
35 | 35 | ||
36 | public currentEntity: T = null; | 36 | public currentEntity: T = null; |
37 | 37 | ||
38 | + public dataLoading = true; | ||
39 | + | ||
38 | constructor(private fetchFunction: EntitiesFetchFunction<T, P>, | 40 | constructor(private fetchFunction: EntitiesFetchFunction<T, P>, |
39 | protected selectionEnabledFunction: EntityBooleanFunction<T>, | 41 | protected selectionEnabledFunction: EntityBooleanFunction<T>, |
40 | protected dataLoadedFunction: (col?: number, row?: number) => void) {} | 42 | protected dataLoadedFunction: (col?: number, row?: number) => void) {} |
@@ -56,6 +58,7 @@ export class EntitiesDataSource<T extends BaseData<HasId>, P extends PageLink = | @@ -56,6 +58,7 @@ export class EntitiesDataSource<T extends BaseData<HasId>, P extends PageLink = | ||
56 | } | 58 | } |
57 | 59 | ||
58 | loadEntities(pageLink: P): Observable<PageData<T>> { | 60 | loadEntities(pageLink: P): Observable<PageData<T>> { |
61 | + this.dataLoading = true; | ||
59 | const result = new ReplaySubject<PageData<T>>(); | 62 | const result = new ReplaySubject<PageData<T>>(); |
60 | this.fetchFunction(pageLink).pipe( | 63 | this.fetchFunction(pageLink).pipe( |
61 | tap(() => { | 64 | tap(() => { |
@@ -68,6 +71,7 @@ export class EntitiesDataSource<T extends BaseData<HasId>, P extends PageLink = | @@ -68,6 +71,7 @@ export class EntitiesDataSource<T extends BaseData<HasId>, P extends PageLink = | ||
68 | this.pageDataSubject.next(pageData); | 71 | this.pageDataSubject.next(pageData); |
69 | result.next(pageData); | 72 | result.next(pageData); |
70 | this.dataLoadedFunction(); | 73 | this.dataLoadedFunction(); |
74 | + this.dataLoading = false; | ||
71 | } | 75 | } |
72 | ); | 76 | ); |
73 | return result; | 77 | return result; |
@@ -33,6 +33,8 @@ import { EntityTabsComponent } from '../../components/entity/entity-tabs.compone | @@ -33,6 +33,8 @@ import { EntityTabsComponent } from '../../components/entity/entity-tabs.compone | ||
33 | 33 | ||
34 | export type EntityBooleanFunction<T extends BaseData<HasId>> = (entity: T) => boolean; | 34 | export type EntityBooleanFunction<T extends BaseData<HasId>> = (entity: T) => boolean; |
35 | export type EntityStringFunction<T extends BaseData<HasId>> = (entity: T) => string; | 35 | export type EntityStringFunction<T extends BaseData<HasId>> = (entity: T) => string; |
36 | +export type EntityVoidFunction<T extends BaseData<HasId>> = (entity: T) => void; | ||
37 | +export type EntityIdsVoidFunction<T extends BaseData<HasId>> = (ids: HasUUID[]) => void; | ||
36 | export type EntityCountStringFunction = (count: number) => string; | 38 | export type EntityCountStringFunction = (count: number) => string; |
37 | export type EntityTwoWayOperation<T extends BaseData<HasId>> = (entity: T) => Observable<T>; | 39 | export type EntityTwoWayOperation<T extends BaseData<HasId>> = (entity: T) => Observable<T>; |
38 | export type EntityByIdOperation<T extends BaseData<HasId>> = (id: HasUUID) => Observable<T>; | 40 | export type EntityByIdOperation<T extends BaseData<HasId>> = (id: HasUUID) => Observable<T>; |
@@ -175,6 +177,9 @@ export class EntityTableConfig<T extends BaseData<HasId>, P extends PageLink = P | @@ -175,6 +177,9 @@ export class EntityTableConfig<T extends BaseData<HasId>, P extends PageLink = P | ||
175 | onEntityAction: EntityActionFunction<T> = () => false; | 177 | onEntityAction: EntityActionFunction<T> = () => false; |
176 | handleRowClick: EntityRowClickFunction<L> = () => false; | 178 | handleRowClick: EntityRowClickFunction<L> = () => false; |
177 | entityTitle: EntityStringFunction<T> = (entity) => entity?.name; | 179 | entityTitle: EntityStringFunction<T> = (entity) => entity?.name; |
180 | + entityAdded: EntityVoidFunction<T> = () => {}; | ||
181 | + entityUpdated: EntityVoidFunction<T> = () => {}; | ||
182 | + entitiesDeleted: EntityIdsVoidFunction<T> = () => {}; | ||
178 | } | 183 | } |
179 | 184 | ||
180 | export function checkBoxCell(value: boolean): string { | 185 | export function checkBoxCell(value: boolean): string { |
@@ -43,7 +43,7 @@ export interface NavTreeEditCallbacks { | @@ -43,7 +43,7 @@ export interface NavTreeEditCallbacks { | ||
43 | nodeIsLoaded?: (id: string) => boolean; | 43 | nodeIsLoaded?: (id: string) => boolean; |
44 | refreshNode?: (id: string) => void; | 44 | refreshNode?: (id: string) => void; |
45 | updateNode?: (id: string, newName: string) => void; | 45 | updateNode?: (id: string, newName: string) => void; |
46 | - createNode?: (parentId: string, node: NavTreeNode, pos: number) => void; | 46 | + createNode?: (parentId: string, node: NavTreeNode, pos: number | string) => void; |
47 | deleteNode?: (id: string) => void; | 47 | deleteNode?: (id: string) => void; |
48 | disableNode?: (id: string) => void; | 48 | disableNode?: (id: string) => void; |
49 | enableNode?: (id: string) => void; | 49 | enableNode?: (id: string) => void; |
@@ -380,7 +380,8 @@ | @@ -380,7 +380,8 @@ | ||
380 | "enter-username": "Enter username", | 380 | "enter-username": "Enter username", |
381 | "enter-password": "Enter password", | 381 | "enter-password": "Enter password", |
382 | "enter-search": "Enter search", | 382 | "enter-search": "Enter search", |
383 | - "created-time": "Created time" | 383 | + "created-time": "Created time", |
384 | + "loading": "Loading..." | ||
384 | }, | 385 | }, |
385 | "content-type": { | 386 | "content-type": { |
386 | "json": "Json", | 387 | "json": "Json", |