@acorex/components 16.19.32 → 16.19.33
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.
|
@@ -21,7 +21,7 @@ import { NgxMaskDirective, NgxMaskPipe, provideNgxMask } from 'ngx-mask';
|
|
|
21
21
|
import { trigger, state, transition, style, animate } from '@angular/animations';
|
|
22
22
|
import * as i5 from '@angular/cdk/a11y';
|
|
23
23
|
import { A11yModule } from '@angular/cdk/a11y';
|
|
24
|
-
import { differenceBy,
|
|
24
|
+
import { differenceBy, groupBy, cloneDeep } from 'lodash-es';
|
|
25
25
|
import * as i1$4 from '@angular/router';
|
|
26
26
|
import { RouterModule } from '@angular/router';
|
|
27
27
|
|
|
@@ -12002,10 +12002,27 @@ class AXSearchBarComponent {
|
|
|
12002
12002
|
});
|
|
12003
12003
|
}
|
|
12004
12004
|
});
|
|
12005
|
-
|
|
12006
|
-
|
|
12007
|
-
|
|
12008
|
-
|
|
12005
|
+
const groupMap = new Map();
|
|
12006
|
+
for (const item of v) {
|
|
12007
|
+
const groupId = item.property?.gropOptions?.groupId ?? null;
|
|
12008
|
+
if (!groupMap.has(groupId)) {
|
|
12009
|
+
groupMap.set(groupId, []);
|
|
12010
|
+
}
|
|
12011
|
+
groupMap.get(groupId).push(item);
|
|
12012
|
+
}
|
|
12013
|
+
this._items = Array.from(groupMap.entries()).map(([groupId, items]) => {
|
|
12014
|
+
const groupTitle = items.find((i) => i.property?.gropOptions?.groupTitle)?.property
|
|
12015
|
+
?.gropOptions?.groupTitle || null;
|
|
12016
|
+
const rows = Object.entries(groupBy(items, (x) => x.property?.row)).map(([row, rowItems]) => ({
|
|
12017
|
+
row,
|
|
12018
|
+
items: rowItems,
|
|
12019
|
+
}));
|
|
12020
|
+
return {
|
|
12021
|
+
groupId,
|
|
12022
|
+
groupTitle,
|
|
12023
|
+
rows,
|
|
12024
|
+
};
|
|
12025
|
+
});
|
|
12009
12026
|
}
|
|
12010
12027
|
onValueChange = new EventEmitter();
|
|
12011
12028
|
onSearchValue = new EventEmitter();
|
|
@@ -12047,6 +12064,9 @@ class AXSearchBarComponent {
|
|
|
12047
12064
|
}
|
|
12048
12065
|
handleButtonClick() {
|
|
12049
12066
|
this.searchPopover.open();
|
|
12067
|
+
document
|
|
12068
|
+
.querySelectorAll('.ax-search-bar-required-state .form-item')
|
|
12069
|
+
.forEach((el) => el.classList.add('required-state'));
|
|
12050
12070
|
}
|
|
12051
12071
|
async handleValueChange(e) {
|
|
12052
12072
|
await this._handleInitVlaue(e);
|
|
@@ -12234,11 +12254,11 @@ class AXSearchBarComponent {
|
|
|
12234
12254
|
this.searchPopover.close();
|
|
12235
12255
|
}
|
|
12236
12256
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXSearchBarComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
12237
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "
|
|
12257
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AXSearchBarComponent, isStandalone: false, selector: "ax-search-bar", inputs: { sizeButton: "sizeButton", size: "size", disabled: "disabled", fitParent: "fitParent", popoverWidth: "popoverWidth", rtl: "rtl", loadOnInit: "loadOnInit", caption: "caption", block: "block", items: "items" }, outputs: { onValueChange: "onValueChange", onSearchValue: "onSearchValue", onClose: "onClose" }, viewQueries: [{ propertyName: "searchPopover", first: true, predicate: ["searchPop"], descendants: true }, { propertyName: "form", first: true, predicate: AXValidationFormComponent, descendants: true }, { propertyName: "_editors", predicate: AXPropertyEditorRendererDirective, descendants: true }], ngImport: i0, template: "<ax-button\n [block]=\"block\"\n end\n icon=\"far fa-sliders-h icon\"\n [selected]=\"_searchCount ? true : false\"\n [type]=\"_searchCount ? 'primary' : 'primary outline'\"\n [disabled]=\"disabled\"\n [size]=\"sizeButton\"\n [tabIndex]=\"-1\"\n (click)=\"handleButtonClick()\"\n>\n {{ caption ? caption : ('common.search' | trans) }}\n <span *ngIf=\"_searchCount\" class=\"search-count\">{{\n _searchCount\n }}</span></ax-button\n>\n\n<ax-popover\n #searchPop\n [target]=\"ref\"\n [rtl]=\"rtl\"\n [position]=\"{\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetY: 10\n }\"\n>\n <div class=\"panel-box ax-dropdown-container-bordered {{ size }}\">\n <ax-validation-form #form>\n @for (item of _items; track $index) { @if (item.groupId) {\n <ax-fieldset [caption]=\"item?.groupTitle\">\n <ng-container\n *ngTemplateOutlet=\"propertyRenderer; context: { item: item }\"\n ></ng-container>\n </ax-fieldset>\n }@else {\n <ng-container\n *ngTemplateOutlet=\"propertyRenderer; context: { item: item }\"\n ></ng-container>\n } }\n <div class=\"footer-button\">\n <ax-button (click)=\"search()\">{{ 'common.search' | trans }}</ax-button>\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{\n 'common.reset' | trans\n }}</ax-button>\n </div>\n </ax-validation-form>\n </div>\n</ax-popover>\n\n<ng-template #propertyRenderer let-item=\"item\">\n <div class=\"row\">\n @for (row of item.rows; track $index) { @for (prop of row.items; track\n $index) { @if (prop.property.visible != false) {\n <div class=\"{{ renderCol(prop.property.col) }}\">\n <div\n [class.ax-search-bar-required-state]=\"\n prop.property.editorOptions?.validation?.rules?.length\n \"\n >\n <ax-label>{{ prop.property.title }}</ax-label>\n <ng-container\n ax-property-editor-renderer\n [validationForm]=\"form\"\n [property]=\"prop\"\n [context]=\"_context\"\n (onValueChange)=\"handleValueChange($event)\"\n ></ng-container>\n </div>\n </div>\n } } }\n </div>\n</ng-template>\n", styles: [".panel-box{padding:1rem}.panel-box.ax-dropdown-container-bordered{background:var(--ax-white-color);border:1px solid;border-color:var(--ax-border-color);border-radius:var(--ax-border-radius-size);box-shadow:0 5px 10px #0000004d}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}.panel-box.sm{width:30vw}.panel-box.md{width:50vw}.panel-box.lg{width:70vw}.panel-box.full{width:80vw}@media all and (min-width: 1280px){.panel-box.sm{width:420px!important}.panel-box.md{width:680px!important}.panel-box.lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md,.panel-box.lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.panel-box.sm,.panel-box.md,.panel-box.lg{width:100vw;max-height:100vh}}.search-count{background:#fff3;border-radius:50%;color:var(--ax-white-color);padding:.125rem;width:1.75rem;height:1.75rem;font-size:.875rem;display:inline-flex;align-items:center;justify-content:center;margin-inline-start:.5rem}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: AXButtonComponent, selector: "ax-button", inputs: ["type", "icon", "submitBehavior", "cancelBehavior", "block", "loading", "selected"] }, { kind: "directive", type: AXPropertyEditorRendererDirective, selector: "[ax-property-editor-renderer]", inputs: ["property", "validationForm", "context", "host", "groupId"], outputs: ["onValueChange"] }, { kind: "component", type: AXLabelComponent, selector: "ax-label", inputs: ["size"], outputs: ["clickLabel"] }, { kind: "component", type: AXValidationFormComponent, selector: "ax-validation-form", inputs: ["validateOn"], outputs: ["onInit"] }, { kind: "component", type: AXPopoverComponent, selector: "ax-popover", inputs: ["target", "position", "openMode", "closeMode", "rtl", "visible"], outputs: ["onOutSideClick"] }, { kind: "component", type: AXFieldsetComponent, selector: "ax-fieldset", inputs: ["size", "caption", "allowCollapse"] }, { kind: "pipe", type: i1$2.AXTranslatorPipe, name: "trans" }] });
|
|
12238
12258
|
}
|
|
12239
12259
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXSearchBarComponent, decorators: [{
|
|
12240
12260
|
type: Component,
|
|
12241
|
-
args: [{ selector: 'ax-search-bar', standalone: false, template: "<ax-button
|
|
12261
|
+
args: [{ selector: 'ax-search-bar', standalone: false, template: "<ax-button\n [block]=\"block\"\n end\n icon=\"far fa-sliders-h icon\"\n [selected]=\"_searchCount ? true : false\"\n [type]=\"_searchCount ? 'primary' : 'primary outline'\"\n [disabled]=\"disabled\"\n [size]=\"sizeButton\"\n [tabIndex]=\"-1\"\n (click)=\"handleButtonClick()\"\n>\n {{ caption ? caption : ('common.search' | trans) }}\n <span *ngIf=\"_searchCount\" class=\"search-count\">{{\n _searchCount\n }}</span></ax-button\n>\n\n<ax-popover\n #searchPop\n [target]=\"ref\"\n [rtl]=\"rtl\"\n [position]=\"{\n originX: 'end',\n originY: 'bottom',\n overlayX: 'end',\n overlayY: 'top',\n offsetY: 10\n }\"\n>\n <div class=\"panel-box ax-dropdown-container-bordered {{ size }}\">\n <ax-validation-form #form>\n @for (item of _items; track $index) { @if (item.groupId) {\n <ax-fieldset [caption]=\"item?.groupTitle\">\n <ng-container\n *ngTemplateOutlet=\"propertyRenderer; context: { item: item }\"\n ></ng-container>\n </ax-fieldset>\n }@else {\n <ng-container\n *ngTemplateOutlet=\"propertyRenderer; context: { item: item }\"\n ></ng-container>\n } }\n <div class=\"footer-button\">\n <ax-button (click)=\"search()\">{{ 'common.search' | trans }}</ax-button>\n <ax-button type=\"blank danger\" (click)=\"clear()\">{{\n 'common.reset' | trans\n }}</ax-button>\n </div>\n </ax-validation-form>\n </div>\n</ax-popover>\n\n<ng-template #propertyRenderer let-item=\"item\">\n <div class=\"row\">\n @for (row of item.rows; track $index) { @for (prop of row.items; track\n $index) { @if (prop.property.visible != false) {\n <div class=\"{{ renderCol(prop.property.col) }}\">\n <div\n [class.ax-search-bar-required-state]=\"\n prop.property.editorOptions?.validation?.rules?.length\n \"\n >\n <ax-label>{{ prop.property.title }}</ax-label>\n <ng-container\n ax-property-editor-renderer\n [validationForm]=\"form\"\n [property]=\"prop\"\n [context]=\"_context\"\n (onValueChange)=\"handleValueChange($event)\"\n ></ng-container>\n </div>\n </div>\n } } }\n </div>\n</ng-template>\n", styles: [".panel-box{padding:1rem}.panel-box.ax-dropdown-container-bordered{background:var(--ax-white-color);border:1px solid;border-color:var(--ax-border-color);border-radius:var(--ax-border-radius-size);box-shadow:0 5px 10px #0000004d}.panel-box .footer-button{margin-top:1rem;display:flex;align-items:center;gap:.5rem}.panel-box.sm{width:30vw}.panel-box.md{width:50vw}.panel-box.lg{width:70vw}.panel-box.full{width:80vw}@media all and (min-width: 1280px){.panel-box.sm{width:420px!important}.panel-box.md{width:680px!important}.panel-box.lg{width:1024px!important}}@media all and (min-width: 1024px) and (max-width: 1279px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:900px!important}}@media all and (min-width: 768px) and (max-width: 1023px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md{width:500px!important}.panel-box.lg{width:700px!important}}@media all and (min-width: 425px) and (max-width: 767px){.panel-box.sm{width:100vw;max-height:100vh}.panel-box.md,.panel-box.lg{width:460px!important}}@media all and (min-width: 0px) and (max-width: 424px){.panel-box.sm,.panel-box.md,.panel-box.lg{width:100vw;max-height:100vh}}.search-count{background:#fff3;border-radius:50%;color:var(--ax-white-color);padding:.125rem;width:1.75rem;height:1.75rem;font-size:.875rem;display:inline-flex;align-items:center;justify-content:center;margin-inline-start:.5rem}\n"] }]
|
|
12242
12262
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }], propDecorators: { searchPopover: [{
|
|
12243
12263
|
type: ViewChild,
|
|
12244
12264
|
args: ['searchPop']
|
|
@@ -15617,7 +15637,8 @@ class AXSearchBarModule {
|
|
|
15617
15637
|
AXLabelModule,
|
|
15618
15638
|
AXTranslatorModule,
|
|
15619
15639
|
AXValidationModule,
|
|
15620
|
-
AXPopoverModule
|
|
15640
|
+
AXPopoverModule,
|
|
15641
|
+
AXFieldsetModule], exports: [AXSearchBarComponent] });
|
|
15621
15642
|
static ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXSearchBarModule, imports: [CommonModule,
|
|
15622
15643
|
FormsModule,
|
|
15623
15644
|
AXDropdownModule,
|
|
@@ -15628,7 +15649,8 @@ class AXSearchBarModule {
|
|
|
15628
15649
|
AXLabelModule,
|
|
15629
15650
|
AXTranslatorModule,
|
|
15630
15651
|
AXValidationModule,
|
|
15631
|
-
AXPopoverModule
|
|
15652
|
+
AXPopoverModule,
|
|
15653
|
+
AXFieldsetModule] });
|
|
15632
15654
|
}
|
|
15633
15655
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AXSearchBarModule, decorators: [{
|
|
15634
15656
|
type: NgModule,
|
|
@@ -15645,10 +15667,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImpor
|
|
|
15645
15667
|
AXLabelModule,
|
|
15646
15668
|
AXTranslatorModule,
|
|
15647
15669
|
AXValidationModule,
|
|
15648
|
-
AXPopoverModule
|
|
15670
|
+
AXPopoverModule,
|
|
15671
|
+
AXFieldsetModule,
|
|
15649
15672
|
],
|
|
15650
15673
|
exports: [AXSearchBarComponent],
|
|
15651
|
-
providers: []
|
|
15674
|
+
providers: [],
|
|
15652
15675
|
}]
|
|
15653
15676
|
}] });
|
|
15654
15677
|
|