@acorex/components 3.0.31 → 3.0.35

package/bundles/acorex-components.umd.js

@@ -7774,7 +7774,6 @@
             configurable: true
         });
         AXNumberBoxComponent.prototype.calcSeparator = function (num) {
-            debugger;
             if (this.showSeparator) {
                 return num + (+(num / 3));
             }
@@ -9630,6 +9629,7 @@
         function AXQueryBuilderRuleComponent() {
             var _this = this;
             this.isEditing = true;
+            this.mode = 'new';
             this.fields = [];
             this.onRuleDelete = new core.EventEmitter();
             this.ruleChanged = new core.EventEmitter();
@@ -9813,7 +9813,6 @@
         };
         AXQueryBuilderRuleComponent.prototype.captionChange = function (e) {
             var _this = this;
-            debugger;
             if (e.selectedItems[0]) {
                 this.rule.caption = e.selectedItems[0].caption;
                 this.rule.dataField = e.selectedItems[0].dataField;
@@ -9961,6 +9960,10 @@
             core.Input(),
             __metadata("design:type", AXQueryBuilderGroup)
         ], AXQueryBuilderRuleComponent.prototype, "parent", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], AXQueryBuilderRuleComponent.prototype, "mode", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", Array)
@@ -9976,7 +9979,7 @@
         AXQueryBuilderRuleComponent = __decorate([
             core.Component({
                 selector: 'ax-query-rule',
-                template: "<div class=\"condition\" *ngIf=\"parent\">\r\n    <div class=\"text {{parent.condition}}\">\r\n        <span>{{parent.condition}}</span>\r\n    </div>\r\n</div>\r\n<div class=\"handler\">\r\n    <i class=\"far fa-grip-lines-vertical\"></i>\r\n</div>\r\n\r\n<div class=\"caption\" [ngClass]=\"{'editable': isEditing}\">\r\n    <ng-container *ngIf=\"isEditing;else fieldsTemplate\">\r\n        <ax-form-group>\r\n            <ax-select-box (selectionChanged)=\"captionChange($event)\" allowNull=\"false\"\r\n                [(selectedItems)]=\"rule.dataFieldItem\" textField=\"caption\" valueField=\"dataField\" [items]=\"fields\"\r\n                size=\"sm\" mode=\"single\">\r\n            </ax-select-box>\r\n        </ax-form-group>\r\n    </ng-container>\r\n    <ng-template #fieldsTemplate>\r\n        <div (click)=\"handleEditClick()\">\r\n            {{rule.caption}}\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"operator\" [ngClass]=\"{'editable': isEditing,'radius':!showValue}\">\r\n    <ng-container *ngIf=\"isEditing;else operatorTemplate\">\r\n        <ax-form-group>\r\n            <ax-select-box *ngIf=\"showOperatorSelectBox\" [(selectedValues)]=\"rule.operator\" #selectBox\r\n                (selectedItemsChange)=\"operatorChange($event)\" allowNull=\"false\" size=\"sm\" mode=\"single\">\r\n                <ax-data-source [provideData]=\"provideDataOperator\">\r\n                </ax-data-source>\r\n            </ax-select-box>\r\n        </ax-form-group>\r\n    </ng-container>\r\n    <ng-template #operatorTemplate>\r\n        <div class=\"text\" (click)=\"handleEditClick()\">\r\n            {{('queryBuilder.'+rule.operator) | trans}}\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n<div *ngIf=\"showValue\" class=\"value\" [ngClass]=\"{'editable': isEditing}\">\r\n    <ng-container *ngIf=\"isEditing;else valueTemplate\">\r\n\r\n        <div *ngIf=\" rule.control && !isOnDemandLabel\" [ngSwitch]=\"rule.control.type\">\r\n            <div *ngSwitchCase=\"'textBox'\">\r\n                <ax-form-group>\r\n                    <ax-text-box (onValueChanged)=\"valueChange($event)\" placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\"\r\n                        [(value)]=\"rule.value\" size=\"sm\">\r\n                    </ax-text-box>\r\n                </ax-form-group>\r\n            </div>\r\n            <div *ngSwitchCase=\"'selectBox'\">\r\n                <ax-form-group>\r\n                    <ax-select-box *ngIf=\"showSelectBox\" [mode]=\"getOption('mode')\"\r\n                        [remoteOperation]=\"getOption('remoteOperation')\" [valueField]=\"getOption('valueField')\"\r\n                        placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\" [textField]=\"getOption('textField')\"\r\n                        [(selectedItems)]=\"rule.valueItem\" (selectedItemsChange)=\"selectedItemsChange($event)\" size=\"sm\"\r\n                        #selectBoxValue>\r\n                        <ax-data-source [provideData]=\"getProvideData\"></ax-data-source>\r\n                    </ax-select-box>\r\n                </ax-form-group>\r\n            </div>\r\n\r\n            <div *ngSwitchCase=\"'numberBox'\">\r\n                <ax-form-group>\r\n                    <ax-number-box (onValueChanged)=\"valueChange($event)\" placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\"\r\n                        [(value)]=\"rule.value\" size=\"sm\">\r\n                    </ax-number-box>\r\n                </ax-form-group>\r\n            </div>\r\n            <div *ngSwitchCase=\"'datePicker'\">\r\n\r\n\r\n            </div>\r\n            <div *ngSwitchCase=\"'boolean'\">\r\n\r\n                <ax-form-group>\r\n                    <ax-select-box #selectBoxBoolean (selectedItemsChange)=\"valueBooleanChange($event)\"\r\n                        allowNull=\"false\" [selectedValues]=\"rule.value\" size=\"sm\" mode=\"single\">\r\n                        <ax-data-source [provideData]=\"provideDataBoolean\">\r\n                        </ax-data-source>\r\n                    </ax-select-box>\r\n                </ax-form-group>\r\n\r\n            </div>\r\n            <div *ngSwitchDefault>\r\n                <ax-form-group>\r\n                    <ax-text-box (onValueChanged)=\"valueChange($event)\" placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\"\r\n                        [(value)]=\"rule.value\" size=\"sm\">\r\n                    </ax-text-box>\r\n\r\n                </ax-form-group>\r\n\r\n            </div>\r\n        </div>\r\n\r\n        <div *ngIf=\"isOnDemandLabel\">\r\n\r\n            <ax-text-box #textBoxNameValue [value]=\"getOnDemandName(rule.onDemandLabel)\"\r\n                (onValueChanged)=\"onDemandLabelChange($event)\" placeholder=\"\u0646\u0627\u0645 \u0645\u062A\u063A\u06CC\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\" size=\"sm\">\r\n                <!-- <ax-validation>\r\n                    <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n                </ax-validation> -->\r\n            </ax-text-box>\r\n\r\n\r\n        </div>\r\n\r\n    </ng-container>\r\n    <ng-template #valueTemplate>\r\n        <div (click)=\"handleEditClick()\">\r\n\r\n            {{rule.text}}\r\n\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"buttons-list\">\r\n    <div *ngIf=\"showValue && isEditing\" class=\"button variable\" [ngClass]=\"{'active-button': isOnDemandLabel}\">\r\n        <i class=\"far fa-dollar-sign\"></i>\r\n        <ax-check-box [value]=\"isOnDemandLabel\" (onClick)=\"onDemandLabel($event)\">\r\n        </ax-check-box>\r\n    </div>\r\n\r\n    <div class=\"button commit\" (click)=\"handleCommitClick()\" *ngIf=\"isEditing\">\r\n        <i class=\"far fa-check\"></i>\r\n    </div>\r\n    <div class=\"button remove\" (click)=\"handleRemoveClick()\">\r\n        <i class=\"far fa-times\"></i>\r\n    </div>\r\n</div>",
+                template: "<div class=\"condition\" *ngIf=\"parent\">\r\n    <div class=\"text {{parent.condition}}\">\r\n        <span>{{parent.condition}}</span>\r\n    </div>\r\n</div>\r\n<div class=\"handler\">\r\n    <i class=\"far fa-grip-lines-vertical\"></i>\r\n</div>\r\n\r\n<div class=\"caption\" [ngClass]=\"{'editable': isEditing}\">\r\n    <ng-container *ngIf=\"isEditing;else fieldsTemplate\">\r\n        <ax-form-group>\r\n            <ax-select-box [readonly]=\"mode == 'edit'\" (selectionChanged)=\"captionChange($event)\" allowNull=\"false\"\r\n                [(selectedItems)]=\"rule.dataFieldItem\" textField=\"caption\" valueField=\"dataField\" [items]=\"fields\"\r\n                mode=\"single\">\r\n            </ax-select-box>\r\n        </ax-form-group>\r\n    </ng-container>\r\n    <ng-template #fieldsTemplate>\r\n        <div (click)=\"handleEditClick()\">\r\n            {{rule.caption}}\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"operator\" [ngClass]=\"{'editable': isEditing,'radius':!showValue}\">\r\n    <ng-container *ngIf=\"isEditing;else operatorTemplate\">\r\n        <ax-form-group>\r\n            <ax-select-box [readonly]=\"mode == 'edit'\" *ngIf=\"showOperatorSelectBox\" [(selectedValues)]=\"rule.operator\"\r\n                #selectBox (selectedItemsChange)=\"operatorChange($event)\" allowNull=\"false\" mode=\"single\">\r\n                <ax-data-source [provideData]=\"provideDataOperator\">\r\n                </ax-data-source>\r\n            </ax-select-box>\r\n        </ax-form-group>\r\n    </ng-container>\r\n    <ng-template #operatorTemplate>\r\n        <div class=\"text\" (click)=\"handleEditClick()\">\r\n            {{('queryBuilder.'+rule.operator) | trans}}\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n<div *ngIf=\"showValue\" class=\"value\" [ngClass]=\"{'editable': isEditing}\">\r\n    <ng-container *ngIf=\"isEditing;else valueTemplate\">\r\n\r\n        <div *ngIf=\" rule.control && !isOnDemandLabel\" [ngSwitch]=\"rule.control.type\">\r\n            <div *ngSwitchCase=\"'textBox'\">\r\n                <ax-form-group>\r\n                    <ax-text-box (onValueChanged)=\"valueChange($event)\" placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\"\r\n                        [(value)]=\"rule.value\">\r\n                    </ax-text-box>\r\n                </ax-form-group>\r\n            </div>\r\n            <div *ngSwitchCase=\"'selectBox'\">\r\n                <ax-form-group>\r\n                    <ax-select-box *ngIf=\"showSelectBox\" [mode]=\"getOption('mode')\"\r\n                        [remoteOperation]=\"getOption('remoteOperation')\" [valueField]=\"getOption('valueField')\"\r\n                        placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\" [textField]=\"getOption('textField')\"\r\n                        [(selectedItems)]=\"rule.valueItem\" (selectedItemsChange)=\"selectedItemsChange($event)\"\r\n                        #selectBoxValue>\r\n                        <ax-data-source [provideData]=\"getProvideData\"></ax-data-source>\r\n                    </ax-select-box>\r\n                </ax-form-group>\r\n            </div>\r\n\r\n            <div *ngSwitchCase=\"'numberBox'\">\r\n                <ax-form-group>\r\n                    <ax-number-box (onValueChanged)=\"valueChange($event)\" placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\"\r\n                        [(value)]=\"rule.value\">\r\n                    </ax-number-box>\r\n                </ax-form-group>\r\n            </div>\r\n            <div *ngSwitchCase=\"'datePicker'\">\r\n\r\n\r\n            </div>\r\n            <div *ngSwitchCase=\"'boolean'\">\r\n\r\n                <ax-form-group>\r\n                    <ax-select-box #selectBoxBoolean (selectedItemsChange)=\"valueBooleanChange($event)\"\r\n                        allowNull=\"false\" [selectedValues]=\"rule.value\" mode=\"single\">\r\n                        <ax-data-source [provideData]=\"provideDataBoolean\">\r\n                        </ax-data-source>\r\n                    </ax-select-box>\r\n                </ax-form-group>\r\n\r\n            </div>\r\n            <div *ngSwitchDefault>\r\n                <ax-form-group>\r\n                    <ax-text-box (onValueChanged)=\"valueChange($event)\" placeholder=\"\u0645\u0642\u062F\u0627\u0631 \u0645\u0648\u0631\u062F \u0646\u0638\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\"\r\n                        [(value)]=\"rule.value\">\r\n                    </ax-text-box>\r\n\r\n                </ax-form-group>\r\n\r\n            </div>\r\n        </div>\r\n\r\n        <div *ngIf=\"isOnDemandLabel\">\r\n\r\n            <ax-text-box #textBoxNameValue [value]=\"getOnDemandName(rule.onDemandLabel)\"\r\n                (onValueChanged)=\"onDemandLabelChange($event)\" placeholder=\"\u0646\u0627\u0645 \u0645\u062A\u063A\u06CC\u0631 \u062E\u0648\u062F \u0631\u0627 \u0648\u0627\u0631\u062F \u06A9\u0646\u06CC\u062F\">\r\n                <!-- <ax-validation>\r\n                    <ax-validation-rule type=\"required\"></ax-validation-rule>\r\n                </ax-validation> -->\r\n            </ax-text-box>\r\n\r\n\r\n        </div>\r\n\r\n    </ng-container>\r\n    <ng-template #valueTemplate>\r\n        <div (click)=\"handleEditClick()\">\r\n\r\n            {{rule.text}}\r\n\r\n        </div>\r\n    </ng-template>\r\n</div>\r\n\r\n<div class=\"buttons-list\">\r\n    <div *ngIf=\"showValue && isEditing && mode == 'new'\" class=\"button variable\"\r\n        [ngClass]=\"{'active-button': isOnDemandLabel}\">\r\n        <i class=\"far fa-dollar-sign\"></i>\r\n        <ax-check-box [value]=\"isOnDemandLabel\" (onClick)=\"onDemandLabel($event)\">\r\n        </ax-check-box>\r\n    </div>\r\n\r\n    <div class=\"button commit\" (click)=\"handleCommitClick()\" *ngIf=\"isEditing\">\r\n        <i class=\"far fa-check\"></i>\r\n    </div>\r\n    <div class=\"button remove\" (click)=\"handleRemoveClick()\" *ngIf=\"mode == 'new'\">\r\n        <i class=\"far fa-times\"></i>\r\n    </div>\r\n</div>",
                 host: { class: 'ax ax-query-rule' },
                 encapsulation: core.ViewEncapsulation.None
             }),
@@ -10171,7 +10174,7 @@
                         }
                     }
                     if (_this.canRun) {
-                        _this.popup.open(AXQueryBuilderPopupComponent, { data: { group: group, provideData: provideData }, title: "دریافت مقادیر" }).then(function (c) {
+                        _this.popup.open(AXQueryBuilderPopupComponent, { data: { group: group, provideData: provideData }, title: 'دریافت مقادیر' }).then(function (c) {
                             resolve(c);
                         });
                     }
@@ -10211,10 +10214,119 @@
             }
             //  }
         };
+        AXQueryBuilderService.prototype.getQueryStringSimple = function (group) {
+            return __awaiter(this, void 0, void 0, function () {
+                var _this = this;
+                return __generator(this, function (_a) {
+                    return [2 /*return*/, new Promise(function (resolve, reject) { return __awaiter(_this, void 0, void 0, function () {
+                            var query, id, _a, _b, iterator, item, codeOperator, e_1_1;
+                            var e_1, _c;
+                            return __generator(this, function (_d) {
+                                switch (_d.label) {
+                                    case 0:
+                                        debugger;
+                                        if (group.items.length > 0) {
+                                            query = ' ( ';
+                                        }
+                                        id = 0;
+                                        _d.label = 1;
+                                    case 1:
+                                        _d.trys.push([1, 9, 10, 15]);
+                                        _a = __asyncValues(group.items);
+                                        _d.label = 2;
+                                    case 2: return [4 /*yield*/, _a.next()];
+                                    case 3:
+                                        if (!(_b = _d.sent(), !_b.done)) return [3 /*break*/, 8];
+                                        iterator = _b.value;
+                                        item = group.items[id];
+                                        if (!item.condition) return [3 /*break*/, 5];
+                                        return [4 /*yield*/, this.getQueryStringSimple(item).then(function (c) {
+                                                query = query + c;
+                                            })];
+                                    case 4:
+                                        _d.sent();
+                                        return [3 /*break*/, 6];
+                                    case 5:
+                                        codeOperator = null;
+                                        switch (item.operator) {
+                                            case 'equal':
+                                                codeOperator = '==';
+                                                break;
+                                            case 'not-equal':
+                                                codeOperator = '!=';
+                                                break;
+                                            case 'not-null':
+                                                codeOperator = '!= null';
+                                                break;
+                                            case 'null':
+                                                codeOperator = '== null';
+                                                break;
+                                            case 'gt':
+                                                codeOperator = '>';
+                                                break;
+                                            case 'gte':
+                                                codeOperator = '>=';
+                                                break;
+                                            case 'lt':
+                                                codeOperator = '<';
+                                                break;
+                                            case 'lte':
+                                                codeOperator = '<=';
+                                                break;
+                                            case 'contains':
+                                                codeOperator = item.operator;
+                                                break;
+                                            case 'start-with':
+                                                codeOperator = item.operator;
+                                                break;
+                                            case 'end-with':
+                                                codeOperator = item.operator;
+                                                break;
+                                        }
+                                        debugger;
+                                        query = query + ' ' + item.caption + ' ' + codeOperator + ' ' + item.text;
+                                        _d.label = 6;
+                                    case 6:
+                                        if (id !== group.items.length - 1 && query != ' ( ') {
+                                            query = query + ' ' + group.condition;
+                                        }
+                                        id += 1;
+                                        _d.label = 7;
+                                    case 7: return [3 /*break*/, 2];
+                                    case 8: return [3 /*break*/, 15];
+                                    case 9:
+                                        e_1_1 = _d.sent();
+                                        e_1 = { error: e_1_1 };
+                                        return [3 /*break*/, 15];
+                                    case 10:
+                                        _d.trys.push([10, , 13, 14]);
+                                        if (!(_b && !_b.done && (_c = _a.return))) return [3 /*break*/, 12];
+                                        return [4 /*yield*/, _c.call(_a)];
+                                    case 11:
+                                        _d.sent();
+                                        _d.label = 12;
+                                    case 12: return [3 /*break*/, 14];
+                                    case 13:
+                                        if (e_1) throw e_1.error;
+                                        return [7 /*endfinally*/];
+                                    case 14: return [7 /*endfinally*/];
+                                    case 15:
+                                        if (group.items.length > 0) {
+                                            query = query + ' ) ';
+                                        }
+                                        resolve(query);
+                                        return [2 /*return*/];
+                                }
+                            });
+                        }); })];
+                });
+            });
+        };
         AXQueryBuilderService.prototype.getQueryString = function (group, type) {
             var query = '';
             switch (type) {
                 case 'simple':
+                    debugger;
                     if (group.items.length > 0) {
                         query = ' ( ';
                     }
@@ -10276,6 +10388,7 @@
             this.qs = qs;
             this.collapsed = false;
             this.fields = [];
+            this.mode = 'new';
             //ruleIsEditing: boolean = true;
             this.groupRuleChanged = new core.EventEmitter();
             this.showGroupCondition = false;
@@ -10354,9 +10467,14 @@
             this.ruleChanged(null);
         };
         AXQueryBuilderGroupComponent.prototype.ruleChanged = function (e) {
-            this.group.queryString = this.qs.getQueryString(this.group, 'simple');
-            this.group.queryStringElastic = this.qs.getQueryString(this.group, 'elastic');
-            this.groupRuleChanged.emit({ groups: this.group, component: this });
+            var _this = this;
+            debugger;
+            // this.group.queryString = this.qs.getQueryString(this.group, 'simple');
+            this.qs.getQueryStringSimple(this.group).then(function (c) {
+                _this.group.queryString = c;
+                _this.group.queryStringElastic = _this.qs.getQueryString(_this.group, 'elastic');
+                _this.groupRuleChanged.emit({ groups: _this.group, component: _this });
+            });
         };
         AXQueryBuilderGroupComponent.ctorParameters = function () { return [
             { type: AXQueryBuilderService }
@@ -10381,6 +10499,10 @@
             core.Input(),
             __metadata("design:type", Array)
         ], AXQueryBuilderGroupComponent.prototype, "fields", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], AXQueryBuilderGroupComponent.prototype, "mode", void 0);
         __decorate([
             core.Output(),
             __metadata("design:type", core.EventEmitter)
@@ -10388,7 +10510,7 @@
         AXQueryBuilderGroupComponent = __decorate([
             core.Component({
                 selector: 'ax-query-group',
-                template: "<div class=\"header\">\r\n    <div class=\"condition\" *ngIf=\"parent\">\r\n        <div class=\"text {{parent.condition}}\">\r\n            <span>{{parent.condition }}</span>\r\n        </div>\r\n    </div>\r\n    <div class=\"handler\">\r\n        <i class=\"far fa-grip-lines-vertical\"></i>\r\n    </div>\r\n\r\n    <div class=\"detail {{group.condition}}\" (click)=\"changeDetailMode()\">\r\n        <div class=\"collapsed\" *ngIf=\"collapsed;else expandedTemplate\">\r\n            {{group.queryString}}\r\n        </div>\r\n        <ng-template #expandedTemplate>\r\n            <div class=\"expanded\">\r\n                <strong>{{group.condition == 'OR' ? '\u06CC\u06A9\u06CC \u0627\u0632' : '\u0647\u0645\u0647' }} <span>\u0634\u0631\u0627\u06CC\u0637 \u0632\u06CC\u0631 \u0628\u0631\u0642\u0631\u0627\u0631 \u0628\u0627\u0634\u062F</span> </strong>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n    <div class=\"buttons-list\">\r\n        <div class=\"button remove\" *ngIf=\"parent\" (click)=\"handleRemoveClick()\">\r\n            <i class=\"far fa-times ax-danger-color\"></i>\r\n        </div>\r\n        <div class=\"button edit\" (click)=\"handleChangeClick()\">\r\n            <i class=\"far fa-retweet ax-danger-color\"></i>\r\n        </div>\r\n    </div>\r\n</div>\r\n<div class=\"rules\" *ngIf=\"!collapsed\">\r\n    <!-- <ax-validation-form #form> -->\r\n\r\n    <div *ngFor=\"let item of group.items\" class=\"group-item\">\r\n        <ng-container *ngIf=\"item.condition;else ruleTemplate\">\r\n            <ax-query-group (groupRuleChanged)=\"ruleChanged($event)\" [group]=\"item\" [fields]=\"fields\" [parent]=\"group\">\r\n            </ax-query-group>\r\n        </ng-container>\r\n        <ng-template #ruleTemplate>\r\n            <ax-query-rule #queryRule (ruleChanged)=\"ruleChanged($event)\" (onRuleDelete)=\"ruleDelete($event)\"\r\n                [rule]=\"item\" [fields]=\"fields\" [parent]=\"group\">\r\n            </ax-query-rule>\r\n        </ng-template>\r\n    </div>\r\n    <!-- </ax-validation-form> -->\r\n    <div class=\"group-item\">\r\n        <div class=\"ax-query-rule\">\r\n            <div class=\"condition\">\r\n            </div>\r\n            <div class=\"handler\">\r\n                <i class=\"far fa-grip-lines-vertical\"></i>\r\n            </div>\r\n            <div class=\"add-rule\" (click)=\"addRule()\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>\u0634\u0631\u0637</span>\r\n            </div>\r\n            <div class=\"add-group\" (click)=\"addGroup()\" *ngIf=\"!showGroupCondition\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>\u06AF\u0631\u0648\u0647</span>\r\n            </div>\r\n            <div *ngIf=\"showGroupCondition\" class=\"add-condition OR\" (click)=\"addGroupOR()\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>OR</span>\r\n            </div>\r\n            <div *ngIf=\"showGroupCondition\" class=\"add-condition AND\" (click)=\"addGroupAND()\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>AND</span>\r\n            </div>\r\n\r\n        </div>\r\n    </div>\r\n</div>",
+                template: "<div class=\"header\">\r\n    <div class=\"condition\" *ngIf=\"parent\">\r\n        <div class=\"text {{parent.condition}}\">\r\n            <span>{{parent.condition }}</span>\r\n        </div>\r\n    </div>\r\n    <div class=\"handler\">\r\n        <i class=\"far fa-grip-lines-vertical\"></i>\r\n    </div>\r\n\r\n    <div class=\"detail {{group.condition}}\" (click)=\"changeDetailMode()\">\r\n        <div class=\"collapsed\" *ngIf=\"collapsed;else expandedTemplate\">\r\n            {{group.queryString}}\r\n        </div>\r\n        <ng-template #expandedTemplate>\r\n            <div class=\"expanded\">\r\n                <strong>{{group.condition == 'OR' ? '\u06CC\u06A9\u06CC \u0627\u0632' : '\u0647\u0645\u0647' }} <span>\u0634\u0631\u0627\u06CC\u0637 \u0632\u06CC\u0631 \u0628\u0631\u0642\u0631\u0627\u0631 \u0628\u0627\u0634\u062F</span> </strong>\r\n            </div>\r\n        </ng-template>\r\n    </div>\r\n    <div class=\"buttons-list\">\r\n        <div class=\"button remove\" *ngIf=\"parent && mode=='new'\" (click)=\"handleRemoveClick()\">\r\n            <i class=\"far fa-times ax-danger-color\"></i>\r\n        </div>\r\n        <div class=\"button edit\" *ngIf=\"mode=='new'\" (click)=\"handleChangeClick()\">\r\n            <i class=\"far fa-retweet ax-danger-color\"></i>\r\n        </div>\r\n    </div>\r\n</div>\r\n<div class=\"rules\" *ngIf=\"!collapsed\">\r\n    <!-- <ax-validation-form #form> -->\r\n\r\n    <div *ngFor=\"let item of group.items\" class=\"group-item\">\r\n        <ng-container *ngIf=\"item.condition;else ruleTemplate\">\r\n            <ax-query-group (groupRuleChanged)=\"ruleChanged($event)\" [mode]=\"mode\" [group]=\"item\" [fields]=\"fields\"\r\n                [parent]=\"group\">\r\n            </ax-query-group>\r\n        </ng-container>\r\n        <ng-template #ruleTemplate>\r\n            <ax-query-rule #queryRule (ruleChanged)=\"ruleChanged($event)\" [mode]=\"mode\"\r\n                (onRuleDelete)=\"ruleDelete($event)\" [rule]=\"item\" [fields]=\"fields\" [parent]=\"group\">\r\n            </ax-query-rule>\r\n        </ng-template>\r\n    </div>\r\n    <!-- </ax-validation-form> -->\r\n    <div class=\"group-item\" *ngIf=\"mode=='new'\">\r\n        <div class=\"ax-query-rule\">\r\n            <div class=\"condition\">\r\n            </div>\r\n            <div class=\"handler\">\r\n                <i class=\"far fa-grip-lines-vertical\"></i>\r\n            </div>\r\n            <div class=\"add-rule\" (click)=\"addRule()\" *ngIf=\"mode=='new'\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>\u0634\u0631\u0637</span>\r\n            </div>\r\n            <div class=\"add-group\" (click)=\"addGroup()\" *ngIf=\"!showGroupCondition && mode=='new'\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>\u06AF\u0631\u0648\u0647</span>\r\n            </div>\r\n            <div *ngIf=\"showGroupCondition && mode=='new'\" class=\"add-condition OR\" (click)=\"addGroupOR()\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>OR</span>\r\n            </div>\r\n            <div *ngIf=\"showGroupCondition && mode=='new'\" class=\"add-condition AND\" (click)=\"addGroupAND()\">\r\n                <i class=\"far fa-plus\"></i>&nbsp;&nbsp;<span>AND</span>\r\n            </div>\r\n\r\n        </div>\r\n    </div>\r\n</div>",
                 host: { class: 'ax ax-query-group' },
                 encapsulation: core.ViewEncapsulation.None
             }),
@@ -10403,6 +10525,7 @@
             var _this = _super.call(this) || this;
             _this.ref = ref;
             _this.toast = toast;
+            _this.mode = 'new';
             _this.rootGroup = new AXQueryBuilderGroup();
             _this.fields = [];
             // @Input()
@@ -10412,11 +10535,11 @@
             return _this;
         }
         AXQueryBuilderComponent.prototype.ngOnInit = function () {
-            this.rootGroup.condition = this.query.condition ? this.query.condition : "AND";
+            this.rootGroup.condition = this.query.condition ? this.query.condition : 'AND';
             this.rootGroup.items = this.query.items ? this.query.items : [];
         };
         AXQueryBuilderComponent.prototype.getQueryBuilder = function () {
-            return ({ groups: this.rootGroup });
+            return { groups: this.rootGroup };
         };
         AXQueryBuilderComponent.prototype.ruleChanged = function (e) {
             this.onRuleChanged.emit({ component: this, groups: this.rootGroup });
@@ -10466,6 +10589,10 @@
             core.Input(),
             __metadata("design:type", AXQueryBuilderGroup)
         ], AXQueryBuilderComponent.prototype, "query", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", String)
+        ], AXQueryBuilderComponent.prototype, "mode", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", Array)
@@ -10477,9 +10604,9 @@
         AXQueryBuilderComponent = __decorate([
             core.Component({
                 selector: 'ax-query-builder',
-                template: "<ax-query-group #queryGroup [group]=\"rootGroup\" [fields]=\"fields\" (groupRuleChanged)=\"ruleChanged($event)\">\r\n</ax-query-group>",
+                template: "<ax-query-group #queryGroup [mode]=\"mode\" [group]=\"rootGroup\" [fields]=\"fields\"\r\n    (groupRuleChanged)=\"ruleChanged($event)\">\r\n</ax-query-group>",
                 encapsulation: core.ViewEncapsulation.None,
-                styles: [".ax-query-group{display:flex;flex-direction:column;margin:5px;-webkit-padding-start:0;padding-inline-start:0}.ax-query-group .add-buttons{display:flex;margin:5px;flex-direction:row}.ax-query-group .add-buttons .handler{display:flex;align-items:center;background-color:var(--ax-primary-trans-light-color);color:var(--ax-primary-color);padding:5px;cursor:move;border:1px solid var(--ax-primary-trans-light-color);border-top-right-radius:4px;border-bottom-right-radius:4px}.ax-query-group .buttons-list{-webkit-margin-start:10px;margin-inline-start:10px;display:flex;align-items:center}.ax-query-group .buttons-list .button{cursor:pointer;-webkit-margin-end:.5em;margin-inline-end:.5em;width:2.3em;height:2.3em;display:flex;align-items:center;justify-content:center;border-radius:50px;position:relative}.ax-query-group .buttons-list .button ax-check-box{opacity:0;width:100%;height:100%;position:absolute;z-index:1;left:0;top:0}.ax-query-group .buttons-list .variable{color:var(--ax-warning-color);background:var(--ax-warning-trans-light-color)}.ax-query-group .buttons-list .variable.active-button{background:var(--ax-warning-light-color);color:var(--ax-white-color);opacity:.7}.ax-query-group .buttons-list .commit{color:var(--ax-success-color);background:var(--ax-success-trans-light-color)}.ax-query-group .buttons-list .remove{color:var(--ax-danger-color);background:var(--ax-danger-trans-light-color)}.ax-query-group .buttons-list .edit{color:var(--ax-primary-color);background:var(--ax-primary-trans-light-color)}.ax-query-group .group-item{transition:.5s}.ax-query-group .group-item .condition{width:40px;display:flex;align-items:center;background:linear-gradient(180deg,rgba(2,0,36,0) 49%,var(--ax-gray-light-color) 49%,var(--ax-gray-light-color) 55%,rgba(0,212,255,0) 50%)}.ax-query-group .group-item .condition .text{-webkit-margin-start:-50%;margin-inline-start:-50%;border-radius:50%;width:35px;height:35px;display:flex;align-items:center;justify-content:center}.ax-query-group .group-item .condition .text.OR{background:var(--ax-warning-color);color:var(--ax-warning-fore-color)}.ax-query-group .group-item .condition .text.AND{background:var(--ax-success-color);color:var(--ax-success-fore-color)}.ax-query-group .header{display:flex;flex-direction:row}.ax-query-group .header .handler{display:flex;align-items:center;background-color:var(--ax-light-light-color);color:var(--ax-light-fore-color);padding:5px;cursor:move;border:1px solid var(--ax-light-light-color);border-top-right-radius:4px;border-bottom-right-radius:4px}.ax-query-group .header .caption{padding:10px;background-color:var(--ax-gray-trans-light-color);color:var(--ax-gray-dark-color);font-weight:700;cursor:pointer}.ax-query-group .header .detail{padding:10px;background-color:var(--ax-gray-trans-light-color);border-right:none;border-top-left-radius:50px;border-bottom-left-radius:50px;cursor:pointer}.ax-query-group .header .detail.OR{background-color:var(--ax-warning-trans-light-color)}.ax-query-group .header .detail.AND{background-color:var(--ax-success-trans-light-color)}.ax-query-group .rules{-webkit-margin-start:10px;margin-inline-start:10px;-webkit-border-start:2px solid var(--ax-gray-light-color);border-inline-start:2px solid var(--ax-gray-light-color)}.ax-query-group .rules .rules{-webkit-margin-start:48px;margin-inline-start:48px}.ax-query-group .ax-query-rule{display:flex;margin:5px;flex-direction:row;transition:.5s}.ax-query-group .ax-query-rule .handler{display:flex;align-items:center;background-color:var(--ax-light-light-color);color:var(--ax-light-fore-color);padding:.5em;cursor:move;border:1px solid var(--ax-light-light-color);border-top-right-radius:4px;border-bottom-right-radius:4px}.ax-query-group .ax-query-rule .caption{padding:10px;background-color:var(--ax-gray-trans-light-color);border:1px solid var(--ax-gray-light-color);color:#333;font-weight:700;cursor:pointer}.ax-query-group .ax-query-rule .caption.editable{width:200px}.ax-query-group .ax-query-rule .operator{border-top:1px solid var(--ax-gray-light-color);border-bottom:1px solid var(--ax-gray-light-color);background-color:var(--ax-gray-trans-light-color);padding:10px}.ax-query-group .ax-query-rule .operator.editable{width:200px}.ax-query-group .ax-query-rule .operator .text{color:var(--ax-primary-color);font-weight:700;-webkit-text-decoration:underline dashed;text-decoration:underline dashed;cursor:pointer}.ax-query-group .ax-query-rule .operator.radius{border-top-left-radius:4px;border-bottom-left-radius:4px;border:1px solid var(--ax-gray-light-color);border-right:none}.ax-query-group .ax-query-rule .value{padding:10px;background-color:var(--ax-light-light-color);color:#000;border:1px solid var(--ax-gray-light-color);border-right:none;border-top-left-radius:4px;border-bottom-left-radius:4px;cursor:pointer}.ax-query-group .ax-query-rule .value.editable{width:200px}.ax-query-group .ax-query-rule .add-rule{border-top:1px dashed var(--ax-gray-light-color);border-bottom:1px dashed var(--ax-gray-light-color);color:var(--ax-gray-dark-color);padding:10px;font-weight:700;cursor:pointer}.ax-query-group .ax-query-rule .add-group:hover,.ax-query-group .ax-query-rule .add-rule:hover{background-color:var(--ax-gray-light-color)}.ax-query-group .ax-query-rule .add-condition,.ax-query-group .ax-query-rule .add-group{border-top:1px dashed var(--ax-gray-light-color);border-bottom:1px dashed var(--ax-gray-light-color);color:var(--ax-gray-dark-color);padding:10px;border:1px dashed var(--ax-gray-light-color);border-top-left-radius:4px;border-bottom-left-radius:4px;cursor:pointer}.ax-query-group .ax-query-rule .add-condition.OR{background-color:var(--ax-warning-trans-light-color);color:var(--ax-warning-dark-color)}.ax-query-group .ax-query-rule .add-condition.AND{background-color:var(--ax-success-trans-light-color);color:var(--ax-success-dark-color)}.ax-query-group .ax-query-rule .add-condition:hover.OR{background-color:var(--ax-warning-trans-light-color);color:var(--ax-warning-dark-color)}.ax-query-group .ax-query-rule .add-condition:hover.AND{background-color:var(--ax-success-trans-light-color);color:var(--ax-success-dark-color)}"]
+                styles: [".ax-query-group{display:flex;flex-direction:column;margin:5px;-webkit-padding-start:0;padding-inline-start:0}.ax-query-group .add-buttons{display:flex;margin:5px;flex-direction:row}.ax-query-group .add-buttons .handler{display:flex;align-items:center;background-color:var(--ax-primary-trans-light-color);color:var(--ax-primary-color);padding:5px;cursor:move;border:1px solid var(--ax-primary-trans-light-color);border-start-start-radius:4px;border-end-start-radius:4px}.ax-query-group .buttons-list{-webkit-margin-start:10px;margin-inline-start:10px;display:flex;align-items:center}.ax-query-group .buttons-list .button{cursor:pointer;-webkit-margin-end:.5em;margin-inline-end:.5em;width:2.3em;height:2.3em;display:flex;align-items:center;justify-content:center;border-radius:50px;position:relative}.ax-query-group .buttons-list .button ax-check-box{opacity:0;width:100%;height:100%;position:absolute;z-index:1;left:0;top:0}.ax-query-group .buttons-list .variable{color:var(--ax-warning-color);background:var(--ax-warning-trans-light-color)}.ax-query-group .buttons-list .variable.active-button{background:var(--ax-warning-light-color);color:var(--ax-white-color);opacity:.7}.ax-query-group .buttons-list .commit{color:var(--ax-success-color);background:var(--ax-success-trans-light-color)}.ax-query-group .buttons-list .remove{color:var(--ax-danger-color);background:var(--ax-danger-trans-light-color)}.ax-query-group .buttons-list .edit{color:var(--ax-primary-color);background:var(--ax-primary-trans-light-color)}.ax-query-group .group-item{transition:.5s}.ax-query-group .group-item .condition{width:40px;display:flex;align-items:center;background:linear-gradient(180deg,rgba(2,0,36,0) 49%,var(--ax-gray-light-color) 49%,var(--ax-gray-light-color) 55%,rgba(0,212,255,0) 50%)}.ax-query-group .group-item .condition .text{-webkit-margin-start:-50%;margin-inline-start:-50%;border-radius:50%;width:35px;height:35px;display:flex;align-items:center;justify-content:center}.ax-query-group .group-item .condition .text.OR{background:var(--ax-warning-color);color:var(--ax-warning-fore-color)}.ax-query-group .group-item .condition .text.AND{background:var(--ax-success-color);color:var(--ax-success-fore-color)}.ax-query-group .header{display:flex;flex-direction:row}.ax-query-group .header .handler{display:flex;align-items:center;background-color:var(--ax-light-light-color);color:var(--ax-light-fore-color);padding:5px;cursor:move;border:1px solid var(--ax-light-light-color);border-start-start-radius:4px;border-end-start-radius:4px}.ax-query-group .header .caption{padding:.5rem;background-color:var(--ax-gray-trans-light-color);color:var(--ax-gray-dark-color);font-weight:700;cursor:pointer}.ax-query-group .header .detail{padding:.5rem;background-color:var(--ax-gray-trans-light-color);border-right:none;border-start-end-radius:4px;border-end-end-radius:4px;cursor:pointer}.ax-query-group .header .detail.OR{background-color:var(--ax-warning-trans-light-color)}.ax-query-group .header .detail.AND{background-color:var(--ax-success-trans-light-color)}.ax-query-group .rules{-webkit-margin-start:10px;margin-inline-start:10px;-webkit-border-start:2px solid var(--ax-gray-light-color);border-inline-start:2px solid var(--ax-gray-light-color)}.ax-query-group .rules .rules{-webkit-margin-start:48px;margin-inline-start:48px}.ax-query-group .ax-query-rule{display:flex;margin:5px;flex-direction:row;transition:.5s}.ax-query-group .ax-query-rule .handler{display:flex;align-items:center;background-color:var(--ax-light-light-color);color:var(--ax-light-fore-color);padding:.5em;cursor:move;border:1px solid var(--ax-light-light-color);border-start-start-radius:4px;border-end-start-radius:4px}.ax-query-group .ax-query-rule .caption{padding:.5rem;background-color:var(--ax-gray-trans-light-color);border:1px solid var(--ax-gray-light-color);color:#333;font-weight:700;cursor:pointer}.ax-query-group .ax-query-rule .caption.editable{width:200px}.ax-query-group .ax-query-rule .operator{border-top:1px solid var(--ax-gray-light-color);border-bottom:1px solid var(--ax-gray-light-color);background-color:var(--ax-gray-trans-light-color);padding:.5rem}.ax-query-group .ax-query-rule .operator.editable{width:200px}.ax-query-group .ax-query-rule .operator .text{color:var(--ax-primary-color);font-weight:700;-webkit-text-decoration:underline dashed;text-decoration:underline dashed;cursor:pointer}.ax-query-group .ax-query-rule .operator.radius{border-top-left-radius:4px;border-bottom-left-radius:4px;border:1px solid var(--ax-gray-light-color);border-right:none}.ax-query-group .ax-query-rule .value{padding:.5rem;background-color:var(--ax-light-light-color);color:#000;border:1px solid var(--ax-gray-light-color);border-right:none;border-start-end-radius:4px;border-end-end-radius:4px;cursor:pointer}.ax-query-group .ax-query-rule .value.editable{width:200px}.ax-query-group .ax-query-rule .add-rule{border-top:1px dashed var(--ax-gray-light-color);border-bottom:1px dashed var(--ax-gray-light-color);color:var(--ax-gray-dark-color);padding:.5rem;font-weight:700;cursor:pointer}.ax-query-group .ax-query-rule .add-group:hover,.ax-query-group .ax-query-rule .add-rule:hover{background-color:var(--ax-gray-light-color)}.ax-query-group .ax-query-rule .add-condition,.ax-query-group .ax-query-rule .add-group{border-top:1px dashed var(--ax-gray-light-color);border-bottom:1px dashed var(--ax-gray-light-color);color:var(--ax-gray-dark-color);padding:.5rem;border:1px dashed var(--ax-gray-light-color);border-top-left-radius:4px;border-bottom-left-radius:4px;cursor:pointer}.ax-query-group .ax-query-rule .add-condition.OR{background-color:var(--ax-warning-trans-light-color);color:var(--ax-warning-dark-color)}.ax-query-group .ax-query-rule .add-condition.AND{background-color:var(--ax-success-trans-light-color);color:var(--ax-success-dark-color)}.ax-query-group .ax-query-rule .add-condition:hover.OR{background-color:var(--ax-warning-trans-light-color);color:var(--ax-warning-dark-color)}.ax-query-group .ax-query-rule .add-condition:hover.AND{background-color:var(--ax-success-trans-light-color);color:var(--ax-success-dark-color)}"]
             }),
             __metadata("design:paramtypes", [core.ElementRef, AXToastService])
         ], AXQueryBuilderComponent);
@@ -11682,7 +11809,7 @@
                 imports: [common.CommonModule, AXLoadingModule],
                 exports: [AXTabPageRendererComponent],
                 entryComponents: [AXTabPageRendererComponent, AXTabPageHostComponent],
-                providers: [AXTabPageService],
+                providers: [],
             })
         ], AXTabPageModule);
         return AXTabPageModule;
@@ -13785,7 +13912,10 @@
             //seletedKeyFields set id of nodes and parents
             //selectedFieldName set name of fields that set selectes
             _this.selectedFieldName = null;
-            _this.selectNodesRecursive = 'all';
+            // @Input()
+            // selectNodesRecursive: 'all' | 'parents' | 'childs' | 'none' = 'all'; //leaf
+            _this.checkParents = true;
+            _this.checkChilds = true;
             _this.seletedKeyFields = [];
             _this.keyField = 'id';
             _this.hasChildField = 'child';
@@ -13857,6 +13987,7 @@
                 }
                 if (item.select == true) {
                     if (this.selectionMode === 'multiple') {
+                        this.selectedParents = this.selectedParents.filter(function (c) { return c[_this.keyField] !== item[_this.keyField]; });
                         this.selectedParents.push(item);
                     }
                     else {
@@ -13911,13 +14042,15 @@
             }
             node.itemData.item = c; //TO DO
             node.itemData.selected = item.select === true ? item.select : false;
+            node.itemData.indeterminate = item.select === null ? true : false;
             node.itemData.hasChild = item[this.hasChildField];
             node.parent = item.parentNode === undefined ? null : this.makeNode(item.parentNode, false);
             return node;
         };
         AXTreeViewComponent.prototype.changeChildSelect = function (item, s) {
             var _this = this;
-            if (this.selectNodesRecursive == 'all' || this.selectNodesRecursive == 'childs') {
+            // if (this.selectNodesRecursive == 'all' || this.selectNodesRecursive == 'childs') {
+            if (this.checkChilds == true) {
                 item.select = s;
                 if (item[this.hasChildField] === true && item[this.childField] && item[this.childField].length > 0) {
                     item[this.childField].forEach(function (elm) {
@@ -13950,7 +14083,9 @@
             }
         };
         AXTreeViewComponent.prototype.changeParentSelect = function (item) {
-            if (this.selectNodesRecursive == 'all' || this.selectNodesRecursive == 'parents') {
+            var _this = this;
+            //if (this.selectNodesRecursive == 'all' || this.selectNodesRecursive == 'parents') {
+            if (this.checkParents) {
                 var allselect = true;
                 var alldeselect = true;
                 var oneselect = false;
@@ -13974,9 +14109,13 @@
                 }
                 if (oneselect || (isindeterminate && !allselect)) {
                     item.select = null;
+                    this.selectedParents = this.selectedParents.filter(function (c) { return c[_this.keyField] !== item[_this.keyField]; });
+                    this.selectedParents.push(item);
                 }
                 if (allselect === true) {
                     item.select = true;
+                    this.selectedParents = this.selectedParents.filter(function (c) { return c[_this.keyField] !== item[_this.keyField]; });
+                    this.selectedParents.push(item);
                 }
                 if (alldeselect === true) {
                     item.select = false;
@@ -14066,9 +14205,11 @@
                             _this.seletedKeyFields.forEach(function (n) {
                                 if (n.includes(el[_this.keyField])) {
                                     if (el[_this.hasChildField] == true) {
-                                        //  if (this.selectNodesRecursive) {
+                                        if (_this.checkParents == false && _this.checkChilds == false) {
+                                            //select parent when check child and check parent is false TODO check this Action
+                                            _this.selectItem(el);
+                                        }
                                         _this.open(el);
-                                        // }
                                     }
                                     else {
                                         _this.selectItem(el);
@@ -14079,9 +14220,11 @@
                         }
                         else if (_this.selectedFieldName != null) {
                             if (el[_this.hasChildField] == true && el[_this.selectedFieldName] == true) {
-                                // if (this.selectNodesRecursive) {
+                                if (_this.checkParents == false && _this.checkChilds == false) {
+                                    //select parent when check child and check parent is false TODO check this Action
+                                    _this.selectItem(el);
+                                }
                                 _this.open(el);
-                                // }
                             }
                             else if (el[_this.selectedFieldName] == true) {
                                 _this.selectItem(el);
@@ -14093,6 +14236,7 @@
                 else {
                     _this.itemRow = _this.listLoad.filter(function (c) { return c.requestId === _data.data.requestId; })[0];
                     _this.listLoad = _this.listLoad.filter(function (c) { return c.requestId !== _data.data.requestId; });
+                    _this.itemRow.loaded = true;
                     if (_this.itemRow !== undefined) {
                         _this.hideLoading(_this.itemRow);
                         var result_1 = _data.data.result;
@@ -14113,7 +14257,8 @@
                                 if (_this.selectionLevel == 'parents' && result_1[i][_this.hasChildField] == false) {
                                     result_1[i].disabledCheckBox = true;
                                 }
-                                if (_this.selectionMode !== 'single' && (_this.selectNodesRecursive == 'all' || _this.selectNodesRecursive == 'childs')) {
+                                // if (this.selectionMode !== 'single' && (this.selectNodesRecursive == 'all' || this.selectNodesRecursive == 'childs')) {
+                                if (_this.selectionMode !== 'single' && _this.checkChilds == true) {
                                     result_1[i].select = _this.itemRow.select === (undefined || null) ? false : _this.itemRow.select;
                                     if (_this.itemRow.select === true && _this.selectionMode == 'multiple' && result_1[i][_this.hasChildField] === false) {
                                         _this.selectedItems = _this.selectedItems.filter(function (c) { return c[_this.keyField] !== result_1[i][_this.keyField]; });
@@ -14128,9 +14273,11 @@
                                     _this.seletedKeyFields.forEach(function (n) {
                                         if (n.includes(result_1[i][_this.keyField])) {
                                             if (result_1[i][_this.hasChildField] == true) {
-                                                // if (this.selectNodesRecursive) {
+                                                if (_this.checkParents == false && _this.checkChilds == false) {
+                                                    //select parent when check child and check parent is false TODO check this Action
+                                                    _this.selectItem(result_1[i]);
+                                                }
                                                 _this.open(result_1[i]);
-                                                // }
                                             }
                                             else {
                                                 _this.selectItem(result_1[i]);
@@ -14141,9 +14288,11 @@
                                 }
                                 else if (_this.selectedFieldName != null) {
                                     if (result_1[i][_this.hasChildField] == true && result_1[i][_this.selectedFieldName] == true) {
-                                        // if (this.selectNodesRecursive) {
+                                        if (_this.checkParents == false && _this.checkChilds == false) {
+                                            //select parent when check child and check parent is false TODO check this Action
+                                            _this.selectItem(result_1[i]);
+                                        }
                                         _this.open(result_1[i]);
-                                        // }
                                     }
                                     else if (result_1[i][_this.selectedFieldName] == true) {
                                         _this.selectItem(result_1[i]);
@@ -14398,8 +14547,12 @@
         ], AXTreeViewComponent.prototype, "selectedFieldName", void 0);
         __decorate([
             core.Input(),
-            __metadata("design:type", String)
-        ], AXTreeViewComponent.prototype, "selectNodesRecursive", void 0);
+            __metadata("design:type", Boolean)
+        ], AXTreeViewComponent.prototype, "checkParents", void 0);
+        __decorate([
+            core.Input(),
+            __metadata("design:type", Boolean)
+        ], AXTreeViewComponent.prototype, "checkChilds", void 0);
         __decorate([
             core.Input(),
             __metadata("design:type", Array)