UNPKG

@c8y/ngx-components

Version:

Angular modules for Cumulocity IoT applications

83 lines 13.3 kB
import { Component, ElementRef, HostListener, ViewChild } from '@angular/core'; import { FilteringFormRendererContext } from '@c8y/ngx-components'; import { cloneDeep } from 'lodash-es'; import * as i0 from "@angular/core"; import * as i1 from "@c8y/ngx-components"; import * as i2 from "@c8y/ngx-components/assets-navigator"; export class GroupFilteringFormRendererComponent { constructor(context) { this.context = context; this.preselected = []; this.initialSelection = []; this.isApplyDisabled = true; } onEnterKeyUp(event) { event.stopPropagation(); this.applyFilter(); } onEscapeKeyDown(event) { event.stopPropagation(); this.resetFilter(); } ngOnInit() { const column = this.context.property; this.model = cloneDeep(column.externalFilterQuery || {}); this.preselected = this.model.selectedNodes || []; this.initialSelection = [...this.preselected]; } ngAfterViewInit() { setTimeout(() => { try { this.assetSelector.nativeElement.querySelector('input').focus(); } catch (ex) { // intended empty } }, 250); } applyFilter() { this.context.applyFilter({ externalFilterQuery: this.model }); this.isApplyDisabled = true; // Disable button after applying the filter this.initialSelection = [...this.model.selectedNodes]; // Update initial selection } resetFilter() { this.context.resetFilter(); this.model.selectedNodes = []; this.preselected = []; this.isApplyDisabled = true; // Disable button after resetting the filter } selectionChanged(nodes) { this.model.selectedNodes = nodes.items; this.isApplyDisabled = !this.isSelectionChanged(); } isSelectionChanged() { if (this.model.selectedNodes.length !== this.initialSelection.length) { return true; } const currentSelectionSet = new Set(this.model.selectedNodes); for (const item of this.initialSelection) { if (!currentSelectionSet.has(item)) { return true; } } return false; } static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GroupFilteringFormRendererComponent, deps: [{ token: i1.FilteringFormRendererContext }], target: i0.ɵɵFactoryTarget.Component }); } static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: GroupFilteringFormRendererComponent, selector: "ng-component", host: { listeners: { "keyup.enter": "onEnterKeyUp($event)", "keydown.escape": "onEscapeKeyDown($event)" } }, viewQueries: [{ propertyName: "assetSelector", first: true, predicate: ["assetSelector"], descendants: true, read: ElementRef }], ngImport: i0, template: "<c8y-asset-selector\n class=\"bg-component\"\n #assetSelector\n [config]=\"{\n groupsOnly: true,\n multi: true,\n groupsSelectable: true,\n search: true,\n label: ''\n }\"\n [selected]=\"preselected\"\n (onSelected)=\"selectionChanged($event)\"\n></c8y-asset-selector>\n\n<div class=\"data-grid__dropdown__footer d-flex separator-top\">\n <button\n class=\"btn btn-default btn-sm m-r-8 flex-grow\"\n title=\"{{ 'Reset' | translate }}\"\n (click)=\"resetFilter()\"\n translate\n >\n Reset\n </button>\n\n <button\n class=\"btn btn-primary btn-sm flex-grow\"\n title=\"{{ 'Apply' | translate }}\"\n (click)=\"applyFilter()\"\n [disabled]=\"isApplyDisabled\"\n translate\n >\n Apply\n </button>\n</div>\n", dependencies: [{ kind: "directive", type: i1.C8yTranslateDirective, selector: "[translate],[ngx-translate]" }, { kind: "component", type: i2.AssetSelectorComponent, selector: "c8y-asset-selector", inputs: ["config", "active", "index", "asset", "selectedDevice", "selected", "rootNode", "selectedItems", "container", "isNodeSelectable", "disabled"], outputs: ["onSelected", "onClearSelected", "onRowSelected", "onLoad"] }, { kind: "pipe", type: i1.C8yTranslatePipe, name: "translate" }] }); } } i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: GroupFilteringFormRendererComponent, decorators: [{ type: Component, args: [{ template: "<c8y-asset-selector\n class=\"bg-component\"\n #assetSelector\n [config]=\"{\n groupsOnly: true,\n multi: true,\n groupsSelectable: true,\n search: true,\n label: ''\n }\"\n [selected]=\"preselected\"\n (onSelected)=\"selectionChanged($event)\"\n></c8y-asset-selector>\n\n<div class=\"data-grid__dropdown__footer d-flex separator-top\">\n <button\n class=\"btn btn-default btn-sm m-r-8 flex-grow\"\n title=\"{{ 'Reset' | translate }}\"\n (click)=\"resetFilter()\"\n translate\n >\n Reset\n </button>\n\n <button\n class=\"btn btn-primary btn-sm flex-grow\"\n title=\"{{ 'Apply' | translate }}\"\n (click)=\"applyFilter()\"\n [disabled]=\"isApplyDisabled\"\n translate\n >\n Apply\n </button>\n</div>\n" }] }], ctorParameters: () => [{ type: i1.FilteringFormRendererContext }], propDecorators: { assetSelector: [{ type: ViewChild, args: ['assetSelector', { static: false, read: ElementRef }] }], onEnterKeyUp: [{ type: HostListener, args: ['keyup.enter', ['$event']] }], onEscapeKeyDown: [{ type: HostListener, args: ['keydown.escape', ['$event']] }] } }); //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZ3JvdXAuZmlsdGVyaW5nLWZvcm0tcmVuZGVyZXIuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vZGV2aWNlLWdyaWQvY29sdW1ucy9ncm91cC5maWx0ZXJpbmctZm9ybS1yZW5kZXJlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi9kZXZpY2UtZ3JpZC9jb2x1bW5zL2dyb3VwLmZpbHRlcmluZy1mb3JtLXJlbmRlcmVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsVUFBVSxFQUFFLFlBQVksRUFBVSxTQUFTLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDdkYsT0FBTyxFQUFVLDRCQUE0QixFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDM0UsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLFdBQVcsQ0FBQzs7OztBQUt0QyxNQUFNLE9BQU8sbUNBQW1DO0lBTzlDLFlBQW1CLE9BQXFDO1FBQXJDLFlBQU8sR0FBUCxPQUFPLENBQThCO1FBSnhELGdCQUFXLEdBQWEsRUFBRSxDQUFDO1FBQzNCLHFCQUFnQixHQUFhLEVBQUUsQ0FBQztRQUNoQyxvQkFBZSxHQUFHLElBQUksQ0FBQztJQUVvQyxDQUFDO0lBRW5CLFlBQVksQ0FBQyxLQUFvQjtRQUN4RSxLQUFLLENBQUMsZUFBZSxFQUFFLENBQUM7UUFDeEIsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDO0lBQ3JCLENBQUM7SUFDMkMsZUFBZSxDQUFDLEtBQW9CO1FBQzlFLEtBQUssQ0FBQyxlQUFlLEVBQUUsQ0FBQztRQUN4QixJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDckIsQ0FBQztJQUVELFFBQVE7UUFDTixNQUFNLE1BQU0sR0FBVyxJQUFJLENBQUMsT0FBTyxDQUFDLFFBQVEsQ0FBQztRQUM3QyxJQUFJLENBQUMsS0FBSyxHQUFHLFNBQVMsQ0FBQyxNQUFNLENBQUMsbUJBQW1CLElBQUksRUFBRSxDQUFDLENBQUM7UUFDekQsSUFBSSxDQUFDLFdBQVcsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsSUFBSSxFQUFFLENBQUM7UUFDbEQsSUFBSSxDQUFDLGdCQUFnQixHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsV0FBVyxDQUFDLENBQUM7SUFDaEQsQ0FBQztJQUVELGVBQWU7UUFDYixVQUFVLENBQUMsR0FBRyxFQUFFO1lBQ2QsSUFBSSxDQUFDO2dCQUNILElBQUksQ0FBQyxhQUFhLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FBQyxPQUFPLENBQUMsQ0FBQyxLQUFLLEVBQUUsQ0FBQztZQUNsRSxDQUFDO1lBQUMsT0FBTyxFQUFFLEVBQUUsQ0FBQztnQkFDWixpQkFBaUI7WUFDbkIsQ0FBQztRQUNILENBQUMsRUFBRSxHQUFHLENBQUMsQ0FBQztJQUNWLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLE9BQU8sQ0FBQyxXQUFXLENBQUM7WUFDdkIsbUJBQW1CLEVBQUUsSUFBSSxDQUFDLEtBQUs7U0FDaEMsQ0FBQyxDQUFDO1FBQ0gsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUMsQ0FBQywyQ0FBMkM7UUFDeEUsSUFBSSxDQUFDLGdCQUFnQixHQUFHLENBQUMsR0FBRyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsQ0FBQyxDQUFDLENBQUMsMkJBQTJCO0lBQ3BGLENBQUM7SUFFRCxXQUFXO1FBQ1QsSUFBSSxDQUFDLE9BQU8sQ0FBQyxXQUFXLEVBQUUsQ0FBQztRQUMzQixJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsR0FBRyxFQUFFLENBQUM7UUFDOUIsSUFBSSxDQUFDLFdBQVcsR0FBRyxFQUFFLENBQUM7UUFDdEIsSUFBSSxDQUFDLGVBQWUsR0FBRyxJQUFJLENBQUMsQ0FBQyw0Q0FBNEM7SUFDM0UsQ0FBQztJQUVELGdCQUFnQixDQUFDLEtBQUs7UUFDcEIsSUFBSSxDQUFDLEtBQUssQ0FBQyxhQUFhLEdBQUcsS0FBSyxDQUFDLEtBQUssQ0FBQztRQUN2QyxJQUFJLENBQUMsZUFBZSxHQUFHLENBQUMsSUFBSSxDQUFDLGtCQUFrQixFQUFFLENBQUM7SUFDcEQsQ0FBQztJQUVPLGtCQUFrQjtRQUN4QixJQUFJLElBQUksQ0FBQyxLQUFLLENBQUMsYUFBYSxDQUFDLE1BQU0sS0FBSyxJQUFJLENBQUMsZ0JBQWdCLENBQUMsTUFBTSxFQUFFLENBQUM7WUFDckUsT0FBTyxJQUFJLENBQUM7UUFDZCxDQUFDO1FBQ0QsTUFBTSxtQkFBbUIsR0FBRyxJQUFJLEdBQUcsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLGFBQWEsQ0FBQyxDQUFDO1FBQzlELEtBQUssTUFBTSxJQUFJLElBQUksSUFBSSxDQUFDLGdCQUFnQixFQUFFLENBQUM7WUFDekMsSUFBSSxDQUFDLG1CQUFtQixDQUFDLEdBQUcsQ0FBQyxJQUFJLENBQUMsRUFBRSxDQUFDO2dCQUNuQyxPQUFPLElBQUksQ0FBQztZQUNkLENBQUM7UUFDSCxDQUFDO1FBQ0QsT0FBTyxLQUFLLENBQUM7SUFDZixDQUFDOytHQWxFVSxtQ0FBbUM7bUdBQW5DLG1DQUFtQyw0UEFDSyxVQUFVLDZCQ1IvRCwydkJBa0NBOzs0RkQzQmEsbUNBQW1DO2tCQUgvQyxTQUFTOztpR0FJeUQsYUFBYTtzQkFBN0UsU0FBUzt1QkFBQyxlQUFlLEVBQUUsRUFBRSxNQUFNLEVBQUUsS0FBSyxFQUFFLElBQUksRUFBRSxVQUFVLEVBQUU7Z0JBUXRCLFlBQVk7c0JBQXBELFlBQVk7dUJBQUMsYUFBYSxFQUFFLENBQUMsUUFBUSxDQUFDO2dCQUlLLGVBQWU7c0JBQTFELFlBQVk7dUJBQUMsZ0JBQWdCLEVBQUUsQ0FBQyxRQUFRLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEVsZW1lbnRSZWYsIEhvc3RMaXN0ZW5lciwgT25Jbml0LCBWaWV3Q2hpbGQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbHVtbiwgRmlsdGVyaW5nRm9ybVJlbmRlcmVyQ29udGV4dCB9IGZyb20gJ0BjOHkvbmd4LWNvbXBvbmVudHMnO1xuaW1wb3J0IHsgY2xvbmVEZWVwIH0gZnJvbSAnbG9kYXNoLWVzJztcblxuQENvbXBvbmVudCh7XG4gIHRlbXBsYXRlVXJsOiAnLi9ncm91cC5maWx0ZXJpbmctZm9ybS1yZW5kZXJlci5jb21wb25lbnQuaHRtbCdcbn0pXG5leHBvcnQgY2xhc3MgR3JvdXBGaWx0ZXJpbmdGb3JtUmVuZGVyZXJDb21wb25lbnQgaW1wbGVtZW50cyBPbkluaXQge1xuICBAVmlld0NoaWxkKCdhc3NldFNlbGVjdG9yJywgeyBzdGF0aWM6IGZhbHNlLCByZWFkOiBFbGVtZW50UmVmIH0pIGFzc2V0U2VsZWN0b3I6IEVsZW1lbnRSZWY7XG4gIG1vZGVsOiBhbnk7XG4gIHByZXNlbGVjdGVkOiBzdHJpbmdbXSA9IFtdO1xuICBpbml0aWFsU2VsZWN0aW9uOiBzdHJpbmdbXSA9IFtdO1xuICBpc0FwcGx5RGlzYWJsZWQgPSB0cnVlO1xuXG4gIGNvbnN0cnVjdG9yKHB1YmxpYyBjb250ZXh0OiBGaWx0ZXJpbmdGb3JtUmVuZGVyZXJDb250ZXh0KSB7fVxuXG4gIEBIb3N0TGlzdGVuZXIoJ2tleXVwLmVudGVyJywgWyckZXZlbnQnXSkgb25FbnRlcktleVVwKGV2ZW50OiBLZXlib2FyZEV2ZW50KSB7XG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgdGhpcy5hcHBseUZpbHRlcigpO1xuICB9XG4gIEBIb3N0TGlzdGVuZXIoJ2tleWRvd24uZXNjYXBlJywgWyckZXZlbnQnXSkgb25Fc2NhcGVLZXlEb3duKGV2ZW50OiBLZXlib2FyZEV2ZW50KSB7XG4gICAgZXZlbnQuc3RvcFByb3BhZ2F0aW9uKCk7XG4gICAgdGhpcy5yZXNldEZpbHRlcigpO1xuICB9XG5cbiAgbmdPbkluaXQoKSB7XG4gICAgY29uc3QgY29sdW1uOiBDb2x1bW4gPSB0aGlzLmNvbnRleHQucHJvcGVydHk7XG4gICAgdGhpcy5tb2RlbCA9IGNsb25lRGVlcChjb2x1bW4uZXh0ZXJuYWxGaWx0ZXJRdWVyeSB8fCB7fSk7XG4gICAgdGhpcy5wcmVzZWxlY3RlZCA9IHRoaXMubW9kZWwuc2VsZWN0ZWROb2RlcyB8fCBbXTtcbiAgICB0aGlzLmluaXRpYWxTZWxlY3Rpb24gPSBbLi4udGhpcy5wcmVzZWxlY3RlZF07XG4gIH1cblxuICBuZ0FmdGVyVmlld0luaXQoKSB7XG4gICAgc2V0VGltZW91dCgoKSA9PiB7XG4gICAgICB0cnkge1xuICAgICAgICB0aGlzLmFzc2V0U2VsZWN0b3IubmF0aXZlRWxlbWVudC5xdWVyeVNlbGVjdG9yKCdpbnB1dCcpLmZvY3VzKCk7XG4gICAgICB9IGNhdGNoIChleCkge1xuICAgICAgICAvLyBpbnRlbmRlZCBlbXB0eVxuICAgICAgfVxuICAgIH0sIDI1MCk7XG4gIH1cblxuICBhcHBseUZpbHRlcigpIHtcbiAgICB0aGlzLmNvbnRleHQuYXBwbHlGaWx0ZXIoe1xuICAgICAgZXh0ZXJuYWxGaWx0ZXJRdWVyeTogdGhpcy5tb2RlbFxuICAgIH0pO1xuICAgIHRoaXMuaXNBcHBseURpc2FibGVkID0gdHJ1ZTsgLy8gRGlzYWJsZSBidXR0b24gYWZ0ZXIgYXBwbHlpbmcgdGhlIGZpbHRlclxuICAgIHRoaXMuaW5pdGlhbFNlbGVjdGlvbiA9IFsuLi50aGlzLm1vZGVsLnNlbGVjdGVkTm9kZXNdOyAvLyBVcGRhdGUgaW5pdGlhbCBzZWxlY3Rpb25cbiAgfVxuXG4gIHJlc2V0RmlsdGVyKCkge1xuICAgIHRoaXMuY29udGV4dC5yZXNldEZpbHRlcigpO1xuICAgIHRoaXMubW9kZWwuc2VsZWN0ZWROb2RlcyA9IFtdO1xuICAgIHRoaXMucHJlc2VsZWN0ZWQgPSBbXTtcbiAgICB0aGlzLmlzQXBwbHlEaXNhYmxlZCA9IHRydWU7IC8vIERpc2FibGUgYnV0dG9uIGFmdGVyIHJlc2V0dGluZyB0aGUgZmlsdGVyXG4gIH1cblxuICBzZWxlY3Rpb25DaGFuZ2VkKG5vZGVzKSB7XG4gICAgdGhpcy5tb2RlbC5zZWxlY3RlZE5vZGVzID0gbm9kZXMuaXRlbXM7XG4gICAgdGhpcy5pc0FwcGx5RGlzYWJsZWQgPSAhdGhpcy5pc1NlbGVjdGlvbkNoYW5nZWQoKTtcbiAgfVxuXG4gIHByaXZhdGUgaXNTZWxlY3Rpb25DaGFuZ2VkKCk6IGJvb2xlYW4ge1xuICAgIGlmICh0aGlzLm1vZGVsLnNlbGVjdGVkTm9kZXMubGVuZ3RoICE9PSB0aGlzLmluaXRpYWxTZWxlY3Rpb24ubGVuZ3RoKSB7XG4gICAgICByZXR1cm4gdHJ1ZTtcbiAgICB9XG4gICAgY29uc3QgY3VycmVudFNlbGVjdGlvblNldCA9IG5ldyBTZXQodGhpcy5tb2RlbC5zZWxlY3RlZE5vZGVzKTtcbiAgICBmb3IgKGNvbnN0IGl0ZW0gb2YgdGhpcy5pbml0aWFsU2VsZWN0aW9uKSB7XG4gICAgICBpZiAoIWN1cnJlbnRTZWxlY3Rpb25TZXQuaGFzKGl0ZW0pKSB7XG4gICAgICAgIHJldHVybiB0cnVlO1xuICAgICAgfVxuICAgIH1cbiAgICByZXR1cm4gZmFsc2U7XG4gIH1cbn1cbiIsIjxjOHktYXNzZXQtc2VsZWN0b3JcbiAgY2xhc3M9XCJiZy1jb21wb25lbnRcIlxuICAjYXNzZXRTZWxlY3RvclxuICBbY29uZmlnXT1cIntcbiAgICBncm91cHNPbmx5OiB0cnVlLFxuICAgIG11bHRpOiB0cnVlLFxuICAgIGdyb3Vwc1NlbGVjdGFibGU6IHRydWUsXG4gICAgc2VhcmNoOiB0cnVlLFxuICAgIGxhYmVsOiAnJ1xuICB9XCJcbiAgW3NlbGVjdGVkXT1cInByZXNlbGVjdGVkXCJcbiAgKG9uU2VsZWN0ZWQpPVwic2VsZWN0aW9uQ2hhbmdlZCgkZXZlbnQpXCJcbj48L2M4eS1hc3NldC1zZWxlY3Rvcj5cblxuPGRpdiBjbGFzcz1cImRhdGEtZ3JpZF9fZHJvcGRvd25fX2Zvb3RlciBkLWZsZXggc2VwYXJhdG9yLXRvcFwiPlxuICA8YnV0dG9uXG4gICAgY2xhc3M9XCJidG4gYnRuLWRlZmF1bHQgYnRuLXNtIG0tci04IGZsZXgtZ3Jvd1wiXG4gICAgdGl0bGU9XCJ7eyAnUmVzZXQnIHwgdHJhbnNsYXRlIH19XCJcbiAgICAoY2xpY2spPVwicmVzZXRGaWx0ZXIoKVwiXG4gICAgdHJhbnNsYXRlXG4gID5cbiAgICBSZXNldFxuICA8L2J1dHRvbj5cblxuICA8YnV0dG9uXG4gICAgY2xhc3M9XCJidG4gYnRuLXByaW1hcnkgYnRuLXNtIGZsZXgtZ3Jvd1wiXG4gICAgdGl0bGU9XCJ7eyAnQXBwbHknIHwgdHJhbnNsYXRlIH19XCJcbiAgICAoY2xpY2spPVwiYXBwbHlGaWx0ZXIoKVwiXG4gICAgW2Rpc2FibGVkXT1cImlzQXBwbHlEaXNhYmxlZFwiXG4gICAgdHJhbnNsYXRlXG4gID5cbiAgICBBcHBseVxuICA8L2J1dHRvbj5cbjwvZGl2PlxuIl19