@tilde-nlp/ngx-common 2.0.4 → 2.0.6
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/confirmation-modal/confirmation-modal.component.mjs +3 -3
- package/esm2020/lib/confirmation-modal/index.mjs +2 -1
- package/esm2020/lib/confirmation-modal/services/confirmation.service.mjs +25 -0
- package/esm2020/lib/confirmation-modal/services/index.mjs +2 -0
- package/esm2020/lib/multi-functional-table/multi-functional-table.component.mjs +2 -2
- package/fesm2015/tilde-nlp-ngx-common.mjs +26 -5
- package/fesm2015/tilde-nlp-ngx-common.mjs.map +1 -1
- package/fesm2020/tilde-nlp-ngx-common.mjs +26 -5
- package/fesm2020/tilde-nlp-ngx-common.mjs.map +1 -1
- package/lib/confirmation-modal/index.d.ts +1 -0
- package/lib/confirmation-modal/services/confirmation.service.d.ts +12 -0
- package/lib/confirmation-modal/services/index.d.ts +1 -0
- package/package.json +1 -1
|
@@ -13,12 +13,12 @@ export class ConfirmationModalComponent {
|
|
|
13
13
|
}
|
|
14
14
|
}
|
|
15
15
|
ConfirmationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalComponent, deps: [{ token: i1.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
16
|
-
ConfirmationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfirmationModalComponent, selector: "lib-confirmation-modal", ngImport: i0, template: "<div class=\"confirmation-dialog\">\r\n <
|
|
16
|
+
ConfirmationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfirmationModalComponent, selector: "lib-confirmation-modal", ngImport: i0, template: "<div class=\"confirmation-dialog\">\r\n <h1 class=\"text-2-xl\">{{ data.title | translate }}</h1>\r\n <div mat-dialog-content>\r\n <p>{{ data.descriptioon | translate }}</p>\r\n </div>\r\n <div class=\"d-flex justify-content-center\" mat-dialog-actions>\r\n <button mat-flat-button color=\"accent\" [mat-dialog-close]=\"confirmation.PRIMARY\">\r\n {{ data.confirmationText | translate }}\r\n </button>\r\n <button mat-stroked-button class=\"ml-3\" [mat-dialog-close]=\"confirmation.SECONDARY\">\r\n {{ data.rejectionText | translate }}\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".confirmation-dialog{min-width:350px}\n"], dependencies: [{ kind: "directive", type: i1.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i2.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i3.TranslatePipe, name: "translate" }] });
|
|
17
17
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalComponent, decorators: [{
|
|
18
18
|
type: Component,
|
|
19
|
-
args: [{ selector: 'lib-confirmation-modal', template: "<div class=\"confirmation-dialog\">\r\n <
|
|
19
|
+
args: [{ selector: 'lib-confirmation-modal', template: "<div class=\"confirmation-dialog\">\r\n <h1 class=\"text-2-xl\">{{ data.title | translate }}</h1>\r\n <div mat-dialog-content>\r\n <p>{{ data.descriptioon | translate }}</p>\r\n </div>\r\n <div class=\"d-flex justify-content-center\" mat-dialog-actions>\r\n <button mat-flat-button color=\"accent\" [mat-dialog-close]=\"confirmation.PRIMARY\">\r\n {{ data.confirmationText | translate }}\r\n </button>\r\n <button mat-stroked-button class=\"ml-3\" [mat-dialog-close]=\"confirmation.SECONDARY\">\r\n {{ data.rejectionText | translate }}\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".confirmation-dialog{min-width:350px}\n"] }]
|
|
20
20
|
}], ctorParameters: function () { return [{ type: i1.MatDialogRef }, { type: undefined, decorators: [{
|
|
21
21
|
type: Inject,
|
|
22
22
|
args: [MAT_DIALOG_DATA]
|
|
23
23
|
}] }]; } });
|
|
24
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
24
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29uZmlybWF0aW9uLW1vZGFsLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1jb21tb24vc3JjL2xpYi9jb25maXJtYXRpb24tbW9kYWwvY29uZmlybWF0aW9uLW1vZGFsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL25neC1jb21tb24vc3JjL2xpYi9jb25maXJtYXRpb24tbW9kYWwvY29uZmlybWF0aW9uLW1vZGFsLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ2xELE9BQU8sRUFBZ0IsZUFBZSxFQUFFLE1BQU0sMEJBQTBCLENBQUM7QUFFekUsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLDRCQUE0QixDQUFDOzs7OztBQU8xRCxNQUFNLE9BQU8sMEJBQTBCO0lBR3JDLFlBQ1MsU0FBbUQsRUFDMUIsSUFBc0I7UUFEL0MsY0FBUyxHQUFULFNBQVMsQ0FBMEM7UUFDMUIsU0FBSSxHQUFKLElBQUksQ0FBa0I7UUFKeEQsaUJBQVksR0FBRyxZQUFZLENBQUM7SUFNNUIsQ0FBQzs7dUhBUFUsMEJBQTBCLDhDQUszQixlQUFlOzJHQUxkLDBCQUEwQiw4RENWdkMsOGxCQWNBOzJGREphLDBCQUEwQjtrQkFMdEMsU0FBUzsrQkFDRSx3QkFBd0I7OzBCQVMvQixNQUFNOzJCQUFDLGVBQWUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEluamVjdCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBNYXREaWFsb2dSZWYsIE1BVF9ESUFMT0dfREFUQSB9IGZyb20gJ0Bhbmd1bGFyL21hdGVyaWFsL2RpYWxvZyc7XHJcbmltcG9ydCB7IENvbmZpcm1hdGlvbkJvZHkgfSBmcm9tICcuL21vZGVscy9jb25maXJtYXRpb24tYm9keS5tb2RlbCc7XHJcbmltcG9ydCB7IENvbmZpcm1hdGlvbiB9IGZyb20gJy4vbW9kZWxzL2NvbmZpcm1hdGlvbi5lbnVtJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnbGliLWNvbmZpcm1hdGlvbi1tb2RhbCcsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2NvbmZpcm1hdGlvbi1tb2RhbC5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vY29uZmlybWF0aW9uLW1vZGFsLmNvbXBvbmVudC5zY3NzJ10sXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBDb25maXJtYXRpb25Nb2RhbENvbXBvbmVudCB7XHJcbiAgY29uZmlybWF0aW9uID0gQ29uZmlybWF0aW9uO1xyXG5cclxuICBjb25zdHJ1Y3RvcihcclxuICAgIHB1YmxpYyBkaWFsb2dSZWY6IE1hdERpYWxvZ1JlZjxDb25maXJtYXRpb25Nb2RhbENvbXBvbmVudD4sXHJcbiAgICBASW5qZWN0KE1BVF9ESUFMT0dfREFUQSkgcHVibGljIGRhdGE6IENvbmZpcm1hdGlvbkJvZHlcclxuICApIHtcclxuICB9XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cImNvbmZpcm1hdGlvbi1kaWFsb2dcIj5cclxuICA8aDEgY2xhc3M9XCJ0ZXh0LTIteGxcIj57eyBkYXRhLnRpdGxlIHwgdHJhbnNsYXRlIH19PC9oMT5cclxuICA8ZGl2IG1hdC1kaWFsb2ctY29udGVudD5cclxuICAgIDxwPnt7IGRhdGEuZGVzY3JpcHRpb29uIHwgdHJhbnNsYXRlIH19PC9wPlxyXG4gIDwvZGl2PlxyXG4gIDxkaXYgY2xhc3M9XCJkLWZsZXgganVzdGlmeS1jb250ZW50LWNlbnRlclwiIG1hdC1kaWFsb2ctYWN0aW9ucz5cclxuICAgIDxidXR0b24gbWF0LWZsYXQtYnV0dG9uIGNvbG9yPVwiYWNjZW50XCIgW21hdC1kaWFsb2ctY2xvc2VdPVwiY29uZmlybWF0aW9uLlBSSU1BUllcIj5cclxuICAgICAge3sgZGF0YS5jb25maXJtYXRpb25UZXh0IHwgdHJhbnNsYXRlIH19XHJcbiAgICA8L2J1dHRvbj5cclxuICAgIDxidXR0b24gbWF0LXN0cm9rZWQtYnV0dG9uIGNsYXNzPVwibWwtM1wiIFttYXQtZGlhbG9nLWNsb3NlXT1cImNvbmZpcm1hdGlvbi5TRUNPTkRBUllcIj5cclxuICAgICAge3sgZGF0YS5yZWplY3Rpb25UZXh0IHwgdHJhbnNsYXRlIH19XHJcbiAgICA8L2J1dHRvbj5cclxuICA8L2Rpdj5cclxuPC9kaXY+XHJcbiJdfQ==
|
|
@@ -2,4 +2,5 @@ export * from './confirmation-modal.component';
|
|
|
2
2
|
export * from './confirmation-modal.module';
|
|
3
3
|
export * from './models/confirmation-body.model';
|
|
4
4
|
export * from './models/confirmation.enum';
|
|
5
|
-
|
|
5
|
+
export * from './services';
|
|
6
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtY29tbW9uL3NyYy9saWIvY29uZmlybWF0aW9uLW1vZGFsL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsZ0NBQWdDLENBQUM7QUFDL0MsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLGtDQUFrQyxDQUFDO0FBQ2pELGNBQWMsNEJBQTRCLENBQUM7QUFDM0MsY0FBYyxZQUFZLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2NvbmZpcm1hdGlvbi1tb2RhbC5jb21wb25lbnQnO1xyXG5leHBvcnQgKiBmcm9tICcuL2NvbmZpcm1hdGlvbi1tb2RhbC5tb2R1bGUnO1xyXG5leHBvcnQgKiBmcm9tICcuL21vZGVscy9jb25maXJtYXRpb24tYm9keS5tb2RlbCc7XHJcbmV4cG9ydCAqIGZyb20gJy4vbW9kZWxzL2NvbmZpcm1hdGlvbi5lbnVtJztcclxuZXhwb3J0ICogZnJvbSAnLi9zZXJ2aWNlcyc7XHJcbiJdfQ==
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { Injectable } from '@angular/core';
|
|
2
|
+
import { ConfirmationModalComponent } from '../confirmation-modal.component';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
import * as i1 from "@angular/material/dialog";
|
|
5
|
+
export class ConfirmationService {
|
|
6
|
+
constructor(dialog) {
|
|
7
|
+
this.dialog = dialog;
|
|
8
|
+
}
|
|
9
|
+
openDialog(data) {
|
|
10
|
+
const dialogRef = this.dialog.open(ConfirmationModalComponent, {
|
|
11
|
+
data: data,
|
|
12
|
+
width: '40rem'
|
|
13
|
+
});
|
|
14
|
+
return dialogRef.afterClosed();
|
|
15
|
+
}
|
|
16
|
+
}
|
|
17
|
+
ConfirmationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationService, deps: [{ token: i1.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
18
|
+
ConfirmationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationService, providedIn: 'root' });
|
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationService, decorators: [{
|
|
20
|
+
type: Injectable,
|
|
21
|
+
args: [{
|
|
22
|
+
providedIn: 'root'
|
|
23
|
+
}]
|
|
24
|
+
}], ctorParameters: function () { return [{ type: i1.MatDialog }]; } });
|
|
25
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiY29uZmlybWF0aW9uLnNlcnZpY2UuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtY29tbW9uL3NyYy9saWIvY29uZmlybWF0aW9uLW1vZGFsL3NlcnZpY2VzL2NvbmZpcm1hdGlvbi5zZXJ2aWNlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFHM0MsT0FBTyxFQUFFLDBCQUEwQixFQUFFLE1BQU0saUNBQWlDLENBQUM7OztBQU83RSxNQUFNLE9BQU8sbUJBQW1CO0lBRTlCLFlBQTZCLE1BQWlCO1FBQWpCLFdBQU0sR0FBTixNQUFNLENBQVc7SUFBSSxDQUFDO0lBRW5ELFVBQVUsQ0FBQyxJQUFzQjtRQUMvQixNQUFNLFNBQVMsR0FBRyxJQUFJLENBQUMsTUFBTSxDQUFDLElBQUksQ0FBQywwQkFBMEIsRUFBRTtZQUM3RCxJQUFJLEVBQUUsSUFBSTtZQUNWLEtBQUssRUFBRSxPQUFPO1NBQ2YsQ0FBQyxDQUFDO1FBRUgsT0FBTyxTQUFTLENBQUMsV0FBVyxFQUFFLENBQUM7SUFDakMsQ0FBQzs7Z0hBWFUsbUJBQW1CO29IQUFuQixtQkFBbUIsY0FGbEIsTUFBTTsyRkFFUCxtQkFBbUI7a0JBSC9CLFVBQVU7bUJBQUM7b0JBQ1YsVUFBVSxFQUFFLE1BQU07aUJBQ25CIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgSW5qZWN0YWJsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBNYXREaWFsb2cgfSBmcm9tICdAYW5ndWxhci9tYXRlcmlhbC9kaWFsb2cnO1xyXG5pbXBvcnQgeyBPYnNlcnZhYmxlIH0gZnJvbSAncnhqcyc7XHJcbmltcG9ydCB7IENvbmZpcm1hdGlvbk1vZGFsQ29tcG9uZW50IH0gZnJvbSAnLi4vY29uZmlybWF0aW9uLW1vZGFsLmNvbXBvbmVudCc7XHJcbmltcG9ydCB7IENvbmZpcm1hdGlvbkJvZHkgfSBmcm9tICcuLi9tb2RlbHMvY29uZmlybWF0aW9uLWJvZHkubW9kZWwnO1xyXG5pbXBvcnQgeyBDb25maXJtYXRpb24gfSBmcm9tICcuLi9tb2RlbHMvY29uZmlybWF0aW9uLmVudW0nO1xyXG5cclxuQEluamVjdGFibGUoe1xyXG4gIHByb3ZpZGVkSW46ICdyb290J1xyXG59KVxyXG5leHBvcnQgY2xhc3MgQ29uZmlybWF0aW9uU2VydmljZSB7XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgcmVhZG9ubHkgZGlhbG9nOiBNYXREaWFsb2cpIHsgfVxyXG5cclxuICBvcGVuRGlhbG9nKGRhdGE6IENvbmZpcm1hdGlvbkJvZHkpOiBPYnNlcnZhYmxlPENvbmZpcm1hdGlvbj4ge1xyXG4gICAgY29uc3QgZGlhbG9nUmVmID0gdGhpcy5kaWFsb2cub3BlbihDb25maXJtYXRpb25Nb2RhbENvbXBvbmVudCwge1xyXG4gICAgICBkYXRhOiBkYXRhLFxyXG4gICAgICB3aWR0aDogJzQwcmVtJ1xyXG4gICAgfSk7XHJcblxyXG4gICAgcmV0dXJuIGRpYWxvZ1JlZi5hZnRlckNsb3NlZCgpO1xyXG4gIH1cclxufVxyXG4iXX0=
|
|
@@ -0,0 +1,2 @@
|
|
|
1
|
+
export * from './confirmation.service';
|
|
2
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5kZXguanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9uZ3gtY29tbW9uL3NyYy9saWIvY29uZmlybWF0aW9uLW1vZGFsL3NlcnZpY2VzL2luZGV4LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLGNBQWMsd0JBQXdCLENBQUMiLCJzb3VyY2VzQ29udGVudCI6WyJleHBvcnQgKiBmcm9tICcuL2NvbmZpcm1hdGlvbi5zZXJ2aWNlJztcclxuIl19
|
|
@@ -155,10 +155,10 @@ export class MultiFunctionalTableComponent {
|
|
|
155
155
|
}
|
|
156
156
|
}
|
|
157
157
|
MultiFunctionalTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableComponent, deps: [{ token: i1.DOMService }, { token: i2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
158
|
-
MultiFunctionalTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MultiFunctionalTableComponent, selector: "tld-multi-functional-table", inputs: { config: "config" }, outputs: { filterBarChange: "filterBarChange", exported: "exported" }, queries: [{ propertyName: "noDataRow", first: true, predicate: MatNoDataRow, descendants: true }, { propertyName: "headerRowDefs", predicate: MatHeaderRowDef }, { propertyName: "rowDefs", predicate: MatRowDef }, { propertyName: "columnDefs", predicate: MatColumnDef }], viewQueries: [{ propertyName: "table", first: true, predicate: MatTable, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableElementRef", first: true, predicate: MatTable, descendants: true, read: ElementRef }], ngImport: i0, template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: ["table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i4.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9.FilterBarComponent, selector: "tld-filter-bar", inputs: ["settings"], outputs: ["filterBarChange"] }, { kind: "directive", type: i10.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i10.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i10.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i11.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
|
|
158
|
+
MultiFunctionalTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MultiFunctionalTableComponent, selector: "tld-multi-functional-table", inputs: { config: "config" }, outputs: { filterBarChange: "filterBarChange", exported: "exported" }, queries: [{ propertyName: "noDataRow", first: true, predicate: MatNoDataRow, descendants: true }, { propertyName: "headerRowDefs", predicate: MatHeaderRowDef }, { propertyName: "rowDefs", predicate: MatRowDef }, { propertyName: "columnDefs", predicate: MatColumnDef }], viewQueries: [{ propertyName: "table", first: true, predicate: MatTable, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableElementRef", first: true, predicate: MatTable, descendants: true, read: ElementRef }], ngImport: i0, template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: [":host ::ng-deep tr.mat-row:hover{background-color:var(--base-95)}table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"], dependencies: [{ kind: "directive", type: i3.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i3.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i4.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "component", type: i5.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i6.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i8.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i8.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: i9.FilterBarComponent, selector: "tld-filter-bar", inputs: ["settings"], outputs: ["filterBarChange"] }, { kind: "directive", type: i10.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i10.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i10.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i11.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i2.TranslatePipe, name: "translate" }] });
|
|
159
159
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableComponent, decorators: [{
|
|
160
160
|
type: Component,
|
|
161
|
-
args: [{ selector: 'tld-multi-functional-table', template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: ["table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"] }]
|
|
161
|
+
args: [{ selector: 'tld-multi-functional-table', template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: [":host ::ng-deep tr.mat-row:hover{background-color:var(--base-95)}table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"] }]
|
|
162
162
|
}], ctorParameters: function () { return [{ type: i1.DOMService }, { type: i2.TranslateService }]; }, propDecorators: { config: [{
|
|
163
163
|
type: Input
|
|
164
164
|
}], filterBarChange: [{
|
|
@@ -1418,10 +1418,10 @@ class MultiFunctionalTableComponent {
|
|
|
1418
1418
|
}
|
|
1419
1419
|
}
|
|
1420
1420
|
MultiFunctionalTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableComponent, deps: [{ token: DOMService }, { token: i1$2.TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
1421
|
-
MultiFunctionalTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MultiFunctionalTableComponent, selector: "tld-multi-functional-table", inputs: { config: "config" }, outputs: { filterBarChange: "filterBarChange", exported: "exported" }, queries: [{ propertyName: "noDataRow", first: true, predicate: MatNoDataRow, descendants: true }, { propertyName: "headerRowDefs", predicate: MatHeaderRowDef }, { propertyName: "rowDefs", predicate: MatRowDef }, { propertyName: "columnDefs", predicate: MatColumnDef }], viewQueries: [{ propertyName: "table", first: true, predicate: MatTable, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableElementRef", first: true, predicate: MatTable, descendants: true, read: ElementRef }], ngImport: i0, template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: ["table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i4.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "component", type: i1$3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i6$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FilterBarComponent, selector: "tld-filter-bar", inputs: ["settings"], outputs: ["filterBarChange"] }, { kind: "directive", type: i2$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2$2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i11.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
|
|
1421
|
+
MultiFunctionalTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: MultiFunctionalTableComponent, selector: "tld-multi-functional-table", inputs: { config: "config" }, outputs: { filterBarChange: "filterBarChange", exported: "exported" }, queries: [{ propertyName: "noDataRow", first: true, predicate: MatNoDataRow, descendants: true }, { propertyName: "headerRowDefs", predicate: MatHeaderRowDef }, { propertyName: "rowDefs", predicate: MatRowDef }, { propertyName: "columnDefs", predicate: MatColumnDef }], viewQueries: [{ propertyName: "table", first: true, predicate: MatTable, descendants: true, static: true }, { propertyName: "sort", first: true, predicate: MatSort, descendants: true }, { propertyName: "tableElementRef", first: true, predicate: MatTable, descendants: true, read: ElementRef }], ngImport: i0, template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: [":host ::ng-deep tr.mat-row:hover{background-color:var(--base-95)}table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"], dependencies: [{ kind: "directive", type: i1$1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i4.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i4.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i4.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "component", type: i4.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i4.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i4.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "component", type: i1$3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i6$2.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "directive", type: i6$2.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }, { kind: "component", type: i7$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }, { kind: "directive", type: i7.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i7.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "component", type: FilterBarComponent, selector: "tld-filter-bar", inputs: ["settings"], outputs: ["filterBarChange"] }, { kind: "directive", type: i2$2.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i2$2.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i2$2.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "component", type: i11.MatProgressSpinner, selector: "mat-progress-spinner, mat-spinner", inputs: ["color", "diameter", "strokeWidth", "mode", "value"], exportAs: ["matProgressSpinner"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
|
|
1422
1422
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: MultiFunctionalTableComponent, decorators: [{
|
|
1423
1423
|
type: Component,
|
|
1424
|
-
args: [{ selector: 'tld-multi-functional-table', template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: ["table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"] }]
|
|
1424
|
+
args: [{ selector: 'tld-multi-functional-table', template: "<div fxLayout=\"column\" fxLayoutGap=\"1rem\">\r\n\r\n <div fxLayout=\"row\">\r\n <div fxFlex fxLayoutGap=\"1rem\">\r\n <button mat-button [matMenuTriggerFor]=\"columnMenu\" *ngIf=\"columnSelectActive\">\r\n <span class=\"material-icons column-select-icon\">menu</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.COLUMN_SELECT' | translate}}</span>\r\n </button>\r\n\r\n <button mat-button *ngIf=\"filterActive\" (click)=\"toggleFilterBar()\">\r\n <span class=\"material-icons\">filter_list</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.FILTER_TOGGLE' | translate}}</span>\r\n </button>\r\n\r\n <button mat-stroked-button *ngIf=\"exportActive\" (click)=\"export()\">\r\n <span class=\"material-icons-outlined\">cloud_download</span>\r\n <span>{{'MULTI_FUNCTIONAL_TABLE.EXPORT' | translate}}</span>\r\n </button>\r\n </div>\r\n\r\n <ng-content select=\"[additionalActions]\"></ng-content>\r\n </div>\r\n\r\n <mat-menu #columnMenu=\"matMenu\">\r\n <div class=\"column-select-wrapper\" (click)=\"$event.stopPropagation()\">\r\n <div *ngFor=\"let column of configurableColumns\">\r\n <mat-checkbox [(ngModel)]=\"column.selected\" (change)=\"updateDisplayColumns()\">\r\n {{column.displayName | translate}}\r\n </mat-checkbox>\r\n </div>\r\n </div>\r\n </mat-menu>\r\n\r\n <tld-filter-bar *ngIf=\"filterBarVisible\" [settings]=\"filterSettings\" (filterBarChange)=\"filtersChanged($event)\">\r\n </tld-filter-bar>\r\n <table #table mat-table [dataSource]=\"config.dataSource\">\r\n <ng-content></ng-content>\r\n\r\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\r\n <tr mat-row *matRowDef=\"let row; columns: displayColumns\"></tr>\r\n\r\n <ng-container *ngIf=\"noDataRowActive\">\r\n <tr *matNoDataRow>\r\n <!-- add random number to make sure it takes full width -->\r\n <td colspan=\"99\">\r\n <div class=\"no-engines-wrapper\">\r\n <ng-container *ngIf=\"!noDataRowConfig.loading; else loading\">\r\n <div>\r\n <span class=\"material-icons-outlined\">\r\n {{noDataRowIcon}}\r\n </span>\r\n </div>\r\n <div class=\"text-xl-semi-bold\" *ngIf=\"noDataRowConfig.title\"\r\n [innerHtml]=\"noDataRowConfig.title | translate: noDataRowConfig.titleParams\">\r\n </div>\r\n <div class=\"text-l\" *ngIf=\"noDataRowConfig.description\"\r\n [innerHtml]=\"noDataRowConfig.description | translate: noDataRowConfig.descriptionParams\"></div>\r\n </ng-container>\r\n <ng-template #loading>\r\n <mat-spinner color=\"accent\"></mat-spinner>\r\n </ng-template>\r\n </div>\r\n </td>\r\n </tr>\r\n </ng-container>\r\n\r\n </table>\r\n\r\n</div>\r\n", styles: [":host ::ng-deep tr.mat-row:hover{background-color:var(--base-95)}table{width:100%}.column-select-icon{rotate:90deg}.column-select-wrapper{padding:1rem}.material-icons,.material-icons-outlined{margin-right:.5rem}.table-action-button{margin-bottom:1rem}.mat-no-data-row{text-align:center}.mat-no-data-row .no-engines-wrapper{margin-top:4rem}.mat-no-data-row .material-icons-outlined{font-size:4rem;color:var(--base-70)}mat-spinner{margin:auto}\n"] }]
|
|
1425
1425
|
}], ctorParameters: function () { return [{ type: DOMService }, { type: i1$2.TranslateService }]; }, propDecorators: { config: [{
|
|
1426
1426
|
type: Input
|
|
1427
1427
|
}], filterBarChange: [{
|
|
@@ -1515,10 +1515,10 @@ class ConfirmationModalComponent {
|
|
|
1515
1515
|
}
|
|
1516
1516
|
}
|
|
1517
1517
|
ConfirmationModalComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalComponent, deps: [{ token: i1$4.MatDialogRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component });
|
|
1518
|
-
ConfirmationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfirmationModalComponent, selector: "lib-confirmation-modal", ngImport: i0, template: "<div class=\"confirmation-dialog\">\r\n <
|
|
1518
|
+
ConfirmationModalComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: ConfirmationModalComponent, selector: "lib-confirmation-modal", ngImport: i0, template: "<div class=\"confirmation-dialog\">\r\n <h1 class=\"text-2-xl\">{{ data.title | translate }}</h1>\r\n <div mat-dialog-content>\r\n <p>{{ data.descriptioon | translate }}</p>\r\n </div>\r\n <div class=\"d-flex justify-content-center\" mat-dialog-actions>\r\n <button mat-flat-button color=\"accent\" [mat-dialog-close]=\"confirmation.PRIMARY\">\r\n {{ data.confirmationText | translate }}\r\n </button>\r\n <button mat-stroked-button class=\"ml-3\" [mat-dialog-close]=\"confirmation.SECONDARY\">\r\n {{ data.rejectionText | translate }}\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".confirmation-dialog{min-width:350px}\n"], dependencies: [{ kind: "directive", type: i1$4.MatDialogClose, selector: "[mat-dialog-close], [matDialogClose]", inputs: ["aria-label", "type", "mat-dialog-close", "matDialogClose"], exportAs: ["matDialogClose"] }, { kind: "directive", type: i1$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "directive", type: i1$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "component", type: i1$3.MatButton, selector: "button[mat-button], button[mat-raised-button], button[mat-icon-button], button[mat-fab], button[mat-mini-fab], button[mat-stroked-button], button[mat-flat-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "pipe", type: i1$2.TranslatePipe, name: "translate" }] });
|
|
1519
1519
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationModalComponent, decorators: [{
|
|
1520
1520
|
type: Component,
|
|
1521
|
-
args: [{ selector: 'lib-confirmation-modal', template: "<div class=\"confirmation-dialog\">\r\n <
|
|
1521
|
+
args: [{ selector: 'lib-confirmation-modal', template: "<div class=\"confirmation-dialog\">\r\n <h1 class=\"text-2-xl\">{{ data.title | translate }}</h1>\r\n <div mat-dialog-content>\r\n <p>{{ data.descriptioon | translate }}</p>\r\n </div>\r\n <div class=\"d-flex justify-content-center\" mat-dialog-actions>\r\n <button mat-flat-button color=\"accent\" [mat-dialog-close]=\"confirmation.PRIMARY\">\r\n {{ data.confirmationText | translate }}\r\n </button>\r\n <button mat-stroked-button class=\"ml-3\" [mat-dialog-close]=\"confirmation.SECONDARY\">\r\n {{ data.rejectionText | translate }}\r\n </button>\r\n </div>\r\n</div>\r\n", styles: [".confirmation-dialog{min-width:350px}\n"] }]
|
|
1522
1522
|
}], ctorParameters: function () {
|
|
1523
1523
|
return [{ type: i1$4.MatDialogRef }, { type: undefined, decorators: [{
|
|
1524
1524
|
type: Inject,
|
|
@@ -1540,6 +1540,27 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1540
1540
|
}]
|
|
1541
1541
|
}] });
|
|
1542
1542
|
|
|
1543
|
+
class ConfirmationService {
|
|
1544
|
+
constructor(dialog) {
|
|
1545
|
+
this.dialog = dialog;
|
|
1546
|
+
}
|
|
1547
|
+
openDialog(data) {
|
|
1548
|
+
const dialogRef = this.dialog.open(ConfirmationModalComponent, {
|
|
1549
|
+
data: data,
|
|
1550
|
+
width: '40rem'
|
|
1551
|
+
});
|
|
1552
|
+
return dialogRef.afterClosed();
|
|
1553
|
+
}
|
|
1554
|
+
}
|
|
1555
|
+
ConfirmationService.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationService, deps: [{ token: i1$4.MatDialog }], target: i0.ɵɵFactoryTarget.Injectable });
|
|
1556
|
+
ConfirmationService.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationService, providedIn: 'root' });
|
|
1557
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: ConfirmationService, decorators: [{
|
|
1558
|
+
type: Injectable,
|
|
1559
|
+
args: [{
|
|
1560
|
+
providedIn: 'root'
|
|
1561
|
+
}]
|
|
1562
|
+
}], ctorParameters: function () { return [{ type: i1$4.MatDialog }]; } });
|
|
1563
|
+
|
|
1543
1564
|
/*
|
|
1544
1565
|
* Public API Surface of ngx-common
|
|
1545
1566
|
*/
|
|
@@ -1548,5 +1569,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImpor
|
|
|
1548
1569
|
* Generated bundle index. Do not edit.
|
|
1549
1570
|
*/
|
|
1550
1571
|
|
|
1551
|
-
export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, Confirmation, ConfirmationModalComponent, ConfirmationModalModule, DISABLE_EXPORT_ATTRIBUTE_NAME, DOMService, DateAgoModule, DateAgoPipe, DragAndDropDirective, DragAndDropModule, ExportFormat, FileUploadComponent, FileUploadErrorTypeEnum, FileUploadModule, FilterBarComponent, FilterBarModule, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, HtmlElementParseHelper, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MatButtonLoadingDirective, MatButtonLoadingModule, MissingTranslationHelper, MultiFunctionalTableComponent, MultiFunctionalTableModule, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SaveFileHelper, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
|
|
1572
|
+
export { ClickOutsideDirective, ClickOutsideModule, CloseButtonComponent, CloseButtonModule, CompanyProductComponent, CompanyProductModule, Confirmation, ConfirmationModalComponent, ConfirmationModalModule, ConfirmationService, DISABLE_EXPORT_ATTRIBUTE_NAME, DOMService, DateAgoModule, DateAgoPipe, DragAndDropDirective, DragAndDropModule, ExportFormat, FileUploadComponent, FileUploadErrorTypeEnum, FileUploadModule, FilterBarComponent, FilterBarModule, FilterWithHighlightModule, FilterWithHighlightPipe, FooterComponent, FooterModule, HtmlElementParseHelper, IconService, InlineMessageComponent, InlineMessageIconPosition, InlineMessageModule, InlineMessageType, MatButtonLoadingDirective, MatButtonLoadingModule, MissingTranslationHelper, MultiFunctionalTableComponent, MultiFunctionalTableModule, NotificationMessageComponent, NotificationMessageModule, NotificationMessageType, PlausibleEventDirective, PlausibleHelper, PlausibleModule, SaveFileHelper, SortTranslationsModule, SortTranslationsPipe, TldLoaderComponent, TldLoaderModule };
|
|
1552
1573
|
//# sourceMappingURL=tilde-nlp-ngx-common.mjs.map
|