ngx-dynamic-dashboard
Version:
an dashboard lib for angular 10
69 lines • 9.01 kB
JavaScript
import { Component, ContentChild, Input, TemplateRef } from '@angular/core';
export class DataListComponent {
constructor() {
this.color = 'white';
this.objectListCopy = [];
}
filterListByTags(filterList) {
this.copyObjectList();
this.objectList = this.objectListCopy.filter(object => {
let tagFound = false;
if (!filterList.length) {
return true;
}
else {
object.tags.forEach(tag => {
filterList.forEach(filter => {
if (tag.name.toLocaleLowerCase() === filter.toLocaleLowerCase()) {
tagFound = true;
}
});
});
return tagFound;
}
});
}
filterListBySearchString(searchString) {
this.copyObjectList();
this.objectList = this.objectListCopy.filter(object => {
if (searchString.localeCompare('') === 0) {
return true;
}
else {
if (object.name.toLowerCase().indexOf(searchString.toLowerCase()) !== -1) {
return true;
}
}
});
}
/**
* todo - find a better way to manage the list that is displayed and filtered.
*/
copyObjectList() {
if (this.objectListCopy.length === 0) {
this.objectList.forEach(item => {
this.objectListCopy.push(item);
});
}
}
}
DataListComponent.decorators = [
{ type: Component, args: [{
selector: 'dashboard-data-list',
moduleId: module.id,
template: "<div class=\"content\">\n <div class=\"ui grid\">\n <div class=\"{{layoutColumnOneWidth}} wide column\">\n <dashboard-typeahead-input\n (selectionEvent)=\"filterListBySearchString($event)\"\n [placeHolderText]=\"placeHolderText\"\n [searchList]=\"objectTitleList\"\n [typeAheadIsInMenu]=\"typeAheadIsInMenu\">\n </dashboard-typeahead-input>\n <dashboard-filter-list #filterComponent\n (tagSelectEvent)=\"filterTag.updateFilterList($event)\"\n [facet_tags]=\"facetTags\">\n\n </dashboard-filter-list>\n </div>\n <div class=\"{{layoutColumnTwoWidth}} wide column\">\n <br>\n <dashboard-filter-tag #filterTag\n (updateFilterListEvent)=\"filterListByTags($event)\">\n\n </dashboard-filter-tag>\n\n <div class=\"list-content\">\n <ng-template [ngForOf]=\"objectList\" [ngForTemplate]=\"template\" ngFor></ng-template>\n </div>\n </div>\n </div>\n</div>\n",
styles: [".content{background-color:#f7f7f7;margin-left:25px;margin-top:25px;padding:5px}hr{background:hsla(0,0%,43.1%,.1)!important;border:0;color:hsla(0,0%,43.1%,.1)!important;font-size:0;height:2px!important}.list-content{margin-top:20px;max-height:700px;overflow-y:scroll;padding-right:10px}"]
},] }
];
DataListComponent.propDecorators = {
objectList: [{ type: Input }],
objectTitleList: [{ type: Input }],
placeHolderText: [{ type: Input }],
layoutColumnOneWidth: [{ type: Input }],
layoutColumnTwoWidth: [{ type: Input }],
listHeader: [{ type: Input }],
typeAheadIsInMenu: [{ type: Input }],
facetTags: [{ type: Input }],
template: [{ type: ContentChild, args: [TemplateRef, { static: true },] }]
};
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZGF0YS1saXN0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIvVXNlcnMvYmVubGkvd29ya3NwYWNlcy9uZ3gtZHluYW1pYy1kYXNoYm9hcmQtZnJhbWV3b3JrL3Byb2plY3RzL25neC1keW5hbWljLWRhc2hib2FyZC9zcmMvIiwic291cmNlcyI6WyJkYXNoYm9hcmQvZGF0YWxpc3QvZGF0YS1saXN0LmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUMsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQUUsV0FBVyxFQUFDLE1BQU0sZUFBZSxDQUFDO0FBUzFFLE1BQU0sT0FBTyxpQkFBaUI7SUFOOUI7UUFvQkksVUFBSyxHQUFHLE9BQU8sQ0FBQztRQUNoQixtQkFBYyxHQUFVLEVBQUUsQ0FBQztJQXdEL0IsQ0FBQztJQXRERyxnQkFBZ0IsQ0FBQyxVQUFvQjtRQUVqQyxJQUFJLENBQUMsY0FBYyxFQUFFLENBQUM7UUFDdEIsSUFBSSxDQUFDLFVBQVUsR0FBRyxJQUFJLENBQUMsY0FBYyxDQUFDLE1BQU0sQ0FBQyxNQUFNLENBQUMsRUFBRTtZQUVsRCxJQUFJLFFBQVEsR0FBRyxLQUFLLENBQUM7WUFFckIsSUFBSSxDQUFDLFVBQVUsQ0FBQyxNQUFNLEVBQUU7Z0JBQ3BCLE9BQU8sSUFBSSxDQUFDO2FBQ2Y7aUJBQU07Z0JBQ0gsTUFBTSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsR0FBRyxDQUFDLEVBQUU7b0JBRXRCLFVBQVUsQ0FBQyxPQUFPLENBQUMsTUFBTSxDQUFDLEVBQUU7d0JBRXhCLElBQUksR0FBRyxDQUFDLElBQUksQ0FBQyxpQkFBaUIsRUFBRSxLQUFLLE1BQU0sQ0FBQyxpQkFBaUIsRUFBRSxFQUFFOzRCQUM3RCxRQUFRLEdBQUcsSUFBSSxDQUFDO3lCQUNuQjtvQkFDTCxDQUFDLENBQUMsQ0FBQztnQkFDUCxDQUFDLENBQUMsQ0FBQztnQkFFSCxPQUFPLFFBQVEsQ0FBQzthQUNuQjtRQUNMLENBQUMsQ0FBQyxDQUFDO0lBRVAsQ0FBQztJQUVELHdCQUF3QixDQUFDLFlBQW9CO1FBRXpDLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN0QixJQUFJLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQyxjQUFjLENBQUMsTUFBTSxDQUFDLE1BQU0sQ0FBQyxFQUFFO1lBRWxELElBQUksWUFBWSxDQUFDLGFBQWEsQ0FBQyxFQUFFLENBQUMsS0FBSyxDQUFDLEVBQUU7Z0JBQ3RDLE9BQU8sSUFBSSxDQUFDO2FBQ2Y7aUJBQU07Z0JBRUgsSUFBSSxNQUFNLENBQUMsSUFBSSxDQUFDLFdBQVcsRUFBRSxDQUFDLE9BQU8sQ0FBQyxZQUFZLENBQUMsV0FBVyxFQUFFLENBQUMsS0FBSyxDQUFDLENBQUMsRUFBRTtvQkFFdEUsT0FBTyxJQUFJLENBQUM7aUJBQ2Y7YUFDSjtRQUVMLENBQUMsQ0FBQyxDQUFDO0lBQ1AsQ0FBQztJQUVEOztPQUVHO0lBQ0gsY0FBYztRQUNWLElBQUksSUFBSSxDQUFDLGNBQWMsQ0FBQyxNQUFNLEtBQUssQ0FBQyxFQUFFO1lBQ2xDLElBQUksQ0FBQyxVQUFVLENBQUMsT0FBTyxDQUFDLElBQUksQ0FBQyxFQUFFO2dCQUMzQixJQUFJLENBQUMsY0FBYyxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztZQUNuQyxDQUFDLENBQUMsQ0FBQztTQUNOO0lBQ0wsQ0FBQzs7O1lBNUVKLFNBQVMsU0FBQztnQkFDUCxRQUFRLEVBQUUscUJBQXFCO2dCQUMvQixRQUFRLEVBQUUsTUFBTSxDQUFDLEVBQUU7Z0JBQ25CLGtwQ0FBMEI7O2FBRTdCOzs7eUJBR0ksS0FBSzs4QkFDTCxLQUFLOzhCQUNMLEtBQUs7bUNBQ0wsS0FBSzttQ0FDTCxLQUFLO3lCQUNMLEtBQUs7Z0NBQ0wsS0FBSzt3QkFDTCxLQUFLO3VCQUVMLFlBQVksU0FBQyxXQUFXLEVBQUUsRUFBQyxNQUFNLEVBQUUsSUFBSSxFQUFDIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtDb21wb25lbnQsIENvbnRlbnRDaGlsZCwgSW5wdXQsIFRlbXBsYXRlUmVmfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7RmFjZXR9IGZyb20gJy4uL2ZhY2V0L2ZhY2V0LW1vZGVsJztcblxuQENvbXBvbmVudCh7XG4gICAgc2VsZWN0b3I6ICdkYXNoYm9hcmQtZGF0YS1saXN0JyxcbiAgICBtb2R1bGVJZDogbW9kdWxlLmlkLFxuICAgIHRlbXBsYXRlVXJsOiAnLi92aWV3Lmh0bWwnLFxuICAgIHN0eWxlVXJsczogWycuL3N0eWxlcy5jc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBEYXRhTGlzdENvbXBvbmVudCB7XG5cbiAgICBASW5wdXQoKSBvYmplY3RMaXN0OiBhbnlbXTtcbiAgICBASW5wdXQoKSBvYmplY3RUaXRsZUxpc3Q6IHN0cmluZ1tdO1xuICAgIEBJbnB1dCgpIHBsYWNlSG9sZGVyVGV4dDogc3RyaW5nO1xuICAgIEBJbnB1dCgpIGxheW91dENvbHVtbk9uZVdpZHRoOiBzdHJpbmc7XG4gICAgQElucHV0KCkgbGF5b3V0Q29sdW1uVHdvV2lkdGg6IHN0cmluZztcbiAgICBASW5wdXQoKSBsaXN0SGVhZGVyOiBzdHJpbmc7XG4gICAgQElucHV0KCkgdHlwZUFoZWFkSXNJbk1lbnU6IGJvb2xlYW47XG4gICAgQElucHV0KCkgZmFjZXRUYWdzOiBBcnJheTxGYWNldD47XG5cbiAgICBAQ29udGVudENoaWxkKFRlbXBsYXRlUmVmLCB7c3RhdGljOiB0cnVlfSkgdGVtcGxhdGU6IFRlbXBsYXRlUmVmPGFueT47XG5cblxuICAgIGNvbG9yID0gJ3doaXRlJztcbiAgICBvYmplY3RMaXN0Q29weTogYW55W10gPSBbXTtcblxuICAgIGZpbHRlckxpc3RCeVRhZ3MoZmlsdGVyTGlzdDogc3RyaW5nW10pIHtcblxuICAgICAgICB0aGlzLmNvcHlPYmplY3RMaXN0KCk7XG4gICAgICAgIHRoaXMub2JqZWN0TGlzdCA9IHRoaXMub2JqZWN0TGlzdENvcHkuZmlsdGVyKG9iamVjdCA9PiB7XG5cbiAgICAgICAgICAgIGxldCB0YWdGb3VuZCA9IGZhbHNlO1xuXG4gICAgICAgICAgICBpZiAoIWZpbHRlckxpc3QubGVuZ3RoKSB7XG4gICAgICAgICAgICAgICAgcmV0dXJuIHRydWU7XG4gICAgICAgICAgICB9IGVsc2Uge1xuICAgICAgICAgICAgICAgIG9iamVjdC50YWdzLmZvckVhY2godGFnID0+IHtcblxuICAgICAgICAgICAgICAgICAgICBmaWx0ZXJMaXN0LmZvckVhY2goZmlsdGVyID0+IHtcblxuICAgICAgICAgICAgICAgICAgICAgICAgaWYgKHRhZy5uYW1lLnRvTG9jYWxlTG93ZXJDYXNlKCkgPT09IGZpbHRlci50b0xvY2FsZUxvd2VyQ2FzZSgpKSB7XG4gICAgICAgICAgICAgICAgICAgICAgICAgICAgdGFnRm91bmQgPSB0cnVlO1xuICAgICAgICAgICAgICAgICAgICAgICAgfVxuICAgICAgICAgICAgICAgICAgICB9KTtcbiAgICAgICAgICAgICAgICB9KTtcblxuICAgICAgICAgICAgICAgIHJldHVybiB0YWdGb3VuZDtcbiAgICAgICAgICAgIH1cbiAgICAgICAgfSk7XG5cbiAgICB9XG5cbiAgICBmaWx0ZXJMaXN0QnlTZWFyY2hTdHJpbmcoc2VhcmNoU3RyaW5nOiBzdHJpbmcpIHtcblxuICAgICAgICB0aGlzLmNvcHlPYmplY3RMaXN0KCk7XG4gICAgICAgIHRoaXMub2JqZWN0TGlzdCA9IHRoaXMub2JqZWN0TGlzdENvcHkuZmlsdGVyKG9iamVjdCA9PiB7XG5cbiAgICAgICAgICAgIGlmIChzZWFyY2hTdHJpbmcubG9jYWxlQ29tcGFyZSgnJykgPT09IDApIHtcbiAgICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgIH0gZWxzZSB7XG5cbiAgICAgICAgICAgICAgICBpZiAob2JqZWN0Lm5hbWUudG9Mb3dlckNhc2UoKS5pbmRleE9mKHNlYXJjaFN0cmluZy50b0xvd2VyQ2FzZSgpKSAhPT0gLTEpIHtcblxuICAgICAgICAgICAgICAgICAgICByZXR1cm4gdHJ1ZTtcbiAgICAgICAgICAgICAgICB9XG4gICAgICAgICAgICB9XG5cbiAgICAgICAgfSk7XG4gICAgfVxuXG4gICAgLyoqXG4gICAgICogdG9kbyAtIGZpbmQgYSBiZXR0ZXIgd2F5IHRvIG1hbmFnZSB0aGUgbGlzdCB0aGF0IGlzIGRpc3BsYXllZCBhbmQgZmlsdGVyZWQuXG4gICAgICovXG4gICAgY29weU9iamVjdExpc3QoKSB7XG4gICAgICAgIGlmICh0aGlzLm9iamVjdExpc3RDb3B5Lmxlbmd0aCA9PT0gMCkge1xuICAgICAgICAgICAgdGhpcy5vYmplY3RMaXN0LmZvckVhY2goaXRlbSA9PiB7XG4gICAgICAgICAgICAgICAgdGhpcy5vYmplY3RMaXN0Q29weS5wdXNoKGl0ZW0pO1xuICAgICAgICAgICAgfSk7XG4gICAgICAgIH1cbiAgICB9XG59XG5cbiJdfQ==