@tots/table 15.0.48 → 15.0.49

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.
Files changed (45) hide show
  1. package/{esm2020 → esm2022}/lib/columns/balance-currency-column/balance-currency-column.component.mjs +4 -4
  2. package/{esm2020 → esm2022}/lib/columns/balance-currency-icon-column/balance-currency-icon-column.component.mjs +4 -4
  3. package/{esm2020 → esm2022}/lib/columns/base-print-column/base-print-column.component.mjs +4 -4
  4. package/{esm2020 → esm2022}/lib/columns/boolean-column/boolean-column.component.mjs +4 -4
  5. package/{esm2020 → esm2022}/lib/columns/checkbox-column/checkbox-column.component.mjs +4 -4
  6. package/{esm2020 → esm2022}/lib/columns/currency-column/currency-column.component.mjs +4 -4
  7. package/{esm2020 → esm2022}/lib/columns/icon-button-column/icon-button-column.component.mjs +4 -4
  8. package/{esm2020 → esm2022}/lib/columns/more-menu-column/more-menu-column.component.mjs +4 -4
  9. package/{esm2020 → esm2022}/lib/columns/option-column/option-column.component.mjs +4 -4
  10. package/{esm2020 → esm2022}/lib/columns/status-column/status-column.component.mjs +4 -4
  11. package/{esm2020 → esm2022}/lib/columns/status-icon-column/status-icon-column.component.mjs +4 -4
  12. package/{esm2020 → esm2022}/lib/columns/string-column/string-column.component.mjs +4 -4
  13. package/{esm2020 → esm2022}/lib/columns/tots-base-column.component.mjs +4 -4
  14. package/{esm2020 → esm2022}/lib/columns/two-string-column/two-string-column.component.mjs +4 -4
  15. package/{esm2020 → esm2022}/lib/columns/user-column/user-column.component.mjs +4 -4
  16. package/{esm2020 → esm2022}/lib/components/loading-animation-renderer/loading-animation-renderer.component.mjs +4 -4
  17. package/{esm2020 → esm2022}/lib/components/tots-table/tots-table.component.mjs +4 -4
  18. package/{esm2020 → esm2022}/lib/components/tots-table-api/tots-table-api.component.mjs +4 -4
  19. package/esm2022/lib/components/tots-table-local/tots-table-local.component.mjs +138 -0
  20. package/{esm2020 → esm2022}/lib/entities/tots-table-default-config.mjs +4 -4
  21. package/esm2022/lib/entities/tots-table-local-config.mjs +8 -0
  22. package/esm2022/lib/table.module.mjs +129 -0
  23. package/esm2022/public-api.mjs +44 -0
  24. package/{fesm2020 → fesm2022}/tots-table.mjs +251 -104
  25. package/fesm2022/tots-table.mjs.map +1 -0
  26. package/lib/columns/base-print-column/base-print-column.component.d.ts +1 -1
  27. package/lib/columns/tots-base-column.component.d.ts +1 -1
  28. package/lib/components/tots-table/tots-table.component.d.ts +1 -1
  29. package/lib/components/tots-table-api/tots-table-api.component.d.ts +1 -1
  30. package/lib/components/tots-table-local/tots-table-local.component.d.ts +37 -0
  31. package/lib/entities/tots-table-local-config.d.ts +4 -0
  32. package/lib/table.module.d.ts +11 -10
  33. package/package.json +5 -11
  34. package/public-api.d.ts +2 -0
  35. package/esm2020/lib/table.module.mjs +0 -124
  36. package/esm2020/public-api.mjs +0 -42
  37. package/fesm2015/tots-table.mjs +0 -676
  38. package/fesm2015/tots-table.mjs.map +0 -1
  39. package/fesm2020/tots-table.mjs.map +0 -1
  40. /package/{esm2020 → esm2022}/lib/entities/tots-action-table.mjs +0 -0
  41. /package/{esm2020 → esm2022}/lib/entities/tots-column.mjs +0 -0
  42. /package/{esm2020 → esm2022}/lib/entities/tots-table-api-config.mjs +0 -0
  43. /package/{esm2020 → esm2022}/lib/entities/tots-table-config.mjs +0 -0
  44. /package/{esm2020 → esm2022}/lib/helpers/tots-table-helper.mjs +0 -0
  45. /package/{esm2020 → esm2022}/tots-table.mjs +0 -0
@@ -1,676 +0,0 @@
1
- import * as i0 from '@angular/core';
2
- import { InjectionToken, Injectable, Component, Input, ViewContainerRef, Inject, ViewChild, EventEmitter, Output, NgModule } from '@angular/core';
3
- import { TotsQuery } from '@tots/core';
4
- import * as i1 from '@angular/common';
5
- import { CommonModule } from '@angular/common';
6
- import * as i2 from '@angular/material/icon';
7
- import { MatIconModule } from '@angular/material/icon';
8
- import * as i3 from '@angular/material/button';
9
- import { MatButtonModule } from '@angular/material/button';
10
- import * as i4 from '@angular/material/menu';
11
- import { MatMenuModule } from '@angular/material/menu';
12
- import * as i1$1 from '@angular/material/checkbox';
13
- import { MatCheckboxModule } from '@angular/material/checkbox';
14
- import { Subject, tap } from 'rxjs';
15
- import * as i3$1 from '@angular/material/table';
16
- import { MatTableModule } from '@angular/material/table';
17
- import * as i4$1 from '@angular/material/paginator';
18
- import { MatPaginatorModule } from '@angular/material/paginator';
19
- import * as i5 from '@angular/material/progress-bar';
20
- import { MatProgressBarModule } from '@angular/material/progress-bar';
21
- import { MatProgressSpinner, MatProgressSpinnerModule } from '@angular/material/progress-spinner';
22
-
23
- class TotsColumn {
24
- constructor() {
25
- this.key = '';
26
- this.title = '';
27
- this.is_show = true;
28
- this.hasOrder = false;
29
- }
30
- }
31
-
32
- class TotsTableConfig {
33
- constructor() {
34
- this.id = '';
35
- this.columns = [];
36
- this.classes = '';
37
- }
38
- }
39
-
40
- const TOTS_TABLE_DEFAULT_CONFIG = new InjectionToken('tots_table_default_config');
41
- class TotsTableDefaultConfig {
42
- }
43
- TotsTableDefaultConfig.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableDefaultConfig, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
44
- TotsTableDefaultConfig.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableDefaultConfig });
45
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableDefaultConfig, decorators: [{
46
- type: Injectable
47
- }] });
48
-
49
- class TotsActionTable {
50
- constructor() {
51
- this.key = '';
52
- }
53
- }
54
-
55
- class TotsTableApiConfig {
56
- constructor() {
57
- this.id = '';
58
- this.columns = [];
59
- this.query = new TotsQuery();
60
- this.classes = '';
61
- }
62
- }
63
-
64
- class TotsTableHelper {
65
- /**
66
- * Obtiene el valor de un objeto a traves de la KEY
67
- * @param item
68
- * @param key
69
- * @returns
70
- */
71
- static getItemValueByKey(item, key) {
72
- if (key == undefined || item == undefined) {
73
- return '';
74
- }
75
- if (typeof key == 'string' && item[key] != undefined) {
76
- return item[key];
77
- }
78
- let valueFinal = item;
79
- for (const keyObj of key) {
80
- if (valueFinal[keyObj] == undefined) {
81
- return '';
82
- }
83
- valueFinal = valueFinal[keyObj];
84
- }
85
- return valueFinal;
86
- }
87
- }
88
-
89
- class TotsBaseColumnComponent {
90
- getItemValue() {
91
- return TotsTableHelper.getItemValueByKey(this.item, this.column.field_key);
92
- }
93
- }
94
- TotsBaseColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsBaseColumnComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
95
- TotsBaseColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: TotsBaseColumnComponent, selector: "tots-base-column", inputs: { column: "column", item: "item", onAction: "onAction", index: "index" }, ngImport: i0, template: '', isInline: true });
96
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsBaseColumnComponent, decorators: [{
97
- type: Component,
98
- args: [{
99
- selector: 'tots-base-column',
100
- template: ''
101
- }]
102
- }], propDecorators: { column: [{
103
- type: Input
104
- }], item: [{
105
- type: Input
106
- }], onAction: [{
107
- type: Input
108
- }], index: [{
109
- type: Input
110
- }] } });
111
-
112
- class StringColumnComponent extends TotsBaseColumnComponent {
113
- getItemValue() {
114
- let value = TotsTableHelper.getItemValueByKey(this.item, this.column.field_key);
115
- if (this.column.extra && this.column.extra.cutSeparator) {
116
- return value.split(this.column.extra.cutSeparator)[0];
117
- }
118
- return value;
119
- }
120
- get prepend() {
121
- var _a;
122
- return (_a = this.column.extra) === null || _a === void 0 ? void 0 : _a.prepend;
123
- }
124
- }
125
- StringColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: StringColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
126
- StringColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: StringColumnComponent, selector: "tots-string-column", usesInheritance: true, ngImport: i0, template: "<span class=\"prefix\" *ngIf=\"prepend\"> {{ prepend }} </span>\n{{getItemValue()}}", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
127
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: StringColumnComponent, decorators: [{
128
- type: Component,
129
- args: [{ selector: 'tots-string-column', template: "<span class=\"prefix\" *ngIf=\"prepend\"> {{ prepend }} </span>\n{{getItemValue()}}" }]
130
- }] });
131
-
132
- class MoreMenuColumnComponent extends TotsBaseColumnComponent {
133
- clickButton(itemAction, $event) {
134
- this.onAction.next({ key: itemAction.key, item: this.item });
135
- $event.preventDefault();
136
- return false;
137
- }
138
- }
139
- MoreMenuColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: MoreMenuColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
140
- MoreMenuColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: MoreMenuColumnComponent, selector: "tots-more-menu-column", usesInheritance: true, ngImport: i0, template: "<button mat-icon-button [matMenuTriggerFor]=\"actions\" (click)=\"$event.stopPropagation()\"><mat-icon>more_vert</mat-icon></button>\n<mat-menu #actions=\"matMenu\">\n <button mat-menu-item *ngFor=\"let button of column.extra?.actions\" (click)=\"clickButton(button, $event)\" class=\"{{button.class}}\">\n <mat-icon *ngIf=\"button.icon\">{{ button.icon }}</mat-icon> {{ button.title }}\n </button>\n</mat-menu>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }, { kind: "component", type: i4.MatMenu, selector: "mat-menu", exportAs: ["matMenu"] }, { kind: "component", type: i4.MatMenuItem, selector: "[mat-menu-item]", inputs: ["disabled", "disableRipple", "role"], exportAs: ["matMenuItem"] }, { kind: "directive", type: i4.MatMenuTrigger, selector: "[mat-menu-trigger-for], [matMenuTriggerFor]", exportAs: ["matMenuTrigger"] }] });
141
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: MoreMenuColumnComponent, decorators: [{
142
- type: Component,
143
- args: [{ selector: 'tots-more-menu-column', template: "<button mat-icon-button [matMenuTriggerFor]=\"actions\" (click)=\"$event.stopPropagation()\"><mat-icon>more_vert</mat-icon></button>\n<mat-menu #actions=\"matMenu\">\n <button mat-menu-item *ngFor=\"let button of column.extra?.actions\" (click)=\"clickButton(button, $event)\" class=\"{{button.class}}\">\n <mat-icon *ngIf=\"button.icon\">{{ button.icon }}</mat-icon> {{ button.title }}\n </button>\n</mat-menu>" }]
144
- }] });
145
-
146
- class BooleanColumnComponent extends TotsBaseColumnComponent {
147
- }
148
- BooleanColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BooleanColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
149
- BooleanColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: BooleanColumnComponent, selector: "tots-boolean-column", usesInheritance: true, ngImport: i0, template: "<ng-container *ngIf=\"getItemValue() == true||getItemValue() == 1; else textNo\">YES</ng-container>\n<ng-template #textNo>NO</ng-template>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
150
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BooleanColumnComponent, decorators: [{
151
- type: Component,
152
- args: [{ selector: 'tots-boolean-column', template: "<ng-container *ngIf=\"getItemValue() == true||getItemValue() == 1; else textNo\">YES</ng-container>\n<ng-template #textNo>NO</ng-template>" }]
153
- }] });
154
-
155
- class TwoStringColumnComponent extends TotsBaseColumnComponent {
156
- getSubtitleValue() {
157
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_subtitle_key);
158
- }
159
- }
160
- TwoStringColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TwoStringColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
161
- TwoStringColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: TwoStringColumnComponent, selector: "tots-two-string-column", usesInheritance: true, ngImport: i0, template: "<div class=\"first-line\"><strong>{{getItemValue()}}</strong></div>\n<div class=\"second-line\">{{getSubtitleValue()}}</div>", styles: [""] });
162
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TwoStringColumnComponent, decorators: [{
163
- type: Component,
164
- args: [{ selector: 'tots-two-string-column', template: "<div class=\"first-line\"><strong>{{getItemValue()}}</strong></div>\n<div class=\"second-line\">{{getSubtitleValue()}}</div>" }]
165
- }] });
166
-
167
- class IconButtonColumnComponent extends TotsBaseColumnComponent {
168
- clickButton($event) {
169
- this.onAction.next({ key: this.column.extra.action, item: this.item });
170
- $event.stopPropagation();
171
- return false;
172
- }
173
- getIconName() {
174
- return this.column.extra.icon;
175
- }
176
- getButtonColor() {
177
- return this.column.extra.matColor;
178
- }
179
- getClasses() {
180
- return this.column.extra.classes;
181
- }
182
- }
183
- IconButtonColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: IconButtonColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
184
- IconButtonColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: IconButtonColumnComponent, selector: "tots-icon-button-column", usesInheritance: true, ngImport: i0, template: "<button mat-icon-button [color]=\"getButtonColor()\" [class]=\"getClasses()\" (click)=\"clickButton($event)\">\n <mat-icon>{{getIconName()}}</mat-icon>\n</button>", styles: [""], dependencies: [{ kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", inputs: ["disabled", "disableRipple", "color"], exportAs: ["matButton"] }] });
185
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: IconButtonColumnComponent, decorators: [{
186
- type: Component,
187
- args: [{ selector: 'tots-icon-button-column', template: "<button mat-icon-button [color]=\"getButtonColor()\" [class]=\"getClasses()\" (click)=\"clickButton($event)\">\n <mat-icon>{{getIconName()}}</mat-icon>\n</button>" }]
188
- }] });
189
-
190
- class CheckboxColumnComponent extends TotsBaseColumnComponent {
191
- onChange(event) {
192
- let key = 'select-item';
193
- if (!event.checked) {
194
- key = 'unselect-item';
195
- }
196
- this.onAction.next({ key: key, item: this.item });
197
- }
198
- }
199
- CheckboxColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: CheckboxColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
200
- CheckboxColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: CheckboxColumnComponent, selector: "tots-checkbox-column", usesInheritance: true, ngImport: i0, template: "<div class=\"tots-checkbox-column\">\n <mat-checkbox (change)=\"onChange($event)\" (click)=\"$event.stopPropagation();\"></mat-checkbox>\n</div>", styles: [""], dependencies: [{ kind: "component", type: i1$1.MatCheckbox, selector: "mat-checkbox", inputs: ["disableRipple", "color", "tabIndex"], exportAs: ["matCheckbox"] }] });
201
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: CheckboxColumnComponent, decorators: [{
202
- type: Component,
203
- args: [{ selector: 'tots-checkbox-column', template: "<div class=\"tots-checkbox-column\">\n <mat-checkbox (change)=\"onChange($event)\" (click)=\"$event.stopPropagation();\"></mat-checkbox>\n</div>" }]
204
- }] });
205
-
206
- class OptionColumnComponent extends TotsBaseColumnComponent {
207
- getItemValue() {
208
- let value = TotsTableHelper.getItemValueByKey(this.item, this.column.field_key);
209
- for (const item of this.column.extra.options) {
210
- if (item[this.column.extra.field_rel_key] == value) {
211
- return item[this.column.extra.field_print_key];
212
- }
213
- }
214
- return '';
215
- }
216
- }
217
- OptionColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: OptionColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
218
- OptionColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: OptionColumnComponent, selector: "tots-option-column", usesInheritance: true, ngImport: i0, template: "{{getItemValue()}}", styles: [""] });
219
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: OptionColumnComponent, decorators: [{
220
- type: Component,
221
- args: [{ selector: 'tots-option-column', template: "{{getItemValue()}}" }]
222
- }] });
223
-
224
- class UserColumnComponent extends TotsBaseColumnComponent {
225
- getFirstname() {
226
- var _a;
227
- if ((_a = this.column.extra) === null || _a === void 0 ? void 0 : _a.field_firstname_key) {
228
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_firstname_key);
229
- }
230
- return '';
231
- }
232
- getLastname() {
233
- var _a;
234
- if ((_a = this.column.extra) === null || _a === void 0 ? void 0 : _a.field_lastname_key) {
235
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_lastname_key);
236
- }
237
- return '';
238
- }
239
- getFullname() {
240
- return this.getFirstname() + ' ' + this.getLastname();
241
- }
242
- getPhoto() {
243
- var _a;
244
- if ((_a = this.column.extra) === null || _a === void 0 ? void 0 : _a.field_photo_key) {
245
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_photo_key);
246
- }
247
- return '';
248
- }
249
- getSubtitle() {
250
- var _a;
251
- if ((_a = this.column.extra) === null || _a === void 0 ? void 0 : _a.field_subtitle_key) {
252
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_subtitle_key);
253
- }
254
- return '';
255
- }
256
- isOnline() {
257
- var _a;
258
- if ((_a = this.column.extra) === null || _a === void 0 ? void 0 : _a.field_online_key) {
259
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_online_key);
260
- }
261
- return false;
262
- }
263
- }
264
- UserColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: UserColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
265
- UserColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: UserColumnComponent, selector: "tots-user-column", usesInheritance: true, ngImport: i0, template: "<div class=\"user-avatar-component\">\n <div class=\"avatar\" *ngIf=\"getPhoto() != ''\">\n <img mat-card-avatar [src]=\"getPhoto()\" alt=\"{{ getFullname() }}\" class=\"cover-image\" onerror=\"this.src='/assets/img/user-avatar-empty.svg';\">\n </div>\n <div class=\"texts\">\n <div class=\"user\"> {{ getFullname() }} </div>\n <div class=\"body-2\" *ngIf=\"getSubtitle() != ''\"> {{ getSubtitle() }} </div>\n </div>\n <div class=\"check\" *ngIf=\"column.extra?.field_is_online && isOnline()\"><mat-icon>check</mat-icon></div>\n</div>", styles: [".user-avatar-component{display:flex;align-items:center;position:relative}.user-avatar-component .avatar{width:40px;min-width:40px;height:40px;min-height:40px;border-radius:40px;overflow:hidden;margin-right:16px}.user-avatar-component .avatar img{width:40px;min-width:40px;height:40px;min-height:40px}.user-avatar-component .texts .user{font-size:1.1em}.user-avatar-component .texts .body-2{color:#636363;font-size:.9em}.user-avatar-component .check{position:absolute;border:2px solid white;border-radius:200px;top:0;left:0;color:#24b524;background-color:#d7ffa3;width:1em;height:1em;display:flex;align-items:center;justify-content:center}.user-avatar-component .check mat-icon{line-height:1em;font-size:1em;width:1em;height:1em}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
266
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: UserColumnComponent, decorators: [{
267
- type: Component,
268
- args: [{ selector: 'tots-user-column', template: "<div class=\"user-avatar-component\">\n <div class=\"avatar\" *ngIf=\"getPhoto() != ''\">\n <img mat-card-avatar [src]=\"getPhoto()\" alt=\"{{ getFullname() }}\" class=\"cover-image\" onerror=\"this.src='/assets/img/user-avatar-empty.svg';\">\n </div>\n <div class=\"texts\">\n <div class=\"user\"> {{ getFullname() }} </div>\n <div class=\"body-2\" *ngIf=\"getSubtitle() != ''\"> {{ getSubtitle() }} </div>\n </div>\n <div class=\"check\" *ngIf=\"column.extra?.field_is_online && isOnline()\"><mat-icon>check</mat-icon></div>\n</div>", styles: [".user-avatar-component{display:flex;align-items:center;position:relative}.user-avatar-component .avatar{width:40px;min-width:40px;height:40px;min-height:40px;border-radius:40px;overflow:hidden;margin-right:16px}.user-avatar-component .avatar img{width:40px;min-width:40px;height:40px;min-height:40px}.user-avatar-component .texts .user{font-size:1.1em}.user-avatar-component .texts .body-2{color:#636363;font-size:.9em}.user-avatar-component .check{position:absolute;border:2px solid white;border-radius:200px;top:0;left:0;color:#24b524;background-color:#d7ffa3;width:1em;height:1em;display:flex;align-items:center;justify-content:center}.user-avatar-component .check mat-icon{line-height:1em;font-size:1em;width:1em;height:1em}\n"] }]
269
- }] });
270
-
271
- class CurrencyColumnComponent extends TotsBaseColumnComponent {
272
- }
273
- CurrencyColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: CurrencyColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
274
- CurrencyColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: CurrencyColumnComponent, selector: "tots-currency-column", usesInheritance: true, ngImport: i0, template: "<span [ngClass]=\"{'tots-currency-column-positive': getItemValue() > 0, 'tots-currency-column-negative': getItemValue() < 0}\">{{getItemValue()|currency}}</span>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1.CurrencyPipe, name: "currency" }] });
275
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: CurrencyColumnComponent, decorators: [{
276
- type: Component,
277
- args: [{ selector: 'tots-currency-column', template: "<span [ngClass]=\"{'tots-currency-column-positive': getItemValue() > 0, 'tots-currency-column-negative': getItemValue() < 0}\">{{getItemValue()|currency}}</span>" }]
278
- }] });
279
-
280
- class StatusColumnComponent extends OptionColumnComponent {
281
- getBackgroundColor() {
282
- let value = TotsTableHelper.getItemValueByKey(this.item, this.column.field_key);
283
- for (const item of this.column.extra.options) {
284
- if (item[this.column.extra.field_rel_key] == value && item['background_color'] != undefined) {
285
- return item['background_color'];
286
- }
287
- }
288
- return '';
289
- }
290
- getFontColor() {
291
- let value = TotsTableHelper.getItemValueByKey(this.item, this.column.field_key);
292
- for (const item of this.column.extra.options) {
293
- if (item[this.column.extra.field_rel_key] == value && item['font_color'] != undefined) {
294
- return item['font_color'];
295
- }
296
- }
297
- return '';
298
- }
299
- }
300
- StatusColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: StatusColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
301
- StatusColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: StatusColumnComponent, selector: "tots-status-column", usesInheritance: true, ngImport: i0, template: "<span class=\"tots-status-column\" [ngStyle]=\"{'background-color': getBackgroundColor(), 'color': getFontColor()}\">{{getItemValue()}}</span>", styles: [".tots-status-column{display:inline-block;padding:3px 10px;background-color:#e7e7e7;color:#08081699;font-size:x-small;font-weight:700;text-transform:uppercase}\n"], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] });
302
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: StatusColumnComponent, decorators: [{
303
- type: Component,
304
- args: [{ selector: 'tots-status-column', template: "<span class=\"tots-status-column\" [ngStyle]=\"{'background-color': getBackgroundColor(), 'color': getFontColor()}\">{{getItemValue()}}</span>", styles: [".tots-status-column{display:inline-block;padding:3px 10px;background-color:#e7e7e7;color:#08081699;font-size:x-small;font-weight:700;text-transform:uppercase}\n"] }]
305
- }] });
306
-
307
- class BalanceCurrencyColumnComponent extends TotsBaseColumnComponent {
308
- getBalance() {
309
- return this.getDebit() - this.getCredit();
310
- }
311
- getDebit() {
312
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_key_debit);
313
- }
314
- getCredit() {
315
- return TotsTableHelper.getItemValueByKey(this.item, this.column.extra.field_key_credit);
316
- }
317
- }
318
- BalanceCurrencyColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BalanceCurrencyColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
319
- BalanceCurrencyColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: BalanceCurrencyColumnComponent, selector: "tots-balance-currency-column", usesInheritance: true, ngImport: i0, template: "<span [ngClass]=\"{'tots-balance-column-positive': getBalance() > 0, 'tots-balance-column-negative': getBalance() < 0}\">{{getBalance()|currency}}</span>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i1.CurrencyPipe, name: "currency" }] });
320
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BalanceCurrencyColumnComponent, decorators: [{
321
- type: Component,
322
- args: [{ selector: 'tots-balance-currency-column', template: "<span [ngClass]=\"{'tots-balance-column-positive': getBalance() > 0, 'tots-balance-column-negative': getBalance() < 0}\">{{getBalance()|currency}}</span>" }]
323
- }] });
324
-
325
- class StatusIconColumnComponent extends OptionColumnComponent {
326
- getFontColor() {
327
- let value = TotsTableHelper.getItemValueByKey(this.item, this.column.field_key);
328
- for (const item of this.column.extra.options) {
329
- if (item[this.column.extra.field_rel_key] == value && item['font_color'] != undefined) {
330
- return item['font_color'];
331
- }
332
- }
333
- return '';
334
- }
335
- }
336
- StatusIconColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: StatusIconColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
337
- StatusIconColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: StatusIconColumnComponent, selector: "tots-status-icon-column", usesInheritance: true, ngImport: i0, template: "<span class=\"tots-status-icon-column\" [ngStyle]=\"{'color': getFontColor()}\"><mat-icon>{{getItemValue()}}</mat-icon></span>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
338
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: StatusIconColumnComponent, decorators: [{
339
- type: Component,
340
- args: [{ selector: 'tots-status-icon-column', template: "<span class=\"tots-status-icon-column\" [ngStyle]=\"{'color': getFontColor()}\"><mat-icon>{{getItemValue()}}</mat-icon></span>" }]
341
- }] });
342
-
343
- class BalanceCurrencyIconColumnComponent extends BalanceCurrencyColumnComponent {
344
- getIconPositive() {
345
- return this.column.extra.icon_positive;
346
- }
347
- getIconNegative() {
348
- return this.column.extra.icon_negative;
349
- }
350
- getIconNeutral() {
351
- return this.column.extra.icon_neutral;
352
- }
353
- }
354
- BalanceCurrencyIconColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BalanceCurrencyIconColumnComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
355
- BalanceCurrencyIconColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: BalanceCurrencyIconColumnComponent, selector: "tots-balance-currency-icon-column", usesInheritance: true, ngImport: i0, template: "<span [ngClass]=\"{'tots-balance-column-positive': getBalance() > 0, 'tots-balance-column-negative': getBalance() < 0}\">\n <mat-icon *ngIf=\"getBalance() > 0\">{{getIconPositive()}}</mat-icon>\n <mat-icon *ngIf=\"getBalance() < 0\">{{getIconNegative()}}</mat-icon>\n <mat-icon *ngIf=\"getBalance() == 0\">{{getIconNeutral()}}</mat-icon>\n</span>", styles: [""], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }] });
356
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BalanceCurrencyIconColumnComponent, decorators: [{
357
- type: Component,
358
- args: [{ selector: 'tots-balance-currency-icon-column', template: "<span [ngClass]=\"{'tots-balance-column-positive': getBalance() > 0, 'tots-balance-column-negative': getBalance() < 0}\">\n <mat-icon *ngIf=\"getBalance() > 0\">{{getIconPositive()}}</mat-icon>\n <mat-icon *ngIf=\"getBalance() < 0\">{{getIconNegative()}}</mat-icon>\n <mat-icon *ngIf=\"getBalance() == 0\">{{getIconNeutral()}}</mat-icon>\n</span>" }]
359
- }] });
360
-
361
- class BasePrintColumnComponent {
362
- constructor(viewContainerRef) {
363
- this.viewContainerRef = viewContainerRef;
364
- }
365
- ngOnInit() {
366
- const view = this.viewContainerRef.createComponent(this.column.component);
367
- view.instance.column = this.column;
368
- view.instance.item = this.item;
369
- view.instance.onAction = this.onAction;
370
- view.instance.index = this.index;
371
- }
372
- }
373
- BasePrintColumnComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BasePrintColumnComponent, deps: [{ token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
374
- BasePrintColumnComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: BasePrintColumnComponent, selector: "tots-base-print-column", inputs: { column: "column", item: "item", onAction: "onAction", index: "index" }, ngImport: i0, template: "<div #contentColumn></div>", styles: [""] });
375
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: BasePrintColumnComponent, decorators: [{
376
- type: Component,
377
- args: [{ selector: 'tots-base-print-column', template: "<div #contentColumn></div>" }]
378
- }], ctorParameters: function () { return [{ type: i0.ViewContainerRef }]; }, propDecorators: { column: [{
379
- type: Input
380
- }], item: [{
381
- type: Input
382
- }], onAction: [{
383
- type: Input
384
- }], index: [{
385
- type: Input
386
- }] } });
387
-
388
- class LoadingAnimationRendererComponent {
389
- //#region Setup
390
- constructor(totsTableDefaultConfig, viewContainerRef) {
391
- this.totsTableDefaultConfig = totsTableDefaultConfig;
392
- this.viewContainerRef = viewContainerRef;
393
- }
394
- ngOnInit() {
395
- this.setLoader();
396
- }
397
- ngOnDestroy() {
398
- var _a;
399
- (_a = this.loadingComponentContainer) === null || _a === void 0 ? void 0 : _a.clear();
400
- }
401
- setLoader() {
402
- if (this.totsTableDefaultConfig.loadingComponent) {
403
- this.loadingComponent = this.viewContainerRef.createComponent(this.totsTableDefaultConfig.loadingComponent);
404
- }
405
- else {
406
- this.loadingComponent = this.viewContainerRef.createComponent(MatProgressSpinner);
407
- this.loadingComponent.instance.diameter = 50;
408
- this.loadingComponent.instance.mode = "indeterminate";
409
- }
410
- }
411
- }
412
- LoadingAnimationRendererComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: LoadingAnimationRendererComponent, deps: [{ token: TOTS_TABLE_DEFAULT_CONFIG }, { token: i0.ViewContainerRef }], target: i0.ɵɵFactoryTarget.Component });
413
- LoadingAnimationRendererComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: LoadingAnimationRendererComponent, selector: "tots-loading-animation-renderer", viewQueries: [{ propertyName: "loadingComponentContainer", first: true, predicate: ["loadingComponentContainer"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: "<ng-container #loadingComponentContainer></ng-container>", styles: [""] });
414
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: LoadingAnimationRendererComponent, decorators: [{
415
- type: Component,
416
- args: [{ selector: 'tots-loading-animation-renderer', template: "<ng-container #loadingComponentContainer></ng-container>" }]
417
- }], ctorParameters: function () {
418
- return [{ type: TotsTableDefaultConfig, decorators: [{
419
- type: Inject,
420
- args: [TOTS_TABLE_DEFAULT_CONFIG]
421
- }] }, { type: i0.ViewContainerRef }];
422
- }, propDecorators: { loadingComponentContainer: [{
423
- type: ViewChild,
424
- args: ['loadingComponentContainer', { read: ViewContainerRef }]
425
- }] } });
426
-
427
- class TotsTableComponent {
428
- constructor(totsTableDefaultConfig, changeDectetor) {
429
- this.totsTableDefaultConfig = totsTableDefaultConfig;
430
- this.changeDectetor = changeDectetor;
431
- this.config = new TotsTableConfig();
432
- this.pageIndex = 0;
433
- this.pageSize = 50;
434
- this.hasPagination = true;
435
- this.onAction = new EventEmitter();
436
- this.privateActions = new Subject();
437
- this.isLoading = true;
438
- this.firstLoad = true;
439
- this.displayColumns = [];
440
- this.messageNotFound = this.totsTableDefaultConfig.messageNotFound || "No results found, please try with other search terms";
441
- }
442
- ngOnInit() {
443
- this.loadConfig();
444
- this.loadItems();
445
- }
446
- onClickOrder(column) {
447
- if (!column.hasOrder) {
448
- return;
449
- }
450
- let orderColumn = column.order;
451
- this.config.columns.forEach(c => c.order = undefined);
452
- column.order = orderColumn == 'asc' ? 'desc' : 'asc';
453
- this.onAction.emit({ key: 'click-order', item: column });
454
- }
455
- onClickRow(item) {
456
- this.onAction.emit({ key: 'click-row', item: item });
457
- }
458
- onPageChange(event) {
459
- this.onAction.emit({ key: 'page-change', item: event });
460
- }
461
- loadItems() {
462
- var _a;
463
- this.isLoading = true;
464
- return (_a = this.config.obs) === null || _a === void 0 ? void 0 : _a.pipe(tap(res => this.dataItems = res)).pipe(tap(res => this.onAction.emit({ key: 'loaded-items', item: undefined }))).subscribe(() => this.stopLoading());
465
- }
466
- stopLoading() {
467
- this.isLoading = false;
468
- this.firstLoad = false;
469
- }
470
- loadConfig() {
471
- this.loadColumns();
472
- this.privateActions.subscribe(action => {
473
- this.onAction.emit(action);
474
- });
475
- }
476
- loadColumns() {
477
- this.displayColumns = this.config.columns.filter(c => c.is_show || c.is_show == undefined).map(c => c.key);
478
- }
479
- getDataItems() {
480
- return this.dataItems;
481
- }
482
- refreshDataItems(newData) {
483
- this.dataItems = newData;
484
- }
485
- detectChanges() {
486
- this.changeDectetor.detectChanges();
487
- }
488
- }
489
- TotsTableComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableComponent, deps: [{ token: TOTS_TABLE_DEFAULT_CONFIG }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
490
- TotsTableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: TotsTableComponent, selector: "tots-table", inputs: { config: "config", pageIndex: "pageIndex", pageSize: "pageSize", hasPagination: "hasPagination", messageNotFound: "messageNotFound" }, outputs: { onAction: "onAction" }, ngImport: i0, template: "<div class=\"tots-table-container {{config.classes}}\">\n <table mat-table [dataSource]=\"dataItems != undefined ? dataItems!.data : []\">\n\n <ng-container *ngFor=\"let column of config.columns\" [matColumnDef]=\"column.key\" [stickyEnd]=\"column.extra?.stickyEnd ?? false\">\n <!-- TH-->\n <th mat-header-cell *matHeaderCellDef [ngClass]=\"{'tots-tr-has-order': column.hasOrder}\" (click)=\"onClickOrder(column)\">\n {{ column.title }}\n <mat-icon [ngClass]=\"{'sort_active': column.order == 'asc'}\">arrow_drop_up</mat-icon>\n <mat-icon [ngClass]=\"{'sort_active': column.order == 'desc'}\">arrow_drop_down</mat-icon>\n </th>\n <!-- TD -->\n <td mat-cell *matCellDef=\"let item; let index = index;\" [ngStyle]=\"{'width': column.extra?.width ? column.extra.width : 'auto'}\"><tots-base-print-column [column]=\"column\" [item]=\"item\" [index]=\"index\" [onAction]=\"privateActions\"></tots-base-print-column></td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayColumns;\" (click)=\"onClickRow(row)\" [class]=\"row.classCustom\" [ngClass]=\"{'tots-cell-selected': row.isSelected}\"></tr>\n\n <!-- Row shown when there is no matching data. -->\n <ng-container *ngIf=\"!isLoading\">\n <tr class=\"tots-table-not-data\" *matNoDataRow><td class=\"mat-cell\" [colSpan]=\"config.columns.length\">{{ messageNotFound }}</td></tr>\n </ng-container>\n </table>\n\n <div *ngIf=\"isLoading && firstLoad\" class=\"tots-table-loading\">\n <tots-loading-animation-renderer></tots-loading-animation-renderer>\n </div>\n\n <div class=\"tots-table-bar-loading\">\n <mat-progress-bar *ngIf=\"isLoading && !firstLoad\" [mode]=\"'indeterminate'\"></mat-progress-bar>\n </div>\n\n <!-- Paginator -->\n <mat-paginator *ngIf=\"dataItems && dataItems.data.length > 0 && hasPagination\" [pageIndex]=\"pageIndex-1\" [length]=\"dataItems!.total\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"[5, 10, 25, 50, 100]\" (page)=\"onPageChange($event)\"></mat-paginator>\n</div>\n", styles: [".tots-table-container .mat-mdc-header-cell{position:relative}.tots-table-container .mat-mdc-header-cell mat-icon{display:none}.tots-table-container .tots-tr-has-order{cursor:pointer}.tots-table-container .tots-tr-has-order:hover mat-icon{opacity:.5}.tots-table-container .tots-tr-has-order mat-icon{display:inline;opacity:.3;position:absolute}.tots-table-container .tots-tr-has-order mat-icon:nth-of-type(1){top:12px}.tots-table-container .tots-tr-has-order mat-icon:nth-of-type(2){top:20px}.tots-table-container .tots-tr-has-order .sort_active{opacity:1!important}.tots-table-container .tots-table-loading{display:flex;justify-content:center;text-align:center}.tots-table-container .tots-table-bar-loading{height:4px}.tots-table-container .tots-table-not-data{font-size:large;text-align:center}.tots-table-container .tots-table-not-data td{padding:24px}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i2.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i3$1.MatTable, selector: "mat-table, table[mat-table]", exportAs: ["matTable"] }, { kind: "directive", type: i3$1.MatHeaderCellDef, selector: "[matHeaderCellDef]" }, { kind: "directive", type: i3$1.MatHeaderRowDef, selector: "[matHeaderRowDef]", inputs: ["matHeaderRowDef", "matHeaderRowDefSticky"] }, { kind: "directive", type: i3$1.MatColumnDef, selector: "[matColumnDef]", inputs: ["sticky", "matColumnDef"] }, { kind: "directive", type: i3$1.MatCellDef, selector: "[matCellDef]" }, { kind: "directive", type: i3$1.MatRowDef, selector: "[matRowDef]", inputs: ["matRowDefColumns", "matRowDefWhen"] }, { kind: "directive", type: i3$1.MatHeaderCell, selector: "mat-header-cell, th[mat-header-cell]" }, { kind: "directive", type: i3$1.MatCell, selector: "mat-cell, td[mat-cell]" }, { kind: "component", type: i3$1.MatHeaderRow, selector: "mat-header-row, tr[mat-header-row]", exportAs: ["matHeaderRow"] }, { kind: "component", type: i3$1.MatRow, selector: "mat-row, tr[mat-row]", exportAs: ["matRow"] }, { kind: "directive", type: i3$1.MatNoDataRow, selector: "ng-template[matNoDataRow]" }, { kind: "component", type: i4$1.MatPaginator, selector: "mat-paginator", inputs: ["disabled"], exportAs: ["matPaginator"] }, { kind: "component", type: i5.MatProgressBar, selector: "mat-progress-bar", inputs: ["color", "value", "bufferValue", "mode"], outputs: ["animationEnd"], exportAs: ["matProgressBar"] }, { kind: "component", type: BasePrintColumnComponent, selector: "tots-base-print-column", inputs: ["column", "item", "onAction", "index"] }, { kind: "component", type: LoadingAnimationRendererComponent, selector: "tots-loading-animation-renderer" }] });
491
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableComponent, decorators: [{
492
- type: Component,
493
- args: [{ selector: 'tots-table', template: "<div class=\"tots-table-container {{config.classes}}\">\n <table mat-table [dataSource]=\"dataItems != undefined ? dataItems!.data : []\">\n\n <ng-container *ngFor=\"let column of config.columns\" [matColumnDef]=\"column.key\" [stickyEnd]=\"column.extra?.stickyEnd ?? false\">\n <!-- TH-->\n <th mat-header-cell *matHeaderCellDef [ngClass]=\"{'tots-tr-has-order': column.hasOrder}\" (click)=\"onClickOrder(column)\">\n {{ column.title }}\n <mat-icon [ngClass]=\"{'sort_active': column.order == 'asc'}\">arrow_drop_up</mat-icon>\n <mat-icon [ngClass]=\"{'sort_active': column.order == 'desc'}\">arrow_drop_down</mat-icon>\n </th>\n <!-- TD -->\n <td mat-cell *matCellDef=\"let item; let index = index;\" [ngStyle]=\"{'width': column.extra?.width ? column.extra.width : 'auto'}\"><tots-base-print-column [column]=\"column\" [item]=\"item\" [index]=\"index\" [onAction]=\"privateActions\"></tots-base-print-column></td>\n </ng-container>\n\n <tr mat-header-row *matHeaderRowDef=\"displayColumns\"></tr>\n <tr mat-row *matRowDef=\"let row; columns: displayColumns;\" (click)=\"onClickRow(row)\" [class]=\"row.classCustom\" [ngClass]=\"{'tots-cell-selected': row.isSelected}\"></tr>\n\n <!-- Row shown when there is no matching data. -->\n <ng-container *ngIf=\"!isLoading\">\n <tr class=\"tots-table-not-data\" *matNoDataRow><td class=\"mat-cell\" [colSpan]=\"config.columns.length\">{{ messageNotFound }}</td></tr>\n </ng-container>\n </table>\n\n <div *ngIf=\"isLoading && firstLoad\" class=\"tots-table-loading\">\n <tots-loading-animation-renderer></tots-loading-animation-renderer>\n </div>\n\n <div class=\"tots-table-bar-loading\">\n <mat-progress-bar *ngIf=\"isLoading && !firstLoad\" [mode]=\"'indeterminate'\"></mat-progress-bar>\n </div>\n\n <!-- Paginator -->\n <mat-paginator *ngIf=\"dataItems && dataItems.data.length > 0 && hasPagination\" [pageIndex]=\"pageIndex-1\" [length]=\"dataItems!.total\" [pageSize]=\"pageSize\" [pageSizeOptions]=\"[5, 10, 25, 50, 100]\" (page)=\"onPageChange($event)\"></mat-paginator>\n</div>\n", styles: [".tots-table-container .mat-mdc-header-cell{position:relative}.tots-table-container .mat-mdc-header-cell mat-icon{display:none}.tots-table-container .tots-tr-has-order{cursor:pointer}.tots-table-container .tots-tr-has-order:hover mat-icon{opacity:.5}.tots-table-container .tots-tr-has-order mat-icon{display:inline;opacity:.3;position:absolute}.tots-table-container .tots-tr-has-order mat-icon:nth-of-type(1){top:12px}.tots-table-container .tots-tr-has-order mat-icon:nth-of-type(2){top:20px}.tots-table-container .tots-tr-has-order .sort_active{opacity:1!important}.tots-table-container .tots-table-loading{display:flex;justify-content:center;text-align:center}.tots-table-container .tots-table-bar-loading{height:4px}.tots-table-container .tots-table-not-data{font-size:large;text-align:center}.tots-table-container .tots-table-not-data td{padding:24px}\n"] }]
494
- }], ctorParameters: function () {
495
- return [{ type: TotsTableDefaultConfig, decorators: [{
496
- type: Inject,
497
- args: [TOTS_TABLE_DEFAULT_CONFIG]
498
- }] }, { type: i0.ChangeDetectorRef }];
499
- }, propDecorators: { config: [{
500
- type: Input
501
- }], pageIndex: [{
502
- type: Input
503
- }], pageSize: [{
504
- type: Input
505
- }], hasPagination: [{
506
- type: Input
507
- }], messageNotFound: [{
508
- type: Input
509
- }], onAction: [{
510
- type: Output
511
- }] } });
512
-
513
- class TotsTableApiComponent {
514
- constructor() {
515
- this.config = new TotsTableApiConfig();
516
- this.hasPagination = true;
517
- this.isPaginationStartIndexInZero = false;
518
- this.onAction = new EventEmitter();
519
- this.configTable = new TotsTableConfig();
520
- }
521
- ngOnInit() {
522
- this.loadConfig();
523
- }
524
- onTableAction(action) {
525
- if (action.key == 'page-change') {
526
- this.config.query.per_page = action.item.pageSize;
527
- if (this.isPaginationStartIndexInZero) {
528
- this.config.query.page = action.item.pageIndex;
529
- }
530
- else {
531
- this.config.query.page = action.item.pageIndex + 1;
532
- }
533
- this.configTable.obs = this.config.service.list(this.config.query);
534
- }
535
- this.onAction.emit(action);
536
- }
537
- loadConfig() {
538
- this.configTable.id = this.config.id;
539
- this.configTable.columns = this.config.columns;
540
- this.configTable.obs = this.config.service.list(this.config.query);
541
- this.configTable.classes = this.config.classes;
542
- }
543
- refreshQueryAndLoadItems() {
544
- this.configTable.obs = this.config.service.list(this.config.query);
545
- return this.loadItems();
546
- }
547
- loadItems() {
548
- return this.tableComp.loadItems();
549
- }
550
- getDataItems() {
551
- return this.tableComp.getDataItems();
552
- }
553
- setObs(obs) {
554
- this.configTable.obs = obs;
555
- }
556
- }
557
- TotsTableApiComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableApiComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
558
- TotsTableApiComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.0.3", type: TotsTableApiComponent, selector: "tots-table-api", inputs: { config: "config", hasPagination: "hasPagination", isPaginationStartIndexInZero: "isPaginationStartIndexInZero" }, outputs: { onAction: "onAction" }, viewQueries: [{ propertyName: "tableComp", first: true, predicate: ["tableComp"], descendants: true }], ngImport: i0, template: "<tots-table #tableComp [config]=\"configTable\" [pageIndex]=\"config.query.page\" [pageSize]=\"config.query.per_page\" (onAction)=\"onTableAction($event)\" [hasPagination]=\"hasPagination\"></tots-table>\n", styles: [""], dependencies: [{ kind: "component", type: TotsTableComponent, selector: "tots-table", inputs: ["config", "pageIndex", "pageSize", "hasPagination", "messageNotFound"], outputs: ["onAction"] }] });
559
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableApiComponent, decorators: [{
560
- type: Component,
561
- args: [{ selector: 'tots-table-api', template: "<tots-table #tableComp [config]=\"configTable\" [pageIndex]=\"config.query.page\" [pageSize]=\"config.query.per_page\" (onAction)=\"onTableAction($event)\" [hasPagination]=\"hasPagination\"></tots-table>\n" }]
562
- }], propDecorators: { tableComp: [{
563
- type: ViewChild,
564
- args: ['tableComp']
565
- }], config: [{
566
- type: Input
567
- }], hasPagination: [{
568
- type: Input
569
- }], isPaginationStartIndexInZero: [{
570
- type: Input
571
- }], onAction: [{
572
- type: Output
573
- }] } });
574
-
575
- class TotsTableModule {
576
- }
577
- TotsTableModule.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule });
578
- TotsTableModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "15.0.3", ngImport: i0, type: TotsTableModule, declarations: [TotsTableComponent,
579
- BasePrintColumnComponent,
580
- StringColumnComponent,
581
- TotsTableApiComponent,
582
- MoreMenuColumnComponent,
583
- BooleanColumnComponent,
584
- TwoStringColumnComponent,
585
- IconButtonColumnComponent,
586
- CheckboxColumnComponent,
587
- OptionColumnComponent,
588
- UserColumnComponent,
589
- CurrencyColumnComponent,
590
- StatusColumnComponent,
591
- BalanceCurrencyColumnComponent,
592
- StatusIconColumnComponent,
593
- BalanceCurrencyIconColumnComponent,
594
- LoadingAnimationRendererComponent], imports: [CommonModule,
595
- // Angular Material
596
- MatIconModule,
597
- MatTableModule,
598
- MatPaginatorModule,
599
- MatButtonModule,
600
- MatMenuModule,
601
- MatCheckboxModule,
602
- MatProgressSpinnerModule,
603
- MatProgressBarModule], exports: [TotsTableComponent,
604
- TotsTableApiComponent] });
605
- TotsTableModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableModule, providers: [
606
- {
607
- provide: TOTS_TABLE_DEFAULT_CONFIG,
608
- useClass: TotsTableDefaultConfig
609
- }
610
- ], imports: [CommonModule,
611
- // Angular Material
612
- MatIconModule,
613
- MatTableModule,
614
- MatPaginatorModule,
615
- MatButtonModule,
616
- MatMenuModule,
617
- MatCheckboxModule,
618
- MatProgressSpinnerModule,
619
- MatProgressBarModule] });
620
- i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.0.3", ngImport: i0, type: TotsTableModule, decorators: [{
621
- type: NgModule,
622
- args: [{
623
- declarations: [
624
- TotsTableComponent,
625
- BasePrintColumnComponent,
626
- StringColumnComponent,
627
- TotsTableApiComponent,
628
- MoreMenuColumnComponent,
629
- BooleanColumnComponent,
630
- TwoStringColumnComponent,
631
- IconButtonColumnComponent,
632
- CheckboxColumnComponent,
633
- OptionColumnComponent,
634
- UserColumnComponent,
635
- CurrencyColumnComponent,
636
- StatusColumnComponent,
637
- BalanceCurrencyColumnComponent,
638
- StatusIconColumnComponent,
639
- BalanceCurrencyIconColumnComponent,
640
- LoadingAnimationRendererComponent
641
- ],
642
- imports: [
643
- CommonModule,
644
- // Angular Material
645
- MatIconModule,
646
- MatTableModule,
647
- MatPaginatorModule,
648
- MatButtonModule,
649
- MatMenuModule,
650
- MatCheckboxModule,
651
- MatProgressSpinnerModule,
652
- MatProgressBarModule
653
- ],
654
- exports: [
655
- TotsTableComponent,
656
- TotsTableApiComponent
657
- ],
658
- providers: [
659
- {
660
- provide: TOTS_TABLE_DEFAULT_CONFIG,
661
- useClass: TotsTableDefaultConfig
662
- }
663
- ]
664
- }]
665
- }] });
666
-
667
- /*
668
- * Public API Surface of table
669
- */
670
-
671
- /**
672
- * Generated bundle index. Do not edit.
673
- */
674
-
675
- export { BalanceCurrencyColumnComponent, BalanceCurrencyIconColumnComponent, BooleanColumnComponent, CheckboxColumnComponent, CurrencyColumnComponent, IconButtonColumnComponent, MoreMenuColumnComponent, OptionColumnComponent, StatusColumnComponent, StatusIconColumnComponent, StringColumnComponent, TOTS_TABLE_DEFAULT_CONFIG, TotsActionTable, TotsBaseColumnComponent, TotsColumn, TotsTableApiComponent, TotsTableApiConfig, TotsTableComponent, TotsTableConfig, TotsTableDefaultConfig, TotsTableHelper, TotsTableModule, TwoStringColumnComponent, UserColumnComponent };
676
- //# sourceMappingURL=tots-table.mjs.map