angular-bootstrap-italia
Version:
<p align="center"> <h1 align="center">Bootstrap Italia + Angular 9</h1>
67 lines • 8.16 kB
JavaScript
import { __decorate } from "tslib";
import { Component, Input, EventEmitter, Output } from '@angular/core';
var TableComponent = /** @class */ (function () {
function TableComponent() {
this.paginationChange = new EventEmitter();
this.detailSelected = new EventEmitter();
}
TableComponent.prototype.ngOnInit = function () {
var _this = this;
// start loading
this.loading = true;
// check result
this.loadingSub = this.$rows.subscribe(function (newValue) {
if (newValue) {
_this.loading = false;
}
});
};
TableComponent.prototype.ngOnChanges = function (changes) {
if (changes.pagination) {
this.loading = false;
}
};
TableComponent.prototype.ngOnDestroy = function () {
if (this.loadingSub) {
this.loadingSub.unsubscribe();
}
};
TableComponent.prototype.emitNewPagination = function (newPagination) {
this.loading = true;
this.paginationChange.emit(newPagination);
};
TableComponent.prototype.getElemKeys = function (elem) {
return Object.keys(elem);
};
TableComponent.prototype.onDetail = function (rowElem) {
this.detailSelected.emit(rowElem);
};
__decorate([
Input()
], TableComponent.prototype, "columns", void 0);
__decorate([
Input()
], TableComponent.prototype, "detailUpdate", void 0);
__decorate([
Input()
], TableComponent.prototype, "$rows", void 0);
__decorate([
Input()
], TableComponent.prototype, "pagination", void 0);
__decorate([
Output()
], TableComponent.prototype, "paginationChange", void 0);
__decorate([
Output()
], TableComponent.prototype, "detailSelected", void 0);
TableComponent = __decorate([
Component({
selector: 'lib-table',
template: "<div class=\"table-responsive my-5 shadow\">\r\n <table class=\"table mb-0 bg-white\">\r\n <thead>\r\n <tr>\r\n <th scope=\"col\" *ngFor=\"let colItem of columns\">\r\n <span>{{ colItem.label }}</span>\r\n <!-- <svg class=\"icon icon-xs\">\r\n <use xlink:href=\"./assets/bootstrap-italia/svg/sprite.svg#it-expand\">\r\n </use>\r\n </svg> -->\r\n </th>\r\n <th scope=\"col\" *ngIf=\"detailUpdate\">\r\n <span> Azione </span>\r\n </th>\r\n </tr>\r\n </thead>\r\n <tbody>\r\n <tr *ngIf=\"loading\">\r\n <td [attr.colspan]=\"detailUpdate ? columns.length + 1 : columns.length\">\r\n <div class=\"progress progress-indeterminate\" style=\"width: 100%;\">\r\n <span class=\"sr-only\">In elaborazione...</span>\r\n <div class=\"progress-bar\" role=\"progressbar\"></div>\r\n </div>\r\n </td>\r\n </tr>\r\n\r\n <tr *ngFor=\"let item of $rows | async\">\r\n <td class=\"align-middle\" *ngFor=\"let column of columns\">\r\n {{ item[column.key] }}\r\n </td>\r\n <td class=\"align-middle\" *ngIf=\"detailUpdate\">\r\n <a href=\"javascript:void(0);\" class=\"btn btn-secondary btn-xs btn-icon\" role=\"button\" aria-disabled=\"true\" (click)=\"onDetail(item)\">\r\n <svg class=\"icon icon-white\">\r\n <use xlink:href=\"./assets/bootstrap-italia/svg/sprite.svg#it-search\">\r\n </use>\r\n </svg>\r\n <span>Dettagli</span>\r\n </a>\r\n </td>\r\n </tr>\r\n </tbody>\r\n </table>\r\n</div>\r\n<lib-table-pagination *ngIf=\"pagination\" [currentPagination]=\"pagination\"\r\n (paginationChange)=\"emitNewPagination($event)\"></lib-table-pagination>\r\n",
styles: [""]
})
], TableComponent);
return TableComponent;
}());
export { TableComponent };
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidGFibGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6Im5nOi8vYW5ndWxhci1ib290c3RyYXAtaXRhbGlhLyIsInNvdXJjZXMiOlsibGliL2NvbXBvbmVudHMvdGFibGUvdGFibGUuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxZQUFZLEVBQUUsTUFBTSxFQUErQyxNQUFNLGVBQWUsQ0FBQztBQVlwSDtJQWFFO1FBTlUscUJBQWdCLEdBQUcsSUFBSSxZQUFZLEVBQUUsQ0FBQztRQUN0QyxtQkFBYyxHQUFHLElBQUksWUFBWSxFQUFFLENBQUM7SUFLOUIsQ0FBQztJQUVqQixpQ0FBUSxHQUFSO1FBQUEsaUJBVUM7UUFURSxnQkFBZ0I7UUFDaEIsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUM7UUFFcEIsZUFBZTtRQUNmLElBQUksQ0FBQyxVQUFVLEdBQUcsSUFBSSxDQUFDLEtBQUssQ0FBQyxTQUFTLENBQUMsVUFBQSxRQUFRO1lBQzdDLElBQUksUUFBUSxFQUFFO2dCQUNaLEtBQUksQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFDO2FBQ3RCO1FBQ0gsQ0FBQyxDQUFDLENBQUM7SUFDTixDQUFDO0lBRUQsb0NBQVcsR0FBWCxVQUFZLE9BQXNCO1FBQ2hDLElBQUksT0FBTyxDQUFDLFVBQVUsRUFBRTtZQUN0QixJQUFJLENBQUMsT0FBTyxHQUFHLEtBQUssQ0FBQztTQUN0QjtJQUNILENBQUM7SUFFRCxvQ0FBVyxHQUFYO1FBQ0UsSUFBSSxJQUFJLENBQUMsVUFBVSxFQUFFO1lBQ25CLElBQUksQ0FBQyxVQUFVLENBQUMsV0FBVyxFQUFFLENBQUM7U0FDL0I7SUFDSCxDQUFDO0lBRUQsMENBQWlCLEdBQWpCLFVBQWtCLGFBQTBCO1FBQzFDLElBQUksQ0FBQyxPQUFPLEdBQUcsSUFBSSxDQUFDO1FBQ3BCLElBQUksQ0FBQyxnQkFBZ0IsQ0FBQyxJQUFJLENBQUMsYUFBYSxDQUFDLENBQUM7SUFDNUMsQ0FBQztJQUVELG9DQUFXLEdBQVgsVUFBWSxJQUFZO1FBQ3RCLE9BQU8sTUFBTSxDQUFDLElBQUksQ0FBQyxJQUFJLENBQUMsQ0FBQztJQUMzQixDQUFDO0lBRUQsaUNBQVEsR0FBUixVQUFTLE9BQWU7UUFDdEIsSUFBSSxDQUFDLGNBQWMsQ0FBQyxJQUFJLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDcEMsQ0FBQztJQWhEUTtRQUFSLEtBQUssRUFBRTttREFBMkM7SUFDMUM7UUFBUixLQUFLLEVBQUU7d0RBQXVCO0lBQ3RCO1FBQVIsS0FBSyxFQUFFO2lEQUEwQjtJQUN6QjtRQUFSLEtBQUssRUFBRTtzREFBeUI7SUFFdkI7UUFBVCxNQUFNLEVBQUU7NERBQXVDO0lBQ3RDO1FBQVQsTUFBTSxFQUFFOzBEQUFxQztJQVJuQyxjQUFjO1FBTDFCLFNBQVMsQ0FBQztZQUNULFFBQVEsRUFBRSxXQUFXO1lBQ3JCLDgwREFBcUM7O1NBRXRDLENBQUM7T0FDVyxjQUFjLENBb0QxQjtJQUFELHFCQUFDO0NBQUEsQUFwREQsSUFvREM7U0FwRFksY0FBYyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQsIEV2ZW50RW1pdHRlciwgT3V0cHV0LCBPbkluaXQsIE9uQ2hhbmdlcywgU2ltcGxlQ2hhbmdlcywgT25EZXN0cm95IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XHJcbmltcG9ydCB7IE9ic2VydmFibGUsIFN1YnNjcmlwdGlvbiB9IGZyb20gJ3J4anMnO1xyXG5cclxuLy8gTW9kZWxzXHJcbmltcG9ydCB7IElQYWdpbmF0aW9uIH0gZnJvbSAnLi90YWJsZS1wYWdpbmF0aW9uL3BhZ2luYXRpb24ubW9kZWwnO1xyXG5cclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnbGliLXRhYmxlJyxcclxuICB0ZW1wbGF0ZVVybDogJy4vdGFibGUuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsczogWycuL3RhYmxlLmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIFRhYmxlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0LCBPbkNoYW5nZXMsIE9uRGVzdHJveSB7XHJcblxyXG4gIEBJbnB1dCgpIGNvbHVtbnM6IHsgbGFiZWw6IHN0cmluZywga2V5OiBzdHJpbmcgfVtdO1xyXG4gIEBJbnB1dCgpIGRldGFpbFVwZGF0ZTogYm9vbGVhbjtcclxuICBASW5wdXQoKSAkcm93czogT2JzZXJ2YWJsZTxhbnlbXT47XHJcbiAgQElucHV0KCkgcGFnaW5hdGlvbjogSVBhZ2luYXRpb247XHJcblxyXG4gIEBPdXRwdXQoKSBwYWdpbmF0aW9uQ2hhbmdlID0gbmV3IEV2ZW50RW1pdHRlcigpO1xyXG4gIEBPdXRwdXQoKSBkZXRhaWxTZWxlY3RlZCA9IG5ldyBFdmVudEVtaXR0ZXIoKTtcclxuXHJcbiAgbG9hZGluZzogYm9vbGVhbjtcclxuICBsb2FkaW5nU3ViOiBTdWJzY3JpcHRpb247XHJcblxyXG4gIGNvbnN0cnVjdG9yKCkgeyB9XHJcblxyXG4gIG5nT25Jbml0KCk6IHZvaWQge1xyXG4gICAgIC8vIHN0YXJ0IGxvYWRpbmdcclxuICAgICB0aGlzLmxvYWRpbmcgPSB0cnVlO1xyXG5cclxuICAgICAvLyBjaGVjayByZXN1bHRcclxuICAgICB0aGlzLmxvYWRpbmdTdWIgPSB0aGlzLiRyb3dzLnN1YnNjcmliZShuZXdWYWx1ZSA9PiB7XHJcbiAgICAgICBpZiAobmV3VmFsdWUpIHtcclxuICAgICAgICAgdGhpcy5sb2FkaW5nID0gZmFsc2U7XHJcbiAgICAgICB9XHJcbiAgICAgfSk7XHJcbiAgfVxyXG5cclxuICBuZ09uQ2hhbmdlcyhjaGFuZ2VzOiBTaW1wbGVDaGFuZ2VzKTogdm9pZCB7XHJcbiAgICBpZiAoY2hhbmdlcy5wYWdpbmF0aW9uKSB7XHJcbiAgICAgIHRoaXMubG9hZGluZyA9IGZhbHNlO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgbmdPbkRlc3Ryb3koKTogdm9pZCB7XHJcbiAgICBpZiAodGhpcy5sb2FkaW5nU3ViKSB7XHJcbiAgICAgIHRoaXMubG9hZGluZ1N1Yi51bnN1YnNjcmliZSgpO1xyXG4gICAgfVxyXG4gIH1cclxuXHJcbiAgZW1pdE5ld1BhZ2luYXRpb24obmV3UGFnaW5hdGlvbjogSVBhZ2luYXRpb24pIHtcclxuICAgIHRoaXMubG9hZGluZyA9IHRydWU7XHJcbiAgICB0aGlzLnBhZ2luYXRpb25DaGFuZ2UuZW1pdChuZXdQYWdpbmF0aW9uKTtcclxuICB9XHJcblxyXG4gIGdldEVsZW1LZXlzKGVsZW06IG9iamVjdCkge1xyXG4gICAgcmV0dXJuIE9iamVjdC5rZXlzKGVsZW0pO1xyXG4gIH1cclxuXHJcbiAgb25EZXRhaWwocm93RWxlbTogb2JqZWN0KSB7XHJcbiAgICB0aGlzLmRldGFpbFNlbGVjdGVkLmVtaXQocm93RWxlbSk7XHJcbiAgfVxyXG5cclxufVxyXG4iXX0=