@easyquery/ui 7.2.3-rc03 → 7.2.4-beta03

package/dist/lib/views/report_view.js

@@ -1,732 +1,734 @@
-var __extends = (this && this.__extends) || (function () {
-    var extendStatics = function (d, b) {
-        extendStatics = Object.setPrototypeOf ||
-            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
-            function (d, b) { for (var p in b) if (b.hasOwnProperty(p)) d[p] = b[p]; };
-        return extendStatics(d, b);
-    };
-    return function (d, b) {
-        extendStatics(d, b);
-        function __() { this.constructor = d; }
-        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
-    };
-})();
-import { WidgetGroup, QueryChangePart } from '@easyquery/core';
-import { i18n, utils as dataUtils } from '@easydata/core';
-import { domel } from '@easydata/ui';
-import { browserUtils } from '../utils/browser_utils';
-import { View } from './view';
-/**
- * The view that represents the "ad-hoc reporting" scenario
- */
-var ReportView = /** @class */ (function (_super) {
-    __extends(ReportView, _super);
-    function ReportView() {
-        var _this = _super.call(this) || this;
-        _this.reports = [];
-        _this.reportCache = [];
-        _this.exportButtons = [];
-        _this.exportClass = "eqjs-export";
-        _this.disabledClass = "eqjs-disabled";
-        _this.enableExport = false;
-        _this.useReportCache = true;
-        _this.syncReportOnChange = true;
-        _this._reportSaveTemplate = "<div id=\"kdlg-dialog-form\" class=\"kfrm-form\">\n            <div class=\"kfrm-fields label-above\">\n                <label for=\"kdlg-dialog-form-input\" id=\"kdlg-dialog-form-content\"></label>\n                <input type=\"text\" name=\"kdlg-dialog-form-input\" id=\"kdlg-dialog-form-input\" />\n                <label for=\"kdlg-dialog-form-textarea\" id=\"kdlg-dialog-form-desc-label\"></label>\n                <textarea type=\"text\" name=\"kdlg-dialog-form-textarea\" id=\"kdlg-dialog-form-textarea\"></textarea>\n            </div>\n        </div>";
-        _this.context.useStoredQueryOnFetch = true;
-        _this.exportButtonClickHandler = function (srcElement, e) {
-            if (!srcElement.classList.contains(_this.disabledClass)) {
-                var format = srcElement.getAttribute("data-format");
-                _this.context.exportResult({ format: format });
-            }
-        };
-        _this.clearReportButtonClickHandler = _this.clearReportButtonClick.bind(_this);
-        _this.newReportButtonClickHandler = _this.newReportButtonClick.bind(_this);
-        _this.loadReportButtonClickHandler = _this.loadReportButtonClick.bind(_this);
-        _this.saveReportButtonClickHandler = _this.saveReportButtonClick.bind(_this);
-        _this.removeReportButtonClickHandler = _this.removeReportButtonClick.bind(_this);
-        _this.reloadReportDataButtonClickHandler = _this.reloadReportDataButtonClick.bind(_this);
-        browserUtils.onMobileModeChanged(function (_) {
-            document.location.reload();
-        });
-        return _this;
-    }
-    ReportView.prototype.initOptions = function (options) {
-        options = _super.prototype.initOptions.call(this, options);
-        if (typeof (options.syncQueryOnChange) !== "undefined") {
-            this.syncReportOnChange = options.syncQueryOnChange;
-        }
-        if (typeof (options.syncReportOnChange) !== "undefined") {
-            this.syncReportOnChange = options.syncReportOnChange;
-        }
-        options.syncQueryOnChange = this.syncReportOnChange;
-        if (typeof (options.useReportCache) !== "undefined") {
-            this.useReportCache = options.useReportCache;
-        }
-        this.defaultReportId = options.defaultReportId;
-        return options;
-    };
-    ReportView.prototype.initDone = function () {
-        var _this = this;
-        _super.prototype.initDone.call(this);
-        var query = this.context.getQuery();
-        query.addChangedCallback(function (event) {
-            var eventData = event.data;
-            if (eventData) {
-                if (eventData.changeType == "query.switched") {
-                    _this.context.clearResult();
-                    _this.context.refreshWidgets(WidgetGroup.Result);
-                    _this.context.refreshWidgets(WidgetGroup.Query);
-                }
-                else {
-                    _this.disableExportButtons();
-                    if (_this.resultCountSlot) {
-                        _this.resultCountSlot.style.display = "none";
-                    }
-                }
-            }
-            //true if we just switched the report or changed facets (query was not changed)
-            var isLiteUpdate = !eventData
-                || eventData.changeType == "query.switched"
-                || eventData.part == QueryChangePart.ExtraData
-                || eventData.part == QueryChangePart.Facets;
-            var syncStarted = false;
-            if (_this.syncReportOnChange) {
-                var needSync = eventData && eventData.changeType != "query.switched" && !eventData.noSync;
-                if (needSync) {
-                    syncStarted = true;
-                    _this.syncReport({
-                        success: function () {
-                            // fetch data on query change
-                            if (!isLiteUpdate && _this.viewOptions.fetchDataOnChange) {
-                                _this.fetchData();
-                            }
-                        }
-                    });
-                }
-            }
-            // clear dataset result on query change
-            if (!isLiteUpdate && _this.resultOptions.clearResultOnQueryChange) {
-                _this.context.clearResult();
-                _this.context.refreshWidgets(WidgetGroup.Result);
-            }
-            if (!isLiteUpdate && !syncStarted && _this.viewOptions.fetchDataOnChange) {
-                _this.fetchData();
-            }
-        });
-        window.setTimeout(function () {
-            _this.context.loadQueryList({
-                success: function (data) {
-                    if (Array.isArray(data)) {
-                        _this.reports = data;
-                        var exists = _this.reports.filter(function (r) { return r.id == _this.defaultReportId; }).length > 0;
-                        if (exists) {
-                            _this.renderReportList({ reportId: _this.defaultReportId });
-                        }
-                        else {
-                            _this.renderReportList();
-                        }
-                    }
-                }
-            });
-        }, 100);
-    };
-    ReportView.prototype.initWidgets = function (options) {
-        var _this = this;
-        _super.prototype.initWidgets.call(this, options);
-        var clearReportButton = "ClearReportButton";
-        var newReportButton = "NewReportButton";
-        var loadReportButton = "LoadReportButton";
-        var saveReportButton = "SaveReportButton";
-        var removeReportButton = "RemoveReportButton";
-        var reloadReportDataButton = "ReloadReportDataButton";
-        var resultCountSpan = "ResultCount";
-        var exportButtons = "ResultExportButtons";
-        var exportClass = this.exportClass;
-        if (options.slots) {
-            resultCountSpan = options.slots.resultCountSpan || resultCountSpan;
-            exportButtons = options.slots.exportButtons || exportButtons;
-            clearReportButton = options.slots.clearReportButton || clearReportButton;
-            newReportButton = options.slots.newReportButton || newReportButton;
-            loadReportButton = options.slots.loadReportButton || loadReportButton;
-            saveReportButton = options.slots.saveReportButton || saveReportButton;
-            removeReportButton = options.slots.removeReportButton || removeReportButton;
-            reloadReportDataButton = options.slots.reloadReportDataButton || reloadReportDataButton;
-            exportClass = options.slots.exportClass || exportClass;
-        }
-        this.exportButtons = this.domRoots.reduce(function (elems, root) {
-            return elems.concat(Array.from(root.querySelectorAll("." + exportClass)));
-        }, []);
-        this.enableExport = options.enableExport;
-        if (this.enableExport) {
-            //Add event listener for export buttons
-            this.exportButtons.forEach(function (button) {
-                button.addEventListener('click', _this.exportButtonClickHandler);
-            });
-        }
-        else {
-            this.hideExportButtons();
-        }
-        this.exportButtonsContainer = this.resolveElement(exportButtons);
-        if (!this.clearReportButton) {
-            this.clearReportButton = this.resolveElement(clearReportButton);
-            if (this.clearReportButton) {
-                this.clearReportButton.addEventListener('click', this.clearReportButtonClickHandler);
-            }
-        }
-        if (!this.newReportButton) {
-            this.newReportButton = this.resolveElement(newReportButton);
-            if (this.newReportButton) {
-                this.newReportButton.addEventListener('click', this.newReportButtonClickHandler);
-            }
-        }
-        if (!this.loadReportButton) {
-            this.loadReportButton = this.resolveElement(loadReportButton);
-            if (this.loadReportButton) {
-                this.loadReportButton.addEventListener('click', this.loadReportButtonClickHandler);
-            }
-        }
-        if (!this.saveReportButton) {
-            this.saveReportButton = this.resolveElement(saveReportButton);
-            if (this.saveReportButton) {
-                this.saveReportButton.addEventListener('click', this.saveReportButtonClickHandler);
-            }
-        }
-        if (!this.removeReportButton) {
-            this.removeReportButton = this.resolveElement(removeReportButton);
-            if (this.removeReportButton) {
-                this.removeReportButton.addEventListener('click', this.removeReportButtonClickHandler);
-            }
-        }
-        if (!this.reloadReportDataButton) {
-            this.reloadReportDataButton = this.resolveElement(reloadReportDataButton);
-            //OBSOLETE: remove the next 3 lines. We just support the old default button ID here
-            if (!this.reloadReportDataButton) {
-                this.reloadReportDataButton = this.resolveElement('UpdateReportButton');
-            }
-            if (this.reloadReportDataButton) {
-                this.reloadReportDataButton.addEventListener('click', this.reloadReportDataButtonClickHandler);
-            }
-        }
-        this.reportListSlot = document.getElementById('ReportList');
-        this.resultCountSlot = this.resolveElement(resultCountSpan);
-    };
-    /**
-    * Creates a new report.
-    */
-    ReportView.prototype.newReport = function () {
-        var _this = this;
-        var ds = this.context.getServices().getDialogService();
-        var dlg = ds.open({
-            title: i18n.getText('NewReportDlgTitle'),
-            body: this._reportSaveTemplate,
-            submitable: true,
-            closable: true,
-            cancelable: true,
-            submitOnEnter: true,
-            arrangeParents: false,
-            beforeOpen: function () {
-                var input = document.getElementById("kdlg-dialog-form-input");
-                input.value = i18n.getText('NewReportDefName');
-                var content = document.getElementById('kdlg-dialog-form-content');
-                content.innerHTML = i18n.getText('SaveReportDlgLabel');
-                var label = document.getElementById('kdlg-dialog-form-desc-label');
-                label.innerHTML = i18n.getText('ReportDescLabel');
-                input.focus();
-            },
-            onSubmit: function () {
-                var nameInput = document.getElementById("kdlg-dialog-form-input");
-                var queryName = nameInput.value;
-                if (queryName && queryName.replace(/\s/g, '').length > 0) {
-                    dlg.clearAlert();
-                    dlg.disableButtons();
-                    var header_1 = dlg.getRootElement().querySelector('header');
-                    var processEl_1 = domel('div', header_1)
-                        .addClass('eqjs-process-bar local')
-                        .toDOM();
-                    var descInput = document.getElementById("kdlg-dialog-form-textarea");
-                    var queryDesc = descInput.value;
-                    _this.context.newQuery({
-                        name: queryName,
-                        description: queryDesc,
-                        success: function () {
-                            dlg.close();
-                            var query = _this.context.getQuery();
-                            var reportId = query.getId();
-                            _this.insertIntoReportList({ id: reportId, name: query.getName(), description: query.getDescription() });
-                            _this.renderReportList({ reportId: reportId });
-                        },
-                        error: function (error) {
-                            header_1.removeChild(processEl_1);
-                            dlg.enableButtons();
-                            dlg.showAlert(error, 'error');
-                        }
-                    });
-                }
-                return false;
-            }
-        });
-    };
-    /**
-    * Loads report by ID.
-    * @param reportId The ID of the report to load.
-    */
-    ReportView.prototype.loadReport = function (reportId) {
-        var _this = this;
-        if (!reportId) {
-            throw 'Empty report ID!';
-        }
-        var reportToLoad = this.findReportById(reportId);
-        if (!reportToLoad)
-            return;
-        var self = this;
-        var query = self.context.getQuery();
-        var reportLoaded = function () {
-            _this.renderReportProps();
-            _this.context.resultTable.clear();
-            query.fireChangedEvent({
-                part: QueryChangePart.All,
-                noSync: true,
-                changeType: 'query.switched'
-            });
-            _this.fetchData();
-        };
-        var reportContent = this.useReportCache ? this.getReportContentFromCache(reportToLoad) : null;
-        if (reportContent) {
-            query.clear();
-            query.loadFromJson(reportContent, { validate: false });
-            reportLoaded();
-        }
-        else {
-            this.context.loadQuery({
-                queryId: reportId,
-                silent: true,
-                success: function () {
-                    _this.saveReportContentInCache(reportToLoad, query.toJSON());
-                    reportLoaded();
-                }
-            });
-        }
-        this.setActiveReport(reportId);
-    };
-    /**
-    * Shows the dialog to save the report with new name.
-    */
-    ReportView.prototype.saveCurrentReportAs = function () {
-        var _this = this;
-        var query = this.context.getQuery();
-        var ds = this.context.getServices().getDialogService();
-        var dlg = ds.open({
-            title: i18n.getText('SaveReportDlgTitle'),
-            body: this._reportSaveTemplate,
-            submitable: true,
-            closable: true,
-            cancelable: true,
-            submitOnEnter: true,
-            arrangeParents: false,
-            beforeOpen: function () {
-                var input = document.getElementById("kdlg-dialog-form-input");
-                input.value = query.getName();
-                var content = document.getElementById('kdlg-dialog-form-content');
-                content.innerHTML = i18n.getText('SaveReportDlgLabel');
-                var label = document.getElementById('kdlg-dialog-form-desc-label');
-                label.innerHTML = i18n.getText('ReportDescLabel');
-                var text = document.getElementById("kdlg-dialog-form-textarea");
-                text.value = query.getDescription();
-                input.focus();
-            },
-            onSubmit: function () {
-                var input = document.getElementById("kdlg-dialog-form-input");
-                var value = input.value;
-                if (value && value.replace(/\s/g, '').length > 0) {
-                    query.setId(dataUtils.generateId(value.replace(/\s/g, '')));
-                    dlg.clearAlert();
-                    dlg.disableButtons();
-                    var header_2 = dlg.getRootElement().querySelector('header');
-                    var processEl_2 = domel('div', header_2)
-                        .addClass('eqjs-process-bar local')
-                        .toDOM();
-                    var text = document.getElementById("kdlg-dialog-form-textarea");
-                    var desc = text.value;
-                    query.setDescription(desc);
-                    _this.context.newQuery({
-                        clearQuery: false,
-                        name: value,
-                        success: function () {
-                            dlg.close();
-                            _this.context.refreshWidgets(WidgetGroup.Query);
-                            var savedQuery = _this.context.getQuery();
-                            var reportId = savedQuery.getId();
-                            _this.fetchData();
-                            _this.insertIntoReportList({ id: reportId, name: query.getName(), description: query.getDescription() });
-                            _this.renderReportList({ reportId: reportId });
-                            _this.setActiveReport(reportId);
-                            _this.renderReportProps();
-                        },
-                        error: function (error) {
-                            header_2.removeChild(processEl_2);
-                            dlg.enableButtons();
-                            dlg.showAlert(error, 'error');
-                        }
-                    });
-                }
-                return false;
-            }
-        });
-    };
-    /**
-    * Removes current report.
-    */
-    ReportView.prototype.removeCurrentReport = function () {
-        var _this = this;
-        var report = this.context.getQuery();
-        var ds = this.context.getServices().getDialogService();
-        ds.openConfirm(i18n.getText('RemoveReportDlgTitle'), i18n.getText('RemoveReportContent').replace('{reportName}', report.getName()))
-            .then(function (result) {
-            if (result) {
-                var reportId_1 = report.getId();
-                _this.context.removeQuery({
-                    queryId: reportId_1,
-                    success: function () {
-                        var index = _this.removeFromReportList(reportId_1);
-                        _this.renderReportList({ reportIndex: index });
-                    }
-                });
-            }
-        });
-    };
-    /**
-    * Sends current report's query to back-end.
-    */
-    ReportView.prototype.syncReport = function (options) {
-        var _this = this;
-        if (this.useReportCache) {
-            var query = this.context.getQuery();
-            var currentReport = this.findReportById(query.getId());
-            if (currentReport) {
-                currentReport.lastUpdated = Date.now();
-                this.saveReportContentInCache(currentReport, query.toJSON());
-            }
-        }
-        this.context.syncQuery({
-            success: function (responseData) {
-                if (responseData.query) {
-                    _this.context.refreshWidgets(WidgetGroup.Query);
-                }
-                if (responseData.statement) {
-                    _this.context.refreshWidgets(WidgetGroup.Statement);
-                }
-                if (options && options.success) {
-                    options.success(responseData);
-                }
-            }
-        });
-    };
-    /**
-    * Sets active report.
-    * @param reportId The ID of the report to make active.
-    */
-    ReportView.prototype.setActiveReport = function (reportId) {
-        var rlItems = this.reportListSlot.querySelectorAll('li');
-        for (var i = 0; i < rlItems.length; i++) {
-            var item = rlItems[i];
-            item.classList.remove('active');
-            var rid = item.getAttribute('data-rid');
-            if (rid === reportId) {
-                item.classList.add('active');
-            }
-        }
-        ;
-    };
-    /**
-    * Renders current report.
-    */
-    ReportView.prototype.renderReportProps = function () {
-        var query = this.context.getQuery();
-        var titleElem = document.getElementById('ReportTitle');
-        titleElem.innerHTML = query.getName();
-        var columnsPanel = document.querySelector('.columns-bar');
-        if (columnsPanel) {
-            columnsPanel.innerHTML = '<strong>Columns:</strong>';
-            var columns = query.getColumns();
-            for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {
-                var column = columns_1[_i];
-                columnsPanel.innerHTML += '<span class="label label-default">' + column.caption + '</span> ';
-            }
-        }
-    };
-    /**
-    * Renders the list of reports.
-    * @param options The options. In particular, `options.reportIndex` defines which report should be active.
-    */
-    ReportView.prototype.renderReportList = function (options) {
-        this.renderReportPanels();
-        if (!this.reportListSlot.matches('li')) {
-            this.reportListSlot.innerHTML = "";
-            options = options || { reportId: (this.reports.length > 0 ? this.reports[0].id : null) };
-            var ul = document.createElement('ul');
-            ul.className = 'list-group list-group-flush';
-            this.reportListSlot.appendChild(ul);
-            for (var _i = 0, _a = this.reports; _i < _a.length; _i++) {
-                var report = _a[_i];
-                this.renderReportItemInList(report, ul);
-            }
-            if (options.reportId) {
-                this.loadReport(options.reportId);
-            }
-            if (typeof (options.reportIndex) !== "undefined") {
-                var idx = options.reportIndex;
-                if (idx >= this.reports.length)
-                    idx = this.reports.length - 1;
-                if (idx < 0 && this.reports.length > 0)
-                    idx = 0;
-                if (idx >= 0)
-                    this.loadReport(this.reports[idx].id);
-            }
-        }
-    };
-    ReportView.prototype.detach = function () {
-        var _this = this;
-        if (this.exportButtonsContainer) {
-            this.showExportButtons();
-            this.exportButtons.forEach(function (button) {
-                button.removeEventListener('click', _this.exportButtonClickHandler);
-            });
-            this.exportButtons = [];
-            this.exportButtonsContainer = null;
-        }
-        if (this.clearReportButton) {
-            this.clearReportButton.removeEventListener('click', this.clearReportButtonClickHandler);
-            this.clearReportButton = null;
-        }
-        if (this.newReportButton) {
-            this.newReportButton.removeEventListener('click', this.newReportButtonClickHandler);
-            this.newReportButton = null;
-        }
-        if (this.loadReportButton) {
-            this.loadReportButton.removeEventListener('click', this.loadReportButtonClickHandler);
-            this.loadReportButton = null;
-        }
-        if (this.saveReportButton) {
-            this.saveReportButton.addEventListener('click', this.saveReportButtonClickHandler);
-            this.saveReportButton = null;
-        }
-        if (this.removeReportButton) {
-            this.removeReportButton.removeEventListener('click', this.removeReportButtonClickHandler);
-            this.removeReportButton = null;
-        }
-        if (this.reloadReportDataButton) {
-            this.reloadReportDataButton.removeEventListener('click', this.reloadReportDataButtonClickHandler);
-            this.removeReportButton = null;
-        }
-        if (this.reportListSlot) {
-            this.reportListSlot.innerHTML = '';
-            this.reportListSlot = null;
-        }
-        if (this.resultCountSlot) {
-            this.resultCountSlot.innerHTML = '';
-            this.resultCountSlot = null;
-        }
-        _super.prototype.detach.call(this);
-    };
-    /**
-    * Renders a single item in the list of reports.
-    * @param report The [[Report]] object to render.
-    * @param ul The [[HTMLUListElement]] to add the item to.
-    */
-    ReportView.prototype.renderReportItemInList = function (report, ul) {
-        var _this = this;
-        if (!ul) {
-            ul = this.reportListSlot.querySelector("ul");
-        }
-        var reportName = report.name || report.description || "";
-        var li = document.createElement('li');
-        li.className = "list-group-item";
-        li.style.cursor = 'pointer';
-        li.setAttribute('data-rid', report.id);
-        li.innerText = reportName;
-        if (report.description) {
-            li.title = report.description;
-        }
-        li.addEventListener('click', function (e) {
-            var target = e.target;
-            var rid = target.getAttribute('data-rid');
-            _this.loadReport(rid);
-            _this.setActiveReport(rid);
-        });
-        ul.appendChild(li);
-    };
-    /**
-    * Renders report panels.
-    */
-    ReportView.prototype.renderReportPanels = function () {
-        var reportsContainer = document.getElementById("ReportsContainer");
-        var noReportPanel = document.getElementById("NoReportPanel");
-        if (this.reports.length > 0) {
-            this.hideElement(noReportPanel);
-            this.showElement(reportsContainer);
-        }
-        else {
-            this.hideElement(reportsContainer);
-            this.showElement(noReportPanel);
-        }
-    };
-    //TODO: Move these two functions to @easydata/ui
-    ReportView.prototype.hideElement = function (element) {
-        if (element) {
-            element.style.visibility = 'hidden';
-        }
-    };
-    ReportView.prototype.showElement = function (element) {
-        if (element) {
-            element.style.removeProperty('visibility');
-        }
-    };
-    /**
-    * Inserts the report to the list of reports.
-    * @param report The [[Report]] object to be inserted.
-    */
-    ReportView.prototype.insertIntoReportList = function (report) {
-        this.reports.push(report);
-    };
-    /**
-    * Removes the report from the list of reports.
-    * @param reportId The ID of the report to be removed.
-    * @returns the index of removed report.
-    */
-    ReportView.prototype.removeFromReportList = function (reportId) {
-        var index = this.indexOfReportById(reportId);
-        if (index >= 0)
-            this.reports.splice(index, 1);
-        return index;
-    };
-    ReportView.prototype.indexOfReportById = function (reportId) {
-        for (var i = 0; i < this.reports.length; i++) {
-            if (this.reports[i].id === reportId)
-                return i;
-        }
-        return -1;
-    };
-    /**
-    * The handler of the "Clear" button click.
-    */
-    ReportView.prototype.clearReportButtonClick = function () {
-        this.clearErrors();
-        this.context.clearQuery();
-    };
-    /**
-    * The handler of the "Update" button click.
-    */
-    ReportView.prototype.reloadReportDataButtonClick = function () {
-        this.fetchData();
-    };
-    /**
-    * The handler of the "Save" button click.
-    */
-    ReportView.prototype.saveReportButtonClick = function () {
-        this.saveCurrentReportAs();
-    };
-    /**
-    * The handler of the "Load" button click.
-    */
-    ReportView.prototype.loadReportButtonClick = function () {
-        this.loadReport("LastQuery");
-    };
-    /**
-    * The handler of the "Remove" button click.
-    */
-    ReportView.prototype.removeReportButtonClick = function () {
-        this.removeCurrentReport();
-    };
-    /**
-    * The handler of the "New" button click.
-    */
-    ReportView.prototype.newReportButtonClick = function () {
-        this.newReport();
-    };
-    /**
-    * The handler of errors.
-    * @param error The error object.
-    */
-    ReportView.prototype.errorHandler = function (error) {
-    };
-    /**
-    * Clears the errors.
-    */
-    ReportView.prototype.clearErrors = function () {
-    };
-    /**
-    * Disables export buttons.
-    */
-    ReportView.prototype.disableExportButtons = function () {
-        this.hideExportButtons();
-    };
-    /**
-    * Enables export buttons.
-    */
-    ReportView.prototype.enableExportButtons = function () {
-        this.showExportButtons();
-    };
-    /**
-    * Hides export buttons.
-    */
-    ReportView.prototype.hideExportButtons = function () {
-        if (this.exportButtonsContainer) {
-            this.exportButtonsContainer.style.display = "none";
-        }
-    };
-    /**
-    * Shows export buttons.
-    */
-    ReportView.prototype.showExportButtons = function () {
-        if (this.exportButtonsContainer) {
-            this.exportButtonsContainer.style.display = "initial";
-        }
-    };
-    /**
-     * Saves reports content to the cache.
-     * @param report  The report.
-     * @param content The content (Query serialized into JSON).
-     */
-    ReportView.prototype.saveReportContentInCache = function (report, content) {
-        var item = this.findReportCacheItem(report.id);
-        if (!item) {
-            item = { id: report.id };
-            this.reportCache.push(item);
-        }
-        item.lastUpdated = report.lastUpdated;
-        item.content = content;
-    };
-    /**
-     * Gets the report content from cache.
-     * @param report The report.
-     * @returns Content of the report (Query in JSOn string)
-     */
-    ReportView.prototype.getReportContentFromCache = function (report) {
-        var item = this.findReportCacheItem(report.id);
-        if (item && item.lastUpdated === report.lastUpdated) {
-            return item.content;
-        }
-        return null;
-    };
-    ReportView.prototype.findReportById = function (id) {
-        for (var _i = 0, _a = this.reports; _i < _a.length; _i++) {
-            var item = _a[_i];
-            if (item.id === id) {
-                return item;
-            }
-        }
-        return null;
-    };
-    ReportView.prototype.findReportCacheItem = function (id) {
-        for (var _i = 0, _a = this.reportCache; _i < _a.length; _i++) {
-            var item = _a[_i];
-            if (item.id === id) {
-                return item;
-            }
-        }
-        return null;
-    };
-    return ReportView;
-}(View));
-export { ReportView };
+var __extends = (this && this.__extends) || (function () {
+    var extendStatics = function (d, b) {
+        extendStatics = Object.setPrototypeOf ||
+            ({ __proto__: [] } instanceof Array && function (d, b) { d.__proto__ = b; }) ||
+            function (d, b) { for (var p in b) if (Object.prototype.hasOwnProperty.call(b, p)) d[p] = b[p]; };
+        return extendStatics(d, b);
+    };
+    return function (d, b) {
+        if (typeof b !== "function" && b !== null)
+            throw new TypeError("Class extends value " + String(b) + " is not a constructor or null");
+        extendStatics(d, b);
+        function __() { this.constructor = d; }
+        d.prototype = b === null ? Object.create(b) : (__.prototype = b.prototype, new __());
+    };
+})();
+import { WidgetGroup, QueryChangePart } from '@easyquery/core';
+import { i18n, utils as dataUtils } from '@easydata/core';
+import { domel } from '@easydata/ui';
+import { browserUtils } from '../utils/browser_utils';
+import { View } from './view';
+/**
+ * The view that represents the "ad-hoc reporting" scenario
+ */
+var ReportView = /** @class */ (function (_super) {
+    __extends(ReportView, _super);
+    function ReportView() {
+        var _this = _super.call(this) || this;
+        _this.reports = [];
+        _this.reportCache = [];
+        _this.exportButtons = [];
+        _this.exportClass = "eqjs-export";
+        _this.disabledClass = "eqjs-disabled";
+        _this.enableExport = false;
+        _this.useReportCache = true;
+        _this.syncReportOnChange = true;
+        _this._reportSaveTemplate = "<div id=\"kdlg-dialog-form\" class=\"kfrm-form\">\n            <div class=\"kfrm-fields label-above\">\n                <label for=\"kdlg-dialog-form-input\" id=\"kdlg-dialog-form-content\"></label>\n                <input type=\"text\" name=\"kdlg-dialog-form-input\" id=\"kdlg-dialog-form-input\" />\n                <label for=\"kdlg-dialog-form-textarea\" id=\"kdlg-dialog-form-desc-label\"></label>\n                <textarea type=\"text\" name=\"kdlg-dialog-form-textarea\" id=\"kdlg-dialog-form-textarea\"></textarea>\n            </div>\n        </div>";
+        _this.context.useStoredQueryOnFetch = true;
+        _this.exportButtonClickHandler = function (srcElement, e) {
+            if (!srcElement.classList.contains(_this.disabledClass)) {
+                var format = srcElement.getAttribute("data-format");
+                _this.context.exportResult({ format: format });
+            }
+        };
+        _this.clearReportButtonClickHandler = _this.clearReportButtonClick.bind(_this);
+        _this.newReportButtonClickHandler = _this.newReportButtonClick.bind(_this);
+        _this.loadReportButtonClickHandler = _this.loadReportButtonClick.bind(_this);
+        _this.saveReportButtonClickHandler = _this.saveReportButtonClick.bind(_this);
+        _this.removeReportButtonClickHandler = _this.removeReportButtonClick.bind(_this);
+        _this.reloadReportDataButtonClickHandler = _this.reloadReportDataButtonClick.bind(_this);
+        browserUtils.onMobileModeChanged(function (_) {
+            document.location.reload();
+        });
+        return _this;
+    }
+    ReportView.prototype.initOptions = function (options) {
+        options = _super.prototype.initOptions.call(this, options);
+        if (typeof (options.syncQueryOnChange) !== "undefined") {
+            this.syncReportOnChange = options.syncQueryOnChange;
+        }
+        if (typeof (options.syncReportOnChange) !== "undefined") {
+            this.syncReportOnChange = options.syncReportOnChange;
+        }
+        options.syncQueryOnChange = this.syncReportOnChange;
+        if (typeof (options.useReportCache) !== "undefined") {
+            this.useReportCache = options.useReportCache;
+        }
+        this.defaultReportId = options.defaultReportId;
+        return options;
+    };
+    ReportView.prototype.initDone = function () {
+        var _this = this;
+        _super.prototype.initDone.call(this);
+        var query = this.context.getQuery();
+        query.addChangedCallback(function (event) {
+            var eventData = event.data;
+            if (eventData) {
+                if (eventData.changeType == "query.switched") {
+                    _this.context.clearResult();
+                    _this.context.refreshWidgets(WidgetGroup.Result);
+                    _this.context.refreshWidgets(WidgetGroup.Query);
+                }
+                else {
+                    _this.disableExportButtons();
+                    if (_this.resultCountSlot) {
+                        _this.resultCountSlot.style.display = "none";
+                    }
+                }
+            }
+            //true if we just switched the report or changed facets (query was not changed)
+            var isLiteUpdate = !eventData
+                || eventData.changeType == "query.switched"
+                || eventData.part == QueryChangePart.ExtraData
+                || eventData.part == QueryChangePart.Facets;
+            var syncStarted = false;
+            if (_this.syncReportOnChange) {
+                var needSync = eventData && eventData.changeType != "query.switched" && !eventData.noSync;
+                if (needSync) {
+                    syncStarted = true;
+                    _this.syncReport({
+                        success: function () {
+                            // fetch data on query change
+                            if (!isLiteUpdate && _this.viewOptions.fetchDataOnChange) {
+                                _this.fetchData();
+                            }
+                        }
+                    });
+                }
+            }
+            // clear dataset result on query change
+            if (!isLiteUpdate && _this.resultOptions.clearResultOnQueryChange) {
+                _this.context.clearResult();
+                _this.context.refreshWidgets(WidgetGroup.Result);
+            }
+            if (!isLiteUpdate && !syncStarted && _this.viewOptions.fetchDataOnChange) {
+                _this.fetchData();
+            }
+        });
+        window.setTimeout(function () {
+            _this.context.loadQueryList({
+                success: function (data) {
+                    if (Array.isArray(data)) {
+                        _this.reports = data;
+                        var exists = _this.reports.filter(function (r) { return r.id == _this.defaultReportId; }).length > 0;
+                        if (exists) {
+                            _this.renderReportList({ reportId: _this.defaultReportId });
+                        }
+                        else {
+                            _this.renderReportList();
+                        }
+                    }
+                }
+            });
+        }, 100);
+    };
+    ReportView.prototype.initWidgets = function (options) {
+        var _this = this;
+        _super.prototype.initWidgets.call(this, options);
+        var clearReportButton = "ClearReportButton";
+        var newReportButton = "NewReportButton";
+        var loadReportButton = "LoadReportButton";
+        var saveReportButton = "SaveReportButton";
+        var removeReportButton = "RemoveReportButton";
+        var reloadReportDataButton = "ReloadReportDataButton";
+        var resultCountSpan = "ResultCount";
+        var exportButtons = "ResultExportButtons";
+        var exportClass = this.exportClass;
+        if (options.slots) {
+            resultCountSpan = options.slots.resultCountSpan || resultCountSpan;
+            exportButtons = options.slots.exportButtons || exportButtons;
+            clearReportButton = options.slots.clearReportButton || clearReportButton;
+            newReportButton = options.slots.newReportButton || newReportButton;
+            loadReportButton = options.slots.loadReportButton || loadReportButton;
+            saveReportButton = options.slots.saveReportButton || saveReportButton;
+            removeReportButton = options.slots.removeReportButton || removeReportButton;
+            reloadReportDataButton = options.slots.reloadReportDataButton || reloadReportDataButton;
+            exportClass = options.slots.exportClass || exportClass;
+        }
+        this.exportButtons = this.domRoots.reduce(function (elems, root) {
+            return elems.concat(Array.from(root.querySelectorAll(".".concat(exportClass))));
+        }, []);
+        this.enableExport = options.enableExport;
+        if (this.enableExport) {
+            //Add event listener for export buttons
+            this.exportButtons.forEach(function (button) {
+                button.addEventListener('click', _this.exportButtonClickHandler);
+            });
+        }
+        else {
+            this.hideExportButtons();
+        }
+        this.exportButtonsContainer = this.resolveElement(exportButtons);
+        if (!this.clearReportButton) {
+            this.clearReportButton = this.resolveElement(clearReportButton);
+            if (this.clearReportButton) {
+                this.clearReportButton.addEventListener('click', this.clearReportButtonClickHandler);
+            }
+        }
+        if (!this.newReportButton) {
+            this.newReportButton = this.resolveElement(newReportButton);
+            if (this.newReportButton) {
+                this.newReportButton.addEventListener('click', this.newReportButtonClickHandler);
+            }
+        }
+        if (!this.loadReportButton) {
+            this.loadReportButton = this.resolveElement(loadReportButton);
+            if (this.loadReportButton) {
+                this.loadReportButton.addEventListener('click', this.loadReportButtonClickHandler);
+            }
+        }
+        if (!this.saveReportButton) {
+            this.saveReportButton = this.resolveElement(saveReportButton);
+            if (this.saveReportButton) {
+                this.saveReportButton.addEventListener('click', this.saveReportButtonClickHandler);
+            }
+        }
+        if (!this.removeReportButton) {
+            this.removeReportButton = this.resolveElement(removeReportButton);
+            if (this.removeReportButton) {
+                this.removeReportButton.addEventListener('click', this.removeReportButtonClickHandler);
+            }
+        }
+        if (!this.reloadReportDataButton) {
+            this.reloadReportDataButton = this.resolveElement(reloadReportDataButton);
+            //OBSOLETE: remove the next 3 lines. We just support the old default button ID here
+            if (!this.reloadReportDataButton) {
+                this.reloadReportDataButton = this.resolveElement('UpdateReportButton');
+            }
+            if (this.reloadReportDataButton) {
+                this.reloadReportDataButton.addEventListener('click', this.reloadReportDataButtonClickHandler);
+            }
+        }
+        this.reportListSlot = document.getElementById('ReportList');
+        this.resultCountSlot = this.resolveElement(resultCountSpan);
+    };
+    /**
+    * Creates a new report.
+    */
+    ReportView.prototype.newReport = function () {
+        var _this = this;
+        var ds = this.context.getServices().getDialogService();
+        var dlg = ds.open({
+            title: i18n.getText('NewReportDlgTitle'),
+            body: this._reportSaveTemplate,
+            submitable: true,
+            closable: true,
+            cancelable: true,
+            submitOnEnter: true,
+            arrangeParents: false,
+            beforeOpen: function () {
+                var input = document.getElementById("kdlg-dialog-form-input");
+                input.value = i18n.getText('NewReportDefName');
+                var content = document.getElementById('kdlg-dialog-form-content');
+                content.innerHTML = i18n.getText('SaveReportDlgLabel');
+                var label = document.getElementById('kdlg-dialog-form-desc-label');
+                label.innerHTML = i18n.getText('ReportDescLabel');
+                input.focus();
+            },
+            onSubmit: function () {
+                var nameInput = document.getElementById("kdlg-dialog-form-input");
+                var queryName = nameInput.value;
+                if (queryName && queryName.replace(/\s/g, '').length > 0) {
+                    dlg.clearAlert();
+                    dlg.disableButtons();
+                    var header_1 = dlg.getRootElement().querySelector('header');
+                    var processEl_1 = domel('div', header_1)
+                        .addClass('eqjs-process-bar local')
+                        .toDOM();
+                    var descInput = document.getElementById("kdlg-dialog-form-textarea");
+                    var queryDesc = descInput.value;
+                    _this.context.newQuery({
+                        name: queryName,
+                        description: queryDesc,
+                        success: function () {
+                            dlg.close();
+                            var query = _this.context.getQuery();
+                            var reportId = query.getId();
+                            _this.insertIntoReportList({ id: reportId, name: query.getName(), description: query.getDescription() });
+                            _this.renderReportList({ reportId: reportId });
+                        },
+                        error: function (error) {
+                            header_1.removeChild(processEl_1);
+                            dlg.enableButtons();
+                            dlg.showAlert(error, 'error');
+                        }
+                    });
+                }
+                return false;
+            }
+        });
+    };
+    /**
+    * Loads report by ID.
+    * @param reportId The ID of the report to load.
+    */
+    ReportView.prototype.loadReport = function (reportId) {
+        var _this = this;
+        if (!reportId) {
+            throw 'Empty report ID!';
+        }
+        var reportToLoad = this.findReportById(reportId);
+        if (!reportToLoad)
+            return;
+        var self = this;
+        var query = self.context.getQuery();
+        var reportLoaded = function () {
+            _this.renderReportProps();
+            _this.context.resultTable.clear();
+            query.fireChangedEvent({
+                part: QueryChangePart.All,
+                noSync: true,
+                changeType: 'query.switched'
+            });
+            _this.fetchData();
+        };
+        var reportContent = this.useReportCache ? this.getReportContentFromCache(reportToLoad) : null;
+        if (reportContent) {
+            query.clear();
+            query.loadFromJson(reportContent, { validate: false });
+            reportLoaded();
+        }
+        else {
+            this.context.loadQuery({
+                queryId: reportId,
+                silent: true,
+                success: function () {
+                    _this.saveReportContentInCache(reportToLoad, query.toJSON());
+                    reportLoaded();
+                }
+            });
+        }
+        this.setActiveReport(reportId);
+    };
+    /**
+    * Shows the dialog to save the report with new name.
+    */
+    ReportView.prototype.saveCurrentReportAs = function () {
+        var _this = this;
+        var query = this.context.getQuery();
+        var ds = this.context.getServices().getDialogService();
+        var dlg = ds.open({
+            title: i18n.getText('SaveReportDlgTitle'),
+            body: this._reportSaveTemplate,
+            submitable: true,
+            closable: true,
+            cancelable: true,
+            submitOnEnter: true,
+            arrangeParents: false,
+            beforeOpen: function () {
+                var input = document.getElementById("kdlg-dialog-form-input");
+                input.value = query.getName();
+                var content = document.getElementById('kdlg-dialog-form-content');
+                content.innerHTML = i18n.getText('SaveReportDlgLabel');
+                var label = document.getElementById('kdlg-dialog-form-desc-label');
+                label.innerHTML = i18n.getText('ReportDescLabel');
+                var text = document.getElementById("kdlg-dialog-form-textarea");
+                text.value = query.getDescription();
+                input.focus();
+            },
+            onSubmit: function () {
+                var input = document.getElementById("kdlg-dialog-form-input");
+                var value = input.value;
+                if (value && value.replace(/\s/g, '').length > 0) {
+                    query.setId(dataUtils.generateId(value.replace(/\s/g, '')));
+                    dlg.clearAlert();
+                    dlg.disableButtons();
+                    var header_2 = dlg.getRootElement().querySelector('header');
+                    var processEl_2 = domel('div', header_2)
+                        .addClass('eqjs-process-bar local')
+                        .toDOM();
+                    var text = document.getElementById("kdlg-dialog-form-textarea");
+                    var desc = text.value;
+                    query.setDescription(desc);
+                    _this.context.newQuery({
+                        clearQuery: false,
+                        name: value,
+                        success: function () {
+                            dlg.close();
+                            _this.context.refreshWidgets(WidgetGroup.Query);
+                            var savedQuery = _this.context.getQuery();
+                            var reportId = savedQuery.getId();
+                            _this.fetchData();
+                            _this.insertIntoReportList({ id: reportId, name: query.getName(), description: query.getDescription() });
+                            _this.renderReportList({ reportId: reportId });
+                            _this.setActiveReport(reportId);
+                            _this.renderReportProps();
+                        },
+                        error: function (error) {
+                            header_2.removeChild(processEl_2);
+                            dlg.enableButtons();
+                            dlg.showAlert(error, 'error');
+                        }
+                    });
+                }
+                return false;
+            }
+        });
+    };
+    /**
+    * Removes current report.
+    */
+    ReportView.prototype.removeCurrentReport = function () {
+        var _this = this;
+        var report = this.context.getQuery();
+        var ds = this.context.getServices().getDialogService();
+        ds.openConfirm(i18n.getText('RemoveReportDlgTitle'), i18n.getText('RemoveReportContent').replace('{reportName}', report.getName()))
+            .then(function (result) {
+            if (result) {
+                var reportId_1 = report.getId();
+                _this.context.removeQuery({
+                    queryId: reportId_1,
+                    success: function () {
+                        var index = _this.removeFromReportList(reportId_1);
+                        _this.renderReportList({ reportIndex: index });
+                    }
+                });
+            }
+        });
+    };
+    /**
+    * Sends current report's query to back-end.
+    */
+    ReportView.prototype.syncReport = function (options) {
+        var _this = this;
+        if (this.useReportCache) {
+            var query = this.context.getQuery();
+            var currentReport = this.findReportById(query.getId());
+            if (currentReport) {
+                currentReport.lastUpdated = Date.now();
+                this.saveReportContentInCache(currentReport, query.toJSON());
+            }
+        }
+        this.context.syncQuery({
+            success: function (responseData) {
+                if (responseData.query) {
+                    _this.context.refreshWidgets(WidgetGroup.Query);
+                }
+                if (responseData.statement) {
+                    _this.context.refreshWidgets(WidgetGroup.Statement);
+                }
+                if (options && options.success) {
+                    options.success(responseData);
+                }
+            }
+        });
+    };
+    /**
+    * Sets active report.
+    * @param reportId The ID of the report to make active.
+    */
+    ReportView.prototype.setActiveReport = function (reportId) {
+        var rlItems = this.reportListSlot.querySelectorAll('li');
+        for (var i = 0; i < rlItems.length; i++) {
+            var item = rlItems[i];
+            item.classList.remove('active');
+            var rid = item.getAttribute('data-rid');
+            if (rid === reportId) {
+                item.classList.add('active');
+            }
+        }
+        ;
+    };
+    /**
+    * Renders current report.
+    */
+    ReportView.prototype.renderReportProps = function () {
+        var query = this.context.getQuery();
+        var titleElem = document.getElementById('ReportTitle');
+        titleElem.innerHTML = query.getName();
+        var columnsPanel = document.querySelector('.columns-bar');
+        if (columnsPanel) {
+            columnsPanel.innerHTML = '<strong>Columns:</strong>';
+            var columns = query.getColumns();
+            for (var _i = 0, columns_1 = columns; _i < columns_1.length; _i++) {
+                var column = columns_1[_i];
+                columnsPanel.innerHTML += '<span class="label label-default">' + column.caption + '</span> ';
+            }
+        }
+    };
+    /**
+    * Renders the list of reports.
+    * @param options The options. In particular, `options.reportIndex` defines which report should be active.
+    */
+    ReportView.prototype.renderReportList = function (options) {
+        this.renderReportPanels();
+        if (!this.reportListSlot.matches('li')) {
+            this.reportListSlot.innerHTML = "";
+            options = options || { reportId: (this.reports.length > 0 ? this.reports[0].id : null) };
+            var ul = document.createElement('ul');
+            ul.className = 'list-group list-group-flush';
+            this.reportListSlot.appendChild(ul);
+            for (var _i = 0, _a = this.reports; _i < _a.length; _i++) {
+                var report = _a[_i];
+                this.renderReportItemInList(report, ul);
+            }
+            if (options.reportId) {
+                this.loadReport(options.reportId);
+            }
+            if (typeof (options.reportIndex) !== "undefined") {
+                var idx = options.reportIndex;
+                if (idx >= this.reports.length)
+                    idx = this.reports.length - 1;
+                if (idx < 0 && this.reports.length > 0)
+                    idx = 0;
+                if (idx >= 0)
+                    this.loadReport(this.reports[idx].id);
+            }
+        }
+    };
+    ReportView.prototype.detach = function () {
+        var _this = this;
+        if (this.exportButtonsContainer) {
+            this.showExportButtons();
+            this.exportButtons.forEach(function (button) {
+                button.removeEventListener('click', _this.exportButtonClickHandler);
+            });
+            this.exportButtons = [];
+            this.exportButtonsContainer = null;
+        }
+        if (this.clearReportButton) {
+            this.clearReportButton.removeEventListener('click', this.clearReportButtonClickHandler);
+            this.clearReportButton = null;
+        }
+        if (this.newReportButton) {
+            this.newReportButton.removeEventListener('click', this.newReportButtonClickHandler);
+            this.newReportButton = null;
+        }
+        if (this.loadReportButton) {
+            this.loadReportButton.removeEventListener('click', this.loadReportButtonClickHandler);
+            this.loadReportButton = null;
+        }
+        if (this.saveReportButton) {
+            this.saveReportButton.addEventListener('click', this.saveReportButtonClickHandler);
+            this.saveReportButton = null;
+        }
+        if (this.removeReportButton) {
+            this.removeReportButton.removeEventListener('click', this.removeReportButtonClickHandler);
+            this.removeReportButton = null;
+        }
+        if (this.reloadReportDataButton) {
+            this.reloadReportDataButton.removeEventListener('click', this.reloadReportDataButtonClickHandler);
+            this.removeReportButton = null;
+        }
+        if (this.reportListSlot) {
+            this.reportListSlot.innerHTML = '';
+            this.reportListSlot = null;
+        }
+        if (this.resultCountSlot) {
+            this.resultCountSlot.innerHTML = '';
+            this.resultCountSlot = null;
+        }
+        _super.prototype.detach.call(this);
+    };
+    /**
+    * Renders a single item in the list of reports.
+    * @param report The [[Report]] object to render.
+    * @param ul The [[HTMLUListElement]] to add the item to.
+    */
+    ReportView.prototype.renderReportItemInList = function (report, ul) {
+        var _this = this;
+        if (!ul) {
+            ul = this.reportListSlot.querySelector("ul");
+        }
+        var reportName = report.name || report.description || "";
+        var li = document.createElement('li');
+        li.className = "list-group-item";
+        li.style.cursor = 'pointer';
+        li.setAttribute('data-rid', report.id);
+        li.innerText = reportName;
+        if (report.description) {
+            li.title = report.description;
+        }
+        li.addEventListener('click', function (e) {
+            var target = e.target;
+            var rid = target.getAttribute('data-rid');
+            _this.loadReport(rid);
+            _this.setActiveReport(rid);
+        });
+        ul.appendChild(li);
+    };
+    /**
+    * Renders report panels.
+    */
+    ReportView.prototype.renderReportPanels = function () {
+        var reportsContainer = document.getElementById("ReportsContainer");
+        var noReportPanel = document.getElementById("NoReportPanel");
+        if (this.reports.length > 0) {
+            this.hideElement(noReportPanel);
+            this.showElement(reportsContainer);
+        }
+        else {
+            this.hideElement(reportsContainer);
+            this.showElement(noReportPanel);
+        }
+    };
+    //TODO: Move these two functions to @easydata/ui
+    ReportView.prototype.hideElement = function (element) {
+        if (element) {
+            element.style.visibility = 'hidden';
+        }
+    };
+    ReportView.prototype.showElement = function (element) {
+        if (element) {
+            element.style.removeProperty('visibility');
+        }
+    };
+    /**
+    * Inserts the report to the list of reports.
+    * @param report The [[Report]] object to be inserted.
+    */
+    ReportView.prototype.insertIntoReportList = function (report) {
+        this.reports.push(report);
+    };
+    /**
+    * Removes the report from the list of reports.
+    * @param reportId The ID of the report to be removed.
+    * @returns the index of removed report.
+    */
+    ReportView.prototype.removeFromReportList = function (reportId) {
+        var index = this.indexOfReportById(reportId);
+        if (index >= 0)
+            this.reports.splice(index, 1);
+        return index;
+    };
+    ReportView.prototype.indexOfReportById = function (reportId) {
+        for (var i = 0; i < this.reports.length; i++) {
+            if (this.reports[i].id === reportId)
+                return i;
+        }
+        return -1;
+    };
+    /**
+    * The handler of the "Clear" button click.
+    */
+    ReportView.prototype.clearReportButtonClick = function () {
+        this.clearErrors();
+        this.context.clearQuery();
+    };
+    /**
+    * The handler of the "Update" button click.
+    */
+    ReportView.prototype.reloadReportDataButtonClick = function () {
+        this.fetchData();
+    };
+    /**
+    * The handler of the "Save" button click.
+    */
+    ReportView.prototype.saveReportButtonClick = function () {
+        this.saveCurrentReportAs();
+    };
+    /**
+    * The handler of the "Load" button click.
+    */
+    ReportView.prototype.loadReportButtonClick = function () {
+        this.loadReport("LastQuery");
+    };
+    /**
+    * The handler of the "Remove" button click.
+    */
+    ReportView.prototype.removeReportButtonClick = function () {
+        this.removeCurrentReport();
+    };
+    /**
+    * The handler of the "New" button click.
+    */
+    ReportView.prototype.newReportButtonClick = function () {
+        this.newReport();
+    };
+    /**
+    * The handler of errors.
+    * @param error The error object.
+    */
+    ReportView.prototype.errorHandler = function (error) {
+    };
+    /**
+    * Clears the errors.
+    */
+    ReportView.prototype.clearErrors = function () {
+    };
+    /**
+    * Disables export buttons.
+    */
+    ReportView.prototype.disableExportButtons = function () {
+        this.hideExportButtons();
+    };
+    /**
+    * Enables export buttons.
+    */
+    ReportView.prototype.enableExportButtons = function () {
+        this.showExportButtons();
+    };
+    /**
+    * Hides export buttons.
+    */
+    ReportView.prototype.hideExportButtons = function () {
+        if (this.exportButtonsContainer) {
+            this.exportButtonsContainer.style.display = "none";
+        }
+    };
+    /**
+    * Shows export buttons.
+    */
+    ReportView.prototype.showExportButtons = function () {
+        if (this.exportButtonsContainer) {
+            this.exportButtonsContainer.style.display = "initial";
+        }
+    };
+    /**
+     * Saves reports content to the cache.
+     * @param report  The report.
+     * @param content The content (Query serialized into JSON).
+     */
+    ReportView.prototype.saveReportContentInCache = function (report, content) {
+        var item = this.findReportCacheItem(report.id);
+        if (!item) {
+            item = { id: report.id };
+            this.reportCache.push(item);
+        }
+        item.lastUpdated = report.lastUpdated;
+        item.content = content;
+    };
+    /**
+     * Gets the report content from cache.
+     * @param report The report.
+     * @returns Content of the report (Query in JSOn string)
+     */
+    ReportView.prototype.getReportContentFromCache = function (report) {
+        var item = this.findReportCacheItem(report.id);
+        if (item && item.lastUpdated === report.lastUpdated) {
+            return item.content;
+        }
+        return null;
+    };
+    ReportView.prototype.findReportById = function (id) {
+        for (var _i = 0, _a = this.reports; _i < _a.length; _i++) {
+            var item = _a[_i];
+            if (item.id === id) {
+                return item;
+            }
+        }
+        return null;
+    };
+    ReportView.prototype.findReportCacheItem = function (id) {
+        for (var _i = 0, _a = this.reportCache; _i < _a.length; _i++) {
+            var item = _a[_i];
+            if (item.id === id) {
+                return item;
+            }
+        }
+        return null;
+    };
+    return ReportView;
+}(View));
+export { ReportView };
 //# sourceMappingURL=report_view.js.map