@syncfusion/ej2-pivotview 19.3.48 → 19.4.38

package/src/common/popups/toolbar.js

@@ -226,12 +226,22 @@ var Toolbar = /** @class */ (function () {
     };
     /* eslint-enable */
     Toolbar.prototype.reportChange = function (args) {
-        this.dropArgs = args;
-        if (this.parent.isModified && this.currentReport !== '') {
-            this.createConfirmDialog(this.parent.localeObj.getConstant('alert'), this.parent.localeObj.getConstant('newReportConfirm'));
+        this.parent.actionObj.actionName = events.reportChange;
+        if (this.parent.actionBeginMethod()) {
+            args.cancel = true;
+            return;
         }
-        else {
-            this.reportLoad(args);
+        try {
+            this.dropArgs = args;
+            if (this.parent.isModified && this.currentReport !== '') {
+                this.createConfirmDialog(this.parent.localeObj.getConstant('alert'), this.parent.localeObj.getConstant('newReportConfirm'));
+            }
+            else {
+                this.reportLoad(args);
+            }
+        }
+        catch (execption) {
+            this.parent.actionFailureMethod(execption);
         }
     };
     Toolbar.prototype.reportLoad = function (args) {
@@ -240,6 +250,10 @@ var Toolbar = /** @class */ (function () {
             var loadArgs = {
                 reportName: args.itemData.value
             };
+            var actionInfo = {
+                reportName: args.itemData.value
+            };
+            this.parent.actionObj.actionInfo = actionInfo;
             this.parent.trigger(events.loadReport, loadArgs, function (observedArgs) {
                 _this_1.currentReport = observedArgs.reportName;
                 _this_1.parent.isModified = false;
@@ -252,7 +266,15 @@ var Toolbar = /** @class */ (function () {
                 report: this.parent.getPersistData(),
                 reportName: this.currentReport
             };
+            this.parent.actionObj.actionName = this.parent.getActionCompleteName();
+            var actionInfo = {
+                reportName: this.currentReport
+            };
+            this.parent.actionObj.actionInfo = actionInfo;
             this.parent.trigger(events.saveReport, saveArgs);
+            if (this.parent.actionObj.actionName) {
+                this.parent.actionCompleteMethod();
+            }
             this.parent.isModified = false;
         }
         else if (this.currentReport === '' && (args.item.id === (this.parent.element.id + 'save') || args.item.id === (this.parent.element.id + 'saveas'))) {
@@ -316,54 +338,67 @@ var Toolbar = /** @class */ (function () {
         }
     };
     Toolbar.prototype.actionClick = function (args) {
-        switch (args.item.id) {
-            case (this.parent.element.id + 'save'):
-            case (this.parent.element.id + 'saveas'):
-                this.saveReport(args);
-                break;
-            case (this.parent.element.id + 'remove'):
-                this.action = 'Remove';
-                if (this.currentReport && this.currentReport !== '') {
-                    this.createConfirmDialog(this.parent.localeObj.getConstant('alert'), this.parent.localeObj.getConstant('removeConfirm'));
-                }
-                else {
-                    this.parent.pivotCommon.errorDialog.createErrorDialog(this.parent.localeObj.getConstant('error'), this.parent.localeObj.getConstant('emptyReport'));
-                }
-                return;
-            case (this.parent.element.id + 'rename'):
-                this.renameReport(args);
-                break;
-            case (this.parent.element.id + 'new'):
-                this.action = 'New';
-                this.newArgs = args;
-                if (this.parent.isModified && this.currentReport && this.currentReport !== '') {
-                    this.createConfirmDialog(this.parent.localeObj.getConstant('alert'), this.parent.localeObj.getConstant('newReportConfirm'));
-                }
-                else {
-                    this.createNewReport(args);
-                }
-                break;
-            case (this.parent.element.id + 'load'):
-                this.action = 'Load';
-                break;
-            case (this.parent.element.id + 'fieldlist'):
-                if (this.parent.pivotFieldListModule && this.parent.pivotFieldListModule.dialogRenderer) {
-                    this.parent.pivotFieldListModule.dialogRenderer.fieldListDialog.show();
-                }
-                break;
-            case (this.parent.element.id + 'formatting'):
-                if (this.parent.conditionalFormattingModule) {
-                    this.parent.conditionalFormattingModule.showConditionalFormattingDialog();
-                }
-                break;
-            case (this.parent.element.id + 'mdxQuery'):
-                this.mdxQueryDialog(args);
-                break;
-            case (this.parent.element.id + 'numberFormatting'):
-                if (this.parent.numberFormattingModule) {
-                    this.parent.numberFormattingModule.showNumberFormattingDialog();
-                }
-                break;
+        var actionName = (args.item.id == "PivotViewnew") ? events.addNewReport : (args.item.id == "PivotViewsave") ? events.saveCurrentReport : (args.item.id == "PivotViewsaveas") ? events.saveAsCurrentReport
+            : (args.item.id == "PivotViewrename") ? events.renameCurrentReport : (args.item.id == "PivotViewremove") ? events.removeCurrentReport : (args.item.id == "PivotViewload") ? events.loadReports
+                : (args.item.id == "PivotViewformatting") ? events.openConditionalFormatting : (args.item.id == "PivotViewnumberFormatting") ? events.openNumberFormatting
+                    : (args.item.id == "PivotViewmdxQuery") ? events.MdxQuery : (args.item.id == "PivotViewfieldlist") ? events.showFieldList : '';
+        this.parent.actionObj.actionName = actionName;
+        if (this.parent.actionBeginMethod()) {
+            return;
+        }
+        try {
+            switch (args.item.id) {
+                case (this.parent.element.id + 'save'):
+                case (this.parent.element.id + 'saveas'):
+                    this.saveReport(args);
+                    break;
+                case (this.parent.element.id + 'remove'):
+                    this.action = 'Remove';
+                    if (this.currentReport && this.currentReport !== '') {
+                        this.createConfirmDialog(this.parent.localeObj.getConstant('alert'), this.parent.localeObj.getConstant('removeConfirm'));
+                    }
+                    else {
+                        this.parent.pivotCommon.errorDialog.createErrorDialog(this.parent.localeObj.getConstant('error'), this.parent.localeObj.getConstant('emptyReport'));
+                    }
+                    return;
+                case (this.parent.element.id + 'rename'):
+                    this.renameReport(args);
+                    break;
+                case (this.parent.element.id + 'new'):
+                    this.action = 'New';
+                    this.newArgs = args;
+                    if (this.parent.isModified && this.currentReport && this.currentReport !== '') {
+                        this.createConfirmDialog(this.parent.localeObj.getConstant('alert'), this.parent.localeObj.getConstant('newReportConfirm'));
+                    }
+                    else {
+                        this.createNewReport(args);
+                    }
+                    break;
+                case (this.parent.element.id + 'load'):
+                    this.action = 'Load';
+                    break;
+                case (this.parent.element.id + 'fieldlist'):
+                    if (this.parent.pivotFieldListModule && this.parent.pivotFieldListModule.dialogRenderer) {
+                        this.parent.pivotFieldListModule.dialogRenderer.fieldListDialog.show();
+                    }
+                    break;
+                case (this.parent.element.id + 'formatting'):
+                    if (this.parent.conditionalFormattingModule) {
+                        this.parent.conditionalFormattingModule.showConditionalFormattingDialog();
+                    }
+                    break;
+                case (this.parent.element.id + 'mdxQuery'):
+                    this.mdxQueryDialog(args);
+                    break;
+                case (this.parent.element.id + 'numberFormatting'):
+                    if (this.parent.numberFormattingModule) {
+                        this.parent.numberFormattingModule.showNumberFormattingDialog();
+                    }
+                    break;
+            }
+        }
+        catch (execption) {
+            this.parent.actionFailureMethod(execption);
         }
     };
     Toolbar.prototype.renderDialog = function () {
@@ -455,6 +490,7 @@ var Toolbar = /** @class */ (function () {
         return;
     };
     Toolbar.prototype.okBtnClick = function () {
+        var _this_1 = this;
         var reportInput = this.dialog.element.querySelector('.' + cls.GRID_REPORT_INPUT);
         if (reportInput && reportInput.value === '') {
             reportInput.focus();
@@ -486,6 +522,10 @@ var Toolbar = /** @class */ (function () {
                     report: _this_2.parent.getPersistData(),
                     reportName: reportInput.value
                 };
+                var actionInfo = {
+                    reportName: reportInput.value
+                };
+                _this_1.parent.actionObj.actionInfo = actionInfo;
                 _this_2.parent.trigger(events.saveReport, saveArgs);
                 _this_2.parent.isModified = false;
                 _this_2.updateReportList();
@@ -518,6 +558,10 @@ var Toolbar = /** @class */ (function () {
                     report: _this_3.parent.getPersistData(),
                     reportName: reportInput.value
                 };
+                var actionInfo = {
+                    reportName: reportInput.value
+                };
+                _this_1.parent.actionObj.actionInfo = actionInfo;
                 _this_3.parent.trigger(events.saveReport, saveArgs);
                 _this_3.parent.isModified = false;
                 _this_3.updateReportList();
@@ -552,12 +596,20 @@ var Toolbar = /** @class */ (function () {
                     reportName: _this_4.currentReport,
                     rename: reportInput.value
                 };
+                var actionInfo = {
+                    reportName: { oldName: _this_4.currentReport, newName: reportInput.value }
+                };
+                _this_1.parent.actionObj.actionInfo = actionInfo;
                 _this_4.parent.trigger(events.renameReport, renameArgs);
                 _this_4.currentReport = reportInput.value;
                 _this_4.updateReportList();
                 _this_4.dialog.hide();
             });
         }
+        this.parent.actionObj.actionName = this.parent.getActionCompleteName();
+        if (this.parent.actionObj.actionName) {
+            this.parent.actionCompleteMethod();
+        }
     };
     Toolbar.prototype.createNewReport = function (args) {
         this.dialogShow(args);
@@ -616,6 +668,10 @@ var Toolbar = /** @class */ (function () {
             var removeArgs = {
                 reportName: this.currentReport
             };
+            var actionInfo = {
+                reportName: this.currentReport
+            };
+            this.parent.actionObj.actionInfo = actionInfo;
             this.parent.trigger(events.removeReport, removeArgs);
             var reports = this.fetchReports();
             if (reports.reportName && reports.reportName.length > 0) {
@@ -634,6 +690,10 @@ var Toolbar = /** @class */ (function () {
                 this.action = '';
             }
             this.updateReportList();
+            this.parent.actionObj.actionName = events.reportRemoved;
+            if (this.parent.actionObj.actionName) {
+                this.parent.actionCompleteMethod();
+            }
         }
         else if (this.action === 'New' || (this.action !== 'Save' && this.action !== 'Rename' && this.action !== 'New')) {
             if (this.currentReport && this.currentReport !== '' && this.parent.isModified) {
@@ -641,12 +701,22 @@ var Toolbar = /** @class */ (function () {
                     report: this.parent.getPersistData(),
                     reportName: this.currentReport
                 };
+                var actionInfo = {
+                    reportName: this.currentReport
+                };
+                this.parent.actionObj.actionInfo = actionInfo;
+                this.parent.actionObj.actionName = events.reportSaved;
+                if (this.parent.actionObj.actionName) {
+                    this.parent.actionCompleteMethod();
+                }
                 this.parent.trigger(events.saveReport, saveArgs);
                 this.parent.isModified = false;
                 if (this.action === 'New') {
+                    this.parent.actionObj.actionName = events.addNewReport;
                     this.createNewReport(this.newArgs);
                 }
                 else {
+                    this.parent.actionObj.actionName = events.reportChange;
                     this.reportLoad(this.dropArgs);
                 }
             }
@@ -752,6 +822,7 @@ var Toolbar = /** @class */ (function () {
             this.chartMenu = new Menu({
                 items: menu, enableRtl: this.parent.enableRtl,
                 locale: this.parent.locale,
+                cssClass: cls.TOOLBAR_MENU,
                 select: this.menuItemClick.bind(this),
                 beforeOpen: this.whitespaceRemove.bind(this),
                 onClose: function (args) {
@@ -808,6 +879,7 @@ var Toolbar = /** @class */ (function () {
             this.exportMenu = new Menu({
                 items: menu, enableRtl: this.parent.enableRtl,
                 locale: this.parent.locale,
+                cssClass: cls.TOOLBAR_MENU,
                 select: this.menuItemClick.bind(this), beforeOpen: this.updateExportMenu.bind(this),
                 onClose: function (args) {
                     _this_1.focusToolBar();
@@ -845,6 +917,7 @@ var Toolbar = /** @class */ (function () {
             this.subTotalMenu = new Menu({
                 items: menu, enableRtl: this.parent.enableRtl,
                 locale: this.parent.locale,
+                cssClass: cls.TOOLBAR_MENU,
                 select: this.menuItemClick.bind(this), beforeOpen: this.updateSubtotalSelection.bind(this),
                 onClose: function (args) {
                     _this_1.focusToolBar();
@@ -882,6 +955,7 @@ var Toolbar = /** @class */ (function () {
             this.grandTotalMenu = new Menu({
                 items: menu, enableRtl: this.parent.enableRtl,
                 locale: this.parent.locale,
+                cssClass: cls.TOOLBAR_MENU,
                 select: this.menuItemClick.bind(this), beforeOpen: this.updateGrandtotalSelection.bind(this),
                 onClose: function (args) {
                     _this_1.focusToolBar();
@@ -909,6 +983,7 @@ var Toolbar = /** @class */ (function () {
             this.formattingMenu = new Menu({
                 items: menu, enableRtl: this.parent.enableRtl,
                 locale: this.parent.locale,
+                cssClass: cls.TOOLBAR_MENU,
                 select: this.menuItemClick.bind(this)
             });
             this.formattingMenu.isStringTemplate = true;
@@ -1108,181 +1183,202 @@ var Toolbar = /** @class */ (function () {
         var _this_1 = this;
         var exportArgs = {};
         var type;
+        var actionName = (args.item.id == "PivotViewgrid") ? events.tableView : (args.item.id == "PivotView_Column") ? events.chartView : (args.item.id == "PivotView_Bar") ? events.chartView : (args.item.id == "PivotView_Line") ? events.chartView
+            : (args.item.id == "PivotView_Area") ? events.chartView : (args.item.id == "PivotView_Scatter") ? events.chartView : (args.item.id == "PivotView_Polar") ? events.chartView : (args.item.id == "PivotView_ChartMoreOption") ? events.chartView
+                : (args.item.id == "PivotView_multipleAxes") ? events.multipleAxis : (args.item.id == "PivotView_showLegend") ? events.showLegend : (args.item.id == "PivotViewpdf") ? events.pdfExport : (args.item.id == "PivotViewpng") ? events.pngExport
+                    : (args.item.id == "PivotViewexcel") ? events.excelExport : (args.item.id == "PivotViewcsv") ? events.csvExport : (args.item.id == "PivotViewjpeg") ? events.jpegExport : (args.item.id == "PivotViewsvg") ? events.svgExport
+                        : (args.item.id == "PivotViewnotsubtotal") ? events.hideSubTotals : (args.item.id == "PivotViewsubtotalrow") ? events.subTotalsRow : (args.item.id == "PivotViewsubtotalcolumn") ? events.subTotalsColumn
+                            : (args.item.id == "PivotViewsubtotal") ? events.showSubTotals : (args.item.id == "PivotViewnotgrandtotal") ? events.hideGrandTotals : (args.item.id == "PivotViewgrandtotalrow") ? events.grandTotalsRow
+                                : (args.item.id == "PivotViewgrandtotalcolumn") ? events.grandTotalsColumn : (args.item.id == "PivotViewgrandtotal") ? events.showGrandTotals
+                                    : (args.item.id == "PivotViewnumberFormattingMenu") ? events.numberFormattingMenu : (args.item.id == "PivotViewconditionalFormattingMenu") ? events.conditionalFormattingMenu : '';
+        this.parent.actionObj.actionName = actionName;
+        if (this.parent.actionBeginMethod()) {
+            return;
+        }
         if (this.getAllChartItems().indexOf(args.item.id.split(this.parent.element.id + '_')[1]) > -1 ||
             (args.item.id.split(this.parent.element.id + '_')[1] === 'ChartMoreOption') ||
             (args.item.id.split(this.parent.element.id + '_')[1] === 'multipleAxes') ||
             (args.item.id.split(this.parent.element.id + '_')[1] === 'showLegend')) {
             type = args.item.id.split(this.parent.element.id + '_')[1];
         }
-        switch (args.item.id) {
-            case (this.parent.element.id + 'grid'):
-                if (this.parent.grid && this.parent.chart) {
-                    this.parent.grid.element.style.display = '';
-                    this.parent.chart.element.style.display = 'none';
-                    if (this.parent.chartSettings.enableMultipleAxis && this.parent.chartSettings.enableScrollOnMultiAxis) {
-                        this.parent.element.querySelector('.e-pivotchart').style.display = 'none';
+        try {
+            switch (args.item.id) {
+                case (this.parent.element.id + 'grid'):
+                    if (this.parent.grid && this.parent.chart) {
+                        this.parent.grid.element.style.display = '';
+                        this.parent.chart.element.style.display = 'none';
+                        if (this.parent.chartSettings.enableMultipleAxis && this.parent.chartSettings.enableScrollOnMultiAxis) {
+                            this.parent.element.querySelector('.e-pivotchart').style.display = 'none';
+                        }
+                        this.parent.currentView = 'Table';
+                        this.parent.setProperties({ displayOption: { primary: 'Table' } }, true);
+                        if (this.parent.showGroupingBar && this.parent.groupingBarModule) {
+                            this.parent.element.querySelector('.e-pivot-grouping-bar').style.display = '';
+                            this.parent.element.querySelector('.e-chart-grouping-bar').style.display = 'none';
+                        }
+                        var actionInfo = {
+                            toolbarInfo: { displayOption: this.parent.displayOption, gridSettings: this.parent.gridSettings }
+                        };
+                        this.parent.actionObj.actionInfo = actionInfo;
+                        this.parent.layoutRefresh();
                     }
-                    this.parent.currentView = 'Table';
-                    this.parent.setProperties({ displayOption: { primary: 'Table' } }, true);
-                    if (this.parent.showGroupingBar && this.parent.groupingBarModule) {
-                        this.parent.element.querySelector('.e-pivot-grouping-bar').style.display = '';
-                        this.parent.element.querySelector('.e-chart-grouping-bar').style.display = 'none';
+                    break;
+                case (this.parent.element.id + 'pdf'):
+                    if (this.parent.currentView === 'Table') {
+                        exportArgs = {
+                            pdfExportProperties: { fileName: 'Export.pdf' },
+                            pdfDoc: undefined,
+                            isBlob: false,
+                            isMultipleExport: false
+                        };
+                        this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
+                            _this_1.parent.pdfExport(observedArgs.pdfExportProperties, observedArgs.isMultipleExport, observedArgs.pdfDoc, observedArgs.isBlob);
+                        });
                     }
-                    this.parent.layoutRefresh();
-                }
-                break;
-            case (this.parent.element.id + 'pdf'):
-                if (this.parent.currentView === 'Table') {
+                    else {
+                        exportArgs = {
+                            width: undefined,
+                            height: undefined,
+                            orientation: PdfPageOrientation.Landscape,
+                            type: 'PDF',
+                            fileName: 'result',
+                        };
+                        this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
+                            _this_1.parent.chartExport(observedArgs.type, observedArgs.fileName, observedArgs.orientation, observedArgs.width, observedArgs.height);
+                        });
+                    }
+                    break;
+                case (this.parent.element.id + 'excel'):
+                    exportArgs = {
+                        excelExportProperties: { fileName: 'Export.xlsx' },
+                        isBlob: undefined,
+                        isMultipleExport: undefined,
+                        workbook: undefined
+                    };
+                    this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
+                        _this_1.parent.excelExport(observedArgs.excelExportProperties, observedArgs.isMultipleExport, observedArgs.workbook, observedArgs.isBlob);
+                    });
+                    break;
+                case (this.parent.element.id + 'csv'):
                     exportArgs = {
-                        pdfExportProperties: { fileName: 'Export.pdf' },
-                        pdfDoc: undefined,
+                        excelExportProperties: { fileName: 'Export.csv' },
                         isBlob: false,
-                        isMultipleExport: false
+                        isMultipleExport: false,
+                        workbook: undefined
                     };
                     this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
-                        _this_1.parent.pdfExport(observedArgs.pdfExportProperties, observedArgs.isMultipleExport, observedArgs.pdfDoc, observedArgs.isBlob);
+                        _this_1.parent.csvExport(observedArgs.excelExportProperties, observedArgs.isMultipleExport, observedArgs.workbook, observedArgs.isBlob);
                     });
-                }
-                else {
+                    break;
+                case (this.parent.element.id + 'png'):
                     exportArgs = {
+                        type: 'PNG',
                         width: undefined,
                         height: undefined,
+                        fileName: 'result',
                         orientation: PdfPageOrientation.Landscape,
-                        type: 'PDF',
+                    };
+                    this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
+                        _this_1.parent.chartExport(observedArgs.type, observedArgs.fileName, observedArgs.orientation, observedArgs.width, observedArgs.height);
+                    });
+                    break;
+                case (this.parent.element.id + 'jpeg'):
+                    exportArgs = {
+                        type: 'JPEG',
                         fileName: 'result',
+                        orientation: PdfPageOrientation.Landscape,
+                        width: undefined,
+                        height: undefined,
                     };
                     this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
                         _this_1.parent.chartExport(observedArgs.type, observedArgs.fileName, observedArgs.orientation, observedArgs.width, observedArgs.height);
                     });
-                }
-                break;
-            case (this.parent.element.id + 'excel'):
-                exportArgs = {
-                    excelExportProperties: { fileName: 'Export.xlsx' },
-                    isBlob: undefined,
-                    isMultipleExport: undefined,
-                    workbook: undefined
-                };
-                this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
-                    _this_1.parent.excelExport(observedArgs.excelExportProperties, observedArgs.isMultipleExport, observedArgs.workbook, observedArgs.isBlob);
-                });
-                break;
-            case (this.parent.element.id + 'csv'):
-                exportArgs = {
-                    excelExportProperties: { fileName: 'Export.csv' },
-                    isBlob: false,
-                    isMultipleExport: false,
-                    workbook: undefined
-                };
-                this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
-                    _this_1.parent.csvExport(observedArgs.excelExportProperties, observedArgs.isMultipleExport, observedArgs.workbook, observedArgs.isBlob);
-                });
-                break;
-            case (this.parent.element.id + 'png'):
-                exportArgs = {
-                    type: 'PNG',
-                    width: undefined,
-                    height: undefined,
-                    fileName: 'result',
-                    orientation: PdfPageOrientation.Landscape,
-                };
-                this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
-                    _this_1.parent.chartExport(observedArgs.type, observedArgs.fileName, observedArgs.orientation, observedArgs.width, observedArgs.height);
-                });
-                break;
-            case (this.parent.element.id + 'jpeg'):
-                exportArgs = {
-                    type: 'JPEG',
-                    fileName: 'result',
-                    orientation: PdfPageOrientation.Landscape,
-                    width: undefined,
-                    height: undefined,
-                };
-                this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
-                    _this_1.parent.chartExport(observedArgs.type, observedArgs.fileName, observedArgs.orientation, observedArgs.width, observedArgs.height);
-                });
-                break;
-            case (this.parent.element.id + 'svg'):
-                exportArgs = {
-                    width: undefined,
-                    height: undefined,
-                    type: 'SVG',
-                    fileName: 'result',
-                    orientation: PdfPageOrientation.Landscape,
-                };
-                this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
-                    _this_1.parent.chartExport(observedArgs.type, observedArgs.fileName, observedArgs.orientation, observedArgs.width, observedArgs.height);
-                });
-                break;
-            case (this.parent.element.id + 'notsubtotal'):
-                this.parent.setProperties({ dataSourceSettings: { showSubTotals: false, showColumnSubTotals: false, showRowSubTotals: false } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'subtotalrow'):
-                this.parent.setProperties({ dataSourceSettings: { showSubTotals: true, showColumnSubTotals: false, showRowSubTotals: true } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'subtotalcolumn'):
-                this.parent.setProperties({ dataSourceSettings: { showSubTotals: true, showColumnSubTotals: true, showRowSubTotals: false } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'subtotal'):
-                this.parent.setProperties({ dataSourceSettings: { showSubTotals: true, showColumnSubTotals: true, showRowSubTotals: true } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'notgrandtotal'):
-                this.parent.setProperties({ dataSourceSettings: { showGrandTotals: false, showColumnGrandTotals: false, showRowGrandTotals: false } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'grandtotalrow'):
-                this.parent.setProperties({ dataSourceSettings: { showGrandTotals: true, showColumnGrandTotals: false, showRowGrandTotals: true } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'grandtotalcolumn'):
-                this.parent.setProperties({ dataSourceSettings: { showGrandTotals: true, showColumnGrandTotals: true, showRowGrandTotals: false } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'grandtotal'):
-                this.parent.setProperties({ dataSourceSettings: { showGrandTotals: true, showColumnGrandTotals: true, showRowGrandTotals: true } }, true);
-                this.parent.refreshData();
-                break;
-            case (this.parent.element.id + 'numberFormattingMenu'):
-                if (this.parent.numberFormattingModule) {
-                    this.parent.numberFormattingModule.showNumberFormattingDialog();
-                }
-                break;
-            case (this.parent.element.id + 'conditionalFormattingMenu'):
-                if (this.parent.conditionalFormattingModule) {
-                    this.parent.conditionalFormattingModule.showConditionalFormattingDialog();
-                }
-                break;
-            case (this.parent.element.id + '_' + type):
-                if (args.item && args.item.text) {
-                    if (type === 'ChartMoreOption') {
-                        this.createChartTypeDialog();
-                    }
-                    else if (type === 'multipleAxes') {
-                        if (this.parent.chartSettings.enableScrollOnMultiAxis) {
-                            this.isMultiAxisChange = true;
-                        }
-                        this.parent.chartSettings.enableMultipleAxis = !this.parent.chartSettings.enableMultipleAxis;
-                        this.updateChartType(this.parent.chartSettings.chartSeries.type, true);
+                    break;
+                case (this.parent.element.id + 'svg'):
+                    exportArgs = {
+                        width: undefined,
+                        height: undefined,
+                        type: 'SVG',
+                        fileName: 'result',
+                        orientation: PdfPageOrientation.Landscape,
+                    };
+                    this.parent.trigger(events.beforeExport, exportArgs, function (observedArgs) {
+                        _this_1.parent.chartExport(observedArgs.type, observedArgs.fileName, observedArgs.orientation, observedArgs.width, observedArgs.height);
+                    });
+                    break;
+                case (this.parent.element.id + 'notsubtotal'):
+                    this.parent.setProperties({ dataSourceSettings: { showSubTotals: false, showColumnSubTotals: false, showRowSubTotals: false } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'subtotalrow'):
+                    this.parent.setProperties({ dataSourceSettings: { showSubTotals: true, showColumnSubTotals: false, showRowSubTotals: true } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'subtotalcolumn'):
+                    this.parent.setProperties({ dataSourceSettings: { showSubTotals: true, showColumnSubTotals: true, showRowSubTotals: false } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'subtotal'):
+                    this.parent.setProperties({ dataSourceSettings: { showSubTotals: true, showColumnSubTotals: true, showRowSubTotals: true } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'notgrandtotal'):
+                    this.parent.setProperties({ dataSourceSettings: { showGrandTotals: false, showColumnGrandTotals: false, showRowGrandTotals: false } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'grandtotalrow'):
+                    this.parent.setProperties({ dataSourceSettings: { showGrandTotals: true, showColumnGrandTotals: false, showRowGrandTotals: true } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'grandtotalcolumn'):
+                    this.parent.setProperties({ dataSourceSettings: { showGrandTotals: true, showColumnGrandTotals: true, showRowGrandTotals: false } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'grandtotal'):
+                    this.parent.setProperties({ dataSourceSettings: { showGrandTotals: true, showColumnGrandTotals: true, showRowGrandTotals: true } }, true);
+                    this.parent.refreshData();
+                    break;
+                case (this.parent.element.id + 'numberFormattingMenu'):
+                    if (this.parent.numberFormattingModule) {
+                        this.parent.numberFormattingModule.showNumberFormattingDialog();
                     }
-                    else if (this.getAllChartItems().indexOf(type) > -1) {
-                        this.updateChartType(type, false);
+                    break;
+                case (this.parent.element.id + 'conditionalFormattingMenu'):
+                    if (this.parent.conditionalFormattingModule) {
+                        this.parent.conditionalFormattingModule.showConditionalFormattingDialog();
                     }
-                    else if (type === 'showLegend') {
-                        this.parent.chart.legendSettings.visible = !this.showLableState;
-                        if (this.parent.chartSettings.legendSettings) {
-                            this.parent.chartSettings.legendSettings.visible = !this.showLableState;
+                    break;
+                case (this.parent.element.id + '_' + type):
+                    if (args.item && args.item.text) {
+                        if (type === 'ChartMoreOption') {
+                            this.createChartTypeDialog();
                         }
-                        else {
-                            this.parent.setProperties({ chartSettings: { legendSettings: { visible: !this.showLableState } } }, true);
+                        else if (type === 'multipleAxes') {
+                            if (this.parent.chartSettings.enableScrollOnMultiAxis) {
+                                this.isMultiAxisChange = true;
+                            }
+                            this.parent.chartSettings.enableMultipleAxis = !this.parent.chartSettings.enableMultipleAxis;
+                            this.updateChartType(this.parent.chartSettings.chartSeries.type, true);
+                        }
+                        else if (this.getAllChartItems().indexOf(type) > -1) {
+                            this.updateChartType(type, false);
+                        }
+                        else if (type === 'showLegend') {
+                            this.parent.chart.legendSettings.visible = !this.showLableState;
+                            if (this.parent.chartSettings.legendSettings) {
+                                this.parent.chartSettings.legendSettings.visible = !this.showLableState;
+                            }
+                            else {
+                                this.parent.setProperties({ chartSettings: { legendSettings: { visible: !this.showLableState } } }, true);
+                            }
+                            this.updateChartType(this.parent.chartSettings.chartSeries.type, true);
                         }
-                        this.updateChartType(this.parent.chartSettings.chartSeries.type, true);
                     }
-                }
-                break;
+                    break;
+            }
+        }
+        catch (execption) {
+            this.parent.actionFailureMethod(execption);
         }
         /* eslint-enable max-len */
     };
@@ -1374,14 +1470,20 @@ var Toolbar = /** @class */ (function () {
             if (this.parent.chart) {
                 this.parent.currentView = 'Chart';
                 this.parent.setProperties({ displayOption: { primary: 'Chart' } }, true);
-                this.parent.chart.element.style.width = formatUnit(this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber()); /* eslint-disable-line */
+                if (this.parent.chartSettings.enableScrollOnMultiAxis && this.parent.chartSettings.enableMultipleAxis) {
+                    this.parent.element.querySelector('.' + cls.PIVOTCHART).style.width = formatUnit(this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber()); /* eslint-disable-line */
+                }
                 this.parent.chart.setProperties({ width: formatUnit(this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber()) }, true); /* eslint-disable-line */
                 if (this.parent.chartSettings.chartSeries.type === type && !isMultiAxis) {
-                    this.parent.chartModule.updateView();
+                    this.parent.pivotChartModule.updateView();
                 }
                 else {
                     this.parent.chartSettings.chartSeries.type = type;
                 }
+                var actionInfo = {
+                    toolbarInfo: { displayOption: this.parent.displayOption, chartSettings: this.parent.chartSettings }
+                };
+                this.parent.actionObj.actionInfo = actionInfo;
             }
         }
     };