@acorex/components 4.2.22 → 4.2.23
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2020/lib/search-bar/search-bar.component.mjs +20 -15
- package/fesm2015/acorex-components.mjs +19 -14
- package/fesm2015/acorex-components.mjs.map +1 -1
- package/fesm2020/acorex-components.mjs +19 -14
- package/fesm2020/acorex-components.mjs.map +1 -1
- package/lib/search-bar/search-bar.component.d.ts +2 -1
- package/package.json +1 -1
|
@@ -10247,7 +10247,6 @@ class AXSearchBarComponent {
|
|
|
10247
10247
|
this.ref = ref;
|
|
10248
10248
|
this.size = 'md';
|
|
10249
10249
|
this.disabled = false;
|
|
10250
|
-
this.items = [];
|
|
10251
10250
|
this.rtl = AXConfig.get('layout.rtl');
|
|
10252
10251
|
this.onValueChange = new EventEmitter();
|
|
10253
10252
|
this.onSearchValue = new EventEmitter();
|
|
@@ -10256,6 +10255,22 @@ class AXSearchBarComponent {
|
|
|
10256
10255
|
this._filterItemsClone = [];
|
|
10257
10256
|
this._context = {};
|
|
10258
10257
|
}
|
|
10258
|
+
set items(v) {
|
|
10259
|
+
debugger;
|
|
10260
|
+
v.forEach((el) => {
|
|
10261
|
+
if (el.value != null) {
|
|
10262
|
+
this._filterItems.push({
|
|
10263
|
+
name: el.property.name,
|
|
10264
|
+
title: el.property.title,
|
|
10265
|
+
value: el.value
|
|
10266
|
+
});
|
|
10267
|
+
}
|
|
10268
|
+
});
|
|
10269
|
+
this._items = _.chain(v).groupBy(x => x.property.row).map((value, key) => ({ row: key, items: value })).value();
|
|
10270
|
+
}
|
|
10271
|
+
clearItem(name) {
|
|
10272
|
+
this._editors.find(e => e.property.property.name == name).clear();
|
|
10273
|
+
}
|
|
10259
10274
|
handleButtonClick() {
|
|
10260
10275
|
this.dropdown.toggle();
|
|
10261
10276
|
}
|
|
@@ -10281,7 +10296,7 @@ class AXSearchBarComponent {
|
|
|
10281
10296
|
this._filterItems = this._filterItems.filter((el) => el.name != item.name);
|
|
10282
10297
|
}
|
|
10283
10298
|
search() {
|
|
10284
|
-
this._filterItems = JSON.parse(JSON.stringify(this._filterItemsClone));
|
|
10299
|
+
this._filterItems = JSON.parse(JSON.stringify(this._filterItemsClone.filter((el) => el.value != null && el.value != '')));
|
|
10285
10300
|
this.handleButtonClick();
|
|
10286
10301
|
this.onSearchValue.emit(this._filterItems);
|
|
10287
10302
|
}
|
|
@@ -10320,23 +10335,13 @@ class AXSearchBarComponent {
|
|
|
10320
10335
|
return className.toString().replace(/,/, ' ');
|
|
10321
10336
|
}
|
|
10322
10337
|
ngOnInit() {
|
|
10323
|
-
this.items.forEach((el) => {
|
|
10324
|
-
if (el.value != null) {
|
|
10325
|
-
this._filterItems.push({
|
|
10326
|
-
name: el.property.name,
|
|
10327
|
-
title: el.property.title,
|
|
10328
|
-
value: el.value
|
|
10329
|
-
});
|
|
10330
|
-
}
|
|
10331
|
-
});
|
|
10332
|
-
this._items = _.chain(this.items).groupBy(x => x.property.row).map((value, key) => ({ row: key, items: value })).value();
|
|
10333
10338
|
}
|
|
10334
10339
|
}
|
|
10335
10340
|
AXSearchBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
10336
|
-
AXSearchBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: AXSearchBarComponent, selector: "ax-search-bar", inputs: { size: "size", disabled: "disabled", items: "items", rtl: "rtl" }, outputs: { onValueChange: "onValueChange", onSearchValue: "onSearchValue" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "_editors", predicate: AXPropertyEditorRendererDirective, descendants: true }], ngImport: i0, template: "<ax-drop-down [fitParent]=\"true\" [size]=\"size\" [showDropDownButton]=\"false\" icon=\"far fa-sliders-h\" #dropdown\r\n maxHeight=\"unset\">\r\n <ng-container start>\r\n <ng-content select=\"[start]\">\r\n </ng-content>\r\n </ng-container>\r\n <ng-container header>\r\n <div class=\"ax chips-container\">\r\n <div class=\"chips\" *ngFor=\"let item of _filterItems\">\r\n <span class=\"chips-text\">\r\n <b>{{item.title}} :</b> {{item.value}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n <i class=\"far fa-times close\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container panel>\r\n <div class=\"panel-box\">\r\n <div *ngFor=\"let item of _items\" class=\"row\">\r\n <div *ngFor=\"let prop of item.items\" class=\"{{renderCol(prop.property.col)}}\">\r\n <!-- <ax-form-group> -->\r\n <ax-label>{{prop.property.title}}</ax-label>\r\n
|
|
10341
|
+
AXSearchBarComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: AXSearchBarComponent, selector: "ax-search-bar", inputs: { size: "size", disabled: "disabled", items: "items", rtl: "rtl" }, outputs: { onValueChange: "onValueChange", onSearchValue: "onSearchValue" }, viewQueries: [{ propertyName: "dropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "_editors", predicate: AXPropertyEditorRendererDirective, descendants: true }], ngImport: i0, template: "<ax-drop-down [fitParent]=\"true\" [size]=\"size\" [showDropDownButton]=\"false\" icon=\"far fa-sliders-h\" #dropdown\r\n maxHeight=\"unset\">\r\n <ng-container start>\r\n <ng-content select=\"[start]\">\r\n </ng-content>\r\n </ng-container>\r\n <ng-container header>\r\n <div class=\"ax chips-container\">\r\n <div class=\"chips\" *ngFor=\"let item of _filterItems\">\r\n <span class=\"chips-text\">\r\n <b>{{item.title}} :</b> {{item.value}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n <i class=\"far fa-times close\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container panel>\r\n <div class=\"panel-box\">\r\n <div *ngFor=\"let item of _items\" class=\"row\">\r\n <div *ngFor=\"let prop of item.items\" class=\"{{renderCol(prop.property.col)}}\">\r\n <!-- <ax-form-group> -->\r\n <div *ngIf=\"prop.property.visible != false\">\r\n <ax-label>{{prop.property.title}}</ax-label>\r\n <ng-container ax-property-editor-renderer [property]=\"prop\" [context]=\"_context\"\r\n (onValueChange)=\"handleValueChange($event)\"></ng-container>\r\n </div>\r\n <!-- </ax-form-group> -->\r\n </div>\r\n </div>\r\n <div class=\"footer-button\">\r\n <ax-button (click)=\"search()\">{{'common.search' | trans}}</ax-button>\r\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{'dataGrid.clearFilter' | trans}}</ax-button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container end>\r\n <ax-button end icon=\"far fa-sliders-h icon\" type=\"light blank\" [disabled]=\"disabled\" [size]=\"size\"\r\n [tabIndex]=\"-1\" (click)=\"handleButtonClick()\">{{'common.search' | trans}}</ax-button>\r\n </ng-container>\r\n\r\n</ax-drop-down>\r\n", styles: [".ax.chips-container{height:100%}.panel-box{padding:1rem}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}\n"], components: [{ type: AXDropdownComponent, selector: "ax-drop-down", inputs: ["rtl", "readonly", "loading"], outputs: ["dropdownToggle", "onButtonClick"] }, { type: AXLabelComponent, selector: "ax-label", inputs: ["size"] }, { type: AXButtonComponent, selector: "ax-button", inputs: ["type", "icon", "submitBehavior", "cancelBehavior", "block", "loading", "selected"] }], directives: [{ type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: AXPropertyEditorRendererDirective, selector: "[ax-property-editor-renderer]", inputs: ["property", "validationForm", "context", "host", "groupId"], outputs: ["onValueChange"] }], pipes: { "trans": i1$2.AXTranslatorPipe } });
|
|
10337
10342
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, decorators: [{
|
|
10338
10343
|
type: Component,
|
|
10339
|
-
args: [{ selector: 'ax-search-bar', template: "<ax-drop-down [fitParent]=\"true\" [size]=\"size\" [showDropDownButton]=\"false\" icon=\"far fa-sliders-h\" #dropdown\r\n maxHeight=\"unset\">\r\n <ng-container start>\r\n <ng-content select=\"[start]\">\r\n </ng-content>\r\n </ng-container>\r\n <ng-container header>\r\n <div class=\"ax chips-container\">\r\n <div class=\"chips\" *ngFor=\"let item of _filterItems\">\r\n <span class=\"chips-text\">\r\n <b>{{item.title}} :</b> {{item.value}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n <i class=\"far fa-times close\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container panel>\r\n <div class=\"panel-box\">\r\n <div *ngFor=\"let item of _items\" class=\"row\">\r\n <div *ngFor=\"let prop of item.items\" class=\"{{renderCol(prop.property.col)}}\">\r\n <!-- <ax-form-group> -->\r\n <ax-label>{{prop.property.title}}</ax-label>\r\n
|
|
10344
|
+
args: [{ selector: 'ax-search-bar', template: "<ax-drop-down [fitParent]=\"true\" [size]=\"size\" [showDropDownButton]=\"false\" icon=\"far fa-sliders-h\" #dropdown\r\n maxHeight=\"unset\">\r\n <ng-container start>\r\n <ng-content select=\"[start]\">\r\n </ng-content>\r\n </ng-container>\r\n <ng-container header>\r\n <div class=\"ax chips-container\">\r\n <div class=\"chips\" *ngFor=\"let item of _filterItems\">\r\n <span class=\"chips-text\">\r\n <b>{{item.title}} :</b> {{item.value}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n <i class=\"far fa-times close\"></i>\r\n </span>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container panel>\r\n <div class=\"panel-box\">\r\n <div *ngFor=\"let item of _items\" class=\"row\">\r\n <div *ngFor=\"let prop of item.items\" class=\"{{renderCol(prop.property.col)}}\">\r\n <!-- <ax-form-group> -->\r\n <div *ngIf=\"prop.property.visible != false\">\r\n <ax-label>{{prop.property.title}}</ax-label>\r\n <ng-container ax-property-editor-renderer [property]=\"prop\" [context]=\"_context\"\r\n (onValueChange)=\"handleValueChange($event)\"></ng-container>\r\n </div>\r\n <!-- </ax-form-group> -->\r\n </div>\r\n </div>\r\n <div class=\"footer-button\">\r\n <ax-button (click)=\"search()\">{{'common.search' | trans}}</ax-button>\r\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{'dataGrid.clearFilter' | trans}}</ax-button>\r\n </div>\r\n </div>\r\n </ng-container>\r\n <ng-container end>\r\n <ax-button end icon=\"far fa-sliders-h icon\" type=\"light blank\" [disabled]=\"disabled\" [size]=\"size\"\r\n [tabIndex]=\"-1\" (click)=\"handleButtonClick()\">{{'common.search' | trans}}</ax-button>\r\n </ng-container>\r\n\r\n</ax-drop-down>\r\n", styles: [".ax.chips-container{height:100%}.panel-box{padding:1rem}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}\n"] }]
|
|
10340
10345
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { dropdown: [{
|
|
10341
10346
|
type: ViewChild,
|
|
10342
10347
|
args: ['dropdown', { static: true }]
|