@acorex/components 4.2.45 → 4.2.50
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/property-editor.class.mjs +1 -1
- package/esm2020/lib/search-bar/search-bar.component.mjs +88 -65
- package/fesm2015/acorex-components.mjs +91 -64
- package/fesm2015/acorex-components.mjs.map +1 -1
- package/fesm2020/acorex-components.mjs +86 -63
- package/fesm2020/acorex-components.mjs.map +1 -1
- package/lib/property-editor/property-editor.class.d.ts +2 -0
- package/lib/search-bar/search-bar.component.d.ts +5 -1
- package/package.json +1 -1
|
@@ -10300,16 +10300,19 @@ class AXSearchBarComponent {
|
|
|
10300
10300
|
this._items = [];
|
|
10301
10301
|
this._filterItems = [];
|
|
10302
10302
|
this._filterItemsClone = [];
|
|
10303
|
+
this._defultValueCount = [];
|
|
10303
10304
|
this._context = {};
|
|
10304
10305
|
}
|
|
10305
10306
|
set items(v) {
|
|
10307
|
+
this._defultValueCount = v.filter((x) => x.value);
|
|
10306
10308
|
v.forEach((el) => {
|
|
10307
10309
|
if (el.value != null) {
|
|
10308
10310
|
this._filterItems.push({
|
|
10309
10311
|
name: el.property.name,
|
|
10310
10312
|
title: el.property.title,
|
|
10311
|
-
|
|
10312
|
-
|
|
10313
|
+
field: el.property.field,
|
|
10314
|
+
textValue: this._handleTextValue(el),
|
|
10315
|
+
value: el.value ? this._handleDefultVlaue(el) : null,
|
|
10313
10316
|
component: el
|
|
10314
10317
|
});
|
|
10315
10318
|
}
|
|
@@ -10329,54 +10332,8 @@ class AXSearchBarComponent {
|
|
|
10329
10332
|
this.dropdown.toggle();
|
|
10330
10333
|
}
|
|
10331
10334
|
handleValueChange(e) {
|
|
10332
|
-
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
10333
10335
|
return __awaiter(this, void 0, void 0, function* () {
|
|
10334
|
-
|
|
10335
|
-
let text = [];
|
|
10336
|
-
if (((_a = e.property.editorOptions) === null || _a === void 0 ? void 0 : _a.valueField) && e.value != null) {
|
|
10337
|
-
if (e.property.editorOptions.returnAllData) {
|
|
10338
|
-
value = e.value;
|
|
10339
|
-
text = yield this.handleTextValue(e);
|
|
10340
|
-
}
|
|
10341
|
-
else if (((_b = e.property.editorOptions) === null || _b === void 0 ? void 0 : _b.mode) == 'multiple') {
|
|
10342
|
-
e.value.forEach((element) => {
|
|
10343
|
-
value.push(element[e.property.editorOptions.valueField]);
|
|
10344
|
-
text.push(element[e.property.editorOptions.textField]);
|
|
10345
|
-
});
|
|
10346
|
-
}
|
|
10347
|
-
else {
|
|
10348
|
-
if (e.value.length) {
|
|
10349
|
-
value = e.value[0][e.property.editorOptions.valueField];
|
|
10350
|
-
text = e.value[0][e.property.editorOptions.textField];
|
|
10351
|
-
}
|
|
10352
|
-
}
|
|
10353
|
-
}
|
|
10354
|
-
else {
|
|
10355
|
-
value = e.value;
|
|
10356
|
-
text = e.value;
|
|
10357
|
-
}
|
|
10358
|
-
const findEl = this._filterItemsClone.find((el) => el.name == e.property.name);
|
|
10359
|
-
if (findEl) {
|
|
10360
|
-
findEl.value = value;
|
|
10361
|
-
findEl.textValue = text ? text.toString() : null;
|
|
10362
|
-
}
|
|
10363
|
-
else if (e.value != null) {
|
|
10364
|
-
this._filterItemsClone.push({
|
|
10365
|
-
name: e.property.name,
|
|
10366
|
-
title: e.property.title,
|
|
10367
|
-
value,
|
|
10368
|
-
textValue: text.toString(),
|
|
10369
|
-
component: e,
|
|
10370
|
-
filterOptions: {
|
|
10371
|
-
filters: ((_d = (_c = e.property) === null || _c === void 0 ? void 0 : _c.filterOptions) === null || _d === void 0 ? void 0 : _d.filters) ? e.property.filterOptions.filters : [],
|
|
10372
|
-
logic: ((_f = (_e = e.property) === null || _e === void 0 ? void 0 : _e.filterOptions) === null || _f === void 0 ? void 0 : _f.logic) ? e.property.filterOptions.logic : 'and',
|
|
10373
|
-
ignoreCase: ((_h = (_g = e.property) === null || _g === void 0 ? void 0 : _g.filterOptions) === null || _h === void 0 ? void 0 : _h.ignoreCase) ? e.property.filterOptions.ignoreCase : true,
|
|
10374
|
-
joinType: ((_k = (_j = e.property) === null || _j === void 0 ? void 0 : _j.filterOptions) === null || _k === void 0 ? void 0 : _k.joinType) ? e.property.filterOptions.joinType : 'INNER',
|
|
10375
|
-
operator: ((_m = (_l = e.property) === null || _l === void 0 ? void 0 : _l.filterOptions) === null || _m === void 0 ? void 0 : _m.operator) ? e.property.filterOptions.operator : null,
|
|
10376
|
-
truncateDate: ((_p = (_o = e.property) === null || _o === void 0 ? void 0 : _o.filterOptions) === null || _p === void 0 ? void 0 : _p.truncateDate) ? e.property.filterOptions.truncateDate : true
|
|
10377
|
-
}
|
|
10378
|
-
});
|
|
10379
|
-
}
|
|
10336
|
+
yield this._handleInitVlaue(e);
|
|
10380
10337
|
this.onValueChange.emit(e);
|
|
10381
10338
|
});
|
|
10382
10339
|
}
|
|
@@ -10393,7 +10350,6 @@ class AXSearchBarComponent {
|
|
|
10393
10350
|
if (c.result) {
|
|
10394
10351
|
this._filterItems = JSON.parse(JSON.stringify(this._filterItemsClone.filter((el) => el.value != null && el.value != '')));
|
|
10395
10352
|
this.handleButtonClick();
|
|
10396
|
-
console.log(this._filterItems);
|
|
10397
10353
|
this.onSearchValue.emit(this._filterItems);
|
|
10398
10354
|
}
|
|
10399
10355
|
});
|
|
@@ -10430,43 +10386,114 @@ class AXSearchBarComponent {
|
|
|
10430
10386
|
}
|
|
10431
10387
|
}
|
|
10432
10388
|
}
|
|
10433
|
-
return className.toString().replace(
|
|
10389
|
+
return className.toString().replace(/,/g, ' ');
|
|
10434
10390
|
}
|
|
10435
10391
|
_handleShowTitleSelected(item) {
|
|
10436
|
-
if (item.
|
|
10392
|
+
if (item.title) {
|
|
10437
10393
|
return item.title + ':';
|
|
10438
10394
|
}
|
|
10439
10395
|
}
|
|
10440
10396
|
_handleShowValueSelected(item) {
|
|
10441
10397
|
if (item.component.property.editorClass === 'ax/editors/check') {
|
|
10442
|
-
return item.
|
|
10398
|
+
return item.component.property.editorOptions.label;
|
|
10443
10399
|
}
|
|
10444
10400
|
else {
|
|
10445
10401
|
return item.textValue;
|
|
10446
10402
|
}
|
|
10447
10403
|
}
|
|
10448
10404
|
ngOnInit() { }
|
|
10449
|
-
|
|
10450
|
-
|
|
10451
|
-
|
|
10452
|
-
dataItem.value.
|
|
10453
|
-
|
|
10454
|
-
|
|
10455
|
-
|
|
10456
|
-
|
|
10457
|
-
|
|
10405
|
+
_handleTextValue(dataItem) {
|
|
10406
|
+
let text = '';
|
|
10407
|
+
if (Array.isArray(dataItem.value)) {
|
|
10408
|
+
if (dataItem.value.length) {
|
|
10409
|
+
dataItem.value.forEach((element, index) => {
|
|
10410
|
+
text +=
|
|
10411
|
+
index === dataItem.value.length - 1
|
|
10412
|
+
? element[dataItem.property.editorOptions.textField]
|
|
10413
|
+
: element[dataItem.property.editorOptions.textField] + ',';
|
|
10414
|
+
});
|
|
10415
|
+
}
|
|
10458
10416
|
return text;
|
|
10459
10417
|
}
|
|
10418
|
+
else if (dataItem.property.editorClass === 'ax/editors/date') {
|
|
10419
|
+
if (dataItem.value) {
|
|
10420
|
+
return new AXDateTime(dataItem.value, 'jalali').format('yyyy/MM/DD');
|
|
10421
|
+
}
|
|
10422
|
+
else {
|
|
10423
|
+
return;
|
|
10424
|
+
}
|
|
10425
|
+
}
|
|
10460
10426
|
else {
|
|
10461
10427
|
return;
|
|
10462
10428
|
}
|
|
10463
10429
|
}
|
|
10430
|
+
_handleDefultVlaue(dataItem) {
|
|
10431
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
10432
|
+
this._handleInitVlaue(dataItem);
|
|
10433
|
+
this._filterItems = JSON.parse(JSON.stringify(this._filterItemsClone.filter((el) => el.value != null && el.value != '')));
|
|
10434
|
+
if (this._filterItems.length === this._defultValueCount.length) {
|
|
10435
|
+
this.onSearchValue.emit(this._filterItems);
|
|
10436
|
+
}
|
|
10437
|
+
});
|
|
10438
|
+
}
|
|
10439
|
+
_handleInitVlaue(e) {
|
|
10440
|
+
var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p;
|
|
10441
|
+
return __awaiter(this, void 0, void 0, function* () {
|
|
10442
|
+
let value = [];
|
|
10443
|
+
let text = [];
|
|
10444
|
+
if (((_a = e.property.editorOptions) === null || _a === void 0 ? void 0 : _a.valueField) && e.value != null) {
|
|
10445
|
+
if (e.property.editorOptions.returnAllData) {
|
|
10446
|
+
value = e.value;
|
|
10447
|
+
text = yield this._handleTextValue(e);
|
|
10448
|
+
}
|
|
10449
|
+
else if (((_b = e.property.editorOptions) === null || _b === void 0 ? void 0 : _b.mode) == 'multiple') {
|
|
10450
|
+
e.value.forEach((element) => {
|
|
10451
|
+
value.push(element[e.property.editorOptions.valueField]);
|
|
10452
|
+
text.push(element[e.property.editorOptions.textField]);
|
|
10453
|
+
});
|
|
10454
|
+
}
|
|
10455
|
+
else {
|
|
10456
|
+
if (e.value.length) {
|
|
10457
|
+
value = e.value[0][e.property.editorOptions.valueField];
|
|
10458
|
+
text = e.value[0][e.property.editorOptions.textField];
|
|
10459
|
+
}
|
|
10460
|
+
}
|
|
10461
|
+
}
|
|
10462
|
+
else {
|
|
10463
|
+
value = e.value;
|
|
10464
|
+
text = e.value;
|
|
10465
|
+
}
|
|
10466
|
+
const findEl = this._filterItemsClone.find((el) => el.name == e.property.name);
|
|
10467
|
+
if (findEl) {
|
|
10468
|
+
findEl.value = value;
|
|
10469
|
+
findEl.textValue = e.property.editorClass === 'ax/editors/date' ? new AXDateTime(text, 'jalali').format('yyyy/MM/DD') : text.toString();
|
|
10470
|
+
}
|
|
10471
|
+
else if (e.value != null) {
|
|
10472
|
+
this._filterItemsClone.push({
|
|
10473
|
+
name: e.property.name,
|
|
10474
|
+
field: e.property.field,
|
|
10475
|
+
title: e.property.title,
|
|
10476
|
+
value,
|
|
10477
|
+
textValue: e.property.editorClass === 'ax/editors/date' ? new AXDateTime(text, 'jalali').format('yyyy/MM/DD') : text.toString(),
|
|
10478
|
+
component: e,
|
|
10479
|
+
filterOptions: {
|
|
10480
|
+
filters: ((_d = (_c = e.property) === null || _c === void 0 ? void 0 : _c.filterOptions) === null || _d === void 0 ? void 0 : _d.filters) ? e.property.filterOptions.filters : [],
|
|
10481
|
+
logic: ((_f = (_e = e.property) === null || _e === void 0 ? void 0 : _e.filterOptions) === null || _f === void 0 ? void 0 : _f.logic) ? e.property.filterOptions.logic : 'and',
|
|
10482
|
+
ignoreCase: ((_h = (_g = e.property) === null || _g === void 0 ? void 0 : _g.filterOptions) === null || _h === void 0 ? void 0 : _h.ignoreCase) ? e.property.filterOptions.ignoreCase : true,
|
|
10483
|
+
joinType: ((_k = (_j = e.property) === null || _j === void 0 ? void 0 : _j.filterOptions) === null || _k === void 0 ? void 0 : _k.joinType) ? e.property.filterOptions.joinType : 'INNER',
|
|
10484
|
+
operator: ((_m = (_l = e.property) === null || _l === void 0 ? void 0 : _l.filterOptions) === null || _m === void 0 ? void 0 : _m.operator) ? e.property.filterOptions.operator : null,
|
|
10485
|
+
truncateDate: ((_p = (_o = e.property) === null || _o === void 0 ? void 0 : _o.filterOptions) === null || _p === void 0 ? void 0 : _p.truncateDate) ? e.property.filterOptions.truncateDate : true
|
|
10486
|
+
}
|
|
10487
|
+
});
|
|
10488
|
+
}
|
|
10489
|
+
});
|
|
10490
|
+
}
|
|
10464
10491
|
}
|
|
10465
10492
|
AXSearchBarComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
10466
|
-
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: "form", first: true, predicate: AXValidationFormComponent, descendants: 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\" style=\"direction:rtl;\">\r\n <b>{{_handleShowTitleSelected(item)}}</b> {{_handleShowValueSelected(item)}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n
|
|
10493
|
+
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: "form", first: true, predicate: AXValidationFormComponent, descendants: 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\" style=\"direction:rtl;\">\r\n <b>{{_handleShowTitleSelected(item)}}</b> {{_handleShowValueSelected(item)}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\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 <ax-validation-form #form>\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 [validationForm]=\"form\" [property]=\"prop\"\r\n [context]=\"_context\" (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 </ax-validation-form>\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>", 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: AXValidationFormComponent, selector: "ax-validation-form", inputs: ["validateOn"], outputs: ["onInit"] }, { 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 } });
|
|
10467
10494
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.3.11", ngImport: i0, type: AXSearchBarComponent, decorators: [{
|
|
10468
10495
|
type: Component,
|
|
10469
|
-
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\" style=\"direction:rtl;\">\r\n <b>{{_handleShowTitleSelected(item)}}</b> {{_handleShowValueSelected(item)}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\r\n
|
|
10496
|
+
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\" style=\"direction:rtl;\">\r\n <b>{{_handleShowTitleSelected(item)}}</b> {{_handleShowValueSelected(item)}}\r\n </span>\r\n <span class=\"close-icon\" (click)=\"handleItemRemoveClick(item)\">\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 <ax-validation-form #form>\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 [validationForm]=\"form\" [property]=\"prop\"\r\n [context]=\"_context\" (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 </ax-validation-form>\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>", 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"] }]
|
|
10470
10497
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { dropdown: [{
|
|
10471
10498
|
type: ViewChild,
|
|
10472
10499
|
args: ['dropdown', { static: true }]
|