@sumaris-net/ngx-components 2.4.19 → 2.4.20-rc2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (9) hide show
  1. package/esm2020/src/app/core/form/buttons/form-buttons-bar.component.mjs +3 -3
  2. package/esm2020/src/app/core/table/async-table.class.mjs +17 -6
  3. package/esm2020/src/app/shared/image/gallery/testing/gallery.service.testing.mjs +9 -8
  4. package/fesm2015/sumaris-net.ngx-components.mjs +25 -13
  5. package/fesm2015/sumaris-net.ngx-components.mjs.map +1 -1
  6. package/fesm2020/sumaris-net.ngx-components.mjs +25 -13
  7. package/fesm2020/sumaris-net.ngx-components.mjs.map +1 -1
  8. package/package.json +1 -1
  9. package/src/app/core/table/async-table.class.d.ts +3 -0
package/fesm2020/sumaris-net.ngx-components.mjs CHANGED
@@ -23369,12 +23369,12 @@ class FormButtonsBarComponent {
23369
23369
  FormButtonsBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FormButtonsBarComponent, deps: [{ token: Hotkeys }, { token: MenuService }], target: i0.ɵɵFactoryTarget.Component });
23370
23370
  FormButtonsBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.2.12", type: FormButtonsBarComponent, selector: "app-form-buttons-bar", inputs: { disabled: "disabled", disabledCancel: "disabledCancel", classList: "classList" }, outputs: { onCancel: "onCancel", onSave: "onSave", onNext: "onNext", onBack: "onBack" }, providers: [
23371
23371
  { provide: FormButtonsBarToken, useExisting: FormButtonsBarComponent }
23372
- ], ngImport: i0, template: "\n<ion-toolbar [class]=\"classList\">\n <ion-row class=\"ion-no-padding\" nowrap>\n <!-- show menu button -->\n <ion-col size=\"auto\" class=\"hidden-xs hidden-sm\">\n <ion-menu-toggle>\n <button\n mat-icon-button\n color=\"accent\"\n [title]=\"'COMMON.BTN_SHOW_MENU' | translate\"\n (click)=\"menu.toggleSplitPaneWhen()\">\n <mat-icon><span>&#xbb;</span></mat-icon>\n </button>\n </ion-menu-toggle>\n </ion-col>\n\n <ion-col class=\"app-form-buttons-bar-content\">\n <ng-content></ng-content>\n </ion-col>\n\n <ion-col size=\"auto\">\n\n <ng-content select=\"[slot=end]\"></ng-content>\n\n <!-- close (go back) -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onBack.emit($event)\"\n (keyup.enter)=\"onBack.emit($event)\"\n *ngIf=\"onBack.observers | isNotEmptyArray\">\n <ion-label translate>COMMON.BTN_CLOSE</ion-label>\n </ion-button>\n\n <!-- reload -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onCancel.emit($event)\"\n (keyup.enter)=\"onCancel.emit($event)\"\n [disabled]=\"disabledCancel\">\n <ion-icon slot=\"start\" name=\"refresh\"></ion-icon>\n <ion-label translate>COMMON.BTN_RESET</ion-label>\n </ion-button>\n\n <!-- next -->\n <ion-button fill=\"solid\" (click)=\"onNext.emit($event)\" (keyup.enter)=\"onNext.emit($event)\" *ngIf=\"onNext.observers | isNotEmptyArray\">\n <ion-label translate>COMMON.BTN_NEXT</ion-label>\n <ion-icon slot=\"end\" name=\"arrow-forward\"></ion-icon>\n </ion-button>\n\n <!-- save -->\n <ion-button [fill]=\"disabled ? 'clear' : 'solid'\"\n (click)=\"onSave.emit($event)\"\n (keyup.enter)=\"onSave.emit($event)\" color=\"danger\"\n [disabled]=\"disabled\">\n <ion-label [innerHTML]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT'|translate\" [title]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT_HELP'|translate\"></ion-label>\n </ion-button>\n </ion-col>\n </ion-row>\n</ion-toolbar>\n", styles: [":host{width:100%}:host ion-toolbar{height:var(--app-form-buttons-bar-height);padding:0 6px}:host ion-col{padding:0}ion-menu-toggle button{top:4px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }, { kind: "component", type: i1.IonRow, selector: "ion-row" }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i1$2.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: NotEmptyArrayPipe, name: "isNotEmptyArray" }] });
23372
+ ], ngImport: i0, template: "\n<ion-toolbar [class]=\"classList\">\n <ion-row class=\"ion-no-padding\" nowrap>\n <!-- show menu button -->\n <ion-col size=\"auto\" class=\"hidden-xs hidden-sm\">\n <ion-menu-toggle>\n <button\n mat-icon-button\n color=\"accent\"\n [title]=\"'COMMON.BTN_SHOW_MENU' | translate\"\n (click)=\"menu.toggleSplitPaneWhen()\">\n <mat-icon><span>&#xbb;</span></mat-icon>\n </button>\n </ion-menu-toggle>\n </ion-col>\n\n <ion-col class=\"app-form-buttons-bar-content\">\n <ng-content></ng-content>\n </ion-col>\n\n <ion-col size=\"auto\" class=\"app-form-buttons-bar-buttons\">\n\n <ng-content select=\"[slot=end]\"></ng-content>\n\n <!-- close (go back) -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onBack.emit($event)\"\n (keyup.enter)=\"onBack.emit($event)\"\n *ngIf=\"onBack.observers | isNotEmptyArray\"\n class=\"back\">\n <ion-label translate>COMMON.BTN_CLOSE</ion-label>\n </ion-button>\n\n <!-- reload -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onCancel.emit($event)\"\n (keyup.enter)=\"onCancel.emit($event)\"\n [disabled]=\"disabledCancel\"\n class=\"cancel\">\n <ion-icon slot=\"start\" name=\"refresh\"></ion-icon>\n <ion-label translate>COMMON.BTN_RESET</ion-label>\n </ion-button>\n\n <!-- next -->\n <ion-button fill=\"solid\" (click)=\"onNext.emit($event)\" (keyup.enter)=\"onNext.emit($event)\" *ngIf=\"onNext.observers | isNotEmptyArray\"\n class=\"next\">\n <ion-label translate>COMMON.BTN_NEXT</ion-label>\n <ion-icon slot=\"end\" name=\"arrow-forward\"></ion-icon>\n </ion-button>\n\n <!-- save -->\n <ion-button [fill]=\"disabled ? 'clear' : 'solid'\"\n (click)=\"onSave.emit($event)\"\n (keyup.enter)=\"onSave.emit($event)\" color=\"danger\"\n [disabled]=\"disabled\"\n class=\"save\">\n <ion-label [innerHTML]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT'|translate\" [title]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT_HELP'|translate\"></ion-label>\n </ion-button>\n </ion-col>\n </ion-row>\n</ion-toolbar>\n", styles: [":host{width:100%}:host ion-toolbar{height:var(--app-form-buttons-bar-height);padding:0 6px}:host ion-col{padding:0}ion-menu-toggle button{top:4px}\n"], dependencies: [{ kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i1.IonButton, selector: "ion-button", inputs: ["buttonType", "color", "disabled", "download", "expand", "fill", "form", "href", "mode", "rel", "routerAnimation", "routerDirection", "shape", "size", "strong", "target", "type"] }, { kind: "component", type: i1.IonCol, selector: "ion-col", inputs: ["offset", "offsetLg", "offsetMd", "offsetSm", "offsetXl", "offsetXs", "pull", "pullLg", "pullMd", "pullSm", "pullXl", "pullXs", "push", "pushLg", "pushMd", "pushSm", "pushXl", "pushXs", "size", "sizeLg", "sizeMd", "sizeSm", "sizeXl", "sizeXs"] }, { kind: "component", type: i1.IonIcon, selector: "ion-icon", inputs: ["color", "flipRtl", "icon", "ios", "lazy", "md", "mode", "name", "sanitize", "size", "src"] }, { kind: "component", type: i1.IonLabel, selector: "ion-label", inputs: ["color", "mode", "position"] }, { kind: "component", type: i1.IonMenuToggle, selector: "ion-menu-toggle", inputs: ["autoHide", "menu"] }, { kind: "component", type: i1.IonRow, selector: "ion-row" }, { kind: "component", type: i1.IonToolbar, selector: "ion-toolbar", inputs: ["color", "mode"] }, { kind: "directive", type: i1$2.TranslateDirective, selector: "[translate],[ngx-translate]", inputs: ["translate", "translateParams"] }, { kind: "component", type: i8.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i9.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }, { kind: "pipe", type: NotEmptyArrayPipe, name: "isNotEmptyArray" }] });
23373
23373
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.2.12", ngImport: i0, type: FormButtonsBarComponent, decorators: [{
23374
23374
  type: Component,
23375
23375
  args: [{ selector: 'app-form-buttons-bar', providers: [
23376
23376
  { provide: FormButtonsBarToken, useExisting: FormButtonsBarComponent }
23377
- ], template: "\n<ion-toolbar [class]=\"classList\">\n <ion-row class=\"ion-no-padding\" nowrap>\n <!-- show menu button -->\n <ion-col size=\"auto\" class=\"hidden-xs hidden-sm\">\n <ion-menu-toggle>\n <button\n mat-icon-button\n color=\"accent\"\n [title]=\"'COMMON.BTN_SHOW_MENU' | translate\"\n (click)=\"menu.toggleSplitPaneWhen()\">\n <mat-icon><span>&#xbb;</span></mat-icon>\n </button>\n </ion-menu-toggle>\n </ion-col>\n\n <ion-col class=\"app-form-buttons-bar-content\">\n <ng-content></ng-content>\n </ion-col>\n\n <ion-col size=\"auto\">\n\n <ng-content select=\"[slot=end]\"></ng-content>\n\n <!-- close (go back) -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onBack.emit($event)\"\n (keyup.enter)=\"onBack.emit($event)\"\n *ngIf=\"onBack.observers | isNotEmptyArray\">\n <ion-label translate>COMMON.BTN_CLOSE</ion-label>\n </ion-button>\n\n <!-- reload -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onCancel.emit($event)\"\n (keyup.enter)=\"onCancel.emit($event)\"\n [disabled]=\"disabledCancel\">\n <ion-icon slot=\"start\" name=\"refresh\"></ion-icon>\n <ion-label translate>COMMON.BTN_RESET</ion-label>\n </ion-button>\n\n <!-- next -->\n <ion-button fill=\"solid\" (click)=\"onNext.emit($event)\" (keyup.enter)=\"onNext.emit($event)\" *ngIf=\"onNext.observers | isNotEmptyArray\">\n <ion-label translate>COMMON.BTN_NEXT</ion-label>\n <ion-icon slot=\"end\" name=\"arrow-forward\"></ion-icon>\n </ion-button>\n\n <!-- save -->\n <ion-button [fill]=\"disabled ? 'clear' : 'solid'\"\n (click)=\"onSave.emit($event)\"\n (keyup.enter)=\"onSave.emit($event)\" color=\"danger\"\n [disabled]=\"disabled\">\n <ion-label [innerHTML]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT'|translate\" [title]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT_HELP'|translate\"></ion-label>\n </ion-button>\n </ion-col>\n </ion-row>\n</ion-toolbar>\n", styles: [":host{width:100%}:host ion-toolbar{height:var(--app-form-buttons-bar-height);padding:0 6px}:host ion-col{padding:0}ion-menu-toggle button{top:4px}\n"] }]
23377
+ ], template: "\n<ion-toolbar [class]=\"classList\">\n <ion-row class=\"ion-no-padding\" nowrap>\n <!-- show menu button -->\n <ion-col size=\"auto\" class=\"hidden-xs hidden-sm\">\n <ion-menu-toggle>\n <button\n mat-icon-button\n color=\"accent\"\n [title]=\"'COMMON.BTN_SHOW_MENU' | translate\"\n (click)=\"menu.toggleSplitPaneWhen()\">\n <mat-icon><span>&#xbb;</span></mat-icon>\n </button>\n </ion-menu-toggle>\n </ion-col>\n\n <ion-col class=\"app-form-buttons-bar-content\">\n <ng-content></ng-content>\n </ion-col>\n\n <ion-col size=\"auto\" class=\"app-form-buttons-bar-buttons\">\n\n <ng-content select=\"[slot=end]\"></ng-content>\n\n <!-- close (go back) -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onBack.emit($event)\"\n (keyup.enter)=\"onBack.emit($event)\"\n *ngIf=\"onBack.observers | isNotEmptyArray\"\n class=\"back\">\n <ion-label translate>COMMON.BTN_CLOSE</ion-label>\n </ion-button>\n\n <!-- reload -->\n <ion-button fill=\"clear\" color=\"dark\" (click)=\"onCancel.emit($event)\"\n (keyup.enter)=\"onCancel.emit($event)\"\n [disabled]=\"disabledCancel\"\n class=\"cancel\">\n <ion-icon slot=\"start\" name=\"refresh\"></ion-icon>\n <ion-label translate>COMMON.BTN_RESET</ion-label>\n </ion-button>\n\n <!-- next -->\n <ion-button fill=\"solid\" (click)=\"onNext.emit($event)\" (keyup.enter)=\"onNext.emit($event)\" *ngIf=\"onNext.observers | isNotEmptyArray\"\n class=\"next\">\n <ion-label translate>COMMON.BTN_NEXT</ion-label>\n <ion-icon slot=\"end\" name=\"arrow-forward\"></ion-icon>\n </ion-button>\n\n <!-- save -->\n <ion-button [fill]=\"disabled ? 'clear' : 'solid'\"\n (click)=\"onSave.emit($event)\"\n (keyup.enter)=\"onSave.emit($event)\" color=\"danger\"\n [disabled]=\"disabled\"\n class=\"save\">\n <ion-label [innerHTML]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT'|translate\" [title]=\"'COMMON.BTN_SAVE_WITH_SHORTCUT_HELP'|translate\"></ion-label>\n </ion-button>\n </ion-col>\n </ion-row>\n</ion-toolbar>\n", styles: [":host{width:100%}:host ion-toolbar{height:var(--app-form-buttons-bar-height);padding:0 6px}:host ion-col{padding:0}ion-menu-toggle button{top:4px}\n"] }]
23378
23378
  }], ctorParameters: function () { return [{ type: Hotkeys }, { type: MenuService }]; }, propDecorators: { disabled: [{
23379
23379
  type: Input
23380
23380
  }], disabledCancel: [{
@@ -30141,7 +30141,7 @@ class AppAsyncTable {
30141
30141
  // and index cache is updated with a delay
30142
30142
  let tempRows = rows.slice()
30143
30143
  .sort((a, b) => a.id > b.id ? -1 : 1);
30144
- let deletedRows = [];
30144
+ const deletedRows = [];
30145
30145
  // If data need to be saved first
30146
30146
  if (this.saveBeforeDelete) {
30147
30147
  // Exclude invalid rows (because of save() will fail, when exists some invalid rows)
@@ -30211,6 +30211,7 @@ class AppAsyncTable {
30211
30211
  }
30212
30212
  /**
30213
30213
  * Try to select row by data. Will use dataEquals() (that call EntityUtils.equals()) to find same row's data
30214
+ *
30214
30215
  * @param data
30215
30216
  */
30216
30217
  async selectRowByData(data) {
@@ -30232,10 +30233,18 @@ class AppAsyncTable {
30232
30233
  }
30233
30234
  // DEBUG
30234
30235
  //console.debug("[table] Detect click on row");
30235
- if (row.id === -1 || row.editing)
30236
- return true; // Already in edition
30237
- if (event?.defaultPrevented)
30238
- return false; // Cancelled by event
30236
+ // Cancelled by event
30237
+ if (event?.defaultPrevented) {
30238
+ if (this.debug)
30239
+ console.debug('[table] clickRow event is defaultPrevented');
30240
+ return false;
30241
+ }
30242
+ // Already in edition
30243
+ if (row.id === -1 || row.editing) {
30244
+ if (this.debug)
30245
+ console.debug('[table] Row already editing. Skip clickRow event');
30246
+ return true;
30247
+ }
30239
30248
  // Open the detail page (if not inline editing)
30240
30249
  if (!this.inlineEdition) {
30241
30250
  if (event) {
@@ -30373,6 +30382,7 @@ class AppAsyncTable {
30373
30382
  }
30374
30383
  /**
30375
30384
  * Try to select row, by row.id, or by data. WIll use EntityUtils.equals()
30385
+ *
30376
30386
  * @param id
30377
30387
  * @param data
30378
30388
  * @protected
@@ -30511,6 +30521,7 @@ class AppAsyncTable {
30511
30521
  /**
30512
30522
  * Open a row detail view. By default, will to open row detail page.
30513
30523
  * Can be overridden by subclasses, BUT prefer to subscribe on onOpenRow
30524
+ *
30514
30525
  * @param id
30515
30526
  * @param row
30516
30527
  * @protected
@@ -34308,8 +34319,8 @@ class ImageAttachmentService extends StartableService {
34308
34319
  super(platform);
34309
34320
  this.platform = platform;
34310
34321
  this.$images = new BehaviorSubject([
34311
- { id: 0, url: 'https://test.sumaris.net/assets/img/bg/ray-1.jpg', title: 'ray #1' },
34312
- { id: 1, url: 'https://test.sumaris.net/assets/img/bg/ray-2.jpg', title: 'ray #2' }
34322
+ ImageAttachment.fromObject({ id: 0, url: 'https://test.sumaris.net/assets/img/bg/ray-1.jpg', title: 'ray #1' }),
34323
+ ImageAttachment.fromObject({ id: 1, url: 'https://test.sumaris.net/assets/img/bg/ray-2.jpg', title: 'ray #2' })
34313
34324
  ]);
34314
34325
  console.debug('[gallery-testing-service] Create service');
34315
34326
  }
@@ -34330,15 +34341,16 @@ class ImageAttachmentService extends StartableService {
34330
34341
  console.debug('[gallery-service-testing] Saving images...' + JSON.stringify(entities));
34331
34342
  if (!entities)
34332
34343
  return [];
34333
- let currentId = this.$images.value.reduce((res, image) => Math.max(res, +image?.id || 0), 0);
34344
+ const existingImages = this.$images.value;
34345
+ let currentId = existingImages.reduce((res, image) => Math.max(res, +image?.id || 0), 0);
34334
34346
  entities.filter(item => isNil(item.id))
34335
34347
  .forEach(item => {
34336
34348
  item.id = ++currentId;
34337
34349
  });
34338
- this.$images.next([
34339
- ...this.$images.value,
34350
+ this.$images.next(removeDuplicatesFromArray([
34351
+ ...existingImages,
34340
34352
  ...entities
34341
- ]);
34353
+ ], 'id'));
34342
34354
  }
34343
34355
  async deleteAll(entities, opts) {
34344
34356
  const deletedIds = (entities || []).map(item => item.id).filter(isNotNil);