@syncfusion/ej2-pivotview
Version:
The pivot grid, or pivot table, is used to visualize large sets of relational data in a cross-tabular format, similar to an Excel pivot table.
1,029 lines (1,028 loc) • 102 kB
JavaScript
import { Toolbar as tool, Menu } from '@syncfusion/ej2-navigations';
import { remove, createElement, formatUnit, getInstance, addClass, removeClass, select, SanitizeHtmlHelper, setValue } from '@syncfusion/ej2-base';
import * as events from '../../common/base/constant';
import { Dialog } from '@syncfusion/ej2-popups';
import { DropDownList } from '@syncfusion/ej2-dropdowns';
import * as cls from '../../common/base/css-constant';
import { PivotView } from '../../pivotview/base/pivotview';
import { Deferred } from '@syncfusion/ej2-data';
import { CheckBox } from '@syncfusion/ej2-buttons';
/**
* Module for Toolbar
*/
/** @hidden */
var Toolbar = /** @class */ (function () {
function Toolbar(parent) {
/** @hidden */
this.isMultiAxisChange = false;
/** @hidden */
this.isReportChange = false;
this.currentReport = '';
this.parent = parent;
this.parent.toolbarModule = this;
this.addEventListener();
}
/**
* It returns the Module name.
*
* @returns {string} - string
* @hidden
*/
Toolbar.prototype.getModuleName = function () {
return 'toolbar';
};
Toolbar.prototype.createToolbar = function () {
this.parent.isModified = false;
this.renderDialog();
if (select('#' + this.parent.element.id + 'pivot-toolbar', this.parent.element) !== null) {
remove(select('#' + this.parent.element.id + 'pivot-toolbar', this.parent.element));
}
var element = createElement('div', {
id: this.parent.element.id + 'pivot-toolbar',
className: cls.GRID_TOOLBAR
});
if (this.parent.showFieldList && select('#' + this.parent.element.id + '_PivotFieldList', this.parent.element)) {
this.parent.element.insertBefore(element, select('#' + this.parent.element.id + '_PivotFieldList', this.parent.element));
}
else if (this.parent.showGroupingBar &&
select('#' + this.parent.element.id + ' .' + 'e-pivot-grouping-bar', this.parent.element)) {
this.parent.element.insertBefore(element, select('#' + this.parent.element.id + ' .' + 'e-pivot-grouping-bar', this.parent.element));
}
else {
var chartElement = select('#' + this.parent.element.id + '_chart', this.parent.element);
if (chartElement && (this.parent.displayOption.view === 'Chart' || this.parent.displayOption.primary === 'Chart')) {
this.parent.element.insertBefore(element, chartElement);
}
else {
this.parent.element.insertBefore(element, select('#' + this.parent.element.id + '_grid', this.parent.element));
}
}
this.toolbar = new tool({
created: this.create.bind(this),
enableRtl: this.parent.enableRtl,
locale: this.parent.locale,
enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
items: this.getItems(),
allowKeyboard: false,
cssClass: this.parent.cssClass,
width: this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber()
});
this.toolbar.isStringTemplate = true;
var viewStr = 'viewContainerRef';
var registerTemp = 'registeredTemplate';
var registeredTemplate = {};
if ((this.parent)[viewStr]) {
setValue(registerTemp, registeredTemplate, this.toolbar);
(this.toolbar)[viewStr] = (this.parent)[viewStr];
}
if (this.parent.toolbarTemplate && typeof (this.parent.toolbarTemplate) === 'string') {
this.toolbar.appendTo(this.parent.toolbarTemplate);
this.parent.element.replaceChild(this.toolbar.element, this.parent.element.querySelector('.' + cls.GRID_TOOLBAR));
this.toolbar.element.classList.add(cls.GRID_TOOLBAR);
}
else {
this.toolbar.appendTo(element);
}
this.toolbar.width = this.parent.grid ? this.parent.getGridWidthAsNumber() : this.parent.getWidthAsNumber();
if (this.parent.chart) {
this.parent.chart.setProperties({ width: this.parent.grid ? this.parent.getGridWidthAsNumber().toString() : this.parent.getWidthAsNumber().toString() }, true);
}
if (this.parent.showGroupingBar && this.parent.groupingBarModule &&
this.parent.element.querySelector('.' + cls.GROUPING_BAR_CLASS)) {
this.parent.groupingBarModule.refreshUI();
}
};
Toolbar.prototype.fetchReports = function () {
var reports = { reportName: [] };
this.parent.trigger(events.fetchReport, reports);
return reports;
};
Toolbar.prototype.fetchReportsArgs = function () {
var callbackPromise = new Deferred();
var reports = { reportName: [] };
this.parent.trigger(events.fetchReport, reports, function (observedArgs) {
callbackPromise.resolve(observedArgs);
});
return callbackPromise;
};
Toolbar.prototype.getItems = function () {
var toolbar = this.parent.toolbar.filter(function (v, i, a) { return a.indexOf(v) === i; });
var items = [];
for (var _i = 0, toolbar_1 = toolbar; _i < toolbar_1.length; _i++) {
var item = toolbar_1[_i];
switch (item) {
case 'New':
items.push({
prefixIcon: cls.GRID_NEW + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('new'),
click: this.actionClick.bind(this), id: this.parent.element.id + 'new'
});
break;
case 'Save':
items.push({
prefixIcon: cls.GRID_SAVE + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('save'),
click: this.actionClick.bind(this), id: this.parent.element.id + 'save'
});
break;
case 'SaveAs':
items.push({
prefixIcon: cls.GRID_SAVEAS + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('saveAs'),
click: this.actionClick.bind(this), id: this.parent.element.id + 'saveas'
});
break;
case 'Rename':
items.push({
prefixIcon: cls.GRID_RENAME + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('rename'),
click: this.actionClick.bind(this), id: this.parent.element.id + 'rename'
});
break;
case 'Remove':
items.push({
prefixIcon: cls.GRID_REMOVE + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('deleteReport'),
click: this.actionClick.bind(this), id: this.parent.element.id + 'remove'
});
break;
case 'Load':
items.push({
template: '<div><input class=' + cls.GRID_LOAD + ' id=' + this.parent.element.id + '_reportlist></input></div>',
click: this.actionClick.bind(this),
id: this.parent.element.id + 'load'
});
break;
case 'Grid':
{
var toDisable = this.parent.displayOption.view === 'Chart';
items.push({
prefixIcon: cls.TOOLBAR_GRID + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('grid'),
id: this.parent.element.id + 'grid', cssClass: (toDisable ? cls.MENU_DISABLE : '') + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
click: this.menuItemClick.bind(this)
});
}
break;
case 'Chart':
{
var validTypes = (this.parent.displayOption.view === 'Table');
items.push({
template: '<ul id="' + this.parent.element.id + 'chart_menu"></ul>',
id: this.parent.element.id + 'chartmenu', cssClass: (validTypes ? cls.MENU_DISABLE : '') + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '')
});
}
break;
case 'MDX':
if (this.parent.dataType === 'olap') {
items.push({
prefixIcon: cls.GRID_MDX + ' ' + cls.ICON, id: this.parent.element.id + 'mdxQuery',
click: this.actionClick.bind(this), tooltipText: this.parent.localeObj.getConstant('mdxQuery')
});
}
break;
case 'Export':
items.push({
template: '<ul id="' + this.parent.element.id + 'export_menu"></ul>',
id: this.parent.element.id + 'exportmenu'
});
break;
case 'SubTotal':
items.push({
template: '<ul id="' + this.parent.element.id + 'subtotal_menu"></ul>',
id: this.parent.element.id + 'subtotalmenu'
});
break;
case 'GrandTotal':
items.push({
template: '<ul id="' + this.parent.element.id + 'grandtotal_menu"></ul>',
id: this.parent.element.id + 'grandtotalmenu'
});
break;
case 'ConditionalFormatting':
items.push({
prefixIcon: cls.GRID_FORMATTING + ' ' + cls.ICON, id: this.parent.element.id + 'formatting',
click: this.actionClick.bind(this), tooltipText: this.parent.localeObj.getConstant('toolbarFormatting')
});
break;
case 'NumberFormatting':
items.push({
prefixIcon: cls.FORMATTING_TOOLBAR + ' ' + cls.ICON, id: this.parent.element.id + 'numberFormatting',
click: this.actionClick.bind(this), tooltipText: this.parent.localeObj.getConstant('numberFormat')
});
break;
case 'Formatting':
items.push({
template: '<ul id="' + this.parent.element.id + 'formatting_menu"></ul>',
id: this.parent.element.id + 'formattingmenu'
});
break;
case 'FieldList':
items.push({
prefixIcon: cls.TOOLBAR_FIELDLIST + ' ' + cls.ICON, tooltipText: this.parent.localeObj.getConstant('fieldList'),
click: this.actionClick.bind(this), align: 'Right', id: this.parent.element.id + 'fieldlist'
});
if (this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS)) {
this.parent.element.querySelector('.' + cls.TOGGLE_FIELD_LIST_CLASS).style.display = 'none';
}
break;
default:
if (typeof (item) === 'object') {
items.push(item);
}
}
}
if (this.parent.showFieldList && toolbar.indexOf('FieldList') === -1 && select('#' + this.parent.element.id + '_PivotFieldList', this.parent.element) &&
select('#' + this.parent.element.id + '_PivotFieldList', this.parent.element).style.display === 'none') {
select('#' + this.parent.element.id + '_PivotFieldList', this.parent.element).style.display = 'block';
}
var toolbarArgs = { customToolbar: items };
this.parent.trigger(events.toolbarRender, toolbarArgs);
return items;
};
Toolbar.prototype.reportChange = function (args) {
this.parent.actionObj.actionName = events.reportChange;
this.isReportChange = true;
if (this.parent.actionBeginMethod()) {
args.cancel = true;
return;
}
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) {
var _this_1 = this;
if (this.action !== 'Save' && this.action !== 'Rename' && this.action !== 'New') {
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;
});
}
};
Toolbar.prototype.saveReport = function (args) {
if (this.currentReport && this.currentReport !== '' && args.item.id === (this.parent.element.id + 'save')) {
var saveArgs = {
report: this.getCurrentReport(),
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'))) {
this.parent.pivotCommon.errorDialog.createErrorDialog(this.parent.localeObj.getConstant('error'), this.parent.localeObj.getConstant('emptyReport'));
return;
}
else {
this.dialogShow(args, 'saveAs');
}
};
Toolbar.prototype.mdxQueryDialog = function () {
if (!select('#' + this.parent.element.id + 'mdx-dialog', document)) {
this.renderMDXDialog();
}
var mdxDialog = getInstance(select('#' + this.parent.element.id + 'mdx-dialog', document), Dialog);
var outerDiv = createElement('div', {
className: cls.MDX_QUERY
});
var textarea = createElement('textarea', {
className: cls.MDX_QUERY_CONTENT,
attrs: { 'readonly': 'readonly', 'aria-label': this.parent.localeObj.getConstant('mdxQuery') }
});
textarea.innerText = this.parent.olapEngineModule.getMDXQuery(this.parent.dataSourceSettings).trim();
outerDiv.appendChild(textarea);
mdxDialog.content = outerDiv;
mdxDialog.show();
};
Toolbar.prototype.dialogShow = function (args, action) {
if (args) {
var dialog = getInstance(select('#' + this.parent.element.id + 'report-dialog', document), Dialog);
dialog.header = args.item.tooltipText;
var outerDiv = createElement('div', {
className: cls.GRID_REPORT_OUTER
});
var label = createElement('div', {
className: cls.GRID_REPORT_LABEL
});
label.innerText = this.parent.localeObj.getConstant('reportName');
var input = createElement('input', {
className: cls.GRID_REPORT_INPUT + ' ' + cls.INPUT,
attrs: {
'placeholder': this.parent.localeObj.getConstant('emptyReportName'),
'value': (action && action === 'rename' ? this.currentReport : '')
}
});
input.innerText = (action && action === 'rename' ? this.currentReport : '');
input.setSelectionRange(input.textContent.length, input.textContent.length);
outerDiv.appendChild(label);
outerDiv.appendChild(input);
dialog.content = outerDiv;
dialog.refresh();
dialog.show();
}
};
Toolbar.prototype.renameReport = function (args) {
this.parent.trigger(events.toolbarClick, args);
if (this.currentReport && this.currentReport !== '') {
this.dialogShow(args, 'rename');
}
else {
this.parent.pivotCommon.errorDialog.createErrorDialog(this.parent.localeObj.getConstant('error'), this.parent.localeObj.getConstant('emptyReport'));
return;
}
};
Toolbar.prototype.actionClick = function (args) {
var actionName = (args.item.id === this.parent.element.id + 'new') ? events.addNewReport : (args.item.id === this.parent.element.id + 'save') ? events.saveCurrentReport : (args.item.id === this.parent.element.id + 'saveas') ? events.saveAsCurrentReport
: (args.item.id === this.parent.element.id + 'rename') ? events.renameCurrentReport : (args.item.id === this.parent.element.id + 'remove') ? events.removeCurrentReport : (args.item.id === this.parent.element.id + 'load') ? events.loadReports
: (args.item.id === this.parent.element.id + 'formatting') ? events.openConditionalFormatting : (args.item.id === this.parent.element.id + 'numberFormatting') ? events.openNumberFormatting
: (args.item.id === this.parent.element.id + 'mdxQuery') ? events.MdxQuery : (args.item.id === this.parent.element.id + 'fieldlist') ? 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.onShowFieldList();
}
break;
case (this.parent.element.id + 'formatting'):
if (this.parent.conditionalFormattingModule) {
this.parent.conditionalFormattingModule.showConditionalFormattingDialog();
}
break;
case (this.parent.element.id + 'mdxQuery'):
this.mdxQueryDialog();
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 () {
if (select('#' + this.parent.element.id + 'report-dialog', this.parent.element) !== null) {
remove(select('#' + this.parent.element.id + 'report-dialog', this.parent.element));
}
var reportDialogElement = createElement('div', {
id: this.parent.element.id + 'report-dialog',
className: cls.GRID_REPORT_DIALOG
});
this.parent.element.appendChild(reportDialogElement);
var dialog = new Dialog({
animationSettings: { effect: 'Fade' },
allowDragging: true,
position: { X: 'center', Y: 'center' },
buttons: [
{
click: this.okBtnClick.bind(this),
isFlat: false,
buttonModel: {
content: this.parent.localeObj.getConstant('ok'),
isPrimary: true
}
},
{
click: this.cancelBtnClick.bind(this),
isFlat: false,
buttonModel: {
content: this.parent.localeObj.getConstant('cancel')
}
}
],
isModal: true,
visible: false,
showCloseIcon: true,
enableRtl: this.parent.enableRtl,
locale: this.parent.locale,
enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
width: 'auto',
height: 'auto',
zIndex: 1000001,
closeOnEscape: true,
target: document.body,
cssClass: this.parent.cssClass
});
dialog.isStringTemplate = true;
dialog.appendTo(reportDialogElement);
};
Toolbar.prototype.renderMDXDialog = function () {
if (select('#' + this.parent.element.id + 'mdx-dialog', this.parent.element) !== null) {
remove(select('#' + this.parent.element.id + 'mdx-dialog', this.parent.element));
}
var mdxDialogElement = createElement('div', {
id: this.parent.element.id + 'mdx-dialog',
className: cls.GRID_MDX_DIALOG
});
this.parent.element.appendChild(mdxDialogElement);
var mdxDialog = new Dialog({
animationSettings: { effect: 'Fade' },
allowDragging: true,
position: { X: 'center', Y: 'center' },
buttons: [
{
click: this.copyMDXQuery.bind(this),
isFlat: false,
buttonModel: {
content: this.parent.localeObj.getConstant('copy'),
isPrimary: true
}
}
],
header: this.parent.localeObj.getConstant('mdxQuery'),
isModal: true,
visible: false,
showCloseIcon: true,
enableRtl: this.parent.enableRtl,
locale: this.parent.locale,
enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
width: 'auto',
height: 'auto',
zIndex: 1000001,
closeOnEscape: true,
target: document.body,
cssClass: this.parent.cssClass
});
mdxDialog.isStringTemplate = true;
mdxDialog.appendTo(mdxDialogElement);
};
Toolbar.prototype.copyMDXQuery = function () {
var mdxDialog = getInstance(select('#' + this.parent.element.id + 'mdx-dialog', document), Dialog);
var textArea = mdxDialog.element.querySelector('.' + cls.MDX_QUERY_CONTENT);
try {
textArea.select();
document.execCommand('copy');
}
catch (err) {
window.alert('Oops, unable to copy');
}
return;
};
Toolbar.prototype.okBtnClick = function () {
var _this_1 = this;
var dialog = getInstance(select('#' + this.parent.element.id + 'report-dialog', document), Dialog);
var reportInput = dialog.element.querySelector('.' + cls.GRID_REPORT_INPUT);
if (reportInput && reportInput.value === '') {
reportInput.focus();
return;
}
if (!this.parent.localeObj) {
this.parent = getInstance(select('#' + this.parent.element.id, document), PivotView);
}
if ((dialog.header === this.parent.localeObj.getConstant('save') ||
dialog.header === this.parent.localeObj.getConstant('saveAs')) &&
reportInput.value && reportInput.value !== '') {
this.action = 'Save';
this.currentReport = reportInput.value;
var isExist_1 = false;
var _this_2 = this;
var reports = { reportName: [] };
this.parent.trigger(events.fetchReport, reports, function (observedArgs) {
for (var i = 0; i < observedArgs.reportName.length; i++) {
if (reportInput.value === observedArgs.reportName[i]) {
isExist_1 = true;
break;
}
}
if (isExist_1) {
_this_2.createConfirmDialog(_this_2.parent.localeObj.getConstant('alert'), _this_2.parent.localeObj.getConstant('replaceConfirmBefore') + '"' + reportInput.value + '"' +
_this_2.parent.localeObj.getConstant('replaceConfirmAfter'));
return;
}
var saveArgs = {
report: _this_2.getCurrentReport(),
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();
getInstance(select('#' + _this_1.parent.element.id + 'report-dialog', document), Dialog).hide();
});
}
else if (dialog.header === this.parent.localeObj.getConstant('new') &&
reportInput.value && reportInput.value !== '') {
this.action = 'New';
this.currentReport = reportInput.value;
var isExist_2 = false;
var _this_3 = this;
var reports_1 = { reportName: [] };
this.parent.trigger(events.fetchReport, reports_1, function (observedArgs) {
for (var i = 0; i < observedArgs.reportName.length; i++) {
if (reportInput.value === reports_1.reportName[i]) {
isExist_2 = true;
break;
}
}
if (isExist_2) {
_this_3.createConfirmDialog(_this_3.parent.localeObj.getConstant('alert'), _this_3.parent.localeObj.getConstant('replaceConfirmBefore') + '"' + reportInput.value + '"' +
_this_3.parent.localeObj.getConstant('replaceConfirmAfter'));
return;
}
_this_3.parent.trigger(events.newReport);
var saveArgs = {
report: _this_3.getCurrentReport(),
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();
getInstance(select('#' + _this_1.parent.element.id + 'report-dialog', document), Dialog).hide();
});
}
else if (dialog.header === this.parent.localeObj.getConstant('rename') && reportInput.value && reportInput.value !== '') {
if (this.currentReport === reportInput.value) {
dialog.hide();
return;
}
this.action = 'Rename';
var isExist = false;
this.renameText = reportInput.value;
var reports = this.fetchReports();
for (var i = 0; i < reports.reportName.length; i++) {
if (reportInput.value === reports.reportName[i]) {
isExist = true;
break;
}
}
if (isExist) {
this.createConfirmDialog(this.parent.localeObj.getConstant('alert'), this.parent.localeObj.getConstant('replaceConfirmBefore') + '"' + reportInput.value + '"' +
this.parent.localeObj.getConstant('replaceConfirmAfter'));
return;
}
var renameArgs = {
reportName: this.currentReport,
rename: reportInput.value
};
var actionInfo = {
reportName: { oldName: this.currentReport, newName: reportInput.value }
};
this.parent.actionObj.actionInfo = actionInfo;
this.parent.trigger(events.renameReport, renameArgs);
this.currentReport = reportInput.value;
this.updateReportList();
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);
};
Toolbar.prototype.cancelBtnClick = function () {
var dialog = getInstance(select('#' + this.parent.element.id + 'report-dialog', document), Dialog);
dialog.hide();
};
Toolbar.prototype.createConfirmDialog = function (title, description) {
if (document.getElementById(this.parent.element.id + '_ConfirmDialog')) {
remove(document.getElementById(this.parent.element.id + '_ConfirmDialog').parentElement);
}
var errorDialog = createElement('div', {
id: this.parent.element.id + '_ConfirmDialog',
className: cls.ERROR_DIALOG_CLASS
});
this.parent.element.appendChild(errorDialog);
var confirmPopUp = new Dialog({
animationSettings: { effect: 'Fade' },
allowDragging: true,
showCloseIcon: true,
enableRtl: this.parent.enableRtl,
locale: this.parent.locale,
enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
header: title,
content: description,
isModal: true,
visible: true,
closeOnEscape: true,
target: document.body,
cssClass: this.parent.cssClass,
width: 'auto',
height: 'auto',
position: { X: 'center', Y: 'center' },
buttons: [
{
isFlat: false,
buttonModel: {
content: this.parent.localeObj.getConstant('yes'), isPrimary: true,
cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '')
},
click: this.okButtonClick.bind(this)
},
{
isFlat: false,
buttonModel: {
content: this.parent.localeObj.getConstant('no'),
cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : '')
},
click: this.cancelButtonClick.bind(this)
}
]
});
confirmPopUp.isStringTemplate = true;
confirmPopUp.appendTo(errorDialog);
confirmPopUp.element.querySelector('.e-dlg-header').innerText = this.parent.enableHtmlSanitizer ? SanitizeHtmlHelper.sanitize(title) : title;
};
Toolbar.prototype.okButtonClick = function () {
var _this_1 = this;
var dialog = getInstance(select('#' + this.parent.element.id + 'report-dialog', document), Dialog);
if (this.action === 'Remove') {
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) {
var loadArgs = {
reportName: reports.reportName[reports.reportName.length - 1]
};
this.parent.trigger(events.loadReport, loadArgs, function (observedArgs) {
_this_1.currentReport = observedArgs.reportName;
_this_1.parent.isModified = false;
});
this.currentReport = reports.reportName[reports.reportName.length - 1];
}
else {
this.currentReport = '';
this.parent.isModified = false;
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) {
var saveArgs = {
report: this.getCurrentReport(),
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);
}
}
else if (this.action === 'New') {
this.parent.trigger(events.newReport);
var saveArgs = {
report: this.getCurrentReport(),
reportName: this.currentReport
};
this.parent.trigger(events.saveReport, saveArgs);
this.parent.isModified = false;
this.updateReportList();
dialog.hide();
}
}
else if (this.action === 'Save') {
var saveArgs = {
report: this.getCurrentReport(),
reportName: this.currentReport
};
this.parent.trigger(events.saveReport, saveArgs);
this.parent.isModified = false;
this.updateReportList();
dialog.hide();
}
else if (this.action === 'Rename') {
var renameArgs = {
reportName: this.currentReport,
rename: this.renameText,
isReportExists: true
};
this.parent.trigger(events.renameReport, renameArgs);
this.currentReport = this.renameText;
this.parent.isModified = false;
this.updateReportList();
dialog.hide();
}
var confirmPopUp = getInstance(select('#' + this.parent.element.id + '_ConfirmDialog', document), Dialog);
confirmPopUp.hide();
};
Toolbar.prototype.cancelButtonClick = function () {
var dialog = getInstance(select('#' + this.parent.element.id + 'report-dialog', document), Dialog);
if (this.action === 'New') {
if (this.parent.isModified) {
this.createNewReport(this.newArgs);
}
else {
dialog.hide();
}
}
else if (this.action === 'Save') {
if (select('#' + this.parent.element.id + '_reportlist', this.parent.element)) {
var reportList = getInstance(select('#' + this.parent.element.id + '_reportlist', this.parent.element), DropDownList);
this.currentReport = reportList.value;
}
dialog.hide();
}
else if (this.action === 'Rename') {
dialog.hide();
}
else if (this.dropArgs && this.action !== 'Remove') {
this.reportLoad(this.dropArgs);
}
var confirmPopUp = getInstance(select('#' + this.parent.element.id + '_ConfirmDialog', document), Dialog);
confirmPopUp.hide();
};
/**
*
* @returns {void}
* @hidden
*/
Toolbar.prototype.createChartMenu = function () {
var _this_1 = this;
if (select('#' + this.parent.element.id + 'chart_menu', this.parent.element)) {
var chartMenuElement = select('#' + this.parent.element.id + 'chart_menu', this.parent.element);
var menuItems = [];
var types = this.getValidChartType();
for (var i = 0; (i < types.length && i < 7); i++) {
var type = types[i];
menuItems.push({
text: this.parent.localeObj.getConstant(type.toLowerCase()),
id: this.parent.element.id + '_' + type
});
}
if (menuItems.length === 7) {
menuItems.splice(6);
menuItems.push({
text: this.parent.localeObj.getConstant('MoreOption'),
id: this.parent.element.id + '_' + 'ChartMoreOption'
});
}
var toDisable = (menuItems.length <= 0 || this.parent.displayOption.view === 'Table');
menuItems.push({
separator: true
});
menuItems.push({
text: this.parent.localeObj.getConstant('multipleAxes'),
id: this.parent.element.id + '_' + 'multipleAxes'
});
menuItems.push({
text: this.parent.localeObj.getConstant('showLegend'),
id: this.parent.element.id + '_' + 'showLegend'
});
var menu = [{
iconCss: cls.TOOLBAR_CHART + ' ' + cls.ICON,
items: toDisable ? [] : menuItems
}];
var chartMenu = chartMenuElement ? getInstance(chartMenuElement, Menu) : null;
if (chartMenu && !chartMenu.isDestroyed) {
chartMenu.destroy();
chartMenu = null;
}
chartMenu = new Menu({
items: menu, enableRtl: this.parent.enableRtl,
locale: this.parent.locale,
enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
cssClass: cls.TOOLBAR_MENU + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
select: this.menuItemClick.bind(this),
beforeOpen: this.whitespaceRemove.bind(this),
onClose: function () {
_this_1.focusToolBar();
},
beforeItemRender: this.multipleAxesCheckbox.bind(this)
});
chartMenu.isStringTemplate = true;
chartMenu.appendTo(chartMenuElement);
}
};
Toolbar.prototype.create = function () {
var _this_1 = this;
if (select('#' + this.parent.element.id + 'chart_menu', this.parent.element)) {
this.createChartMenu();
}
if (select('#' + this.parent.element.id + 'export_menu', this.parent.element)) {
var exportMenuElement = select('#' + this.parent.element.id + 'export_menu', this.parent.element);
var menu = [{
iconCss: cls.GRID_EXPORT + ' ' + cls.ICON,
items: [
{
text: this.parent.localeObj.getConstant('pdf'),
iconCss: cls.GRID_PDF_EXPORT + ' ' + cls.ICON,
id: this.parent.element.id + 'pdf'
},
{
text: this.parent.localeObj.getConstant('excel'),
iconCss: cls.GRID_EXCEL_EXPORT + ' ' + cls.ICON,
id: this.parent.element.id + 'excel'
},
{
text: this.parent.localeObj.getConstant('csv'),
iconCss: cls.GRID_CSV_EXPORT + ' ' + cls.ICON,
id: this.parent.element.id + 'csv'
},
{
text: this.parent.localeObj.getConstant('png'),
iconCss: cls.GRID_PNG_EXPORT + ' ' + cls.ICON,
id: this.parent.element.id + 'png'
},
{
text: this.parent.localeObj.getConstant('jpeg'),
iconCss: cls.GRID_JPEG_EXPORT + ' ' + cls.ICON,
id: this.parent.element.id + 'jpeg'
},
{
text: this.parent.localeObj.getConstant('svg'),
iconCss: cls.GRID_SVG_EXPORT + ' ' + cls.ICON,
id: this.parent.element.id + 'svg'
}
]
}];
var exportMenu = new Menu({
items: menu, enableRtl: this.parent.enableRtl,
locale: this.parent.locale, enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
cssClass: cls.TOOLBAR_MENU + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
select: this.menuItemClick.bind(this), beforeOpen: this.updateExportMenu.bind(this),
onClose: function () {
_this_1.focusToolBar();
}
});
exportMenu.isStringTemplate = true;
exportMenu.appendTo(exportMenuElement);
}
if (select('#' + this.parent.element.id + 'subtotal_menu', this.parent.element)) {
var subTotalMenuElement = select('#' + this.parent.element.id + 'subtotal_menu', this.parent.element);
var menu = [{
iconCss: cls.GRID_SUB_TOTAL + ' ' + cls.ICON,
items: [
{
text: this.parent.localeObj.getConstant('showSubTotals'),
id: this.parent.element.id + 'subtotal',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('doNotShowSubTotals'),
id: this.parent.element.id + 'notsubtotal',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('showSubTotalsRowsOnly'),
id: this.parent.element.id + 'subtotalrow',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('showSubTotalsColumnsOnly'),
id: this.parent.element.id + 'subtotalcolumn',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
separator: true
},
{
text: this.parent.localeObj.getConstant('subTotalPosition'),
id: this.parent.element.id + 'subtotalpositions',
iconCss: cls.PIVOT_DISABLE_ICON + ' ' + cls.ICON,
items: [
{
text: this.parent.localeObj.getConstant('auto'),
id: this.parent.element.id + 'sub-none-position',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('top'),
id: this.parent.element.id + 'sub-top-position',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('bottom'),
id: this.parent.element.id + 'sub-bottom-position',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
}
]
}
]
}];
var subTotalMenu = new Menu({
items: menu, enableRtl: this.parent.enableRtl,
locale: this.parent.locale, enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
cssClass: cls.TOOLBAR_MENU + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
select: this.menuItemClick.bind(this), beforeOpen: this.updateSubtotalSelection.bind(this),
onClose: function () {
_this_1.focusToolBar();
}
});
subTotalMenu.isStringTemplate = true;
subTotalMenu.appendTo(subTotalMenuElement);
}
if (select('#' + this.parent.element.id + 'grandtotal_menu', this.parent.element)) {
var grandTotalMenuElement = select('#' + this.parent.element.id + 'grandtotal_menu', this.parent.element);
var menu = [{
iconCss: cls.GRID_GRAND_TOTAL + ' ' + cls.ICON,
items: [
{
text: this.parent.localeObj.getConstant('showGrandTotals'),
id: this.parent.element.id + 'grandtotal',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('doNotShowGrandTotals'),
id: this.parent.element.id + 'notgrandtotal',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('showGrandTotalsRowsOnly'),
id: this.parent.element.id + 'grandtotalrow',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('showGrandTotalsColumnsOnly'),
id: this.parent.element.id + 'grandtotalcolumn',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
separator: true
},
{
text: this.parent.localeObj.getConstant('grandTotalPosition'),
id: this.parent.element.id + 'grandtotalpositions',
iconCss: cls.PIVOT_DISABLE_ICON + ' ' + cls.ICON,
items: [
{
text: this.parent.localeObj.getConstant('top'),
id: this.parent.element.id + 'top-position',
iconCss: cls.PIVOT_SELECT_ICON + ' ' + cls.ICON
},
{
text: this.parent.localeObj.getConstant('bottom'),