@sumaris-net/ngx-components 1.20.18 → 1.20.19

package/bundles/sumaris-net.ngx-components.umd.js

@@ -28421,7 +28421,8 @@
     // eslint-disable-next-line @angular-eslint/directive-class-suffix
     var AppTabEditor = /** @class */ (function (_super_1) {
         __extends(AppTabEditor, _super_1);
-        function AppTabEditor(route, router, alertCtrl, translate, options) {
+        function AppTabEditor(route, // Modal editor give 'null'
+        router, alertCtrl, translate, options) {
             var _this = _super_1.call(this, route, router, alertCtrl, translate) || this;
             _this.route = route;
             _this.router = router;
@@ -28433,6 +28434,7 @@
             _this.tabCount = options.tabCount;
             _this.enableSwipe = options.enableSwipe;
             _this.tabGroupAnimationDuration = options.tabGroupAnimationDuration;
+            _this.queryTabIndexParamName = 'tab';
             return _this;
         }
         Object.defineProperty(AppTabEditor.prototype, "selectedTabIndex", {
@@ -28448,9 +28450,8 @@
         AppTabEditor.prototype.ngOnInit = function () {
             var _this = this;
             _super_1.prototype.ngOnInit.call(this);
-            this.queryTabIndexParamName = this.queryTabIndexParamName || 'tab';
             // Read the selected tab index, from path query params
-            if (this.tabGroup) {
+            if (this.tabGroup && this.route && this.queryTabIndexParamName) {
                 this.registerSubscription(this.route.queryParams
                     .subscribe(function (queryParams) {
                     _this.queryParams = Object.assign({}, queryParams);
@@ -28495,8 +28496,8 @@
         };
         AppTabEditor.prototype.onTabChange = function (event, queryTabIndexParamName) {
             queryTabIndexParamName = queryTabIndexParamName || this.queryTabIndexParamName;
-            if (!queryTabIndexParamName)
-                return true; // Skip if tab query param not set
+            if (!queryTabIndexParamName || !this.route)
+                return true; // Skip if tab query param not set, or no route
             if (!this.queryParams || +this.queryParams[queryTabIndexParamName] !== event.index) {
                 this.queryParams = this.queryParams || {};
                 this.queryParams[queryTabIndexParamName] = event.index;
@@ -28577,7 +28578,7 @@
         { type: i0.Directive }
     ];
     AppTabEditor.ctorParameters = function () { return [
-        { type: i3.ActivatedRoute },
+        { type: i3.ActivatedRoute, decorators: [{ type: i0.Optional }] },
         { type: i3.Router },
         { type: i1$5.AlertController },
         { type: i1$2.TranslateService },
@@ -29451,6 +29452,525 @@
         { type: AppEditorOptions, decorators: [{ type: i0.Optional }] }
     ]; };
 
+    var AppEntityEditorModalOptions = /** @class */ (function (_super_1) {
+        __extends(AppEntityEditorModalOptions, _super_1);
+        function AppEntityEditorModalOptions() {
+            return _super_1 !== null && _super_1.apply(this, arguments) || this;
+        }
+        return AppEntityEditorModalOptions;
+    }(AppTabEditorOptions));
+    // @dynamic
+    // eslint-disable-next-line @angular-eslint/directive-class-suffix
+    var AppEntityEditorModal = /** @class */ (function (_super_1) {
+        __extends(AppEntityEditorModal, _super_1);
+        function AppEntityEditorModal(injector, dataType, options) {
+            var _this = _super_1.call(this, null, injector.get(i3.Router), injector.get(i1$5.AlertController), injector.get(i1$2.TranslateService), options) || this;
+            _this.dataType = dataType;
+            _this.saving = false;
+            _this.$title = new rxjs.Subject();
+            _this.i18nSuffix = null;
+            _this.environement = injector.get(ENVIRONMENT);
+            options = Object.assign({
+                // Default options
+                i18nPrefix: ''
+            }, options);
+            _this.queryTabIndexParamName = undefined; // Important: avoid query parameter changed
+            _this.settings = injector.get(LocalSettingsService);
+            _this.errorTranslator = injector.get(FormErrorTranslator);
+            _this.cd = injector.get(i0.ChangeDetectorRef);
+            _this.dateFormat = injector.get(DateFormatPipe);
+            _this.modalCtrl = injector.get(i1$5.ModalController);
+            _this.i18nContext = {
+                prefix: options.i18nPrefix,
+                suffix: _this.i18nSuffix || ''
+            };
+            return _this;
+            // FOR DEV ONLY ----
+            //this.debug = !environment.production;
+        }
+        Object.defineProperty(AppEntityEditorModal.prototype, "isNewData", {
+            get: function () {
+                var _a;
+                return isNotNil(this._isNewData) ? this._isNewData : isNil((_a = this.data) === null || _a === void 0 ? void 0 : _a.id);
+            },
+            set: function (value) {
+                this._isNewData = value;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(AppEntityEditorModal.prototype, "disabled", {
+            get: function () {
+                return !this._enabled;
+            },
+            set: function (value) {
+                this._enabled = !value;
+            },
+            enumerable: false,
+            configurable: true
+        });
+        Object.defineProperty(AppEntityEditorModal.prototype, "isOnFieldMode", {
+            get: function () {
+                return this.settings.isOnFieldMode(this._usageMode);
+            },
+            enumerable: false,
+            configurable: true
+        });
+        AppEntityEditorModal.prototype.markAsSaving = function (opts) {
+            if (!this.saving) {
+                this.saving = true;
+                if (!opts || opts.emitEvent !== false)
+                    this.markForCheck();
+            }
+        };
+        AppEntityEditorModal.prototype.markAsSaved = function (opts) {
+            if (this.saving) {
+                this.saving = false;
+                if (!opts || opts.emitEvent !== false)
+                    this.markForCheck();
+            }
+        };
+        AppEntityEditorModal.prototype.ngOnInit = function () {
+            var _super = Object.create(null, {
+                ngOnInit: { get: function () { return _super_1.prototype.ngOnInit; } }
+            });
+            return __awaiter(this, void 0, void 0, function () {
+                var _this = this;
+                return __generator(this, function (_b) {
+                    // Default values
+                    this.mobile = isNotNil(this.mobile) ? this.mobile : this.settings.mobile;
+                    _super.ngOnInit.call(this);
+                    // Register forms
+                    this.registerForms();
+                    // Disable
+                    if (this.disabled)
+                        this.disable();
+                    // Update title each time value changes
+                    if (!this.isNewData) {
+                        this.registerSubscription(this.form.valueChanges
+                            .pipe(operators.debounceTime(250))
+                            .subscribe(function (json) { return _this.updateTitle(json); }));
+                    }
+                    return [2 /*return*/];
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.ngAfterViewInit = function () {
+            var _this = this;
+            _super_1.prototype.ngAfterViewInit.call(this);
+            if (this.onAfterModalInit) {
+                Promise.resolve(this.onAfterModalInit(this))
+                    .then(function () { return _this.load(); });
+            }
+            else {
+                this.load();
+            }
+        };
+        AppEntityEditorModal.prototype.ngOnDestroy = function () {
+            _super_1.prototype.ngOnDestroy.call(this);
+            this.$title.complete();
+            this.$title.unsubscribe();
+        };
+        AppEntityEditorModal.prototype.waitIdle = function (opts) {
+            var _this = this;
+            // Wait end of saving
+            if (this.saving)
+                return waitFor(function () { return _this.saving !== true; });
+            return _super_1.prototype.waitIdle.call(this, opts);
+        };
+        AppEntityEditorModal.prototype.load = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var err_1;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            this.markAsReady();
+                            this.markAsLoading();
+                            _b.label = 1;
+                        case 1:
+                            _b.trys.push([1, 3, 4, 5]);
+                            return [4 /*yield*/, this.updateView(this.data)];
+                        case 2:
+                            _b.sent();
+                            return [3 /*break*/, 5];
+                        case 3:
+                            err_1 = _b.sent();
+                            this.setError(err_1);
+                            this.selectedTabIndex = 0;
+                            return [3 /*break*/, 5];
+                        case 4:
+                            this.markAsPristine();
+                            this.markAsLoaded();
+                            return [7 /*endfinally*/];
+                        case 5: return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.reload = function () {
+            if (this.dirty) {
+                return this.load();
+            }
+        };
+        AppEntityEditorModal.prototype.unload = function (opts) {
+            throw new Error("No implemented on modal");
+        };
+        AppEntityEditorModal.prototype.updateView = function (data, opts) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            this.resetError();
+                            if (!this.data)
+                                throw { code: ErrorCodes.DATA_NOT_FOUND_ERROR, message: 'ERROR.DATA_NO_FOUND' };
+                            return [4 /*yield*/, this.setValue(data)];
+                        case 1:
+                            _b.sent();
+                            if (!opts || opts.emitEvent !== false) {
+                                this.markAsPristine();
+                                this.markAsUntouched();
+                                this.updateViewState(data);
+                                // Update the title.
+                                this.updateTitle(data);
+                            }
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        /**
+         * Enable or disable state
+         */
+        AppEntityEditorModal.prototype.updateViewState = function (data, opts) {
+            if (this.isNewData || this.enabled) {
+                this.enable(opts);
+            }
+            else {
+                this.disable(opts);
+                // Allow to sort table
+                this.tables.forEach(function (t) { return t.enableSort(); });
+            }
+        };
+        AppEntityEditorModal.prototype.saveAndClose = function (event) {
+            return __awaiter(this, void 0, void 0, function () {
+                var data;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.saveAndGetDataIfValid()];
+                        case 1:
+                            data = _b.sent();
+                            if (data) {
+                                this.modalCtrl.dismiss(data);
+                                return [2 /*return*/, true];
+                            }
+                            return [2 /*return*/, false];
+                    }
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.close = function (event) {
+            return __awaiter(this, void 0, void 0, function () {
+                var saveBeforeLeave;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!this.dirty) return [3 /*break*/, 3];
+                            return [4 /*yield*/, Alerts.askSaveBeforeLeave(this.alertCtrl, this.translate, event)];
+                        case 1:
+                            saveBeforeLeave = _b.sent();
+                            // User cancelled
+                            if (isNil(saveBeforeLeave) || event && event.defaultPrevented) {
+                                return [2 /*return*/];
+                            }
+                            if (!(saveBeforeLeave === true)) return [3 /*break*/, 3];
+                            return [4 /*yield*/, this.saveAndClose(event)];
+                        case 2:
+                            _b.sent();
+                            return [2 /*return*/];
+                        case 3: return [4 /*yield*/, this.modalCtrl.dismiss()];
+                        case 4:
+                            _b.sent();
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        /**
+         * Save the editor, by calling the dataService.save().
+         * Ensure that editor if valid. If not, display an error
+         * @param event
+         * @param opts
+         */
+        AppEntityEditorModal.prototype.save = function (event, opts) {
+            return __awaiter(this, void 0, void 0, function () {
+                var saved, _b, err_2;
+                return __generator(this, function (_c) {
+                    switch (_c.label) {
+                        case 0:
+                            if (this.loading || this.saving || this.disabled) {
+                                console.debug(this._logPrefix + 'Skip save: modal is busy (loading or saving)');
+                                return [2 /*return*/, false];
+                            }
+                            if (!this.dirty) {
+                                console.debug(this._logPrefix + 'Skip save: modal not dirty');
+                                return [2 /*return*/, true];
+                            }
+                            // Wait end of async validation
+                            return [4 /*yield*/, this.waitWhilePending()];
+                        case 1:
+                            // Wait end of async validation
+                            _c.sent();
+                            // If invalid
+                            if (this.invalid) {
+                                this.logFormErrors();
+                                this.setError('COMMON.FORM.HAS_ERROR');
+                                this.markAllAsTouched();
+                                this.openFirstInvalidTab();
+                                this.scrollToTop();
+                                this.submitted = true;
+                                return [2 /*return*/, false];
+                            }
+                            this.markAsSaving();
+                            this.resetError();
+                            if (this.debug)
+                                console.debug(this._logPrefix + 'Saving data...');
+                            _c.label = 2;
+                        case 2:
+                            _c.trys.push([2, 4, 5, 6]);
+                            saved = Promise.all((this.tables || [])
+                                .filter(function (c) { return c.dirty; })
+                                .map(function (c) { return c.save(); }))
+                                .then(function (res) { return res.findIndex(function (r) { return r !== true; }) === -1; });
+                            _b = this;
+                            return [4 /*yield*/, this.getValue()];
+                        case 3:
+                            _b.data = _c.sent();
+                            this.submitted = true;
+                            return [2 /*return*/, saved];
+                        case 4:
+                            err_2 = _c.sent();
+                            this.submitted = true;
+                            this.setError(err_2);
+                            this.selectedTabIndex = 0;
+                            this.scrollToTop(); // Scroll to top (to show error)
+                            this.markAsDirty();
+                            this.enable();
+                            return [2 /*return*/, false];
+                        case 5:
+                            this.markAsSaved();
+                            return [7 /*endfinally*/];
+                        case 6: return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        /**
+         * Save data (if dirty and valid), and return it. Otherwise, return nil value.
+         */
+        AppEntityEditorModal.prototype.saveAndGetDataIfValid = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var saved;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (!!this.valid) return [3 /*break*/, 2];
+                            // Make sure validation is finished
+                            return [4 /*yield*/, AppFormUtils.waitWhilePending(this)];
+                        case 1:
+                            // Make sure validation is finished
+                            _b.sent();
+                            // If invalid: Open the first tab in error
+                            if (this.invalid) {
+                                this.openFirstInvalidTab();
+                                return [2 /*return*/, undefined];
+                            }
+                            _b.label = 2;
+                        case 2:
+                            if (!this.dirty) return [3 /*break*/, 4];
+                            return [4 /*yield*/, this.save(new Event('save'))];
+                        case 3:
+                            saved = _b.sent();
+                            if (!saved)
+                                return [2 /*return*/, undefined];
+                            _b.label = 4;
+                        case 4: 
+                        // Valid and saved data
+                        return [2 /*return*/, this.data];
+                    }
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.delete = function (event) {
+            return __awaiter(this, void 0, void 0, function () {
+                var result, err_3;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            if (this.loading || this.saving)
+                                return [2 /*return*/, false];
+                            this.markAsSaving();
+                            this.resetError();
+                            _b.label = 1;
+                        case 1:
+                            _b.trys.push([1, 8, , 9]);
+                            if (!this.onDelete) return [3 /*break*/, 5];
+                            return [4 /*yield*/, this.onDelete(event, this.data)];
+                        case 2:
+                            result = _b.sent();
+                            // User cancelled
+                            if (isNil(result) || (event && event.defaultPrevented))
+                                return [2 /*return*/];
+                            if (!result) return [3 /*break*/, 4];
+                            return [4 /*yield*/, this.modalCtrl.dismiss(this.data, 'delete')];
+                        case 3:
+                            _b.sent();
+                            _b.label = 4;
+                        case 4: return [3 /*break*/, 7];
+                        case 5:
+                            if (this.isNewData) {
+                                console.error(this._logPrefix + "Trying to delete a new data. Make no sense!");
+                            }
+                            return [4 /*yield*/, this.modalCtrl.dismiss(this.data, 'delete')];
+                        case 6:
+                            _b.sent();
+                            _b.label = 7;
+                        case 7: return [3 /*break*/, 9];
+                        case 8:
+                            err_3 = _b.sent();
+                            this.submitted = true;
+                            this.setError(err_3);
+                            this.selectedTabIndex = 0;
+                            this.markAsSaved();
+                            if (this.enabled)
+                                this.enable();
+                            return [2 /*return*/, false];
+                        case 9: return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.resetError = function (opts) {
+            if (isNotNilOrBlank(this.error)) {
+                this.error = null;
+                if (!opts || opts.emitEvent !== false)
+                    this.markForCheck();
+            }
+        };
+        AppEntityEditorModal.prototype.setError = function (err, opts) {
+            if (!err) {
+                this.error = undefined;
+            }
+            else if (typeof err === 'string') {
+                console.error('[entity-editor] Error: ' + (err || ''));
+                this.error = err;
+            }
+            else {
+                console.error('[entity-editor] Error: ' + err.message || '', err);
+                var userMessage = err.message && this.translate.instant(err.message) || err;
+                // Add details error (if any) under the main message
+                var detailMessage = (!err.details || typeof err.details === 'string')
+                    ? err.details
+                    : err.details.message;
+                if (isNotNilOrBlank(detailMessage)) {
+                    var cssClass = (opts === null || opts === void 0 ? void 0 : opts.detailsCssClass) || 'hidden-xs hidden-sm';
+                    userMessage += "<br/><small class=\"" + cssClass + "\" title=\"" + detailMessage + "\">";
+                    userMessage += detailMessage.length < 70 ? detailMessage : detailMessage.substring(0, 67) + '...';
+                    userMessage += '</small>';
+                }
+                this.error = userMessage;
+            }
+            if (!opts || opts.emitEvent !== false)
+                this.markForCheck();
+        };
+        /* -- protected methods -- */
+        AppEntityEditorModal.prototype.waitWhilePending = function (opts) {
+            return AppFormUtils.waitWhilePending(this, opts);
+        };
+        AppEntityEditorModal.prototype.getValue = function () {
+            return __awaiter(this, void 0, void 0, function () {
+                var json, res;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0: return [4 /*yield*/, this.getJsonValueToSave()];
+                        case 1:
+                            json = _b.sent();
+                            res = new this.dataType();
+                            res.fromObject(json);
+                            return [2 /*return*/, res];
+                    }
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.getJsonValueToSave = function () {
+            return Promise.resolve(this.form.value);
+        };
+        /**
+         * Compute the title
+         *
+         * @param data
+         */
+        AppEntityEditorModal.prototype.updateTitle = function (data) {
+            return __awaiter(this, void 0, void 0, function () {
+                var title;
+                return __generator(this, function (_b) {
+                    switch (_b.label) {
+                        case 0:
+                            data = data || this.data;
+                            return [4 /*yield*/, this.computeTitle(data)];
+                        case 1:
+                            title = _b.sent();
+                            this.$title.next(title);
+                            return [2 /*return*/];
+                    }
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.scrollToTop = function (duration) {
+            return __awaiter(this, void 0, void 0, function () {
+                return __generator(this, function (_b) {
+                    if (this.content) {
+                        return [2 /*return*/, this.content.scrollToTop(duration)];
+                    }
+                    return [2 /*return*/];
+                });
+            });
+        };
+        AppEntityEditorModal.prototype.markForCheck = function () {
+            var _a;
+            (_a = this.cd) === null || _a === void 0 ? void 0 : _a.markForCheck();
+        };
+        /* -- private functions -- */
+        /**
+         * Open the first tab that is invalid
+         */
+        AppEntityEditorModal.prototype.openFirstInvalidTab = function () {
+            var invalidTabIndex = this.getFirstInvalidTabIndex();
+            if (invalidTabIndex !== -1 && this.selectedTabIndex !== invalidTabIndex) {
+                this.selectedTabIndex = invalidTabIndex;
+                this.markForCheck();
+            }
+        };
+        return AppEntityEditorModal;
+    }(AppTabEditor));
+    AppEntityEditorModal.decorators = [
+        { type: i0.Directive }
+    ];
+    AppEntityEditorModal.ctorParameters = function () { return [
+        { type: i0.Injector },
+        { type: Function },
+        { type: undefined, decorators: [{ type: i0.Optional }] }
+    ]; };
+    AppEntityEditorModal.propDecorators = {
+        data: [{ type: i0.Input }],
+        mobile: [{ type: i0.Input }],
+        usageMode: [{ type: i0.Input }],
+        onAfterModalInit: [{ type: i0.Input }],
+        onDelete: [{ type: i0.Input }],
+        i18nSuffix: [{ type: i0.Input }],
+        isNewData: [{ type: i0.Input }],
+        disabled: [{ type: i0.Input }]
+    };
+
     // @dynamic
     // eslint-disable-next-line @angular-eslint/directive-class-suffix
     var AppInMemoryTable = /** @class */ (function (_super) {
@@ -32521,6 +33041,8 @@
     exports.AppEditor = AppEditor;
     exports.AppEditorOptions = AppEditorOptions;
     exports.AppEntityEditor = AppEntityEditor;
+    exports.AppEntityEditorModal = AppEntityEditorModal;
+    exports.AppEntityEditorModalOptions = AppEntityEditorModalOptions;
     exports.AppForm = AppForm;
     exports.AppFormField = AppFormField;
     exports.AppFormProvider = AppFormProvider;