@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,058 lines • 310 kB
JavaScript
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 __());
};
})();
var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
return c > 3 && r && Object.defineProperty(target, key, r), r;
};
var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
return new (P || (P = Promise))(function (resolve, reject) {
function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
function step(result) { result.done ? resolve(result.value) : new P(function (resolve) { resolve(result.value); }).then(fulfilled, rejected); }
step((generator = generator.apply(thisArg, _arguments || [])).next());
});
};
var __generator = (this && this.__generator) || function (thisArg, body) {
var _ = { label: 0, sent: function() { if (t[0] & 1) throw t[1]; return t[1]; }, trys: [], ops: [] }, f, y, t, g;
return g = { next: verb(0), "throw": verb(1), "return": verb(2) }, typeof Symbol === "function" && (g[Symbol.iterator] = function() { return this; }), g;
function verb(n) { return function (v) { return step([n, v]); }; }
function step(op) {
if (f) throw new TypeError("Generator is already executing.");
while (_) try {
if (f = 1, y && (t = op[0] & 2 ? y["return"] : op[0] ? y["throw"] || ((t = y["return"]) && t.call(y), 0) : y.next) && !(t = t.call(y, op[1])).done) return t;
if (y = 0, t) op = [op[0] & 2, t.value];
switch (op[0]) {
case 0: case 1: t = op; break;
case 4: _.label++; return { value: op[1], done: false };
case 5: _.label++; y = op[1]; op = [0]; continue;
case 7: op = _.ops.pop(); _.trys.pop(); continue;
default:
if (!(t = _.trys, t = t.length > 0 && t[t.length - 1]) && (op[0] === 6 || op[0] === 2)) { _ = 0; continue; }
if (op[0] === 3 && (!t || (op[1] > t[0] && op[1] < t[3]))) { _.label = op[1]; break; }
if (op[0] === 6 && _.label < t[1]) { _.label = t[1]; t = op; break; }
if (t && _.label < t[2]) { _.label = t[2]; _.ops.push(op); break; }
if (t[2]) _.ops.pop();
_.trys.pop(); continue;
}
op = body.call(thisArg, _);
} catch (e) { op = [6, e]; y = 0; } finally { f = t = 0; }
if (op[0] & 5) throw op[1]; return { value: op[0] ? op[1] : void 0, done: true };
}
};
import { Property, Browser, Component, createElement, setStyleAttribute, Fetch, getInstance } from '@syncfusion/ej2-base';
import { EventHandler, Complex, ChildProperty, Collection, isNullOrUndefined, remove } from '@syncfusion/ej2-base';
import { Internationalization, L10n, NotifyPropertyChanges, compile, formatUnit } from '@syncfusion/ej2-base';
import { removeClass, addClass, Event, setValue, closest, select, SanitizeHtmlHelper } from '@syncfusion/ej2-base';
import { initializeCSPTemplate } from '@syncfusion/ej2-base';
import { PivotEngine } from '../../base/engine';
import { Tooltip, createSpinner, showSpinner, hideSpinner } from '@syncfusion/ej2-popups';
import * as events from '../../common/base/constant';
import * as cls from '../../common/base/css-constant';
import { Render } from '../renderer/render';
import { Common } from '../../common/actions/common';
import { DataSourceSettings } from '../../model/datasourcesettings';
import { GridSettings } from '../model/gridsettings';
import { Grid, Reorder, Resize, getObject } from '@syncfusion/ej2-grids';
import { getScrollBarWidth } from '@syncfusion/ej2-grids';
import { KeyboardInteraction } from '../actions/keyboard';
import { PivotContextMenu } from '../../common/popups/context-menu';
import { DataManager, Query } from '@syncfusion/ej2-data';
import { VirtualScroll } from '../actions/virtualscroll';
import { DrillThrough } from '../actions/drill-through';
import { PivotUtil } from '../../base/util';
import { PivotChart } from '../../pivotchart/index';
import { ChartSettings } from '../model/chartsettings';
import { Chart, AccumulationChart } from '@syncfusion/ej2-charts';
import { PdfPageOrientation } from '@syncfusion/ej2-pdf-export';
import { OlapEngine } from '../../base/olap/engine';
import { ChartExport } from '../../pivotchart/actions/chart-export';
import { Save } from '@syncfusion/ej2-file-utils';
/**
* Allows a set of options for customizing the grouping bar UI with a variety of settings such as UI visibility to a specific view port,
* customizing the pivot button features such as filtering, sorting, changing aggregate types, removing any fields.
* The options available to customize the grouping bar UI are:
* * `showFilterIcon`: Allows you to show or hide the filter icon that used to be displayed on the pivot button of the grouping bar UI.
* This filter icon is used to filter the members of a particular field at runtime in the pivot table.
* * `showSortIcon`: Allows you to show or hide the sort icon that used to be displayed in the pivot button of the grouping bar UI.
* This sort icon is used to order members of a particular fields either in ascending or descending at runtime.
* * `showRemoveIcon`: Allows you to show or hide the remove icon that used to be displayed in the pivot button of the grouping bar UI.
* This remove icon is used to remove any field during runtime.
* * `showValueTypeIcon`: Allows you to show or hide the value type icon that used to be displayed in the pivot button of the grouping bar UI.
* This value type icon helps to select the appropriate aggregation type to value fields at runtime.
* * `displayMode`: Allow options to show the grouping bar UI to specific view port such as either pivot table or pivot chart or both table and chart.
* For example, to show the grouping bar UI to pivot table on its own, set the property `displayMode` to **Table**.
* * `allowDragAndDrop`: Allows you to restrict the pivot buttons that were used to drag on runtime in the grouping bar UI. This will prevent you from modifying the current report.
*/
var GroupingBarSettings = /** @class */ (function (_super) {
__extends(GroupingBarSettings, _super);
function GroupingBarSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(true)
], GroupingBarSettings.prototype, "showFilterIcon", void 0);
__decorate([
Property(true)
], GroupingBarSettings.prototype, "showSortIcon", void 0);
__decorate([
Property(true)
], GroupingBarSettings.prototype, "showRemoveIcon", void 0);
__decorate([
Property(true)
], GroupingBarSettings.prototype, "showValueTypeIcon", void 0);
__decorate([
Property('Both')
], GroupingBarSettings.prototype, "displayMode", void 0);
__decorate([
Property(true)
], GroupingBarSettings.prototype, "allowDragAndDrop", void 0);
__decorate([
Property(false)
], GroupingBarSettings.prototype, "showFieldsPanel", void 0);
return GroupingBarSettings;
}(ChildProperty));
export { GroupingBarSettings };
/**
* Allow options for performing CRUD operations, such as add, edit, delete, and update the raw items of any cell from the pivot table.
* The raw items can be viewed in a data grid that used to be displayed as a dialog by double-clicking the appropriate value cell in the pivot table.
* CRUD operations can be performed in this data grid either by double-clicking the cells or using toolbar options.
* The options available are as follows:
* * `allowAdding`: Allows you to add a new record to the data grid used to update the appropriate cells in the pivot table.
* * `allowEditing`: Allows you to edit the existing record in the data grid that used to update the appropriate cells in the pivot table.
* * `allowDeleting`: Allows you to delete the existing record from the data grid that used to update the appropriate cells in the pivot table.
* * `allowCommandColumns`: Allows an additional column appended in the data grid layout holds the command buttons to perform the CRUD operations to edit,
* delete, and update the raw items to the data grid that used to update the appropriate cells in the pivot table.
* * `mode`: Allow options for performing CRUD operations with different modes in the data grid that used to update the appropriate cells in the pivot table.
* The available modes are normal, batch and dialog. **Normal** mode is enabled for CRUD operations in the data grid by default.
* * `allowEditOnDblClick`: Allows you to restrict CRUD operations by double-clicking the appropriate value cell in the pivot table.
* * `showConfirmDialog`: Allows you to show the confirmation dialog to save and discard CRUD operations performed in the data grid that used to update the appropriate cells in the pivot table.
* * `showDeleteConfirmDialog`: Allows you to show the confirmation dialog to delete any records from the data grid.
*
* > This feature is applicable only for the relational data source.
*/
var CellEditSettings = /** @class */ (function (_super) {
__extends(CellEditSettings, _super);
function CellEditSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(false)
], CellEditSettings.prototype, "allowAdding", void 0);
__decorate([
Property(false)
], CellEditSettings.prototype, "allowEditing", void 0);
__decorate([
Property(false)
], CellEditSettings.prototype, "allowDeleting", void 0);
__decorate([
Property(false)
], CellEditSettings.prototype, "allowCommandColumns", void 0);
__decorate([
Property(false)
], CellEditSettings.prototype, "allowInlineEditing", void 0);
__decorate([
Property('Normal')
], CellEditSettings.prototype, "mode", void 0);
__decorate([
Property(true)
], CellEditSettings.prototype, "allowEditOnDblClick", void 0);
__decorate([
Property(true)
], CellEditSettings.prototype, "showConfirmDialog", void 0);
__decorate([
Property(false)
], CellEditSettings.prototype, "showDeleteConfirmDialog", void 0);
return CellEditSettings;
}(ChildProperty));
export { CellEditSettings };
/**
* Allow options for setting the visibility of hyperlink based on specific condition. The options available here are as follows:
* * `measure`: Allows you to specify the value field caption to get visibility of hyperlink option for specific measure.
* * `condition`: Allows you to choose the operator type such as equals, greater than, less than, etc.
* * `value1`: Allows you to set the start value.
* * `value2`: Allows you to set the end value. This option will be used by default when the operator **Between** and **NotBetween** is chosen to apply.
*/
var ConditionalSettings = /** @class */ (function (_super) {
__extends(ConditionalSettings, _super);
function ConditionalSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property()
], ConditionalSettings.prototype, "measure", void 0);
__decorate([
Property()
], ConditionalSettings.prototype, "label", void 0);
__decorate([
Property('NotEquals')
], ConditionalSettings.prototype, "conditions", void 0);
__decorate([
Property()
], ConditionalSettings.prototype, "value1", void 0);
__decorate([
Property()
], ConditionalSettings.prototype, "value2", void 0);
return ConditionalSettings;
}(ChildProperty));
export { ConditionalSettings };
/**
* Allow a set of options to display a hyperlink to link data for individual cells that are shown in the pivot table.
* These options allow you to enable a separate hyperlink for row headers, column headers, value cells, and summary cells in the `hyperlinkSettings` class.
* The options available are:
* * `showHyperlink`: Allows you to set the visibility of hyperlink in all cells.
* * `showRowHeaderHyperlink`: Allows you to set the visibility of hyperlink in row headers.
* * `showColumnHeaderHyperlink`: Allows you to set the visibility of hyperlink in column headers.
* * `showValueCellHyperlink`: Allows you to set the visibility of hyperlink in value cells.
* * `showSummaryCellHyperlink`: Allows you to set the visibility of hyperlink in summary cells.
* * `headerText`: Allows you to set the visibility of hyperlink based on header text.
* * `conditionalSettings`: Allows you to set the visibility of hyperlink based on specific condition.
* * `cssClass`: Allows you to add CSS class name to the hyperlink options.
*
* > By default, the hyperlink options are disabled for all cells in the pivot table.
*/
var HyperlinkSettings = /** @class */ (function (_super) {
__extends(HyperlinkSettings, _super);
function HyperlinkSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(false)
], HyperlinkSettings.prototype, "showHyperlink", void 0);
__decorate([
Property(false)
], HyperlinkSettings.prototype, "showRowHeaderHyperlink", void 0);
__decorate([
Property(false)
], HyperlinkSettings.prototype, "showColumnHeaderHyperlink", void 0);
__decorate([
Property(false)
], HyperlinkSettings.prototype, "showValueCellHyperlink", void 0);
__decorate([
Property(false)
], HyperlinkSettings.prototype, "showSummaryCellHyperlink", void 0);
__decorate([
Collection([], ConditionalSettings)
], HyperlinkSettings.prototype, "conditionalSettings", void 0);
__decorate([
Property()
], HyperlinkSettings.prototype, "headerText", void 0);
__decorate([
Property('')
], HyperlinkSettings.prototype, "cssClass", void 0);
return HyperlinkSettings;
}(ChildProperty));
export { HyperlinkSettings };
/**
* Allows you to configure page information such as page size and current page details for each axis in order to display the pivot table with a specific page when paging.
*/
var PageSettings = /** @class */ (function (_super) {
__extends(PageSettings, _super);
function PageSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(5)
], PageSettings.prototype, "columnPageSize", void 0);
__decorate([
Property(5)
], PageSettings.prototype, "rowPageSize", void 0);
__decorate([
Property(1)
], PageSettings.prototype, "currentColumnPage", void 0);
__decorate([
Property(1)
], PageSettings.prototype, "currentRowPage", void 0);
return PageSettings;
}(ChildProperty));
export { PageSettings };
/**
* Allows a set of options for customizing the paging UI with a variety of settings such as UI position, template and visibility to a specific axis info such as page size, paging data.
* > To use this option, it requires the property `enablePaging` to be true.
*/
var PagerSettings = /** @class */ (function (_super) {
__extends(PagerSettings, _super);
function PagerSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Bottom')
], PagerSettings.prototype, "position", void 0);
__decorate([
Property(false)
], PagerSettings.prototype, "isInversed", void 0);
__decorate([
Property(true)
], PagerSettings.prototype, "showRowPager", void 0);
__decorate([
Property(true)
], PagerSettings.prototype, "showColumnPager", void 0);
__decorate([
Property(true)
], PagerSettings.prototype, "showRowPageSize", void 0);
__decorate([
Property(true)
], PagerSettings.prototype, "showColumnPageSize", void 0);
__decorate([
Property([10, 50, 100, 200])
], PagerSettings.prototype, "rowPageSizes", void 0);
__decorate([
Property([5, 10, 20, 50, 100])
], PagerSettings.prototype, "columnPageSizes", void 0);
__decorate([
Property(false)
], PagerSettings.prototype, "enableCompactView", void 0);
__decorate([
Property()
], PagerSettings.prototype, "template", void 0);
return PagerSettings;
}(ChildProperty));
export { PagerSettings };
/**
* Allow options to configure the view port as either pivot table or pivot chart or both table and chart. The options available are:
* * `view`: Allows you to choose the view port as either pivot table or pivot chart or both table and chart.
* * `primary`: Allows you to set the primary view to be either pivot table or pivot chart. To use this option, it requires the property `view` to be **Both**.
*/
var DisplayOption = /** @class */ (function (_super) {
__extends(DisplayOption, _super);
function DisplayOption() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property('Table')
], DisplayOption.prototype, "view", void 0);
__decorate([
Property('Table')
], DisplayOption.prototype, "primary", void 0);
return DisplayOption;
}(ChildProperty));
export { DisplayOption };
/**
* Represents a class that allows defining values for options relating to the virtual scrolling experience in the pivot table.
*/
var VirtualScrollSettings = /** @class */ (function (_super) {
__extends(VirtualScrollSettings, _super);
function VirtualScrollSettings() {
return _super !== null && _super.apply(this, arguments) || this;
}
__decorate([
Property(false)
], VirtualScrollSettings.prototype, "allowSinglePage", void 0);
return VirtualScrollSettings;
}(ChildProperty));
export { VirtualScrollSettings };
/**
* Represents the PivotView component.
* ```html
* <div id="PivotView"></div>
* <script>
* var pivotviewObj = new PivotView({ enableGroupingBar: true });
* pivotviewObj.appendTo("#pivotview");
* </script>
* ```
*/
var PivotView = /** @class */ (function (_super) {
__extends(PivotView, _super);
/**
* Constructor for creating the widget
*
* @param {PivotViewModel} options - options.
* @param {string|HTMLElement} element - element.
*/
function PivotView(options, element) {
var _this_1 = _super.call(this, options, element) || this;
/** @hidden */
_this_1.verticalScrollScale = 1;
/** @hidden */
_this_1.horizontalScrollScale = 1;
/** @hidden */
_this_1.scrollerBrowserLimit = 8000000;
/** @hidden */
_this_1.lastSortInfo = {};
/** @hidden */
_this_1.lastFilterInfo = {};
/** @hidden */
_this_1.lastAggregationInfo = {};
/** @hidden */
_this_1.lastCalcFieldInfo = {};
/** @hidden */
_this_1.isScrolling = false;
/** @hidden */
_this_1.allowEngineExport = false;
/** @hidden */
_this_1.isInitial = true;
_this_1.shiftLockedPos = [];
_this_1.savedSelectedCellsPos = [];
_this_1.cellSelectionPos = [];
_this_1.isPopupClicked = false;
_this_1.isMouseDown = false;
_this_1.isMouseUp = false;
_this_1.fieldsType = {};
_this_1.remoteData = [];
_this_1.defaultItems = {};
_this_1.isCellBoxMultiSelection = false;
_this_1.isBlobData = false;
/** @hidden */
_this_1.gridCellCollection = {};
/** @hidden */
_this_1.rowRangeSelection = { enable: false, startIndex: 0, endIndex: 0 };
/** @hidden */
_this_1.isStaticRefresh = false;
/** @hidden */
_this_1.isStaticFieldList = false;
/** @hidden */
_this_1.resizeInfo = {};
/** @hidden */
_this_1.scrollPosObject = {
vertical: 0, horizontal: 0, verticalSection: 0,
horizontalSection: 0, top: 0, left: 0, scrollDirection: { direction: '', position: 0 }
};
/** @hidden */
_this_1.pivotColumns = [];
/** @hidden */
_this_1.totColWidth = 0;
/** @hidden */
_this_1.posCount = 0;
/** @hidden */
_this_1.isModified = false;
/** @hidden */
_this_1.isInitialRendering = false;
_this_1.needsID = true;
_this_1.pivotRefresh = Component.prototype.refresh;
_this_1.request = typeof window !== 'undefined' ? new XMLHttpRequest() : null;
/** @hidden */
_this_1.isServerWaitingPopup = false;
/** @hidden */
_this_1.actionObj = {};
/** @hidden */
_this_1.defaultFieldListOrder = 'None';
/** @hidden */
_this_1.destroyEngine = false;
_this_1.pivotView = _this_1;
setValue('mergePersistData', _this_1.mergePersistPivotData, _this_1);
return _this_1;
}
PivotView_1 = PivotView;
/**
* To provide the array of modules needed for control rendering
*
* @returns {ModuleDeclaration[]} - return.
* @hidden
*/
PivotView.prototype.requiredModules = function () {
var modules = [];
if (this.showGroupingBar) {
modules.push({ args: [this], member: 'groupingBar' });
}
if (this.allowConditionalFormatting) {
modules.push({ args: [this], member: 'conditionalFormatting' });
}
if (this.allowNumberFormatting) {
modules.push({ args: [this], member: 'numberFormatting' });
}
if (this.allowCalculatedField) {
modules.push({ args: [this], member: 'calculatedField' });
}
if (this.showToolbar && (this.toolbar.length > 0 || this.toolbarTemplate)) {
modules.push({ args: [this], member: 'toolbar' });
}
if (this.showFieldList) {
modules.push({ args: [this], member: 'fieldList' });
}
if (this.allowExcelExport) {
modules.push({ args: [this], member: 'excelExport' });
}
if (this.allowPdfExport) {
modules.push({ args: [this], member: 'pdfExport' });
}
if (this.enableVirtualization) {
modules.push({ args: [this], member: 'virtualscroll' });
}
if (this.allowGrouping) {
modules.push({ args: [this], member: 'grouping' });
}
if (this.allowDrillThrough || (this.editSettings && this.editSettings.allowEditing)) {
modules.push({ args: [this], member: 'drillThrough' });
}
if (this.enablePaging) {
modules.push({ args: [this], member: 'pager' });
}
return modules;
};
/**
*
* For internal use only - Initializing internal properties;
*
* @private
*/
PivotView.prototype.preRender = function () {
if (this.dataSourceSettings && this.dataSourceSettings.providerType === 'SSAS') {
this.dataType = 'olap';
this.olapEngineModule = new OlapEngine();
}
else {
this.dataType = 'pivot';
this.engineModule = new PivotEngine();
}
this.isAdaptive = Browser.isDevice;
if (Browser.isIE || Browser.info.name === 'edge') {
this.scrollerBrowserLimit = 1500000;
}
else if (Browser.info.name === 'chrome') {
this.scrollerBrowserLimit = 15000000;
}
this.isTouchMode = closest(this.element, 'e-bigger') ? true : false;
this.initProperties();
this.renderToolTip();
this.keyboardModule = new KeyboardInteraction(this);
this.contextMenuModule = new PivotContextMenu(this);
this.globalize = new Internationalization(this.locale);
if (this.showFieldList || this.showGroupingBar || this.allowNumberFormatting || this.allowCalculatedField ||
(this.toolbar && this.showToolbar) || this.allowGrouping || this.gridSettings.contextMenuItems || this.allowDrillThrough) {
this.commonModule = new Common(this);
}
if (this.chartSettings.enableExport && (this.displayOption.view === 'Both' || this.displayOption.view === 'Chart')) {
this.chartExportModule = new ChartExport(this);
}
this.defaultLocale = {
applyToGrandTotal: 'Apply to Grand Total',
grandTotal: 'Grand Total',
total: 'Total',
value: 'Value',
noValue: 'No value',
row: 'Row',
column: 'Column',
collapse: 'Collapse',
expand: 'Expand',
rowAxisPrompt: 'Drop row here',
columnAxisPrompt: 'Drop column here',
valueAxisPrompt: 'Drop value here',
filterAxisPrompt: 'Drop filter here',
filter: 'Filter',
filtered: 'Filtered',
sort: 'Sort',
filters: 'Filters',
rows: 'Rows',
columns: 'Columns',
values: 'Values',
close: 'Close',
cancel: 'Cancel',
delete: 'Delete',
CalculatedField: 'Calculated Field',
createCalculatedField: 'Create Calculated Field',
fieldName: 'Enter the field name',
error: 'Error',
invalidFormula: 'Invalid formula.',
dropText: 'Example: ("Sum(Order_Count)" + "Sum(In_Stock)") * 250',
dropTextMobile: 'Add fields and edit formula here.',
dropAction: 'Calculated field cannot be place in any other region except value axis.',
alert: 'Alert',
warning: 'Warning',
ok: 'OK',
search: 'Search',
drag: 'Drag',
remove: 'Remove',
allFields: 'All Fields',
formula: 'Formula',
addToRow: 'Add to Row',
addToColumn: 'Add to Column',
addToValue: 'Add to Value',
addToFilter: 'Add to Filter',
emptyData: 'No records to display',
fieldExist: 'A field already exists in this name. Please enter a different name.',
confirmText: 'A calculation field already exists in this name. Do you want to replace it?',
noMatches: 'No matches',
format: 'Summaries values by',
edit: 'Edit',
clear: 'Clear',
sortAscending: 'Sort ascending order',
sortDescending: 'Sort descending order',
sortNone: 'Sort data order',
clearCalculatedField: 'Clear edited field info',
editCalculatedField: 'Edit calculated field',
formulaField: 'Drag and drop fields to formula',
dragField: 'Drag field to formula',
clearFilter: 'Clear',
by: 'by',
all: 'All',
multipleItems: 'Multiple items',
member: 'Member',
label: 'Label',
date: 'Date',
enterValue: 'Enter value',
chooseDate: 'Enter date',
Before: 'Before',
BeforeOrEqualTo: 'Before Or Equal To',
After: 'After',
AfterOrEqualTo: 'After Or Equal To',
labelTextContent: 'Show the items for which the label',
dateTextContent: 'Show the items for which the date',
valueTextContent: 'Show the items for which',
Equals: 'Equals',
DoesNotEquals: 'Does Not Equal',
BeginWith: 'Begins With',
DoesNotBeginWith: 'Does Not Begin With',
EndsWith: 'Ends With',
DoesNotEndsWith: 'Does Not End With',
Contains: 'Contains',
DoesNotContains: 'Does Not Contain',
GreaterThan: 'Greater Than',
GreaterThanOrEqualTo: 'Greater Than Or Equal To',
LessThan: 'Less Than',
LessThanOrEqualTo: 'Less Than Or Equal To',
Between: 'Between',
NotBetween: 'Not Between',
And: 'and',
Sum: 'Sum',
Count: 'Count',
DistinctCount: 'Distinct Count',
Product: 'Product',
Avg: 'Avg',
Median: 'Median',
Min: 'Min',
SampleVar: 'Sample Var',
PopulationVar: 'Population Var',
RunningTotals: 'Running Totals',
Max: 'Max',
Index: 'Index',
SampleStDev: 'Sample StDev',
PopulationStDev: 'Population StDev',
PercentageOfRowTotal: '% of Row Total',
PercentageOfParentTotal: '% of Parent Total',
PercentageOfParentColumnTotal: '% of Parent Column Total',
PercentageOfParentRowTotal: '% of Parent Row Total',
DifferenceFrom: 'Difference From',
PercentageOfDifferenceFrom: '% of Difference From',
PercentageOfGrandTotal: '% of Grand Total',
PercentageOfColumnTotal: '% of Column Total',
MoreOption: 'More...',
NotEquals: 'Not Equals',
AllValues: 'All Values',
conditionalFormatting: 'Conditional Formatting',
apply: 'Apply',
condition: 'Add Condition',
formatLabel: 'Format',
valueFieldSettings: 'Value field settings',
baseField: 'Base field',
baseItem: 'Base item',
summarizeValuesBy: 'Summarize values by',
sourceName: 'Field name :',
sourceCaption: 'Field caption',
example: 'e.g:',
editorDataLimitMsg: ' more items. Search to refine further.',
details: 'Details',
manageRecords: 'Manage Records',
Years: 'Years',
Quarters: 'Quarters',
Months: 'Months',
Days: 'Days',
Hours: 'Hours',
Minutes: 'Minutes',
Seconds: 'Seconds',
save: 'Save a report',
new: 'Create a new report',
load: 'Load',
saveAs: 'Save as current report',
rename: 'Rename a current report',
deleteReport: 'Delete a current report',
export: 'Export',
subTotals: 'Sub totals',
grandTotals: 'Grand totals',
reportName: 'Report Name :',
pdf: 'PDF',
excel: 'Excel',
csv: 'CSV',
png: 'PNG',
jpeg: 'JPEG',
svg: 'SVG',
mdxQuery: 'MDX Query',
showSubTotals: 'Show subtotals',
doNotShowSubTotals: 'Do not show subtotals',
showSubTotalsRowsOnly: 'Show subtotals rows only',
showSubTotalsColumnsOnly: 'Show subtotals columns only',
showGrandTotals: 'Show grand totals',
doNotShowGrandTotals: 'Do not show grand totals',
showGrandTotalsRowsOnly: 'Show grand totals rows only',
showGrandTotalsColumnsOnly: 'Show grand totals columns only',
fieldList: 'Show fieldlist',
grid: 'Show table',
toolbarFormatting: 'Conditional formatting',
chart: 'Chart',
reportMsg: 'Please enter valid report name!!!',
reportList: 'Report list',
removeConfirm: 'Are you sure you want to delete this report?',
emptyReport: 'No reports found!!',
bar: 'Bar',
pie: 'Pie',
funnel: 'Funnel',
doughnut: 'Doughnut',
pyramid: 'Pyramid',
stackingcolumn: 'Stacked Column',
stackingarea: 'Stacked Area',
stackingbar: 'Stacked Bar',
stackingline: 'Stacked Line',
stepline: 'Step Line',
steparea: 'Step Area',
splinearea: 'Spline Area',
spline: 'Spline',
stackingcolumn100: '100% Stacked Column',
stackingbar100: '100% Stacked Bar',
stackingarea100: '100% Stacked Area',
stackingline100: '100% Stacked Line',
bubble: 'Bubble',
pareto: 'Pareto',
radar: 'Radar',
line: 'Line',
area: 'Area',
scatter: 'Scatter',
polar: 'Polar',
of: 'of',
emptyFormat: 'No format found!!!',
emptyInput: 'Enter a value',
newReportConfirm: 'Do you want to save the changes to this report?',
emptyReportName: 'Enter a report name',
qtr: 'Qtr',
null: 'null',
undefined: 'undefined',
groupOutOfRange: 'Out of Range',
fieldDropErrorAction: 'The field you are moving cannot be placed in that area of the report',
aggregate: 'Aggregate',
drillThrough: 'Drill Through',
ascending: 'Ascending',
descending: 'Descending',
number: 'Number',
currency: 'Currency',
percentage: 'Percentage',
formatType: 'Format Type',
customText: 'Currency Symbol',
symbolPosition: 'Symbol Position',
left: 'Left',
right: 'Right',
grouping: 'Grouping',
true: 'True',
false: 'False',
decimalPlaces: 'Decimal Places',
numberFormat: 'Number Formatting',
memberType: 'Field Type',
formatString: 'Format',
expressionField: 'Expression',
customFormat: 'Enter custom format string',
numberFormatString: 'Example: C, P, 0000 %, ###0.##0#, etc.',
selectedHierarchy: 'Parent Hierarchy',
olapDropText: 'Example: [Measures].[Order Quantity] + ([Measures].[Order Quantity] * 0.10)',
Percent: 'Percent',
Currency: 'Currency',
Custom: 'Custom',
Measure: 'Measure',
Dimension: 'Dimension',
Standard: 'Standard',
blank: '(Blank)',
fieldTooltip: 'Drag and drop fields to create an expression. ' +
'And, if you want to edit the existing calculated fields! ' +
'You can achieve it by simply selecting the field under "Calculated Members".',
fieldTitle: 'Field Name',
QuarterYear: 'Quarter Year',
drillError: 'Cannot show the raw items of calculated fields.',
caption: 'Field Caption',
copy: 'Copy',
defaultReport: 'Sample Report',
customFormatString: 'Custom Format',
invalidFormat: 'Invalid Format.',
group: 'Group',
unGroup: 'Ungroup',
invalidSelection: 'Cannot group that selection.',
groupName: 'Enter the caption to display in header',
captionName: 'Enter the caption for group field',
selectedItems: 'Selected items',
groupFieldCaption: 'Field caption',
groupTitle: 'Group name',
startAt: 'Starting at',
endAt: 'Ending at',
groupBy: 'Interval by',
selectGroup: 'Select groups',
multipleAxes: 'Multiple Axis',
showLegend: 'Show Legend',
exit: 'Exit',
chartTypeSettings: 'Chart Type Settings',
ChartType: 'Chart Type',
yes: 'Yes',
no: 'No',
numberFormatMenu: 'Number Formatting...',
conditionalFormattingMenu: 'Conditional Formatting...',
removeCalculatedField: 'Are you sure you want to delete this calculated field?',
replaceConfirmBefore: 'A report named ',
replaceConfirmAfter: ' already exists. Do you want to replace it?',
invalidJSON: 'Invalid JSON data',
invalidCSV: 'Invalid CSV data',
stacked: 'Stacked',
single: 'Single',
combined: 'Combined',
multipleAxisMode: 'Multiple Axis Mode',
grandTotalPosition: 'Grand totals position',
top: 'Top',
bottom: 'Bottom',
None: 'None',
rowPage: 'Row pager',
rowPerPage: 'Rows per page',
columnPage: 'Column pager',
columnPerPage: 'Columns per page',
goToFirstPage: 'Go to first page',
goToPreviousPage: 'Go to previous page',
goToNextPage: 'Go to next page',
goToLastPage: 'Go to last page',
subTotalPosition: 'Subtotals position',
auto: 'Auto',
loading: 'Loading...',
add: 'Add'
};
this.localeObj = new L10n(this.getModuleName(), this.defaultLocale, this.locale);
this.renderContextMenu();
this.isDragging = false;
this.pivotDeferLayoutUpdate = isNullOrUndefined(this.pivotDeferLayoutUpdate) ? this.allowDeferLayoutUpdate :
this.pivotDeferLayoutUpdate;
this.addInternalEvents();
//setCurrencyCode(this.currencyCode);
};
PivotView.prototype.onBeforeTooltipOpen = function (args) {
args.element.classList.add('e-pivottooltipwrap');
};
PivotView.prototype.renderToolTip = function () {
if (this.showTooltip) {
if (this.tooltipTemplate) {
this.tooltip = new Tooltip({
target: 'td.e-valuescontent',
cssClass: 'e-pivottooltiptemplate' + (this.cssClass ? (' ' + this.cssClass) : ''),
showTipPointer: false,
position: 'BottomRight',
mouseTrail: true,
enableRtl: this.enableRtl,
locale: this.locale,
enableHtmlSanitizer: this.enableHtmlSanitizer,
beforeRender: this.setToolTip.bind(this),
beforeOpen: this.onBeforeTooltipOpen
});
}
else {
this.tooltip = new Tooltip({
target: 'td.e-valuescontent',
cssClass: this.cssClass,
showTipPointer: false,
position: 'BottomRight',
mouseTrail: true,
enableRtl: this.enableRtl,
locale: this.locale,
enableHtmlSanitizer: this.enableHtmlSanitizer,
beforeRender: this.setToolTip.bind(this),
beforeOpen: this.onBeforeTooltipOpen
});
}
this.tooltip.isStringTemplate = true;
this.tooltip.appendTo(this.element);
}
else if (this.tooltip) {
this.tooltip.destroy();
}
};
/** @hidden */
PivotView.prototype.renderContextMenu = function () {
if (this.gridSettings.contextMenuItems || (this.allowGrouping && this.dataType === 'pivot')) {
var conmenuItems = [];
var groupItems = [];
var customItems = [];
var exportItems = [];
var aggItems = [];
var expItems = [];
var aggregateItems = [];
if (this.gridSettings.contextMenuItems) {
for (var _i = 0, _a = this.gridSettings.contextMenuItems; _i < _a.length; _i++) {
var item = _a[_i];
if (typeof item === 'string' && this.getDefaultItems().indexOf(item) !== -1) {
if (item.toString().toLowerCase().indexOf('aggregate') !== -1 && this.dataType === 'pivot') {
aggregateItems = [
{ text: this.localeObj.getConstant('Sum') }
];
var aggregateGroup = this.buildDefaultItems('Aggregate');
aggregateGroup.items = aggregateItems;
aggItems.push(aggregateGroup);
}
else if (item.toString().toLowerCase().indexOf('export') !== -1) {
exportItems.push(this.buildDefaultItems(item));
}
else {
conmenuItems.push(this.buildDefaultItems(item));
}
}
else if (typeof item !== 'string') {
customItems.push(item);
}
}
}
if (this.allowGrouping && this.dataType === 'pivot') {
if (!this.getFieldByID(this.element.id + '_custom_group', this.gridSettings.contextMenuItems)) {
groupItems.push(this.buildDefaultItems('Group'));
}
if (!this.getFieldByID(this.element.id + '_custom_ungroup', this.gridSettings.contextMenuItems)) {
groupItems.push(this.buildDefaultItems('Ungroup'));
}
}
if (exportItems.length > 0) {
var exportGroupItems = this.buildDefaultItems('export');
exportGroupItems.items = exportItems;
expItems.push(exportGroupItems);
}
var contextMenuItems = [];
Array.prototype.push.apply(contextMenuItems, aggItems);
Array.prototype.push.apply(contextMenuItems, conmenuItems);
Array.prototype.push.apply(contextMenuItems, groupItems);
Array.prototype.push.apply(contextMenuItems, expItems);
Array.prototype.push.apply(contextMenuItems, customItems);
this.setProperties({ gridSettings: { contextMenuItems: contextMenuItems } }, true);
}
};
PivotView.prototype.getFieldByID = function (id, fields) {
return new DataManager({ json: fields }).executeLocal(new Query().where('id', 'equal', id))[0];
};
/**
*
* @hidden
*
*/
PivotView.prototype.getAllSummaryType = function () {
return ['Sum', 'Count', 'DistinctCount', 'Product', 'Min', 'Max', 'Avg', 'Median', 'Index',
'PopulationVar', 'SampleVar', 'PopulationStDev', 'SampleStDev', 'RunningTotals', 'PercentageOfGrandTotal',
'PercentageOfColumnTotal', 'PercentageOfRowTotal', 'PercentageOfParentColumnTotal', 'PercentageOfParentRowTotal',
'DifferenceFrom', 'PercentageOfDifferenceFrom', 'PercentageOfParentTotal'];
};
PivotView.prototype.getDefaultItems = function () {
return ['Drillthrough', 'Expand',
'Collapse', 'Pdf Export', 'Excel Export', 'Csv Export', 'Sort Ascending', 'Sort Descending',
'Aggregate', 'CalculatedField'];
};
PivotView.prototype.buildDefaultItems = function (item) {
var menuItem;
switch (item) {
case 'Aggregate':
menuItem = {
text: this.localeObj.getConstant('aggregate'), target: 'th.e-valuesheader,td.e-valuescontent,.e-stot.e-rowsheader',
id: this.element.id + '_aggregate'
};
break;
case 'CalculatedField':
menuItem = {
text: this.localeObj.getConstant('CalculatedField'), target: 'td.e-valuescontent',
id: this.element.id + '_CalculatedField'
};
break;
case 'Drillthrough':
menuItem = {
text: this.localeObj.getConstant('drillThrough'), target: 'td.e-valuescontent',
id: this.element.id + '_drillthrough_menu', iconCss: cls.PIVOTVIEW_GRID + ' ' + cls.ICON
};
break;
case 'export':
menuItem = {
text: this.localeObj.getConstant('export'), target: 'td.e-valuescontent',
id: this.element.id + '_exporting', iconCss: cls.PIVOTVIEW_EXPORT + ' ' + cls.ICON
};
break;
case 'Pdf Export':
menuItem = {
text: this.localeObj.getConstant('pdf'), id: this.element.id + '_pdf',
iconCss: cls.GRID_PDF_EXPORT + ' ' + cls.ICON
};
break;
case 'Excel Export':
menuItem = {
text: this.localeObj.getConstant('excel'), id: this.element.id + '_excel',
iconCss: cls.GRID_EXCEL_EXPORT + ' ' + cls.ICON
};
break;
case 'Csv Export':
menuItem = {
text: this.localeObj.getConstant('csv'), id: this.element.id + '_csv',
iconCss: cls.GRID_CSV_EXPORT + ' ' + cls.ICON
};
break;
case 'Expand':
menuItem = {
text: this.localeObj.getConstant('expand'), target: 'td.e-rowsheader,.e-columnsheader',
id: this.element.id + '_expand', iconCss: cls.PIVOTVIEW_EXPAND + ' ' + cls.ICON
};
break;
case 'Collapse':
menuItem = {
text: this.localeObj.getConstant('collapse'), target: 'td.e-rowsheader,.e-columnsheader',
id: this.element.id + '_collapse', iconCss: cls.PIVOTVIEW_COLLAPSE + ' ' + cls.ICON
};
break;
case 'Sort Ascending':
menuItem = {
text: this.localeObj.getConstant('ascending'), target: 'th.e-valuesheader,.e-stot',
id: this.element.id + '_sortasc', iconCss: cls.ICON_ASC + ' ' + cls.ICON
};
break;
case 'Sort Descending':
menuItem = {
text: this.localeObj.getConstant('descending'), target: 'th.e-valuesheader,.e-stot',
id: this.element.id + '_sortdesc', iconCss: cls.ICON_DESC + ' ' + cls.ICON
};
break;
case 'Group':
menuItem = {
text: this.localeObj.getConstant('group'), target: 'td.e-rowsheader,.e-columnsheader',
id: this.element.id + '_custom_group', iconCss: cls.PIVOTVIEW_GROUP + ' ' + cls.ICON
};
break;
case 'Ungroup':
menuItem = {
text: this.localeObj.getConstant('unGroup'), target: 'td.e-rowsheader,.e-columnsheader',
id: this.element.id + '_custom_ungroup', iconCss: cls.PIVOTVIEW_UN_GROUP + ' ' + cls.ICON
};
break;
}
this.defaultItems[item] = {
text: menuItem.text, id: menuItem.id,
target: menuItem.target, iconCss: menuItem.iconCss
};
return this.defaultItems[item];
};
PivotView.prototype.initProperties = function () {
this.isTabular = this.gridSettings.layout === 'Tabular' ? true : false;
this.pivotRefresh = Component.prototype.refresh;
this.minHeight = isNullOrUndefined(this.minHeight) ? 300 : (this.minHeight < 10 ? 10 : this.minHeight);
this.isScrolling = false;
this.allowServerDataBinding = false;
this.isStaticRefresh = false;
this.setProperties({ pivotValues: [] }, true);
this.allowServerDataBinding = true;
this.scrollPosObject = {
vertical: 0, horizontal: 0, verticalSection: 0,
horizontalSection: 0, top: 0, left: 0, scrollDirection: { direction: '', position: 0 }
};
this.queryCellInfo = this.gridSettings.queryCellInfo ? this.gridSettings.queryCellInfo : undefined;
this.headerCellInfo = this.gridSettings.headerCellInfo ? this.gridSettings.headerCellInfo : undefined;
this.resizing = this.gridSettings.resizing ? this.gridSettings.resizing : undefined;
this.resizeStop = this.gridSettings.resizeStop ? this.gridSettings.resizeStop : undefined;
this.pdfHeaderQueryCellInfo = this.gridSettings.pdfHeaderQueryCellInfo ? this.gridSettings.pdfHeaderQueryCellInfo : undefined;
this.pdfQueryCellInfo = this.gridSettings.pdfQueryCellInfo ? this.gridSettings.pdfQueryCellInfo : undefined;
this.excelHeaderQueryCellInfo = this.gridSettings.excelHeaderQueryCellInfo ? this.gridSettings.excelHeaderQueryCellInfo : undefined;
this.excelQueryCellInfo = this.gridSettings.excelQueryCellInfo ? this.gridSettings.excelQueryCellInfo : undefined;
this.columnDragStart = this.gridSettings.columnDragStart ? this.gridSettings.columnDragStart : undefined;
this.columnDrag = this.gridSettings.columnDrag ? this.gridSettings.columnDrag : undefined;
this.columnDrop = this.gridSettings.columnDrop ? this.gridSettings.columnDrop : undefined;
this.beforeColumnsRender = this.gridSettings.columnRender ? this.gridSettings.columnRender : undefined;
this.selected = this.gridSettings.cellSelected ? this.gridSettings.cellSelected : undefined;
this.selecting = this.gridSettings.cellSelecting ? this.gridSettings.cellSelecting : undefined;
this.cellDeselected = this.gridSettings.cellDeselected ? this.gridSettings.cellDeselected : undefine