UNPKG

@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,228 lines 61.3 kB
import { createElement, addClass, removeClass, remove, EventHandler, isNullOrUndefined, getInstance } from '@syncfusion/ej2-base';
import { closest } from '@syncfusion/ej2-base';
import * as cls from '../../common/base/css-constant';
import * as events from '../../common/base/constant';
import { TreeView } from '@syncfusion/ej2-navigations';
import { Dialog } from '@syncfusion/ej2-popups';
import { MaskedTextBox, TextBox } from '@syncfusion/ej2-inputs';
import { PivotUtil } from '../../base/util';
import { DataManager, Predicate, Query } from '@syncfusion/ej2-data';
/**
 * Module to render Field List
 */
/** @hidden */
var TreeViewRenderer = /** @class */ (function () {
    /** Constructor for render module
     *
     * @param {PivotFieldList} parent - Instance of field list.
     */
    function TreeViewRenderer(parent) {
        this.selectedNodes = [];
        this.isSearching = false;
        this.parentIDs = [];
        this.isSpaceKey = false;
        this.olapFieldListData = [];
        this.parent = parent;
        this.addEventListener();
    }
    /**
     * Initialize the field list tree rendering
     *
     * @param {number} axis - Axis position.
     * @returns {void}
     * @private
     */
    TreeViewRenderer.prototype.render = function (axis) {
        this.parentElement = this.parent.dialogRenderer.parentElement;
        this.fieldListSort = this.parent.pivotGridModule ?
            this.parent.pivotGridModule.defaultFieldListOrder : this.parent.defaultFieldListOrder;
        this.fieldListSort = this.fieldListSort === 'Ascending' ? 'Ascend' :
            this.fieldListSort === 'Descending' ? 'Descend' : 'None';
        if (!this.parent.isAdaptive) {
            var fieldTable = createElement('div', {
                className: cls.FIELD_TABLE_CLASS + ' ' + (this.parent.dataType === 'olap' ? cls.OLAP_FIELD_TABLE_CLASS : '')
            });
            var treeHeader = createElement('div', {
                className: cls.FIELD_HEADER_CLASS,
                attrs: { title: this.parent.localeObj.getConstant('allFields') }
            });
            treeHeader.innerText = this.parent.localeObj.getConstant('allFields');
            var treeOuterDiv = createElement('div', {
                className: cls.FIELD_LIST_TREE_OUTER_DIV_CLASS + ' ' + cls.TREE_CONTAINER
            });
            this.treeViewElement = createElement('div', {
                id: this.parent.element.id + '_TreeView',
                className: cls.FIELD_LIST_CLASS + ' ' + (this.parent.dataType === 'olap' ? cls.OLAP_FIELD_LIST_CLASS : '')
            });
            var fieldHeaderWrappper = createElement('div', { className: cls.FIELD_HEADER_CONTAINER_CLASS });
            fieldHeaderWrappper.appendChild(treeHeader);
            fieldTable.appendChild(fieldHeaderWrappper);
            this.updateSortElements(fieldHeaderWrappper);
            if (this.parent.enableFieldSearching) {
                var searchWrapper = createElement('div', {
                    id: this.parent.element.id + '_SearchDiv', attrs: { 'tabindex': '-1' },
                    className: cls.FIELD_LIST_SEARCH_CLASS
                });
                var searchInput = createElement('input', { attrs: { 'type': 'text' } });
                searchWrapper.appendChild(searchInput);
                this.fieldSearch = new TextBox({
                    placeholder: this.parent.localeObj.getConstant('search'),
                    enableRtl: this.parent.enableRtl,
                    locale: this.parent.locale,
                    cssClass: cls.FIELD_LIST_SEARCH_INPUT_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
                    input: this.textChange.bind(this),
                    showClearButton: true
                });
                this.fieldSearch.isStringTemplate = true;
                this.fieldSearch.appendTo(searchInput);
                this.fieldSearch.addIcon('append', cls.FIELD_LIST_SEARCH_ICON_CLASS + ' ' + cls.ICON);
                var promptDiv = createElement('div', {
                    className: cls.EMPTY_MEMBER_CLASS + ' ' + cls.ICON_DISABLE
                });
                promptDiv.innerText = this.parent.localeObj.getConstant('noMatches');
                fieldTable.appendChild(searchWrapper);
                fieldTable.appendChild(promptDiv);
            }
            treeOuterDiv.appendChild(this.treeViewElement);
            fieldTable.appendChild(treeOuterDiv);
            this.parentElement.appendChild(fieldTable);
            if (this.parent.renderMode === 'Fixed') {
                var centerDiv = createElement('div', { className: cls.STATIC_CENTER_DIV_CLASS });
                var axisHeader = createElement('div', {
                    className: cls.STATIC_CENTER_HEADER_CLASS
                });
                axisHeader.innerText = this.parent.localeObj.getConstant('centerHeader');
                this.parentElement.appendChild(centerDiv);
                this.parentElement.appendChild(axisHeader);
            }
            this.renderTreeView();
        }
        else {
            this.renderTreeDialog(axis);
        }
    };
    TreeViewRenderer.prototype.updateSortElements = function (headerWrapper) {
        var options = { 'None': 'sortNone', 'Ascend': 'sortAscending', 'Descend': 'sortDescending' };
        var keys = Object.keys(options);
        for (var _i = 0, keys_1 = keys; _i < keys_1.length; _i++) {
            var option = keys_1[_i];
            var spanElement = createElement('span', {
                attrs: {
                    'tabindex': '0',
                    'aria-disabled': 'false',
                    'aria-label': 'Sort ' + option,
                    'data-sort': option,
                    'title': this.parent.localeObj.getConstant(options[option]),
                    'role': 'button'
                },
                className: cls.ICON + ' ' + 'e-sort-' + option.toLowerCase() + ' ' +
                    (this.fieldListSort === option ? 'e-selected' : '')
            });
            headerWrapper.appendChild(spanElement);
            this.unWireFieldListEvent(spanElement);
            this.wireFieldListEvent(spanElement);
        }
    };
    TreeViewRenderer.prototype.renderTreeView = function () {
        this.fieldTable = new TreeView({
            fields: { dataSource: this.getTreeData(), id: 'id', text: 'caption', isChecked: 'isSelected', parentID: 'pid', iconCss: 'spriteCssClass' },
            nodeChecked: this.nodeChecked.bind(this),
            nodeClicked: this.nodeStateChange.bind(this),
            keyPress: this.nodeStateChange.bind(this),
            cssClass: cls.FIELD_LIST_TREE_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
            showCheckBox: true,
            allowDragAndDrop: true,
            sortOrder: 'None',
            loadOnDemand: this.parent.dataType === 'olap' ? false : (this.parent.enableFieldSearching ? false : true),
            enableRtl: this.parent.enableRtl,
            locale: this.parent.locale,
            enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
            nodeDragStart: this.dragStart.bind(this),
            nodeDragStop: this.dragStop.bind(this),
            drawNode: this.updateTreeNode.bind(this),
            nodeExpanding: this.updateNodeIcon.bind(this),
            nodeCollapsed: this.updateNodeIcon.bind(this),
            nodeSelected: function (args) {
                removeClass([args.node], 'e-active');
                args.cancel = true;
            }
        });
        this.treeViewElement.innerHTML = '';
        this.fieldTable.isStringTemplate = true;
        this.fieldTable.isAngular = this.parent.isModalDialog;
        this.fieldTable.appendTo(this.treeViewElement);
        var dragEle = this.parent.renderMode === 'Fixed' ? this.parent.element : this.parentElement;
        if (!isNullOrUndefined(dragEle.querySelector('.' + cls.FIELD_LIST_CLASS))) {
            getInstance(dragEle.querySelector('.' + cls.FIELD_LIST_CLASS), TreeView)['dragObj']
                .enableAutoScroll = false;
        }
    };
    TreeViewRenderer.prototype.updateNodeIcon = function (args) {
        if (this.parent.dataType === 'olap') {
            if (args.node && args.node.querySelector('.e-list-icon') &&
                (args.node.querySelector('.e-list-icon').className.indexOf('e-folderCDB-icon') > -1)) {
                var node = args.node.querySelector('.e-list-icon');
                removeClass([node], 'e-folderCDB-icon');
                addClass([node], 'e-folderCDB-open-icon');
            }
            else if (args.node && args.node.querySelector('.e-list-icon') &&
                (args.node.querySelector('.e-list-icon').className.indexOf('e-folderCDB-open-icon') > -1)) {
                var node = args.node.querySelector('.e-list-icon');
                removeClass([node], 'e-folderCDB-open-icon');
                addClass([node], 'e-folderCDB-icon');
            }
        }
    };
    TreeViewRenderer.prototype.updateTreeNode = function (args) {
        var allowDrag = false;
        if (this.parent.dataType === 'olap') {
            allowDrag = this.updateOlapTreeNode(args);
        }
        else {
            if (args.nodeData.hasChildren) {
                allowDrag = false;
                args.node.querySelector('.' + cls.CHECKBOX_CONTAINER).style.display = 'none';
                addClass([args.node], cls.FIELD_TREE_PARENT);
            }
            else {
                allowDrag = true;
            }
        }
        if (!isNullOrUndefined(args.nodeData.pid)) {
            addClass([args.node], cls.FIELD_TREE_CHILD);
        }
        var liTextElement = args.node.querySelector('.' + cls.TEXT_CONTENT_CLASS);
        if (args.node.querySelector('.e-list-icon') && liTextElement) {
            var liIconElement = args.node.querySelector('.e-list-icon');
            liTextElement.insertBefore(liIconElement, args.node.querySelector('.e-list-text'));
        }
        if (allowDrag && !this.parent.isAdaptive) {
            var field = PivotUtil.getFieldInfo(args.nodeData.id, this.parent);
            allowDrag = false;
            var dragElement = createElement('span', {
                attrs: {
                    'tabindex': '-1',
                    title: (field.fieldItem ? field.fieldItem.allowDragAndDrop ?
                        this.parent.localeObj.getConstant('drag') : '' : this.parent.localeObj.getConstant('drag')),
                    'aria-disabled': 'false'
                },
                className: cls.ICON + ' ' + cls.DRAG_CLASS + ' ' + (field.fieldItem && (isNullOrUndefined(field.fieldItem.allowDragAndDrop) || field.fieldItem.allowDragAndDrop) ? '' : cls.DRAG_DISABLE_CLASS)
            });
            if (args.node.querySelector('.' + cls.CHECKBOX_CONTAINER) &&
                !args.node.querySelector('.cls.DRAG_CLASS') && liTextElement) {
                liTextElement.insertBefore(dragElement, args.node.querySelector('.' + cls.CHECKBOX_CONTAINER));
            }
        }
        if (args.node.querySelector('.' + cls.NODE_CHECK_CLASS)) {
            addClass([args.node.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);
        }
        if (this.parent.enableFieldSearching && this.isSearching && this.parent.dataType === 'pivot') {
            var liElement = args.node;
            for (var i = 0; i < this.nonSearchList.length; i++) {
                if (liElement.textContent === this.nonSearchList[i].textContent) {
                    addClass([liElement], cls.ICON_DISABLE);
                    break;
                }
                else {
                    if (liElement.innerText === this.nonSearchList[i].textContent) {
                        addClass([liElement], cls.ICON_DISABLE);
                        break;
                    }
                }
            }
        }
    };
    TreeViewRenderer.prototype.updateOlapTreeNode = function (args) {
        var allowDrag = false;
        if (this.parent.dataType === 'olap') {
            if (args.node && args.node.querySelector('.e-calcMemberGroupCDB,.e-measureGroupCDB-icon,.e-folderCDB-icon,.e-folderCDB-open-icon,.e-dimensionCDB-icon,.e-kpiCDB-icon')) {
                args.node.querySelector('.' + cls.CHECKBOX_CONTAINER).style.display = 'none';
            }
            if (args.node && args.node.querySelector('.e-list-icon') &&
                (args.node.querySelector('.e-list-icon').className.indexOf('e-level-members') > -1)) {
                if (this.parent.isAdaptive) {
                    args.node.querySelector('.' + cls.CHECKBOX_CONTAINER).style.display = 'none';
                }
                else {
                    args.node.querySelector('.' + cls.CHECKBOX_CONTAINER).style.visibility = 'hidden';
                }
            }
            if (args.node && (args.node.querySelector('.e-hierarchyCDB-icon,.e-attributeCDB-icon,.e-namedSetCDB-icon') ||
                args.node.querySelector('.e-measure-icon,.e-kpiGoal-icon,.e-kpiStatus-icon,.e-kpiTrend-icon,.e-kpiValue-icon') ||
                args.node.querySelector('.e-calc-measure-icon,.e-calc-dimension-icon'))) {
                if (args.node.querySelector('.e-measure-icon')) {
                    args.node.querySelector('.e-list-icon').style.display = 'none';
                    allowDrag = true;
                }
                else {
                    allowDrag = true;
                }
            }
        }
        else {
            allowDrag = true;
        }
        return allowDrag;
    };
    TreeViewRenderer.prototype.renderTreeDialog = function (axis) {
        var fieldListDialog = createElement('div', {
            id: this.parent.element.id + '_FieldListTreeView',
            className: cls.ADAPTIVE_FIELD_LIST_DIALOG_CLASS + ' ' + (this.parent.dataType === 'olap' ? 'e-olap-editor-dialog' : '')
        });
        this.parentElement.appendChild(fieldListDialog);
        this.fieldDialog = new Dialog({
            animationSettings: { effect: 'Fade' },
            allowDragging: false,
            header: this.parent.localeObj.getConstant('adaptiveFieldHeader'),
            content: this.createTreeView(this.getTreeData(axis)),
            isModal: true,
            visible: true,
            showCloseIcon: false,
            enableRtl: this.parent.enableRtl,
            enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
            locale: this.parent.locale,
            width: '320px',
            height: '350px',
            position: { X: 'center', Y: 'center' },
            buttons: [{
                    click: this.closeTreeDialog.bind(this),
                    isFlat: false,
                    buttonModel: {
                        cssClass: cls.CANCEL_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('cancel')
                    }
                }, {
                    click: this.onFieldAdd.bind(this),
                    isFlat: false,
                    buttonModel: {
                        cssClass: cls.OK_BUTTON_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''), content: this.parent.localeObj.getConstant('add'),
                        isPrimary: true
                    }
                }],
            closeOnEscape: false,
            cssClass: this.parent.cssClass,
            close: this.closeTreeDialog.bind(this),
            target: closest(this.parentElement, '.' + cls.WRAPPER_CLASS)
        });
        this.fieldDialog.isStringTemplate = true;
        this.fieldDialog.isAngular = this.parent.isModalDialog;
        this.fieldDialog.appendTo(fieldListDialog);
        // this.fieldDialog.element.querySelector('.e-dlg-header').innerText = this.parent.localeObj.getConstant('adaptiveFieldHeader');
    };
    TreeViewRenderer.prototype.createTreeView = function (treeData) {
        var editorTreeWrapper = createElement('div', {
            id: this.parent.element.id + 'EditorDiv',
            className: cls.EDITOR_TREE_WRAPPER_CLASS
        });
        var searchWrapper = createElement('div', {
            id: this.parent.element.id + '_SearchDiv', attrs: { 'tabindex': '-1' },
            className: cls.EDITOR_SEARCH_WRAPPER_CLASS
        });
        var editorSearch = createElement('input', { attrs: { 'type': 'text' } });
        searchWrapper.appendChild(editorSearch);
        var treeOuterDiv = createElement('div', { className: cls.FIELD_LIST_TREE_OUTER_DIV_CLASS });
        var treeViewContainer = createElement('div', {
            className: cls.EDITOR_TREE_CONTAINER_CLASS + ' ' + (this.parent.dataType === 'olap' ? 'e-olap-field-list-tree' : '')
        });
        editorTreeWrapper.appendChild(searchWrapper);
        this.editorSearch = new MaskedTextBox({
            showClearButton: true,
            placeholder: this.parent.localeObj.getConstant('search'),
            enableRtl: this.parent.enableRtl,
            locale: this.parent.locale,
            cssClass: cls.EDITOR_SEARCH_CLASS + (this.parent.cssClass ? (' ' + this.parent.cssClass) : ''),
            change: this.textChange.bind(this)
        });
        this.editorSearch.isStringTemplate = true;
        this.editorSearch.appendTo(editorSearch);
        var promptDiv = createElement('div', {
            className: cls.EMPTY_MEMBER_CLASS + ' ' + cls.ICON_DISABLE
        });
        promptDiv.innerText = this.parent.localeObj.getConstant('noMatches');
        editorTreeWrapper.appendChild(promptDiv);
        treeOuterDiv.appendChild(treeViewContainer);
        editorTreeWrapper.appendChild(treeOuterDiv);
        this.fieldTable = new TreeView({
            fields: { dataSource: treeData, id: 'id', text: 'caption', isChecked: 'isSelected', parentID: 'pid', iconCss: 'spriteCssClass' },
            showCheckBox: true,
            loadOnDemand: this.parent.dataType === 'olap' ? false : true,
            sortOrder: this.parent.dataType === 'olap' ? 'None' : 'Ascending',
            enableRtl: this.parent.enableRtl,
            locale: this.parent.locale,
            enableHtmlSanitizer: this.parent.enableHtmlSanitizer,
            cssClass: this.parent.cssClass,
            nodeChecked: this.nodeChecked.bind(this),
            nodeClicked: this.addNode.bind(this),
            keyPress: this.addNode.bind(this),
            drawNode: this.updateTreeNode.bind(this),
            nodeExpanding: this.updateNodeIcon.bind(this),
            nodeCollapsed: this.updateNodeIcon.bind(this),
            nodeSelected: function (args) {
                removeClass([args.node], 'e-active');
                args.cancel = true;
            }
        });
        this.fieldTable.isStringTemplate = true;
        this.fieldTable.isAngular = this.parent.isModalDialog;
        this.fieldTable.appendTo(treeViewContainer);
        return editorTreeWrapper;
    };
    TreeViewRenderer.prototype.textChange = function (e) {
        var _this = this;
        if (this.parent.dataType === 'olap') {
            if (e.value === '') {
                this.fieldTable.fields.dataSource = this.olapFieldListData;
                setTimeout(function () {
                    _this.fieldTable.collapseAll();
                });
                this.isSearching = false;
                this.promptVisibility(false);
            }
            else {
                this.fieldTable.fields.dataSource = this.performeSearching(e.value);
                setTimeout(function () {
                    _this.fieldTable.expandAll();
                });
                this.isSearching = true;
                this.promptVisibility(this.fieldTable.fields.dataSource.length === 0);
            }
        }
        else {
            this.parent.pivotCommon.eventBase.searchTreeNodes(e, this.fieldTable, true);
            var liList = [].slice.call(this.fieldTable.element.querySelectorAll('li'));
            var disabledList = [].slice.call(this.fieldTable.element.querySelectorAll('li.' + cls.ICON_DISABLE));
            this.promptVisibility(liList.length === disabledList.length);
            this.isSearching = disabledList.length > 0 ? true : false;
            this.nonSearchList = disabledList;
        }
    };
    TreeViewRenderer.prototype.promptVisibility = function (isPromptVisible) {
        var promptDiv;
        var treeOuterDiv;
        if (this.parent.isAdaptive) {
            promptDiv = this.fieldDialog.element.querySelector('.' + cls.EMPTY_MEMBER_CLASS);
        }
        else {
            promptDiv = this.parentElement.querySelector('.' + cls.EMPTY_MEMBER_CLASS);
            treeOuterDiv = this.parentElement.querySelector('.' + cls.TREE_CONTAINER);
        }
        if (isPromptVisible) {
            removeClass([promptDiv], cls.ICON_DISABLE);
            if (!this.parent.isAdaptive) {
                addClass([treeOuterDiv], cls.ICON_DISABLE);
                removeClass([promptDiv], cls.FIELD_LIST_TREE_OUTER_DIV_SEARCH_CLASS);
            }
        }
        else {
            addClass([promptDiv], cls.ICON_DISABLE);
            if (!this.parent.isAdaptive) {
                removeClass([treeOuterDiv], cls.ICON_DISABLE);
                addClass([promptDiv], cls.FIELD_LIST_TREE_OUTER_DIV_SEARCH_CLASS);
            }
        }
    };
    TreeViewRenderer.prototype.performeSearching = function (searchValue) {
        var _this = this;
        var dataManager = new DataManager(this.olapFieldListData);
        var filteredList = dataManager.executeLocal(new Query().where(new Predicate(this.fieldTable.fields.text, 'contains', searchValue, true)));
        var predicates = [];
        var filterId = new Set();
        filteredList.forEach(function (item) {
            if (item) {
                var parentItems = [];
                var childItems = [];
                if (item['pid']) {
                    parentItems = _this.getParentItems(dataManager, 'id', item['pid']);
                }
                if (item['hasChildren']) {
                    childItems = dataManager.executeLocal(new Query().where('pid', 'equal', item['id'], false));
                }
                var filteredItem = parentItems.concat([item]).concat(childItems);
                filteredItem.forEach(function (child) {
                    var childId = child['id'];
                    if (!filterId.has(childId)) {
                        filterId.add(childId);
                        predicates.push(new Predicate('id', 'equal', childId, false));
                    }
                });
            }
        });
        return predicates.length > 0 ? dataManager.executeLocal(new Query().where(Predicate.or.apply(Predicate, predicates))) : [];
    };
    TreeViewRenderer.prototype.getParentItems = function (dataManager, key, value) {
        var parentItems = dataManager.executeLocal(new Query().where(key, 'equal', value, false));
        if (parentItems && parentItems[0] && parentItems[0]['pid']) {
            parentItems = this.getParentItems(dataManager, key, parentItems[0]['pid']).concat(parentItems);
        }
        return parentItems;
    };
    TreeViewRenderer.prototype.dragStart = function (args) {
        var _this = this;
        if (args.event.target.classList.contains(cls.DRAG_CLASS) &&
            !args.event.target.classList.contains(cls.DRAG_DISABLE_CLASS)) {
            var fieldInfo = PivotUtil.getFieldInfo(args.draggedNode.getAttribute('data-uid'), this.parent);
            var dragEventArgs = {
                fieldName: fieldInfo.fieldName, fieldItem: fieldInfo.fieldItem, axis: fieldInfo.axis,
                dataSourceSettings: this.parent.dataSourceSettings, cancel: false
            };
            var control = this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
            control.trigger(events.fieldDragStart, dragEventArgs, function (observedArgs) {
                if (!observedArgs.cancel) {
                    _this.parent.isDragging = true;
                    addClass([args.draggedNode.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.SELECTED_NODE_CLASS);
                    var data = void 0;
                    if (_this.parent.dataType === 'olap') {
                        data = _this.parent.olapEngineModule.fieldList[args.draggedNode.getAttribute('data-uid')];
                    }
                    else {
                        data = _this.parent.engineModule.fieldList[args.draggedNode.getAttribute('data-uid')];
                    }
                    var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];
                    if (data && data.aggregateType === 'CalculatedField') {
                        for (var _i = 0, axis_1 = axis; _i < axis_1.length; _i++) {
                            var axisContent = axis_1[_i];
                            addClass([_this.parentElement.querySelector('.' + axisContent)], cls.NO_DRAG_CLASS);
                        }
                    }
                    var dragItem = args.clonedNode;
                    if (dragItem && (_this.parent.getModuleName() === 'pivotfieldlist' &&
                        _this.parent.renderMode) === 'Popup') {
                        dragItem.style.zIndex = (_this.parent.dialogRenderer.fieldListDialog.zIndex + 1).toString();
                    }
                }
                else {
                    _this.parent.isDragging = false;
                    args.cancel = true;
                }
            });
        }
        else {
            this.parent.isDragging = false;
            args.cancel = true;
        }
    };
    // private getFieldDragEventArgs(dragEventArgs: FieldDragStartEventArgs): FieldDragStartEventArgs | Deferred {
    //     let callbackPromise: Deferred = new Deferred();
    //     let control: PivotView | PivotFieldList = this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
    //     control.trigger(events.fieldDragStart, dragEventArgs, (observedArgs: FieldDragStartEventArgs) => {
    //         callbackPromise.resolve(observedArgs);
    //     });
    //     return callbackPromise;
    // }
    TreeViewRenderer.prototype.dragStop = function (args) {
        args.cancel = true;
        this.parent.isDragging = false;
        var axis = [cls.ROW_AXIS_CLASS, cls.COLUMN_AXIS_CLASS, cls.FILTER_AXIS_CLASS];
        for (var _i = 0, axis_2 = axis; _i < axis_2.length; _i++) {
            var axisElement = axis_2[_i];
            removeClass([this.parentElement.querySelector('.' + axisElement)], cls.NO_DRAG_CLASS);
        }
        removeClass([args.draggedNode.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.SELECTED_NODE_CLASS);
        if (this.parent.pivotCommon.filterDialog.dialogPopUp) {
            this.parent.pivotCommon.filterDialog.dialogPopUp.close();
        }
        var fieldName = args.draggedNodeData.id.toString();
        if (!this.isNodeDropped(args, fieldName)) {
            return;
        }
        var list = this.parent.pivotFieldList;
        var selectedNode = list[fieldName];
        this.parent.pivotCommon.dataSourceUpdate.control = this.parent.getModuleName() === 'pivotview' ? this.parent :
            (this.parent.isPopupView && this.parent.pivotGridModule ? this.parent.pivotGridModule
                : this.parent);
        if (this.parent.pivotCommon.nodeStateModified.onStateModified(args, fieldName)) {
            if (this.parent.isDeferLayoutUpdate || (this.parent.pivotGridModule && this.parent.pivotGridModule.pivotDeferLayoutUpdate)) {
                selectedNode.isSelected = true;
                this.updateDataSource();
            }
            else {
                this.parent.updateDataSource();
            }
            var parent_1 = this.parent;
            //setTimeout(() => {
            parent_1.axisFieldModule.render();
            //});
        }
    };
    TreeViewRenderer.prototype.isNodeDropped = function (args, targetID) {
        var isDropped = true;
        if (args.draggedNodeData.isChecked === 'true') {
            var target = this.getButton(targetID);
            var axisPanel = closest(target, '.' + cls.DROPPABLE_CLASS);
            var droppableElement = closest(args.target, '.' + cls.DROPPABLE_CLASS);
            if (target && axisPanel === droppableElement) {
                var pivotButtons = [].slice.call(axisPanel.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));
                var dropTarget = closest(args.target, '.' + cls.PIVOT_BUTTON_WRAPPER_CLASS);
                var sourcePosition = void 0;
                var dropPosition = -1;
                for (var i = 0, n = pivotButtons.length; i < n; i++) {
                    if (pivotButtons[i].id === target.id) {
                        sourcePosition = i;
                    }
                    if (dropTarget) {
                        var droppableButton = dropTarget.querySelector('.' + cls.PIVOT_BUTTON_CLASS);
                        if (pivotButtons[i].id === droppableButton.id) {
                            dropPosition = i;
                        }
                    }
                }
                if (sourcePosition === dropPosition || (sourcePosition === (pivotButtons.length - 1) && dropPosition === -1)) {
                    var parentElement = document.getElementById(this.parent.element.id + '_Container');
                    removeClass([].slice.call(parentElement.querySelectorAll('.' + cls.DROP_INDICATOR_CLASS)), cls.INDICATOR_HOVER_CLASS);
                    isDropped = false;
                }
            }
        }
        return isDropped;
    };
    TreeViewRenderer.prototype.getButton = function (fieldName) {
        var wrapperElement = document.getElementById(this.parent.element.id + '_Container');
        var pivotButtons = [].slice.call(wrapperElement.querySelectorAll('.' + cls.PIVOT_BUTTON_CLASS));
        var buttonElement;
        for (var i = 0, n = pivotButtons.length; i < n; i++) {
            if (pivotButtons[i].getAttribute('data-uid') === fieldName) {
                buttonElement = pivotButtons[i];
                break;
            }
        }
        return buttonElement;
    };
    TreeViewRenderer.prototype.nodeChecked = function (args) {
        if (this.isSpaceKey) {
            var node = closest(args.node, '.' + cls.TEXT_CONTENT_CLASS);
            if (!isNullOrUndefined(node)) {
                var li = closest(node, 'li');
                var id = li.getAttribute('data-uid');
                if (this.parent.isAdaptive) {
                    this.addNode(undefined, id, args.action === 'check', node);
                }
                else {
                    this.nodeStateChange(undefined, id, args.action === 'check', node);
                }
            }
        }
        this.isSpaceKey = false;
    };
    TreeViewRenderer.prototype.nodeStateChange = function (args, id, isChecked, node) {
        var _this = this;
        node = isNullOrUndefined(node) ? args.node : node;
        id = isNullOrUndefined(id) ? node.getAttribute('data-uid') : id;
        if (this.parent.pivotCommon.filterDialog.dialogPopUp) {
            this.parent.pivotCommon.filterDialog.dialogPopUp.close();
        }
        var list = this.parent.pivotFieldList;
        var selectedNode = list[id];
        if (!isNullOrUndefined(args)) {
            this.isSpaceKey = args.event.action && args.event.action === 'space';
            if (isNullOrUndefined(selectedNode) || node.classList.contains(cls.ICON_DISABLE) || (args.event.target &&
                (args.event.target.classList.contains(cls.COLLAPSIBLE) ||
                    args.event.target.classList.contains(cls.EXPANDABLE))) ||
                (args.event.action && args.event.action !== 'enter')) {
                return;
            }
            isChecked = false;
            var getNodeDetails = this.fieldTable.getNode(node);
            if (args.event && args.event.target &&
                !args.event.target.closest('.' + cls.CHECKBOX_CONTAINER)) {
                if (getNodeDetails.isChecked === 'true') {
                    this.fieldTable.uncheckAll([node]);
                    isChecked = false;
                }
                else {
                    this.fieldTable.checkAll([node]);
                    isChecked = true;
                }
            }
            else {
                isChecked = getNodeDetails.isChecked === 'true';
            }
        }
        var control = this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
        var fieldInfo = PivotUtil.getFieldInfo(id, this.parent);
        var parentNode = node.closest('.' + cls.FIELD_TREE_PARENT);
        if (isChecked) {
            var isMeasureField = false;
            if (selectedNode.type === 'number') {
                isMeasureField = true;
            }
            else if (this.parent.dataType === 'olap') {
                if (selectedNode.fieldType === 'Measure') {
                    isMeasureField = true;
                }
                else if (selectedNode.tag && selectedNode.tag.toLowerCase().indexOf('[measures]') > -1) {
                    isMeasureField = true;
                }
                else if (selectedNode.type === 'CalculatedField' && selectedNode.formula &&
                    selectedNode.formula.toLowerCase().indexOf('measure') > -1) {
                    isMeasureField = true;
                }
            }
            var eventdrop = {
                fieldName: id, dropField: fieldInfo.fieldItem,
                dataSourceSettings: PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings),
                dropAxis: isMeasureField ? 'values' : 'rows',
                dropPosition: fieldInfo.position, draggedAxis: 'fieldlist', cancel: false
            };
            control.trigger(events.fieldDrop, eventdrop, function (observedArgs) {
                if (!observedArgs.cancel) {
                    addClass([node.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);
                    if (parentNode) {
                        addClass([parentNode.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);
                    }
                    _this.updateSelectedNodes(node, 'check');
                    var addNode = _this.parent.pivotCommon.dataSourceUpdate.getNewField(id, fieldInfo.fieldItem);
                    _this.updateReportSettings(addNode, observedArgs);
                    _this.updateNodeStateChange(id, selectedNode, isChecked);
                }
                else {
                    _this.updateCheckState(selectedNode, 'check');
                }
            });
        }
        else {
            var removeFieldArgs = {
                cancel: false, fieldName: id,
                dataSourceSettings: PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings),
                fieldItem: fieldInfo.fieldItem, axis: fieldInfo.axis
            };
            control.trigger(events.fieldRemove, removeFieldArgs, function (observedArgs) {
                if (!observedArgs.cancel) {
                    removeClass([node.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);
                    if (parentNode && isNullOrUndefined(parentNode.querySelector('.' + cls.FIELD_TREE_CHILD + ' .' + cls.NODE_CHECK_CLASS))) {
                        removeClass([parentNode.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);
                    }
                    _this.updateSelectedNodes(node, 'uncheck');
                    _this.parent.pivotCommon.dataSourceUpdate.removeFieldFromReport(id);
                    if (_this.parent.dataType === 'pivot' && _this.parent.showValuesButton && _this.parent.dataSourceSettings.values.length > 1 &&
                        fieldInfo && fieldInfo.position < _this.parent.dataSourceSettings.valueIndex &&
                        ((_this.parent.dataSourceSettings.valueAxis === 'row' && fieldInfo.axis === 'rows') ||
                            (_this.parent.dataSourceSettings.valueAxis === 'column' && fieldInfo.axis === 'columns'))) {
                        control.setProperties({ dataSourceSettings: { valueIndex: _this.parent.dataSourceSettings.valueIndex - 1 } }, true);
                    }
                    if (_this.parent.dataType === 'olap' && _this.parent.dataSourceSettings.values.length === 0) {
                        _this.parent.pivotCommon.dataSourceUpdate.removeFieldFromReport('[Measures]');
                    }
                    _this.updateNodeStateChange(id, selectedNode, isChecked);
                }
                else {
                    _this.updateCheckState(selectedNode, 'uncheck');
                }
            });
        }
    };
    TreeViewRenderer.prototype.updateReportSettings = function (newField, dropArgs) {
        var dropPosition = dropArgs.dropPosition;
        var dropClass = dropArgs.dropAxis;
        if (this.parent.dataType === 'pivot' && this.parent.showValuesButton && this.parent.dataSourceSettings.values.length > 1) {
            var dropAxisFields = (this.parent.dataSourceSettings.valueAxis === 'row' &&
                dropClass === 'rows') ? this.parent.dataSourceSettings.rows : (this.parent.dataSourceSettings.valueAxis === 'column' && dropClass === 'columns') ?
                this.parent.dataSourceSettings.columns : undefined;
            if (!isNullOrUndefined(dropAxisFields)) {
                if (dropPosition === -1 && this.parent.dataSourceSettings.valueIndex === -1) {
                    this.parent.setProperties({ dataSourceSettings: { valueIndex: dropAxisFields.length } }, true);
                }
                else if (dropPosition > -1 && dropPosition <= this.parent.dataSourceSettings.valueIndex) {
                    this.parent.setProperties({ dataSourceSettings: { valueIndex: this.parent.dataSourceSettings.valueIndex + 1 } }, true);
                }
                else if (this.parent.dataSourceSettings.valueIndex > -1 && dropPosition > this.parent.dataSourceSettings.valueIndex) {
                    dropPosition = dropPosition - 1;
                }
            }
        }
        switch (dropClass) {
            case 'filters':
                if (dropPosition !== -1) {
                    this.parent.dataSourceSettings.filters.splice(dropPosition, 0, newField);
                }
                else {
                    this.parent.dataSourceSettings.filters.push(newField);
                }
                break;
            case 'rows':
                if (dropPosition !== -1) {
                    this.parent.dataSourceSettings.rows.splice(dropPosition, 0, newField);
                }
                else {
                    this.parent.dataSourceSettings.rows.push(newField);
                }
                break;
            case 'columns':
                if (dropPosition !== -1) {
                    this.parent.dataSourceSettings.columns.splice(dropPosition, 0, newField);
                }
                else {
                    this.parent.dataSourceSettings.columns.push(newField);
                }
                break;
            case 'values':
                if (dropPosition !== -1) {
                    this.parent.dataSourceSettings.values.splice(dropPosition, 0, newField);
                }
                else {
                    this.parent.dataSourceSettings.values.push(newField);
                }
                if (this.parent.dataType === 'olap' && this.parent.olapEngineModule &&
                    !(this.parent.olapEngineModule).isMeasureAvail && !(this.parent.dataSourceSettings.values.length > 1)) {
                    var measureField = {
                        name: '[Measures]', caption: 'Measures', baseField: undefined, baseItem: undefined
                    };
                    var fieldAxis = this.parent.dataSourceSettings.valueAxis === 'row' ?
                        this.parent.dataSourceSettings.rows : this.parent.dataSourceSettings.columns;
                    fieldAxis.push(measureField);
                }
                break;
        }
    };
    TreeViewRenderer.prototype.updateCheckState = function (selectedNode, action) {
        var chkState = this.fieldTable.element.querySelectorAll('.' + cls.CHECKBOX_CONTAINER);
        var innerText = this.fieldTable.element.querySelectorAll('.e-list-text');
        for (var i = 0; i < chkState.length; i++) {
            if (selectedNode.caption === innerText[i].textContent) {
                if (action === 'check') {
                    this.fieldTable.uncheckAll([selectedNode['id']]);
                }
                else {
                    this.fieldTable.checkAll([selectedNode['id']]);
                }
            }
        }
    };
    TreeViewRenderer.prototype.updateNodeStateChange = function (id, selectedNode, isChecked) {
        if (this.parent.isDeferLayoutUpdate === false || (this.parent.pivotGridModule &&
            this.parent.pivotGridModule.pivotDeferLayoutUpdate === false)) {
            this.parent.updateDataSource(true);
        }
        else {
            selectedNode.isSelected = isChecked;
            if (this.parent.dataType === 'olap') {
                this.parent.olapEngineModule.updateFieldlistData(id, isChecked);
            }
            this.updateDataSource();
        }
        var selectedLi = this.treeViewElement.querySelector('[data-uid="' + id + '"]');
        selectedLi.focus();
        removeClass([selectedLi], 'e-hover');
        var parent = this.parent;
        setTimeout(function () {
            parent.axisFieldModule.render();
        });
    };
    TreeViewRenderer.prototype.updateSelectedNodes = function (li, state) {
        if (li && li.querySelector('ul')) {
            for (var _i = 0, _a = [].slice.call(li.querySelectorAll('li')); _i < _a.length; _i++) {
                var element = _a[_i];
                if (state === 'check') {
                    addClass([element.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);
                }
                else {
                    removeClass([element.querySelector('.' + cls.LIST_TEXT_CLASS)], cls.LIST_SELECT_CLASS);
                }
            }
        }
    };
    TreeViewRenderer.prototype.updateDataSource = function () {
        if (this.parent.isPopupView) {
            if (this.parent.dataType === 'olap') {
                this.parent.pivotGridModule.olapEngineModule = this.parent.olapEngineModule;
            }
            else {
                this.parent.pivotGridModule.engineModule = this.parent.engineModule;
            }
            this.parent.pivotGridModule.setProperties({ dataSourceSettings: this.parent.dataSourceSettings.properties }, true);
            this.parent.pivotGridModule.notify(events.uiUpdate, this);
        }
        else {
            this.parent.triggerPopulateEvent();
        }
    };
    TreeViewRenderer.prototype.addNode = function (args, id, isChecked, node) {
        var _this = this;
        node = isNullOrUndefined(node) ? args.node : node;
        id = isNullOrUndefined(id) ? node.getAttribute('data-uid') : id;
        var list = this.parent.pivotFieldList;
        var selectedNode = list[id];
        if (!isNullOrUndefined(args)) {
            this.isSpaceKey = args.event.key && args.event.key === ' ';
            if (isNullOrUndefined(selectedNode) || args.node.classList.contains(cls.ICON_DISABLE) || (args.event.target &&
                (args.event.target.classList.contains(cls.COLLAPSIBLE) ||
                    args.event.target.classList.contains(cls.EXPANDABLE))) ||
                (args.event.key && args.event.key !== 'Enter')) {
                return;
            }
            isChecked = false;
            var getNodeDetails = this.fieldTable.getNode(args.node);
            if (args.event && args.event.target &&
                !args.event.target.classList.contains(cls.CHECK_BOX_FRAME_CLASS)) {
                if (getNodeDetails.isChecked === 'true') {
                    this.fieldTable.uncheckAll([args.node]);
                    isChecked = false;
                }
                else {
                    this.fieldTable.checkAll([args.node]);
                    isChecked = true;
                }
            }
            else {
                isChecked = getNodeDetails.isChecked === 'true';
            }
        }
        var fieldInfo = PivotUtil.getFieldInfo(selectedNode.id.toString(), this.parent);
        var control = this.parent.isPopupView ? this.parent.pivotGridModule : this.parent;
        if (isChecked) {
            var axis = ['filters', 'columns', 'rows', 'values'];
            var eventdrop = {
                fieldName: fieldInfo.fieldName, dropField: fieldInfo.fieldItem,
                dataSourceSettings: PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings),
                dropAxis: axis[this.parent.dialogRenderer.adaptiveElement.selectedItem], draggedAxis: 'fieldlist', cancel: false
            };
            control.trigger(events.fieldDrop, eventdrop, function (observedArgs) {
                if (!observedArgs.cancel) {
                    _this.selectedNodes.push(selectedNode.id.toString());
                }
                else {
                    _this.updateCheckState(selectedNode, 'check');
                }
            });
        }
        else {
            var removeFieldArgs = {
                cancel: false, fieldName: fieldInfo.fieldName,
                dataSourceSettings: PivotUtil.getClonedDataSourceSettings(this.parent.dataSourceSettings),
                fieldItem: fieldInfo.fieldItem, axis: fieldInfo.axis
            };
            control.trigger(events.fieldRemove, removeFieldArgs, function (observedArgs) {
                if (!observedArgs.cancel) {
                    var count = _this.selectedNodes.length;
                    while (count--) {
                        if (_this.selectedNodes[count] === selectedNode.id.toString()) {
                            _this.selectedNodes.splice(count, 1);
                            break;
                        }
                    }
                }
                else {
                    _this.updateCheckState(selectedNode, 'uncheck');
                }
            });
        }
    };
    TreeViewRenderer.prototype.refreshTreeView = function () {
        if (this.fieldTable) {
            var treeData = this.getUpdatedData();
            this.fieldTable.fields = {
                dataSource: treeData, id: 'id', text: 'caption', isChecked: 'isSelected', parentID: 'pid', iconCss: 'spriteCssClass'
            };
            this.fieldTable.dataBind();
        }
    };
    TreeViewRenderer.prototype.getUpdatedData = function () {
        var treeData = this.getTreeData();
        var expandedNodes = this.fieldTable.expandedNodes;
        this.updateExpandedNodes(treeData, expandedNodes);
        return this.applySorting(treeData, this.fieldListSort);
    };
    TreeViewRenderer.prototype.getTreeData = function (axis) {
        var data = [];
        if (this.parent.dataType === 'olap') {
            data = this.getOlapTreeData(axis);
            if (this.isSearching && this.olapFieldListData.length > 0) {
                data = this.performeSearching(this.fieldSearch.value);
            }
        }
        else {
            var keys = this.parent.pivotFieldList ? Object.keys(this.parent.pivotFieldList) : [];
            var treeDataInfo = {};
            for (var _i = 0, keys_2 = keys; _i < keys_2.length; _i++) {
                var key = keys_2[_i];
                var member = this.parent.pivotFieldList[key];
                treeDataInfo[key] = { id: member.id, pid: member.pid, caption: member.caption, isSelected: member.isSelected };
                if (!isNullOrUndefined(member.pid) && !treeDataInfo[key].hasChildren) {
                    var parentId = member.pid + '_group_name';
                    treeDataInfo[key].pid = parentId;
                    treeDataInfo[parentId] = {
                        id: parentId, caption: member.pid,
                        isSelected: treeDataInfo[parentId] && treeDataInfo[parentId].isSelected
                            ? treeDataInfo[parentId].isSelected : member.isSelected, hasChildren: true
                    };
                }
            }
            if (this.parent.isAdaptive) {
                var fields = [this.parent.dataSourceSettings.filters, this.parent.dataSourceSettings.columns,
                    this.parent.dataSourceSettings.rows,
                    this.parent.dataSourceSettings.values];
                var currentFieldSet = fields[axis];
                var len = keys.length;
                while (len--) {
                    treeDataInfo[keys[len]].isSelected = false;
                }
                for (var _a = 0, currentFieldSet_1 = currentFieldSet; _a < currentFieldSet_1.length; _a++) {
                    var item = currentFieldSet_1[_a];
                    treeDataInfo[item.name].isSelected = true;
                }
            }
            var members = Object.keys(treeDataInfo);
            for (var _b = 0, members_1 = members; _b < members_1.length; _b++) {
                var member = members_1[_b];
                var obj = treeDataInfo[member];
                data.push(obj);
            }
        }
        return data;
    };
    TreeViewRenderer.prototype.getOlapTreeData = function (axis) {
        var data = [];
        var fieldListData = this.parent.olapEngineModule.fieldListData ? this.parent.olapEngineModule.fieldListData : [];
        if (this.parent.isAdaptive) {
            var fields = [
                this.parent.dataSourceSettings.filters, this.parent.dataSourceSettings.columns,
                this.parent.dataSourceSettings.rows, this.parent.dataSourceSettings.values
            ];
            var currentFieldSet = fields[axis];
            var i = 0;
            while (i < fieldListData.length) {
                var item = fieldListData[i];
                var framedSet = void 0;
                if (axis === 3) {
                    if (item.id.toLowerCase() !== '[measures]' &&
                        (item.id.toLowerCase().indexOf('[measures]') === 0 ||
                            (item.spriteCssClass && item.spriteCssClass.indexOf('e-measureCDB') !== -1)) ||
                        (item.id.toLowerCase() === '[calculated members].[_0]' ||
                            (item.spriteCssClass && item.spriteCssClass.indexOf('e-calc-measure-icon') !== -1))) {
                        framedSet = {
                            id: item.id, caption: item.caption, hasChildren: item.hasChildren,
                            type: item.type, aggregateType: item.aggregateType,
                            isSelected: item.isSelected, pid: item.pid, spriteCssClass: item.spriteCssClass
                        };
                        framedSet.isSelected = false;
                        if (framedSet.spriteCssClass && framedSet.spriteCssClass.indexOf('e-measureCDB') !== -1) {
                            framedSet.spriteCssClass = framedSet.spriteCssClass.replace('e-folderCDB-icon', 'e-measureGroupCDB-icon');
                            framedSet.pid = undefined;
                        }
                        for (var _i = 0, currentFieldSet_2 = currentFieldSet; _i < currentFieldSet_2.length; _i++) {
                            var field = currentFieldSet_2[_i];
                            if (framedSet.id === field.name) {
                                framedSet.isSelected = true;
                                break;
                            }
                        }
                        data.push(framedSet);
                    }
                }
                else {
                    if (!(item.id.toLowerCase().indexOf('[measures]') === 0) &&
                        !(item.spriteCssClass && item.spriteCssClass.indexOf('e-measureCDB') !== -1) &&
                        !(item.spriteCssClass && item.spriteCssClass.indexOf('e-calc-measure-icon') !== -1)) {
                        framedSet = {
                            id: item.id, caption: item.caption, hasChildren: item.hasChildren,
                            type: item.type, aggregateType: item.aggregateType,
                            isSelected: item.isSelected, pid: item.pid, spriteCssClass: item.spriteCssClass
                        };
                        framedSet.isSelected = false;
                        for (var _a = 0, currentFieldSet_3 = currentFieldSet; _a < currentFieldSet_3.length; _a++) {
                            var item_1 = currentFieldSet_3[_a];
                            if (framedSet.id === item_1.name) {
                                framedSet.isSelected = true;
                                break;
                            }
                        }
                        data.push(framedSet);
                    }
                }
                i++;
            }
        }
        else {
            data = isNullOrUndefined(this.parent.olapEngineModule.fieldListData) ? [] :
                PivotUtil.getClonedData(this.parent.olapEngineModule.fieldListData);
        }
        this.olapFieldListData = data;
        return data;
    };
    TreeViewRenderer.prototype.updateExpandedNodes = function (data, expandedNodes) {
        if (expandedNodes.length > 0) {
            var i = 0;
            for (var _i = 0, data_1 = data; _i < data_1.length; _i++) {
                var field = data_1[_i];
                if (expandedNodes.indexOf(field.id) > -1) {
                    i++;
                    field.expanded = true;
                    field.spriteCssClass = (field.spriteCssClass &&
                        field.spriteCssClass.toString().indexOf('e-folderCDB-icon') > -1 ?
                        field.spriteCssClass.toString().replace('e-folderCDB-icon', 'e-folderCDB-open-icon') :
                        field.spriteCssClass);
                    if (i === (expandedNodes.length)) {
                        break;
                    }
                }
            }
        }
    };
    TreeViewRenderer.prototype.updateSorting = function (args) {
        var target = args.target;
        var option = target.getAttribute('data-sort');
        if (PivotUtil.invokeActionMethod(this.parent, events.actionBegin, events.sortFieldTree)) {
            return;
        }
        try {
            if (target.className.indexOf('e-selected') === -1) {
                switch (option) {
                    case 'None':
                        this.fieldListSort = 'None';
                        addClass([target], 'e-selected');
                        removeClass([this.parentElement.querySelector('.e-sort-ascend')], 'e-selected');
                        removeClass([this.parentElement.querySelector('.e-sort-descend')], 'e-selected');
                        break;
                    case 'Ascend':
                        this.fieldListSort = 'Ascend';
                        addClass([target], 'e-selected');
                        removeClass([this.parentElement.querySelector('.e-sort-none')], 'e-selected');
                        removeClass([this.parentElement.querySelector('.e-sort-descend')], 'e-selected');
                        break;
                    case 'Descend':
                        this.fieldListSort = 'Descend';
                        addClass([target], 'e-selected');
                        removeClass([this.parentElement.querySelector('.e-sort-ascend')], 'e-selected');
                        removeClass([this.parentElement.querySelector('.e-sort-none')], 'e-selected');
                        break;
                }
                this.refreshTreeView();
            }
        }
        catch (execption) {
            this.parent.actionFailureMethod(execption);
        }
        PivotUtil.invokeActionMethod(this.parent, events.actionComplete, this.parent.getActionCompleteName(), {
            sortInfo: {
                order: this.fieldListSort === 'Ascend' ? 'Ascending' : this.fieldListSort === 'Descend' ? 'Descending' : 'None'
            }
        });
    };
    TreeViewRenderer.prototype.applySorting = function (treeData, sortOrder) {
        if (treeData.length > 0) {
            if (this.parent.dataType === 'olap') {
                var measure = void 0;
                var calcMember = void 0;
                if (this.parent.dataSourceSettings.calculatedFieldSettings.length > 0 &&
                    treeData[0].id.toLowerCase() === '[calculated members].[_0]') {
                    calcMember = treeData[0];
                    measure = treeData[1];
                    treeData.splice(0, 2);
                }
                else {
                    measure = treeData[0];
                    treeData.splice(0, 1);
                }
                treeData = sortOrder === 'Ascend' ?
                    (treeData.sort(function (a, b) { return (a.caption > b.caption) ? 1 :
                        ((b.caption > a.caption) ? -1 : 0); })) : sortOrder === 'Descend' ?
                    (treeData.sort(function (a, b) { return (a.caption < b.caption) ? 1 :
                        ((b.caption < a.caption) ? -1 : 0); })) : treeData;
                if (calcMember) {
                    treeData.splice(0, 0, calcMember, measure);
                }
                else {
                    treeData.splice(0, 0, measure);
                }
            }
            else {
                this.fieldTable.sortOrder = ((sortOrder === 'Ascend' ? 'Ascending' : (sortOrder === 'Descend' ? 'Descending' : 'None')));
            }
        }
        return treeData;
    };
    TreeViewRenderer.prototype.onFieldAdd = function () {
        this.parent.dialogRenderer.updateDataSource(this.selectedNodes);
        this.closeTreeDialog();
    };
    TreeViewRenderer.prototype.closeTreeDialog = function () {
        this.selectedNodes = [];
        this.fieldDialog.hide();
        this.fieldDialog.destroy();
        if (document.getElementById(this.parent.element.id + '_FieldListTreeView')) {
            remove(document.getElementById(this.parent.element.id + '_FieldListTreeView'));
        }
        this.fieldDialog = null;
    };
    TreeViewRenderer.prototype.keyPress = function (e) {
        if (e.keyCode === 13 && e.target) {
            e.target.click();
            e.preventDefault();
            return;
        }
    };
    TreeViewRenderer.prototype.wireFieldListEvent = function (element) {
        EventHandler.add(element, 'keydown', this.keyPress, this);
        EventHandler.add(element, 'click', this.updateSorting, this);
    };
    TreeViewRenderer.prototype.unWireFieldListEvent = function (element) {
        EventHandler.remove(element, 'keydown', this.keyPress);
        EventHandler.remove(element, 'click', this.updateSorting);
    };
    /**
     * @hidden
     */
    TreeViewRenderer.prototype.addEventListener = function () {
        this.parent.on(events.treeViewUpdate, this.refreshTreeView, this);
    };
    /**
     * @hidden
     */
    TreeViewRenderer.prototype.removeEventListener = function () {
        if (this.parent.isDestroyed) {
            return;
        }
        this.parent.off(events.treeViewUpdate, this.refreshTreeView);
    };
    /**
     * To destroy the tree view event listener
     *
     * @returns {void}
     * @hidden
     */
    TreeViewRenderer.prototype.destroy = function () {
        this.removeEventListener();
        if (this.parentElement) {
            var sortElements = [
                this.parentElement.querySelector('.e-sort-none'),
                this.parentElement.querySelector('.e-sort-ascend'),
                this.parentElement.querySelector('.e-sort-descend')
            ];
            for (var _i = 0, sortElements_1 = sortElements; _i < sortElements_1.length; _i++) {
                var element = sortElements_1[_i];
                if (element) {
                    this.unWireFieldListEvent(element);
                }
            }
        }
        if (this.editorSearch && !this.editorSearch.isDestroyed) {
            this.editorSearch.destroy();
            this.editorSearch = null;
        }
        if (this.fieldSearch && !this.fieldSearch.isDestroyed) {
            this.fieldSearch.destroy();
            this.fieldSearch = null;
        }
        if (this.fieldTable && !this.fieldTable.isDestroyed) {
            if (this.fieldTable.element) {
                var treeNodes = this.fieldTable.element.querySelectorAll('li');
                for (var i = 0; i < treeNodes.length; i++) {
                    EventHandler.clearEvents(treeNodes[i]);
                }
            }
            this.fieldTable.destroy();
            this.fieldTable = null;
        }
        if (this.fieldDialog && !this.fieldDialog.isDestroyed) {
            this.fieldDialog.destroy();
            this.fieldDialog = null;
        }
        if (this.treeViewElement && this.treeViewElement.parentNode) {
            this.treeViewElement.innerHTML = '';
        }
        this.selectedNodes = [];
        this.nonSearchList = null;
        this.parentIDs = [];
    };
    return TreeViewRenderer;
}());
export { TreeViewRenderer };