@acorex/components 3.0.31 → 3.0.35

package/fesm5/acorex-components.js

@@ -1,4 +1,4 @@
-import { __decorate, __metadata, __extends, __spread, __param, __assign, __awaiter, __generator } from 'tslib';
+import { __decorate, __metadata, __extends, __spread, __param, __assign, __awaiter, __generator, __asyncValues } from 'tslib';
 import { Input, Component, EventEmitter, ContentChildren, QueryList, Output, ViewChild, ContentChild, ElementRef, ɵɵdefineInjectable, ɵɵinject, Injectable, ComponentFactoryResolver, Injector, NgZone, Inject, RendererFactory2, INJECTOR, TemplateRef, ApplicationRef, ChangeDetectorRef, HostListener, ViewEncapsulation, NgModule, ChangeDetectionStrategy, Attribute, Directive, ViewContainerRef, Renderer2, ViewChildren } from '@angular/core';
 import { AXTranslator, AXHtmlUtil, AXRenderService, AXConfig, AXDateTime, AXDateTimeRange, AXCoreModule, AXMenuItem, AXTranslatorModule, AXObjectUtil, AXScrollModule, getPropByPath, AXColorUtil } from '@acorex/core';
 import { OverlayContainer, ScrollStrategyOptions, OverlayPositionBuilder, OverlayKeyboardDispatcher, Overlay, OverlayModule } from '@angular/cdk/overlay';
@@ -7568,7 +7568,6 @@ var AXNumberBoxComponent = /** @class */ (function (_super) {
         configurable: true
     });
     AXNumberBoxComponent.prototype.calcSeparator = function (num) {
-        debugger;
         if (this.showSeparator) {
             return num + (+(num / 3));
         }
@@ -9424,6 +9423,7 @@ var AXQueryBuilderRuleComponent = /** @class */ (function () {
     function AXQueryBuilderRuleComponent() {
         var _this = this;
         this.isEditing = true;
+        this.mode = 'new';
         this.fields = [];
         this.onRuleDelete = new EventEmitter();
         this.ruleChanged = new EventEmitter();
@@ -9607,7 +9607,6 @@ var AXQueryBuilderRuleComponent = /** @class */ (function () {
     };
     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;
@@ -9755,6 +9754,10 @@ var AXQueryBuilderRuleComponent = /** @class */ (function () {
         Input(),
         __metadata("design:type", AXQueryBuilderGroup)
     ], AXQueryBuilderRuleComponent.prototype, "parent", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", String)
+    ], AXQueryBuilderRuleComponent.prototype, "mode", void 0);
     __decorate([
         Input(),
         __metadata("design:type", Array)
@@ -9770,7 +9773,7 @@ var AXQueryBuilderRuleComponent = /** @class */ (function () {
     AXQueryBuilderRuleComponent = __decorate([
         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: ViewEncapsulation.None
         }),
@@ -9965,7 +9968,7 @@ var AXQueryBuilderService = /** @class */ (function () {
                     }
                 }
                 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);
                     });
                 }
@@ -10005,10 +10008,119 @@ var AXQueryBuilderService = /** @class */ (function () {
         }
         //  }
     };
+    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 = ' ( ';
                 }
@@ -10070,6 +10182,7 @@ var AXQueryBuilderGroupComponent = /** @class */ (function () {
         this.qs = qs;
         this.collapsed = false;
         this.fields = [];
+        this.mode = 'new';
         //ruleIsEditing: boolean = true;
         this.groupRuleChanged = new EventEmitter();
         this.showGroupCondition = false;
@@ -10148,9 +10261,14 @@ var AXQueryBuilderGroupComponent = /** @class */ (function () {
         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 }
@@ -10175,6 +10293,10 @@ var AXQueryBuilderGroupComponent = /** @class */ (function () {
         Input(),
         __metadata("design:type", Array)
     ], AXQueryBuilderGroupComponent.prototype, "fields", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", String)
+    ], AXQueryBuilderGroupComponent.prototype, "mode", void 0);
     __decorate([
         Output(),
         __metadata("design:type", EventEmitter)
@@ -10182,7 +10304,7 @@ var AXQueryBuilderGroupComponent = /** @class */ (function () {
     AXQueryBuilderGroupComponent = __decorate([
         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: ViewEncapsulation.None
         }),
@@ -10197,6 +10319,7 @@ var AXQueryBuilderComponent = /** @class */ (function (_super) {
         var _this = _super.call(this) || this;
         _this.ref = ref;
         _this.toast = toast;
+        _this.mode = 'new';
         _this.rootGroup = new AXQueryBuilderGroup();
         _this.fields = [];
         // @Input()
@@ -10206,11 +10329,11 @@ var AXQueryBuilderComponent = /** @class */ (function (_super) {
         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 });
@@ -10260,6 +10383,10 @@ var AXQueryBuilderComponent = /** @class */ (function (_super) {
         Input(),
         __metadata("design:type", AXQueryBuilderGroup)
     ], AXQueryBuilderComponent.prototype, "query", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", String)
+    ], AXQueryBuilderComponent.prototype, "mode", void 0);
     __decorate([
         Input(),
         __metadata("design:type", Array)
@@ -10271,9 +10398,9 @@ var AXQueryBuilderComponent = /** @class */ (function (_super) {
     AXQueryBuilderComponent = __decorate([
         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: 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", [ElementRef, AXToastService])
     ], AXQueryBuilderComponent);
@@ -11476,7 +11603,7 @@ var AXTabPageModule = /** @class */ (function () {
             imports: [CommonModule, AXLoadingModule],
             exports: [AXTabPageRendererComponent],
             entryComponents: [AXTabPageRendererComponent, AXTabPageHostComponent],
-            providers: [AXTabPageService],
+            providers: [],
         })
     ], AXTabPageModule);
     return AXTabPageModule;
@@ -13579,7 +13706,10 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
         //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';
@@ -13651,6 +13781,7 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
             }
             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 {
@@ -13705,13 +13836,15 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
         }
         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) {
@@ -13744,7 +13877,9 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
         }
     };
     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;
@@ -13768,9 +13903,13 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
             }
             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;
@@ -13860,9 +13999,11 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
                         _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);
@@ -13873,9 +14014,11 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
                     }
                     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);
@@ -13887,6 +14030,7 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
             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;
@@ -13907,7 +14051,8 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
                             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]; });
@@ -13922,9 +14067,11 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
                                 _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]);
@@ -13935,9 +14082,11 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
                             }
                             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]);
@@ -14192,8 +14341,12 @@ var AXTreeViewComponent = /** @class */ (function (_super) {
     ], AXTreeViewComponent.prototype, "selectedFieldName", void 0);
     __decorate([
         Input(),
-        __metadata("design:type", String)
-    ], AXTreeViewComponent.prototype, "selectNodesRecursive", void 0);
+        __metadata("design:type", Boolean)
+    ], AXTreeViewComponent.prototype, "checkParents", void 0);
+    __decorate([
+        Input(),
+        __metadata("design:type", Boolean)
+    ], AXTreeViewComponent.prototype, "checkChilds", void 0);
     __decorate([
         Input(),
         __metadata("design:type", Array)