@syncfusion/ej2-querybuilder 26.1.38 → 26.1.42

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

@@ -1081,7 +1081,7 @@ let QueryBuilder = class QueryBuilder extends Component {
                         popupHeight: ((this.columns.length > 5) ? height : 'auto'), changeOnBlur: false,
                         change: this.changeField.bind(this), value: !isNullOrUndefined(ddlValue) ? [ddlValue] : null,
                         open: this.popupOpen.bind(this, false), treeSettings: { expandOn: 'Click' },
-                        cssClass: 'e-qb-ddt'
+                        cssClass: 'e-qb-ddt', filtering: this.dropdownTreeFiltering.bind(this), close: this.dropdownTreeClose.bind(this)
                     };
                     if (this.fieldModel) {
                         ddlField = Object.assign({}, ddlField, this.fieldModel);
@@ -1151,14 +1151,80 @@ let QueryBuilder = class QueryBuilder extends Component {
             this.setMultiConnector(ruleElem);
         }
     }
+    dropdownTreeFiltering(args) {
+        // eslint-disable-next-line @typescript-eslint/no-this-alias
+        const proxy = this;
+        let ruleElemID = '';
+        const srcElement = args.event.srcElement;
+        const isClearIcon = srcElement.classList.contains('e-clear-icon');
+        const inputElem = isClearIcon ? srcElement.parentElement.querySelector('.e-textbox') : srcElement;
+        ruleElemID = inputElem.id.split('_filterkey')[0];
+        const ruleElem = document.getElementById(ruleElemID);
+        this.ddTree = getComponent(ruleElem.querySelector('input.e-dropdowntree'), 'dropdowntree');
+        const hierarchicalData = extend([], this.columns, [], true);
+        // Cancel the default filtering.
+        args.cancel = true;
+        if (args.text === '') {
+            this.changeDataSource(hierarchicalData);
+        }
+        else {
+            const matchedDataSource = hierarchicalData
+                .map((data) => this.nestedChildFilter(args.text, data))
+                .filter((filteredChild) => filteredChild !== null);
+            this.changeDataSource(matchedDataSource);
+            setTimeout(() => {
+                proxy.ddTree.treeObj.expandAll();
+            }, 100);
+        }
+    }
+    changeDataSource(data) {
+        this.ddTree.treeObj.fields = {
+            dataSource: data,
+            value: 'field',
+            text: 'label',
+            child: 'columns',
+            expanded: 'expanded'
+        };
+        this.ddTree.treeObj.refresh();
+    }
+    nestedChildFilter(value, node) {
+        const children = node[this.ddTree.fields.child];
+        if (!children) {
+            return this.isMatchedNode(value, node) ? node : null;
+        }
+        const matchedChildren = children
+            .map((child) => this.nestedChildFilter(value, child))
+            .filter((filteredChild) => filteredChild !== null);
+        if (matchedChildren.length) {
+            node[this.ddTree.fields.child] = matchedChildren;
+            return node;
+        }
+        else {
+            node[this.ddTree.fields.child] = children;
+            return this.isMatchedNode(value, node) ? node : null;
+        }
+    }
+    isMatchedNode(value, node) {
+        const checkValue = node[this.ddTree.fields.text].toLowerCase();
+        value = value ? value.toLowerCase() : '';
+        return checkValue.indexOf(value) !== -1;
+    }
+    dropdownTreeClose() {
+        if (this.ddTree) {
+            this.changeDataSource(this.columns);
+        }
+        this.ddTree = null;
+    }
     updateDropdowntreeDS(columns) {
         for (let i = 0; i < columns.length; i++) {
             if (columns[parseInt(i.toString(), 10)].type === 'object') {
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
                 if (this.isAngular && columns[parseInt(i.toString(), 10)].template) {
                     delete columns[parseInt(i.toString(), 10)].template;
                 }
                 columns[parseInt(i.toString(), 10)].selectable = false;
                 this.updateDropdowntreeDS(columns[parseInt(i.toString(), 10)].columns);
+                // eslint-disable-next-line @typescript-eslint/no-explicit-any
             }
             else if (this.isAngular && columns[parseInt(i.toString(), 10)].template) {
                 delete columns[parseInt(i.toString(), 10)].template;
@@ -1323,10 +1389,12 @@ let QueryBuilder = class QueryBuilder extends Component {
                     }
                     if (excludeOprs.indexOf(rule.rules[index].operator) < -1 &&
                         (isNullOrUndefined(rule.rules[index].value) &&
-                            rule.rules[index].type !== 'date') || rule.rules[index].value === '' ||
+                            rule.rules[index].type !== 'date') || rule.rules[index].value === '' || rule.rules[index].value === null ||
                         (rule.rules[index].value instanceof Array && valArray.length < 1)) {
                         const valElem = tempElem.querySelectorAll('.e-rule-value .e-control');
-                        isValid = false;
+                        if (excludeOprs.indexOf(rule.rules[index].operator) < 0) {
+                            isValid = false;
+                        }
                         for (let j = 0, jLen = valElem.length; j < jLen; j++) {
                             const element = valElem[j];
                             let elem;
@@ -1341,6 +1409,18 @@ let QueryBuilder = class QueryBuilder extends Component {
                             }
                             j++;
                         }
+                        // eslint-disable-next-line @typescript-eslint/no-explicit-any
+                    }
+                    else if (rule.rules[index].type === 'date' && (rule.rules[index].value === null || rule.rules[index].value.indexOf(null) > -1)) {
+                        const valElem = tempElem.querySelectorAll('.e-rule-value .e-control');
+                        if (excludeOprs.indexOf(rule.rules[index].operator) < 0) {
+                            isValid = false;
+                        }
+                        for (let j = 0, jLen = valElem.length; j < jLen; j++) {
+                            if (valElem[j].parentElement.className.indexOf('e-tooltip') < 0 && valElem[j].className.indexOf('e-tooltip') < 0 && (isNullOrUndefined(rule.rules[index].value) || rule.rules[index].value[j] == null)) {
+                                this.renderToolTip(valElem[j].parentElement);
+                            }
+                        }
                     }
                 }
                 else if ((dropDownObj && dropDownObj.element && isNullOrUndefined(dropDownObj.index)) ||
@@ -2092,6 +2172,9 @@ let QueryBuilder = class QueryBuilder extends Component {
             // eslint-disable-next-line @typescript-eslint/no-explicit-any
             element = args.element;
         }
+        if (!element) {
+            return;
+        }
         if (element.className.indexOf('e-day') > -1 || element.className.indexOf('e-today') > -1 || element.className.indexOf('e-cell') > -1) {
             const calenderArgs = args;
             element = calenderArgs.element;
@@ -3717,6 +3800,9 @@ let QueryBuilder = class QueryBuilder extends Component {
                 if (valElem[1] && valElem[1].parentElement.className.indexOf('e-tooltip') > -1) {
                     getComponent(valElem[1].parentElement, 'tooltip').destroy();
                 }
+                if (valElem[2] && valElem[2].parentElement.className.indexOf('e-tooltip') > -1) {
+                    getComponent(valElem[2].parentElement, 'tooltip').destroy();
+                }
             }
         }
     }
@@ -6482,6 +6568,7 @@ let QueryBuilder = class QueryBuilder extends Component {
         let grpCount;
         let operator;
         let isLeftOpened = false;
+        let isNotOpened = false;
         for (let i = 0, iLen = parser.length; i < iLen; i++) {
             if (parser[i][0] === 'Literal') {
                 const column = this.getColumn(parser[i][1]);
@@ -6617,6 +6704,7 @@ let QueryBuilder = class QueryBuilder extends Component {
             }
             else if (parser[i][0] === 'Left') {
                 if (!(parser[0][0] === 'Left') && (parser[i - 1][1] === 'not' || sqlLocale && this.l10n.getConstant('NOT').toLowerCase() === parser[i - 1][1])) {
+                    isNotOpened = true;
                     continue;
                 }
                 this.parser = parser.splice(i + 1, iLen - (i + 1));
@@ -6647,6 +6735,10 @@ let QueryBuilder = class QueryBuilder extends Component {
                 }
             }
             else if (parser[i][0] === 'Right') {
+                if (isNotOpened && parser[i + 1][0] === 'Right') {
+                    isNotOpened = false;
+                    continue;
+                }
                 this.parser = parser.splice(i + 1, iLen - (i + 1));
                 levelColl.pop(); //To get the parent Group
                 rules = this.rule;