@tetacom/ng-components 1.0.30 → 1.0.34
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/chart-3d/chart3d/chart3d.component.d.ts +1 -0
- package/component/chart-3d/model/chart-3d-options.d.ts +1 -0
- 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/chart-3d/chart3d/chart3d.component.mjs +64 -57
- package/esm2020/component/chart-3d/model/chart-3d-options.mjs +1 -1
- 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 +113 -73
- package/fesm2015/tetacom-ng-components.mjs.map +1 -1
- package/fesm2020/tetacom-ng-components.mjs +108 -69
- package/fesm2020/tetacom-ng-components.mjs.map +1 -1
- package/package.json +1 -1
- package/style/loader.scss +10 -0
|
@@ -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: [{
|
|
@@ -9948,7 +9967,8 @@ class Chart3dComponent {
|
|
|
9948
9967
|
ngOnInit() {
|
|
9949
9968
|
this._themeService.theme
|
|
9950
9969
|
.pipe(takeWhile((_) => this._alive), tap((_) => {
|
|
9951
|
-
this.gridColor = _ ? '#
|
|
9970
|
+
this.gridColor = _ ? '#5d6a73' : '#bdbdc6';
|
|
9971
|
+
this.axesColor = _ ? '#8e8f9d' : '#7d8f9a';
|
|
9952
9972
|
this.init();
|
|
9953
9973
|
}))
|
|
9954
9974
|
.subscribe();
|
|
@@ -9957,6 +9977,7 @@ class Chart3dComponent {
|
|
|
9957
9977
|
this.addResizeObserver();
|
|
9958
9978
|
this.createScene();
|
|
9959
9979
|
this.startRenderingLoop();
|
|
9980
|
+
this.init();
|
|
9960
9981
|
}
|
|
9961
9982
|
ngOnDestroy() {
|
|
9962
9983
|
this._alive = false;
|
|
@@ -9970,37 +9991,51 @@ class Chart3dComponent {
|
|
|
9970
9991
|
}
|
|
9971
9992
|
const { x, y, z } = this.getScales(this._config.series);
|
|
9972
9993
|
this.config.series.forEach((data, idx) => {
|
|
9973
|
-
|
|
9994
|
+
if (!data.points?.length) {
|
|
9995
|
+
return;
|
|
9996
|
+
}
|
|
9997
|
+
const points = data.points.map((_) => new THREE.Vector3(x(_.x), y(_.y), z(_.z)));
|
|
9974
9998
|
const color = d3.scaleOrdinal(d3.schemeTableau10);
|
|
9975
9999
|
const material = new THREE.LineBasicMaterial({
|
|
9976
10000
|
color: data?.color ?? color(idx.toString()),
|
|
9977
10001
|
});
|
|
9978
|
-
const
|
|
9979
|
-
|
|
9980
|
-
|
|
9981
|
-
|
|
10002
|
+
const tubeGeometry = new THREE.TubeGeometry(new THREE.CatmullRomCurve3(points), 1024, 0.5, 20, false);
|
|
10003
|
+
let tube = new THREE.Line(tubeGeometry, material);
|
|
10004
|
+
this._scene.add(tube);
|
|
10005
|
+
});
|
|
10006
|
+
const circles = x.ticks(this.SIDE_SIZE / 10);
|
|
10007
|
+
const material = new THREE.LineBasicMaterial({ color: this.axesColor });
|
|
10008
|
+
const pointsLines = [];
|
|
10009
|
+
pointsLines.push(new THREE.Vector3(0, 0, 0));
|
|
10010
|
+
pointsLines.push(new THREE.Vector3(0, 0, z(-z.domain()[1])));
|
|
10011
|
+
pointsLines.push(new THREE.Vector3(0, 0, 0));
|
|
10012
|
+
pointsLines.push(new THREE.Vector3(x(-x.domain()[1]), 0, 0));
|
|
10013
|
+
const geometryLines = new THREE.BufferGeometry().setFromPoints(pointsLines);
|
|
10014
|
+
const line = new THREE.Line(geometryLines, material);
|
|
10015
|
+
this._scene.add(line);
|
|
10016
|
+
circles.forEach((r) => {
|
|
10017
|
+
const material = new THREE.LineDashedMaterial({
|
|
10018
|
+
color: this.gridColor,
|
|
10019
|
+
dashSize: 1,
|
|
10020
|
+
gapSize: 3
|
|
10021
|
+
});
|
|
10022
|
+
const circleGeometry = new THREE.BufferGeometry().setFromPoints(new THREE.Path().absarc(0, 0, x(r), 0, Math.PI * 2, false).getSpacedPoints(100));
|
|
10023
|
+
const circle = new THREE.LineSegments(circleGeometry, material);
|
|
10024
|
+
circle.geometry.rotateX(-Math.PI / 2);
|
|
10025
|
+
this._scene.add(circle);
|
|
9982
10026
|
});
|
|
9983
|
-
const plane = new THREE.GridHelper(this.SIDE_SIZE, this.SIDE_SIZE / 10, this.gridColor, this.gridColor);
|
|
9984
|
-
plane.position.set(this.SIDE_SIZE / 2, 0, this.SIDE_SIZE / 2);
|
|
9985
|
-
this._scene.add(plane);
|
|
9986
|
-
const gridX = new THREE.GridHelper(this.SIDE_SIZE, this.SIDE_SIZE / 10, this.gridColor, this.gridColor);
|
|
9987
|
-
gridX.geometry.rotateX(-Math.PI / 2);
|
|
9988
|
-
gridX.position.set(this.SIDE_SIZE / 2, this.SIDE_SIZE / 2, 0);
|
|
9989
|
-
this._scene.add(gridX);
|
|
9990
|
-
const gridY = new THREE.GridHelper(this.SIDE_SIZE, this.SIDE_SIZE / 10, this.gridColor, this.gridColor);
|
|
9991
|
-
gridY.geometry.rotateZ(Math.PI / 2);
|
|
9992
|
-
gridY.position.set(0, this.SIDE_SIZE / 2, this.SIDE_SIZE / 2);
|
|
9993
|
-
this._scene.add(gridY);
|
|
9994
10027
|
this.drawTicks(x, y, z);
|
|
9995
|
-
|
|
9996
|
-
|
|
9997
|
-
|
|
9998
|
-
|
|
9999
|
-
|
|
10000
|
-
|
|
10001
|
-
|
|
10002
|
-
|
|
10003
|
-
|
|
10028
|
+
if (!this._controls) {
|
|
10029
|
+
this._controls = new OrbitControls(this._camera, this._renderer.domElement);
|
|
10030
|
+
this._controls.enableDamping = true;
|
|
10031
|
+
this._controls.enablePan = true;
|
|
10032
|
+
this._controls.dampingFactor = 0.25;
|
|
10033
|
+
this._controls.screenSpacePanning = true;
|
|
10034
|
+
this._controls.minDistance = 0;
|
|
10035
|
+
this._controls.maxDistance = 10000;
|
|
10036
|
+
this._controls.maxPolarAngle = Math.PI / 2;
|
|
10037
|
+
this._controls.enableZoom = true;
|
|
10038
|
+
}
|
|
10004
10039
|
}
|
|
10005
10040
|
createScene() {
|
|
10006
10041
|
this._scene = new THREE.Scene();
|
|
@@ -10062,7 +10097,7 @@ class Chart3dComponent {
|
|
|
10062
10097
|
map: texture,
|
|
10063
10098
|
});
|
|
10064
10099
|
const sprite = new THREE.Sprite(spriteMaterial);
|
|
10065
|
-
sprite.scale.set(
|
|
10100
|
+
sprite.scale.set(0.4 * fontSize, 0.4 * fontSize, 0.4 * fontSize);
|
|
10066
10101
|
return sprite;
|
|
10067
10102
|
}
|
|
10068
10103
|
drawTicks(x, y, z) {
|
|
@@ -10074,24 +10109,27 @@ class Chart3dComponent {
|
|
|
10074
10109
|
generatedTicks.forEach((_) => {
|
|
10075
10110
|
const sprite = this.makeSprite(_);
|
|
10076
10111
|
if (idx === 0) {
|
|
10077
|
-
sprite.position.set(x(_),
|
|
10112
|
+
sprite.position.set(x(_), y(y.domain()[1]), 0);
|
|
10078
10113
|
}
|
|
10079
10114
|
if (idx === 1) {
|
|
10080
|
-
sprite.position.set(-
|
|
10115
|
+
sprite.position.set(-10, y(_), 0);
|
|
10081
10116
|
}
|
|
10082
10117
|
if (idx === 2) {
|
|
10083
|
-
sprite.position.set(0,
|
|
10118
|
+
sprite.position.set(0, y(y.domain()[1]), z(_));
|
|
10084
10119
|
}
|
|
10085
10120
|
ticks.add(sprite);
|
|
10086
10121
|
});
|
|
10087
10122
|
});
|
|
10088
|
-
const northLabel = this.makeSprite('
|
|
10089
|
-
const westLabel = this.makeSprite('
|
|
10123
|
+
const northLabel = this.makeSprite('X', { fontSize: 28 });
|
|
10124
|
+
const westLabel = this.makeSprite('Y', { fontSize: 28 });
|
|
10090
10125
|
const tvdLabel = this.makeSprite('TVD', { fontSize: 28 });
|
|
10091
|
-
northLabel.position.set(x(
|
|
10092
|
-
westLabel.position.set(0, 0, y(
|
|
10093
|
-
tvdLabel.position.set(0, z(
|
|
10126
|
+
northLabel.position.set(x(x.domain()[1]) + 5, 0, 0);
|
|
10127
|
+
westLabel.position.set(0, 0, y(y.domain()[0]) + 5);
|
|
10128
|
+
tvdLabel.position.set(0, z(z.domain()[1]) + 5, 0);
|
|
10094
10129
|
ticks.add(northLabel, westLabel, tvdLabel);
|
|
10130
|
+
const axesHelper = new THREE.AxesHelper(this.SIDE_SIZE);
|
|
10131
|
+
axesHelper.setColors(this.axesColor, this.axesColor, this.axesColor);
|
|
10132
|
+
this._scene.add(axesHelper);
|
|
10095
10133
|
this._scene.add(ticks);
|
|
10096
10134
|
}
|
|
10097
10135
|
getScales(series) {
|
|
@@ -10108,34 +10146,22 @@ class Chart3dComponent {
|
|
|
10108
10146
|
}, { x: [], y: [], z: [] });
|
|
10109
10147
|
const x = d3
|
|
10110
10148
|
.scaleLinear()
|
|
10111
|
-
.domain([
|
|
10112
|
-
|
|
10113
|
-
this._config?.axes?.max == null
|
|
10114
|
-
? d3.max(flattenExtrems.x)
|
|
10149
|
+
.domain([0, this._config?.axes?.max == null
|
|
10150
|
+
? parseInt(d3.max(flattenExtrems.x))
|
|
10115
10151
|
: this._config.axes.max,
|
|
10116
10152
|
])
|
|
10117
|
-
.range([0, this.SIDE_SIZE])
|
|
10118
|
-
.nice();
|
|
10153
|
+
.range([0, this.SIDE_SIZE]).nice();
|
|
10119
10154
|
const y = d3
|
|
10120
10155
|
.scaleLinear()
|
|
10121
|
-
.domain([
|
|
10122
|
-
|
|
10123
|
-
this._config?.axes?.max == null
|
|
10124
|
-
? d3.max(flattenExtrems.y)
|
|
10125
|
-
: this._config.axes.max,
|
|
10126
|
-
])
|
|
10127
|
-
.range([0, this.SIDE_SIZE])
|
|
10128
|
-
.nice();
|
|
10156
|
+
.domain([0, parseInt(d3.max(flattenExtrems.y), 10)])
|
|
10157
|
+
.range([this.SIDE_SIZE, 0]);
|
|
10129
10158
|
const z = d3
|
|
10130
10159
|
.scaleLinear()
|
|
10131
|
-
.domain([
|
|
10132
|
-
d3.min(flattenExtrems.z),
|
|
10160
|
+
.domain([0,
|
|
10133
10161
|
this._config?.axes?.max == null
|
|
10134
|
-
? d3.max(flattenExtrems.z)
|
|
10135
|
-
: this._config.axes.max
|
|
10136
|
-
|
|
10137
|
-
.range([this.SIDE_SIZE, 0])
|
|
10138
|
-
.nice();
|
|
10162
|
+
? parseInt(d3.max(flattenExtrems.z))
|
|
10163
|
+
: this._config.axes.max])
|
|
10164
|
+
.range([0, this.SIDE_SIZE]).nice();
|
|
10139
10165
|
return { x, y, z };
|
|
10140
10166
|
}
|
|
10141
10167
|
}
|
|
@@ -10533,6 +10559,7 @@ class LoaderDirective {
|
|
|
10533
10559
|
this._renderer = _renderer;
|
|
10534
10560
|
this._document = _document;
|
|
10535
10561
|
this.appendToBody = false;
|
|
10562
|
+
this.mask = false;
|
|
10536
10563
|
this._alive = true;
|
|
10537
10564
|
this._element = this._elementRef.nativeElement;
|
|
10538
10565
|
}
|
|
@@ -10557,6 +10584,13 @@ class LoaderDirective {
|
|
|
10557
10584
|
this._loader = this._renderer.createElement('div');
|
|
10558
10585
|
this._loader.setAttribute('class', 'loader');
|
|
10559
10586
|
}
|
|
10587
|
+
if ((this._mask === null || this._mask === undefined) && this.mask) {
|
|
10588
|
+
this._mask = this._renderer.createElement('div');
|
|
10589
|
+
this._mask.setAttribute('class', 'loader-mask');
|
|
10590
|
+
}
|
|
10591
|
+
if (this.mask) {
|
|
10592
|
+
this._renderer.appendChild(this.appendToBody ? this._document.body : this._element, this._mask);
|
|
10593
|
+
}
|
|
10560
10594
|
this._renderer.appendChild(this.appendToBody ? this._document.body : this._element, this._loader);
|
|
10561
10595
|
this.setPosition();
|
|
10562
10596
|
}
|
|
@@ -10564,6 +10598,9 @@ class LoaderDirective {
|
|
|
10564
10598
|
if (this._loader && this._loader.parentElement) {
|
|
10565
10599
|
this._renderer.removeChild(this._loader.parentElement, this._loader);
|
|
10566
10600
|
}
|
|
10601
|
+
if (this._mask && this._mask.parentElement) {
|
|
10602
|
+
this._renderer.removeChild(this._loader.parentElement, this._mask);
|
|
10603
|
+
}
|
|
10567
10604
|
}
|
|
10568
10605
|
setPosition() {
|
|
10569
10606
|
const position = this._element.getBoundingClientRect();
|
|
@@ -10572,7 +10609,7 @@ class LoaderDirective {
|
|
|
10572
10609
|
}
|
|
10573
10610
|
}
|
|
10574
10611
|
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 });
|
|
10612
|
+
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
10613
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImport: i0, type: LoaderDirective, decorators: [{
|
|
10577
10614
|
type: Directive,
|
|
10578
10615
|
args: [{
|
|
@@ -10583,6 +10620,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "13.0.1", ngImpor
|
|
|
10583
10620
|
args: [DOCUMENT]
|
|
10584
10621
|
}] }]; }, propDecorators: { appendToBody: [{
|
|
10585
10622
|
type: Input
|
|
10623
|
+
}], mask: [{
|
|
10624
|
+
type: Input
|
|
10586
10625
|
}], tetaLoader: [{
|
|
10587
10626
|
type: Input
|
|
10588
10627
|
}] } });
|