@tetacom/ng-components 1.0.29 → 1.0.33
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/component/table/default/list-cell/list-cell.component.d.ts +1 -0
- package/component/table/head-cell-dropdown/head-cell-dropdown.component.d.ts +1 -0
- package/directive/loader/loader.directive.d.ts +3 -1
- package/esm2020/component/date-picker/date-picker/date-picker.component.mjs +2 -2
- package/esm2020/component/filter/string-filter/string-filter.component.mjs +5 -4
- package/esm2020/component/table/default/list-cell/list-cell.component.mjs +13 -3
- package/esm2020/component/table/head-cell/head-cell.component.mjs +3 -3
- package/esm2020/component/table/head-cell-dropdown/head-cell-dropdown.component.mjs +12 -5
- package/esm2020/component/table/service/table.service.mjs +2 -1
- package/esm2020/component/table/table-body/table-body.component.mjs +3 -3
- package/esm2020/directive/loader/loader.directive.mjs +15 -2
- package/fesm2015/tetacom-ng-components.mjs +47 -14
- package/fesm2015/tetacom-ng-components.mjs.map +1 -1
- package/fesm2020/tetacom-ng-components.mjs +46 -14
- package/fesm2020/tetacom-ng-components.mjs.map +1 -1
- package/package.json +1 -1
- package/style/loader.scss +10 -0
|
@@ -2117,7 +2117,7 @@ class DatePickerComponent {
|
|
|
2117
2117
|
applyValue(date) {
|
|
2118
2118
|
this.setDate(date);
|
|
2119
2119
|
this.value = this.currentValue;
|
|
2120
|
-
this.onChange(this.value);
|
|
2120
|
+
this.onChange(new Date(this.value));
|
|
2121
2121
|
this.open = false;
|
|
2122
2122
|
}
|
|
2123
2123
|
focus() {
|
|
@@ -3538,7 +3538,8 @@ class StringFilterComponent extends FilterComponentBase {
|
|
|
3538
3538
|
get state() {
|
|
3539
3539
|
return this.state$;
|
|
3540
3540
|
}
|
|
3541
|
-
ngOnInit() {
|
|
3541
|
+
ngOnInit() {
|
|
3542
|
+
}
|
|
3542
3543
|
setFilter() {
|
|
3543
3544
|
this.filterChanged.emit(this.filter);
|
|
3544
3545
|
}
|
|
@@ -3557,10 +3558,10 @@ class StringFilterComponent extends FilterComponentBase {
|
|
|
3557
3558
|
}
|
|
3558
3559
|
}
|
|
3559
3560
|
StringFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: StringFilterComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3560
|
-
StringFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: StringFilterComponent, selector: "teta-string-filter", inputs: { column: "column", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "<div class=\"padding-3\">\n <teta-input [label]=\"'\u041F\u043E\u0438\u0441\u043A'\">\n <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" />\n </teta-input>\n</div>\n\n", styles: [""], components: [{ type: InputComponent, selector: "teta-input", inputs: ["label", "horizontal", "required"] }], directives: [{ type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3561
|
+
StringFilterComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: StringFilterComponent, selector: "teta-string-filter", inputs: { column: "column", filterOptions: "filterOptions", state: "state" }, outputs: { filterChanged: "filterChanged" }, usesInheritance: true, ngImport: i0, template: "<div class=\"padding-3\">\n <teta-input [label]=\"'\u041F\u043E\u0438\u0441\u043A'\">\n <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" (keydown.enter)=\"setFilter()\" />\n </teta-input>\n</div>\n\n", styles: [""], components: [{ type: InputComponent, selector: "teta-input", inputs: ["label", "horizontal", "required"] }], directives: [{ type: i3.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
3561
3562
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: StringFilterComponent, decorators: [{
|
|
3562
3563
|
type: Component,
|
|
3563
|
-
args: [{ selector: 'teta-string-filter', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"padding-3\">\n <teta-input [label]=\"'\u041F\u043E\u0438\u0441\u043A'\">\n <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" />\n </teta-input>\n</div>\n\n", styles: [""] }]
|
|
3564
|
+
args: [{ selector: 'teta-string-filter', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"padding-3\">\n <teta-input [label]=\"'\u041F\u043E\u0438\u0441\u043A'\">\n <input type=\"text\" class=\"input\" [(ngModel)]=\"filter.value\" (blur)=\"setFilter()\" (keydown.enter)=\"setFilter()\" />\n </teta-input>\n</div>\n\n", styles: [""] }]
|
|
3564
3565
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { column: [{
|
|
3565
3566
|
type: Input
|
|
3566
3567
|
}], filterOptions: [{
|
|
@@ -7297,6 +7298,7 @@ class TableService {
|
|
|
7297
7298
|
var _a;
|
|
7298
7299
|
if (((_a = this._currentEditRow) === null || _a === void 0 ? void 0 : _a.row) !== (cellCoordinates === null || cellCoordinates === void 0 ? void 0 : cellCoordinates.row)) {
|
|
7299
7300
|
if (this._currentEditRow != null) {
|
|
7301
|
+
const row = this._displayData.value.indexOf(this._currentEditRow.row);
|
|
7300
7302
|
this._editRowStop.next(this._currentEditRow);
|
|
7301
7303
|
}
|
|
7302
7304
|
if (cellCoordinates === null) {
|
|
@@ -8143,6 +8145,9 @@ class HeadCellDropdownComponent {
|
|
|
8143
8145
|
this.hiddenColumns = _;
|
|
8144
8146
|
});
|
|
8145
8147
|
}
|
|
8148
|
+
enter() {
|
|
8149
|
+
this.applyFilter();
|
|
8150
|
+
}
|
|
8146
8151
|
get sortParam() {
|
|
8147
8152
|
return StateUtil.getSortState(this.state, this.column);
|
|
8148
8153
|
}
|
|
@@ -8220,7 +8225,8 @@ class HeadCellDropdownComponent {
|
|
|
8220
8225
|
setColumnsVisibility() {
|
|
8221
8226
|
this._svc.setHiddenColumns(this.hiddenColumns);
|
|
8222
8227
|
}
|
|
8223
|
-
ngOnInit() {
|
|
8228
|
+
ngOnInit() {
|
|
8229
|
+
}
|
|
8224
8230
|
ngOnDestroy() {
|
|
8225
8231
|
this._alive = false;
|
|
8226
8232
|
}
|
|
@@ -8256,10 +8262,10 @@ class HeadCellDropdownComponent {
|
|
|
8256
8262
|
}
|
|
8257
8263
|
}
|
|
8258
8264
|
HeadCellDropdownComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellDropdownComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
8259
|
-
HeadCellDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: { columns: "columns", column: "column", state: "state", dropDownOpen: "dropDownOpen" }, outputs: { dropDownOpenChange: "dropDownOpenChange", autosize: "autosize", autosizeAll: "autosizeAll" }, host: { properties: { "class.shadow-2": "this.shadow", "class.bg-background-50": "this.bg" } }, ngImport: i0, template: "<teta-tabs class=\"column_auto\">\n <teta-tab *ngIf=\"column.filterable\">\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'filter'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <teta-filter-host [column]=\"column\"
|
|
8265
|
+
HeadCellDropdownComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: { columns: "columns", column: "column", state: "state", dropDownOpen: "dropDownOpen" }, outputs: { dropDownOpenChange: "dropDownOpenChange", autosize: "autosize", autosizeAll: "autosizeAll" }, host: { listeners: { "keydown.enter": "enter()" }, properties: { "class.shadow-2": "this.shadow", "class.bg-background-50": "this.bg" } }, ngImport: i0, template: "<teta-tabs class=\"column_auto\">\n <teta-tab *ngIf=\"column.filterable\">\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'filter'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <teta-filter-host [column]=\"column\"\n [state]=\"state\"\n *ngIf=\"dict | async as d\"\n [filterOptions]=\"d[column.name]\"></teta-filter-host>\n <teta-toolbar class=\"justify-content-between\">\n <button teta-button [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"clearFilter()\">\n \u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C\n </button>\n <button teta-button [palette]=\"'primary'\" (click)=\"applyFilter()\">\n <teta-icon [name]=\"'tick'\"></teta-icon>\n \u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C\n </button>\n </teta-toolbar>\n </ng-template>\n </teta-tab>\n <teta-tab *ngIf=\"column.headDropdownTemplate\">\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'measurement'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <ng-container\n *ngTemplateOutlet=\"column.headDropdownTemplate; context: {$implicit: column, column: column}\"></ng-container>\n </ng-template>\n </teta-tab>\n <teta-tab>\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'menu'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <div class=\"list column_auto\">\n <div class=\"list-item list-item_interactive\" (click)=\"pinColumn()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"column.locked ? 'unpin' : 'pin'\"\n class=\"margin-right-2\"></teta-icon>\n {{column.locked ? '\u041E\u0442\u043A\u0440\u0435\u043F\u0438\u0442\u044C' : '\u0417\u0430\u043A\u0440\u0435\u043F\u0438\u0442\u044C'}}\n </div>\n <div class=\"list-divider\"></div>\n <ng-container *ngIf=\"hasSortedColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"sortParam\"\n (click)=\"clearSort()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\" class=\"margin-right-2\"></teta-icon>\n \u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C \u0441\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u043A\u0443\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllSort()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\"\n class=\"margin-right-2\"></teta-icon>\n \u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C \u0432\u0441\u0435 \u0441\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u043A\u0438\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <ng-container *ngIf=\"hasFilteredColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"filtered\"\n (click)=\"clearFilter()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\"\n class=\"margin-right-2\"></teta-icon>\n \u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllFilters()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\"\n class=\"margin-right-2\"></teta-icon>\n \u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0432\u0441\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <div class=\"list-item list-item_interactive\" (click)=\"autosize.emit()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'autoSize'\"\n class=\"margin-right-2\"></teta-icon>\n \u0410\u0432\u0442\u043E\u0440\u0430\u0437\u043C\u0435\u0440 \u043A\u043E\u043B\u043E\u043D\u043A\u0438\n </div>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeAll.emit()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'autoSizeAll'\"\n class=\"margin-right-2\"></teta-icon>\n \u0410\u0432\u0442\u043E\u0440\u0430\u0437\u043C\u0435\u0440 \u0432\u0441\u0435\u0445 \u043A\u043E\u043B\u043E\u043D\u043E\u043A\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'undo'\"\n class=\"margin-right-2\"></teta-icon>\n \u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C \u0432\u0441\u0435 \u0438\u0437\u043C\u0435\u043D\u0435\u043D\u0438\u044F\n </div>\n </div>\n </ng-template>\n </teta-tab>\n <teta-tab>\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'eye'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n <teta-checkbox [binary]=\"true\"\n [allowNull]=\"true\"\n [ngModel]=\"allColumnsVisible()\"\n (ngModelChange)=\"setAllColumns($event)\">\n \u0412\u0441\u0435\n </teta-checkbox>\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"padding-v-2 column column_auto scrollable\">\n <teta-tree [data]=\"columns\"\n [openItems]=\"openItems\"\n (openItemsChange)=\"openItems = $event\"\n [childNodeName]=\"'columns'\"\n [compareItems]=\"compareItems\">\n <ng-template tetaTemplate let-item>\n <div class=\"tree__item\">\n <teta-tree-item-toggle [item]=\"item\" *ngIf=\"item.columns?.length > 0\"></teta-tree-item-toggle>\n <teta-checkbox\n [ngModel]=\"!columnIsHidden(item)\"\n (ngModelChange)=\"setColumnVisibility(item, $event)\"\n (click)=\"$event.stopPropagation()\"\n [binary]=\"true\"\n >\n {{item.caption}}\n </teta-checkbox>\n </div>\n </ng-template>\n </teta-tree>\n </div>\n <teta-toolbar class=\"justify-content-end\">\n <button teta-button\n [disabled]=\"allColumnsVisible() === false\"\n [palette]=\"'primary'\"\n (click)=\"setColumnsVisibility()\">\n \u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C\n </button>\n </teta-toolbar>\n </ng-template>\n </teta-tab>\n</teta-tabs>\n", styles: [":host{display:flex;flex-grow:1;min-height:0;width:250px}\n"], components: [{ type: TabsComponent, selector: "teta-tabs", inputs: ["activeId", "destroyOnHide"], outputs: ["tabChange"] }, { type: TabComponent, selector: "teta-tab", inputs: ["id", "title", "disabled"] }, { type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { type: FilterHostComponent, selector: "teta-filter-host", inputs: ["column", "state", "filterOptions"], outputs: ["filterChanged"] }, { type: ToolbarComponent, selector: "teta-toolbar", inputs: ["palette", "class"] }, { type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square"] }, { type: CheckboxComponent, selector: "teta-checkbox", inputs: ["class", "palette", "noLabel", "disabled", "value", "binary", "allowNull"] }, { type: TreeComponent, selector: "teta-tree", inputs: ["data", "class", "padding", "childNodeName", "openItems", "compareItems"], outputs: ["service", "openItemsChange"] }, { type: TreeItemToggleComponent, selector: "teta-tree-item-toggle", inputs: ["item"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: TabTitleDirective, selector: "[tetaTabTitle]" }, { type: TabContentDirective, selector: "[tetaTabContent]" }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { type: TetaTemplateDirective, selector: "[tetaTemplate]", inputs: ["tetaTemplate"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8260
8266
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellDropdownComponent, decorators: [{
|
|
8261
8267
|
type: Component,
|
|
8262
|
-
args: [{ selector: 'teta-head-cell-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<teta-tabs class=\"column_auto\">\n <teta-tab *ngIf=\"column.filterable\">\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'filter'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <teta-filter-host [column]=\"column\"
|
|
8268
|
+
args: [{ selector: 'teta-head-cell-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, template: "<teta-tabs class=\"column_auto\">\n <teta-tab *ngIf=\"column.filterable\">\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'filter'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <teta-filter-host [column]=\"column\"\n [state]=\"state\"\n *ngIf=\"dict | async as d\"\n [filterOptions]=\"d[column.name]\"></teta-filter-host>\n <teta-toolbar class=\"justify-content-between\">\n <button teta-button [palette]=\"'text'\" [view]=\"'ghost'\" (click)=\"clearFilter()\">\n \u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C\n </button>\n <button teta-button [palette]=\"'primary'\" (click)=\"applyFilter()\">\n <teta-icon [name]=\"'tick'\"></teta-icon>\n \u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C\n </button>\n </teta-toolbar>\n </ng-template>\n </teta-tab>\n <teta-tab *ngIf=\"column.headDropdownTemplate\">\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'measurement'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <ng-container\n *ngTemplateOutlet=\"column.headDropdownTemplate; context: {$implicit: column, column: column}\"></ng-container>\n </ng-template>\n </teta-tab>\n <teta-tab>\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'menu'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <div class=\"list column_auto\">\n <div class=\"list-item list-item_interactive\" (click)=\"pinColumn()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"column.locked ? 'unpin' : 'pin'\"\n class=\"margin-right-2\"></teta-icon>\n {{column.locked ? '\u041E\u0442\u043A\u0440\u0435\u043F\u0438\u0442\u044C' : '\u0417\u0430\u043A\u0440\u0435\u043F\u0438\u0442\u044C'}}\n </div>\n <div class=\"list-divider\"></div>\n <ng-container *ngIf=\"hasSortedColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"sortParam\"\n (click)=\"clearSort()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\" class=\"margin-right-2\"></teta-icon>\n \u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C \u0441\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u043A\u0443\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllSort()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\"\n class=\"margin-right-2\"></teta-icon>\n \u0421\u0431\u0440\u043E\u0441\u0438\u0442\u044C \u0432\u0441\u0435 \u0441\u043E\u0440\u0442\u0438\u0440\u043E\u0432\u043A\u0438\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <ng-container *ngIf=\"hasFilteredColumns()\">\n <div class=\"list-item list-item_interactive\"\n *ngIf=\"filtered\"\n (click)=\"clearFilter()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\"\n class=\"margin-right-2\"></teta-icon>\n \u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0444\u0438\u043B\u044C\u0442\u0440\n </div>\n <div class=\"list-item list-item_interactive\"\n (click)=\"clearAllFilters()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'pin'\"\n class=\"margin-right-2\"></teta-icon>\n \u041E\u0447\u0438\u0441\u0442\u0438\u0442\u044C \u0432\u0441\u0435 \u0444\u0438\u043B\u044C\u0442\u0440\u044B\n </div>\n <div class=\"list-divider\"></div>\n </ng-container>\n <div class=\"list-item list-item_interactive\" (click)=\"autosize.emit()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'autoSize'\"\n class=\"margin-right-2\"></teta-icon>\n \u0410\u0432\u0442\u043E\u0440\u0430\u0437\u043C\u0435\u0440 \u043A\u043E\u043B\u043E\u043D\u043A\u0438\n </div>\n <div class=\"list-item list-item_interactive\" (click)=\"autosizeAll.emit()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'autoSizeAll'\"\n class=\"margin-right-2\"></teta-icon>\n \u0410\u0432\u0442\u043E\u0440\u0430\u0437\u043C\u0435\u0440 \u0432\u0441\u0435\u0445 \u043A\u043E\u043B\u043E\u043D\u043E\u043A\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"list-item list-item_interactive\" (click)=\"restoreDefaultColumns()\">\n <teta-icon [palette]=\"'text'\"\n [name]=\"'undo'\"\n class=\"margin-right-2\"></teta-icon>\n \u041E\u0442\u043C\u0435\u043D\u0438\u0442\u044C \u0432\u0441\u0435 \u0438\u0437\u043C\u0435\u043D\u0435\u043D\u0438\u044F\n </div>\n </div>\n </ng-template>\n </teta-tab>\n <teta-tab>\n <ng-template tetaTabTitle>\n <teta-icon [name]=\"'eye'\"></teta-icon>\n </ng-template>\n <ng-template tetaTabContent>\n <div class=\"list-item padding-left-6 padding-top-2\" [class.padding-left-9]=\"childMode\">\n <teta-checkbox [binary]=\"true\"\n [allowNull]=\"true\"\n [ngModel]=\"allColumnsVisible()\"\n (ngModelChange)=\"setAllColumns($event)\">\n \u0412\u0441\u0435\n </teta-checkbox>\n </div>\n <div class=\"list-divider\"></div>\n <div class=\"padding-v-2 column column_auto scrollable\">\n <teta-tree [data]=\"columns\"\n [openItems]=\"openItems\"\n (openItemsChange)=\"openItems = $event\"\n [childNodeName]=\"'columns'\"\n [compareItems]=\"compareItems\">\n <ng-template tetaTemplate let-item>\n <div class=\"tree__item\">\n <teta-tree-item-toggle [item]=\"item\" *ngIf=\"item.columns?.length > 0\"></teta-tree-item-toggle>\n <teta-checkbox\n [ngModel]=\"!columnIsHidden(item)\"\n (ngModelChange)=\"setColumnVisibility(item, $event)\"\n (click)=\"$event.stopPropagation()\"\n [binary]=\"true\"\n >\n {{item.caption}}\n </teta-checkbox>\n </div>\n </ng-template>\n </teta-tree>\n </div>\n <teta-toolbar class=\"justify-content-end\">\n <button teta-button\n [disabled]=\"allColumnsVisible() === false\"\n [palette]=\"'primary'\"\n (click)=\"setColumnsVisibility()\">\n \u041F\u0440\u0438\u043C\u0435\u043D\u0438\u0442\u044C\n </button>\n </teta-toolbar>\n </ng-template>\n </teta-tab>\n</teta-tabs>\n", styles: [":host{display:flex;flex-grow:1;min-height:0;width:250px}\n"] }]
|
|
8263
8269
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { columns: [{
|
|
8264
8270
|
type: Input
|
|
8265
8271
|
}], column: [{
|
|
@@ -8280,6 +8286,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImpor
|
|
|
8280
8286
|
}], bg: [{
|
|
8281
8287
|
type: HostBinding,
|
|
8282
8288
|
args: ['class.bg-background-50']
|
|
8289
|
+
}], enter: [{
|
|
8290
|
+
type: HostListener,
|
|
8291
|
+
args: ['keydown.enter']
|
|
8283
8292
|
}] } });
|
|
8284
8293
|
|
|
8285
8294
|
class ResizeDragDirective {
|
|
@@ -8441,10 +8450,10 @@ class HeadCellComponent {
|
|
|
8441
8450
|
}
|
|
8442
8451
|
}
|
|
8443
8452
|
HeadCellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellComponent, deps: [{ token: TableService }, { token: i0.ApplicationRef }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
8444
|
-
HeadCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: HeadCellComponent, selector: "teta-head-cell", inputs: { column: "column", showHeadCellMenu: "showHeadCellMenu" }, host: { listeners: { "dragstart": "dragstart($event)", "dragenter": "dragenter($event)", "dragover": "allowDrop($event)", "dragleave": "dragleave($event)", "dragend": "dragend($event)", "drop": "drop($event)" } }, ngImport: i0, template: "<div draggable=\"true\" class=\"row row_auto\">\n <div class=\"table-head__cell__wrapper\"\n [ngClass]=\"column.headCellClass\"\n (click)=\"sortColumn(column, $event)\">\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n <teta-head-cell-host [column]=\"column\"></teta-head-cell-host>\n <teta-dropdown *ngIf=\"showHeadCellMenu\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.right\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"table-head__cell__menu\">\n <button tetaDropdownHead teta-button\n [square]=\"true\"\n [palette]=\"'text'\"\n [view]=\"'ghost'\">\n <teta-icon [palette]=\"'text'\" [name]=\"'menu'\"></teta-icon>\n </button>\n <teta-head-cell-dropdown tetaDropdownContent\n (autosize)=\"autosizeColumn()\"\n (autosizeAll)=\"autosizeAllColumns()\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n </div>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\"></div>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"], components: [{ type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { type: HeadCellHostComponent, selector: "teta-head-cell-host", inputs: ["column"] }, { type: DropdownComponent, selector: "teta-dropdown" }, { type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square"] }, { type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: ["columns", "column", "state", "dropDownOpen"], outputs: ["dropDownOpenChange", "autosize", "autosizeAll"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { type: ResizeDragDirective, selector: "[tetaResizeDrag]", inputs: ["tetaResizeDrag"], outputs: ["resizeStart", "resizeProcess", "resizeEnd"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8453
|
+
HeadCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: HeadCellComponent, selector: "teta-head-cell", inputs: { column: "column", showHeadCellMenu: "showHeadCellMenu" }, host: { listeners: { "dragstart": "dragstart($event)", "dragenter": "dragenter($event)", "dragover": "allowDrop($event)", "dragleave": "dragleave($event)", "dragend": "dragend($event)", "drop": "drop($event)" } }, ngImport: i0, template: "<div draggable=\"true\" class=\"row row_auto\">\n <div class=\"table-head__cell__wrapper\"\n [ngClass]=\"column.headCellClass\"\n (click)=\"sortColumn(column, $event)\">\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n <teta-head-cell-host [column]=\"column\"></teta-head-cell-host>\n <teta-dropdown *ngIf=\"showHeadCellMenu\"\n [autoCloseIgnore]=\"['enter']\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.right\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"table-head__cell__menu\">\n <button tetaDropdownHead teta-button\n [square]=\"true\"\n [palette]=\"'text'\"\n [view]=\"'ghost'\">\n <teta-icon [palette]=\"'text'\" [name]=\"'menu'\"></teta-icon>\n </button>\n <teta-head-cell-dropdown tetaDropdownContent\n (autosize)=\"autosizeColumn()\"\n (autosizeAll)=\"autosizeAllColumns()\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n </div>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\"></div>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"], components: [{ type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }, { type: HeadCellHostComponent, selector: "teta-head-cell-host", inputs: ["column"] }, { type: DropdownComponent, selector: "teta-dropdown" }, { type: ButtonComponent, selector: "button[teta-button], teta-button", inputs: ["palette", "class", "view", "square"] }, { type: HeadCellDropdownComponent, selector: "teta-head-cell-dropdown", inputs: ["columns", "column", "state", "dropDownOpen"], outputs: ["dropDownOpenChange", "autosize", "autosizeAll"] }], directives: [{ type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: DropdownHeadDirective, selector: "[tetaDropdownHead]" }, { type: DropdownContentDirective, selector: "[tetaDropdownContent]" }, { type: ResizeDragDirective, selector: "[tetaResizeDrag]", inputs: ["tetaResizeDrag"], outputs: ["resizeStart", "resizeProcess", "resizeEnd"] }], pipes: { "async": i2.AsyncPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8445
8454
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellComponent, decorators: [{
|
|
8446
8455
|
type: Component,
|
|
8447
|
-
args: [{ selector: 'teta-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div draggable=\"true\" class=\"row row_auto\">\n <div class=\"table-head__cell__wrapper\"\n [ngClass]=\"column.headCellClass\"\n (click)=\"sortColumn(column, $event)\">\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n <teta-head-cell-host [column]=\"column\"></teta-head-cell-host>\n <teta-dropdown *ngIf=\"showHeadCellMenu\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.right\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"table-head__cell__menu\">\n <button tetaDropdownHead teta-button\n [square]=\"true\"\n [palette]=\"'text'\"\n [view]=\"'ghost'\">\n <teta-icon [palette]=\"'text'\" [name]=\"'menu'\"></teta-icon>\n </button>\n <teta-head-cell-dropdown tetaDropdownContent\n (autosize)=\"autosizeColumn()\"\n (autosizeAll)=\"autosizeAllColumns()\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n </div>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\"></div>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"] }]
|
|
8456
|
+
args: [{ selector: 'teta-head-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div draggable=\"true\" class=\"row row_auto\">\n <div class=\"table-head__cell__wrapper\"\n [ngClass]=\"column.headCellClass\"\n (click)=\"sortColumn(column, $event)\">\n <teta-icon *ngIf=\"iconName | async as icon\"\n [palette]=\"'text'\"\n [name]=\"icon\"></teta-icon>\n <teta-head-cell-host [column]=\"column\"></teta-head-cell-host>\n <teta-dropdown *ngIf=\"showHeadCellMenu\"\n [autoCloseIgnore]=\"['enter']\"\n [verticalAlign]=\"verticalAlign.bottom\"\n [appendToBody]=\"true\"\n [(open)]=\"dropDownOpen\"\n [align]=\"align.right\"\n (click)=\"$event.preventDefault()\"\n [class.table-head__cell__menu_open]=\"dropDownOpen\"\n class=\"table-head__cell__menu\">\n <button tetaDropdownHead teta-button\n [square]=\"true\"\n [palette]=\"'text'\"\n [view]=\"'ghost'\">\n <teta-icon [palette]=\"'text'\" [name]=\"'menu'\"></teta-icon>\n </button>\n <teta-head-cell-dropdown tetaDropdownContent\n (autosize)=\"autosizeColumn()\"\n (autosizeAll)=\"autosizeAllColumns()\"\n [column]=\"column\"\n [columns]=\"columns | async\"\n [state]=\"state | async\"\n [(dropDownOpen)]=\"dropDownOpen\"></teta-head-cell-dropdown>\n </teta-dropdown>\n </div>\n <div class=\"drop-area\"\n draggable=\"false\"\n [class.drop-area_left]=\"showDrag === 'left'\"\n [class.drop-area_right]=\"showDrag === 'right'\"\n *ngIf=\"showDrag\"></div>\n</div>\n<div class=\"table-head__cell__resize\"\n draggable=\"false\"\n (dragstart)=\"$event.preventDefault();$event.stopPropagation()\"\n (drag)=\"$event.preventDefault();$event.stopPropagation()\"\n [tetaResizeDrag]=\"'vertical'\"\n (resizeStart)=\"resizeStart($event)\"\n (resizeProcess)=\"resizeProcess($event)\"\n (resizeEnd)=\"resizeEnd()\"></div>\n", styles: [".drop-area{position:absolute;width:1px;background:var(--color-text-50);top:0;bottom:0;z-index:10}.drop-area_left{left:-1px}.drop-area_right{right:-1px}\n"] }]
|
|
8448
8457
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ApplicationRef }, { type: i0.ElementRef }]; }, propDecorators: { column: [{
|
|
8449
8458
|
type: Input
|
|
8450
8459
|
}], showHeadCellMenu: [{
|
|
@@ -8851,7 +8860,18 @@ class ListCellComponent extends CellComponentBase {
|
|
|
8851
8860
|
get value() {
|
|
8852
8861
|
return this.getValue();
|
|
8853
8862
|
}
|
|
8863
|
+
get displayFilterOptions() {
|
|
8864
|
+
var _a, _b;
|
|
8865
|
+
if (((_b = (_a = this.column) === null || _a === void 0 ? void 0 : _a.parentName) === null || _b === void 0 ? void 0 : _b.length) > 0) {
|
|
8866
|
+
const parentValue = this.row.data[this.column.parentName];
|
|
8867
|
+
if (parentValue) {
|
|
8868
|
+
return this.filterOptions.filter(_ => _.parentId === parentValue);
|
|
8869
|
+
}
|
|
8870
|
+
}
|
|
8871
|
+
return this.filterOptions;
|
|
8872
|
+
}
|
|
8854
8873
|
setValue(value) {
|
|
8874
|
+
// if(this.c)
|
|
8855
8875
|
this.row.data[this.column.name] = value;
|
|
8856
8876
|
this.valueChanged();
|
|
8857
8877
|
}
|
|
@@ -8884,10 +8904,10 @@ class ListCellComponent extends CellComponentBase {
|
|
|
8884
8904
|
}
|
|
8885
8905
|
}
|
|
8886
8906
|
ListCellComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: ListCellComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
8887
|
-
ListCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: ListCellComponent, selector: "teta-list-cell", inputs: { column: "column", row: "row", filterOptions: "filterOptions" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n {{value}}\n</span>\n<teta-select #input\n class=\"row_auto select-table\"\n *ngIf=\"edit\"\n [allowNull]=\"!column.required\"\n [verticalAlign]=\"verticalAlign.auto\"\n [appendToBody]=\"true\"\n [options]=\"
|
|
8907
|
+
ListCellComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: ListCellComponent, selector: "teta-list-cell", inputs: { column: "column", row: "row", filterOptions: "filterOptions" }, viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n {{value}}\n</span>\n<teta-select #input\n class=\"row_auto select-table\"\n *ngIf=\"edit\"\n [allowNull]=\"!column.required\"\n [verticalAlign]=\"verticalAlign.auto\"\n [appendToBody]=\"true\"\n [options]=\"displayFilterOptions\"\n [valueRef]=\"'id'\"\n [textRef]=\"'name'\"\n [ngModel]=\"row.data[column.name]\"\n (ngModelChange)=\"setValue($event)\">\n</teta-select>\n", styles: [""], components: [{ type: SelectComponent, selector: "teta-select", inputs: ["multiple", "options", "invalid", "align", "verticalAlign", "autoClose", "autoCloseIgnore", "disabled", "itemSize", "virtual", "icon", "placeholder", "appendToBody", "allowNull", "valueRef", "textRef", "searchRef"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i3.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { type: i3.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
8888
8908
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: ListCellComponent, decorators: [{
|
|
8889
8909
|
type: Component,
|
|
8890
|
-
args: [{ selector: 'teta-list-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n {{value}}\n</span>\n<teta-select #input\n class=\"row_auto select-table\"\n *ngIf=\"edit\"\n [allowNull]=\"!column.required\"\n [verticalAlign]=\"verticalAlign.auto\"\n [appendToBody]=\"true\"\n [options]=\"
|
|
8910
|
+
args: [{ selector: 'teta-list-cell', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span [style.display]=\"edit ? 'none' : 'block'\" class=\"cell-text\">\n {{value}}\n</span>\n<teta-select #input\n class=\"row_auto select-table\"\n *ngIf=\"edit\"\n [allowNull]=\"!column.required\"\n [verticalAlign]=\"verticalAlign.auto\"\n [appendToBody]=\"true\"\n [options]=\"displayFilterOptions\"\n [valueRef]=\"'id'\"\n [textRef]=\"'name'\"\n [ngModel]=\"row.data[column.name]\"\n (ngModelChange)=\"setValue($event)\">\n</teta-select>\n", styles: [""] }]
|
|
8891
8911
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { column: [{
|
|
8892
8912
|
type: Input
|
|
8893
8913
|
}], row: [{
|
|
@@ -9230,10 +9250,10 @@ class TableBodyComponent {
|
|
|
9230
9250
|
}
|
|
9231
9251
|
}
|
|
9232
9252
|
TableBodyComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: TableBodyComponent, deps: [{ token: TableService }, { token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
9233
|
-
TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: TableBodyComponent, selector: "teta-table-body", inputs: { virtual: "virtual", activeRow: "activeRow", rowHeight: "rowHeight", additionalComponent: "additionalComponent", tree: "tree", aggregate: "aggregate", grouping: "grouping", groupRowComponent: "groupRowComponent", openLevels: "openLevels", selectType: "selectType", rowClass: "rowClass" }, host: { properties: { "class.table-body": "this.tableBodyClass" } }, viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], ngImport: i0, template: "
|
|
9253
|
+
TableBodyComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "12.0.0", version: "13.0.1", type: TableBodyComponent, selector: "teta-table-body", inputs: { virtual: "virtual", activeRow: "activeRow", rowHeight: "rowHeight", additionalComponent: "additionalComponent", tree: "tree", aggregate: "aggregate", grouping: "grouping", groupRowComponent: "groupRowComponent", openLevels: "openLevels", selectType: "selectType", rowClass: "rowClass" }, host: { properties: { "class.table-body": "this.tableBodyClass" } }, viewQueries: [{ propertyName: "viewport", first: true, predicate: CdkVirtualScrollViewport, descendants: true }], ngImport: i0, template: "<cdk-virtual-scroll-viewport *ngIf=\"virtual\"\n class=\"table-body-container\"\n [itemSize]=\"24\">\n <ng-container *cdkVirtualFor=\"let row of data;templateCacheSize: 0; let rowIndex = index; trackBy: trackRow;\">\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n </ng-container>\n</cdk-virtual-scroll-viewport>\n<div *ngIf=\"!virtual\"\n class=\"table-body-container\"\n [style.grid-template-rows]=\"rowHeight + 'px'\"\n [style.grid-auto-rows]=\"rowHeight + 'px'\"\n [style.grid-template-columns]=\"getTemplateColumns()\">\n <ng-container *ngFor=\"let row of data; let rowIndex = index; trackBy: trackRow;\">\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"aggregate\">\n <ng-container *ngTemplateOutlet=\"aggTemplate;\"></ng-container>\n </ng-container>\n</div>\n\n<ng-template #bodyTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n <div class=\"table-row\"\n (click)=\"setActiveRow(row)\"\n [attr.data-row]=\"rowIndex\"\n [ngClass]=\"rowClass ? rowClass(row, rowIndex) : ''\"\n [class.table-row_virtual]=\"virtual\"\n [style.grid-template-columns]=\"virtual ? getTemplateColumns() : ''\"\n [class.table-row_active]=\"row === activeRow || selectedRows.indexOf(row) >= 0\">\n <ng-container *ngIf=\"!grouping\">\n <div class=\"table-row_locked\"\n *ngIf=\"locked.length > 0\"\n [style.grid-template-columns]=\"getLockedGridTemplateColumns(locked)\"\n [style.zIndex]=\"row === activeRow ? 1 : 'unset'\"\n [style.grid-column-end]=\"getSpan()\">\n <teta-selection-cell *ngIf=\"selectType !== selectTypeEnum.none && locked.length\"\n [row]=\"row\"></teta-selection-cell>\n <teta-cell\n *ngFor=\"let column of locked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-row]=\"rowIndex\"\n [attr.data-column]=\"column.name\"\n [column]=\"column\"\n [filterOptions]=\"dict[column.name]\"\n [dict]=\"dict\"\n [row]=\"row\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\"\n ></teta-cell>\n </div>\n <teta-selection-cell *ngIf=\"selectType !== selectTypeEnum.none && locked.length < 1\"\n [row]=\"row\"></teta-selection-cell>\n <teta-cell\n *ngFor=\"let column of unlocked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-row]=\"rowIndex\"\n [attr.data-column]=\"column.name\"\n [column]=\"column\"\n [filterOptions]=\"dict[column.name]\"\n [dict]=\"dict\"\n [row]=\"row\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\"\n ></teta-cell>\n </ng-container>\n <ng-container *ngIf=\"grouping\">\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #aggTemplate>\n <div class=\"table-row\"\n *ngIf=\"aggregate\"\n [class.table-row_virtual]=\"virtual\"\n [style.grid-template-columns]=\"virtual ? getTemplateColumns() : ''\">\n <div class=\"table-row_locked\"\n *ngIf=\"locked.length > 0\"\n [style.grid-template-columns]=\"getLockedGridTemplateColumns(locked)\"\n [style.grid-column-end]=\"getSpan()\">\n <div class=\"cell align-center justify-content-center\">\n <teta-icon [name]=\"'sumColor'\"></teta-icon>\n </div>\n <div class=\"cell cell-component justify-content-end\"\n *ngFor=\"let column of locked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-column]=\"column.name\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\">\n <span class=\"cell-text cell-text_numeric font-title-3\">\n {{getAggregateText(column)}}:\n {{getAggregateValue(column) | tetaNumber : 2}}\n </span>\n </div>\n </div>\n <div class=\"cell align-center justify-content-center\"\n *ngIf=\"selectType !== selectTypeEnum.none && locked.length < 1\">\n <teta-icon [name]=\"'sumColor'\"></teta-icon>\n </div>\n <div class=\"cell cell-component justify-content-end\"\n *ngFor=\"let column of unlocked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-column]=\"column.name\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\">\n <span class=\"cell-text cell-text_numeric font-title-3\">\n {{getAggregateText(column)}}\n {{getAggregateValue(column) | tetaNumber : 2}}\n </span>\n </div>\n </div>\n</ng-template>\n", styles: [""], components: [{ type: i4.CdkVirtualScrollViewport, selector: "cdk-virtual-scroll-viewport", inputs: ["orientation", "appendOnly"], outputs: ["scrolledIndexChange"] }, { type: SelectionCellComponent, selector: "teta-selection-cell", inputs: ["row"] }, { type: CellComponent, selector: "teta-cell", inputs: ["column", "filterOptions", "dict", "row"] }, { type: IconComponent, selector: "teta-icon", inputs: ["name", "size", "palette", "class"] }], directives: [{ type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { type: i4.CdkFixedSizeVirtualScroll, selector: "cdk-virtual-scroll-viewport[itemSize]", inputs: ["itemSize", "minBufferPx", "maxBufferPx"] }, { type: i4.CdkVirtualForOf, selector: "[cdkVirtualFor][cdkVirtualForOf]", inputs: ["cdkVirtualForOf", "cdkVirtualForTrackBy", "cdkVirtualForTemplate", "cdkVirtualForTemplateCacheSize"] }, { type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet"] }, { type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }], pipes: { "tetaNumber": NumberPipe }, changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
9234
9254
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: TableBodyComponent, decorators: [{
|
|
9235
9255
|
type: Component,
|
|
9236
|
-
args: [{ selector: 'teta-table-body', changeDetection: ChangeDetectionStrategy.OnPush, template: "
|
|
9256
|
+
args: [{ selector: 'teta-table-body', changeDetection: ChangeDetectionStrategy.OnPush, template: "<cdk-virtual-scroll-viewport *ngIf=\"virtual\"\n class=\"table-body-container\"\n [itemSize]=\"24\">\n <ng-container *cdkVirtualFor=\"let row of data;templateCacheSize: 0; let rowIndex = index; trackBy: trackRow;\">\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n </ng-container>\n</cdk-virtual-scroll-viewport>\n<div *ngIf=\"!virtual\"\n class=\"table-body-container\"\n [style.grid-template-rows]=\"rowHeight + 'px'\"\n [style.grid-auto-rows]=\"rowHeight + 'px'\"\n [style.grid-template-columns]=\"getTemplateColumns()\">\n <ng-container *ngFor=\"let row of data; let rowIndex = index; trackBy: trackRow;\">\n <ng-container *ngTemplateOutlet=\"bodyTemplate; context: {row: row, rowIndex: rowIndex}\"></ng-container>\n </ng-container>\n <ng-container *ngIf=\"aggregate\">\n <ng-container *ngTemplateOutlet=\"aggTemplate;\"></ng-container>\n </ng-container>\n</div>\n\n<ng-template #bodyTemplate let-row=\"row\" let-rowIndex=\"rowIndex\">\n <div class=\"table-row\"\n (click)=\"setActiveRow(row)\"\n [attr.data-row]=\"rowIndex\"\n [ngClass]=\"rowClass ? rowClass(row, rowIndex) : ''\"\n [class.table-row_virtual]=\"virtual\"\n [style.grid-template-columns]=\"virtual ? getTemplateColumns() : ''\"\n [class.table-row_active]=\"row === activeRow || selectedRows.indexOf(row) >= 0\">\n <ng-container *ngIf=\"!grouping\">\n <div class=\"table-row_locked\"\n *ngIf=\"locked.length > 0\"\n [style.grid-template-columns]=\"getLockedGridTemplateColumns(locked)\"\n [style.zIndex]=\"row === activeRow ? 1 : 'unset'\"\n [style.grid-column-end]=\"getSpan()\">\n <teta-selection-cell *ngIf=\"selectType !== selectTypeEnum.none && locked.length\"\n [row]=\"row\"></teta-selection-cell>\n <teta-cell\n *ngFor=\"let column of locked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-row]=\"rowIndex\"\n [attr.data-column]=\"column.name\"\n [column]=\"column\"\n [filterOptions]=\"dict[column.name]\"\n [dict]=\"dict\"\n [row]=\"row\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\"\n ></teta-cell>\n </div>\n <teta-selection-cell *ngIf=\"selectType !== selectTypeEnum.none && locked.length < 1\"\n [row]=\"row\"></teta-selection-cell>\n <teta-cell\n *ngFor=\"let column of unlocked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-row]=\"rowIndex\"\n [attr.data-column]=\"column.name\"\n [column]=\"column\"\n [filterOptions]=\"dict[column.name]\"\n [dict]=\"dict\"\n [row]=\"row\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\"\n ></teta-cell>\n </ng-container>\n <ng-container *ngIf=\"grouping\">\n </ng-container>\n </div>\n</ng-template>\n\n<ng-template #aggTemplate>\n <div class=\"table-row\"\n *ngIf=\"aggregate\"\n [class.table-row_virtual]=\"virtual\"\n [style.grid-template-columns]=\"virtual ? getTemplateColumns() : ''\">\n <div class=\"table-row_locked\"\n *ngIf=\"locked.length > 0\"\n [style.grid-template-columns]=\"getLockedGridTemplateColumns(locked)\"\n [style.grid-column-end]=\"getSpan()\">\n <div class=\"cell align-center justify-content-center\">\n <teta-icon [name]=\"'sumColor'\"></teta-icon>\n </div>\n <div class=\"cell cell-component justify-content-end\"\n *ngFor=\"let column of locked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-column]=\"column.name\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\">\n <span class=\"cell-text cell-text_numeric font-title-3\">\n {{getAggregateText(column)}}:\n {{getAggregateValue(column) | tetaNumber : 2}}\n </span>\n </div>\n </div>\n <div class=\"cell align-center justify-content-center\"\n *ngIf=\"selectType !== selectTypeEnum.none && locked.length < 1\">\n <teta-icon [name]=\"'sumColor'\"></teta-icon>\n </div>\n <div class=\"cell cell-component justify-content-end\"\n *ngFor=\"let column of unlocked; let colIndex = index; trackBy: trackColumns;\"\n [attr.data-column]=\"column.name\"\n [ngClass]=\"column.cellClass\"\n [attr.tabindex]=\"0\">\n <span class=\"cell-text cell-text_numeric font-title-3\">\n {{getAggregateText(column)}}\n {{getAggregateValue(column) | tetaNumber : 2}}\n </span>\n </div>\n </div>\n</ng-template>\n", styles: [""] }]
|
|
9237
9257
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { virtual: [{
|
|
9238
9258
|
type: Input
|
|
9239
9259
|
}], activeRow: [{
|
|
@@ -10623,6 +10643,7 @@ class LoaderDirective {
|
|
|
10623
10643
|
this._renderer = _renderer;
|
|
10624
10644
|
this._document = _document;
|
|
10625
10645
|
this.appendToBody = false;
|
|
10646
|
+
this.mask = false;
|
|
10626
10647
|
this._alive = true;
|
|
10627
10648
|
this._element = this._elementRef.nativeElement;
|
|
10628
10649
|
}
|
|
@@ -10647,6 +10668,13 @@ class LoaderDirective {
|
|
|
10647
10668
|
this._loader = this._renderer.createElement('div');
|
|
10648
10669
|
this._loader.setAttribute('class', 'loader');
|
|
10649
10670
|
}
|
|
10671
|
+
if ((this._mask === null || this._mask === undefined) && this.mask) {
|
|
10672
|
+
this._mask = this._renderer.createElement('div');
|
|
10673
|
+
this._mask.setAttribute('class', 'loader-mask');
|
|
10674
|
+
}
|
|
10675
|
+
if (this.mask) {
|
|
10676
|
+
this._renderer.appendChild(this.appendToBody ? this._document.body : this._element, this._mask);
|
|
10677
|
+
}
|
|
10650
10678
|
this._renderer.appendChild(this.appendToBody ? this._document.body : this._element, this._loader);
|
|
10651
10679
|
this.setPosition();
|
|
10652
10680
|
}
|
|
@@ -10654,6 +10682,9 @@ class LoaderDirective {
|
|
|
10654
10682
|
if (this._loader && this._loader.parentElement) {
|
|
10655
10683
|
this._renderer.removeChild(this._loader.parentElement, this._loader);
|
|
10656
10684
|
}
|
|
10685
|
+
if (this._mask && this._mask.parentElement) {
|
|
10686
|
+
this._renderer.removeChild(this._loader.parentElement, this._mask);
|
|
10687
|
+
}
|
|
10657
10688
|
}
|
|
10658
10689
|
setPosition() {
|
|
10659
10690
|
const position = this._element.getBoundingClientRect();
|
|
@@ -10662,7 +10693,7 @@ class LoaderDirective {
|
|
|
10662
10693
|
}
|
|
10663
10694
|
}
|
|
10664
10695
|
LoaderDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: LoaderDirective, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive });
|
|
10665
|
-
LoaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.1", type: LoaderDirective, selector: "[tetaLoader]", inputs: { appendToBody: "appendToBody", tetaLoader: "tetaLoader" }, ngImport: i0 });
|
|
10696
|
+
LoaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.1", type: LoaderDirective, selector: "[tetaLoader]", inputs: { appendToBody: "appendToBody", mask: "mask", tetaLoader: "tetaLoader" }, ngImport: i0 });
|
|
10666
10697
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: LoaderDirective, decorators: [{
|
|
10667
10698
|
type: Directive,
|
|
10668
10699
|
args: [{
|
|
@@ -10675,6 +10706,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImpor
|
|
|
10675
10706
|
}] }];
|
|
10676
10707
|
}, propDecorators: { appendToBody: [{
|
|
10677
10708
|
type: Input
|
|
10709
|
+
}], mask: [{
|
|
10710
|
+
type: Input
|
|
10678
10711
|
}], tetaLoader: [{
|
|
10679
10712
|
type: Input
|
|
10680
10713
|
}] } });
|