@syncfusion/ej2-gantt 23.2.5 → 24.1.41

package/src/gantt/actions/dialog-edit.js

@@ -24,6 +24,8 @@ var DialogEdit = /** @class */ (function () {
      * @returns {void} .
      */
     function DialogEdit(parent) {
+        this.taskFieldColumn = [];
+        this.customFieldColumn = [];
         /**
          * @private
          */
@@ -199,6 +201,7 @@ var DialogEdit = /** @class */ (function () {
     DialogEdit.prototype.openAddDialog = function () {
         this.isEdit = false;
         this.editedRecord = this.composeAddRecord();
+        this.isFromAddDialog = true;
         this.createDialog();
     };
     /**
@@ -357,6 +360,7 @@ var DialogEdit = /** @class */ (function () {
         }
         if (Object.keys(this.rowData).length !== 0) {
             this.editedRecord = extend({}, {}, this.rowData, true);
+            this.isFromEditDialog = true;
             this.createDialog();
         }
     };
@@ -429,8 +433,114 @@ var DialogEdit = /** @class */ (function () {
             }
         }
         else {
+            if (this.singleTab && this.CustomformObj) {
+                if (!this.CustomformObj.validate()) {
+                    target.style.pointerEvents = '';
+                    return;
+                }
+            }
+            else {
+                if (this.CustomformObj) {
+                    if (this.isAddingDialog) {
+                        if (this.parent.addDialogFields.length > 1 && this.parent.addDialogFields[0].type == "Custom" && !this.formObj) {
+                            if (!this.CustomformObj.validate()) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                    else if (this.isEditingDialog) {
+                        if (this.parent.editDialogFields.length > 1 && this.parent.editDialogFields[0].type == "Custom" && !this.formObj) {
+                            if (!this.CustomformObj.validate()) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                    if (!this.formObj.validate() && !this.CustomformObj.validate()) {
+                        target.style.pointerEvents = '';
+                        return;
+                    }
+                }
+                if (this.formObj) {
+                    var formValid = this.formObj.validate();
+                    if (this.storeDependencyTab) {
+                        var dependencyTab = this.storeDependencyTab.querySelector('.e-gridform');
+                        if (dependencyTab) {
+                            var dependencyTabValid = dependencyTab['ej2_instances'][0].validate();
+                            if (!formValid || !dependencyTabValid) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                    if (this.storeResourceTab) {
+                        var resourceTab = this.storeResourceTab.querySelector('.e-gridform');
+                        if (resourceTab) {
+                            var resourceTabValid = resourceTab['ej2_instances'][0].validate();
+                            if (!formValid || !resourceTabValid) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                    if (!formValid) {
+                        target.style.pointerEvents = '';
+                        return;
+                    }
+                }
+                else if (this.storeDependencyTab || this.firstOccuringTab == "Dependency") {
+                    if (this.firstOccuringTab == "Dependency") {
+                        var element = e.target.closest('#' + this.parent.element.id + '_dialog');
+                        var dependencyTab = element.querySelector('.e-gridform');
+                        if (dependencyTab) {
+                            var dependencyTabValid = dependencyTab['ej2_instances'][0].validate();
+                            if (!dependencyTabValid) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                    else {
+                        var dependencyTab = this.storeDependencyTab.querySelector('.e-gridform');
+                        if (dependencyTab) {
+                            var dependencyTabValid = dependencyTab['ej2_instances'][0].validate();
+                            if (!dependencyTabValid) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                }
+                else if (this.storeResourceTab || this.firstOccuringTab == "Resources") {
+                    if (this.firstOccuringTab == "Resources") {
+                        var element = e.target.closest('#' + this.parent.element.id + '_dialog');
+                        var resourceTab = element.querySelector('.e-gridform');
+                        if (resourceTab) {
+                            var resourceTabValid = resourceTab['ej2_instances'][0].validate();
+                            if (!resourceTabValid) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                    else {
+                        var resourceTab = this.storeResourceTab.querySelector('.e-gridform');
+                        if (resourceTab) {
+                            var resourceTabValid = resourceTab['ej2_instances'][0].validate();
+                            if (!resourceTabValid) {
+                                target.style.pointerEvents = '';
+                                return;
+                            }
+                        }
+                    }
+                }
+            }
             this.initiateDialogSave();
             target.style.pointerEvents = 'auto';
+            this.singleTab = false;
+            this.isAddingDialog = false;
+            this.isEditingDialog = false;
         }
     };
     /**
@@ -665,6 +775,11 @@ var DialogEdit = /** @class */ (function () {
                     element: _this.dialog,
                     cancel: false
                 };
+                var columns = _this.parent.treeGrid.grid.getColumns();
+                var isValidateColumn = columns.some(function (obj) { return obj.validationRules; });
+                if (isValidateColumn) {
+                    _this.changeFormObj(actionCompleteArgs.element, false);
+                }
                 _this.parent.trigger('actionComplete', actionCompleteArgs, function (actionCompleteArg) {
                     if (!isNullOrUndefined(_this.parent.loadingIndicator) && _this.parent.loadingIndicator.indicatorType === "Shimmer") {
                         _this.parent.hideMaskRow();
@@ -679,9 +794,276 @@ var DialogEdit = /** @class */ (function () {
             }
         });
     };
+    DialogEdit.prototype.changeFormObj = function (actionCompleteArgs, isCustomTab) {
+        if (!this.storeColumn) {
+            this.storeColumn = this.parent.treeGrid.grid.getColumns();
+        }
+        if (!this.taskfields) {
+            this.taskfields = this.parent.taskFields['properties'];
+        }
+        if (!this.storeValidTab) {
+            this.storeValidTab = this.getFilteredDialogFields();
+        }
+        var typeOrder = ['General', 'Resources', 'Dependency', 'Custom'];
+        // Custom comparator function to sort by type order
+        function customComparator(a, b) {
+            var typeA = a.type || ''; // Default to empty string if type is missing
+            var typeB = b.type || '';
+            var indexA = typeOrder.indexOf(typeA);
+            var indexB = typeOrder.indexOf(typeB);
+            return indexA - indexB;
+        }
+        // Sort the array based on the custom comparator
+        if (this.storeValidTab) {
+            this.storeValidTab.sort(customComparator);
+        }
+        if (this.customFieldColumn.length === 0 || this.taskFieldColumn.length === 0) {
+            this.validateColumn(this.storeColumn, this.taskfields, this.storeValidTab);
+        }
+        if ((this.isFromAddDialog || this.isFromEditDialog) && this.isSingleCustomTab()) {
+            isCustomTab = true;
+            this.singleTab = true;
+        }
+        if (this.isFromAddDialog) {
+            if (this.parent.addDialogFields.length > 1) {
+                if (this.parent.addDialogFields[0].type === 'Resources'
+                    || this.parent.addDialogFields[0].type === 'Dependency') {
+                    this.firstOccuringTab = this.parent.addDialogFields[0].type;
+                }
+            }
+            if (this.parent.addDialogFields.length == 1) {
+                this.firstOccuringTab = this.parent.addDialogFields[0].type;
+            }
+        }
+        else if (this.isFromEditDialog) {
+            if (this.parent.editDialogFields.length > 1) {
+                if (this.parent.editDialogFields[0].type === 'Resources'
+                    || this.parent.editDialogFields[0].type === 'Dependency') {
+                    this.firstOccuringTab = this.parent.editDialogFields[0].type;
+                }
+            }
+            if (this.parent.editDialogFields.length == 1) {
+                this.firstOccuringTab = this.parent.editDialogFields[0].type;
+            }
+        }
+        if (this.isFromEditDialog) {
+            if (this.parent.editDialogFields.length > 1) {
+                if (this.parent.editDialogFields[0].type == 'Custom') {
+                    isCustomTab = true;
+                }
+            }
+        }
+        if (this.isFromAddDialog) {
+            if (this.parent.addDialogFields.length > 1) {
+                if (this.parent.addDialogFields[0].type == 'Custom') {
+                    isCustomTab = true;
+                }
+            }
+        }
+        if (isCustomTab) {
+            this.CustomformObj = actionCompleteArgs.querySelector('.e-edit-form-row');
+            if (this.CustomformObj === null) {
+                return;
+            }
+            var validationRulesArray = {};
+            for (var i = 0; i < this.customFieldColumn.length; i++) {
+                var column = this.customFieldColumn[parseInt(i.toString(), 10)];
+                if (!column.visible) {
+                    continue;
+                }
+                if (column.validationRules) {
+                    validationRulesArray[column.field] = column.validationRules;
+                }
+            }
+            if (Object.keys(validationRulesArray).length > 0) {
+                this.CustomformObj = this.createFormObj(this.CustomformObj, validationRulesArray);
+            }
+        }
+        else {
+            this.formObj = actionCompleteArgs.querySelector('.e-edit-form-row');
+            if (this.formObj === null) {
+                return;
+            }
+            var validationRulesArray = {};
+            for (var i = 0; i < this.taskFieldColumn.length; i++) {
+                var column = this.taskFieldColumn[parseInt(i.toString(), 10)];
+                if (!column.visible) {
+                    continue;
+                }
+                if (column.validationRules) {
+                    validationRulesArray[column.field] = column.validationRules;
+                }
+            }
+            if (Object.keys(validationRulesArray).length > 0) {
+                this.formObj = this.createFormObj(this.formObj, validationRulesArray);
+            }
+        }
+        if (this.isFromAddDialog == true || this.isFromEditDialog) {
+            this.isAddingDialog = this.isFromAddDialog;
+            this.isEditingDialog = this.isFromEditDialog;
+        }
+        this.isFromAddDialog = false;
+        this.isFromEditDialog = false;
+        isCustomTab = false;
+    };
+    DialogEdit.prototype.getFilteredDialogFields = function () {
+        var dialogFields = this.isFromAddDialog
+            ? this.parent.addDialogFields
+            : this.parent.editDialogFields;
+        if (dialogFields.length !== 0) {
+            return dialogFields.filter(function (obj) { return obj.type === "General" || obj.type === "Custom"; });
+        }
+        return null;
+    };
+    DialogEdit.prototype.isSingleCustomTab = function () {
+        var dialogFields = this.isFromAddDialog
+            ? this.parent.addDialogFields
+            : this.parent.editDialogFields;
+        return this.isFromAddDialog || this.isFromEditDialog
+            ? dialogFields.length === 1 && dialogFields[0].type === 'Custom'
+            : false;
+    };
+    DialogEdit.prototype.validateColumn = function (storeColumn, taskfields, storeValidTab) {
+        var _this = this;
+        storeColumn.forEach(function (column) {
+            var field = column.field;
+            var isValueMatching = false;
+            var taskfieldValues = [];
+            if (_this.parent.customColumns.indexOf(field) === -1) {
+                isValueMatching = true;
+            }
+            if (isValueMatching) {
+                if ((_this.isFromAddDialog || _this.isFromEditDialog) && storeValidTab) {
+                    if (storeValidTab.some(function (obj) { return obj.fields.includes(column.field); })) {
+                        _this.taskFieldColumn.push(column);
+                    }
+                }
+                else {
+                    _this.taskFieldColumn.push(column);
+                }
+            }
+            else {
+                if ((_this.isFromAddDialog || _this.isFromEditDialog) && storeValidTab) {
+                    if (storeValidTab.some(function (obj) { return obj.fields.includes(column.field); })) {
+                        _this.customFieldColumn.push(column);
+                    }
+                }
+                else {
+                    _this.customFieldColumn.push(column);
+                }
+            }
+        });
+    };
+    DialogEdit.prototype.createFormObj = function (form, rules) {
+        var _this = this;
+        return new FormValidator(form, {
+            rules: rules,
+            locale: this.parent.locale,
+            validationComplete: function (args) {
+                _this.validationComplete(args);
+            },
+            customPlacement: function (inputElement, error) {
+                var nameAttribute = inputElement.getAttribute('name');
+                if (nameAttribute) {
+                    var columnName = nameAttribute;
+                    _this.valErrorPlacement(inputElement, error, columnName);
+                }
+            }
+        });
+    };
+    DialogEdit.prototype.valErrorPlacement = function (inputElement, error, columnName) {
+        var id = columnName + "-tooltip";
+        var elem = this.getElemTable(inputElement);
+        if (!elem) {
+            this.createTooltip(inputElement, error, id);
+        }
+        else {
+            var tooltipContent = elem.querySelector('.e-tip-content');
+            if (tooltipContent) {
+                tooltipContent.innerHTML = error.outerHTML;
+            }
+        }
+    };
+    DialogEdit.prototype.createTooltip = function (inputElement, errorMessage, id, display) {
+        if (display === void 0) { display = 'block'; }
+        var existingTooltip = document.getElementById(id);
+        if (existingTooltip) {
+            existingTooltip.remove();
+        }
+        var parentElement = inputElement.parentElement;
+        if (parentElement) {
+            parentElement.style.position = 'relative';
+        }
+        var tooltipContainer = document.createElement('div');
+        tooltipContainer.className = 'e-tooltip-wrap e-lib e-control e-popup e-griderror';
+        tooltipContainer.style.display = display;
+        tooltipContainer.style.zIndex = '1000';
+        var labelId = id + "-label";
+        var tooltipLabel = document.createElement('div');
+        tooltipLabel.id = labelId;
+        tooltipLabel.className = 'sr-only';
+        var tooltipContent = document.createElement('div');
+        tooltipContent.className = 'e-tip-content';
+        var errorMessageElement = document.createElement('div');
+        errorMessageElement.className = 'error-message';
+        errorMessageElement.appendChild(errorMessage.cloneNode(true));
+        var arrow = document.createElement('div');
+        arrow.className = 'e-arrow-tip e-tip-top';
+        arrow.appendChild(document.createElement('div')).className = 'e-arrow-tip-outer e-tip-top';
+        arrow.appendChild(document.createElement('div')).className = 'e-arrow-tip-inner e-tip-top';
+        tooltipContainer.setAttribute('aria-labelledby', labelId);
+        tooltipContent.appendChild(errorMessageElement);
+        tooltipContainer.appendChild(tooltipContent);
+        tooltipContainer.appendChild(arrow);
+        tooltipContainer.style.top = '125%';
+        tooltipContainer.style.left = '50%';
+        tooltipContainer.style.transform = 'translateX(-50%)';
+        if (parentElement) {
+            parentElement.appendChild(tooltipLabel);
+            parentElement.appendChild(tooltipContainer);
+        }
+    };
+    DialogEdit.prototype.getElemTable = function (inputElement) {
+        var parentElement = inputElement.parentElement;
+        if (parentElement) {
+            return parentElement.querySelector(".e-tooltip-wrap");
+        }
+        return null;
+    };
+    DialogEdit.prototype.validationComplete = function (args) {
+        var elem = this.getElemTable(args.element);
+        if (elem) {
+            if (args.status === 'failure') {
+                elem.style.display = '';
+            }
+            else {
+                elem.style.display = 'none';
+            }
+        }
+    };
     DialogEdit.prototype.tabSelectedEvent = function (args) {
         var ganttObj = this.parent;
         var id = args.selectedContent.childNodes[0].id;
+        if (id == ganttObj.element.id + 'DependencyTabContainer') {
+            this.storeDependencyTab = args.selectedContent;
+        }
+        if (id == ganttObj.element.id + 'ResourcesTabContainer') {
+            this.storeResourceTab = args.selectedContent;
+        }
+        if (id == ganttObj.element.id + 'Custom0TabContainer') {
+            var columns = this.parent.treeGrid.grid.getColumns();
+            var isValidateColumn = columns.some(function (obj) { return obj.validationRules; });
+            if (isValidateColumn) {
+                this.changeFormObj(args.selectedContent, true);
+            }
+        }
+        if (id == ganttObj.element.id + 'GeneralTabContainer') {
+            var columns = this.parent.treeGrid.grid.getColumns();
+            var isValidateColumn = columns.some(function (obj) { return obj.validationRules; });
+            if (isValidateColumn) {
+                this.changeFormObj(args.selectedContent, false);
+            }
+        }
         if (this.parent.isAdaptive) {
             this.responsiveTabContent(id, ganttObj);
         }
@@ -985,7 +1367,7 @@ var DialogEdit = /** @class */ (function () {
     DialogEdit.prototype.validateDuration = function (ganttData) {
         var ganttProp = ganttData.ganttProperties;
         if (!this.dialogEditValidationFlag) {
-            if (isNullOrUndefined(ganttProp.duration)) {
+            if (isNullOrUndefined(ganttProp.duration) && !isScheduledTask(ganttProp) && !isNullOrUndefined(ganttProp.startDate)) {
                 this.parent.setRecordValue('endDate', null, ganttProp, true);
                 this.parent.setRecordValue('isMilestone', false, ganttProp, true);
             }