@syncfusion/ej2-gantt 19.4.53 → 19.4.56

package/dist/es6/ej2-gantt.es2015.js

@@ -478,7 +478,8 @@ class DateProcessor {
     calculateDuration(ganttData) {
         const ganttProperties = ganttData.ganttProperties;
         let tDuration;
-        if (!isNullOrUndefined(ganttProperties.segments) && ganttProperties.segments.length > 0) {
+        if (!isNullOrUndefined(ganttProperties.segments) && ganttProperties.segments.length > 0 &&
+            !isNullOrUndefined(this.parent.editModule.taskbarEditModule)) {
             tDuration = this.parent.editModule.taskbarEditModule.sumOfDuration(ganttProperties.segments);
         }
         else {
@@ -4278,7 +4279,19 @@ class GanttChart {
         //empty row height
         const emptydivHeight = 36;
         const emptyHeight = this.parent.contentHeight === 0 ? this.parent.flatData.length > 1 ? emptydivHeight : 0 : this.parent.contentHeight;
-        this.chartBodyContent.style.height = formatUnit(emptyHeight);
+        let contentElement = this.parent.element.getElementsByClassName('e-chart-scroll-container e-content')[0];
+        if (emptyHeight >= contentElement['offsetHeight']) {
+            this.chartBodyContent.style.height = formatUnit(emptyHeight);
+        }
+        else {
+            let scrollHeight = this.parent.element.getElementsByClassName('e-chart-rows-container')[0]['offsetHeight'];
+            if (contentElement['offsetHeight'] >= scrollHeight) {
+                this.chartBodyContent.style.height = contentElement['offsetHeight'] - 17 + 'px';
+            }
+            else {
+                this.chartBodyContent.style.height = contentElement['offsetHeight'] + 'px';
+            }
+        }
         //let element: HTMLElement = this.chartTimelineContainer.querySelector('.' + cls.timelineHeaderTableContainer);
         this.chartBodyContent.style.width = formatUnit(this.parent.timelineModule.totalTimelineWidth);
         this.setVirtualHeight();
@@ -4311,7 +4324,21 @@ class GanttChart {
             if (this.chartBodyContent.clientHeight < this.chartBodyContainer.clientHeight) {
                 if (lastRow) {
                     addClass(lastRow.querySelectorAll('td'), 'e-lastrow');
-                    this.chartBodyContent.style.height = formatUnit(this.parent.contentHeight + 1);
+                    const emptydivHeight = 36;
+                    const emptyHeight = this.parent.contentHeight === 0 ? this.parent.flatData.length > 1 ? emptydivHeight : 0 : this.parent.contentHeight;
+                    let contentElement = this.parent.element.getElementsByClassName('e-chart-scroll-container e-content')[0];
+                    if (emptyHeight >= contentElement['offsetHeight']) {
+                        this.chartBodyContent.style.height = formatUnit(emptyHeight);
+                    }
+                    else {
+                        let scrollHeight = this.parent.element.getElementsByClassName('e-chart-rows-container')[0]['offsetHeight'];
+                        if (contentElement['offsetHeight'] >= scrollHeight) {
+                            this.chartBodyContent.style.height = contentElement['offsetHeight'] - 17 + 'px';
+                        }
+                        else {
+                            this.chartBodyContent.style.height = contentElement['offsetHeight'] + 'px';
+                        }
+                    }
                 }
             }
         }
@@ -5355,7 +5382,7 @@ class Timeline {
         const currentZoomingLevel = this.checkCurrentZoomingLevel();
         this.isZoomIn = isZoomIn;
         this.isZooming = true;
-        const currentLevel = isZoomIn ? currentZoomingLevel + 1 : currentZoomingLevel - 1;
+        let currentLevel = isZoomIn ? currentZoomingLevel + 1 : currentZoomingLevel - 1;
         if (this.parent.toolbarModule) {
             if (isZoomIn) {
                 if (currentLevel === this.parent.zoomingLevels[this.parent.zoomingLevels.length - 1].level) {
@@ -5374,6 +5401,9 @@ class Timeline {
                 }
             }
         }
+        currentLevel = this.parent.zoomingLevels.findIndex((tempLevel) => {
+            return tempLevel.level === currentLevel;
+        });
         let newTimeline = this.parent.zoomingLevels[currentLevel];
         const args = {
             requestType: isZoomIn ? 'beforeZoomIn' : 'beforeZoomOut',
@@ -7945,7 +7975,7 @@ class ChartRows extends DateProcessor {
         let childTaskbarNode = null;
         const data = this.templateData;
         if (this.childTaskbarTemplateFunction) {
-            childTaskbarNode = this.childTaskbarTemplateFunction(extend({ index: i }, data), this.parent, 'TaskbarTemplate', this.getTemplateID('TaskbarTemplate'), false, undefined, rootElement[0]);
+            childTaskbarNode = this.childTaskbarTemplateFunction(extend({ index: i }, data), this.parent, 'TaskbarTemplate', this.getTemplateID('TaskbarTemplate'), false, undefined, rootElement[0], this.parent.treeGrid['root']);
         }
         else {
             let labelString = '';
@@ -8384,7 +8414,7 @@ class ChartRows extends DateProcessor {
         let milestoneNode = null;
         const data = this.templateData;
         if (this.milestoneTemplateFunction) {
-            milestoneNode = this.milestoneTemplateFunction(extend({ index: i }, data), this.parent, 'MilestoneTemplate', this.getTemplateID('MilestoneTemplate'), false, undefined, rootElement[0]);
+            milestoneNode = this.milestoneTemplateFunction(extend({ index: i }, data), this.parent, 'MilestoneTemplate', this.getTemplateID('MilestoneTemplate'), false, undefined, rootElement[0], this.parent.treeGrid['root']);
         }
         else {
             const template = '<div class="' + traceMilestone + '" style="position:absolute;">' +
@@ -8455,7 +8485,7 @@ class ChartRows extends DateProcessor {
         leftLabelNode[0].setAttribute('aria-label', this.generateTaskLabelAriaLabel('left'));
         let leftLabelTemplateNode = null;
         if (this.leftTaskLabelTemplateFunction) {
-            leftLabelTemplateNode = this.leftTaskLabelTemplateFunction(extend({ index: i }, this.templateData), this.parent, 'LeftLabelTemplate', this.getTemplateID('LeftLabelTemplate'), false, undefined, leftLabelNode[0]);
+            leftLabelTemplateNode = this.leftTaskLabelTemplateFunction(extend({ index: i }, this.templateData), this.parent, 'LeftLabelTemplate', this.getTemplateID('LeftLabelTemplate'), false, undefined, leftLabelNode[0], this.parent.treeGrid['root']);
         }
         else {
             const field = this.parent.labelSettings.leftLabel;
@@ -8466,6 +8496,9 @@ class ChartRows extends DateProcessor {
             }
         }
         if (leftLabelTemplateNode && leftLabelTemplateNode.length > 0) {
+            if (leftLabelTemplateNode[0]['data'] === 'null') {
+                leftLabelTemplateNode[0]['data'] = '';
+            }
             leftLabelNode[0].appendChild([].slice.call(leftLabelTemplateNode)[0]);
         }
         return leftLabelNode;
@@ -8495,7 +8528,7 @@ class ChartRows extends DateProcessor {
         rightLabelNode[0].setAttribute('aria-label', this.generateTaskLabelAriaLabel('right'));
         let rightLabelTemplateNode = null;
         if (this.rightTaskLabelTemplateFunction) {
-            rightLabelTemplateNode = this.rightTaskLabelTemplateFunction(extend({ index: i }, this.templateData), this.parent, 'RightLabelTemplate', this.getTemplateID('RightLabelTemplate'), false, undefined, rightLabelNode[0]);
+            rightLabelTemplateNode = this.rightTaskLabelTemplateFunction(extend({ index: i }, this.templateData), this.parent, 'RightLabelTemplate', this.getTemplateID('RightLabelTemplate'), false, undefined, rightLabelNode[0], this.parent.treeGrid['root']);
         }
         else {
             const field = this.parent.labelSettings.rightLabel;
@@ -8506,6 +8539,9 @@ class ChartRows extends DateProcessor {
             }
         }
         if (rightLabelTemplateNode && rightLabelTemplateNode.length > 0) {
+            if (rightLabelTemplateNode[0]['data'] === 'null') {
+                rightLabelTemplateNode[0]['data'] = '';
+            }
             rightLabelNode[0].appendChild([].slice.call(rightLabelTemplateNode)[0]);
         }
         return rightLabelNode;
@@ -8560,7 +8596,7 @@ class ChartRows extends DateProcessor {
         let parentTaskbarNode = null;
         const data = this.templateData;
         if (this.parentTaskbarTemplateFunction) {
-            parentTaskbarNode = this.parentTaskbarTemplateFunction(extend({ index: i }, data), this.parent, 'ParentTaskbarTemplate', this.getTemplateID('ParentTaskbarTemplate'), false, undefined, rootElement[0]);
+            parentTaskbarNode = this.parentTaskbarTemplateFunction(extend({ index: i }, data), this.parent, 'ParentTaskbarTemplate', this.getTemplateID('ParentTaskbarTemplate'), false, undefined, rootElement[0], this.parent.treeGrid['root']);
         }
         else {
             let labelString = '';
@@ -8674,10 +8710,19 @@ class ChartRows extends DateProcessor {
     }
     isTemplate(template) {
         let result = false;
+        for (let i = 0; i < this.parent.ganttColumns.length; i++) {
+            if (template === this.parent.ganttColumns[i].field) {
+                result = true;
+                break;
+            }
+        }
         if (typeof template !== 'string' || template.indexOf('#') === 0 || template.indexOf('<') > -1
-            || template.indexOf('$') > -1) {
+            || template.indexOf('$') > -1 || !result) {
             result = true;
         }
+        else {
+            result = false;
+        }
         return result;
     }
     /**
@@ -8692,7 +8737,7 @@ class ChartRows extends DateProcessor {
     leftLabelContainer() {
         const template = '<div class="' + ((this.leftTaskLabelTemplateFunction) ? leftLabelTempContainer :
             leftLabelContainer) + ' ' + '" tabindex="-1" style="height:' +
-            (this.parent.rowHeight - 1) + 'px;width:' + this.taskNameWidth(this.templateData) + '"></div>';
+            (this.parent.rowHeight - 2) + 'px;width:' + this.taskNameWidth(this.templateData) + '"></div>';
         return this.createDivElement(template);
     }
     taskbarContainer() {
@@ -8715,7 +8760,7 @@ class ChartRows extends DateProcessor {
     rightLabelContainer() {
         const template = '<div class="' + ((this.rightTaskLabelTemplateFunction) ? rightLabelTempContainer :
             rightLabelContainer) + '" ' + ' tabindex="-1" style="left:' + this.getRightLabelLeft(this.templateData) + 'px;height:'
-            + (this.parent.rowHeight - 1) + 'px;"></div>';
+            + (this.parent.rowHeight - 2) + 'px;"></div>';
         return this.createDivElement(template);
     }
     childTaskbarLeftResizer() {
@@ -12312,25 +12357,7 @@ let Gantt = class Gantt extends Component {
      * @returns {void} .
      */
     calculateDimensions() {
-        let settingsHeight;
-        if (typeof (this.height) !== 'number' && this.height.indexOf('%') !== -1 && (this.element.parentElement &&
-            !this.element.parentElement.style.height || this.element.parentElement.style.height.indexOf('%') !== -1)) {
-            let ganttHeight;
-            if (this.element.parentElement.style.height.indexOf('%') == -1) {
-                ganttHeight = Number(this.height.split("%")[0]);
-            }
-            else {
-                ganttHeight = Number(this.element.parentElement.style.height.split("%")[0]);
-            }
-            ganttHeight = (ganttHeight * window.innerHeight) / 100;
-            if (this.height === '100%') {
-                ganttHeight = ganttHeight - 16;
-            }
-            settingsHeight = this.validateDimentionValue(ganttHeight);
-        }
-        else {
-            settingsHeight = this.validateDimentionValue(this.height);
-        }
+        let settingsHeight = this.validateDimentionValue(this.height);
         let settingsWidth = this.validateDimentionValue(this.width);
         if (!isNullOrUndefined(this.width) && typeof (this.width) === 'string' && this.width.indexOf('%') !== -1) {
             settingsWidth = this.width;
@@ -12473,40 +12500,6 @@ let Gantt = class Gantt extends Component {
      */
     windowResize() {
         if (!isNullOrUndefined(this.element)) {
-            let settingsHeight;
-            if (this.height.indexOf('%') !== -1) {
-                let ganttHeight = Number(this.height.split("%")[0]);
-                if (this.element.parentElement && (this.element.parentElement.style.height)) {
-                    let containerHeight;
-                    if (this.element.parentElement.style.height.indexOf('%') == -1) {
-                        containerHeight = Number(this.element.parentElement.style.height.split("px")[0]);
-                        ganttHeight = (ganttHeight * containerHeight) / 100;
-                    }
-                    else {
-                        containerHeight = Number(this.element.parentElement.style.height.split("%")[0]);
-                        ganttHeight = (window.innerHeight * containerHeight) / 100;
-                    }
-                }
-                else {
-                    ganttHeight = Number(this.height.split("%")[0]);
-                    ganttHeight = (ganttHeight * window.innerHeight) / 100;
-                }
-                if (this.height === '100%') {
-                    ganttHeight = ganttHeight - 16;
-                }
-                let toolbarHeight = 0;
-                if (!isNullOrUndefined(this.toolbarModule) && !isNullOrUndefined(this.toolbarModule.element)) {
-                    toolbarHeight = this.toolbarModule.element.offsetHeight;
-                }
-                let contentHeight = ganttHeight - this.ganttChartModule.chartTimelineContainer.offsetHeight - toolbarHeight;
-                settingsHeight = this.validateDimentionValue(ganttHeight);
-                this.element.style.height = settingsHeight;
-                this.element.querySelectorAll('.e-content')[0]['style'].height = contentHeight + 'px';
-                this.element.querySelectorAll('.e-content')[2]['style'].height = contentHeight + 'px';
-            }
-            else {
-                settingsHeight = this.validateDimentionValue(this.height);
-            }
             this.updateContentHeight();
             this.ganttChartModule.updateWidthAndHeight(); // Updating chart scroll conatiner height for row mismatch
             this.treeGridModule.ensureScrollBar();
@@ -12851,6 +12844,18 @@ let Gantt = class Gantt extends Component {
      * @private
      */
     treeDataBound(args) {
+        this.element.getElementsByClassName('e-chart-root-container')[0]['style'].height = '100%';
+        let gridHeight = this.element.getElementsByClassName('e-gridcontent')[0]['style'].height;
+        let timelineContainer = this.element.getElementsByClassName('e-timeline-header-container')[0]['offsetHeight'];
+        gridHeight = 'calc(100% - ' + timelineContainer + 'px)';
+        // eslint-disable-next-line
+        this.element.getElementsByClassName('e-chart-scroll-container e-content')[0]['style'].height = 'calc(100% - ' + timelineContainer + 'px)';
+        if (!isNullOrUndefined(this.toolbarModule)) {
+            this.splitterElement.style.height = 'calc(100% - ' + this.toolbarModule.element.offsetHeight + 'px)';
+        }
+        else {
+            this.splitterElement.style.height = '100%';
+        }
         if (this.isLoad) {
             this.updateCurrentViewData();
             if (!this.enableVirtualization) {
@@ -12870,8 +12875,7 @@ let Gantt = class Gantt extends Component {
                     removeClass(this.treeGrid.element.querySelectorAll('.e-headercell'), timelineSingleHeaderOuterDiv);
                     removeClass(this.treeGrid.element.querySelectorAll('.e-columnheader'), timelineSingleHeaderOuterDiv);
                 }
-                this.treeGrid.height = this.ganttHeight - toolbarHeight -
-                    this.treeGrid.grid.getHeaderContent().offsetHeight;
+                this.treeGrid.height = '100%';
                 this.notify('tree-grid-created', {});
                 this.createGanttPopUpElement();
                 this.hideSpinner();
@@ -15638,7 +15642,8 @@ class CellEdit {
         if (!ganttRecord.ganttProperties.isAutoSchedule) {
             this.parent.setRecordValue('autoWidth', this.parent.dataOperation.calculateWidth(ganttRecord, false), ganttRecord.ganttProperties, true);
         }
-        if (!isNullOrUndefined(args.data.ganttProperties.segments) && args.data.ganttProperties.segments.length > 0) {
+        if (!isNullOrUndefined(args.data.ganttProperties.segments) && args.data.ganttProperties.segments.length > 0 &&
+            !isNullOrUndefined(this.parent.editModule.taskbarEditModule)) {
             this.parent.editModule.taskbarEditModule.updateSegmentProgress(args.data.ganttProperties);
         }
         if (!args.data.hasChildRecords) {
@@ -23178,23 +23183,22 @@ class Edit$2 {
         }
         /* data Source update */
         if (!isNullOrUndefined(parentItem)) {
-            childIndex = parentItem.childRecords.indexOf(this.addRowSelectedItem);
-            /*Child collection update*/
+            if (rowPosition == 'Above') {
+                childIndex = parentItem.childRecords.indexOf(this.addRowSelectedItem);
+            }
+            else if (rowPosition == 'Below') {
+                childIndex = parentItem.childRecords.indexOf(this.addRowSelectedItem) + 1;
+            }
+            else {
+                childIndex = parentItem.childRecords.length;
+            } /*Child collection update*/
             parentItem.childRecords.splice(childIndex, 0, record);
             if ((this.parent.dataSource instanceof DataManager &&
                 isNullOrUndefined(parentItem.taskData[this.parent.taskFields.parentID])) ||
                 !isNullOrUndefined(this.parent.dataSource)) {
                 const child = this.parent.taskFields.child;
                 if (parentItem.taskData[child] && parentItem.taskData[child].length > 0) {
-                    if (rowPosition === 'Above') {
-                        parentItem.taskData[child].splice(childIndex, 0, record.taskData);
-                    }
-                    else if (rowPosition === 'Below') {
-                        parentItem.taskData[child].splice(childIndex + 1, 0, record.taskData);
-                    }
-                    else {
-                        parentItem.taskData[child].push(record.taskData);
-                    }
+                    parentItem.taskData[child].splice(childIndex, 0, record.taskData);
                 }
                 else {
                     parentItem.taskData[child] = [];
@@ -23259,9 +23263,21 @@ class Edit$2 {
     refreshRecordInImmutableMode() {
         for (let i = 0; i < this.parent.modifiedRecords.length; i++) {
             const originalData = this.parent.modifiedRecords[i];
-            const dataId = this.parent.viewType === 'ProjectView' ?
-                originalData.ganttProperties.taskId : originalData.ganttProperties.rowUniqueID;
-            this.parent.treeGrid.grid.setRowData(dataId, originalData);
+            let treeIndex = this.parent.allowRowDragAndDrop ? 1 : 0;
+            let uniqueTaskID = this.parent.taskFields.id;
+            var originalIndex = this.parent.currentViewData.findIndex((data) => {
+                return (data[uniqueTaskID] == originalData[uniqueTaskID]);
+            });
+            if (this.parent.treeGrid.getRows()[originalIndex]) {
+                this.parent.treeGrid.renderModule.cellRender({
+                    data: originalData, cell: this.parent.treeGrid.getRows()[originalIndex].cells[this.parent.treeColumnIndex + treeIndex],
+                    column: this.parent.treeGrid.grid.getColumns()[this.parent.treeColumnIndex],
+                    requestType: 'rowDragAndDrop'
+                });
+                this.parent.treeGrid.renderModule.RowModifier({
+                    data: originalData, row: this.parent.treeGrid.getRows()[originalIndex], rowHeight: this.parent.rowHeight
+                });
+            }
         }
     }
     /**
@@ -24012,15 +24028,18 @@ class Edit$2 {
                 if (this.dropPosition === 'topSegment' || this.dropPosition === 'bottomSegment') {
                     draggedRec[this.parent.taskFields.parentID] = droppedRec[this.parent.taskFields.parentID];
                     draggedRec.taskData[this.parent.taskFields.parentID] = droppedRec[this.parent.taskFields.parentID];
+                    draggedRec.ganttProperties['parentId'] = droppedRec[this.parent.taskFields.parentID];
                 }
                 else {
                     draggedRec[this.parent.taskFields.parentID] = droppedRec[this.parent.taskFields.id];
                     draggedRec.taskData[this.parent.taskFields.parentID] = droppedRec[this.parent.taskFields.id];
+                    draggedRec.ganttProperties['parentId'] = droppedRec[this.parent.taskFields.id];
                 }
             }
             else {
                 draggedRec[this.parent.taskFields.parentID] = null;
                 draggedRec.taskData[this.parent.taskFields.parentID] = null;
+                draggedRec.ganttProperties['parentId'] = null;
             }
         }
     }
@@ -24873,6 +24892,9 @@ class Selection$1 {
         this.addRemoveClass(index);
         this.selectedRowIndexes = extend([], this.getSelectedRowIndexes(), [], true);
         this.parent.setProperties({ selectedRowIndex: -1 }, true);
+        if (this.selectedRowIndexes.length === 1) {
+            this.parent.setProperties({ selectedRowIndex: this.selectedRowIndexes[0] }, true);
+        }
         if (!isNullOrUndefined(this.parent.toolbarModule)) {
             this.parent.toolbarModule.refreshToolbarItems();
         }
@@ -27106,7 +27128,13 @@ class RowDD$1 {
                         }
                         else {
                             startIndex = droppedRecord.index;
-                            endIndex = draggedRecord.index;
+                            let rootChildRecord = draggedRecord;
+                            if (rootChildRecord.childRecords.length > 0) {
+                                do {
+                                    rootChildRecord = rootChildRecord.childRecords[rootChildRecord.childRecords.length - 1];
+                                } while (rootChildRecord.childRecords.length > 0);
+                            }
+                            endIndex = rootChildRecord.index;
                         }
                         for (let i = startIndex; i <= endIndex; i++) {
                             if (!isNullOrUndefined(data[i])) {