@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
|
@@ -2100,7 +2100,7 @@ class DatePickerComponent {
|
|
|
2100
2100
|
applyValue(date) {
|
|
2101
2101
|
this.setDate(date);
|
|
2102
2102
|
this.value = this.currentValue;
|
|
2103
|
-
this.onChange(this.value);
|
|
2103
|
+
this.onChange(new Date(this.value));
|
|
2104
2104
|
this.open = false;
|
|
2105
2105
|
}
|
|
2106
2106
|
focus() {
|
|
@@ -3514,7 +3514,8 @@ class StringFilterComponent extends FilterComponentBase {
|
|
|
3514
3514
|
get state() {
|
|
3515
3515
|
return this.state$;
|
|
3516
3516
|
}
|
|
3517
|
-
ngOnInit() {
|
|
3517
|
+
ngOnInit() {
|
|
3518
|
+
}
|
|
3518
3519
|
setFilter() {
|
|
3519
3520
|
this.filterChanged.emit(this.filter);
|
|
3520
3521
|
}
|
|
@@ -3533,10 +3534,10 @@ class StringFilterComponent extends FilterComponentBase {
|
|
|
3533
3534
|
}
|
|
3534
3535
|
}
|
|
3535
3536
|
StringFilterComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: StringFilterComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
3536
|
-
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 });
|
|
3537
|
+
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 });
|
|
3537
3538
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: StringFilterComponent, decorators: [{
|
|
3538
3539
|
type: Component,
|
|
3539
|
-
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: [""] }]
|
|
3540
|
+
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: [""] }]
|
|
3540
3541
|
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { column: [{
|
|
3541
3542
|
type: Input
|
|
3542
3543
|
}], filterOptions: [{
|
|
@@ -7245,6 +7246,7 @@ class TableService {
|
|
|
7245
7246
|
startEditRow(cellCoordinates) {
|
|
7246
7247
|
if (this._currentEditRow?.row !== cellCoordinates?.row) {
|
|
7247
7248
|
if (this._currentEditRow != null) {
|
|
7249
|
+
const row = this._displayData.value.indexOf(this._currentEditRow.row);
|
|
7248
7250
|
this._editRowStop.next(this._currentEditRow);
|
|
7249
7251
|
}
|
|
7250
7252
|
if (cellCoordinates === null) {
|
|
@@ -8085,6 +8087,9 @@ class HeadCellDropdownComponent {
|
|
|
8085
8087
|
this.hiddenColumns = _;
|
|
8086
8088
|
});
|
|
8087
8089
|
}
|
|
8090
|
+
enter() {
|
|
8091
|
+
this.applyFilter();
|
|
8092
|
+
}
|
|
8088
8093
|
get sortParam() {
|
|
8089
8094
|
return StateUtil.getSortState(this.state, this.column);
|
|
8090
8095
|
}
|
|
@@ -8161,7 +8166,8 @@ class HeadCellDropdownComponent {
|
|
|
8161
8166
|
setColumnsVisibility() {
|
|
8162
8167
|
this._svc.setHiddenColumns(this.hiddenColumns);
|
|
8163
8168
|
}
|
|
8164
|
-
ngOnInit() {
|
|
8169
|
+
ngOnInit() {
|
|
8170
|
+
}
|
|
8165
8171
|
ngOnDestroy() {
|
|
8166
8172
|
this._alive = false;
|
|
8167
8173
|
}
|
|
@@ -8197,10 +8203,10 @@ class HeadCellDropdownComponent {
|
|
|
8197
8203
|
}
|
|
8198
8204
|
}
|
|
8199
8205
|
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 });
|
|
8200
|
-
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\"
|
|
8206
|
+
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 });
|
|
8201
8207
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellDropdownComponent, decorators: [{
|
|
8202
8208
|
type: Component,
|
|
8203
|
-
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\"
|
|
8209
|
+
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"] }]
|
|
8204
8210
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { columns: [{
|
|
8205
8211
|
type: Input
|
|
8206
8212
|
}], column: [{
|
|
@@ -8221,6 +8227,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImpor
|
|
|
8221
8227
|
}], bg: [{
|
|
8222
8228
|
type: HostBinding,
|
|
8223
8229
|
args: ['class.bg-background-50']
|
|
8230
|
+
}], enter: [{
|
|
8231
|
+
type: HostListener,
|
|
8232
|
+
args: ['keydown.enter']
|
|
8224
8233
|
}] } });
|
|
8225
8234
|
|
|
8226
8235
|
class ResizeDragDirective {
|
|
@@ -8380,10 +8389,10 @@ class HeadCellComponent {
|
|
|
8380
8389
|
}
|
|
8381
8390
|
}
|
|
8382
8391
|
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 });
|
|
8383
|
-
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 });
|
|
8392
|
+
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 });
|
|
8384
8393
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: HeadCellComponent, decorators: [{
|
|
8385
8394
|
type: Component,
|
|
8386
|
-
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"] }]
|
|
8395
|
+
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"] }]
|
|
8387
8396
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ApplicationRef }, { type: i0.ElementRef }]; }, propDecorators: { column: [{
|
|
8388
8397
|
type: Input
|
|
8389
8398
|
}], showHeadCellMenu: [{
|
|
@@ -8785,7 +8794,17 @@ class ListCellComponent extends CellComponentBase {
|
|
|
8785
8794
|
get value() {
|
|
8786
8795
|
return this.getValue();
|
|
8787
8796
|
}
|
|
8797
|
+
get displayFilterOptions() {
|
|
8798
|
+
if (this.column?.parentName?.length > 0) {
|
|
8799
|
+
const parentValue = this.row.data[this.column.parentName];
|
|
8800
|
+
if (parentValue) {
|
|
8801
|
+
return this.filterOptions.filter(_ => _.parentId === parentValue);
|
|
8802
|
+
}
|
|
8803
|
+
}
|
|
8804
|
+
return this.filterOptions;
|
|
8805
|
+
}
|
|
8788
8806
|
setValue(value) {
|
|
8807
|
+
// if(this.c)
|
|
8789
8808
|
this.row.data[this.column.name] = value;
|
|
8790
8809
|
this.valueChanged();
|
|
8791
8810
|
}
|
|
@@ -8817,10 +8836,10 @@ class ListCellComponent extends CellComponentBase {
|
|
|
8817
8836
|
}
|
|
8818
8837
|
}
|
|
8819
8838
|
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 });
|
|
8820
|
-
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]=\"
|
|
8839
|
+
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 });
|
|
8821
8840
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: ListCellComponent, decorators: [{
|
|
8822
8841
|
type: Component,
|
|
8823
|
-
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]=\"
|
|
8842
|
+
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: [""] }]
|
|
8824
8843
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { column: [{
|
|
8825
8844
|
type: Input
|
|
8826
8845
|
}], row: [{
|
|
@@ -9155,10 +9174,10 @@ class TableBodyComponent {
|
|
|
9155
9174
|
}
|
|
9156
9175
|
}
|
|
9157
9176
|
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 });
|
|
9158
|
-
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: "
|
|
9177
|
+
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 });
|
|
9159
9178
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: TableBodyComponent, decorators: [{
|
|
9160
9179
|
type: Component,
|
|
9161
|
-
args: [{ selector: 'teta-table-body', changeDetection: ChangeDetectionStrategy.OnPush, template: "
|
|
9180
|
+
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: [""] }]
|
|
9162
9181
|
}], ctorParameters: function () { return [{ type: TableService }, { type: i0.ChangeDetectorRef }]; }, propDecorators: { virtual: [{
|
|
9163
9182
|
type: Input
|
|
9164
9183
|
}], activeRow: [{
|
|
@@ -10533,6 +10552,7 @@ class LoaderDirective {
|
|
|
10533
10552
|
this._renderer = _renderer;
|
|
10534
10553
|
this._document = _document;
|
|
10535
10554
|
this.appendToBody = false;
|
|
10555
|
+
this.mask = false;
|
|
10536
10556
|
this._alive = true;
|
|
10537
10557
|
this._element = this._elementRef.nativeElement;
|
|
10538
10558
|
}
|
|
@@ -10557,6 +10577,13 @@ class LoaderDirective {
|
|
|
10557
10577
|
this._loader = this._renderer.createElement('div');
|
|
10558
10578
|
this._loader.setAttribute('class', 'loader');
|
|
10559
10579
|
}
|
|
10580
|
+
if ((this._mask === null || this._mask === undefined) && this.mask) {
|
|
10581
|
+
this._mask = this._renderer.createElement('div');
|
|
10582
|
+
this._mask.setAttribute('class', 'loader-mask');
|
|
10583
|
+
}
|
|
10584
|
+
if (this.mask) {
|
|
10585
|
+
this._renderer.appendChild(this.appendToBody ? this._document.body : this._element, this._mask);
|
|
10586
|
+
}
|
|
10560
10587
|
this._renderer.appendChild(this.appendToBody ? this._document.body : this._element, this._loader);
|
|
10561
10588
|
this.setPosition();
|
|
10562
10589
|
}
|
|
@@ -10564,6 +10591,9 @@ class LoaderDirective {
|
|
|
10564
10591
|
if (this._loader && this._loader.parentElement) {
|
|
10565
10592
|
this._renderer.removeChild(this._loader.parentElement, this._loader);
|
|
10566
10593
|
}
|
|
10594
|
+
if (this._mask && this._mask.parentElement) {
|
|
10595
|
+
this._renderer.removeChild(this._loader.parentElement, this._mask);
|
|
10596
|
+
}
|
|
10567
10597
|
}
|
|
10568
10598
|
setPosition() {
|
|
10569
10599
|
const position = this._element.getBoundingClientRect();
|
|
@@ -10572,7 +10602,7 @@ class LoaderDirective {
|
|
|
10572
10602
|
}
|
|
10573
10603
|
}
|
|
10574
10604
|
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 });
|
|
10575
|
-
LoaderDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "12.0.0", version: "13.0.1", type: LoaderDirective, selector: "[tetaLoader]", inputs: { appendToBody: "appendToBody", tetaLoader: "tetaLoader" }, ngImport: i0 });
|
|
10605
|
+
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 });
|
|
10576
10606
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: LoaderDirective, decorators: [{
|
|
10577
10607
|
type: Directive,
|
|
10578
10608
|
args: [{
|
|
@@ -10583,6 +10613,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImpor
|
|
|
10583
10613
|
args: [DOCUMENT]
|
|
10584
10614
|
}] }]; }, propDecorators: { appendToBody: [{
|
|
10585
10615
|
type: Input
|
|
10616
|
+
}], mask: [{
|
|
10617
|
+
type: Input
|
|
10586
10618
|
}], tetaLoader: [{
|
|
10587
10619
|
type: Input
|
|
10588
10620
|
}] } });
|