Commit ac963baa62feefe5a6dab8b5b940f95184ec28f5

Authored by Igor Kulikov
1 parent e103d5a8

UI: Entities table improvements

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