@universis/ngx-tables 0.7.30 → 0.8.0

package/fesm5/universis-ngx-tables.js

@@ -827,6 +827,12 @@ DataTablesApi.register('processing()', function (show) {
         ctx.oApi._fnProcessingDisplay(ctx, show);
     });
 });
+var ɵ0 = [];
+var EMPTY_DATASET = {
+    recordsTotal: 0,
+    recordsFiltered: 0,
+    data: ɵ0,
+};
 var TableTranslationChangeDetector = /** @class */ (function (_super) {
     __extends(TableTranslationChangeDetector, _super);
     function TableTranslationChangeDetector() {
@@ -1586,6 +1592,8 @@ var AdvancedTableComponent = /** @class */ (function () {
                             return fnCallback(emptyDataSet);
                         }
                     }
+                    // reset error
+                    self.toggleError();
                     // get activated route params
                     var queryParams = self._activatedRoute.snapshot.queryParams;
                     // get columns
@@ -1666,7 +1674,7 @@ var AdvancedTableComponent = /** @class */ (function () {
                                 q.filter(expressions.join(' and '));
                             }
                             self.lastQueryParams = q.getParams();
-                            q.getList().then(function (items) {
+                            return q.getList().then(function (items) {
                                 var dataSet = {
                                     recordsTotal: items.total,
                                     recordsFiltered: items.total,
@@ -1681,7 +1689,13 @@ var AdvancedTableComponent = /** @class */ (function () {
                                 return fnCallback(dataSet);
                             });
                         }).catch(function (err) {
+                            // log error to console
                             console.error('TABLES', err);
+                            // show error
+                            self.toggleError(err);
+                            // by returning empty dataset
+                            self.load.emit(EMPTY_DATASET);
+                            return fnCallback(EMPTY_DATASET);
                         });
                     }
                     self.lastQueryParams = q.getParams();
@@ -1699,7 +1713,13 @@ var AdvancedTableComponent = /** @class */ (function () {
                         // return data
                         return fnCallback(dataSet);
                     }).catch(function (err) {
+                        // log error to console
                         console.error('TABLES', err);
+                        // show error
+                        self.toggleError(err);
+                        // by returning empty dataset
+                        self.load.emit(EMPTY_DATASET);
+                        return fnCallback(EMPTY_DATASET);
                     });
                 },
                 language: Object.assign({}, self.translator.transform('Tables.DataTable'), { emptyTable: ' ' }),
@@ -1932,9 +1952,28 @@ var AdvancedTableComponent = /** @class */ (function () {
                 this.dataTable.context[0].oLanguage.sZeroRecords = this.emptyTable.nativeElement.innerHTML;
         }
     };
+    AdvancedTableComponent.prototype.toggleError = function (err) {
+        if (this.dataTable && this.dataTable.context[0]) {
+            var innerMessage = this.errorTemplate.nativeElement.getElementsByTagName('small').item(0);
+            if (err) {
+                this.lastError = err;
+                if (innerMessage) {
+                    innerMessage.innerHTML = err.error && err.error.message ? err.error.message : err.message;
+                }
+                this.dataTable.context[0].oLanguage.sEmptyTable =
+                    this.dataTable.context[0].oLanguage.sZeroRecords = this.errorTemplate.nativeElement.innerHTML;
+            }
+            else {
+                if (innerMessage) {
+                    innerMessage.innerHTML = '';
+                }
+                this.dataTable.context[0].oLanguage.sEmptyTable = this.dataTable.context[0].oLanguage.sZeroRecords = '';
+            }
+        }
+    };
     AdvancedTableComponent.prototype.clearEmptyTable = function () {
         if (this.dataTable && this.dataTable.context[0]) {
-            this.dataTable.context[0].oLanguage.sEmptyTable = '';
+            this.dataTable.context[0].oLanguage.sEmptyTable = this.dataTable.context[0].oLanguage.sZeroRecords = '';
         }
     };
     AdvancedTableComponent.prototype.export = function () {
@@ -2053,9 +2092,9 @@ var AdvancedTableComponent = /** @class */ (function () {
         { type: Component, args: [{
                     // tslint:disable-next-line: component-selector
                     selector: 'app-advanced-table',
-                    template: "\n    <table #table class=\"dataTable\">\n    </table>\n    <div #emptyTable class=\"d-none\">\n      <div>\n        <div class=\"mt-4\">\n          <div class=\"icon-circle bg-gray-300 border-gray-100\"></div>\n        </div>\n        <div class=\"mt-4\">\n          <h4 class=\"font-3xl text-dark\" [translate]=\"'Tables.EmptyTableTitle'\"></h4>\n          <p class=\"font-lg text-dark\" [translate]=\"'Tables.EmptyTableMessage'\"></p>\n        </div>\n      </div>\n    </div>\n  ",
+                    template: "\n    <table #table class=\"dataTable\">\n    </table>\n    <div #emptyTable class=\"d-none\">\n      <div>\n        <div class=\"mt-4\">\n          <div class=\"icon-circle bg-gray-300 border-gray-100\"></div>\n        </div>\n        <div class=\"mt-4\">\n          <h4 class=\"font-3xl text-dark\" [translate]=\"'Tables.EmptyTableTitle'\"></h4>\n          <p class=\"font-lg text-dark\" [translate]=\"'Tables.EmptyTableMessage'\"></p>\n        </div>\n      </div>\n    </div>\n    <div #errorTemplate class=\"d-none error-message\">\n      <div class=\"text-center\">\n        <div class=\"mt-4\">\n          <div class=\"icon-circle bg-danger border-gray-100\"></div>\n        </div>\n        <div class=\"mt-4\">\n          <h4 class=\"font-3xl text-secondary\" [translate]=\"'Tables.DataError.Title'\"></h4>\n          <p class=\"font-lg text-secondary mb-1\" [translate]=\"'Tables.DataError.Message'\"></p>\n          <p class=\"font-lg text-secondary error-inner-message\">\n            <small></small>\n          </p>\n        </div>\n      </div>\n    </div>\n  ",
                     encapsulation: ViewEncapsulation.None,
-                    styles: ["table.dataTable thead .sorting{background-image:none}table.dataTable thead .sorting_asc{background-position:95% 60%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsSAAALEgHS3X78AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAEtJREFUKJFjYBgywAOKMQALFjE/BgaGTCibjYGBYRM+kz0ZGBh2MTAw8DAwMHAxMDBsY2BgCCBGMQzg1IRNMV5NuVAJXIALqmYwAgBBkAlPRCLcLwAAAABJRU5ErkJggg==)}table.dataTable thead .sorting_desc{background-position:95% 60%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAArzAAAK8wHvFRX1AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAFNJREFUKJHVzTEKgDAQRNGHZfBg2sSTeDMLKwXPYuVJbBKQQEyrH6bZ+cPyWWaElz4kR5cOJ1b0FXnBVRYjjmIUsGGqvX6OmnImYk+JLTkzpPyBGwrtCvfBe56nAAAAAElFTkSuQmCC)}table.dataTable thead th{color:#73818e;font-size:.75rem;font-weight:600;padding-top:16px;padding-bottom:4px;border-bottom:none;padding-left:8px}table.dataTable tbody tr:first-child td:first-child{border-radius:6px 0}table.dataTable tbody tr:first-child td:last-child{border-radius:0 6px}table.dataTable tbody tr{border-radius:6px}table.dataTable tbody tr td:first-child{border-left:1px solid #c2cfd6}table.dataTable tbody tr td:last-child{border-right:1px solid #c2cfd6}table.dataTable tbody tr td{padding-top:8px;padding-bottom:8px;border-top:1px solid #c2cfd6}table.dataTable tbody tr:last-child td:first-child{border-radius:0 0 0 6px}table.dataTable tbody tr:last-child td:last-child{border-radius:0 0 6px}table.dataTable tbody tr:last-child td{border-bottom:1px solid #c2cfd6}table.dataTable td.dataTables_empty{border:none!important}table.dataTable.no-footer{border-bottom:none}.dataTables_paginate .btn.previous{margin-right:8px}.dataTables_paginate .btn.next{margin-left:8px}.dataTables_info,.dataTables_paginate{margin-top:1rem}.dataTables_paginate span .btn{border-radius:1.5rem}.dataTables_filter{display:none}.dataTables_wrapper.no-footer .dataTables_scrollBody{border-bottom:0;overflow:auto}.dataTables_paginate{display:none}.dataTable.processing{opacity:15%}.dataTables_wrapper .dataTables_processing{background:0 0;position:absolute;display:inline-block;top:25%;z-index:5;color:#73818e}.text-decoration-line-through{text-decoration:line-through!important}tr.removed .checkbox+label{visibility:hidden}"]
+                    styles: ["table.dataTable thead .sorting{background-image:none}table.dataTable thead .sorting_asc{background-position:95% 60%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAAsSAAALEgHS3X78AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAEtJREFUKJFjYBgywAOKMQALFjE/BgaGTCibjYGBYRM+kz0ZGBh2MTAw8DAwMHAxMDBsY2BgCCBGMQzg1IRNMV5NuVAJXIALqmYwAgBBkAlPRCLcLwAAAABJRU5ErkJggg==)}table.dataTable thead .sorting_desc{background-position:95% 60%;background-image:url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAwAAAAMCAYAAABWdVznAAAACXBIWXMAAArzAAAK8wHvFRX1AAAAGXRFWHRTb2Z0d2FyZQB3d3cuaW5rc2NhcGUub3Jnm+48GgAAAFNJREFUKJHVzTEKgDAQRNGHZfBg2sSTeDMLKwXPYuVJbBKQQEyrH6bZ+cPyWWaElz4kR5cOJ1b0FXnBVRYjjmIUsGGqvX6OmnImYk+JLTkzpPyBGwrtCvfBe56nAAAAAElFTkSuQmCC)}table.dataTable thead th{color:#73818e;font-size:.75rem;font-weight:600;padding-top:16px;padding-bottom:4px;border-bottom:none;padding-left:8px}table.dataTable tbody tr:first-child td:first-child{border-radius:6px 0}table.dataTable tbody tr:first-child td:last-child{border-radius:0 6px}table.dataTable tbody tr{border-radius:6px}table.dataTable tbody tr td:first-child{border-left:1px solid #c2cfd6}table.dataTable tbody tr td:last-child{border-right:1px solid #c2cfd6}table.dataTable tbody tr td{padding-top:8px;padding-bottom:8px;border-top:1px solid #c2cfd6}table.dataTable tbody tr:last-child td:first-child{border-radius:0 0 0 6px}table.dataTable tbody tr:last-child td:last-child{border-radius:0 0 6px}table.dataTable tbody tr:last-child td{border-bottom:1px solid #c2cfd6}table.dataTable td.dataTables_empty{border:none!important}table.dataTable .error-inner-message>small{overflow-wrap:break-word}table.dataTable.no-footer{border-bottom:none}.dataTables_paginate .btn.previous{margin-right:8px}.dataTables_paginate .btn.next{margin-left:8px}.dataTables_info,.dataTables_paginate{margin-top:1rem}.dataTables_paginate span .btn{border-radius:1.5rem}.dataTables_filter{display:none}.dataTables_wrapper.no-footer .dataTables_scrollBody{border-bottom:0;overflow:auto}.dataTables_paginate{display:none}.dataTable.processing{opacity:15%}.dataTables_wrapper .dataTables_processing{background:0 0;position:absolute;display:inline-block;top:25%;z-index:5;color:#73818e}.text-decoration-line-through{text-decoration:line-through!important}tr.removed .checkbox+label{visibility:hidden}"]
                 }] }
     ];
     /** @nocollapse */
@@ -2075,6 +2114,7 @@ var AdvancedTableComponent = /** @class */ (function () {
     AdvancedTableComponent.propDecorators = {
         table: [{ type: ViewChild, args: ['table',] }],
         emptyTable: [{ type: ViewChild, args: ['emptyTable',] }],
+        errorTemplate: [{ type: ViewChild, args: ['errorTemplate',] }],
         loadingTable: [{ type: ViewChild, args: ['loadingTable',] }],
         height: [{ type: Input }],
         showActions: [{ type: Input }],
@@ -4904,7 +4944,11 @@ var TABLES_EL = {
         "MoveColumnHelp": "Χρησιμοποιήστε τα πλήκτρα 'Επάνω' και 'Κάτω' για να αλλάξετε την σειρά εμφάνισης των στηλών του πίνακα.",
         "UnknownColumn": "Άγνωστο",
         "SelectColumn": "Επιλογή",
-        "ActionLinkColumn": "Ενέργειες"
+        "ActionLinkColumn": "Ενέργειες",
+        "DataError": {
+            "Title": "Σφάλμα κατά την παραλαβή των δεδομένων",
+            "Message": "Συνέβη σφάλμα κατά την παραλαβή των δεδομένων. Προσπαθήστε ξανά ή τροποποιήστε τα στοιχεία αναζήτησης."
+        }
     },
     "TrueFalse": {
         "long": {
@@ -5023,7 +5067,11 @@ var TABLES_EN = {
         "MoveColumnHelp": "Use 'Move up' and 'Move down' buttons to change column order.",
         "UnknownColumn": "Unknown",
         "SelectColumn": "Select",
-        "ActionLinkColumn": "Actions"
+        "ActionLinkColumn": "Actions",
+        "DataError": {
+            "Title": "Error while getting data",
+            "Message": "An error occurred while getting data. Please try again or change your criteria."
+        }
     },
     "TrueFalse": {
         "long": {
@@ -5337,7 +5385,7 @@ var AdvancedSearchRouterState = /** @class */ (function (_super) {
     return AdvancedSearchRouterState;
 }(AdvancedSearchState));
 
-var ɵ0 = FORMATTERS;
+var ɵ0$1 = FORMATTERS;
 var TablesModule = /** @class */ (function () {
     function TablesModule(_translateService) {
         this._translateService = _translateService;
@@ -5375,7 +5423,7 @@ var TablesModule = /** @class */ (function () {
                     providers: [DatePipe, TemplatePipe,
                         {
                             provide: COLUMN_FORMATTERS,
-                            useValue: ɵ0
+                            useValue: ɵ0$1
                         },
                         AdvancedTableConfigurationResolver,
                         AdvancedSearchConfigurationResolver,
@@ -5454,6 +5502,6 @@ var TablesModule = /** @class */ (function () {
  * Generated bundle index. Do not edit.
  */
 
-export { AdvancedSearchState as ɵa, AdvancedTableState as ɵc, AdvancedSearchRouterState as ɵd, AdvancedListComponent, AdvancedRowActionComponent, AdvancedSearchFormComponent, AdvancedSelectComponent, AdvancedSelectService, AdvancedTableConfigurationResolver, AdvancedSearchConfigurationResolver, AdvancedColumnFormatter, NestedPropertyFormatter, ButtonFormatter, LinkFormatter, ActionLinkFormatter, ActionButtonFormatter, ActionSplitButtonFormatter, SelectRowFormatter, TemplateFormatter, TrueFalseFormatter, TranslationFormatter, DateTimeFormatter, NgClassFormatter, LanguageFormatter, COLUMN_FORMATTERS, AdvancedTableConfiguration, AdvancedTableComponent, AdvancedTableSettingsComponent, AdvancedTableSearchBaseComponent, AdvancedTableSearchComponent, FORMATTERS, AdvancedFilterValueProvider, AdvancedTableModalBaseTemplate, AdvancedTableModalBaseComponent, SimpleHeaderToolsComponent, TableSimpleHeaderComponent, AdvancedTableNotNullError, AdvancedTableEditorDirective, BtnExpDirective, AdvancedAggregatorComponent, AdvancedAggregatorListComponent, AddItemsComponent, AdvancedAggregatorPipe, ParseTitlePipe, AdvancedAggregatorService, TablesModule, ɵ0, ActivatedTableService, ColumnSelectorService, ColumnSelectorComponent, initialState, tableInitialState, tableReducer, tableReducers, featureName, getTablesState, selectTable };
+export { AdvancedSearchState as ɵa, AdvancedTableState as ɵc, AdvancedSearchRouterState as ɵd, AdvancedListComponent, AdvancedRowActionComponent, AdvancedSearchFormComponent, AdvancedSelectComponent, AdvancedSelectService, AdvancedTableConfigurationResolver, AdvancedSearchConfigurationResolver, AdvancedColumnFormatter, NestedPropertyFormatter, ButtonFormatter, LinkFormatter, ActionLinkFormatter, ActionButtonFormatter, ActionSplitButtonFormatter, SelectRowFormatter, TemplateFormatter, TrueFalseFormatter, TranslationFormatter, DateTimeFormatter, NgClassFormatter, LanguageFormatter, COLUMN_FORMATTERS, AdvancedTableConfiguration, AdvancedTableComponent, ɵ0, AdvancedTableSettingsComponent, AdvancedTableSearchBaseComponent, AdvancedTableSearchComponent, FORMATTERS, AdvancedFilterValueProvider, AdvancedTableModalBaseTemplate, AdvancedTableModalBaseComponent, SimpleHeaderToolsComponent, TableSimpleHeaderComponent, AdvancedTableNotNullError, AdvancedTableEditorDirective, BtnExpDirective, AdvancedAggregatorComponent, AdvancedAggregatorListComponent, AddItemsComponent, AdvancedAggregatorPipe, ParseTitlePipe, AdvancedAggregatorService, TablesModule, ActivatedTableService, ColumnSelectorService, ColumnSelectorComponent, initialState, tableInitialState, tableReducer, tableReducers, featureName, getTablesState, selectTable };
 
 //# sourceMappingURL=universis-ngx-tables.js.map