@acorex/components 4.2.33 → 4.2.34
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/property-editor/editors/selectbox-editor/selectbox.editor.mjs +12 -5
- package/esm2020/lib/property-editor/editors/selection-editor/selection-editor.mjs +3 -3
- package/esm2020/lib/property-editor/property-editor.class.mjs +2 -1
- package/esm2020/lib/search-bar/search-bar.component.mjs +35 -6
- package/fesm2015/acorex-components.mjs +55 -18
- package/fesm2015/acorex-components.mjs.map +1 -1
- package/fesm2020/acorex-components.mjs +48 -11
- package/fesm2020/acorex-components.mjs.map +1 -1
- package/lib/property-editor/editors/selectbox-editor/selectbox.editor.d.ts +1 -1
- package/lib/search-bar/search-bar.component.d.ts +1 -0
- package/package.json +1 -1
|
@@ -10264,6 +10264,7 @@ class AXSearchBarComponent {
|
|
|
10264
10264
|
this._filterItems.push({
|
|
10265
10265
|
name: el.property.name,
|
|
10266
10266
|
title: el.property.title,
|
|
10267
|
+
textValue: el.value,
|
|
10267
10268
|
value: el.value
|
|
10268
10269
|
});
|
|
10269
10270
|
}
|
|
@@ -10280,14 +10281,42 @@ class AXSearchBarComponent {
|
|
|
10280
10281
|
this.dropdown.toggle();
|
|
10281
10282
|
}
|
|
10282
10283
|
handleValueChange(e) {
|
|
10283
|
-
|
|
10284
|
-
|
|
10284
|
+
let value = [];
|
|
10285
|
+
let text = [];
|
|
10286
|
+
debugger;
|
|
10287
|
+
if (e.property.editorOptions?.valueField && e.value != null) {
|
|
10288
|
+
if (e.property.editorOptions.returnAllData) {
|
|
10289
|
+
value = e.value;
|
|
10290
|
+
e.value.forEach(element => {
|
|
10291
|
+
text.push(element[e.property.editorOptions.textField]);
|
|
10292
|
+
});
|
|
10293
|
+
}
|
|
10294
|
+
else if (e.property.editorOptions?.mode == 'multiple') {
|
|
10295
|
+
e.value.forEach(element => {
|
|
10296
|
+
value.push(element[e.property.editorOptions.valueField]);
|
|
10297
|
+
text.push(element[e.property.editorOptions.textField]);
|
|
10298
|
+
});
|
|
10299
|
+
}
|
|
10300
|
+
else {
|
|
10301
|
+
value = e.value[0][e.property.editorOptions.valueField];
|
|
10302
|
+
text = e.value[0][e.property.editorOptions.textField];
|
|
10303
|
+
}
|
|
10304
|
+
}
|
|
10305
|
+
else {
|
|
10306
|
+
value = e.value;
|
|
10307
|
+
text = e.value;
|
|
10308
|
+
}
|
|
10309
|
+
const findEl = this._filterItemsClone.find((el) => el.name == e.property.name);
|
|
10310
|
+
if (findEl) {
|
|
10311
|
+
findEl.value = value;
|
|
10312
|
+
findEl.textValue = text.toString();
|
|
10285
10313
|
}
|
|
10286
10314
|
else if (e.value != null) {
|
|
10287
10315
|
this._filterItemsClone.push({
|
|
10288
10316
|
name: e.property.name,
|
|
10289
10317
|
title: e.property.title,
|
|
10290
|
-
value
|
|
10318
|
+
value,
|
|
10319
|
+
textValue: text.toString(),
|
|
10291
10320
|
filterOptions: {
|
|
10292
10321
|
filters: e.property?.filterOptions?.filters ? e.property.filterOptions.filters : [],
|
|
10293
10322
|
logic: e.property?.filterOptions?.logic ? e.property.filterOptions.logic : 'and',
|
|
@@ -10350,10 +10379,10 @@ class AXSearchBarComponent {
|
|
|
10350
10379
|
ngOnInit() { }
|
|
10351
10380
|
}
|
|
10352
10381
|
AXSearchBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
10353
|
-
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.
|
|
10382
|
+
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.textValue}}\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 } });
|
|
10354
10383
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, decorators: [{
|
|
10355
10384
|
type: Component,
|
|
10356
|
-
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.
|
|
10385
|
+
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.textValue}}\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"] }]
|
|
10357
10386
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { dropdown: [{
|
|
10358
10387
|
type: ViewChild,
|
|
10359
10388
|
args: ['dropdown', { static: true }]
|
|
@@ -10397,6 +10426,7 @@ class AXProperyEditorComponent {
|
|
|
10397
10426
|
return this._value;
|
|
10398
10427
|
}
|
|
10399
10428
|
set value(v) {
|
|
10429
|
+
console.log('value set');
|
|
10400
10430
|
if (v !== this._value) {
|
|
10401
10431
|
this._value = v;
|
|
10402
10432
|
this.valueChange.emit(v);
|
|
@@ -11775,7 +11805,7 @@ class AXSelectBoxPropertyEditorComponent extends AXProperyEditorComponent {
|
|
|
11775
11805
|
this.cdr = cdr;
|
|
11776
11806
|
this.valueField = 'id';
|
|
11777
11807
|
this.textField = 'text';
|
|
11778
|
-
this.
|
|
11808
|
+
this.mode = 'single';
|
|
11779
11809
|
this.selectionDataMode = 'value';
|
|
11780
11810
|
this.allowSearch = true;
|
|
11781
11811
|
this.allowNull = false;
|
|
@@ -11816,18 +11846,25 @@ class AXSelectBoxPropertyEditorComponent extends AXProperyEditorComponent {
|
|
|
11816
11846
|
}
|
|
11817
11847
|
}
|
|
11818
11848
|
handleValueChange(e) {
|
|
11819
|
-
super.handleValueChange(e.
|
|
11849
|
+
super.handleValueChange(e.selectedItems);
|
|
11820
11850
|
}
|
|
11821
11851
|
ngAfterViewInit() {
|
|
11852
|
+
debugger;
|
|
11853
|
+
if (typeof this.value != 'object') {
|
|
11854
|
+
this.selectBox.selectedValues = this.value;
|
|
11855
|
+
}
|
|
11856
|
+
else {
|
|
11857
|
+
this.selectBox.selectedItems = this.value;
|
|
11858
|
+
}
|
|
11822
11859
|
this.registerForValidationForm(this.selectBox);
|
|
11823
11860
|
this.onRenderCompleted.emit();
|
|
11824
11861
|
}
|
|
11825
11862
|
}
|
|
11826
11863
|
AXSelectBoxPropertyEditorComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSelectBoxPropertyEditorComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
11827
|
-
AXSelectBoxPropertyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: AXSelectBoxPropertyEditorComponent, selector: "ng-component", viewQueries: [{ propertyName: "selectBox", first: true, predicate: AXSelectBoxComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-select-box [mode]=\"
|
|
11864
|
+
AXSelectBoxPropertyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.3.11", type: AXSelectBoxPropertyEditorComponent, selector: "ng-component", viewQueries: [{ propertyName: "selectBox", first: true, predicate: AXSelectBoxComponent, descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<ax-select-box [mode]=\"mode\"\r\n [textField]=\"textField\" \r\n [valueField]=\"valueField\" \r\n [remoteOperation]=\"remoteOperation\"\r\n [allowSearch]=\"allowSearch\" \r\n [allowNull]=\"allowNull\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n (selectionChanged)=\"handleValueChange($event)\">\r\n <ax-data-source [provideData]=\"provideData\">\r\n </ax-data-source>\r\n <ax-validation [rules]=\"validation?.rules\">\r\n </ax-validation>\r\n</ax-select-box>", components: [{ type: AXSelectBoxComponent, selector: "ax-select-box", inputs: ["showDropDownButton", "rowInputTemplate", "showCheckBox", "readonly", "rtl", "disabled", "placeholder", "size", "allowNull", "textAlign", "bufferSize", "remoteOperation", "dataSource", "validation", "disabledCallback", "allowSearch", "textField", "valueField", "disabledField", "mode", "items", "selectedItems", "selectedValues"], outputs: ["dropdownToggle", "itemsChange", "onBlur", "onFocus", "selectionChanged", "selectedItemsChange", "selectedValuesChange"] }, { type: AXDataSourceComponent, selector: "ax-data-source", inputs: ["provideData", "params"] }, { type: AXValidationComponent, selector: "ax-validation", inputs: ["rules", "validateOn"], outputs: ["rulesChange", "showMessage"] }] });
|
|
11828
11865
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSelectBoxPropertyEditorComponent, decorators: [{
|
|
11829
11866
|
type: Component,
|
|
11830
|
-
args: [{ template: "<ax-select-box [mode]=\"
|
|
11867
|
+
args: [{ template: "<ax-select-box [mode]=\"mode\"\r\n [textField]=\"textField\" \r\n [valueField]=\"valueField\" \r\n [remoteOperation]=\"remoteOperation\"\r\n [allowSearch]=\"allowSearch\" \r\n [allowNull]=\"allowNull\"\r\n [readonly]=\"readonly\"\r\n [disabled]=\"disabled\"\r\n (selectionChanged)=\"handleValueChange($event)\">\r\n <ax-data-source [provideData]=\"provideData\">\r\n </ax-data-source>\r\n <ax-validation [rules]=\"validation?.rules\">\r\n </ax-validation>\r\n</ax-select-box>" }]
|
|
11831
11868
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { selectBox: [{
|
|
11832
11869
|
type: ViewChild,
|
|
11833
11870
|
args: [AXSelectBoxComponent, { static: true }]
|
|
@@ -11881,7 +11918,7 @@ AXSelectionListPropertyEditorComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVe
|
|
|
11881
11918
|
[value]="value"
|
|
11882
11919
|
[items]="items"
|
|
11883
11920
|
[mode]="mode"
|
|
11884
|
-
(
|
|
11921
|
+
(selectedItemsChange)="handleValueChange($event)"
|
|
11885
11922
|
[textField]="textField"
|
|
11886
11923
|
[valueField]="valueField"
|
|
11887
11924
|
[direction]="direction"
|
|
@@ -11901,7 +11938,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImpo
|
|
|
11901
11938
|
[value]="value"
|
|
11902
11939
|
[items]="items"
|
|
11903
11940
|
[mode]="mode"
|
|
11904
|
-
(
|
|
11941
|
+
(selectedItemsChange)="handleValueChange($event)"
|
|
11905
11942
|
[textField]="textField"
|
|
11906
11943
|
[valueField]="valueField"
|
|
11907
11944
|
[direction]="direction"
|