@universis/ngx-tables 0.8.0 → 0.8.1

package/fesm5/universis-ngx-tables.js

@@ -3,15 +3,16 @@ import * as jQuery_ from 'jquery';
 import 'datatables.net';
 import 'datatables.net-scroller';
 import 'datatables.net-colreorder';
+import 'datatables.net-buttons';
 import 'rxjs/add/observable/combineLatest';
 import { HttpClient } from '@angular/common/http';
-import { ClientDataQueryable, ResponseError, TextUtils } from '@themost/client';
+import { ResponseError, ClientDataQueryable, TextUtils } from '@themost/client';
 import { BehaviorSubject } from 'rxjs';
 import { AngularDataContext } from '@themost/angular';
 import { DatePipe, CommonModule } from '@angular/common';
 import { TranslateService, TranslatePipe, TranslateModule } from '@ngx-translate/core';
 import { FormControl, FormArray, FormBuilder, FormsModule, ReactiveFormsModule } from '@angular/forms';
-import { TemplatePipe, ModalService, LoadingService, ErrorService, DIALOG_BUTTONS, UserActivityService, ToastService, AppEventService, UserStorageService, ConfigurationService, SharedModule } from '@universis/common';
+import { TemplatePipe, ModalService, ConfigurationService, ErrorService, LoadingService, DIALOG_BUTTONS, ExportSpreadsheetService, UserActivityService, ToastService, AppEventService, UserStorageService, SharedModule } from '@universis/common';
 import { RouterModalOkCancel, RouterModalModule } from '@universis/common/routing';
 import { ServiceUrlPreProcessor, TranslatePreProcessor, AdvancedFormsModule } from '@universis/forms';
 import { FormioModule } from 'angular-formio';
@@ -819,6 +820,291 @@ var ColumnSelectorService = /** @class */ (function () {
     return ColumnSelectorService;
 }());
 
+var ActivatedTableService = /** @class */ (function () {
+    function ActivatedTableService(_router, _activatedRoute) {
+        var _this = this;
+        this._router = _router;
+        this._activatedRoute = _activatedRoute;
+        _router.events.forEach(function (event) {
+            if (event instanceof NavigationStart) {
+                if (_this._activeTable) {
+                    _this._activeTable = null;
+                }
+            }
+        });
+    }
+    Object.defineProperty(ActivatedTableService.prototype, "activeTable", {
+        get: function () {
+            return this._activeTable;
+        },
+        set: function (tableComponent) {
+            this._activeTable = tableComponent;
+        },
+        enumerable: true,
+        configurable: true
+    });
+    ActivatedTableService.decorators = [
+        { type: Injectable, args: [{
+                    providedIn: 'root'
+                },] }
+    ];
+    /** @nocollapse */
+    ActivatedTableService.ctorParameters = function () { return [
+        { type: Router },
+        { type: ActivatedRoute }
+    ]; };
+    ActivatedTableService.ngInjectableDef = defineInjectable({ factory: function ActivatedTableService_Factory() { return new ActivatedTableService(inject(Router), inject(ActivatedRoute)); }, token: ActivatedTableService, providedIn: "root" });
+    return ActivatedTableService;
+}());
+
+var MAX_EXPORT_ITEMS = 500;
+var BtnExpDirective = /** @class */ (function () {
+    function BtnExpDirective(_activatedTable, _context, _config, _translate, _loadingService, _errorService) {
+        this._activatedTable = _activatedTable;
+        this._context = _context;
+        this._config = _config;
+        this._translate = _translate;
+        this._loadingService = _loadingService;
+        this._errorService = _errorService;
+    }
+    BtnExpDirective.prototype.clickEvent = function (event) {
+        return __awaiter(this, void 0, void 0, function () {
+            return __generator(this, function (_a) {
+                event.preventDefault();
+                event.stopPropagation();
+                if (this._activatedTable.activeTable) {
+                    return [2 /*return*/, this._activatedTable.activeTable.exportView()];
+                    /*
+                    const lastQuery = this._activatedTable.activeTable.lastQuery;
+                    const tableConfig = this._activatedTable.activeTable.config;
+                    const serviceHeaders = this._context.getService().getHeaders();
+                    const queryModel = lastQuery.getModel();
+                    let query = this._context.model(queryModel).asQueryable();
+                    const queryParams = lastQuery.getParams();
+                    query = this.constructQuery(query, queryParams, tableConfig, serviceHeaders);
+                    // get export settings
+                    const exportSettings = this._config.settings as ExportLimitConfiguration;
+                    // get export limit
+                    const maxExportItems = exportSettings && exportSettings.tables && exportSettings.tables.exportLimit;
+                    if (maxExportItems && typeof maxExportItems === 'number' && maxExportItems > 0) {
+                      query.skip(0).take(maxExportItems);
+                    } else {
+                      query.skip(0).take(MAX_EXPORT_ITEMS);
+                    }
+                    // This constructs the URI based on the way @themost does
+                    const url = this.constructURL(query);
+                    this.downloadFile(url, query.getService().getHeaders(), query.getModel()); */
+                }
+                return [2 /*return*/];
+            });
+        });
+    };
+    /**
+     * Sets the parameters to the query based on
+     * the active filters of the activated table
+     * @param {ClientDataQueryable} query
+     * @param params: The filters of the last query of the activated table
+     * @return ClientDataQueryable
+     */
+    BtnExpDirective.prototype.setParams = function (query, params) {
+        if (params && typeof params === 'object') {
+            Object.keys(params).forEach(function (key) {
+                query.setParam(key, params[key]);
+            });
+        }
+        return query;
+    };
+    /**
+     * Sets the headers to the query based on
+     * the default headers of the DataContext
+     * and appending the accept header to get
+     * an xlsx file from the API
+     * @param {ClientDataQueryable} query
+     * @param {Headers} headers: The headers to append to the query
+     * @return ClientDataQueryable
+     */
+    BtnExpDirective.prototype.setHeaders = function (query, headers) {
+        Object.keys(headers).forEach(function (key) {
+            if (headers.hasOwnProperty(key)) {
+                query.getService().setHeader(key, headers[key]);
+            }
+        });
+        // sets a header to accept xlsx files
+        query.getService().setHeader('Accept', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
+        return query;
+    };
+    /**
+     * Constructs the select parameter of the
+     * ClientDataQuery by replacing the target name
+     * of the field based on the localized translation
+     * of that property on the advanced tabled
+     * @param {ClientDataQueryable} query
+     * @param tableConfig: The configuration of the activated table
+     * @return ClientDataQueryable
+     */
+    BtnExpDirective.prototype.constructQueryParam = function (query, tableConfig) {
+        var _this = this;
+        var selectQuery = query.getParams().$select;
+        var selectQueryArray = selectQuery.split(',');
+        selectQueryArray = selectQueryArray.map(function (select$$1) {
+            var e_1, _a, e_2, _b;
+            var words = select$$1.split(' ');
+            if (words.length === 3) {
+                if (tableConfig && tableConfig.columns) {
+                    try {
+                        for (var _c = __values(tableConfig.columns), _d = _c.next(); !_d.done; _d = _c.next()) {
+                            var column = _d.value;
+                            if (column.property === words[2] && column.title) {
+                                words[2] = "\"" + _this._translate.instant(column.title) + "\"";
+                            }
+                            else if (column.property === words[2]) {
+                                words[2] = "\"" + _this._translate.instant(words[2]) + "\"";
+                            }
+                        }
+                    }
+                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
+                    finally {
+                        try {
+                            if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
+                        }
+                        finally { if (e_1) throw e_1.error; }
+                    }
+                }
+            }
+            if (words.length === 1) {
+                if (tableConfig && tableConfig.columns) {
+                    try {
+                        for (var _e = __values(tableConfig.columns), _f = _e.next(); !_f.done; _f = _e.next()) {
+                            var column = _f.value;
+                            if (column.name === words[0] && column.title) {
+                                words[0] = words[0] + " as \"" + _this._translate.instant(column.title) + "\"";
+                                break;
+                            }
+                            else if (column.name === words[0] && column.property) {
+                                words[0] = words[0] + " as \"" + _this._translate.instant(column.property) + "\"";
+                                break;
+                            }
+                            else if (words[0] === column.name && words[0] === "id" && column.hidden) {
+                                break;
+                            }
+                            else if (words[0] == column.name || words[0] === column.property) {
+                                words[0] = words[0] + " as \"" + _this._translate.instant(words[0]) + "\"";
+                            }
+                        }
+                    }
+                    catch (e_2_1) { e_2 = { error: e_2_1 }; }
+                    finally {
+                        try {
+                            if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
+                        }
+                        finally { if (e_2) throw e_2.error; }
+                    }
+                }
+                return words[0];
+            }
+            return words.join(' ');
+        });
+        selectQuery = selectQueryArray.join(',');
+        query.setParam('$select', selectQuery);
+        return query;
+    };
+    /**
+     * Constructs the fetch URL based the query parameters
+     * @param {ClientDataQueryable} query
+     * @return String
+     */
+    BtnExpDirective.prototype.constructURL = function (query) {
+        var baseURL = query.getService().getBase();
+        var url = baseURL.endsWith('/') ? (baseURL + query.getModel() + '?') : (baseURL + '/' + query.getModel() + '?');
+        Object.keys(query.getParams()).forEach(function (key, index) {
+            if (index === 0) {
+                url += key + '=' + query.getParams()[key];
+            }
+            else {
+                url += '&' + key + '=' + query.getParams()[key];
+            }
+        });
+        return url;
+    };
+    /**
+     * Constructs the query by setting the parameters of the
+     * advanced table's active filters, sets the necessary headers
+     * and build the select parameter of the query
+     * @param {ClientDataQueryable} query
+     * @param params: The filters of the last query of the activated table
+     * @param tableConfig: The configuration of the activated table
+     * @param {Headers} headers: The headers to append to the query
+     * @return ClientDataQueryable
+     */
+    BtnExpDirective.prototype.constructQuery = function (query, params, tableConfig, headers) {
+        var _query = this.setParams(query, params);
+        _query = this.setHeaders(_query, headers);
+        _query = this.constructQueryParam(_query, tableConfig);
+        return _query;
+    };
+    /**
+     * Fetches and saves the xlsx file
+     * @param {String} url
+     * @param {Headers} serviceHeaders: The headers to append to the query
+     * @param modelName: The model name of the advanced table
+     */
+    BtnExpDirective.prototype.downloadFile = function (url, serviceHeaders, modelName) {
+        var _this = this;
+        this._loadingService.showLoading();
+        fetch(encodeURI(url), {
+            headers: serviceHeaders,
+            credentials: 'include'
+        }).then(function (response) {
+            if (response && !response.ok) {
+                throw new ResponseError(response.statusText, response.status);
+            }
+            return response.blob();
+        }).then(function (blob) {
+            var objectUrl = window.URL.createObjectURL(blob);
+            var a = document.createElement('a');
+            document.body.appendChild(a);
+            a.setAttribute('style', 'display: none');
+            a.href = objectUrl;
+            var downloadName = modelName + ".xlsx";
+            a.download = downloadName;
+            // this adds support for IE and MS Edge (up to version 44.19041)
+            if (window.navigator && window.navigator.msSaveOrOpenBlob) {
+                window.navigator.msSaveOrOpenBlob(blob, downloadName);
+            }
+            else {
+                // for all other browsers
+                a.click();
+            }
+            window.URL.revokeObjectURL(objectUrl);
+            a.remove();
+            _this._loadingService.hideLoading();
+        }).catch(function (err) {
+            _this._loadingService.hideLoading();
+            _this._errorService.showError(err, {
+                continueLink: '.'
+            });
+        });
+    };
+    BtnExpDirective.decorators = [
+        { type: Directive, args: [{
+                    selector: '.universis-btn-export'
+                },] }
+    ];
+    /** @nocollapse */
+    BtnExpDirective.ctorParameters = function () { return [
+        { type: ActivatedTableService },
+        { type: AngularDataContext },
+        { type: ConfigurationService },
+        { type: TranslateService },
+        { type: LoadingService },
+        { type: ErrorService }
+    ]; };
+    BtnExpDirective.propDecorators = {
+        clickEvent: [{ type: HostListener, args: ['click', ['$event'],] }]
+    };
+    return BtnExpDirective;
+}());
+
 // restore jquery import to avoid Cannot call a namespace ('jquery') error
 var jQuery = jQuery_;
 var DataTablesApi = jQuery.fn.dataTable.Api;
@@ -851,6 +1137,15 @@ var TableTranslationChangeDetector = /** @class */ (function (_super) {
     return TableTranslationChangeDetector;
 }(ChangeDetectorRef));
 var COLUMN_FORMATTERS = new InjectionToken('column.formatters');
+var ExportLimitExceededError = /** @class */ (function (_super) {
+    __extends(ExportLimitExceededError, _super);
+    function ExportLimitExceededError(message) {
+        var _this = _super.call(this, message) || this;
+        _this.name = 'ExportLimitExceededError';
+        return _this;
+    }
+    return ExportLimitExceededError;
+}(RangeError));
 var ColumnFormatter = /** @class */ (function (_super) {
     __extends(ColumnFormatter, _super);
     function ColumnFormatter(injector) {
@@ -881,7 +1176,7 @@ function getRandomIdentifier() {
     return (Number(String(Math.random()).slice(2))).toString(36);
 }
 var AdvancedTableComponent = /** @class */ (function () {
-    function AdvancedTableComponent(_context, _columnFormatters, _activatedRoute, _translateService, _injector, _advancedFilterValueProvider, _element, _template, _loading, _http, _columnSelector) {
+    function AdvancedTableComponent(_context, _columnFormatters, _activatedRoute, _translateService, _injector, _advancedFilterValueProvider, _element, _template, _loading, _http, _columnSelector, _configuration, _exportSpreadsheet, _modalService, _errorService) {
         var _this = this;
         this._context = _context;
         this._columnFormatters = _columnFormatters;
@@ -894,6 +1189,10 @@ var AdvancedTableComponent = /** @class */ (function () {
         this._loading = _loading;
         this._http = _http;
         this._columnSelector = _columnSelector;
+        this._configuration = _configuration;
+        this._exportSpreadsheet = _exportSpreadsheet;
+        this._modalService = _modalService;
+        this._errorService = _errorService;
         this._firstLoad = true;
         this._showFooter = false;
         this._showHeader = true;
@@ -937,6 +1236,7 @@ var AdvancedTableComponent = /** @class */ (function () {
         this.customSelect = false;
         this.selected = [];
         this.unselected = [];
+        this._lastQueryTotalItems = 0;
         // initialize translate pipe
         this.translator = new TranslatePipe(this._translateService, new TableTranslationChangeDetector());
         jQuery.fn.dataTable.ext.classes.sPageButton = 'btn';
@@ -960,6 +1260,13 @@ var AdvancedTableComponent = /** @class */ (function () {
         enumerable: true,
         configurable: true
     });
+    Object.defineProperty(AdvancedTableComponent.prototype, "lastQueryTotalItems", {
+        get: function () {
+            return this._lastQueryTotalItems;
+        },
+        enumerable: true,
+        configurable: true
+    });
     Object.defineProperty(AdvancedTableComponent.prototype, "showFooter", {
         get: function () {
             return this._showFooter;
@@ -1586,6 +1893,7 @@ var AdvancedTableComponent = /** @class */ (function () {
                                 recordsFiltered: 0,
                                 data: [],
                             };
+                            self._lastQueryTotalItems = 0;
                             // emit empty data
                             self.load.emit(emptyDataSet);
                             // return empty data
@@ -1680,6 +1988,7 @@ var AdvancedTableComponent = /** @class */ (function () {
                                     recordsFiltered: items.total,
                                     data: items.value,
                                 };
+                                self._lastQueryTotalItems = items.total;
                                 if (items.total === 0) {
                                     self.resetEmptyTable();
                                 }
@@ -1693,6 +2002,7 @@ var AdvancedTableComponent = /** @class */ (function () {
                             console.error('TABLES', err);
                             // show error
                             self.toggleError(err);
+                            self._lastQueryTotalItems = 0;
                             // by returning empty dataset
                             self.load.emit(EMPTY_DATASET);
                             return fnCallback(EMPTY_DATASET);
@@ -1705,6 +2015,7 @@ var AdvancedTableComponent = /** @class */ (function () {
                             recordsFiltered: items.total,
                             data: items.value,
                         };
+                        self._lastQueryTotalItems = items.total;
                         if (items.total === 0) {
                             self.resetEmptyTable();
                         }
@@ -2088,6 +2399,125 @@ var AdvancedTableComponent = /** @class */ (function () {
             }
         });
     };
+    /**
+     *
+     * @param options to pass an errorHandler callback, if desired
+     * @returns void
+     */
+    AdvancedTableComponent.prototype.exportView = function (options) {
+        return __awaiter(this, void 0, void 0, function () {
+            var exportSettings, exportLimit, totalDisplayedItems, _a, body, header, previousDataState, targetDataState, _b, body, header, err_1;
+            return __generator(this, function (_c) {
+                switch (_c.label) {
+                    case 0:
+                        _c.trys.push([0, 4, 5, 6]);
+                        this._loading.showLoading();
+                        // validate query items and config
+                        if (!(this._lastQueryTotalItems && this.config)) {
+                            // do nothing
+                            return [2 /*return*/];
+                        }
+                        exportSettings = this._configuration.settings;
+                        exportLimit = (exportSettings && exportSettings.tables && exportSettings.tables.exportLimit > 0)
+                            ? exportSettings.tables.exportLimit : MAX_EXPORT_ITEMS;
+                        // and validate it
+                        if (this._lastQueryTotalItems > exportLimit) {
+                            // call error handler
+                            // provide a recognizible error type
+                            if (options && options.errorHandler) {
+                                options.errorHandler(new ExportLimitExceededError('Export limit exceeded'));
+                                return [2 /*return*/];
+                            }
+                            // or show warning modal and exit
+                            this._modalService.showWarningDialog(this._translateService.instant('Tables.ExportList'), this._translateService.instant('Tables.ExportLimitExceeded', { dataLength: this._lastQueryTotalItems, exportLimit: exportLimit }), DIALOG_BUTTONS.Ok);
+                            return [2 /*return*/];
+                        }
+                        totalDisplayedItems = Array.from(this.dataTable.context[0].aiDisplay).length;
+                        if (!(totalDisplayedItems === this._lastQueryTotalItems)) return [3 /*break*/, 1];
+                        _a = this.getExportableData(), body = _a.body, header = _a.header;
+                        // and export them to excel
+                        this._exportSpreadsheet.export(body, this._translateService.instant(this.config.title || 'Tables.ExportResults') + ".xlsx", {
+                            header: header,
+                            skipHeader: false
+                        });
+                        return [3 /*break*/, 3];
+                    case 1:
+                        previousDataState = this.dataTable.rows().data().toArray();
+                        return [4 /*yield*/, this.lastQuery.take(exportLimit).getItems()];
+                    case 2:
+                        targetDataState = _c.sent();
+                        // change table data on the fly, but do not redraw
+                        this.dataTable.clear().rows.add(targetDataState);
+                        _b = this.getExportableData(), body = _b.body, header = _b.header;
+                        // reset table data
+                        this.dataTable.clear().rows.add(previousDataState);
+                        // and export target data to excel
+                        this._exportSpreadsheet.export(body, this._translateService.instant(this.config.title || 'Tables.ExportResults') + ".xlsx", {
+                            header: header,
+                            skipHeader: false
+                        });
+                        _c.label = 3;
+                    case 3: 
+                    // exit
+                    return [2 /*return*/];
+                    case 4:
+                        err_1 = _c.sent();
+                        // log error
+                        console.error(err_1);
+                        // call error handler, if defined
+                        if (options && options.errorHandler) {
+                            options.errorHandler(err_1);
+                        }
+                        else {
+                            // use default error service
+                            this._errorService.showError(err_1, {
+                                continueLink: '.'
+                            });
+                        }
+                        return [3 /*break*/, 6];
+                    case 5:
+                        this._loading.hideLoading();
+                        return [7 /*endfinally*/];
+                    case 6: return [2 /*return*/];
+                }
+            });
+        });
+    };
+    AdvancedTableComponent.prototype.getExportableData = function () {
+        var _this = this;
+        if (!(this.dataTable && this.dataTable.buttons
+            && typeof this.dataTable.buttons.exportData === 'function' && this.config)) {
+            return { body: [], header: [] };
+        }
+        // fetch exportable excel data
+        var _a = this.dataTable.buttons.exportData(), body = _a.body, header = _a.header;
+        var cleanupIndexes = [];
+        // clean up headers
+        header = header.filter(function (headerItem, index) {
+            // exclude empty headers
+            if (headerItem.trim().length === 0) {
+                cleanupIndexes.push(index);
+                return false;
+            }
+            // find item by title
+            var findItem = _this.config.columns.find(function (column) {
+                return column.title && column.title.length && _this._translateService.instant(column.title) === headerItem;
+            });
+            // exclude hidden columns
+            if (findItem && findItem.hidden === true) {
+                cleanupIndexes.push(index);
+                return false;
+            }
+            return true;
+        });
+        // clean up body
+        body = body.map(function (row) {
+            return row.filter(function (_, rowIndex) {
+                return cleanupIndexes.indexOf(rowIndex) === -1;
+            });
+        });
+        return { body: body, header: header };
+    };
     AdvancedTableComponent.decorators = [
         { type: Component, args: [{
                     // tslint:disable-next-line: component-selector
@@ -2109,7 +2539,11 @@ var AdvancedTableComponent = /** @class */ (function () {
         { type: TemplatePipe },
         { type: LoadingService },
         { type: HttpClient },
-        { type: ColumnSelectorService }
+        { type: ColumnSelectorService },
+        { type: ConfigurationService },
+        { type: ExportSpreadsheetService },
+        { type: ModalService },
+        { type: ErrorService }
     ]; };
     AdvancedTableComponent.propDecorators = {
         table: [{ type: ViewChild, args: ['table',] }],
@@ -3090,61 +3524,24 @@ var AdvancedTableConfigurationResolver = /** @class */ (function () {
 }());
 var AdvancedSearchConfigurationResolver = /** @class */ (function () {
     function AdvancedSearchConfigurationResolver(_http) {
-        this._http = _http;
-    }
-    AdvancedSearchConfigurationResolver.prototype.resolve = function (route, state) {
-        // get list
-        var list = route.data.list || route.params.list;
-        // get model
-        var model = route.data.model || route.params.model;
-        // get configuration
-        return this._http.get("assets/lists/" + model + "/search." + list + ".json").toPromise();
-    };
-    AdvancedSearchConfigurationResolver.decorators = [
-        { type: Injectable }
-    ];
-    /** @nocollapse */
-    AdvancedSearchConfigurationResolver.ctorParameters = function () { return [
-        { type: HttpClient }
-    ]; };
-    return AdvancedSearchConfigurationResolver;
-}());
-
-var ActivatedTableService = /** @class */ (function () {
-    function ActivatedTableService(_router, _activatedRoute) {
-        var _this = this;
-        this._router = _router;
-        this._activatedRoute = _activatedRoute;
-        _router.events.forEach(function (event) {
-            if (event instanceof NavigationStart) {
-                if (_this._activeTable) {
-                    _this._activeTable = null;
-                }
-            }
-        });
-    }
-    Object.defineProperty(ActivatedTableService.prototype, "activeTable", {
-        get: function () {
-            return this._activeTable;
-        },
-        set: function (tableComponent) {
-            this._activeTable = tableComponent;
-        },
-        enumerable: true,
-        configurable: true
-    });
-    ActivatedTableService.decorators = [
-        { type: Injectable, args: [{
-                    providedIn: 'root'
-                },] }
+        this._http = _http;
+    }
+    AdvancedSearchConfigurationResolver.prototype.resolve = function (route, state) {
+        // get list
+        var list = route.data.list || route.params.list;
+        // get model
+        var model = route.data.model || route.params.model;
+        // get configuration
+        return this._http.get("assets/lists/" + model + "/search." + list + ".json").toPromise();
+    };
+    AdvancedSearchConfigurationResolver.decorators = [
+        { type: Injectable }
     ];
     /** @nocollapse */
-    ActivatedTableService.ctorParameters = function () { return [
-        { type: Router },
-        { type: ActivatedRoute }
+    AdvancedSearchConfigurationResolver.ctorParameters = function () { return [
+        { type: HttpClient }
     ]; };
-    ActivatedTableService.ngInjectableDef = defineInjectable({ factory: function ActivatedTableService_Factory() { return new ActivatedTableService(inject(Router), inject(ActivatedRoute)); }, token: ActivatedTableService, providedIn: "root" });
-    return ActivatedTableService;
+    return AdvancedSearchConfigurationResolver;
 }());
 
 var AdvancedTableSettingsComponent = /** @class */ (function () {
@@ -4058,251 +4455,6 @@ var AdvancedTableEditorDirective = /** @class */ (function () {
     return AdvancedTableEditorDirective;
 }());
 
-var MAX_EXPORT_ITEMS = 500;
-var BtnExpDirective = /** @class */ (function () {
-    function BtnExpDirective(_activatedTable, _context, _config, _translate, _loadingService, _errorService) {
-        this._activatedTable = _activatedTable;
-        this._context = _context;
-        this._config = _config;
-        this._translate = _translate;
-        this._loadingService = _loadingService;
-        this._errorService = _errorService;
-    }
-    BtnExpDirective.prototype.clickEvent = function (event) {
-        return __awaiter(this, void 0, void 0, function () {
-            var lastQuery, tableConfig, serviceHeaders, queryModel, query, queryParams, exportSettings, maxExportItems, url;
-            return __generator(this, function (_a) {
-                event.preventDefault();
-                event.stopPropagation();
-                if (this._activatedTable.activeTable) {
-                    lastQuery = this._activatedTable.activeTable.lastQuery;
-                    tableConfig = this._activatedTable.activeTable.config;
-                    serviceHeaders = this._context.getService().getHeaders();
-                    queryModel = lastQuery.getModel();
-                    query = this._context.model(queryModel).asQueryable();
-                    queryParams = lastQuery.getParams();
-                    query = this.constructQuery(query, queryParams, tableConfig, serviceHeaders);
-                    exportSettings = this._config.settings;
-                    maxExportItems = exportSettings && exportSettings.tables && exportSettings.tables.exportLimit;
-                    if (maxExportItems && typeof maxExportItems === 'number' && maxExportItems > 0) {
-                        query.skip(0).take(maxExportItems);
-                    }
-                    else {
-                        query.skip(0).take(MAX_EXPORT_ITEMS);
-                    }
-                    url = this.constructURL(query);
-                    this.downloadFile(url, query.getService().getHeaders(), query.getModel());
-                }
-                return [2 /*return*/];
-            });
-        });
-    };
-    /**
-     * Sets the parameters to the query based on
-     * the active filters of the activated table
-     * @param {ClientDataQueryable} query
-     * @param params: The filters of the last query of the activated table
-     * @return ClientDataQueryable
-     */
-    BtnExpDirective.prototype.setParams = function (query, params) {
-        if (params && typeof params === 'object') {
-            Object.keys(params).forEach(function (key) {
-                query.setParam(key, params[key]);
-            });
-        }
-        return query;
-    };
-    /**
-     * Sets the headers to the query based on
-     * the default headers of the DataContext
-     * and appending the accept header to get
-     * an xlsx file from the API
-     * @param {ClientDataQueryable} query
-     * @param {Headers} headers: The headers to append to the query
-     * @return ClientDataQueryable
-     */
-    BtnExpDirective.prototype.setHeaders = function (query, headers) {
-        Object.keys(headers).forEach(function (key) {
-            if (headers.hasOwnProperty(key)) {
-                query.getService().setHeader(key, headers[key]);
-            }
-        });
-        // sets a header to accept xlsx files
-        query.getService().setHeader('Accept', 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet');
-        return query;
-    };
-    /**
-     * Constructs the select parameter of the
-     * ClientDataQuery by replacing the target name
-     * of the field based on the localized translation
-     * of that property on the advanced tabled
-     * @param {ClientDataQueryable} query
-     * @param tableConfig: The configuration of the activated table
-     * @return ClientDataQueryable
-     */
-    BtnExpDirective.prototype.constructQueryParam = function (query, tableConfig) {
-        var _this = this;
-        var selectQuery = query.getParams().$select;
-        var selectQueryArray = selectQuery.split(',');
-        selectQueryArray = selectQueryArray.map(function (select$$1) {
-            var e_1, _a, e_2, _b;
-            var words = select$$1.split(' ');
-            if (words.length === 3) {
-                if (tableConfig && tableConfig.columns) {
-                    try {
-                        for (var _c = __values(tableConfig.columns), _d = _c.next(); !_d.done; _d = _c.next()) {
-                            var column = _d.value;
-                            if (column.property === words[2] && column.title) {
-                                words[2] = "\"" + _this._translate.instant(column.title) + "\"";
-                            }
-                            else if (column.property === words[2]) {
-                                words[2] = "\"" + _this._translate.instant(words[2]) + "\"";
-                            }
-                        }
-                    }
-                    catch (e_1_1) { e_1 = { error: e_1_1 }; }
-                    finally {
-                        try {
-                            if (_d && !_d.done && (_a = _c.return)) _a.call(_c);
-                        }
-                        finally { if (e_1) throw e_1.error; }
-                    }
-                }
-            }
-            if (words.length === 1) {
-                if (tableConfig && tableConfig.columns) {
-                    try {
-                        for (var _e = __values(tableConfig.columns), _f = _e.next(); !_f.done; _f = _e.next()) {
-                            var column = _f.value;
-                            if (column.name === words[0] && column.title) {
-                                words[0] = words[0] + " as \"" + _this._translate.instant(column.title) + "\"";
-                                break;
-                            }
-                            else if (column.name === words[0] && column.property) {
-                                words[0] = words[0] + " as \"" + _this._translate.instant(column.property) + "\"";
-                                break;
-                            }
-                            else if (words[0] === column.name && words[0] === "id" && column.hidden) {
-                                break;
-                            }
-                            else if (words[0] == column.name || words[0] === column.property) {
-                                words[0] = words[0] + " as \"" + _this._translate.instant(words[0]) + "\"";
-                            }
-                        }
-                    }
-                    catch (e_2_1) { e_2 = { error: e_2_1 }; }
-                    finally {
-                        try {
-                            if (_f && !_f.done && (_b = _e.return)) _b.call(_e);
-                        }
-                        finally { if (e_2) throw e_2.error; }
-                    }
-                }
-                return words[0];
-            }
-            return words.join(' ');
-        });
-        selectQuery = selectQueryArray.join(',');
-        query.setParam('$select', selectQuery);
-        return query;
-    };
-    /**
-     * Constructs the fetch URL based the query parameters
-     * @param {ClientDataQueryable} query
-     * @return String
-     */
-    BtnExpDirective.prototype.constructURL = function (query) {
-        var baseURL = query.getService().getBase();
-        var url = baseURL.endsWith('/') ? (baseURL + query.getModel() + '?') : (baseURL + '/' + query.getModel() + '?');
-        Object.keys(query.getParams()).forEach(function (key, index) {
-            if (index === 0) {
-                url += key + '=' + query.getParams()[key];
-            }
-            else {
-                url += '&' + key + '=' + query.getParams()[key];
-            }
-        });
-        return url;
-    };
-    /**
-     * Constructs the query by setting the parameters of the
-     * advanced table's active filters, sets the necessary headers
-     * and build the select parameter of the query
-     * @param {ClientDataQueryable} query
-     * @param params: The filters of the last query of the activated table
-     * @param tableConfig: The configuration of the activated table
-     * @param {Headers} headers: The headers to append to the query
-     * @return ClientDataQueryable
-     */
-    BtnExpDirective.prototype.constructQuery = function (query, params, tableConfig, headers) {
-        var _query = this.setParams(query, params);
-        _query = this.setHeaders(_query, headers);
-        _query = this.constructQueryParam(_query, tableConfig);
-        return _query;
-    };
-    /**
-     * Fetches and saves the xlsx file
-     * @param {String} url
-     * @param {Headers} serviceHeaders: The headers to append to the query
-     * @param modelName: The model name of the advanced table
-     */
-    BtnExpDirective.prototype.downloadFile = function (url, serviceHeaders, modelName) {
-        var _this = this;
-        this._loadingService.showLoading();
-        fetch(encodeURI(url), {
-            headers: serviceHeaders,
-            credentials: 'include'
-        }).then(function (response) {
-            if (response && !response.ok) {
-                throw new ResponseError(response.statusText, response.status);
-            }
-            return response.blob();
-        }).then(function (blob) {
-            var objectUrl = window.URL.createObjectURL(blob);
-            var a = document.createElement('a');
-            document.body.appendChild(a);
-            a.setAttribute('style', 'display: none');
-            a.href = objectUrl;
-            var downloadName = modelName + ".xlsx";
-            a.download = downloadName;
-            // this adds support for IE and MS Edge (up to version 44.19041)
-            if (window.navigator && window.navigator.msSaveOrOpenBlob) {
-                window.navigator.msSaveOrOpenBlob(blob, downloadName);
-            }
-            else {
-                // for all other browsers
-                a.click();
-            }
-            window.URL.revokeObjectURL(objectUrl);
-            a.remove();
-            _this._loadingService.hideLoading();
-        }).catch(function (err) {
-            _this._loadingService.hideLoading();
-            _this._errorService.showError(err, {
-                continueLink: '.'
-            });
-        });
-    };
-    BtnExpDirective.decorators = [
-        { type: Directive, args: [{
-                    selector: '.universis-btn-export'
-                },] }
-    ];
-    /** @nocollapse */
-    BtnExpDirective.ctorParameters = function () { return [
-        { type: ActivatedTableService },
-        { type: AngularDataContext },
-        { type: ConfigurationService },
-        { type: TranslateService },
-        { type: LoadingService },
-        { type: ErrorService }
-    ]; };
-    BtnExpDirective.propDecorators = {
-        clickEvent: [{ type: HostListener, args: ['click', ['$event'],] }]
-    };
-    return BtnExpDirective;
-}());
-
 var AdvancedAggregatorService = /** @class */ (function () {
     function AdvancedAggregatorService(_context, _template) {
         this._context = _context;
@@ -4865,6 +5017,8 @@ var ParseTitlePipe = /** @class */ (function () {
     return ParseTitlePipe;
 }());
 
+// tslint:disable: quotemark
+// tslint:disable: max-line-length
 var TABLES_EL = {
     "Tables": {
         "Export": "Εξαγωγή",
@@ -4948,7 +5102,10 @@ var TABLES_EL = {
         "DataError": {
             "Title": "Σφάλμα κατά την παραλαβή των δεδομένων",
             "Message": "Συνέβη σφάλμα κατά την παραλαβή των δεδομένων. Προσπαθήστε ξανά ή τροποποιήστε τα στοιχεία αναζήτησης."
-        }
+        },
+        "ExportList": "Εξαγωγή λίστας",
+        "ExportLimitExceeded": "Το πλήθος των στοιχείων προς εξαγωγή ({{dataLength}}) ξεπερνάει το μέγιστο επιτρεπτό ({{exportLimit}}). Παρακαλούμε προσαρμόστε τα φίλτρα της αναζήτησης και προσπαθήστε ξανά.",
+        "ExportResults": "Δεδομένα λίστας"
     },
     "TrueFalse": {
         "long": {
@@ -4989,6 +5146,8 @@ var TABLES_EL = {
     }
 };
 
+// tslint:disable: quotemark
+// tslint:disable: max-line-length
 var TABLES_EN = {
     "Tables": {
         "Export": "Export",
@@ -5071,7 +5230,10 @@ var TABLES_EN = {
         "DataError": {
             "Title": "Error while getting data",
             "Message": "An error occurred while getting data. Please try again or change your criteria."
-        }
+        },
+        "ExportList": "Export list",
+        "ExportLimitExceeded": "The number of items that are to be exported ({{dataLength}}) exceeds the export limit ({{exportLimit}}). Please apply more specific filters to the search.",
+        "ExportResults": "Exported list"
     },
     "TrueFalse": {
         "long": {
@@ -5502,6 +5664,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, ɵ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 };
+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, ExportLimitExceededError, AdvancedTableConfiguration, AdvancedTableComponent, ɵ0, AdvancedTableSettingsComponent, AdvancedTableSearchBaseComponent, AdvancedTableSearchComponent, FORMATTERS, AdvancedFilterValueProvider, AdvancedTableModalBaseTemplate, AdvancedTableModalBaseComponent, SimpleHeaderToolsComponent, TableSimpleHeaderComponent, AdvancedTableNotNullError, AdvancedTableEditorDirective, MAX_EXPORT_ITEMS, BtnExpDirective, AdvancedAggregatorComponent, AdvancedAggregatorListComponent, AddItemsComponent, AdvancedAggregatorPipe, ParseTitlePipe, AdvancedAggregatorService, TablesModule, ActivatedTableService, ColumnSelectorService, ColumnSelectorComponent, initialState, tableInitialState, tableReducer, tableReducers, featureName, getTablesState, selectTable };
 
 //# sourceMappingURL=universis-ngx-tables.js.map